diff --git a/.dss/components/figma-registry.json b/.dss/components/figma-registry.json
new file mode 100644
index 0000000..b3ac502
--- /dev/null
+++ b/.dss/components/figma-registry.json
@@ -0,0 +1,24828 @@
+{
+  "file_name": "Obra shadcn/ui (uikit)",
+  "extracted_at": "2025-12-10T21:03:03.427362",
+  "component_count": 74,
+  "components": {
+    "Button": {
+      "id": "9:1071",
+      "name": "Button",
+      "key": "bce63fbd74024fe645b5511cec90cb5b1446d393",
+      "description": "",
+      "variants": [
+        {
+          "id": "11:818",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "9:1070",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "9:1068",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "9:1067",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14838",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:15318",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19872",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1064",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14830",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:15310",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19864",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:14862",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:15342",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19848",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:14854",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:15334",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19856",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133771",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133803",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:133819",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133787",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:14846",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:15326",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19880",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1059",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:15638",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:16769",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19552",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1065",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:15630",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:16761",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19544",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1061",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:15662",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:16793",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19528",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "11:826",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:15654",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:16785",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19536",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133835",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133867",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:133883",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133851",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1060",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:15646",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:16777",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:19560",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1062",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14198",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:14518",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:17145",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1063",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14190",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:14510",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:17137",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1069",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14222",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:14542",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:17121",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "11:834",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14214",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:14534",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:17129",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133899",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133931",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:133947",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133915",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "9:1066",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:14206",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:14526",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:17153",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "133:14163",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:13558",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:13878",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:20192",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "133:14155",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:13550",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:13870",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:20184",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "133:14187",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:13582",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:13902",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:20168",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "133:14179",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:13574",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:13894",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:20176",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133963",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133995",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:134011",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133979",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "133:14171",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "153:13566",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:13886",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:20200",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98677",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98693",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98701",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98685",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98549",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98565",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98573",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98557",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98421",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98437",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98445",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98429",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98293",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98309",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98317",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98301",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133779",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133811",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:133827",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133795",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98165",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98181",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98189",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98173",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98709",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98725",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98733",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98717",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98581",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98597",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98605",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98589",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98453",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98469",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98477",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98461",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98325",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98341",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98349",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98333",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133843",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133875",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:133891",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133859",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98197",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98213",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98221",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98205",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98741",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98757",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98765",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98749",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98613",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98629",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98637",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98621",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98485",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98501",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98509",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98493",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98357",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98373",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98381",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98365",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133907",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:133939",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:133955",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133923",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98229",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98245",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98253",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98237",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98773",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98789",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98797",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98781",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98645",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98661",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98669",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98653",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98517",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98533",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98541",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98525",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98389",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98405",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98413",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98397",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:133971",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:134003",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:134019",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:133987",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "756:98261",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:98277",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "756:98285",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:98269",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Variant": [
+          "Destructive",
+          "Ghost",
+          "Ghost Muted",
+          "Outline",
+          "Primary",
+          "Secondary"
+        ],
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus",
+          "Hover & Active"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Variant": {
+          "values": [
+            "Destructive",
+            "Ghost",
+            "Ghost Muted",
+            "Outline",
+            "Primary",
+            "Secondary"
+          ],
+          "type": "select",
+          "default": "Destructive"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus",
+            "Hover & Active"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Accordion Trigger": {
+      "id": "66:5034",
+      "name": "Accordion Trigger",
+      "key": "c022afca047316355c6c8f8f072bcf27ae807b72",
+      "description": "",
+      "variants": [
+        {
+          "id": "66:5032",
+          "name": "State=Open",
+          "props": {
+            "State": "Open"
+          }
+        },
+        {
+          "id": "66:5033",
+          "name": "State=Closed",
+          "props": {
+            "State": "Closed"
+          }
+        },
+        {
+          "id": "66:5035",
+          "name": "State=Focus",
+          "props": {
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Closed",
+          "Focus",
+          "Open"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Closed",
+            "Focus",
+            "Open"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Alert": {
+      "id": "58:5416",
+      "name": "Alert",
+      "key": "9360c01084cec1d1f9d6e1cea81a9086f40c5e06",
+      "description": "",
+      "variants": [
+        {
+          "id": "58:5414",
+          "name": "Type=Neutral, Flip Icon=False",
+          "props": {
+            "Type": "Neutral",
+            "Flip Icon": "False"
+          }
+        },
+        {
+          "id": "58:5415",
+          "name": "Type=Error, Flip Icon=False",
+          "props": {
+            "Type": "Error",
+            "Flip Icon": "False"
+          }
+        },
+        {
+          "id": "61:9637",
+          "name": "Type=Neutral, Flip Icon=True",
+          "props": {
+            "Type": "Neutral",
+            "Flip Icon": "True"
+          }
+        },
+        {
+          "id": "61:9651",
+          "name": "Type=Error, Flip Icon=True",
+          "props": {
+            "Type": "Error",
+            "Flip Icon": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Error",
+          "Neutral"
+        ],
+        "Flip Icon": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Error",
+            "Neutral"
+          ],
+          "type": "select",
+          "default": "Error"
+        },
+        "Flip Icon": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Alert Dialog": {
+      "id": "139:11941",
+      "name": "Alert Dialog",
+      "key": "67f514b01ca7185895c37ac4cfc5f2f6c059d7b1",
+      "description": "",
+      "variants": [
+        {
+          "id": "139:11939",
+          "name": "Type=Mobile",
+          "props": {
+            "Type": "Mobile"
+          }
+        },
+        {
+          "id": "139:11940",
+          "name": "Type=Desktop",
+          "props": {
+            "Type": "Desktop"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Desktop",
+          "Mobile"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Desktop",
+            "Mobile"
+          ],
+          "type": "select",
+          "default": "Desktop"
+        }
+      },
+      "states": {}
+    },
+    "Avatar": {
+      "id": "18:1398",
+      "name": "Avatar",
+      "key": "d3ae7dd8c38a45b161d12b3fc5b3da47be8eacdf",
+      "description": "",
+      "variants": [
+        {
+          "id": "18:1361",
+          "name": "Picture=Off, Size=Regular, Roundness Type=Round",
+          "props": {
+            "Picture": "Off",
+            "Size": "Regular",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "18:1397",
+          "name": "Picture=On, Size=Regular, Roundness Type=Round",
+          "props": {
+            "Picture": "On",
+            "Size": "Regular",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "22:9413",
+          "name": "Picture=Off, Size=Small, Roundness Type=Round",
+          "props": {
+            "Picture": "Off",
+            "Size": "Small",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "761:106480",
+          "name": "Picture=Off, Size=Tiny, Roundness Type=Round",
+          "props": {
+            "Picture": "Off",
+            "Size": "Tiny",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "780:40565",
+          "name": "Picture=Off, Size=Extra Tiny, Roundness Type=Round",
+          "props": {
+            "Picture": "Off",
+            "Size": "Extra Tiny",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "22:9416",
+          "name": "Picture=On, Size=Small, Roundness Type=Round",
+          "props": {
+            "Picture": "On",
+            "Size": "Small",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "761:106483",
+          "name": "Picture=On, Size=Tiny, Roundness Type=Round",
+          "props": {
+            "Picture": "On",
+            "Size": "Tiny",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "780:40571",
+          "name": "Picture=On, Size=Extra Tiny, Roundness Type=Round",
+          "props": {
+            "Picture": "On",
+            "Size": "Extra Tiny",
+            "Roundness Type": "Round"
+          }
+        },
+        {
+          "id": "22:9464",
+          "name": "Picture=Off, Size=Regular, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "Off",
+            "Size": "Regular",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "22:9467",
+          "name": "Picture=On, Size=Regular, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "On",
+            "Size": "Regular",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "22:9448",
+          "name": "Picture=Off, Size=Small, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "Off",
+            "Size": "Small",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "761:106485",
+          "name": "Picture=Off, Size=Tiny, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "Off",
+            "Size": "Tiny",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "780:40568",
+          "name": "Picture=Off, Size=Extra Tiny, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "Off",
+            "Size": "Extra Tiny",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "22:9453",
+          "name": "Picture=On, Size=Small, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "On",
+            "Size": "Small",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "761:106488",
+          "name": "Picture=On, Size=Tiny, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "On",
+            "Size": "Tiny",
+            "Roundness Type": "Roundrect"
+          }
+        },
+        {
+          "id": "780:40573",
+          "name": "Picture=On, Size=Extra Tiny, Roundness Type=Roundrect",
+          "props": {
+            "Picture": "On",
+            "Size": "Extra Tiny",
+            "Roundness Type": "Roundrect"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Picture": [
+          "Off",
+          "On"
+        ],
+        "Size": [
+          "Extra Tiny",
+          "Regular",
+          "Small",
+          "Tiny"
+        ],
+        "Roundness Type": [
+          "Round",
+          "Roundrect"
+        ]
+      },
+      "props": {
+        "Picture": {
+          "values": [
+            "Off",
+            "On"
+          ],
+          "type": "select",
+          "default": "Off"
+        },
+        "Size": {
+          "values": [
+            "Extra Tiny",
+            "Regular",
+            "Small",
+            "Tiny"
+          ],
+          "type": "select",
+          "default": "Extra Tiny"
+        },
+        "Roundness Type": {
+          "values": [
+            "Round",
+            "Roundrect"
+          ],
+          "type": "select",
+          "default": "Round"
+        }
+      },
+      "states": {}
+    },
+    "Avatar Stack": {
+      "id": "22:9509",
+      "name": "Avatar Stack",
+      "key": "ef5d2554e7622e0f3a8789b0f6225ff9839b41e1",
+      "description": "",
+      "variants": [
+        {
+          "id": "22:9475",
+          "name": "Size=Small, Type=Default",
+          "props": {
+            "Size": "Small",
+            "Type": "Default"
+          }
+        },
+        {
+          "id": "22:9507",
+          "name": "Size=Regular, Type=Default",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Size": [
+          "Regular",
+          "Small"
+        ],
+        "Type": [
+          "Default"
+        ]
+      },
+      "props": {
+        "Size": {
+          "values": [
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Regular"
+        },
+        "Type": {
+          "values": [
+            "Default"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {}
+    },
+    "Badge": {
+      "id": "19:6979",
+      "name": "Badge",
+      "key": "c39c0ca33155187ac861fa37c2cdf178b0fb5270",
+      "description": "",
+      "variants": [
+        {
+          "id": "19:7020",
+          "name": "Roundness=Default, Variant=Primary, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:121927",
+          "name": "Roundness=Round, Variant=Primary, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "19:7012",
+          "name": "Roundness=Default, Variant=Secondary, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:121935",
+          "name": "Roundness=Round, Variant=Secondary, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "19:7092",
+          "name": "Roundness=Default, Variant=Outline, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:121943",
+          "name": "Roundness=Round, Variant=Outline, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "19:7068",
+          "name": "Roundness=Default, Variant=Ghost, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:121951",
+          "name": "Roundness=Round, Variant=Ghost, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "19:7044",
+          "name": "Roundness=Default, Variant=Destructive, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:121959",
+          "name": "Roundness=Round, Variant=Destructive, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17776",
+          "name": "Roundness=Default, Variant=Primary, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:121967",
+          "name": "Roundness=Round, Variant=Primary, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "162:17768",
+          "name": "Roundness=Default, Variant=Secondary, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:121975",
+          "name": "Roundness=Round, Variant=Secondary, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "162:17752",
+          "name": "Roundness=Default, Variant=Outline, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:121983",
+          "name": "Roundness=Round, Variant=Outline, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "162:17760",
+          "name": "Roundness=Default, Variant=Ghost, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:121991",
+          "name": "Roundness=Round, Variant=Ghost, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "162:17784",
+          "name": "Roundness=Default, Variant=Destructive, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:121999",
+          "name": "Roundness=Round, Variant=Destructive, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Variant": [
+          "Destructive",
+          "Ghost",
+          "Outline",
+          "Primary",
+          "Secondary"
+        ],
+        "State": [
+          "Default",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Variant": {
+          "values": [
+            "Destructive",
+            "Ghost",
+            "Outline",
+            "Primary",
+            "Secondary"
+          ],
+          "type": "select",
+          "default": "Destructive"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Icon Button": {
+      "id": "9:775",
+      "name": "Icon Button",
+      "key": "cc34f9e3fbaaa78b7f958be7df795774e2fd830a",
+      "description": "",
+      "variants": [
+        {
+          "id": "13:1002",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "9:852",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "9:868",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "13:986",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "9:820",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33702",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16892",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33706",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17181",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33710",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17341",
+          "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33714",
+          "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:846",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33718",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16732",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33722",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17501",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33726",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17661",
+          "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33730",
+          "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:994",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33734",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16572",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33738",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17821",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33742",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17981",
+          "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33746",
+          "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "153:18333",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33750",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:13805",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33754",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:18337",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33758",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:18341",
+          "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33762",
+          "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Destructive",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125846",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33766",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:125850",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16880",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125854",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33770",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125858",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17169",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125862",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33774",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125866",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17329",
+          "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125870",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33778",
+          "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125874",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:854",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:125878",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33782",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:125882",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16720",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125886",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33786",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125890",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17489",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125894",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33790",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125898",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17649",
+          "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125902",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33794",
+          "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125906",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125910",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33798",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:125914",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16560",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125918",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33802",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125922",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17809",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125926",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33806",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125930",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17969",
+          "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125934",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33810",
+          "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125938",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "153:18297",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:125942",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33814",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:125946",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:13793",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125950",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33818",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "757:125954",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:18301",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125958",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33822",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:125962",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:18305",
+          "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125966",
+          "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33826",
+          "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:125970",
+          "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Ghost Muted",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33830",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16876",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33834",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17165",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33838",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17325",
+          "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33842",
+          "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:762",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33846",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16716",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33850",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17485",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33854",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17645",
+          "name": "Roundness=Default, Variant=Outline, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33858",
+          "name": "Roundness=Round, Variant=Outline, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33862",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16556",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33866",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17805",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33870",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17965",
+          "name": "Roundness=Default, Variant=Outline, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33874",
+          "name": "Roundness=Round, Variant=Outline, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "153:18285",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33878",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:13789",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33882",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:18289",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33886",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:18293",
+          "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33890",
+          "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Outline",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "9:836",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33894",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16884",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33898",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17173",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33902",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17333",
+          "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33906",
+          "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:850",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33910",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16724",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33914",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17493",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33918",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17653",
+          "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33922",
+          "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:998",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33926",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16564",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33930",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17813",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33934",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17973",
+          "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33938",
+          "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "153:18309",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33942",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:13797",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33946",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:18313",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33950",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:18317",
+          "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33954",
+          "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Secondary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "9:786",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33958",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16888",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33962",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17177",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33966",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17337",
+          "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33970",
+          "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:842",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33974",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16728",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33978",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17497",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33982",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17657",
+          "name": "Roundness=Default, Variant=Primary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:33986",
+          "name": "Roundness=Round, Variant=Primary, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "13:990",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:33990",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:16568",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:33994",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:17817",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:33998",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:17977",
+          "name": "Roundness=Default, Variant=Primary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:34002",
+          "name": "Roundness=Round, Variant=Primary, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "153:18321",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "755:34006",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:13801",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:34010",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "153:18325",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "755:34014",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "153:18329",
+          "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:34018",
+          "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Variant": "Primary",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Variant": [
+          "Destructive",
+          "Ghost",
+          "Ghost Muted",
+          "Outline",
+          "Primary",
+          "Secondary"
+        ],
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus",
+          "Hover & Active"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Variant": {
+          "values": [
+            "Destructive",
+            "Ghost",
+            "Ghost Muted",
+            "Outline",
+            "Primary",
+            "Secondary"
+          ],
+          "type": "select",
+          "default": "Destructive"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus",
+            "Hover & Active"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Button Group": {
+      "id": "784:82792",
+      "name": "Button Group",
+      "key": "8d3c7cbdcfde8549e52bfa15735777c4943941a8",
+      "description": "",
+      "variants": [
+        {
+          "id": "784:83993",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84013",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84033",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104675",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84053",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84073",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84093",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104645",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84113",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84133",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84153",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84173",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84193",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104705",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84213",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104735",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84473",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84493",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84513",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104795",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84533",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84553",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84573",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104765",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84593",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84613",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84633",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84653",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84673",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104825",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84693",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104855",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:84953",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:84973",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:84993",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104665",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85013",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85033",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85053",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104635",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85073",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85093",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85113",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85133",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85153",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104695",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85173",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104725",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85433",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85453",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85473",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104785",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85493",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85513",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85533",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104755",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85553",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85573",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85593",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85613",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85633",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104815",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85653",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104845",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85913",
+          "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85933",
+          "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:85953",
+          "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104655",
+          "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:85973",
+          "name": "Skin=Outlined, Size=Regular, Position=Left, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:85993",
+          "name": "Skin=Outlined, Size=Regular, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86013",
+          "name": "Skin=Outlined, Size=Regular, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104625",
+          "name": "Skin=Outlined, Size=Regular, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:86033",
+          "name": "Skin=Outlined, Size=Regular, Position=Right, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:86053",
+          "name": "Skin=Outlined, Size=Regular, Position=Single, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:86073",
+          "name": "Skin=Outlined, Size=Regular, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86093",
+          "name": "Skin=Outlined, Size=Regular, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86113",
+          "name": "Skin=Outlined, Size=Regular, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104685",
+          "name": "Skin=Outlined, Size=Regular, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:86133",
+          "name": "Skin=Outlined, Size=Regular, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104715",
+          "name": "Skin=Outlined, Size=Regular, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:86393",
+          "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:86413",
+          "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86433",
+          "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104775",
+          "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:86453",
+          "name": "Skin=Ghost, Size=Regular, Position=Left, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:86473",
+          "name": "Skin=Ghost, Size=Regular, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86493",
+          "name": "Skin=Ghost, Size=Regular, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104745",
+          "name": "Skin=Ghost, Size=Regular, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:86513",
+          "name": "Skin=Ghost, Size=Regular, Position=Right, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:86533",
+          "name": "Skin=Ghost, Size=Regular, Position=Single, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:86553",
+          "name": "Skin=Ghost, Size=Regular, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86573",
+          "name": "Skin=Ghost, Size=Regular, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:86593",
+          "name": "Skin=Ghost, Size=Regular, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104805",
+          "name": "Skin=Ghost, Size=Regular, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:86613",
+          "name": "Skin=Ghost, Size=Regular, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:104835",
+          "name": "Skin=Ghost, Size=Regular, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Skin": [
+          "Ghost",
+          "Outlined"
+        ],
+        "Size": [
+          "Large",
+          "Regular",
+          "Small"
+        ],
+        "Position": [
+          "Left",
+          "Middle",
+          "Right",
+          "Single"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus",
+          "Hover"
+        ]
+      },
+      "props": {
+        "Skin": {
+          "values": [
+            "Ghost",
+            "Outlined"
+          ],
+          "type": "select",
+          "default": "Ghost"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        },
+        "Position": {
+          "values": [
+            "Left",
+            "Middle",
+            "Right",
+            "Single"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus",
+            "Hover"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Button Group Icon Button": {
+      "id": "784:87178",
+      "name": "Button Group Icon Button",
+      "key": "ed4bab9146b303d5b16965a0aadb2931c1df23dd",
+      "description": "",
+      "variants": [
+        {
+          "id": "784:87184",
+          "name": "Skin=Outlined, Size=Default, Position=Left, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87194",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87204",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87264",
+          "name": "Skin=Outlined, Size=Default, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279862",
+          "name": "Skin=Outlined, Size=Default, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87274",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279867",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87284",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279872",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87344",
+          "name": "Skin=Outlined, Size=Default, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87354",
+          "name": "Skin=Outlined, Size=Large, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87364",
+          "name": "Skin=Outlined, Size=Small, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87424",
+          "name": "Skin=Outlined, Size=Default, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87434",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87444",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87504",
+          "name": "Skin=Outlined, Size=Default, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279877",
+          "name": "Skin=Outlined, Size=Default, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87514",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279882",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87524",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279887",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87584",
+          "name": "Skin=Outlined, Size=Default, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87594",
+          "name": "Skin=Outlined, Size=Large, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87604",
+          "name": "Skin=Outlined, Size=Small, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87664",
+          "name": "Skin=Outlined, Size=Default, Position=Right, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87674",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87684",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87744",
+          "name": "Skin=Outlined, Size=Default, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279892",
+          "name": "Skin=Outlined, Size=Default, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87754",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279897",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87764",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279902",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87824",
+          "name": "Skin=Outlined, Size=Default, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87834",
+          "name": "Skin=Outlined, Size=Large, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87844",
+          "name": "Skin=Outlined, Size=Small, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:87904",
+          "name": "Skin=Outlined, Size=Default, Position=Single, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87914",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87924",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Default",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:87984",
+          "name": "Skin=Outlined, Size=Default, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279907",
+          "name": "Skin=Outlined, Size=Default, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:87994",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279912",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88004",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279917",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88064",
+          "name": "Skin=Outlined, Size=Default, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88074",
+          "name": "Skin=Outlined, Size=Large, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88084",
+          "name": "Skin=Outlined, Size=Small, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88144",
+          "name": "Skin=Ghost, Size=Default, Position=Left, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88154",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88164",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88224",
+          "name": "Skin=Ghost, Size=Default, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279922",
+          "name": "Skin=Ghost, Size=Default, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88234",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279927",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88244",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279932",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88304",
+          "name": "Skin=Ghost, Size=Default, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88314",
+          "name": "Skin=Ghost, Size=Large, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88324",
+          "name": "Skin=Ghost, Size=Small, Position=Left, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88384",
+          "name": "Skin=Ghost, Size=Default, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88394",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88404",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88464",
+          "name": "Skin=Ghost, Size=Default, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279937",
+          "name": "Skin=Ghost, Size=Default, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88474",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279942",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88484",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279947",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88544",
+          "name": "Skin=Ghost, Size=Default, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88554",
+          "name": "Skin=Ghost, Size=Large, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88564",
+          "name": "Skin=Ghost, Size=Small, Position=Middle, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88624",
+          "name": "Skin=Ghost, Size=Default, Position=Right, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88634",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88644",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88704",
+          "name": "Skin=Ghost, Size=Default, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279952",
+          "name": "Skin=Ghost, Size=Default, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88714",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279957",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88724",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279962",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88784",
+          "name": "Skin=Ghost, Size=Default, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88794",
+          "name": "Skin=Ghost, Size=Large, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88804",
+          "name": "Skin=Ghost, Size=Small, Position=Right, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:88864",
+          "name": "Skin=Ghost, Size=Default, Position=Single, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88874",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88884",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Default",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "784:88944",
+          "name": "Skin=Ghost, Size=Default, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279967",
+          "name": "Skin=Ghost, Size=Default, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88954",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279972",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:88964",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Disabled",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "788:279977",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Hover",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "784:89024",
+          "name": "Skin=Ghost, Size=Default, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:89034",
+          "name": "Skin=Ghost, Size=Large, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "784:89044",
+          "name": "Skin=Ghost, Size=Small, Position=Single, State=Focus",
+          "props": {
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Skin": [
+          "Ghost",
+          "Outlined"
+        ],
+        "Size": [
+          "Default",
+          "Large",
+          "Small"
+        ],
+        "Position": [
+          "Left",
+          "Middle",
+          "Right",
+          "Single"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus",
+          "Hover"
+        ]
+      },
+      "props": {
+        "Skin": {
+          "values": [
+            "Ghost",
+            "Outlined"
+          ],
+          "type": "select",
+          "default": "Ghost"
+        },
+        "Size": {
+          "values": [
+            "Default",
+            "Large",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Position": {
+          "values": [
+            "Left",
+            "Middle",
+            "Right",
+            "Single"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus",
+            "Hover"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Card": {
+      "id": "179:29234",
+      "name": "Card",
+      "key": "0296f7b7fb9dd115e6e2b35f605e3043813a1c1e",
+      "description": "",
+      "variants": [
+        {
+          "id": "55:4701",
+          "name": "Slot No.=1 Slot",
+          "props": {
+            "Slot No.": "1 Slot"
+          }
+        },
+        {
+          "id": "179:29232",
+          "name": "Slot No.=2 Slots",
+          "props": {
+            "Slot No.": "2 Slots"
+          }
+        },
+        {
+          "id": "179:29233",
+          "name": "Slot No.=3 Slots",
+          "props": {
+            "Slot No.": "3 Slots"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Slot No.": [
+          "1 Slot",
+          "2 Slots",
+          "3 Slots"
+        ]
+      },
+      "props": {
+        "Slot No.": {
+          "values": [
+            "1 Slot",
+            "2 Slots",
+            "3 Slots"
+          ],
+          "type": "select",
+          "default": "1 Slot"
+        }
+      },
+      "states": {}
+    },
+    "Vertical Field": {
+      "id": "120:13754",
+      "name": "Vertical Field",
+      "key": "66ab348c30343cd7b20e399e00859aa26135139a",
+      "description": "",
+      "variants": [
+        {
+          "id": "120:13758",
+          "name": "Type=Text Value",
+          "props": {
+            "Type": "Text Value"
+          }
+        },
+        {
+          "id": "120:13755",
+          "name": "Type=Select",
+          "props": {
+            "Type": "Select"
+          }
+        },
+        {
+          "id": "120:13761",
+          "name": "Type=Textarea",
+          "props": {
+            "Type": "Textarea"
+          }
+        },
+        {
+          "id": "157:11601",
+          "name": "Type=Slider",
+          "props": {
+            "Type": "Slider"
+          }
+        },
+        {
+          "id": "120:13764",
+          "name": "Type=Radio",
+          "props": {
+            "Type": "Radio"
+          }
+        },
+        {
+          "id": "120:13769",
+          "name": "Type=Checkbox",
+          "props": {
+            "Type": "Checkbox"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Checkbox",
+          "Radio",
+          "Select",
+          "Slider",
+          "Text Value",
+          "Textarea"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Checkbox",
+            "Radio",
+            "Select",
+            "Slider",
+            "Text Value",
+            "Textarea"
+          ],
+          "type": "select",
+          "default": "Checkbox"
+        }
+      },
+      "states": {}
+    },
+    "Label": {
+      "id": "103:9453",
+      "name": "Label",
+      "key": "c167b971890395c6d899cced59ef5f62b2f83f04",
+      "description": "",
+      "variants": [
+        {
+          "id": "16:1663",
+          "name": "Layout=Block",
+          "props": {
+            "Layout": "Block"
+          }
+        },
+        {
+          "id": "103:9452",
+          "name": "Layout=Inline",
+          "props": {
+            "Layout": "Inline"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Layout": [
+          "Block",
+          "Inline"
+        ]
+      },
+      "props": {
+        "Layout": {
+          "values": [
+            "Block",
+            "Inline"
+          ],
+          "type": "select",
+          "default": "Block"
+        }
+      },
+      "states": {}
+    },
+    "Input": {
+      "id": "16:1738",
+      "name": "Input",
+      "key": "735cd57150a03dcbec6a9a201b56f7fc5b0ddaec",
+      "description": "",
+      "variants": [
+        {
+          "id": "16:1737",
+          "name": "Roundness=Default, Size=Regular, State=Placeholder",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "19:2026",
+          "name": "Roundness=Default, Size=Regular, State=Empty",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "19:1306",
+          "name": "Roundness=Default, Size=Small, State=Placeholder",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "19:2030",
+          "name": "Roundness=Default, Size=Small, State=Empty",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "19:1308",
+          "name": "Roundness=Default, Size=Small, State=Value",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:11553",
+          "name": "Roundness=Default, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "16:1736",
+          "name": "Roundness=Default, Size=Regular, State=Value",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "755:41584",
+          "name": "Roundness=Round, Size=Regular, State=Empty",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "19:2028",
+          "name": "Roundness=Default, Size=Large, State=Empty",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "755:41471",
+          "name": "Roundness=Round, Size=Large, State=Empty",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "755:41496",
+          "name": "Roundness=Round, Size=Small, State=Empty",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "225:38675",
+          "name": "Roundness=Default, Size=Mini, State=Empty",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "755:41623",
+          "name": "Roundness=Round, Size=Mini, State=Empty",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "755:41542",
+          "name": "Roundness=Round, Size=Regular, State=Placeholder",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "19:1286",
+          "name": "Roundness=Default, Size=Large, State=Placeholder",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "755:41482",
+          "name": "Roundness=Round, Size=Large, State=Placeholder",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "755:41514",
+          "name": "Roundness=Round, Size=Small, State=Placeholder",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "225:38633",
+          "name": "Roundness=Default, Size=Mini, State=Placeholder",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "755:41549",
+          "name": "Roundness=Round, Size=Mini, State=Placeholder",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "755:41528",
+          "name": "Roundness=Round, Size=Regular, State=Value",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "19:1288",
+          "name": "Roundness=Default, Size=Large, State=Value",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "755:41535",
+          "name": "Roundness=Round, Size=Large, State=Value",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "755:41556",
+          "name": "Roundness=Round, Size=Small, State=Value",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "225:38640",
+          "name": "Roundness=Default, Size=Mini, State=Value",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "755:41570",
+          "name": "Roundness=Round, Size=Mini, State=Value",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:11539",
+          "name": "Roundness=Default, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:41563",
+          "name": "Roundness=Round, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:11546",
+          "name": "Roundness=Default, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:41507",
+          "name": "Roundness=Round, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:41489",
+          "name": "Roundness=Round, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "225:38647",
+          "name": "Roundness=Default, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "755:41609",
+          "name": "Roundness=Round, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "16:1735",
+          "name": "Roundness=Default, Size=Regular, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "755:41500",
+          "name": "Roundness=Round, Size=Regular, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "19:1292",
+          "name": "Roundness=Default, Size=Large, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "755:41521",
+          "name": "Roundness=Round, Size=Large, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "19:1312",
+          "name": "Roundness=Default, Size=Small, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "755:41595",
+          "name": "Roundness=Round, Size=Small, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "225:38661",
+          "name": "Roundness=Default, Size=Mini, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "755:41577",
+          "name": "Roundness=Round, Size=Mini, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "16:1733",
+          "name": "Roundness=Default, Size=Regular, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "755:41588",
+          "name": "Roundness=Round, Size=Regular, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "19:1294",
+          "name": "Roundness=Default, Size=Large, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "755:41616",
+          "name": "Roundness=Round, Size=Large, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "19:1314",
+          "name": "Roundness=Default, Size=Small, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "755:41641",
+          "name": "Roundness=Round, Size=Small, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "225:38668",
+          "name": "Roundness=Default, Size=Mini, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "755:41627",
+          "name": "Roundness=Round, Size=Mini, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "16:1734",
+          "name": "Roundness=Default, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:41634",
+          "name": "Roundness=Round, Size=Regular, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "19:1290",
+          "name": "Roundness=Default, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:41648",
+          "name": "Roundness=Round, Size=Large, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "19:1310",
+          "name": "Roundness=Default, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:41602",
+          "name": "Roundness=Round, Size=Small, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "225:38654",
+          "name": "Roundness=Default, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "755:41475",
+          "name": "Roundness=Round, Size=Mini, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "State": [
+          "Disabled",
+          "Empty",
+          "Error",
+          "Error Focus",
+          "Focus",
+          "Placeholder",
+          "Value"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Disabled",
+            "Empty",
+            "Error",
+            "Error Focus",
+            "Focus",
+            "Placeholder",
+            "Value"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    ".Select Left Decoration": {
+      "id": "18:1373",
+      "name": ".Select Left Decoration",
+      "key": "777cd46e93904f03a699b7dad2a35d91972ad3de",
+      "description": "",
+      "variants": [
+        {
+          "id": "18:1290",
+          "name": "Type=Icon, Size=Default",
+          "props": {
+            "Type": "Icon",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "65:5081",
+          "name": "Type=Text, Size=Default",
+          "props": {
+            "Type": "Text",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "18:1295",
+          "name": "Type=Avatar, Size=Default",
+          "props": {
+            "Type": "Avatar",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "22:9609",
+          "name": "Type=Checkbox, Size=Default",
+          "props": {
+            "Type": "Checkbox",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "68:17645",
+          "name": "Type=Text Muted, Size=Default",
+          "props": {
+            "Type": "Text Muted",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "65:5258",
+          "name": "Type=Radio, Size=Default",
+          "props": {
+            "Type": "Radio",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "176:41612",
+          "name": "Type=Deco Icon Primary, Size=Default",
+          "props": {
+            "Type": "Deco Icon Primary",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "176:41638",
+          "name": "Type=Deco Icon Outline, Size=Default",
+          "props": {
+            "Type": "Deco Icon Outline",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "66:5932",
+          "name": "Type=Blank, Size=Default",
+          "props": {
+            "Type": "Blank",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "176:26454",
+          "name": "Type=Icon, Size=Large",
+          "props": {
+            "Type": "Icon",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26460",
+          "name": "Type=Avatar, Size=Large",
+          "props": {
+            "Type": "Avatar",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26462",
+          "name": "Type=Checkbox, Size=Large",
+          "props": {
+            "Type": "Checkbox",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26464",
+          "name": "Type=Text, Size=Large",
+          "props": {
+            "Type": "Text",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26466",
+          "name": "Type=Text Muted, Size=Large",
+          "props": {
+            "Type": "Text Muted",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26469",
+          "name": "Type=Radio, Size=Large",
+          "props": {
+            "Type": "Radio",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26238",
+          "name": "Type=Deco Icon Primary, Size=Large",
+          "props": {
+            "Type": "Deco Icon Primary",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26271",
+          "name": "Type=Deco Icon Outline, Size=Large",
+          "props": {
+            "Type": "Deco Icon Outline",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "176:26468",
+          "name": "Type=Blank, Size=Large",
+          "props": {
+            "Type": "Blank",
+            "Size": "Large"
+          }
+        },
+        {
+          "id": "833:105568",
+          "name": "Type=Icon muted, Size=Default",
+          "props": {
+            "Type": "Icon muted",
+            "Size": "Default"
+          }
+        },
+        {
+          "id": "833:105573",
+          "name": "Type=Icon muted, Size=Large",
+          "props": {
+            "Type": "Icon muted",
+            "Size": "Large"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Avatar",
+          "Blank",
+          "Checkbox",
+          "Deco Icon Outline",
+          "Deco Icon Primary",
+          "Icon",
+          "Icon muted",
+          "Radio",
+          "Text",
+          "Text Muted"
+        ],
+        "Size": [
+          "Default",
+          "Large"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Avatar",
+            "Blank",
+            "Checkbox",
+            "Deco Icon Outline",
+            "Deco Icon Primary",
+            "Icon",
+            "Icon muted",
+            "Radio",
+            "Text",
+            "Text Muted"
+          ],
+          "type": "select",
+          "default": "Avatar"
+        },
+        "Size": {
+          "values": [
+            "Default",
+            "Large"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {}
+    },
+    "Select & Combobox": {
+      "id": "16:1732",
+      "name": "Select & Combobox",
+      "key": "68b25012d80b641694f739976d70845bced844e2",
+      "description": "",
+      "variants": [
+        {
+          "id": "16:1730",
+          "name": "Size=Regular, State=Default, Lines=1 Line",
+          "props": {
+            "Size": "Regular",
+            "State": "Default",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1574",
+          "name": "Size=Small, State=Default, Lines=1 Line",
+          "props": {
+            "Size": "Small",
+            "State": "Default",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "673:37063",
+          "name": "Size=Regular, State=Placeholder, Lines=1 Line",
+          "props": {
+            "Size": "Regular",
+            "State": "Placeholder",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1478",
+          "name": "Size=Large, State=Default, Lines=1 Line",
+          "props": {
+            "Size": "Large",
+            "State": "Default",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "673:37069",
+          "name": "Size=Large, State=Placeholder, Lines=1 Line",
+          "props": {
+            "Size": "Large",
+            "State": "Placeholder",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "673:37075",
+          "name": "Size=Small, State=Placeholder, Lines=1 Line",
+          "props": {
+            "Size": "Small",
+            "State": "Placeholder",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "281:105885",
+          "name": "Size=Mini, State=Default, Lines=1 Line",
+          "props": {
+            "Size": "Mini",
+            "State": "Default",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "673:37081",
+          "name": "Size=Mini, State=Placeholder, Lines=1 Line",
+          "props": {
+            "Size": "Mini",
+            "State": "Placeholder",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "16:1731",
+          "name": "Size=Regular, State=Focus, Lines=1 Line",
+          "props": {
+            "Size": "Regular",
+            "State": "Focus",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1484",
+          "name": "Size=Large, State=Focus, Lines=1 Line",
+          "props": {
+            "Size": "Large",
+            "State": "Focus",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1580",
+          "name": "Size=Small, State=Focus, Lines=1 Line",
+          "props": {
+            "Size": "Small",
+            "State": "Focus",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "281:105906",
+          "name": "Size=Mini, State=Focus, Lines=1 Line",
+          "props": {
+            "Size": "Mini",
+            "State": "Focus",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "18:980",
+          "name": "Size=Regular, State=Error, Lines=1 Line",
+          "props": {
+            "Size": "Regular",
+            "State": "Error",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1490",
+          "name": "Size=Large, State=Error, Lines=1 Line",
+          "props": {
+            "Size": "Large",
+            "State": "Error",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1586",
+          "name": "Size=Small, State=Error, Lines=1 Line",
+          "props": {
+            "Size": "Small",
+            "State": "Error",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "281:105927",
+          "name": "Size=Mini, State=Error, Lines=1 Line",
+          "props": {
+            "Size": "Mini",
+            "State": "Error",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "18:976",
+          "name": "Size=Regular, State=Disabled, Lines=1 Line",
+          "props": {
+            "Size": "Regular",
+            "State": "Disabled",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1496",
+          "name": "Size=Large, State=Disabled, Lines=1 Line",
+          "props": {
+            "Size": "Large",
+            "State": "Disabled",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "19:1592",
+          "name": "Size=Small, State=Disabled, Lines=1 Line",
+          "props": {
+            "Size": "Small",
+            "State": "Disabled",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "281:105948",
+          "name": "Size=Mini, State=Disabled, Lines=1 Line",
+          "props": {
+            "Size": "Mini",
+            "State": "Disabled",
+            "Lines": "1 Line"
+          }
+        },
+        {
+          "id": "68:17940",
+          "name": "Size=Regular, State=Default, Lines=2 Lines",
+          "props": {
+            "Size": "Regular",
+            "State": "Default",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "673:37087",
+          "name": "Size=Regular, State=Placeholder, Lines=2 Lines",
+          "props": {
+            "Size": "Regular",
+            "State": "Placeholder",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17946",
+          "name": "Size=Large, State=Default, Lines=2 Lines",
+          "props": {
+            "Size": "Large",
+            "State": "Default",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "673:37094",
+          "name": "Size=Large, State=Placeholder, Lines=2 Lines",
+          "props": {
+            "Size": "Large",
+            "State": "Placeholder",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17952",
+          "name": "Size=Small, State=Default, Lines=2 Lines",
+          "props": {
+            "Size": "Small",
+            "State": "Default",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "673:37101",
+          "name": "Size=Small, State=Placeholder, Lines=2 Lines",
+          "props": {
+            "Size": "Small",
+            "State": "Placeholder",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "281:105969",
+          "name": "Size=Mini, State=Default, Lines=2 Lines",
+          "props": {
+            "Size": "Mini",
+            "State": "Default",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "673:37108",
+          "name": "Size=Mini, State=Placeholder, Lines=2 Lines",
+          "props": {
+            "Size": "Mini",
+            "State": "Placeholder",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17958",
+          "name": "Size=Regular, State=Focus, Lines=2 Lines",
+          "props": {
+            "Size": "Regular",
+            "State": "Focus",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17964",
+          "name": "Size=Large, State=Focus, Lines=2 Lines",
+          "props": {
+            "Size": "Large",
+            "State": "Focus",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17970",
+          "name": "Size=Small, State=Focus, Lines=2 Lines",
+          "props": {
+            "Size": "Small",
+            "State": "Focus",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "281:105991",
+          "name": "Size=Mini, State=Focus, Lines=2 Lines",
+          "props": {
+            "Size": "Mini",
+            "State": "Focus",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17976",
+          "name": "Size=Regular, State=Error, Lines=2 Lines",
+          "props": {
+            "Size": "Regular",
+            "State": "Error",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17982",
+          "name": "Size=Large, State=Error, Lines=2 Lines",
+          "props": {
+            "Size": "Large",
+            "State": "Error",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17988",
+          "name": "Size=Small, State=Error, Lines=2 Lines",
+          "props": {
+            "Size": "Small",
+            "State": "Error",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "281:106013",
+          "name": "Size=Mini, State=Error, Lines=2 Lines",
+          "props": {
+            "Size": "Mini",
+            "State": "Error",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:17994",
+          "name": "Size=Regular, State=Disabled, Lines=2 Lines",
+          "props": {
+            "Size": "Regular",
+            "State": "Disabled",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:18000",
+          "name": "Size=Large, State=Disabled, Lines=2 Lines",
+          "props": {
+            "Size": "Large",
+            "State": "Disabled",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "68:18006",
+          "name": "Size=Small, State=Disabled, Lines=2 Lines",
+          "props": {
+            "Size": "Small",
+            "State": "Disabled",
+            "Lines": "2 Lines"
+          }
+        },
+        {
+          "id": "281:106035",
+          "name": "Size=Mini, State=Disabled, Lines=2 Lines",
+          "props": {
+            "Size": "Mini",
+            "State": "Disabled",
+            "Lines": "2 Lines"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Error",
+          "Focus",
+          "Placeholder"
+        ],
+        "Lines": [
+          "1 Line",
+          "2 Lines"
+        ]
+      },
+      "props": {
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        },
+        "Lines": {
+          "values": [
+            "1 Line",
+            "2 Lines"
+          ],
+          "type": "select",
+          "default": "1 Line"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Error",
+            "Focus",
+            "Placeholder"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    ".Select & Combobox Right Decoration": {
+      "id": "673:40340",
+      "name": ".Select & Combobox Right Decoration",
+      "key": "1f7d763cf4c5b14cfcd3c35e17ae2c0f0ae44a56",
+      "description": "",
+      "variants": [
+        {
+          "id": "673:40339",
+          "name": "Type=Select",
+          "props": {
+            "Type": "Select"
+          }
+        },
+        {
+          "id": "673:40337",
+          "name": "Type=Combobox",
+          "props": {
+            "Type": "Combobox"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Combobox",
+          "Select"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Combobox",
+            "Select"
+          ],
+          "type": "select",
+          "default": "Combobox"
+        }
+      },
+      "states": {}
+    },
+    "Textarea": {
+      "id": "16:1745",
+      "name": "Textarea",
+      "key": "16768fe924982cb6de27bc08400f41045ebe737b",
+      "description": "",
+      "variants": [
+        {
+          "id": "16:1744",
+          "name": "State=Placeholder, Roundness=Default",
+          "props": {
+            "State": "Placeholder",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "140:11507",
+          "name": "State=Empty, Roundness=Default",
+          "props": {
+            "State": "Empty",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "757:125059",
+          "name": "State=Empty, Roundness=Round",
+          "props": {
+            "State": "Empty",
+            "Roundness": "Round"
+          }
+        },
+        {
+          "id": "757:125061",
+          "name": "State=Placeholder, Roundness=Round",
+          "props": {
+            "State": "Placeholder",
+            "Roundness": "Round"
+          }
+        },
+        {
+          "id": "16:1743",
+          "name": "State=Value, Roundness=Default",
+          "props": {
+            "State": "Value",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "757:125064",
+          "name": "State=Value, Roundness=Round",
+          "props": {
+            "State": "Value",
+            "Roundness": "Round"
+          }
+        },
+        {
+          "id": "140:11514",
+          "name": "State=Focus, Roundness=Default",
+          "props": {
+            "State": "Focus",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "757:125067",
+          "name": "State=Focus, Roundness=Round",
+          "props": {
+            "State": "Focus",
+            "Roundness": "Round"
+          }
+        },
+        {
+          "id": "18:984",
+          "name": "State=Error, Roundness=Default",
+          "props": {
+            "State": "Error",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "757:125070",
+          "name": "State=Error, Roundness=Round",
+          "props": {
+            "State": "Error",
+            "Roundness": "Round"
+          }
+        },
+        {
+          "id": "19:1057",
+          "name": "State=Error Focus, Roundness=Default",
+          "props": {
+            "State": "Error Focus",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "757:125073",
+          "name": "State=Error Focus, Roundness=Round",
+          "props": {
+            "State": "Error Focus",
+            "Roundness": "Round"
+          }
+        },
+        {
+          "id": "19:1060",
+          "name": "State=Disabled, Roundness=Default",
+          "props": {
+            "State": "Disabled",
+            "Roundness": "Default"
+          }
+        },
+        {
+          "id": "757:125076",
+          "name": "State=Disabled, Roundness=Round",
+          "props": {
+            "State": "Disabled",
+            "Roundness": "Round"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Disabled",
+          "Empty",
+          "Error",
+          "Error Focus",
+          "Focus",
+          "Placeholder",
+          "Value"
+        ],
+        "Roundness": [
+          "Default",
+          "Round"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Disabled",
+            "Empty",
+            "Error",
+            "Error Focus",
+            "Focus",
+            "Placeholder",
+            "Value"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Carousel": {
+      "id": "164:18293",
+      "name": "Carousel",
+      "key": "ea99f6370f478f57b6e1b4e32d8b61865da7e6e6",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:18291",
+          "name": "Slides=1 Slide",
+          "props": {
+            "Slides": "1 Slide"
+          }
+        },
+        {
+          "id": "164:18290",
+          "name": "Slides=2 Slides",
+          "props": {
+            "Slides": "2 Slides"
+          }
+        },
+        {
+          "id": "164:18292",
+          "name": "Slides=3 Slides",
+          "props": {
+            "Slides": "3 Slides"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Slides": [
+          "1 Slide",
+          "2 Slides",
+          "3 Slides"
+        ]
+      },
+      "props": {
+        "Slides": {
+          "values": [
+            "1 Slide",
+            "2 Slides",
+            "3 Slides"
+          ],
+          "type": "select",
+          "default": "1 Slide"
+        }
+      },
+      "states": {}
+    },
+    "Carousel with Image": {
+      "id": "164:18350",
+      "name": "Carousel with Image",
+      "key": "c20a64902cebcd8b1295ea6701b1c07a9fd90bae",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:18361",
+          "name": "Type=2 Slides",
+          "props": {
+            "Type": "2 Slides"
+          }
+        },
+        {
+          "id": "164:18369",
+          "name": "Type=1 Slide",
+          "props": {
+            "Type": "1 Slide"
+          }
+        },
+        {
+          "id": "164:18351",
+          "name": "Type=3 Slides",
+          "props": {
+            "Type": "3 Slides"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "1 Slide",
+          "2 Slides",
+          "3 Slides"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "1 Slide",
+            "2 Slides",
+            "3 Slides"
+          ],
+          "type": "select",
+          "default": "1 Slide"
+        }
+      },
+      "states": {}
+    },
+    "Checkbox": {
+      "id": "16:1790",
+      "name": "Checkbox",
+      "key": "3904c6a6aa9a210d69ec330cb5cd98998036230b",
+      "description": "",
+      "variants": [
+        {
+          "id": "280:104398",
+          "name": "Checked?=Indeterminate, State=Disabled",
+          "props": {
+            "Checked?": "Indeterminate",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "16:1791",
+          "name": "Checked?=False, State=Default",
+          "props": {
+            "Checked?": "False",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "16:1789",
+          "name": "Checked?=True, State=Default",
+          "props": {
+            "Checked?": "True",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "147:11599",
+          "name": "Checked?=False, State=Focus",
+          "props": {
+            "Checked?": "False",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "147:11595",
+          "name": "Checked?=True, State=Focus",
+          "props": {
+            "Checked?": "True",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:25079",
+          "name": "Checked?=False, State=Error",
+          "props": {
+            "Checked?": "False",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "176:25089",
+          "name": "Checked?=True, State=Error",
+          "props": {
+            "Checked?": "True",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "176:25101",
+          "name": "Checked?=False, State=Error Focus",
+          "props": {
+            "Checked?": "False",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "176:25103",
+          "name": "Checked?=True, State=Error Focus",
+          "props": {
+            "Checked?": "True",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "16:1907",
+          "name": "Checked?=False, State=Disabled",
+          "props": {
+            "Checked?": "False",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "176:20404",
+          "name": "Checked?=True, State=Disabled",
+          "props": {
+            "Checked?": "True",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "16:1914",
+          "name": "Checked?=Indeterminate, State=Default",
+          "props": {
+            "Checked?": "Indeterminate",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "147:11601",
+          "name": "Checked?=Indeterminate, State=Focus",
+          "props": {
+            "Checked?": "Indeterminate",
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "Indeterminate",
+          "True"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Error",
+          "Error Focus",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "Indeterminate",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Error",
+            "Error Focus",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Checkbox Group": {
+      "id": "19:6040",
+      "name": "Checkbox Group",
+      "key": "4849a4c03af05fb6ef78044a94d454debb788637",
+      "description": "",
+      "variants": [
+        {
+          "id": "103:9438",
+          "name": "Layout=Inline, Checked?=False",
+          "props": {
+            "Layout": "Inline",
+            "Checked?": "False"
+          }
+        },
+        {
+          "id": "103:9432",
+          "name": "Layout=Inline, Checked?=True",
+          "props": {
+            "Layout": "Inline",
+            "Checked?": "True"
+          }
+        },
+        {
+          "id": "280:104486",
+          "name": "Layout=Block, Checked?=False",
+          "props": {
+            "Layout": "Block",
+            "Checked?": "False"
+          }
+        },
+        {
+          "id": "280:104489",
+          "name": "Layout=Block, Checked?=True",
+          "props": {
+            "Layout": "Block",
+            "Checked?": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Layout": [
+          "Block",
+          "Inline"
+        ],
+        "Checked?": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Layout": {
+          "values": [
+            "Block",
+            "Inline"
+          ],
+          "type": "select",
+          "default": "Block"
+        },
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Rich Checkbox Group": {
+      "id": "19:6351",
+      "name": "Rich Checkbox Group",
+      "key": "6772f09b688522783430552972985b047f2ee823",
+      "description": "",
+      "variants": [
+        {
+          "id": "19:6352",
+          "name": "Checked?=False, Flipped=False",
+          "props": {
+            "Checked?": "False",
+            "Flipped": "False"
+          }
+        },
+        {
+          "id": "19:6358",
+          "name": "Checked?=True, Flipped=False",
+          "props": {
+            "Checked?": "True",
+            "Flipped": "False"
+          }
+        },
+        {
+          "id": "761:108811",
+          "name": "Checked?=False, Flipped=True",
+          "props": {
+            "Checked?": "False",
+            "Flipped": "True"
+          }
+        },
+        {
+          "id": "761:108817",
+          "name": "Checked?=True, Flipped=True",
+          "props": {
+            "Checked?": "True",
+            "Flipped": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "True"
+        ],
+        "Flipped": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        },
+        "Flipped": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "select",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Separator": {
+      "id": "164:18670",
+      "name": "Separator",
+      "key": "794032f5d52ded270a31dd4051fe02cdb9f79468",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:18666",
+          "name": "Type=Horizontal",
+          "props": {
+            "Type": "Horizontal"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Horizontal"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Horizontal"
+          ],
+          "type": "select",
+          "default": "Horizontal"
+        }
+      },
+      "states": {}
+    },
+    "Select Menu Group Label": {
+      "id": "80:10189",
+      "name": "Select Menu Group Label",
+      "key": "7449ad1610592b4a7750a07b4bad31f4e581337e",
+      "description": "",
+      "variants": [
+        {
+          "id": "18:998",
+          "name": "Type=Small, Indented?=False",
+          "props": {
+            "Type": "Small",
+            "Indented?": "False"
+          }
+        },
+        {
+          "id": "80:10194",
+          "name": "Type=Regular, Indented?=False",
+          "props": {
+            "Type": "Regular",
+            "Indented?": "False"
+          }
+        },
+        {
+          "id": "80:10188",
+          "name": "Type=Small, Indented?=True",
+          "props": {
+            "Type": "Small",
+            "Indented?": "True"
+          }
+        },
+        {
+          "id": "80:10196",
+          "name": "Type=Regular, Indented?=True",
+          "props": {
+            "Type": "Regular",
+            "Indented?": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Regular",
+          "Small"
+        ],
+        "Indented?": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Regular"
+        },
+        "Indented?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "select",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Command Item": {
+      "id": "66:5600",
+      "name": "Command Item",
+      "key": "c479b92772bbdcfc5f63cdab0d071dad6ca58482",
+      "description": "",
+      "variants": [
+        {
+          "id": "66:5515",
+          "name": "State=Regular",
+          "props": {
+            "State": "Regular"
+          }
+        },
+        {
+          "id": "66:5519",
+          "name": "State=Hover",
+          "props": {
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "66:5596",
+          "name": "State=Active",
+          "props": {
+            "State": "Active"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Active",
+          "Hover",
+          "Regular"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Hover",
+            "Regular"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Menu Item": {
+      "id": "18:1010",
+      "name": "Menu Item",
+      "key": "955900d421e515560a843bebb863cd98a79105f2",
+      "description": "",
+      "variants": [
+        {
+          "id": "18:995",
+          "name": "Size=Regular, Type=Default, State=Default",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "65:4976",
+          "name": "Size=Regular, Type=Default, State=Hover",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "65:5198",
+          "name": "Size=Regular, Type=Default, State=Active",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "176:26563",
+          "name": "Size=Large, Type=Default, State=Default",
+          "props": {
+            "Size": "Large",
+            "Type": "Default",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:26573",
+          "name": "Size=Large, Type=Default, State=Hover",
+          "props": {
+            "Size": "Large",
+            "Type": "Default",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "176:26578",
+          "name": "Size=Large, Type=Default, State=Active",
+          "props": {
+            "Size": "Large",
+            "Type": "Default",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:40776",
+          "name": "Size=Regular, Type=Default, State=Focus",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:40783",
+          "name": "Size=Large, Type=Default, State=Focus",
+          "props": {
+            "Size": "Large",
+            "Type": "Default",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "18:996",
+          "name": "Size=Regular, Type=Default, State=Selected",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "176:26558",
+          "name": "Size=Large, Type=Default, State=Selected",
+          "props": {
+            "Size": "Large",
+            "Type": "Default",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "18:997",
+          "name": "Size=Regular, Type=Default, State=Disabled",
+          "props": {
+            "Size": "Regular",
+            "Type": "Default",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "176:26583",
+          "name": "Size=Large, Type=Default, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Type": "Default",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "68:17850",
+          "name": "Size=Regular, Type=Destructive, State=Default",
+          "props": {
+            "Size": "Regular",
+            "Type": "Destructive",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:34709",
+          "name": "Size=Large, Type=Destructive, State=Default",
+          "props": {
+            "Size": "Large",
+            "Type": "Destructive",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:34684",
+          "name": "Size=Regular, Type=Destructive, State=Hover",
+          "props": {
+            "Size": "Regular",
+            "Type": "Destructive",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "176:26568",
+          "name": "Size=Large, Type=Destructive, State=Hover",
+          "props": {
+            "Size": "Large",
+            "Type": "Destructive",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "288:95489",
+          "name": "Size=Regular, Type=Destructive, State=Active",
+          "props": {
+            "Size": "Regular",
+            "Type": "Destructive",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "288:95496",
+          "name": "Size=Large, Type=Destructive, State=Active",
+          "props": {
+            "Size": "Large",
+            "Type": "Destructive",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "288:95552",
+          "name": "Size=Regular, Type=Destructive, State=Focus",
+          "props": {
+            "Size": "Regular",
+            "Type": "Destructive",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "288:95559",
+          "name": "Size=Large, Type=Destructive, State=Focus",
+          "props": {
+            "Size": "Large",
+            "Type": "Destructive",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "288:95613",
+          "name": "Size=Regular, Type=Destructive, State=Selected",
+          "props": {
+            "Size": "Regular",
+            "Type": "Destructive",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "288:95620",
+          "name": "Size=Large, Type=Destructive, State=Selected",
+          "props": {
+            "Size": "Large",
+            "Type": "Destructive",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "288:95676",
+          "name": "Size=Regular, Type=Destructive, State=Disabled",
+          "props": {
+            "Size": "Regular",
+            "Type": "Destructive",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "288:95683",
+          "name": "Size=Large, Type=Destructive, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Type": "Destructive",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Size": [
+          "Large",
+          "Regular"
+        ],
+        "Type": [
+          "Default",
+          "Destructive"
+        ],
+        "State": [
+          "Active",
+          "Default",
+          "Disabled",
+          "Focus",
+          "Hover",
+          "Selected"
+        ]
+      },
+      "props": {
+        "Size": {
+          "values": [
+            "Large",
+            "Regular"
+          ],
+          "type": "select",
+          "default": "Large"
+        },
+        "Type": {
+          "values": [
+            "Default",
+            "Destructive"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Default",
+            "Disabled",
+            "Focus",
+            "Hover",
+            "Selected"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Table Header": {
+      "id": "19:6472",
+      "name": "Table Header",
+      "key": "24bb4f120676e40af0602cc141151d733b549d0c",
+      "description": "",
+      "variants": [
+        {
+          "id": "19:6480",
+          "name": "Content=Text, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:4898",
+          "name": "Content=Text, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:4932",
+          "name": "Content=Text, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:4966",
+          "name": "Content=Text, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "28:5606",
+          "name": "Content=Text, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "28:5609",
+          "name": "Content=Text, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "28:5612",
+          "name": "Content=Text, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "28:5615",
+          "name": "Content=Text, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Text",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "19:6315",
+          "name": "Content=Sortable, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:4901",
+          "name": "Content=Sortable, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:4935",
+          "name": "Content=Sortable, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:4969",
+          "name": "Content=Sortable, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "28:5650",
+          "name": "Content=Sortable, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "28:5654",
+          "name": "Content=Sortable, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "28:5658",
+          "name": "Content=Sortable, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "28:5662",
+          "name": "Content=Sortable, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Sortable",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "19:6476",
+          "name": "Content=Checkbox, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:42971",
+          "name": "Content=Checkbox, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:4905",
+          "name": "Content=Checkbox, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:42974",
+          "name": "Content=Checkbox, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:4939",
+          "name": "Content=Checkbox, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:42977",
+          "name": "Content=Checkbox, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:4973",
+          "name": "Content=Checkbox, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:42980",
+          "name": "Content=Checkbox, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "9:757",
+          "name": "Content=Empty, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:42995",
+          "name": "Content=Empty, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:4908",
+          "name": "Content=Empty, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:42997",
+          "name": "Content=Empty, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:4942",
+          "name": "Content=Empty, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:42999",
+          "name": "Content=Empty, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:4976",
+          "name": "Content=Empty, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:43001",
+          "name": "Content=Empty, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Empty",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Content": [
+          "Checkbox",
+          "Empty",
+          "Sortable",
+          "Text"
+        ],
+        "Alignment": [
+          "Left",
+          "Right"
+        ],
+        "State": [
+          "Active",
+          "Default",
+          "Hover",
+          "Selected"
+        ]
+      },
+      "props": {
+        "Content": {
+          "values": [
+            "Checkbox",
+            "Empty",
+            "Sortable",
+            "Text"
+          ],
+          "type": "select",
+          "default": "Checkbox"
+        },
+        "Alignment": {
+          "values": [
+            "Left",
+            "Right"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Default",
+            "Hover",
+            "Selected"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Table Cell": {
+      "id": "19:6314",
+      "name": "Table Cell",
+      "key": "387db7e74fbc61b69f92bc8aee573d16bef089c4",
+      "description": "",
+      "variants": [
+        {
+          "id": "9:756",
+          "name": "Content=Text (1 Line), Alignment=Left, State=Default",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:3164",
+          "name": "Content=Text (1 Line), Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:3268",
+          "name": "Content=Text (1 Line), Alignment=Left, State=Active",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:3371",
+          "name": "Content=Text (1 Line), Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "19:6302",
+          "name": "Content=Text (1 Line), Alignment=Right, State=Default",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:3167",
+          "name": "Content=Text (1 Line), Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:3265",
+          "name": "Content=Text (1 Line), Alignment=Right, State=Active",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:3374",
+          "name": "Content=Text (1 Line), Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Text (1 Line)",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "162:14676",
+          "name": "Content=Text (2 Lines), Alignment=Left, State=Default",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:32186",
+          "name": "Content=Text (2 Lines), Alignment=Right, State=Default",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:14679",
+          "name": "Content=Text (2 Lines), Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:32191",
+          "name": "Content=Text (2 Lines), Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "162:14682",
+          "name": "Content=Text (2 Lines), Alignment=Left, State=Active",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:32196",
+          "name": "Content=Text (2 Lines), Alignment=Right, State=Active",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "162:14685",
+          "name": "Content=Text (2 Lines), Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:32201",
+          "name": "Content=Text (2 Lines), Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Text (2 Lines)",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "79:9193",
+          "name": "Content=Actions, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "79:9199",
+          "name": "Content=Actions, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "79:9205",
+          "name": "Content=Actions, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "79:9211",
+          "name": "Content=Actions, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "19:6299",
+          "name": "Content=Actions, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:3170",
+          "name": "Content=Actions, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:3260",
+          "name": "Content=Actions, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:3377",
+          "name": "Content=Actions, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Actions",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "19:6307",
+          "name": "Content=Checkbox, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:32461",
+          "name": "Content=Checkbox, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:3175",
+          "name": "Content=Checkbox, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:32464",
+          "name": "Content=Checkbox, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:3257",
+          "name": "Content=Checkbox, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:32467",
+          "name": "Content=Checkbox, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:3382",
+          "name": "Content=Checkbox, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:32470",
+          "name": "Content=Checkbox, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Checkbox",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "20:3709",
+          "name": "Content=Badge, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "20:3712",
+          "name": "Content=Badge, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "20:3715",
+          "name": "Content=Badge, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:3718",
+          "name": "Content=Badge, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "58:5243",
+          "name": "Content=Badge, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "58:5240",
+          "name": "Content=Badge, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "58:5246",
+          "name": "Content=Badge, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "58:5249",
+          "name": "Content=Badge, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Badge",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "59:5611",
+          "name": "Content=Buttons, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "59:5608",
+          "name": "Content=Buttons, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "59:5614",
+          "name": "Content=Buttons, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "59:5617",
+          "name": "Content=Buttons, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "59:6788",
+          "name": "Content=Buttons, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "59:6785",
+          "name": "Content=Buttons, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "59:6791",
+          "name": "Content=Buttons, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "59:6794",
+          "name": "Content=Buttons, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Buttons",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "79:9085",
+          "name": "Content=Avatar, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:33269",
+          "name": "Content=Avatar, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "79:9089",
+          "name": "Content=Avatar, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:33272",
+          "name": "Content=Avatar, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "79:9093",
+          "name": "Content=Avatar, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:33275",
+          "name": "Content=Avatar, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "79:9097",
+          "name": "Content=Avatar, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:33278",
+          "name": "Content=Avatar, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Avatar",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "68:11683",
+          "name": "Content=Avatar + Name, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:33319",
+          "name": "Content=Avatar + Name, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "68:11686",
+          "name": "Content=Avatar + Name, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:33323",
+          "name": "Content=Avatar + Name, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "68:11689",
+          "name": "Content=Avatar + Name, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:33327",
+          "name": "Content=Avatar + Name, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "68:11692",
+          "name": "Content=Avatar + Name, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:33331",
+          "name": "Content=Avatar + Name, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Avatar + Name",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "115:10153",
+          "name": "Content=Input, Alignment=Left, State=Default",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "737:33367",
+          "name": "Content=Input, Alignment=Right, State=Default",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Right",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "115:10156",
+          "name": "Content=Input, Alignment=Left, State=Hover",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Left",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "737:33370",
+          "name": "Content=Input, Alignment=Right, State=Hover",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Right",
+            "State": "Hover"
+          }
+        },
+        {
+          "id": "115:10159",
+          "name": "Content=Input, Alignment=Left, State=Active",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "737:33373",
+          "name": "Content=Input, Alignment=Right, State=Active",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "115:10162",
+          "name": "Content=Input, Alignment=Left, State=Selected",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "737:33376",
+          "name": "Content=Input, Alignment=Right, State=Selected",
+          "props": {
+            "Content": "Input",
+            "Alignment": "Right",
+            "State": "Selected"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Content": [
+          "Actions",
+          "Avatar",
+          "Avatar + Name",
+          "Badge",
+          "Buttons",
+          "Checkbox",
+          "Input",
+          "Text (1 Line)",
+          "Text (2 Lines)"
+        ],
+        "Alignment": [
+          "Left",
+          "Right"
+        ],
+        "State": [
+          "Active",
+          "Default",
+          "Hover",
+          "Selected"
+        ]
+      },
+      "props": {
+        "Content": {
+          "values": [
+            "Actions",
+            "Avatar",
+            "Avatar + Name",
+            "Badge",
+            "Buttons",
+            "Checkbox",
+            "Input",
+            "Text (1 Line)",
+            "Text (2 Lines)"
+          ],
+          "type": "select",
+          "default": "Actions"
+        },
+        "Alignment": {
+          "values": [
+            "Left",
+            "Right"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Default",
+            "Hover",
+            "Selected"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Date Picker": {
+      "id": "288:119954",
+      "name": "Date Picker",
+      "key": "f9e4781ff38fa0aae85a98e0f67f8a6b2985d5a0",
+      "description": "",
+      "variants": [
+        {
+          "id": "190:27724",
+          "name": "Months=1 Month",
+          "props": {
+            "Months": "1 Month"
+          }
+        },
+        {
+          "id": "190:27722",
+          "name": "Months=2 months",
+          "props": {
+            "Months": "2 months"
+          }
+        },
+        {
+          "id": "190:27721",
+          "name": "Months=3 months",
+          "props": {
+            "Months": "3 months"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Months": [
+          "1 Month",
+          "2 months",
+          "3 months"
+        ]
+      },
+      "props": {
+        "Months": {
+          "values": [
+            "1 Month",
+            "2 months",
+            "3 months"
+          ],
+          "type": "select",
+          "default": "1 Month"
+        }
+      },
+      "states": {}
+    },
+    ".Date Picker / Header": {
+      "id": "264:29273",
+      "name": ".Date Picker / Header",
+      "key": "adfd5e6d25341553bb2311f35e61a500d783ed9c",
+      "description": "",
+      "variants": [
+        {
+          "id": "264:28466",
+          "name": "Type=1 Month",
+          "props": {
+            "Type": "1 Month"
+          }
+        },
+        {
+          "id": "264:30496",
+          "name": "Type=2 Months",
+          "props": {
+            "Type": "2 Months"
+          }
+        },
+        {
+          "id": "264:30497",
+          "name": "Type=3 Months",
+          "props": {
+            "Type": "3 Months"
+          }
+        },
+        {
+          "id": "264:29248",
+          "name": "Type=Year and Month",
+          "props": {
+            "Type": "Year and Month"
+          }
+        },
+        {
+          "id": "264:31953",
+          "name": "Type=Only Month",
+          "props": {
+            "Type": "Only Month"
+          }
+        },
+        {
+          "id": "264:32007",
+          "name": "Type=Only Year",
+          "props": {
+            "Type": "Only Year"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "1 Month",
+          "2 Months",
+          "3 Months",
+          "Only Month",
+          "Only Year",
+          "Year and Month"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "1 Month",
+            "2 Months",
+            "3 Months",
+            "Only Month",
+            "Only Year",
+            "Year and Month"
+          ],
+          "type": "select",
+          "default": "1 Month"
+        }
+      },
+      "states": {}
+    },
+    ".Date Picker / Day": {
+      "id": "781:40922",
+      "name": ".Date Picker / Day",
+      "key": "8a5cd39377300cdf6835539d318c8a2b455a219d",
+      "description": "",
+      "variants": [
+        {
+          "id": "781:40923",
+          "name": "Position=Middle, State=Disabled",
+          "props": {
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "781:40941",
+          "name": "Position=Middle, State=Default",
+          "props": {
+            "Position": "Middle",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "781:40953",
+          "name": "Position=Single, State=Default",
+          "props": {
+            "Position": "Single",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "781:40957",
+          "name": "Position=Left, State=Disabled",
+          "props": {
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "781:40961",
+          "name": "Position=Right, State=Disabled",
+          "props": {
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "781:40965",
+          "name": "Position=Single, State=Disabled",
+          "props": {
+            "Position": "Single",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "781:40925",
+          "name": "Position=Middle, State=Active",
+          "props": {
+            "Position": "Middle",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "781:40927",
+          "name": "Position=Left, State=Active",
+          "props": {
+            "Position": "Left",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "781:40929",
+          "name": "Position=Single, State=Active",
+          "props": {
+            "Position": "Single",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "781:40931",
+          "name": "Position=Right, State=Active",
+          "props": {
+            "Position": "Right",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "781:40933",
+          "name": "Position=Middle, State=Selected",
+          "props": {
+            "Position": "Middle",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "781:40935",
+          "name": "Position=Left, State=Selected",
+          "props": {
+            "Position": "Left",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "781:40937",
+          "name": "Position=Single, State=Selected",
+          "props": {
+            "Position": "Single",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "781:40939",
+          "name": "Position=Right, State=Selected",
+          "props": {
+            "Position": "Right",
+            "State": "Selected"
+          }
+        },
+        {
+          "id": "781:40945",
+          "name": "Position=Left, State=Default",
+          "props": {
+            "Position": "Left",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "781:40949",
+          "name": "Position=Right, State=Default",
+          "props": {
+            "Position": "Right",
+            "State": "Default"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Position": [
+          "Left",
+          "Middle",
+          "Right",
+          "Single"
+        ],
+        "State": [
+          "Active",
+          "Default",
+          "Disabled",
+          "Selected"
+        ]
+      },
+      "props": {
+        "Position": {
+          "values": [
+            "Left",
+            "Middle",
+            "Right",
+            "Single"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Default",
+            "Disabled",
+            "Selected"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Date Picker Input": {
+      "id": "60:9340",
+      "name": "Date Picker Input",
+      "key": "887aa5d6aa8d0631f8d96e80400e4f55511a661a",
+      "description": "",
+      "variants": [
+        {
+          "id": "60:9332",
+          "name": "State=Placeholder",
+          "props": {
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "60:9339",
+          "name": "State=Value",
+          "props": {
+            "State": "Value"
+          }
+        },
+        {
+          "id": "179:29000",
+          "name": "State=Focus",
+          "props": {
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Focus",
+          "Placeholder",
+          "Value"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Focus",
+            "Placeholder",
+            "Value"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Menu": {
+      "id": "176:27848",
+      "name": "Menu",
+      "key": "ccc89748c565bf4ca23b0a8f05f6198758c8d88a",
+      "description": "Popup, Popover",
+      "variants": [
+        {
+          "id": "190:27732",
+          "name": "Spacing=16px",
+          "props": {
+            "Spacing": "16px"
+          }
+        },
+        {
+          "id": "176:27849",
+          "name": "Spacing=8px",
+          "props": {
+            "Spacing": "8px"
+          }
+        },
+        {
+          "id": "190:27739",
+          "name": "Spacing=24px",
+          "props": {
+            "Spacing": "24px"
+          }
+        },
+        {
+          "id": "19:5560",
+          "name": "Spacing=2px",
+          "props": {
+            "Spacing": "2px"
+          }
+        },
+        {
+          "id": "176:27847",
+          "name": "Spacing=None",
+          "props": {
+            "Spacing": "None"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Spacing": [
+          "16px",
+          "24px",
+          "2px",
+          "8px",
+          "None"
+        ]
+      },
+      "props": {
+        "Spacing": {
+          "values": [
+            "16px",
+            "24px",
+            "2px",
+            "8px",
+            "None"
+          ],
+          "type": "select",
+          "default": "16px"
+        }
+      },
+      "states": {}
+    },
+    "Dialog": {
+      "id": "151:12298",
+      "name": "Dialog",
+      "key": "01b848541d6b4ebf9ecd20931d3eddde3929248e",
+      "description": "",
+      "variants": [
+        {
+          "id": "151:12297",
+          "name": "Type=Desktop",
+          "props": {
+            "Type": "Desktop"
+          }
+        },
+        {
+          "id": "153:12986",
+          "name": "Type=Desktop Scrollable",
+          "props": {
+            "Type": "Desktop Scrollable"
+          }
+        },
+        {
+          "id": "151:12284",
+          "name": "Type=Mobile",
+          "props": {
+            "Type": "Mobile"
+          }
+        },
+        {
+          "id": "153:13079",
+          "name": "Type=Mobile Full Screen Scrollable",
+          "props": {
+            "Type": "Mobile Full Screen Scrollable"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Desktop",
+          "Desktop Scrollable",
+          "Mobile",
+          "Mobile Full Screen Scrollable"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Desktop",
+            "Desktop Scrollable",
+            "Mobile",
+            "Mobile Full Screen Scrollable"
+          ],
+          "type": "select",
+          "default": "Desktop"
+        }
+      },
+      "states": {}
+    },
+    "Dialog Header": {
+      "id": "176:22344",
+      "name": "Dialog Header",
+      "key": "6bf3083b52e96fb2813a6fe9bb2959dcfc6402e8",
+      "description": "",
+      "variants": [
+        {
+          "id": "176:22529",
+          "name": "Type=Close Only",
+          "props": {
+            "Type": "Close Only"
+          }
+        },
+        {
+          "id": "176:22345",
+          "name": "Type=Header",
+          "props": {
+            "Type": "Header"
+          }
+        },
+        {
+          "id": "176:22535",
+          "name": "Type=Icon Button Close",
+          "props": {
+            "Type": "Icon Button Close"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Close Only",
+          "Header",
+          "Icon Button Close"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Close Only",
+            "Header",
+            "Icon Button Close"
+          ],
+          "type": "select",
+          "default": "Close Only"
+        }
+      },
+      "states": {}
+    },
+    "Dialog Footer": {
+      "id": "176:21284",
+      "name": "Dialog Footer",
+      "key": "167ba429d9319f8402b0314a50e4dd8787a7d3e4",
+      "description": "",
+      "variants": [
+        {
+          "id": "176:20584",
+          "name": "Type=2 Buttons Right",
+          "props": {
+            "Type": "2 Buttons Right"
+          }
+        },
+        {
+          "id": "176:21019",
+          "name": "Type=2 Full-width Buttons",
+          "props": {
+            "Type": "2 Full-width Buttons"
+          }
+        },
+        {
+          "id": "176:21283",
+          "name": "Type=Single Full-width Button",
+          "props": {
+            "Type": "Single Full-width Button"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "2 Buttons Right",
+          "2 Full-width Buttons",
+          "Single Full-width Button"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "2 Buttons Right",
+            "2 Full-width Buttons",
+            "Single Full-width Button"
+          ],
+          "type": "select",
+          "default": "2 Buttons Right"
+        }
+      },
+      "states": {}
+    },
+    "Rich Radio Group": {
+      "id": "19:5987",
+      "name": "Rich Radio Group",
+      "key": "fc49fe3b53d424bcd44e927595df1790c2187a7d",
+      "description": "",
+      "variants": [
+        {
+          "id": "19:5986",
+          "name": "Checked?=True, Flipped=False",
+          "props": {
+            "Checked?": "True",
+            "Flipped": "False"
+          }
+        },
+        {
+          "id": "19:5985",
+          "name": "Checked?=False, Flipped=False",
+          "props": {
+            "Checked?": "False",
+            "Flipped": "False"
+          }
+        },
+        {
+          "id": "761:108632",
+          "name": "Checked?=False, Flipped=True",
+          "props": {
+            "Checked?": "False",
+            "Flipped": "True"
+          }
+        },
+        {
+          "id": "761:108638",
+          "name": "Checked?=True, Flipped=True",
+          "props": {
+            "Checked?": "True",
+            "Flipped": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "True"
+        ],
+        "Flipped": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        },
+        "Flipped": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "select",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Radio": {
+      "id": "16:1796",
+      "name": "Radio",
+      "key": "46fe4a965c5ced9e172c9bdb9e1b334a3a526511",
+      "description": "",
+      "variants": [
+        {
+          "id": "16:1794",
+          "name": "Checked?=True, State=Default",
+          "props": {
+            "Checked?": "True",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "16:1795",
+          "name": "Checked?=False, State=Default",
+          "props": {
+            "Checked?": "False",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "147:11605",
+          "name": "Checked?=False, State=Focus",
+          "props": {
+            "Checked?": "False",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "147:11607",
+          "name": "Checked?=True, State=Focus",
+          "props": {
+            "Checked?": "True",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "176:25062",
+          "name": "Checked?=False, State=Error",
+          "props": {
+            "Checked?": "False",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "176:25066",
+          "name": "Checked?=True, State=Error",
+          "props": {
+            "Checked?": "True",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "176:25116",
+          "name": "Checked?=False, State=Error Focus",
+          "props": {
+            "Checked?": "False",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "176:25118",
+          "name": "Checked?=True, State=Error Focus",
+          "props": {
+            "Checked?": "True",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "16:1912",
+          "name": "Checked?=False, State=Disabled",
+          "props": {
+            "Checked?": "False",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "16:1909",
+          "name": "Checked?=True, State=Disabled",
+          "props": {
+            "Checked?": "True",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "True"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Error",
+          "Error Focus",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Error",
+            "Error Focus",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Link Button": {
+      "id": "11:2014",
+      "name": "Link Button",
+      "key": "6c6239cf0a5284b015a20bc8770685b8a18d7eb4",
+      "description": "",
+      "variants": [
+        {
+          "id": "11:2010",
+          "name": "Roundness=Default, Size=Default, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Default",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "11:2013",
+          "name": "Roundness=Default, Size=Default, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Default",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "162:17323",
+          "name": "Roundness=Default, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154942",
+          "name": "Roundness=Round, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "156:13794",
+          "name": "Roundness=Default, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154950",
+          "name": "Roundness=Round, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "156:13786",
+          "name": "Roundness=Default, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:154958",
+          "name": "Roundness=Round, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17315",
+          "name": "Roundness=Default, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154966",
+          "name": "Roundness=Round, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "11:2008",
+          "name": "Roundness=Default, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154974",
+          "name": "Roundness=Round, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "11:2009",
+          "name": "Roundness=Default, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:154982",
+          "name": "Roundness=Round, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17307",
+          "name": "Roundness=Default, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154990",
+          "name": "Roundness=Round, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "11:2011",
+          "name": "Roundness=Default, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154998",
+          "name": "Roundness=Round, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "11:2012",
+          "name": "Roundness=Default, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:155006",
+          "name": "Roundness=Round, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17299",
+          "name": "Roundness=Default, Size=Default, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Default",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:155014",
+          "name": "Roundness=Round, Size=Default, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Default",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:155022",
+          "name": "Roundness=Round, Size=Default, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Default",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:155030",
+          "name": "Roundness=Round, Size=Default, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Default",
+            "State": "Default"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Size": [
+          "Default",
+          "Large",
+          "Mini",
+          "Small"
+        ],
+        "State": [
+          "Default",
+          "Focus",
+          "Hover & Active"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Size": {
+          "values": [
+            "Default",
+            "Large",
+            "Mini",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Focus",
+            "Hover & Active"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Slider Horizontal": {
+      "id": "65:4902",
+      "name": "Slider Horizontal",
+      "key": "61d590b63799ee3916d22acb6576fc765962b7d7",
+      "description": "",
+      "variants": [
+        {
+          "id": "65:4894",
+          "name": "Type=Default",
+          "props": {
+            "Type": "Default"
+          }
+        },
+        {
+          "id": "65:4901",
+          "name": "Type=Range narrow",
+          "props": {
+            "Type": "Range narrow"
+          }
+        },
+        {
+          "id": "761:109548",
+          "name": "Type=Range wide",
+          "props": {
+            "Type": "Range wide"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Default",
+          "Range narrow",
+          "Range wide"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Default",
+            "Range narrow",
+            "Range wide"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {}
+    },
+    ".Marker": {
+      "id": "162:17957",
+      "name": ".Marker",
+      "key": "dff579647f57881c8bb6b1534ccb0caf2531b80c",
+      "description": "",
+      "variants": [
+        {
+          "id": "65:4895",
+          "name": "State=Regular",
+          "props": {
+            "State": "Regular"
+          }
+        },
+        {
+          "id": "162:17956",
+          "name": "State=Focus",
+          "props": {
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Focus",
+          "Regular"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Focus",
+            "Regular"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Radio Group": {
+      "id": "19:6048",
+      "name": "Radio Group",
+      "key": "45f161a04b18ac01fa264c1b3e1f88f2ea54efe7",
+      "description": "",
+      "variants": [
+        {
+          "id": "19:6049",
+          "name": "Checked?=True, Layout=Inline",
+          "props": {
+            "Checked?": "True",
+            "Layout": "Inline"
+          }
+        },
+        {
+          "id": "19:6052",
+          "name": "Checked?=False, Layout=Inline",
+          "props": {
+            "Checked?": "False",
+            "Layout": "Inline"
+          }
+        },
+        {
+          "id": "280:104410",
+          "name": "Checked?=False, Layout=Block",
+          "props": {
+            "Checked?": "False",
+            "Layout": "Block"
+          }
+        },
+        {
+          "id": "280:104413",
+          "name": "Checked?=True, Layout=Block",
+          "props": {
+            "Checked?": "True",
+            "Layout": "Block"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "True"
+        ],
+        "Layout": [
+          "Block",
+          "Inline"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        },
+        "Layout": {
+          "values": [
+            "Block",
+            "Inline"
+          ],
+          "type": "select",
+          "default": "Block"
+        }
+      },
+      "states": {}
+    },
+    "Horizontal Field": {
+      "id": "120:13775",
+      "name": "Horizontal Field",
+      "key": "861f9052d0ff5946ac5907b71e8941443e42dbaa",
+      "description": "",
+      "variants": [
+        {
+          "id": "120:13779",
+          "name": "Type=Text Value",
+          "props": {
+            "Type": "Text Value"
+          }
+        },
+        {
+          "id": "120:13776",
+          "name": "Type=Select",
+          "props": {
+            "Type": "Select"
+          }
+        },
+        {
+          "id": "120:13782",
+          "name": "Type=Textarea",
+          "props": {
+            "Type": "Textarea"
+          }
+        },
+        {
+          "id": "157:11620",
+          "name": "Type=Slider",
+          "props": {
+            "Type": "Slider"
+          }
+        },
+        {
+          "id": "120:13785",
+          "name": "Type=Radio",
+          "props": {
+            "Type": "Radio"
+          }
+        },
+        {
+          "id": "120:13790",
+          "name": "Type=Checkbox",
+          "props": {
+            "Type": "Checkbox"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Checkbox",
+          "Radio",
+          "Select",
+          "Slider",
+          "Text Value",
+          "Textarea"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Checkbox",
+            "Radio",
+            "Select",
+            "Slider",
+            "Text Value",
+            "Textarea"
+          ],
+          "type": "select",
+          "default": "Checkbox"
+        }
+      },
+      "states": {}
+    },
+    "Input File": {
+      "id": "66:5981",
+      "name": "Input File",
+      "key": "3409b73da8a932b318ca023f011d553aee136a40",
+      "description": "",
+      "variants": [
+        {
+          "id": "18:994",
+          "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91671",
+          "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "66:6006",
+          "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91663",
+          "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "66:5990",
+          "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91691",
+          "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "225:38988",
+          "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91779",
+          "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "179:29058",
+          "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91723",
+          "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "179:29066",
+          "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91703",
+          "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "179:29062",
+          "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91667",
+          "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "225:39000",
+          "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91683",
+          "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "179:29106",
+          "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91679",
+          "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "179:29114",
+          "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91687",
+          "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "179:29110",
+          "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91675",
+          "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "225:38992",
+          "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91731",
+          "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "179:29122",
+          "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91707",
+          "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Regular",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "179:29118",
+          "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91659",
+          "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Large",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "179:29126",
+          "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91719",
+          "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Small",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "225:38996",
+          "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91727",
+          "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "False",
+            "Size": "Mini",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "66:5980",
+          "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91735",
+          "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "66:6010",
+          "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91739",
+          "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "66:5994",
+          "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91759",
+          "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "225:39004",
+          "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "756:91763",
+          "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "179:29082",
+          "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91767",
+          "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "179:29090",
+          "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91695",
+          "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "179:29086",
+          "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91699",
+          "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "225:39016",
+          "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "756:91743",
+          "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "179:29142",
+          "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91747",
+          "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "179:29150",
+          "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91751",
+          "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "179:29146",
+          "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91755",
+          "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "225:39008",
+          "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Error",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "756:91771",
+          "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Error",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "179:29166",
+          "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91775",
+          "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Regular",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "179:29174",
+          "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91711",
+          "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Large",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "179:29170",
+          "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91715",
+          "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Small",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "225:39012",
+          "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Error Focus",
+          "props": {
+            "Roundness": "Default",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "756:91655",
+          "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Error Focus",
+          "props": {
+            "Roundness": "Round",
+            "File Chosen?": "True",
+            "Size": "Mini",
+            "State": "Error Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "File Chosen?": [
+          "False",
+          "True"
+        ],
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "State": [
+          "Default",
+          "Error",
+          "Error Focus",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "File Chosen?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "select",
+          "default": "False"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Error",
+            "Error Focus",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Input OTP": {
+      "id": "140:11468",
+      "name": "Input OTP",
+      "key": "93ad1e3364cdf9e8077778f01642114146ac73b8",
+      "description": "",
+      "variants": [
+        {
+          "id": "140:11701",
+          "name": "Size=Default, Position=Left, State=Empty",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:11704",
+          "name": "Size=Default, Position=Middle, State=Empty",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:11707",
+          "name": "Size=Default, Position=Right, State=Empty",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:12035",
+          "name": "Size=Large, Position=Left, State=Empty",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:12046",
+          "name": "Size=Large, Position=Middle, State=Empty",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:12057",
+          "name": "Size=Large, Position=Right, State=Empty",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:12155",
+          "name": "Size=Small, Position=Left, State=Empty",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:12166",
+          "name": "Size=Small, Position=Middle, State=Empty",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:12177",
+          "name": "Size=Small, Position=Right, State=Empty",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "225:38903",
+          "name": "Size=Mini, Position=Left, State=Empty",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "225:38914",
+          "name": "Size=Mini, Position=Middle, State=Empty",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "225:38925",
+          "name": "Size=Mini, Position=Right, State=Empty",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Empty"
+          }
+        },
+        {
+          "id": "140:11674",
+          "name": "Size=Default, Position=Left, State=Placeholder",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:11677",
+          "name": "Size=Default, Position=Middle, State=Placeholder",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:11680",
+          "name": "Size=Default, Position=Right, State=Placeholder",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:12032",
+          "name": "Size=Large, Position=Left, State=Placeholder",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:12043",
+          "name": "Size=Large, Position=Middle, State=Placeholder",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:12054",
+          "name": "Size=Large, Position=Right, State=Placeholder",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:12152",
+          "name": "Size=Small, Position=Left, State=Placeholder",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:12163",
+          "name": "Size=Small, Position=Middle, State=Placeholder",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:12174",
+          "name": "Size=Small, Position=Right, State=Placeholder",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "225:38900",
+          "name": "Size=Mini, Position=Left, State=Placeholder",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "225:38911",
+          "name": "Size=Mini, Position=Middle, State=Placeholder",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "225:38922",
+          "name": "Size=Mini, Position=Right, State=Placeholder",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Placeholder"
+          }
+        },
+        {
+          "id": "140:11457",
+          "name": "Size=Default, Position=Left, State=Value",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:11456",
+          "name": "Size=Default, Position=Middle, State=Value",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:11458",
+          "name": "Size=Default, Position=Right, State=Value",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:12026",
+          "name": "Size=Large, Position=Left, State=Value",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:12037",
+          "name": "Size=Large, Position=Middle, State=Value",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:12048",
+          "name": "Size=Large, Position=Right, State=Value",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:12146",
+          "name": "Size=Small, Position=Left, State=Value",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:12157",
+          "name": "Size=Small, Position=Middle, State=Value",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:12168",
+          "name": "Size=Small, Position=Right, State=Value",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "225:38894",
+          "name": "Size=Mini, Position=Left, State=Value",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "225:38905",
+          "name": "Size=Mini, Position=Middle, State=Value",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "225:38916",
+          "name": "Size=Mini, Position=Right, State=Value",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Value"
+          }
+        },
+        {
+          "id": "140:11662",
+          "name": "Size=Default, Position=Left, State=Focus",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:11481",
+          "name": "Size=Default, Position=Middle, State=Focus",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:11656",
+          "name": "Size=Default, Position=Right, State=Focus",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:12059",
+          "name": "Size=Large, Position=Left, State=Focus",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:12068",
+          "name": "Size=Large, Position=Middle, State=Focus",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:12077",
+          "name": "Size=Large, Position=Right, State=Focus",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:12179",
+          "name": "Size=Small, Position=Left, State=Focus",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:12188",
+          "name": "Size=Small, Position=Middle, State=Focus",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:12197",
+          "name": "Size=Small, Position=Right, State=Focus",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "225:38927",
+          "name": "Size=Mini, Position=Left, State=Focus",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "225:38936",
+          "name": "Size=Mini, Position=Middle, State=Focus",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "225:38945",
+          "name": "Size=Mini, Position=Right, State=Focus",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "140:11744",
+          "name": "Size=Default, Position=Left, State=Error",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:11747",
+          "name": "Size=Default, Position=Middle, State=Error",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:11750",
+          "name": "Size=Default, Position=Right, State=Error",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:12065",
+          "name": "Size=Large, Position=Left, State=Error",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:12074",
+          "name": "Size=Large, Position=Middle, State=Error",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:12083",
+          "name": "Size=Large, Position=Right, State=Error",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:12185",
+          "name": "Size=Small, Position=Left, State=Error",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:12194",
+          "name": "Size=Small, Position=Middle, State=Error",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:12203",
+          "name": "Size=Small, Position=Right, State=Error",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "225:38933",
+          "name": "Size=Mini, Position=Left, State=Error",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "225:38942",
+          "name": "Size=Mini, Position=Middle, State=Error",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "225:38951",
+          "name": "Size=Mini, Position=Right, State=Error",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Error"
+          }
+        },
+        {
+          "id": "140:11719",
+          "name": "Size=Default, Position=Left, State=Error Focus",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:11722",
+          "name": "Size=Default, Position=Middle, State=Error Focus",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:11725",
+          "name": "Size=Default, Position=Right, State=Error Focus",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:12062",
+          "name": "Size=Large, Position=Left, State=Error Focus",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:12071",
+          "name": "Size=Large, Position=Middle, State=Error Focus",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:12080",
+          "name": "Size=Large, Position=Right, State=Error Focus",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:12182",
+          "name": "Size=Small, Position=Left, State=Error Focus",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:12191",
+          "name": "Size=Small, Position=Middle, State=Error Focus",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:12200",
+          "name": "Size=Small, Position=Right, State=Error Focus",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "225:38930",
+          "name": "Size=Mini, Position=Left, State=Error Focus",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "225:38939",
+          "name": "Size=Mini, Position=Middle, State=Error Focus",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "225:38948",
+          "name": "Size=Mini, Position=Right, State=Error Focus",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Error Focus"
+          }
+        },
+        {
+          "id": "140:11762",
+          "name": "Size=Default, Position=Left, State=Disabled",
+          "props": {
+            "Size": "Default",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:11765",
+          "name": "Size=Default, Position=Middle, State=Disabled",
+          "props": {
+            "Size": "Default",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:11768",
+          "name": "Size=Default, Position=Right, State=Disabled",
+          "props": {
+            "Size": "Default",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:12029",
+          "name": "Size=Large, Position=Left, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:12040",
+          "name": "Size=Large, Position=Middle, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:12051",
+          "name": "Size=Large, Position=Right, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:12149",
+          "name": "Size=Small, Position=Left, State=Disabled",
+          "props": {
+            "Size": "Small",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:12160",
+          "name": "Size=Small, Position=Middle, State=Disabled",
+          "props": {
+            "Size": "Small",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "140:12171",
+          "name": "Size=Small, Position=Right, State=Disabled",
+          "props": {
+            "Size": "Small",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "225:38897",
+          "name": "Size=Mini, Position=Left, State=Disabled",
+          "props": {
+            "Size": "Mini",
+            "Position": "Left",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "225:38908",
+          "name": "Size=Mini, Position=Middle, State=Disabled",
+          "props": {
+            "Size": "Mini",
+            "Position": "Middle",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "225:38919",
+          "name": "Size=Mini, Position=Right, State=Disabled",
+          "props": {
+            "Size": "Mini",
+            "Position": "Right",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Size": [
+          "Default",
+          "Large",
+          "Mini",
+          "Small"
+        ],
+        "Position": [
+          "Left",
+          "Middle",
+          "Right"
+        ],
+        "State": [
+          "Disabled",
+          "Empty",
+          "Error",
+          "Error Focus",
+          "Focus",
+          "Placeholder",
+          "Value"
+        ]
+      },
+      "props": {
+        "Size": {
+          "values": [
+            "Default",
+            "Large",
+            "Mini",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Position": {
+          "values": [
+            "Left",
+            "Middle",
+            "Right"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Disabled",
+            "Empty",
+            "Error",
+            "Error Focus",
+            "Focus",
+            "Placeholder",
+            "Value"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Loading Button": {
+      "id": "11:1126",
+      "name": "Loading Button",
+      "key": "c9c074039937614b6c91ef2ad2185710e35cd8e0",
+      "description": "",
+      "variants": [
+        {
+          "id": "11:422",
+          "name": "Roundness=Default, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:154210",
+          "name": "Roundness=Round, Size=Regular, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17148",
+          "name": "Roundness=Default, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154213",
+          "name": "Roundness=Round, Size=Regular, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "162:17129",
+          "name": "Roundness=Default, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154216",
+          "name": "Roundness=Round, Size=Regular, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Regular",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "11:427",
+          "name": "Roundness=Default, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:154219",
+          "name": "Roundness=Round, Size=Large, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17151",
+          "name": "Roundness=Default, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154222",
+          "name": "Roundness=Round, Size=Large, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "162:17132",
+          "name": "Roundness=Default, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154225",
+          "name": "Roundness=Round, Size=Large, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Large",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "11:432",
+          "name": "Roundness=Default, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:154228",
+          "name": "Roundness=Round, Size=Small, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17154",
+          "name": "Roundness=Default, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154231",
+          "name": "Roundness=Round, Size=Small, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "162:17135",
+          "name": "Roundness=Default, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154234",
+          "name": "Roundness=Round, Size=Small, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Small",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "156:13718",
+          "name": "Roundness=Default, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "757:154237",
+          "name": "Roundness=Round, Size=Mini, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "162:17145",
+          "name": "Roundness=Default, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "757:154240",
+          "name": "Roundness=Round, Size=Mini, State=Hover & Active",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Hover & Active"
+          }
+        },
+        {
+          "id": "162:17138",
+          "name": "Roundness=Default, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "757:154243",
+          "name": "Roundness=Round, Size=Mini, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Size": "Mini",
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "State": [
+          "Default",
+          "Focus",
+          "Hover & Active"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Focus",
+            "Hover & Active"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Spinner": {
+      "id": "757:154511",
+      "name": "Spinner",
+      "key": "d70d1fc9b5d08fb47e98bdc42ebacd334cb39a45",
+      "description": "",
+      "variants": [
+        {
+          "id": "11:1107",
+          "name": "Type=Mirrored",
+          "props": {
+            "Type": "Mirrored"
+          }
+        },
+        {
+          "id": "757:154510",
+          "name": "Type=Default",
+          "props": {
+            "Type": "Default"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Default",
+          "Mirrored"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Default",
+            "Mirrored"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {}
+    },
+    "Pagination": {
+      "id": "133:11358",
+      "name": "Pagination",
+      "key": "ab78a858b4aa0b7efa053d22821197c1b17894cd",
+      "description": "",
+      "variants": [
+        {
+          "id": "133:10576",
+          "name": "Type=Previous, State=Regular",
+          "props": {
+            "Type": "Previous",
+            "State": "Regular"
+          }
+        },
+        {
+          "id": "133:10785",
+          "name": "Type=Next, State=Regular",
+          "props": {
+            "Type": "Next",
+            "State": "Regular"
+          }
+        },
+        {
+          "id": "133:12555",
+          "name": "Type=Previous, State=Disabled",
+          "props": {
+            "Type": "Previous",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "133:12557",
+          "name": "Type=Next, State=Disabled",
+          "props": {
+            "Type": "Next",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Next",
+          "Previous"
+        ],
+        "State": [
+          "Disabled",
+          "Regular"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Next",
+            "Previous"
+          ],
+          "type": "select",
+          "default": "Next"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Disabled",
+            "Regular"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Pagination Button": {
+      "id": "133:12195",
+      "name": "Pagination Button",
+      "key": "afc7dc4cbd35ad38fa9b9655379e0ac39101555c",
+      "description": "",
+      "variants": [
+        {
+          "id": "133:10928",
+          "name": "Active=On",
+          "props": {
+            "Active": "On"
+          }
+        },
+        {
+          "id": "133:11356",
+          "name": "Active=Off",
+          "props": {
+            "Active": "Off"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Active": [
+          "Off",
+          "On"
+        ]
+      },
+      "props": {},
+      "states": {
+        "Active": {
+          "values": [
+            "Off",
+            "On"
+          ],
+          "css_pseudo": ":active"
+        }
+      }
+    },
+    "Progress": {
+      "id": "438:64981",
+      "name": "Progress",
+      "key": "83e38b66c2055fa085e2304f423b3dec2eadb372",
+      "description": "",
+      "variants": [
+        {
+          "id": "843:105650",
+          "name": "Progress=0",
+          "props": {
+            "Progress": "0"
+          }
+        },
+        {
+          "id": "843:105647",
+          "name": "Progress=10",
+          "props": {
+            "Progress": "10"
+          }
+        },
+        {
+          "id": "438:64982",
+          "name": "Progress=25",
+          "props": {
+            "Progress": "25"
+          }
+        },
+        {
+          "id": "843:105653",
+          "name": "Progress=33",
+          "props": {
+            "Progress": "33"
+          }
+        },
+        {
+          "id": "438:64985",
+          "name": "Progress=50",
+          "props": {
+            "Progress": "50"
+          }
+        },
+        {
+          "id": "843:105656",
+          "name": "Progress=66",
+          "props": {
+            "Progress": "66"
+          }
+        },
+        {
+          "id": "438:64988",
+          "name": "Progress=75",
+          "props": {
+            "Progress": "75"
+          }
+        },
+        {
+          "id": "843:105659",
+          "name": "Progress=90",
+          "props": {
+            "Progress": "90"
+          }
+        },
+        {
+          "id": "438:64991",
+          "name": "Progress=100",
+          "props": {
+            "Progress": "100"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Progress": [
+          "0",
+          "10",
+          "100",
+          "25",
+          "33",
+          "50",
+          "66",
+          "75",
+          "90"
+        ]
+      },
+      "props": {
+        "Progress": {
+          "values": [
+            "0",
+            "10",
+            "100",
+            "25",
+            "33",
+            "50",
+            "66",
+            "75",
+            "90"
+          ],
+          "type": "select",
+          "default": "0"
+        }
+      },
+      "states": {}
+    },
+    "Resizable": {
+      "id": "222:27733",
+      "name": "Resizable",
+      "key": "ec2b49b5b739aab2b8c24a061098eadfeef57366",
+      "description": "",
+      "variants": [
+        {
+          "id": "222:27675",
+          "name": "Orientation=Vertical",
+          "props": {
+            "Orientation": "Vertical"
+          }
+        },
+        {
+          "id": "222:27709",
+          "name": "Orientation=Horizontal",
+          "props": {
+            "Orientation": "Horizontal"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Orientation": [
+          "Horizontal",
+          "Vertical"
+        ]
+      },
+      "props": {
+        "Orientation": {
+          "values": [
+            "Horizontal",
+            "Vertical"
+          ],
+          "type": "select",
+          "default": "Horizontal"
+        }
+      },
+      "states": {}
+    },
+    "Scrollbar": {
+      "id": "164:18669",
+      "name": "Scrollbar",
+      "key": "11916565843269cb5f268815563ca0304594d2d2",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:18668",
+          "name": "Type=Vertical",
+          "props": {
+            "Type": "Vertical"
+          }
+        },
+        {
+          "id": "164:18667",
+          "name": "Type=Horizontal",
+          "props": {
+            "Type": "Horizontal"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Horizontal",
+          "Vertical"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Horizontal",
+            "Vertical"
+          ],
+          "type": "select",
+          "default": "Horizontal"
+        }
+      },
+      "states": {}
+    },
+    "Select Menu Overflow": {
+      "id": "28:6842",
+      "name": "Select Menu Overflow",
+      "key": "aa9c06da689feb20150c2ff3e9c68842f1adfc45",
+      "description": "",
+      "variants": [
+        {
+          "id": "28:6831",
+          "name": "Scroll Direction=Scroll Up",
+          "props": {
+            "Scroll Direction": "Scroll Up"
+          }
+        },
+        {
+          "id": "28:6840",
+          "name": "Scroll Direction=Scroll Down",
+          "props": {
+            "Scroll Direction": "Scroll Down"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Scroll Direction": [
+          "Scroll Down",
+          "Scroll Up"
+        ]
+      },
+      "props": {
+        "Scroll Direction": {
+          "values": [
+            "Scroll Down",
+            "Scroll Up"
+          ],
+          "type": "select",
+          "default": "Scroll Down"
+        }
+      },
+      "states": {}
+    },
+    "Sheet": {
+      "id": "301:243831",
+      "name": "Sheet",
+      "key": "3641fca84815ebe8809459a2d60906d6e1babea3",
+      "description": "",
+      "variants": [
+        {
+          "id": "151:12343",
+          "name": "Scrollable=True",
+          "props": {
+            "Scrollable": "True"
+          }
+        },
+        {
+          "id": "151:12330",
+          "name": "Scrollable=False",
+          "props": {
+            "Scrollable": "False"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Scrollable": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Scrollable": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "select",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Sidebar Item / Collapsed": {
+      "id": "28:5228",
+      "name": "Sidebar Item / Collapsed",
+      "key": "b17838ec0a31c7e86652273726730216e8debee9",
+      "description": "",
+      "variants": [
+        {
+          "id": "28:5229",
+          "name": "State=Regular",
+          "props": {
+            "State": "Regular"
+          }
+        },
+        {
+          "id": "28:5238",
+          "name": "State=Active",
+          "props": {
+            "State": "Active"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Active",
+          "Regular"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Regular"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Sidebar Item / Expanded / 1st Level": {
+      "id": "27:3414",
+      "name": "Sidebar Item / Expanded / 1st Level",
+      "key": "8c27dea925603a1af74375ea04094de078501db1",
+      "description": "",
+      "variants": [
+        {
+          "id": "28:6894",
+          "name": "State=Default, Type=Base",
+          "props": {
+            "State": "Default",
+            "Type": "Base"
+          }
+        },
+        {
+          "id": "27:3420",
+          "name": "State=Default, Type=Expanded",
+          "props": {
+            "State": "Default",
+            "Type": "Expanded"
+          }
+        },
+        {
+          "id": "28:5295",
+          "name": "State=Default, Type=Collapsed",
+          "props": {
+            "State": "Default",
+            "Type": "Collapsed"
+          }
+        },
+        {
+          "id": "176:23859",
+          "name": "State=Default, Type=Dropdown",
+          "props": {
+            "State": "Default",
+            "Type": "Dropdown"
+          }
+        },
+        {
+          "id": "176:24214",
+          "name": "State=Default, Type=Badge",
+          "props": {
+            "State": "Default",
+            "Type": "Badge"
+          }
+        },
+        {
+          "id": "189:67801",
+          "name": "State=Focus, Type=Base",
+          "props": {
+            "State": "Focus",
+            "Type": "Base"
+          }
+        },
+        {
+          "id": "189:67807",
+          "name": "State=Focus, Type=Expanded",
+          "props": {
+            "State": "Focus",
+            "Type": "Expanded"
+          }
+        },
+        {
+          "id": "189:67816",
+          "name": "State=Focus, Type=Collapsed",
+          "props": {
+            "State": "Focus",
+            "Type": "Collapsed"
+          }
+        },
+        {
+          "id": "189:67825",
+          "name": "State=Focus, Type=Dropdown",
+          "props": {
+            "State": "Focus",
+            "Type": "Dropdown"
+          }
+        },
+        {
+          "id": "189:67832",
+          "name": "State=Focus, Type=Badge",
+          "props": {
+            "State": "Focus",
+            "Type": "Badge"
+          }
+        },
+        {
+          "id": "28:6903",
+          "name": "State=Active, Type=Base",
+          "props": {
+            "State": "Active",
+            "Type": "Base"
+          }
+        },
+        {
+          "id": "28:5076",
+          "name": "State=Active, Type=Expanded",
+          "props": {
+            "State": "Active",
+            "Type": "Expanded"
+          }
+        },
+        {
+          "id": "28:5339",
+          "name": "State=Active, Type=Collapsed",
+          "props": {
+            "State": "Active",
+            "Type": "Collapsed"
+          }
+        },
+        {
+          "id": "176:23868",
+          "name": "State=Active, Type=Dropdown",
+          "props": {
+            "State": "Active",
+            "Type": "Dropdown"
+          }
+        },
+        {
+          "id": "176:24221",
+          "name": "State=Active, Type=Badge",
+          "props": {
+            "State": "Active",
+            "Type": "Badge"
+          }
+        },
+        {
+          "id": "189:68071",
+          "name": "State=Active Focus, Type=Base",
+          "props": {
+            "State": "Active Focus",
+            "Type": "Base"
+          }
+        },
+        {
+          "id": "189:68077",
+          "name": "State=Active Focus, Type=Expanded",
+          "props": {
+            "State": "Active Focus",
+            "Type": "Expanded"
+          }
+        },
+        {
+          "id": "189:68086",
+          "name": "State=Active Focus, Type=Collapsed",
+          "props": {
+            "State": "Active Focus",
+            "Type": "Collapsed"
+          }
+        },
+        {
+          "id": "189:68095",
+          "name": "State=Active Focus, Type=Dropdown",
+          "props": {
+            "State": "Active Focus",
+            "Type": "Dropdown"
+          }
+        },
+        {
+          "id": "189:68102",
+          "name": "State=Active Focus, Type=Badge",
+          "props": {
+            "State": "Active Focus",
+            "Type": "Badge"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Active",
+          "Active Focus",
+          "Default",
+          "Focus"
+        ],
+        "Type": [
+          "Badge",
+          "Base",
+          "Collapsed",
+          "Dropdown",
+          "Expanded"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Badge",
+            "Base",
+            "Collapsed",
+            "Dropdown",
+            "Expanded"
+          ],
+          "type": "select",
+          "default": "Badge"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Active Focus",
+            "Default",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    ".Sidebar Mini Button": {
+      "id": "176:24085",
+      "name": ".Sidebar Mini Button",
+      "key": "f71b2535d57b8a996004fd7aa9e7a82bd51e4105",
+      "description": "",
+      "variants": [
+        {
+          "id": "176:24070",
+          "name": "State=Default",
+          "props": {
+            "State": "Default"
+          }
+        },
+        {
+          "id": "176:24079",
+          "name": "State=Hover & Active",
+          "props": {
+            "State": "Hover & Active"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Default",
+          "Hover & Active"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Hover & Active"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Sidebar Item / Expanded / 2nd Level": {
+      "id": "28:5147",
+      "name": "Sidebar Item / Expanded / 2nd Level",
+      "key": "efa2144c2c4901463227cf53fc123dab35dba299",
+      "description": "",
+      "variants": [
+        {
+          "id": "28:5049",
+          "name": "State=Default",
+          "props": {
+            "State": "Default"
+          }
+        },
+        {
+          "id": "28:5146",
+          "name": "State=Active",
+          "props": {
+            "State": "Active"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "State": [
+          "Active",
+          "Default"
+        ]
+      },
+      "props": {},
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Default"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Sidebar Group Label": {
+      "id": "176:23790",
+      "name": "Sidebar Group Label",
+      "key": "813cd548a76aee995ae2a99e6120c11d0853e2f6",
+      "description": "",
+      "variants": [
+        {
+          "id": "27:3493",
+          "name": "Type=Base",
+          "props": {
+            "Type": "Base"
+          }
+        },
+        {
+          "id": "176:23789",
+          "name": "Type=Action",
+          "props": {
+            "Type": "Action"
+          }
+        },
+        {
+          "id": "176:24774",
+          "name": "Type=Expanded",
+          "props": {
+            "Type": "Expanded"
+          }
+        },
+        {
+          "id": "176:24781",
+          "name": "Type=Collapsed",
+          "props": {
+            "Type": "Collapsed"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Action",
+          "Base",
+          "Collapsed",
+          "Expanded"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Action",
+            "Base",
+            "Collapsed",
+            "Expanded"
+          ],
+          "type": "select",
+          "default": "Action"
+        }
+      },
+      "states": {}
+    },
+    "Slider Vertical": {
+      "id": "162:17939",
+      "name": "Slider Vertical",
+      "key": "0375fe6c41a97d4732bc1d2d68f207bfbfd96b3c",
+      "description": "",
+      "variants": [
+        {
+          "id": "162:17940",
+          "name": "Type=Default",
+          "props": {
+            "Type": "Default"
+          }
+        },
+        {
+          "id": "162:17944",
+          "name": "Type=Range narrow",
+          "props": {
+            "Type": "Range narrow"
+          }
+        },
+        {
+          "id": "761:109659",
+          "name": "Type=Range wide",
+          "props": {
+            "Type": "Range wide"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Default",
+          "Range narrow",
+          "Range wide"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Default",
+            "Range narrow",
+            "Range wide"
+          ],
+          "type": "select",
+          "default": "Default"
+        }
+      },
+      "states": {}
+    },
+    "Sonner": {
+      "id": "139:11361",
+      "name": "Sonner",
+      "key": "9ecc4169bbd632d30939bada005cb0175c445e38",
+      "description": "",
+      "variants": [
+        {
+          "id": "139:11359",
+          "name": "Stack=1 Level",
+          "props": {
+            "Stack": "1 Level"
+          }
+        },
+        {
+          "id": "139:11358",
+          "name": "Stack=2 Levels",
+          "props": {
+            "Stack": "2 Levels"
+          }
+        },
+        {
+          "id": "139:11360",
+          "name": "Stack=3 Levels",
+          "props": {
+            "Stack": "3 Levels"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Stack": [
+          "1 Level",
+          "2 Levels",
+          "3 Levels"
+        ]
+      },
+      "props": {
+        "Stack": {
+          "values": [
+            "1 Level",
+            "2 Levels",
+            "3 Levels"
+          ],
+          "type": "select",
+          "default": "1 Level"
+        }
+      },
+      "states": {}
+    },
+    "Sonner Content": {
+      "id": "139:11366",
+      "name": "Sonner Content",
+      "key": "78ffa9b1bce3d404a2c8f364108d6892cf373f05",
+      "description": "",
+      "variants": [
+        {
+          "id": "139:11362",
+          "name": "Type=Lines and button",
+          "props": {
+            "Type": "Lines and button"
+          }
+        },
+        {
+          "id": "139:11363",
+          "name": "Type=Loading",
+          "props": {
+            "Type": "Loading"
+          }
+        },
+        {
+          "id": "139:11364",
+          "name": "Type=Line and button",
+          "props": {
+            "Type": "Line and button"
+          }
+        },
+        {
+          "id": "139:11365",
+          "name": "Type=Simple",
+          "props": {
+            "Type": "Simple"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Type": [
+          "Line and button",
+          "Lines and button",
+          "Loading",
+          "Simple"
+        ]
+      },
+      "props": {
+        "Type": {
+          "values": [
+            "Line and button",
+            "Lines and button",
+            "Loading",
+            "Simple"
+          ],
+          "type": "select",
+          "default": "Line and button"
+        }
+      },
+      "states": {}
+    },
+    "Switch": {
+      "id": "16:1801",
+      "name": "Switch",
+      "key": "2bce038ac00a84957b2c4ff35655566ae2b5ffa7",
+      "description": "",
+      "variants": [
+        {
+          "id": "16:1799",
+          "name": "Checked?=False, State=Default",
+          "props": {
+            "Checked?": "False",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "16:1800",
+          "name": "Checked?=True, State=Default",
+          "props": {
+            "Checked?": "True",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "147:11620",
+          "name": "Checked?=False, State=Focus",
+          "props": {
+            "Checked?": "False",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "147:11617",
+          "name": "Checked?=True, State=Focus",
+          "props": {
+            "Checked?": "True",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "147:11588",
+          "name": "Checked?=False, State=Disabled",
+          "props": {
+            "Checked?": "False",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "147:11592",
+          "name": "Checked?=True, State=Disabled",
+          "props": {
+            "Checked?": "True",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "True"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Switch Group": {
+      "id": "19:6406",
+      "name": "Switch Group",
+      "key": "2c7b2cc950e8cc6003cbde9495480e9b18cc322a",
+      "description": "",
+      "variants": [
+        {
+          "id": "103:9413",
+          "name": "Layout=Inline, Checked?=False",
+          "props": {
+            "Layout": "Inline",
+            "Checked?": "False"
+          }
+        },
+        {
+          "id": "103:9418",
+          "name": "Layout=Inline, Checked?=True",
+          "props": {
+            "Layout": "Inline",
+            "Checked?": "True"
+          }
+        },
+        {
+          "id": "19:6410",
+          "name": "Layout=Block, Checked?=False",
+          "props": {
+            "Layout": "Block",
+            "Checked?": "False"
+          }
+        },
+        {
+          "id": "19:6407",
+          "name": "Layout=Block, Checked?=True",
+          "props": {
+            "Layout": "Block",
+            "Checked?": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Layout": [
+          "Block",
+          "Inline"
+        ],
+        "Checked?": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Layout": {
+          "values": [
+            "Block",
+            "Inline"
+          ],
+          "type": "select",
+          "default": "Block"
+        },
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Rich Switch Group": {
+      "id": "19:6374",
+      "name": "Rich Switch Group",
+      "key": "24a88fc4b37f1131b7e4cbe1d15d47775469d486",
+      "description": "",
+      "variants": [
+        {
+          "id": "19:6375",
+          "name": "Checked?=False, Flipped=False",
+          "props": {
+            "Checked?": "False",
+            "Flipped": "False"
+          }
+        },
+        {
+          "id": "19:6381",
+          "name": "Checked?=True, Flipped=False",
+          "props": {
+            "Checked?": "True",
+            "Flipped": "False"
+          }
+        },
+        {
+          "id": "761:108995",
+          "name": "Checked?=False, Flipped=True",
+          "props": {
+            "Checked?": "False",
+            "Flipped": "True"
+          }
+        },
+        {
+          "id": "761:109001",
+          "name": "Checked?=True, Flipped=True",
+          "props": {
+            "Checked?": "True",
+            "Flipped": "True"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Checked?": [
+          "False",
+          "True"
+        ],
+        "Flipped": [
+          "False",
+          "True"
+        ]
+      },
+      "props": {
+        "Checked?": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "boolean",
+          "default": "False"
+        },
+        "Flipped": {
+          "values": [
+            "False",
+            "True"
+          ],
+          "type": "select",
+          "default": "False"
+        }
+      },
+      "states": {}
+    },
+    "Basic Table Header": {
+      "id": "164:18430",
+      "name": "Basic Table Header",
+      "key": "a6347bf6ba549f82bdf9aa85e74b2440f236253c",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:18404",
+          "name": "Cell Type=Heading",
+          "props": {
+            "Cell Type": "Heading"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Cell Type": [
+          "Heading"
+        ]
+      },
+      "props": {
+        "Cell Type": {
+          "values": [
+            "Heading"
+          ],
+          "type": "select",
+          "default": "Heading"
+        }
+      },
+      "states": {}
+    },
+    "Basic Table Cell": {
+      "id": "288:172242",
+      "name": "Basic Table Cell",
+      "key": "a210b50115154a8e9d83a790d739e7e05530b910",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:18405",
+          "name": "Parity=Odd, Alignment=Left",
+          "props": {
+            "Parity": "Odd",
+            "Alignment": "Left"
+          }
+        },
+        {
+          "id": "164:18406",
+          "name": "Parity=Even, Alignment=Left",
+          "props": {
+            "Parity": "Even",
+            "Alignment": "Left"
+          }
+        },
+        {
+          "id": "164:18522",
+          "name": "Parity=Odd, Alignment=Right",
+          "props": {
+            "Parity": "Odd",
+            "Alignment": "Right"
+          }
+        },
+        {
+          "id": "164:18524",
+          "name": "Parity=Even, Alignment=Right",
+          "props": {
+            "Parity": "Even",
+            "Alignment": "Right"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Parity": [
+          "Even",
+          "Odd"
+        ],
+        "Alignment": [
+          "Left",
+          "Right"
+        ]
+      },
+      "props": {
+        "Parity": {
+          "values": [
+            "Even",
+            "Odd"
+          ],
+          "type": "select",
+          "default": "Even"
+        },
+        "Alignment": {
+          "values": [
+            "Left",
+            "Right"
+          ],
+          "type": "select",
+          "default": "Left"
+        }
+      },
+      "states": {}
+    },
+    "Tab": {
+      "id": "9:634",
+      "name": "Tab",
+      "key": "ad3590c8c8e7e9eda25fe4a310c14d8d8520e9b4",
+      "description": "",
+      "variants": [
+        {
+          "id": "9:637",
+          "name": "Size=Regular, Content=Label, State=Inactive",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "9:997",
+          "name": "Size=Regular, Content=Icon, State=Inactive",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "89:9807",
+          "name": "Size=Regular, Content=Icon + Label, State=Inactive",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:43683",
+          "name": "Size=Regular, Content=Label, State=Inactive Hover",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:43910",
+          "name": "Size=Regular, Content=Icon, State=Inactive Hover",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:43740",
+          "name": "Size=Regular, Content=Icon + Label, State=Inactive Hover",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "9:635",
+          "name": "Size=Regular, Content=Label, State=Active",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "20:5142",
+          "name": "Size=Regular, Content=Icon, State=Active",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "89:9805",
+          "name": "Size=Regular, Content=Icon + Label, State=Active",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:43703",
+          "name": "Size=Regular, Content=Label, State=Active Focus",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:43978",
+          "name": "Size=Regular, Content=Icon, State=Active Focus",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:43842",
+          "name": "Size=Regular, Content=Icon + Label, State=Active Focus",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:43711",
+          "name": "Size=Regular, Content=Label, State=Disabled",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:43918",
+          "name": "Size=Regular, Content=Icon, State=Disabled",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:43774",
+          "name": "Size=Regular, Content=Icon + Label, State=Disabled",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:43719",
+          "name": "Size=Regular, Content=Label, State=Inactive Focus",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:43914",
+          "name": "Size=Regular, Content=Icon, State=Inactive Focus",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:43808",
+          "name": "Size=Regular, Content=Icon + Label, State=Inactive Focus",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:44685",
+          "name": "Size=Large, Content=Label, State=Inactive",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:44688",
+          "name": "Size=Large, Content=Icon, State=Inactive",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:44691",
+          "name": "Size=Large, Content=Icon + Label, State=Inactive",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:44695",
+          "name": "Size=Large, Content=Label, State=Inactive Hover",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:44698",
+          "name": "Size=Large, Content=Icon, State=Inactive Hover",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:44701",
+          "name": "Size=Large, Content=Icon + Label, State=Inactive Hover",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:44705",
+          "name": "Size=Large, Content=Label, State=Active",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:44708",
+          "name": "Size=Large, Content=Icon, State=Active",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:44711",
+          "name": "Size=Large, Content=Icon + Label, State=Active",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:44715",
+          "name": "Size=Large, Content=Label, State=Active Focus",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:44718",
+          "name": "Size=Large, Content=Icon, State=Active Focus",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:44721",
+          "name": "Size=Large, Content=Icon + Label, State=Active Focus",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:44725",
+          "name": "Size=Large, Content=Label, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:44728",
+          "name": "Size=Large, Content=Icon, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:44731",
+          "name": "Size=Large, Content=Icon + Label, State=Disabled",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:44735",
+          "name": "Size=Large, Content=Label, State=Inactive Focus",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:44738",
+          "name": "Size=Large, Content=Icon, State=Inactive Focus",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:44741",
+          "name": "Size=Large, Content=Icon + Label, State=Inactive Focus",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:45573",
+          "name": "Size=Small, Content=Label, State=Inactive",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:45576",
+          "name": "Size=Small, Content=Icon, State=Inactive",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:45579",
+          "name": "Size=Small, Content=Icon + Label, State=Inactive",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "State": "Inactive"
+          }
+        },
+        {
+          "id": "189:45583",
+          "name": "Size=Small, Content=Label, State=Inactive Hover",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:45586",
+          "name": "Size=Small, Content=Icon, State=Inactive Hover",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:45589",
+          "name": "Size=Small, Content=Icon + Label, State=Inactive Hover",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "State": "Inactive Hover"
+          }
+        },
+        {
+          "id": "189:45593",
+          "name": "Size=Small, Content=Label, State=Active",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:45596",
+          "name": "Size=Small, Content=Icon, State=Active",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:45599",
+          "name": "Size=Small, Content=Icon + Label, State=Active",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "State": "Active"
+          }
+        },
+        {
+          "id": "189:45603",
+          "name": "Size=Small, Content=Label, State=Active Focus",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:45606",
+          "name": "Size=Small, Content=Icon, State=Active Focus",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:45609",
+          "name": "Size=Small, Content=Icon + Label, State=Active Focus",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "State": "Active Focus"
+          }
+        },
+        {
+          "id": "189:45613",
+          "name": "Size=Small, Content=Label, State=Disabled",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:45616",
+          "name": "Size=Small, Content=Icon, State=Disabled",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:45619",
+          "name": "Size=Small, Content=Icon + Label, State=Disabled",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:45623",
+          "name": "Size=Small, Content=Label, State=Inactive Focus",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:45626",
+          "name": "Size=Small, Content=Icon, State=Inactive Focus",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "State": "Inactive Focus"
+          }
+        },
+        {
+          "id": "189:45629",
+          "name": "Size=Small, Content=Icon + Label, State=Inactive Focus",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "State": "Inactive Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Size": [
+          "Large",
+          "Regular",
+          "Small"
+        ],
+        "Content": [
+          "Icon",
+          "Icon + Label",
+          "Label"
+        ],
+        "State": [
+          "Active",
+          "Active Focus",
+          "Disabled",
+          "Inactive",
+          "Inactive Focus",
+          "Inactive Hover"
+        ]
+      },
+      "props": {
+        "Size": {
+          "values": [
+            "Large",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        },
+        "Content": {
+          "values": [
+            "Icon",
+            "Icon + Label",
+            "Label"
+          ],
+          "type": "select",
+          "default": "Icon"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Active",
+            "Active Focus",
+            "Disabled",
+            "Inactive",
+            "Inactive Focus",
+            "Inactive Hover"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Tabs": {
+      "id": "9:639",
+      "name": "Tabs",
+      "key": "044936adf20b4f86f4379067abb6d3add6a2b756",
+      "description": "",
+      "variants": [
+        {
+          "id": "9:640",
+          "name": "Size=Regular, Content=Label, Parts=2 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "68:6587",
+          "name": "Size=Regular, Content=Icon, Parts=2 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:42603",
+          "name": "Size=Regular, Content=Icon + Label, Parts=2 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "68:6537",
+          "name": "Size=Regular, Content=Label, Parts=3 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "68:6649",
+          "name": "Size=Regular, Content=Icon, Parts=3 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:42607",
+          "name": "Size=Regular, Content=Icon + Label, Parts=3 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "9:652",
+          "name": "Size=Regular, Content=Label, Parts=4 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "68:6737",
+          "name": "Size=Regular, Content=Icon, Parts=4 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:42612",
+          "name": "Size=Regular, Content=Icon + Label, Parts=4 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "9:645",
+          "name": "Size=Regular, Content=Label, Parts=5 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Label",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "68:6853",
+          "name": "Size=Regular, Content=Icon, Parts=5 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:42618",
+          "name": "Size=Regular, Content=Icon + Label, Parts=5 Parts",
+          "props": {
+            "Size": "Regular",
+            "Content": "Icon + Label",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:46387",
+          "name": "Size=Large, Content=Label, Parts=2 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:46391",
+          "name": "Size=Large, Content=Icon, Parts=2 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:46395",
+          "name": "Size=Large, Content=Icon + Label, Parts=2 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:46399",
+          "name": "Size=Large, Content=Label, Parts=3 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:46404",
+          "name": "Size=Large, Content=Icon, Parts=3 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:46409",
+          "name": "Size=Large, Content=Icon + Label, Parts=3 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:46414",
+          "name": "Size=Large, Content=Label, Parts=4 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:46420",
+          "name": "Size=Large, Content=Icon, Parts=4 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:46426",
+          "name": "Size=Large, Content=Icon + Label, Parts=4 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:46432",
+          "name": "Size=Large, Content=Label, Parts=5 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Label",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:46439",
+          "name": "Size=Large, Content=Icon, Parts=5 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:46446",
+          "name": "Size=Large, Content=Icon + Label, Parts=5 Parts",
+          "props": {
+            "Size": "Large",
+            "Content": "Icon + Label",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:47961",
+          "name": "Size=Small, Content=Label, Parts=2 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:47965",
+          "name": "Size=Small, Content=Icon, Parts=2 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:47969",
+          "name": "Size=Small, Content=Icon + Label, Parts=2 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "Parts": "2 Parts"
+          }
+        },
+        {
+          "id": "189:47973",
+          "name": "Size=Small, Content=Label, Parts=3 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:47978",
+          "name": "Size=Small, Content=Icon, Parts=3 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:47983",
+          "name": "Size=Small, Content=Icon + Label, Parts=3 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "Parts": "3 Parts"
+          }
+        },
+        {
+          "id": "189:47988",
+          "name": "Size=Small, Content=Label, Parts=4 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:47994",
+          "name": "Size=Small, Content=Icon, Parts=4 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:48000",
+          "name": "Size=Small, Content=Icon + Label, Parts=4 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "Parts": "4 Parts"
+          }
+        },
+        {
+          "id": "189:48006",
+          "name": "Size=Small, Content=Label, Parts=5 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Label",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:48013",
+          "name": "Size=Small, Content=Icon, Parts=5 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon",
+            "Parts": "5 Parts"
+          }
+        },
+        {
+          "id": "189:48020",
+          "name": "Size=Small, Content=Icon + Label, Parts=5 Parts",
+          "props": {
+            "Size": "Small",
+            "Content": "Icon + Label",
+            "Parts": "5 Parts"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Size": [
+          "Large",
+          "Regular",
+          "Small"
+        ],
+        "Content": [
+          "Icon",
+          "Icon + Label",
+          "Label"
+        ],
+        "Parts": [
+          "2 Parts",
+          "3 Parts",
+          "4 Parts",
+          "5 Parts"
+        ]
+      },
+      "props": {
+        "Size": {
+          "values": [
+            "Large",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        },
+        "Content": {
+          "values": [
+            "Icon",
+            "Icon + Label",
+            "Label"
+          ],
+          "type": "select",
+          "default": "Icon"
+        },
+        "Parts": {
+          "values": [
+            "2 Parts",
+            "3 Parts",
+            "4 Parts",
+            "5 Parts"
+          ],
+          "type": "select",
+          "default": "2 Parts"
+        }
+      },
+      "states": {}
+    },
+    "Toggle Button": {
+      "id": "816:112827",
+      "name": "Toggle Button",
+      "key": "519b0c1f0fd30452cc30020c91367cb6bcd880ea",
+      "description": "",
+      "variants": [
+        {
+          "id": "816:112828",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112838",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112848",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:112858",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:112868",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:112878",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:112888",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112898",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112908",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:112918",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:112928",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:112938",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:112948",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112958",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112968",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112978",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:112988",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:112998",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113008",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113018",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113028",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113038",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113048",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113058",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113068",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113078",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113088",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113098",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113108",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113118",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113128",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113138",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113148",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113158",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113168",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113178",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113188",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113198",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113208",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113218",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113228",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113238",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113248",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113258",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113268",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113278",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113288",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113298",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113308",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113318",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113328",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113338",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113348",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113358",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113368",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113378",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113388",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113398",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113408",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113418",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113428",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113438",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113448",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113458",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113468",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113478",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113488",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113498",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113508",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113518",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113528",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113538",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113548",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113558",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113568",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113578",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113588",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113598",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113608",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113618",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113628",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113638",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113648",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113658",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113668",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113678",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113688",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113698",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113708",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113718",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113728",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113738",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113748",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113758",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113768",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113778",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113788",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113798",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113808",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113818",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113828",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113838",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113848",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113858",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113868",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113878",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113888",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113898",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113908",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113918",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113928",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113938",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:113948",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113958",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113968",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113978",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:113988",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:113998",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114008",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114018",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114028",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114038",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114048",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114058",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114068",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114078",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114088",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114098",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114108",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114118",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114128",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114138",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114148",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114158",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114168",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114178",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114188",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114198",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114208",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114218",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114228",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114238",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114248",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114258",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114268",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114278",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114288",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114298",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114308",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114318",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114328",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114338",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114348",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114358",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114368",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114378",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114388",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114398",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114408",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114418",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114428",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114438",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114448",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114458",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114468",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114478",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114488",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114498",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114508",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114518",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114528",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114538",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114548",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114558",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114568",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114578",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114588",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114598",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114608",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114618",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114628",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114638",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114648",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114658",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114668",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114678",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114688",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114698",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114708",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114718",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114728",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114738",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114748",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114758",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114768",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114778",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114788",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114798",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114808",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114818",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114828",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114838",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114848",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114858",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114868",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114878",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114888",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114898",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114908",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114918",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114928",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114938",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:114948",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114958",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114968",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114978",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:114988",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:114998",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115008",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115018",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115028",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115038",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115048",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115058",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115068",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115078",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115088",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115098",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115108",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115118",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115128",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115138",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115148",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115158",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115168",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115178",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115188",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115198",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115208",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115218",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115228",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115238",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115248",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115258",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115268",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115278",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115288",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115298",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115308",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115318",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115328",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115338",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115348",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115358",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115368",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115378",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115388",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115398",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115408",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115418",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115428",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115438",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115448",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115458",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115468",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115478",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115488",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115498",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115508",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115518",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115528",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115538",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115548",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115558",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115568",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115578",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115588",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115598",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115608",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115618",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115628",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115638",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115648",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115658",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115668",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115678",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115688",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115698",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115708",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115718",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115728",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115738",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115748",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115758",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115768",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115778",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115788",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115798",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115808",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115818",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115828",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115838",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115848",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115858",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115868",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115878",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115888",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115898",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115908",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115918",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115928",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115938",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115948",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115958",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:115968",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115978",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:115988",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:115998",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116008",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116018",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116028",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116038",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116048",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116058",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116068",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116078",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116088",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116098",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116108",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116118",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116128",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116138",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116148",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116158",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116168",
+          "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116178",
+          "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116188",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116198",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116208",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116218",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116228",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116238",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116248",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116258",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116268",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116278",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116288",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116298",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116308",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116318",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116328",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116338",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116348",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116358",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116368",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116378",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116388",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116398",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116408",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116418",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116428",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116438",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116448",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116458",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116468",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116478",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116488",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116498",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116508",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116518",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116528",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116538",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116548",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116558",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116568",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116578",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "816:116588",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116598",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116608",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116618",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "816:116628",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116638",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116648",
+          "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "816:116658",
+          "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Regular",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Skin": [
+          "Ghost",
+          "Outlined"
+        ],
+        "Size": [
+          "Large",
+          "Mini",
+          "Regular",
+          "Small"
+        ],
+        "Position": [
+          "Left",
+          "Middle",
+          "Right",
+          "Single"
+        ],
+        "Active?": [
+          "No",
+          "Yes"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Skin": {
+          "values": [
+            "Ghost",
+            "Outlined"
+          ],
+          "type": "select",
+          "default": "Ghost"
+        },
+        "Size": {
+          "values": [
+            "Large",
+            "Mini",
+            "Regular",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Large"
+        },
+        "Position": {
+          "values": [
+            "Left",
+            "Middle",
+            "Right",
+            "Single"
+          ],
+          "type": "select",
+          "default": "Left"
+        },
+        "Active?": {
+          "values": [
+            "No",
+            "Yes"
+          ],
+          "type": "select",
+          "default": "No"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Toggle Icon Button": {
+      "id": "164:20378",
+      "name": "Toggle Icon Button",
+      "key": "a3063d20b721e640ffdb14883cf08c3eea38be08",
+      "description": "",
+      "variants": [
+        {
+          "id": "164:20361",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20348",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21362",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21356",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22370",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22364",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23743",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23737",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44402",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44396",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44306",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44300",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44210",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44204",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44114",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44108",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20363",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20345",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21366",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21360",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22374",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22368",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23747",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23741",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44406",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44400",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44310",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44304",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44214",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44208",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44118",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44112",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20347",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20346",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21364",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21358",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22372",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22366",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23745",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23739",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44404",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44398",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44308",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44302",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44212",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44206",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44116",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44110",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20373",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20353",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21350",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21344",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22358",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22352",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23731",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23725",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44390",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44384",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44294",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44288",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44198",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44192",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44102",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44096",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20376",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20360",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21354",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21348",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22362",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22356",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23735",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23729",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44394",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44388",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44298",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44292",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44202",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44196",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44106",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44100",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20349",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20350",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21352",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21346",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22360",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22354",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23733",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23727",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44392",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44386",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44296",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44290",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44200",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44194",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44104",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44098",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20342",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20357",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21374",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21368",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22382",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22376",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23755",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23749",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44420",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44408",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44324",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44312",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44228",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44216",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44132",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44120",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20351",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20343",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21378",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21372",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22386",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22380",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23759",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23753",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44428",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44416",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44332",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44320",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44236",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44224",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44140",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44128",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20366",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20344",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21376",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21370",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22384",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22378",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23757",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23751",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44424",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44412",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44328",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44316",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44232",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44220",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44136",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44124",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33414",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33390",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33416",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33392",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33418",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33394",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33420",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33396",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44422",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44410",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44326",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44314",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44230",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44218",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44134",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44122",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:33430",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33406",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33432",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33408",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33434",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33410",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33436",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33412",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44430",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44418",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44334",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44322",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44238",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44226",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44142",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44130",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:33422",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33398",
+          "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33424",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33400",
+          "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33426",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33402",
+          "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33428",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:33404",
+          "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44426",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44414",
+          "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44330",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44318",
+          "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44234",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44222",
+          "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44138",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44126",
+          "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Outlined",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20364",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20367",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21326",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21320",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22334",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22328",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23707",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23701",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44354",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44348",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44258",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44252",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44162",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44156",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44066",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44060",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20372",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20368",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21330",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21324",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22338",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22332",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23711",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23705",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44358",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44352",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44262",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44256",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44166",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44160",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44070",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44064",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20359",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20365",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21328",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21322",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22336",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22330",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23709",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23703",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44356",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44350",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44260",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44254",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44164",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44158",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44068",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44062",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Left",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20377",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20370",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21314",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21308",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22322",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22316",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23695",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23689",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44342",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44336",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44246",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44240",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44150",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44144",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44054",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44048",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20369",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20374",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21318",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21312",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22326",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22320",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23699",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23693",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44346",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44340",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44250",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44244",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44154",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44148",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44058",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44052",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20371",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20375",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21316",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21310",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22324",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22318",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23697",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23691",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44344",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44338",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44248",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44242",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44152",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44146",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44056",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44050",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Middle",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20352",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20354",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21338",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:21332",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22346",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:22340",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23719",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:23713",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44372",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44360",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44276",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44264",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44180",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44168",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44084",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44072",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "164:20362",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20356",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21342",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:21336",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22350",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:22344",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23723",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:23717",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44380",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44368",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44284",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44272",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44188",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44176",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44092",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44080",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "164:20355",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:20358",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21340",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:21334",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22348",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:22342",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23721",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "164:23715",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44376",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44364",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44280",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44268",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44184",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44172",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44088",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44076",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Right",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32742",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32718",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32744",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32720",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32746",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32722",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32748",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32724",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44374",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44362",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44278",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44266",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44182",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44170",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44086",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "761:44074",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Default"
+          }
+        },
+        {
+          "id": "189:32758",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32734",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32760",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32736",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32762",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32738",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32764",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32740",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44382",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44370",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44286",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44274",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44190",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44178",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44094",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "761:44082",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Disabled"
+          }
+        },
+        {
+          "id": "189:32750",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32726",
+          "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32752",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32728",
+          "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32754",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32730",
+          "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32756",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "189:32732",
+          "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Default",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44378",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44366",
+          "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Default",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44282",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44270",
+          "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Large",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44186",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44174",
+          "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Small",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44090",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "Yes",
+            "State": "Focus"
+          }
+        },
+        {
+          "id": "761:44078",
+          "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+          "props": {
+            "Roundness": "Round",
+            "Skin": "Ghost",
+            "Size": "Mini",
+            "Position": "Single",
+            "Active?": "No",
+            "State": "Focus"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Roundness": [
+          "Default",
+          "Round"
+        ],
+        "Skin": [
+          "Ghost",
+          "Outlined"
+        ],
+        "Size": [
+          "Default",
+          "Large",
+          "Mini",
+          "Small"
+        ],
+        "Position": [
+          "Left",
+          "Middle",
+          "Right",
+          "Single"
+        ],
+        "Active?": [
+          "No",
+          "Yes"
+        ],
+        "State": [
+          "Default",
+          "Disabled",
+          "Focus"
+        ]
+      },
+      "props": {
+        "Roundness": {
+          "values": [
+            "Default",
+            "Round"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Skin": {
+          "values": [
+            "Ghost",
+            "Outlined"
+          ],
+          "type": "select",
+          "default": "Ghost"
+        },
+        "Size": {
+          "values": [
+            "Default",
+            "Large",
+            "Mini",
+            "Small"
+          ],
+          "type": "select",
+          "default": "Default"
+        },
+        "Position": {
+          "values": [
+            "Left",
+            "Middle",
+            "Right",
+            "Single"
+          ],
+          "type": "select",
+          "default": "Left"
+        },
+        "Active?": {
+          "values": [
+            "No",
+            "Yes"
+          ],
+          "type": "select",
+          "default": "No"
+        }
+      },
+      "states": {
+        "State": {
+          "values": [
+            "Default",
+            "Disabled",
+            "Focus"
+          ],
+          "css_pseudo": ""
+        }
+      }
+    },
+    "Tooltip": {
+      "id": "133:14788",
+      "name": "Tooltip",
+      "key": "896c89416627193c50121e88d87bdb1576750180",
+      "description": "",
+      "variants": [
+        {
+          "id": "133:14785",
+          "name": "Side=Top",
+          "props": {
+            "Side": "Top"
+          }
+        },
+        {
+          "id": "133:14787",
+          "name": "Side=Bottom",
+          "props": {
+            "Side": "Bottom"
+          }
+        },
+        {
+          "id": "133:14786",
+          "name": "Side=Left",
+          "props": {
+            "Side": "Left"
+          }
+        },
+        {
+          "id": "133:14784",
+          "name": "Side=Right",
+          "props": {
+            "Side": "Right"
+          }
+        }
+      ],
+      "variant_dimensions": {
+        "Side": [
+          "Bottom",
+          "Left",
+          "Right",
+          "Top"
+        ]
+      },
+      "props": {
+        "Side": {
+          "values": [
+            "Bottom",
+            "Left",
+            "Right",
+            "Top"
+          ],
+          "type": "select",
+          "default": "Bottom"
+        }
+      },
+      "states": {}
+    }
+  }
+}
\ No newline at end of file
diff --git a/.dss/components/shadcn-registry.json b/.dss/components/shadcn-registry.json
new file mode 100644
index 0000000..2dc1ce4
--- /dev/null
+++ b/.dss/components/shadcn-registry.json
@@ -0,0 +1,837 @@
+{
+  "_meta": {
+    "description": "shadcn/ui Component Registry - All 59 components with variants and tokens",
+    "version": "1.0.0",
+    "source": "https://ui.shadcn.com/docs/components",
+    "lastUpdated": "2025-12-10"
+  },
+
+  "components": {
+    "accordion": {
+      "name": "Accordion",
+      "category": "data-display",
+      "description": "A vertically stacked set of interactive headings that reveal content sections",
+      "radixPrimitive": "@radix-ui/react-accordion",
+      "variants": {},
+      "tokens": {
+        "background": "var(--color-background)",
+        "border": "var(--color-border)",
+        "text": "var(--color-foreground)"
+      }
+    },
+
+    "alert": {
+      "name": "Alert",
+      "category": "feedback",
+      "description": "Displays a callout for user attention",
+      "variants": {
+        "variant": ["default", "destructive"]
+      },
+      "tokens": {
+        "background": "var(--color-background)",
+        "border": "var(--color-border)",
+        "foreground": "var(--color-foreground)",
+        "destructive": "var(--color-destructive)"
+      }
+    },
+
+    "alert-dialog": {
+      "name": "Alert Dialog",
+      "category": "overlay",
+      "description": "A modal dialog that interrupts user flow with important information",
+      "radixPrimitive": "@radix-ui/react-alert-dialog",
+      "tokens": {
+        "overlay": "var(--color-background)/80",
+        "background": "var(--color-background)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "aspect-ratio": {
+      "name": "Aspect Ratio",
+      "category": "layout",
+      "description": "Displays content with a desired aspect ratio",
+      "radixPrimitive": "@radix-ui/react-aspect-ratio"
+    },
+
+    "avatar": {
+      "name": "Avatar",
+      "category": "data-display",
+      "description": "An image element with a fallback for user profile images",
+      "radixPrimitive": "@radix-ui/react-avatar",
+      "variants": {
+        "size": ["sm", "md", "lg"]
+      },
+      "tokens": {
+        "background": "var(--color-muted)",
+        "fallback": "var(--color-muted-foreground)"
+      }
+    },
+
+    "badge": {
+      "name": "Badge",
+      "category": "data-display",
+      "description": "Displays a badge or label",
+      "variants": {
+        "variant": ["default", "secondary", "destructive", "outline"]
+      },
+      "tokens": {
+        "default": {
+          "background": "var(--color-primary)",
+          "text": "var(--color-primary-foreground)"
+        },
+        "secondary": {
+          "background": "var(--color-secondary)",
+          "text": "var(--color-secondary-foreground)"
+        },
+        "destructive": {
+          "background": "var(--color-destructive)",
+          "text": "var(--color-destructive-foreground)"
+        },
+        "outline": {
+          "border": "var(--color-border)",
+          "text": "var(--color-foreground)"
+        }
+      }
+    },
+
+    "breadcrumb": {
+      "name": "Breadcrumb",
+      "category": "navigation",
+      "description": "Displays the path to the current page in a hierarchy",
+      "tokens": {
+        "text": "var(--color-muted-foreground)",
+        "active": "var(--color-foreground)",
+        "separator": "var(--color-muted-foreground)"
+      }
+    },
+
+    "button": {
+      "name": "Button",
+      "category": "form",
+      "description": "Displays a button or a component that looks like a button",
+      "variants": {
+        "variant": ["default", "destructive", "outline", "secondary", "ghost", "link"],
+        "size": ["default", "sm", "lg", "icon", "icon-sm", "icon-lg"]
+      },
+      "tokens": {
+        "default": {
+          "background": "var(--color-primary)",
+          "text": "var(--color-primary-foreground)",
+          "hover": "var(--color-primary)/90"
+        },
+        "destructive": {
+          "background": "var(--color-destructive)",
+          "text": "var(--color-destructive-foreground)",
+          "hover": "var(--color-destructive)/90"
+        },
+        "outline": {
+          "border": "var(--color-input)",
+          "background": "var(--color-background)",
+          "text": "var(--color-foreground)",
+          "hover": "var(--color-accent)"
+        },
+        "secondary": {
+          "background": "var(--color-secondary)",
+          "text": "var(--color-secondary-foreground)",
+          "hover": "var(--color-secondary)/80"
+        },
+        "ghost": {
+          "text": "var(--color-foreground)",
+          "hover": "var(--color-accent)"
+        },
+        "link": {
+          "text": "var(--color-primary)"
+        }
+      },
+      "sizing": {
+        "default": { "height": "2.5rem", "px": "1rem", "py": "0.5rem" },
+        "sm": { "height": "2rem", "px": "0.75rem" },
+        "lg": { "height": "3rem", "px": "2rem" },
+        "icon": { "size": "2.5rem" },
+        "icon-sm": { "size": "2rem" },
+        "icon-lg": { "size": "2.75rem" }
+      }
+    },
+
+    "button-group": {
+      "name": "Button Group",
+      "category": "form",
+      "description": "Groups multiple buttons together",
+      "tokens": {
+        "gap": "var(--spacing-1)"
+      }
+    },
+
+    "calendar": {
+      "name": "Calendar",
+      "category": "form",
+      "description": "A date picker component with monthly/yearly views",
+      "dependencies": ["react-day-picker"],
+      "tokens": {
+        "background": "var(--color-background)",
+        "text": "var(--color-foreground)",
+        "selected": "var(--color-primary)",
+        "today": "var(--color-accent)"
+      }
+    },
+
+    "card": {
+      "name": "Card",
+      "category": "layout",
+      "description": "Displays a card with header, content, and footer",
+      "subComponents": ["CardHeader", "CardTitle", "CardDescription", "CardContent", "CardFooter"],
+      "tokens": {
+        "background": "var(--color-card)",
+        "foreground": "var(--color-card-foreground)",
+        "border": "var(--color-border)",
+        "shadow": "var(--shadow-sm)"
+      }
+    },
+
+    "carousel": {
+      "name": "Carousel",
+      "category": "data-display",
+      "description": "A carousel with embla-carousel",
+      "dependencies": ["embla-carousel-react"],
+      "tokens": {
+        "button": "var(--color-background)",
+        "indicator": "var(--color-muted)"
+      }
+    },
+
+    "chart": {
+      "name": "Chart",
+      "category": "data-display",
+      "description": "Beautiful charts using Recharts",
+      "dependencies": ["recharts"],
+      "tokens": {
+        "colors": ["var(--chart-1)", "var(--chart-2)", "var(--chart-3)", "var(--chart-4)", "var(--chart-5)"]
+      }
+    },
+
+    "checkbox": {
+      "name": "Checkbox",
+      "category": "form",
+      "description": "A control that allows toggling between checked and unchecked",
+      "radixPrimitive": "@radix-ui/react-checkbox",
+      "tokens": {
+        "border": "var(--color-primary)",
+        "checked": "var(--color-primary)",
+        "checkmark": "var(--color-primary-foreground)"
+      }
+    },
+
+    "collapsible": {
+      "name": "Collapsible",
+      "category": "data-display",
+      "description": "An interactive component that expands/collapses content",
+      "radixPrimitive": "@radix-ui/react-collapsible"
+    },
+
+    "combobox": {
+      "name": "Combobox",
+      "category": "form",
+      "description": "Autocomplete input with command palette",
+      "composedOf": ["command", "popover"],
+      "tokens": {
+        "input": "var(--color-input)",
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)"
+      }
+    },
+
+    "command": {
+      "name": "Command",
+      "category": "form",
+      "description": "Command palette with search and filtering",
+      "dependencies": ["cmdk"],
+      "tokens": {
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)",
+        "separator": "var(--color-border)"
+      }
+    },
+
+    "context-menu": {
+      "name": "Context Menu",
+      "category": "overlay",
+      "description": "Right-click context menu with keyboard support",
+      "radixPrimitive": "@radix-ui/react-context-menu",
+      "tokens": {
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)",
+        "hover": "var(--color-accent)"
+      }
+    },
+
+    "data-table": {
+      "name": "Data Table",
+      "category": "data-display",
+      "description": "Powerful table with sorting, filtering, pagination",
+      "dependencies": ["@tanstack/react-table"],
+      "composedOf": ["table", "dropdown-menu", "button", "input"],
+      "tokens": {
+        "header": "var(--color-muted)",
+        "row": "var(--color-background)",
+        "rowHover": "var(--color-muted)/50",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "date-picker": {
+      "name": "Date Picker",
+      "category": "form",
+      "description": "A date picker built with calendar and popover",
+      "composedOf": ["calendar", "popover", "button"],
+      "tokens": {
+        "input": "var(--color-input)",
+        "background": "var(--color-popover)"
+      }
+    },
+
+    "dialog": {
+      "name": "Dialog",
+      "category": "overlay",
+      "description": "A modal dialog for content display",
+      "radixPrimitive": "@radix-ui/react-dialog",
+      "subComponents": ["DialogTrigger", "DialogContent", "DialogHeader", "DialogFooter", "DialogTitle", "DialogDescription"],
+      "tokens": {
+        "overlay": "var(--color-background)/80",
+        "background": "var(--color-background)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "drawer": {
+      "name": "Drawer",
+      "category": "overlay",
+      "description": "A drawer component extending dialog",
+      "dependencies": ["vaul"],
+      "tokens": {
+        "background": "var(--color-background)",
+        "handle": "var(--color-muted)"
+      }
+    },
+
+    "dropdown-menu": {
+      "name": "Dropdown Menu",
+      "category": "overlay",
+      "description": "Menu displayed on trigger interaction",
+      "radixPrimitive": "@radix-ui/react-dropdown-menu",
+      "tokens": {
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)",
+        "hover": "var(--color-accent)",
+        "separator": "var(--color-border)"
+      }
+    },
+
+    "empty": {
+      "name": "Empty",
+      "category": "feedback",
+      "description": "Empty state display",
+      "tokens": {
+        "icon": "var(--color-muted-foreground)",
+        "text": "var(--color-muted-foreground)"
+      }
+    },
+
+    "field": {
+      "name": "Field",
+      "category": "form",
+      "description": "Form field wrapper with label and error",
+      "composedOf": ["label", "input"],
+      "tokens": {
+        "label": "var(--color-foreground)",
+        "error": "var(--color-destructive)"
+      }
+    },
+
+    "form": {
+      "name": "Form",
+      "category": "form",
+      "description": "Form component with react-hook-form integration",
+      "dependencies": ["react-hook-form", "@hookform/resolvers", "zod"],
+      "tokens": {
+        "label": "var(--color-foreground)",
+        "description": "var(--color-muted-foreground)",
+        "error": "var(--color-destructive)"
+      }
+    },
+
+    "hover-card": {
+      "name": "Hover Card",
+      "category": "overlay",
+      "description": "Content appearing on hover",
+      "radixPrimitive": "@radix-ui/react-hover-card",
+      "tokens": {
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "input": {
+      "name": "Input",
+      "category": "form",
+      "description": "Text input field",
+      "tokens": {
+        "background": "var(--color-background)",
+        "border": "var(--color-input)",
+        "text": "var(--color-foreground)",
+        "placeholder": "var(--color-muted-foreground)",
+        "focus": "var(--color-ring)"
+      }
+    },
+
+    "input-group": {
+      "name": "Input Group",
+      "category": "form",
+      "description": "Group of inputs with addons",
+      "tokens": {
+        "addon": "var(--color-muted)"
+      }
+    },
+
+    "input-otp": {
+      "name": "Input OTP",
+      "category": "form",
+      "description": "One-time password input",
+      "dependencies": ["input-otp"],
+      "tokens": {
+        "border": "var(--color-input)",
+        "focus": "var(--color-ring)"
+      }
+    },
+
+    "item": {
+      "name": "Item",
+      "category": "data-display",
+      "description": "Generic list item component"
+    },
+
+    "kbd": {
+      "name": "Kbd",
+      "category": "data-display",
+      "description": "Keyboard key display",
+      "tokens": {
+        "background": "var(--color-muted)",
+        "text": "var(--color-muted-foreground)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "label": {
+      "name": "Label",
+      "category": "form",
+      "description": "Text label for form elements",
+      "radixPrimitive": "@radix-ui/react-label",
+      "tokens": {
+        "text": "var(--color-foreground)"
+      }
+    },
+
+    "menubar": {
+      "name": "Menubar",
+      "category": "navigation",
+      "description": "Horizontal menu with dropdowns",
+      "radixPrimitive": "@radix-ui/react-menubar",
+      "tokens": {
+        "background": "var(--color-background)",
+        "text": "var(--color-foreground)",
+        "hover": "var(--color-accent)"
+      }
+    },
+
+    "native-select": {
+      "name": "Native Select",
+      "category": "form",
+      "description": "Native HTML select element with styling",
+      "tokens": {
+        "background": "var(--color-background)",
+        "border": "var(--color-input)",
+        "text": "var(--color-foreground)"
+      }
+    },
+
+    "navigation-menu": {
+      "name": "Navigation Menu",
+      "category": "navigation",
+      "description": "Website navigation with mega menus",
+      "radixPrimitive": "@radix-ui/react-navigation-menu",
+      "tokens": {
+        "background": "var(--color-background)",
+        "text": "var(--color-foreground)",
+        "hover": "var(--color-accent)",
+        "indicator": "var(--color-primary)"
+      }
+    },
+
+    "pagination": {
+      "name": "Pagination",
+      "category": "navigation",
+      "description": "Page navigation with previous/next",
+      "tokens": {
+        "text": "var(--color-foreground)",
+        "active": "var(--color-primary)",
+        "disabled": "var(--color-muted-foreground)"
+      }
+    },
+
+    "popover": {
+      "name": "Popover",
+      "category": "overlay",
+      "description": "Floating content panel",
+      "radixPrimitive": "@radix-ui/react-popover",
+      "tokens": {
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "progress": {
+      "name": "Progress",
+      "category": "feedback",
+      "description": "Progress indicator bar",
+      "radixPrimitive": "@radix-ui/react-progress",
+      "tokens": {
+        "background": "var(--color-secondary)",
+        "indicator": "var(--color-primary)"
+      }
+    },
+
+    "radio-group": {
+      "name": "Radio Group",
+      "category": "form",
+      "description": "Set of mutually exclusive options",
+      "radixPrimitive": "@radix-ui/react-radio-group",
+      "tokens": {
+        "border": "var(--color-primary)",
+        "checked": "var(--color-primary)"
+      }
+    },
+
+    "resizable": {
+      "name": "Resizable",
+      "category": "layout",
+      "description": "Resizable panel groups",
+      "dependencies": ["react-resizable-panels"],
+      "tokens": {
+        "handle": "var(--color-border)"
+      }
+    },
+
+    "scroll-area": {
+      "name": "Scroll Area",
+      "category": "layout",
+      "description": "Custom scrollbar styling",
+      "radixPrimitive": "@radix-ui/react-scroll-area",
+      "tokens": {
+        "thumb": "var(--color-border)",
+        "track": "var(--color-muted)"
+      }
+    },
+
+    "select": {
+      "name": "Select",
+      "category": "form",
+      "description": "Custom select dropdown",
+      "radixPrimitive": "@radix-ui/react-select",
+      "tokens": {
+        "trigger": {
+          "background": "var(--color-background)",
+          "border": "var(--color-input)",
+          "text": "var(--color-foreground)"
+        },
+        "content": {
+          "background": "var(--color-popover)",
+          "text": "var(--color-popover-foreground)"
+        },
+        "item": {
+          "hover": "var(--color-accent)"
+        }
+      }
+    },
+
+    "separator": {
+      "name": "Separator",
+      "category": "layout",
+      "description": "Visual divider",
+      "radixPrimitive": "@radix-ui/react-separator",
+      "variants": {
+        "orientation": ["horizontal", "vertical"]
+      },
+      "tokens": {
+        "color": "var(--color-border)"
+      }
+    },
+
+    "sheet": {
+      "name": "Sheet",
+      "category": "overlay",
+      "description": "Side panel overlay",
+      "radixPrimitive": "@radix-ui/react-dialog",
+      "variants": {
+        "side": ["top", "right", "bottom", "left"]
+      },
+      "tokens": {
+        "overlay": "var(--color-background)/80",
+        "background": "var(--color-background)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "sidebar": {
+      "name": "Sidebar",
+      "category": "navigation",
+      "description": "Application sidebar with collapsible sections",
+      "tokens": {
+        "background": "var(--color-sidebar-background)",
+        "text": "var(--color-sidebar-foreground)",
+        "hover": "var(--color-sidebar-accent)",
+        "border": "var(--color-sidebar-border)"
+      }
+    },
+
+    "skeleton": {
+      "name": "Skeleton",
+      "category": "feedback",
+      "description": "Loading placeholder",
+      "tokens": {
+        "background": "var(--color-muted)"
+      }
+    },
+
+    "slider": {
+      "name": "Slider",
+      "category": "form",
+      "description": "Range slider input",
+      "radixPrimitive": "@radix-ui/react-slider",
+      "tokens": {
+        "track": "var(--color-secondary)",
+        "range": "var(--color-primary)",
+        "thumb": "var(--color-background)"
+      }
+    },
+
+    "sonner": {
+      "name": "Sonner",
+      "category": "feedback",
+      "description": "Toast notifications with sonner",
+      "dependencies": ["sonner"],
+      "tokens": {
+        "background": "var(--color-background)",
+        "text": "var(--color-foreground)",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "spinner": {
+      "name": "Spinner",
+      "category": "feedback",
+      "description": "Loading spinner animation",
+      "tokens": {
+        "color": "var(--color-primary)"
+      }
+    },
+
+    "switch": {
+      "name": "Switch",
+      "category": "form",
+      "description": "Toggle switch control",
+      "radixPrimitive": "@radix-ui/react-switch",
+      "tokens": {
+        "background": "var(--color-input)",
+        "checked": "var(--color-primary)",
+        "thumb": "var(--color-background)"
+      }
+    },
+
+    "table": {
+      "name": "Table",
+      "category": "data-display",
+      "description": "Styled HTML table",
+      "subComponents": ["TableHeader", "TableBody", "TableFooter", "TableRow", "TableHead", "TableCell", "TableCaption"],
+      "tokens": {
+        "header": "var(--color-muted)",
+        "row": "var(--color-background)",
+        "rowHover": "var(--color-muted)/50",
+        "border": "var(--color-border)"
+      }
+    },
+
+    "tabs": {
+      "name": "Tabs",
+      "category": "navigation",
+      "description": "Tabbed interface",
+      "radixPrimitive": "@radix-ui/react-tabs",
+      "tokens": {
+        "list": "var(--color-muted)",
+        "trigger": "var(--color-muted-foreground)",
+        "triggerActive": "var(--color-foreground)",
+        "content": "var(--color-background)"
+      }
+    },
+
+    "textarea": {
+      "name": "Textarea",
+      "category": "form",
+      "description": "Multi-line text input",
+      "tokens": {
+        "background": "var(--color-background)",
+        "border": "var(--color-input)",
+        "text": "var(--color-foreground)",
+        "placeholder": "var(--color-muted-foreground)",
+        "focus": "var(--color-ring)"
+      }
+    },
+
+    "toast": {
+      "name": "Toast",
+      "category": "feedback",
+      "description": "Toast notification component",
+      "radixPrimitive": "@radix-ui/react-toast",
+      "variants": {
+        "variant": ["default", "destructive"]
+      },
+      "tokens": {
+        "background": "var(--color-background)",
+        "text": "var(--color-foreground)",
+        "border": "var(--color-border)",
+        "destructive": "var(--color-destructive)"
+      }
+    },
+
+    "toggle": {
+      "name": "Toggle",
+      "category": "form",
+      "description": "Two-state button",
+      "radixPrimitive": "@radix-ui/react-toggle",
+      "variants": {
+        "variant": ["default", "outline"],
+        "size": ["default", "sm", "lg"]
+      },
+      "tokens": {
+        "background": "var(--color-transparent)",
+        "hover": "var(--color-muted)",
+        "active": "var(--color-accent)"
+      }
+    },
+
+    "toggle-group": {
+      "name": "Toggle Group",
+      "category": "form",
+      "description": "Group of toggle buttons",
+      "radixPrimitive": "@radix-ui/react-toggle-group",
+      "tokens": {
+        "background": "var(--color-muted)",
+        "active": "var(--color-background)"
+      }
+    },
+
+    "tooltip": {
+      "name": "Tooltip",
+      "category": "overlay",
+      "description": "Informative popup on hover",
+      "radixPrimitive": "@radix-ui/react-tooltip",
+      "tokens": {
+        "background": "var(--color-popover)",
+        "text": "var(--color-popover-foreground)"
+      }
+    },
+
+    "typography": {
+      "name": "Typography",
+      "category": "data-display",
+      "description": "Text styling components",
+      "subComponents": ["H1", "H2", "H3", "H4", "P", "Lead", "Large", "Small", "Muted", "Blockquote", "InlineCode"],
+      "tokens": {
+        "heading": "var(--color-foreground)",
+        "body": "var(--color-foreground)",
+        "muted": "var(--color-muted-foreground)",
+        "code": "var(--color-foreground)"
+      }
+    }
+  },
+
+  "categories": {
+    "form": {
+      "name": "Form Components",
+      "description": "Input controls and form elements",
+      "components": ["button", "button-group", "calendar", "checkbox", "combobox", "command", "date-picker", "field", "form", "input", "input-group", "input-otp", "label", "native-select", "radio-group", "select", "slider", "switch", "textarea", "toggle", "toggle-group"]
+    },
+    "data-display": {
+      "name": "Data Display",
+      "description": "Components for displaying data",
+      "components": ["accordion", "avatar", "badge", "carousel", "chart", "collapsible", "data-table", "item", "kbd", "table", "typography"]
+    },
+    "feedback": {
+      "name": "Feedback",
+      "description": "User feedback components",
+      "components": ["alert", "empty", "progress", "skeleton", "sonner", "spinner", "toast"]
+    },
+    "navigation": {
+      "name": "Navigation",
+      "description": "Navigation components",
+      "components": ["breadcrumb", "menubar", "navigation-menu", "pagination", "sidebar", "tabs"]
+    },
+    "overlay": {
+      "name": "Overlay",
+      "description": "Modal and overlay components",
+      "components": ["alert-dialog", "context-menu", "dialog", "drawer", "dropdown-menu", "hover-card", "popover", "sheet", "tooltip"]
+    },
+    "layout": {
+      "name": "Layout",
+      "description": "Layout and structure components",
+      "components": ["aspect-ratio", "card", "resizable", "scroll-area", "separator"]
+    }
+  },
+
+  "dependencies": {
+    "core": ["class-variance-authority", "clsx", "tailwind-merge"],
+    "radix": [
+      "@radix-ui/react-accordion",
+      "@radix-ui/react-alert-dialog",
+      "@radix-ui/react-aspect-ratio",
+      "@radix-ui/react-avatar",
+      "@radix-ui/react-checkbox",
+      "@radix-ui/react-collapsible",
+      "@radix-ui/react-context-menu",
+      "@radix-ui/react-dialog",
+      "@radix-ui/react-dropdown-menu",
+      "@radix-ui/react-hover-card",
+      "@radix-ui/react-label",
+      "@radix-ui/react-menubar",
+      "@radix-ui/react-navigation-menu",
+      "@radix-ui/react-popover",
+      "@radix-ui/react-progress",
+      "@radix-ui/react-radio-group",
+      "@radix-ui/react-scroll-area",
+      "@radix-ui/react-select",
+      "@radix-ui/react-separator",
+      "@radix-ui/react-slider",
+      "@radix-ui/react-switch",
+      "@radix-ui/react-tabs",
+      "@radix-ui/react-toast",
+      "@radix-ui/react-toggle",
+      "@radix-ui/react-toggle-group",
+      "@radix-ui/react-tooltip"
+    ],
+    "additional": [
+      "cmdk",
+      "embla-carousel-react",
+      "input-otp",
+      "react-day-picker",
+      "react-hook-form",
+      "@hookform/resolvers",
+      "react-resizable-panels",
+      "recharts",
+      "sonner",
+      "vaul",
+      "zod",
+      "@tanstack/react-table"
+    ]
+  }
+}
diff --git a/.dss/config/figma.json b/.dss/config/figma.json
new file mode 100644
index 0000000..1f76138
--- /dev/null
+++ b/.dss/config/figma.json
@@ -0,0 +1,20 @@
+{
+  "_meta": {
+    "description": "Figma configuration - IMMUTABLE (survives resets)",
+    "protected": true
+  },
+  "token": "figd_ScdBk47HlYEItZbQv2CcF9aq-3TfWbBXN3yoRKWA",
+  "uikit_reference": {
+    "file_key": "evCZlaeZrP7X20NIViSJbl",
+    "name": "Obra-shadcn-ui-uikit",
+    "url": "https://www.figma.com/design/evCZlaeZrP7X20NIViSJbl/Obra-shadcn-ui--uikit-"
+  },
+  "files": [
+    {
+      "key": "evCZlaeZrP7X20NIViSJbl",
+      "name": "Obra-shadcn-ui-uikit",
+      "type": "uikit"
+    }
+  ],
+  "teams": []
+}
diff --git a/.dss/core-hashes.sha256 b/.dss/core-hashes.sha256
new file mode 100644
index 0000000..61e5185
--- /dev/null
+++ b/.dss/core-hashes.sha256
@@ -0,0 +1,29 @@
+# DSS Core Structure Hashes
+# Generated: 2025-12-10T21:38:48-03:00
+# Source: Figma sync pipeline
+# DO NOT EDIT MANUALLY
+
+# Format: SHA256  filepath
+7738ad7d749558ef8e4a9337b3d14ab851bee8b4b241037e2db0a5b33c61c79e  .dss/schema/api.schema.json
+e41f535f7a226d37574b880164f338388b52623ccc14af7b2013ef6ab634e318  .dss/schema/components.schema.json
+aa5a73c08390433b04ec1f96288cfac573fd5397a2d51774c211db2b8876faf9  .dss/schema/guardrails.schema.json
+0d168d0ec2f2c8ab373b02cc42169df45ef5f41e6575493350a5ca4ff6f9797e  .dss/schema/skin-contract.json
+144642ab5d7b89f73138a9176c65fe8ca05ccf9af1e25b3f9589df37c04c8d70  .dss/schema/tokens.schema.json
+57a08fcb06fc9f23617875ec5a28190cae6e5a4b1c66a89072f581405b53d135  .dss/schema/workflows.schema.json
+ef4e720e445987685683a5d76ff2a81efae36e67a6ac9e1b0801775b87c30afd  dss-claude-plugin/core/skins/base.json
+2a709577c30111861b8274f4fe115380436ed943cc6ae3e39140d8a16ccf4bad  dss-claude-plugin/core/skins/classic.json
+5f356bd862f963e2efd06f2b7922792bca795d45516c45563c0371b90b91c2e1  dss-claude-plugin/core/skins/workbench.json
+3242ccb81ca30197e78251453f4594c271afe02502204900329f03ee92a9b7a3  dss/core_tokens/tokens.json
+d2f926b311963cbf5748f99f6fde1f88a04efd0533ea73a90318a78a53dfeafd  .dss/data/_system/components.json
+6ea9af5cc6ea337e3128b7c4395888f51aa5b4208afcc6a77fd4b465efa2222f  .dss/data/_system/styles.json
+d972e3ebdd7ae2e213a3ae79064a6a0d0aa10bfa20e5dfcbe907f2811ebb2593  .dss/data/_system/figma-components.json
+75ecdaeee10d7b0c4383f08b26384fbdf0ac381c99f89cd21ea6b3e4895e3b9d  .dss/data/_system/style-dictionary.config.json
+b9beb00ffd505a040543051544895fd47bfc948cb39f8c7827656872ab236501  .dss/data/_system/themes/_tokens.scss
+b5e5f0c1fa400c0b681caca5aacbfc9e67f44054549af3a43baddf864255b764  .dss/data/_system/themes/tokens.json
+76a0bead01ab199680ec88e06e2ebc17e1962dc7bca8b288a62c3922f9d9e9a7  .dss/data/_system/themes/tokens.css
+0a0d403395d0d87eb9dd70f28c91d69f7637eedb1e2b562a51185d7dfbf3ebfd  .dss/data/_system/analysis-storybook.json
+3242ccb81ca30197e78251453f4594c271afe02502204900329f03ee92a9b7a3  .dss/data/_system/tokens/base.json
+03df370af13ad41d72635e82e81bfbf85f3ee2e5cbe3e66d27222e612c67568b  .dss/data/_system/tokens/resolved-meta.json
+9175c3bf0581b652d10704a2d85f1ec9fc68809e90850c01d9acd1d571618a6a  .dss/data/_system/tokens/tokens.json
+4321119e41b6763a49d654978161b02dead66116ecca6c7f215e021cacfeeab1  .dss/data/_system/ds.config.json
+f74658540c8d2838e17de647f0c788de674e3d95dcebc89bfa103f6dc656487c  .dss/data/_system/analysis-admin-ui.json
diff --git a/.dss/core/primitives.json b/.dss/core/primitives.json
new file mode 100644
index 0000000..8356743
--- /dev/null
+++ b/.dss/core/primitives.json
@@ -0,0 +1,503 @@
+{
+  "_meta": {
+    "description": "Core design primitives - raw values from Tailwind/shadcn palette",
+    "layer": "core",
+    "immutable": true,
+    "version": "1.1.0",
+    "source": "tailwindcss + shadcn/ui"
+  },
+
+  "color": {
+    "_category": "Color Primitives",
+
+    "base": {
+      "_description": "Base colors",
+      "white": { "value": "#ffffff" },
+      "black": { "value": "#000000" },
+      "transparent": { "value": "transparent" }
+    },
+
+    "neutral": {
+      "_description": "Neutral gray scales",
+      "slate": {
+        "50": { "value": "#f8fafc" },
+        "100": { "value": "#f1f5f9" },
+        "200": { "value": "#e2e8f0" },
+        "300": { "value": "#cbd5e1" },
+        "400": { "value": "#94a3b8" },
+        "500": { "value": "#64748b" },
+        "600": { "value": "#475569" },
+        "700": { "value": "#334155" },
+        "800": { "value": "#1e293b" },
+        "900": { "value": "#0f172a" },
+        "950": { "value": "#020617" }
+      },
+      "gray": {
+        "50": { "value": "#f9fafb" },
+        "100": { "value": "#f3f4f6" },
+        "200": { "value": "#e5e7eb" },
+        "300": { "value": "#d1d5db" },
+        "400": { "value": "#9ca3af" },
+        "500": { "value": "#6b7280" },
+        "600": { "value": "#4b5563" },
+        "700": { "value": "#374151" },
+        "800": { "value": "#1f2937" },
+        "900": { "value": "#111827" },
+        "950": { "value": "#030712" }
+      },
+      "zinc": {
+        "50": { "value": "#fafafa" },
+        "100": { "value": "#f4f4f5" },
+        "200": { "value": "#e4e4e7" },
+        "300": { "value": "#d4d4d8" },
+        "400": { "value": "#a1a1aa" },
+        "500": { "value": "#71717a" },
+        "600": { "value": "#52525b" },
+        "700": { "value": "#3f3f46" },
+        "800": { "value": "#27272a" },
+        "900": { "value": "#18181b" },
+        "950": { "value": "#09090b" }
+      },
+      "neutral": {
+        "50": { "value": "#fafafa" },
+        "100": { "value": "#f5f5f5" },
+        "200": { "value": "#e5e5e5" },
+        "300": { "value": "#d4d4d4" },
+        "400": { "value": "#a3a3a3" },
+        "500": { "value": "#737373" },
+        "600": { "value": "#525252" },
+        "700": { "value": "#404040" },
+        "800": { "value": "#262626" },
+        "900": { "value": "#171717" },
+        "950": { "value": "#0a0a0a" }
+      },
+      "stone": {
+        "50": { "value": "#fafaf9" },
+        "100": { "value": "#f5f5f4" },
+        "200": { "value": "#e7e5e4" },
+        "300": { "value": "#d6d3d1" },
+        "400": { "value": "#a8a29e" },
+        "500": { "value": "#78716c" },
+        "600": { "value": "#57534e" },
+        "700": { "value": "#44403c" },
+        "800": { "value": "#292524" },
+        "900": { "value": "#1c1917" },
+        "950": { "value": "#0c0a09" }
+      }
+    },
+
+    "semantic": {
+      "_description": "Semantic color scales",
+      "red": {
+        "50": { "value": "#fef2f2" },
+        "100": { "value": "#fee2e2" },
+        "200": { "value": "#fecaca" },
+        "300": { "value": "#fca5a5" },
+        "400": { "value": "#f87171" },
+        "500": { "value": "#ef4444" },
+        "600": { "value": "#dc2626" },
+        "700": { "value": "#b91c1c" },
+        "800": { "value": "#991b1b" },
+        "900": { "value": "#7f1d1d" },
+        "950": { "value": "#450a0a" }
+      },
+      "orange": {
+        "50": { "value": "#fff7ed" },
+        "100": { "value": "#ffedd5" },
+        "200": { "value": "#fed7aa" },
+        "300": { "value": "#fdba74" },
+        "400": { "value": "#fb923c" },
+        "500": { "value": "#f97316" },
+        "600": { "value": "#ea580c" },
+        "700": { "value": "#c2410c" },
+        "800": { "value": "#9a3412" },
+        "900": { "value": "#7c2d12" },
+        "950": { "value": "#431407" }
+      },
+      "amber": {
+        "50": { "value": "#fffbeb" },
+        "100": { "value": "#fef3c7" },
+        "200": { "value": "#fde68a" },
+        "300": { "value": "#fcd34d" },
+        "400": { "value": "#fbbf24" },
+        "500": { "value": "#f59e0b" },
+        "600": { "value": "#d97706" },
+        "700": { "value": "#b45309" },
+        "800": { "value": "#92400e" },
+        "900": { "value": "#78350f" },
+        "950": { "value": "#451a03" }
+      },
+      "yellow": {
+        "50": { "value": "#fefce8" },
+        "100": { "value": "#fef9c3" },
+        "200": { "value": "#fef08a" },
+        "300": { "value": "#fde047" },
+        "400": { "value": "#facc15" },
+        "500": { "value": "#eab308" },
+        "600": { "value": "#ca8a04" },
+        "700": { "value": "#a16207" },
+        "800": { "value": "#854d0e" },
+        "900": { "value": "#713f12" },
+        "950": { "value": "#422006" }
+      },
+      "lime": {
+        "50": { "value": "#f7fee7" },
+        "100": { "value": "#ecfccb" },
+        "200": { "value": "#d9f99d" },
+        "300": { "value": "#bef264" },
+        "400": { "value": "#a3e635" },
+        "500": { "value": "#84cc16" },
+        "600": { "value": "#65a30d" },
+        "700": { "value": "#4d7c0f" },
+        "800": { "value": "#3f6212" },
+        "900": { "value": "#365314" },
+        "950": { "value": "#1a2e05" }
+      },
+      "green": {
+        "50": { "value": "#f0fdf4" },
+        "100": { "value": "#dcfce7" },
+        "200": { "value": "#bbf7d0" },
+        "300": { "value": "#86efac" },
+        "400": { "value": "#4ade80" },
+        "500": { "value": "#22c55e" },
+        "600": { "value": "#16a34a" },
+        "700": { "value": "#15803d" },
+        "800": { "value": "#166534" },
+        "900": { "value": "#14532d" },
+        "950": { "value": "#052e16" }
+      },
+      "emerald": {
+        "50": { "value": "#ecfdf5" },
+        "100": { "value": "#d1fae5" },
+        "200": { "value": "#a7f3d0" },
+        "300": { "value": "#6ee7b7" },
+        "400": { "value": "#34d399" },
+        "500": { "value": "#10b981" },
+        "600": { "value": "#059669" },
+        "700": { "value": "#047857" },
+        "800": { "value": "#065f46" },
+        "900": { "value": "#064e3b" },
+        "950": { "value": "#022c22" }
+      },
+      "teal": {
+        "50": { "value": "#f0fdfa" },
+        "100": { "value": "#ccfbf1" },
+        "200": { "value": "#99f6e4" },
+        "300": { "value": "#5eead4" },
+        "400": { "value": "#2dd4bf" },
+        "500": { "value": "#14b8a6" },
+        "600": { "value": "#0d9488" },
+        "700": { "value": "#0f766e" },
+        "800": { "value": "#115e59" },
+        "900": { "value": "#134e4a" },
+        "950": { "value": "#042f2e" }
+      },
+      "cyan": {
+        "50": { "value": "#ecfeff" },
+        "100": { "value": "#cffafe" },
+        "200": { "value": "#a5f3fc" },
+        "300": { "value": "#67e8f9" },
+        "400": { "value": "#22d3ee" },
+        "500": { "value": "#06b6d4" },
+        "600": { "value": "#0891b2" },
+        "700": { "value": "#0e7490" },
+        "800": { "value": "#155e75" },
+        "900": { "value": "#164e63" },
+        "950": { "value": "#083344" }
+      },
+      "sky": {
+        "50": { "value": "#f0f9ff" },
+        "100": { "value": "#e0f2fe" },
+        "200": { "value": "#bae6fd" },
+        "300": { "value": "#7dd3fc" },
+        "400": { "value": "#38bdf8" },
+        "500": { "value": "#0ea5e9" },
+        "600": { "value": "#0284c7" },
+        "700": { "value": "#0369a1" },
+        "800": { "value": "#075985" },
+        "900": { "value": "#0c4a6e" },
+        "950": { "value": "#082f49" }
+      },
+      "blue": {
+        "50": { "value": "#eff6ff" },
+        "100": { "value": "#dbeafe" },
+        "200": { "value": "#bfdbfe" },
+        "300": { "value": "#93c5fd" },
+        "400": { "value": "#60a5fa" },
+        "500": { "value": "#3b82f6" },
+        "600": { "value": "#2563eb" },
+        "700": { "value": "#1d4ed8" },
+        "800": { "value": "#1e40af" },
+        "900": { "value": "#1e3a8a" },
+        "950": { "value": "#172554" }
+      },
+      "indigo": {
+        "50": { "value": "#eef2ff" },
+        "100": { "value": "#e0e7ff" },
+        "200": { "value": "#c7d2fe" },
+        "300": { "value": "#a5b4fc" },
+        "400": { "value": "#818cf8" },
+        "500": { "value": "#6366f1" },
+        "600": { "value": "#4f46e5" },
+        "700": { "value": "#4338ca" },
+        "800": { "value": "#3730a3" },
+        "900": { "value": "#312e81" },
+        "950": { "value": "#1e1b4b" }
+      },
+      "violet": {
+        "50": { "value": "#f5f3ff" },
+        "100": { "value": "#ede9fe" },
+        "200": { "value": "#ddd6fe" },
+        "300": { "value": "#c4b5fd" },
+        "400": { "value": "#a78bfa" },
+        "500": { "value": "#8b5cf6" },
+        "600": { "value": "#7c3aed" },
+        "700": { "value": "#6d28d9" },
+        "800": { "value": "#5b21b6" },
+        "900": { "value": "#4c1d95" },
+        "950": { "value": "#2e1065" }
+      },
+      "purple": {
+        "50": { "value": "#faf5ff" },
+        "100": { "value": "#f3e8ff" },
+        "200": { "value": "#e9d5ff" },
+        "300": { "value": "#d8b4fe" },
+        "400": { "value": "#c084fc" },
+        "500": { "value": "#a855f7" },
+        "600": { "value": "#9333ea" },
+        "700": { "value": "#7e22ce" },
+        "800": { "value": "#6b21a8" },
+        "900": { "value": "#581c87" },
+        "950": { "value": "#3b0764" }
+      },
+      "fuchsia": {
+        "50": { "value": "#fdf4ff" },
+        "100": { "value": "#fae8ff" },
+        "200": { "value": "#f5d0fe" },
+        "300": { "value": "#f0abfc" },
+        "400": { "value": "#e879f9" },
+        "500": { "value": "#d946ef" },
+        "600": { "value": "#c026d3" },
+        "700": { "value": "#a21caf" },
+        "800": { "value": "#86198f" },
+        "900": { "value": "#701a75" },
+        "950": { "value": "#4a044e" }
+      },
+      "pink": {
+        "50": { "value": "#fdf2f8" },
+        "100": { "value": "#fce7f3" },
+        "200": { "value": "#fbcfe8" },
+        "300": { "value": "#f9a8d4" },
+        "400": { "value": "#f472b6" },
+        "500": { "value": "#ec4899" },
+        "600": { "value": "#db2777" },
+        "700": { "value": "#be185d" },
+        "800": { "value": "#9d174d" },
+        "900": { "value": "#831843" },
+        "950": { "value": "#500724" }
+      },
+      "rose": {
+        "50": { "value": "#fff1f2" },
+        "100": { "value": "#ffe4e6" },
+        "200": { "value": "#fecdd3" },
+        "300": { "value": "#fda4af" },
+        "400": { "value": "#fb7185" },
+        "500": { "value": "#f43f5e" },
+        "600": { "value": "#e11d48" },
+        "700": { "value": "#be123c" },
+        "800": { "value": "#9f1239" },
+        "900": { "value": "#881337" },
+        "950": { "value": "#4c0519" }
+      }
+    }
+  },
+
+  "spacing": {
+    "_category": "Spacing Scale",
+    "_description": "Based on 4px grid (0.25rem = 4px)",
+    "0": { "value": "0" },
+    "px": { "value": "1px" },
+    "0.5": { "value": "0.125rem", "_comment": "2px" },
+    "1": { "value": "0.25rem", "_comment": "4px" },
+    "1.5": { "value": "0.375rem", "_comment": "6px" },
+    "2": { "value": "0.5rem", "_comment": "8px" },
+    "2.5": { "value": "0.625rem", "_comment": "10px" },
+    "3": { "value": "0.75rem", "_comment": "12px" },
+    "3.5": { "value": "0.875rem", "_comment": "14px" },
+    "4": { "value": "1rem", "_comment": "16px" },
+    "5": { "value": "1.25rem", "_comment": "20px" },
+    "6": { "value": "1.5rem", "_comment": "24px" },
+    "7": { "value": "1.75rem", "_comment": "28px" },
+    "8": { "value": "2rem", "_comment": "32px" },
+    "9": { "value": "2.25rem", "_comment": "36px" },
+    "10": { "value": "2.5rem", "_comment": "40px" },
+    "11": { "value": "2.75rem", "_comment": "44px" },
+    "12": { "value": "3rem", "_comment": "48px" },
+    "14": { "value": "3.5rem", "_comment": "56px" },
+    "16": { "value": "4rem", "_comment": "64px" },
+    "20": { "value": "5rem", "_comment": "80px" },
+    "24": { "value": "6rem", "_comment": "96px" },
+    "28": { "value": "7rem", "_comment": "112px" },
+    "32": { "value": "8rem", "_comment": "128px" },
+    "36": { "value": "9rem", "_comment": "144px" },
+    "40": { "value": "10rem", "_comment": "160px" },
+    "44": { "value": "11rem", "_comment": "176px" },
+    "48": { "value": "12rem", "_comment": "192px" },
+    "52": { "value": "13rem", "_comment": "208px" },
+    "56": { "value": "14rem", "_comment": "224px" },
+    "60": { "value": "15rem", "_comment": "240px" },
+    "64": { "value": "16rem", "_comment": "256px" },
+    "72": { "value": "18rem", "_comment": "288px" },
+    "80": { "value": "20rem", "_comment": "320px" },
+    "96": { "value": "24rem", "_comment": "384px" }
+  },
+
+  "radius": {
+    "_category": "Border Radius",
+    "none": { "value": "0" },
+    "sm": { "value": "0.125rem", "_comment": "2px" },
+    "default": { "value": "0.25rem", "_comment": "4px" },
+    "md": { "value": "0.375rem", "_comment": "6px" },
+    "lg": { "value": "0.5rem", "_comment": "8px" },
+    "xl": { "value": "0.75rem", "_comment": "12px" },
+    "2xl": { "value": "1rem", "_comment": "16px" },
+    "3xl": { "value": "1.5rem", "_comment": "24px" },
+    "full": { "value": "9999px" }
+  },
+
+  "shadow": {
+    "_category": "Box Shadows",
+    "none": { "value": "none" },
+    "xs": { "value": "0 1px 2px 0 rgba(0, 0, 0, 0.05)" },
+    "sm": { "value": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)" },
+    "default": { "value": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)" },
+    "md": { "value": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)" },
+    "lg": { "value": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)" },
+    "xl": { "value": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)" },
+    "2xl": { "value": "0 25px 50px -12px rgba(0, 0, 0, 0.25)" },
+    "inner": { "value": "inset 0 2px 4px 0 rgba(0, 0, 0, 0.05)" }
+  },
+
+  "font": {
+    "_category": "Typography",
+
+    "family": {
+      "_description": "Font families",
+      "sans": { "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif" },
+      "serif": { "value": "ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif" },
+      "mono": { "value": "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace" }
+    },
+
+    "size": {
+      "_description": "Font sizes",
+      "xs": { "value": "0.75rem", "_comment": "12px", "lineHeight": "1rem" },
+      "sm": { "value": "0.875rem", "_comment": "14px", "lineHeight": "1.25rem" },
+      "base": { "value": "1rem", "_comment": "16px", "lineHeight": "1.5rem" },
+      "lg": { "value": "1.125rem", "_comment": "18px", "lineHeight": "1.75rem" },
+      "xl": { "value": "1.25rem", "_comment": "20px", "lineHeight": "1.75rem" },
+      "2xl": { "value": "1.5rem", "_comment": "24px", "lineHeight": "2rem" },
+      "3xl": { "value": "1.875rem", "_comment": "30px", "lineHeight": "2.25rem" },
+      "4xl": { "value": "2.25rem", "_comment": "36px", "lineHeight": "2.5rem" },
+      "5xl": { "value": "3rem", "_comment": "48px", "lineHeight": "1" },
+      "6xl": { "value": "3.75rem", "_comment": "60px", "lineHeight": "1" },
+      "7xl": { "value": "4.5rem", "_comment": "72px", "lineHeight": "1" },
+      "8xl": { "value": "6rem", "_comment": "96px", "lineHeight": "1" },
+      "9xl": { "value": "8rem", "_comment": "128px", "lineHeight": "1" }
+    },
+
+    "weight": {
+      "_description": "Font weights",
+      "thin": { "value": "100" },
+      "extralight": { "value": "200" },
+      "light": { "value": "300" },
+      "normal": { "value": "400" },
+      "medium": { "value": "500" },
+      "semibold": { "value": "600" },
+      "bold": { "value": "700" },
+      "extrabold": { "value": "800" },
+      "black": { "value": "900" }
+    },
+
+    "lineHeight": {
+      "_description": "Line heights",
+      "none": { "value": "1" },
+      "tight": { "value": "1.25" },
+      "snug": { "value": "1.375" },
+      "normal": { "value": "1.5" },
+      "relaxed": { "value": "1.625" },
+      "loose": { "value": "2" }
+    },
+
+    "letterSpacing": {
+      "_description": "Letter spacing",
+      "tighter": { "value": "-0.05em" },
+      "tight": { "value": "-0.025em" },
+      "normal": { "value": "0" },
+      "wide": { "value": "0.025em" },
+      "wider": { "value": "0.05em" },
+      "widest": { "value": "0.1em" }
+    }
+  },
+
+  "animation": {
+    "_category": "Motion & Animation",
+
+    "duration": {
+      "0": { "value": "0ms" },
+      "75": { "value": "75ms" },
+      "100": { "value": "100ms" },
+      "150": { "value": "150ms" },
+      "200": { "value": "200ms" },
+      "300": { "value": "300ms" },
+      "500": { "value": "500ms" },
+      "700": { "value": "700ms" },
+      "1000": { "value": "1000ms" }
+    },
+
+    "easing": {
+      "linear": { "value": "linear" },
+      "in": { "value": "cubic-bezier(0.4, 0, 1, 1)" },
+      "out": { "value": "cubic-bezier(0, 0, 0.2, 1)" },
+      "in-out": { "value": "cubic-bezier(0.4, 0, 0.2, 1)" }
+    }
+  },
+
+  "breakpoint": {
+    "_category": "Responsive Breakpoints",
+    "sm": { "value": "640px" },
+    "md": { "value": "768px" },
+    "lg": { "value": "1024px" },
+    "xl": { "value": "1280px" },
+    "2xl": { "value": "1536px" }
+  },
+
+  "zIndex": {
+    "_category": "Z-Index Scale",
+    "0": { "value": "0" },
+    "10": { "value": "10" },
+    "20": { "value": "20" },
+    "30": { "value": "30" },
+    "40": { "value": "40" },
+    "50": { "value": "50" },
+    "auto": { "value": "auto" }
+  },
+
+  "opacity": {
+    "_category": "Opacity Scale",
+    "0": { "value": "0" },
+    "5": { "value": "0.05" },
+    "10": { "value": "0.1" },
+    "20": { "value": "0.2" },
+    "25": { "value": "0.25" },
+    "30": { "value": "0.3" },
+    "40": { "value": "0.4" },
+    "50": { "value": "0.5" },
+    "60": { "value": "0.6" },
+    "70": { "value": "0.7" },
+    "75": { "value": "0.75" },
+    "80": { "value": "0.8" },
+    "90": { "value": "0.9" },
+    "95": { "value": "0.95" },
+    "100": { "value": "1" }
+  }
+}
diff --git a/.dss/data/_system/analysis-admin-ui.json b/.dss/data/_system/analysis-admin-ui.json
new file mode 100644
index 0000000..a46501e
--- /dev/null
+++ b/.dss/data/_system/analysis-admin-ui.json
@@ -0,0 +1 @@
+{"target":"admin-ui","analyzed_at":"2025-12-10T21:38:46-03:00","stats":{"js":168,"css":20,"html":4},"status":"analyzed"}
diff --git a/.dss/data/_system/analysis-storybook.json b/.dss/data/_system/analysis-storybook.json
new file mode 100644
index 0000000..16dcfcf
--- /dev/null
+++ b/.dss/data/_system/analysis-storybook.json
@@ -0,0 +1 @@
+{"target":"storybook","analyzed_at":"2025-12-10T21:38:46-03:00","stats":{"stories":14,"mdx":0},"status":"analyzed"}
diff --git a/.dss/data/_system/components.json b/.dss/data/_system/components.json
new file mode 100644
index 0000000..d454f45
--- /dev/null
+++ b/.dss/data/_system/components.json
@@ -0,0 +1,373 @@
+[
+  {
+    "name": "Accordion",
+    "key": "842:49174",
+    "description": "Component page: Accordion",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Alert",
+    "key": "842:44439",
+    "description": "Component page: Alert",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Alert Dialog",
+    "key": "842:51942",
+    "description": "Component page: Alert Dialog",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Aspect Ratio",
+    "key": "842:52053",
+    "description": "Component page: Aspect Ratio",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Avatar",
+    "key": "842:44440",
+    "description": "Component page: Avatar",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Badge",
+    "key": "842:44441",
+    "description": "Component page: Badge",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Breadcrumb",
+    "key": "842:51940",
+    "description": "Component page: Breadcrumb",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Button",
+    "key": "842:44442",
+    "description": "Component page: Button",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Button Group",
+    "key": "842:44448",
+    "description": "Component page: Button Group",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Card",
+    "key": "842:49175",
+    "description": "Component page: Card",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Carousel",
+    "key": "842:52056",
+    "description": "Component page: Carousel",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Charts",
+    "key": "842:52058",
+    "description": "Component page: Charts",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Checkbox",
+    "key": "842:49183",
+    "description": "Component page: Checkbox",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Command",
+    "key": "842:52048",
+    "description": "Component page: Command",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Data Table",
+    "key": "842:49179",
+    "description": "Component page: Data Table",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Date Picker",
+    "key": "842:49186",
+    "description": "Component page: Date Picker",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Dialog",
+    "key": "842:51941",
+    "description": "Component page: Dialog",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Drawer",
+    "key": "842:52050",
+    "description": "Component page: Drawer",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Empty",
+    "key": "842:44451",
+    "description": "Component page: Empty",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Field",
+    "key": "842:49181",
+    "description": "Component page: Field",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Hover Card",
+    "key": "842:52051",
+    "description": "Component page: Hover Card",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Icon Button",
+    "key": "842:44443",
+    "description": "Component page: Icon Button",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Input",
+    "key": "842:49172",
+    "description": "Component page: Input",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Input File",
+    "key": "842:49173",
+    "description": "Component page: Input File",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Input Group",
+    "key": "885:2",
+    "description": "Component page: Input Group",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Input OTP",
+    "key": "842:49177",
+    "description": "Component page: Input OTP",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Item",
+    "key": "885:3081",
+    "description": "Component page: Item",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Kbd",
+    "key": "842:49171",
+    "description": "Component page: Kbd",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Label",
+    "key": "842:49170",
+    "description": "Component page: Label",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Link Button",
+    "key": "842:44446",
+    "description": "Component page: Link Button",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Loading Button",
+    "key": "842:44444",
+    "description": "Component page: Loading Button",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Navigation Menu",
+    "key": "842:51938",
+    "description": "Component page: Navigation Menu",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Pagination",
+    "key": "842:51939",
+    "description": "Component page: Pagination",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Progress",
+    "key": "842:49187",
+    "description": "Component page: Progress",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Radio",
+    "key": "842:49182",
+    "description": "Component page: Radio",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Resizable",
+    "key": "842:52055",
+    "description": "Component page: Resizable",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Scroll Area",
+    "key": "842:52054",
+    "description": "Component page: Scroll Area",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Select & Combobox",
+    "key": "842:49185",
+    "description": "Component page: Select & Combobox",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Separator",
+    "key": "842:49137",
+    "description": "Component page: Separator",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Sheet",
+    "key": "842:52049",
+    "description": "Component page: Sheet",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Sidebar",
+    "key": "842:51929",
+    "description": "Component page: Sidebar",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Skeleton",
+    "key": "842:52052",
+    "description": "Component page: Skeleton",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Slider",
+    "key": "842:49188",
+    "description": "Component page: Slider",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Sonner",
+    "key": "842:51943",
+    "description": "Component page: Sonner",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Spinner",
+    "key": "842:44445",
+    "description": "Component page: Spinner",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Switch",
+    "key": "842:49184",
+    "description": "Component page: Switch",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Table",
+    "key": "842:49176",
+    "description": "Component page: Table",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Tabs",
+    "key": "842:50580",
+    "description": "Component page: Tabs",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Textarea",
+    "key": "842:49180",
+    "description": "Component page: Textarea",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Toggle & Toggle Group",
+    "key": "842:44447",
+    "description": "Component page: Toggle & Toggle Group",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Tooltip",
+    "key": "842:44449",
+    "description": "Component page: Tooltip",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Screen examples",
+    "key": "683:34149",
+    "description": "Component page: Screen examples",
+    "properties": {},
+    "variants": []
+  },
+  {
+    "name": "Internal Components",
+    "key": "842:44452",
+    "description": "Component page: Internal Components",
+    "properties": {},
+    "variants": []
+  }
+]
\ No newline at end of file
diff --git a/.dss/data/_system/ds.config.json b/.dss/data/_system/ds.config.json
new file mode 100644
index 0000000..ce348a8
--- /dev/null
+++ b/.dss/data/_system/ds.config.json
@@ -0,0 +1,33 @@
+{
+  "name": "dss-system",
+  "version": "1.0.0",
+  "description": "DSS internal design system (dogfooding)",
+  "skin": "base",
+  "base_theme": "light",
+  "targets": [
+    {
+      "name": "admin-ui",
+      "path": "./admin-ui",
+      "type": "web-app",
+      "framework": "vanilla"
+    },
+    {
+      "name": "storybook",
+      "path": "./storybook",
+      "type": "documentation",
+      "framework": "storybook"
+    }
+  ],
+  "output": {
+    "tokens_dir": "./.dss/data/_system/tokens",
+    "themes_dir": "./.dss/data/_system/themes",
+    "components_dir": "./.dss/data/_system/components",
+    "formats": ["css", "scss", "json"]
+  },
+  "figma": {
+    "files": [],
+    "auto_sync": false
+  },
+  "created_at": "$(date -Iseconds)",
+  "updated_at": "$(date -Iseconds)"
+}
diff --git a/.dss/data/_system/figma-components.json b/.dss/data/_system/figma-components.json
new file mode 100644
index 0000000..5fd9d64
--- /dev/null
+++ b/.dss/data/_system/figma-components.json
@@ -0,0 +1,29301 @@
+{
+  "file_key": "evCZlaeZrP7X20NIViSJbl",
+  "file_name": "Obra shadcn/ui (uikit)",
+  "components": {
+    "275:73544": {
+      "key": "74a91fe51f98811dd3c3f6f5bd24d3af224239dd",
+      "name": ".Component Page Header",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "11:818": {
+      "key": "4de715b8ad1b3cba2e6c56430ea2d2229b7a522b",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "8:334": {
+      "key": "9182a39268fb70ad1b7d927705c864800dbbabeb",
+      "name": "Icon / square-dashed",
+      "description": "selection, square, rectangular, marquee, tool, dashed, box",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "275:73540": {
+      "key": "f954bc8a19a6be0ca7e6effcbb0a4a52a60bb464",
+      "name": "Icon / external-link",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "16:1941": {
+      "key": "05bea3762d0b35c515d4273f0156835fb5d4effd",
+      "name": "Icon / minus",
+      "description": "subtract, remove, decrease, decrement, reduce, negative, calculate, line, divider, separator, horizontal rule, hr, html, markup, markdown, toolbar, operator, code, coding, minimum, downgrade",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "16:1945": {
+      "key": "334d4bc3297ead455c07bc19be6fe4bcce3f0658",
+      "name": "Icon / plus",
+      "description": "add, new, increase, increment, positive, calculate, toolbar, crosshair, aim, target, scope, sight, reticule, maximum, upgrade, extra, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:578": {
+      "key": "41022a25dd46e434062b0de1ac9d7acf2d635201",
+      "name": "Icon / trash",
+      "description": "garbage, delete, remove, bin",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:577": {
+      "key": "83cd1d6fb2a4a7db6e3a983a68db0fdd25a01a99",
+      "name": "Icon / pencil",
+      "description": "rubber, edit, create, draw, sketch, draft, writer, writing, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "16:1944": {
+      "key": "709bd3de0963498f65a56ecc84251be385270b32",
+      "name": "Icon / bookmark",
+      "description": "read, clip, marker, tag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "50:4280": {
+      "key": "213a02c639be537e98816fbc1749ef4110e5f36b",
+      "name": "Icon / x",
+      "description": "cancel, close, delete, remove, times, clear, math, multiply, multiplication",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "3:225": {
+      "key": "589d2f8490bb62a8794cde9354cd3217afc3671b",
+      "name": "Icon / mail",
+      "description": "email, message, letter, unread",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "2:121": {
+      "key": "bf776eeee54d73eea8b801cc0832145031c89324",
+      "name": "Icon / chevron-down",
+      "description": "backwards, reverse, slow, dropdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:6294": {
+      "key": "64db84252c44983a57efeb0ef8f134b4dee8e3ed",
+      "name": "Icon / ellipsis",
+      "description": "et cetera, etc, loader, loading, progress, pending, throbber, menu, options, operator, code, coding, spread, rest, more, further, extra, overflow, dots, \u2026, ...",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "20:5920": {
+      "key": "28caf112dce2c8f1528245c1908479a1aab63325",
+      "name": "Icon / ellipsis-vertical",
+      "description": "menu, options, spread, more, further, extra, overflow, dots, \u2026, ...",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "3:171": {
+      "key": "3cbb16c854567ffd9545728bfc3f8eb5569780d8",
+      "name": "Icon / check",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:332": {
+      "key": "d2cfbbd3b28ab07f5a7baa74a519067da9dbe759",
+      "name": "Icon / chevron-right",
+      "description": "forward, next, more than, greater, menu, code, coding, command line, terminal, prompt, shell, >",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:459": {
+      "key": "ef3eb72b7321e47f96fca8eaf538cf77fbe84835",
+      "name": "Icon / circle-dashed",
+      "description": "pending, dot, progress, issue, draft, code, coding, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:329": {
+      "key": "4e4a539c567084b96594433fdf2aff3e0614c769",
+      "name": "Icon / chevron-left",
+      "description": "back, previous, less than, fewer, menu, <",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "20:5440": {
+      "key": "d4d20775662f101ae49379069656c46bcebee597",
+      "name": "Icon / columns",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:469": {
+      "key": "a173f29ea5c3a8fb57fb743b89f6ab039889f5b5",
+      "name": "Icon / chevron-up",
+      "description": "caret, keyboard, mac, control, ctrl, superscript, exponential, power, ahead, fast, ^, dropdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:330": {
+      "key": "024c34ce92504ba7ef8b82faa746c57d9d5388a8",
+      "name": "Icon / arrow-left",
+      "description": "previous, back, direction, west, <-",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:520": {
+      "key": "422d375aa6e12e74fe838ea674f84a525db7c5f5",
+      "name": "Icon / chevrons-up-down",
+      "description": "expand, unfold, vertical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:25005": {
+      "key": "8f03a04aea5aafc8dd59328810e2e6c44ababae0",
+      "name": "Icon / panel-left-close",
+      "description": "primary, drawer, hide, chevron, <",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:333": {
+      "key": "8ae757ccf94d37a8909d0e1507dae0388f1640f8",
+      "name": "Icon / arrow-right",
+      "description": "forward, next, direction, east, ->",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:331": {
+      "key": "5a4e95d93de1f60761ec51c36600e33c9578ce42",
+      "name": "Icon / circle-alert",
+      "description": "warning, alert, danger, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:471": {
+      "key": "c36449186a7ec6b2be7537ede5f0896b2e5d5283",
+      "name": "Icon / shield-alert",
+      "description": "unshielded, cybersecurity, insecure, unsecured, safety, unsafe, protection, unprotected, guardian, unguarded, unarmored, unarmoured, defenseless, defenceless, undefended, defender, blocked, stopped, intercepted, interception, saved, thwarted, threat, prevention, unprevented, antivirus, vigilance, vigilant, detection, detected, scanned, found, exploit, vulnerability, vulnerable, weakness, infection, infected, comprimised, data leak, audited, admin, verification, unverified, uncertified, warning, emergency, attention, urgent, alarm, crest, bravery, strength, tough, attacked, damaged, injured, hit, expired, disabled, inactive, error, exclamation mark, !",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "133:13793": {
+      "key": "a7cd8a6cc8119c9394f71dd9b87a841d3260c54c",
+      "name": "Icon / panel-left",
+      "description": "primary, drawer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:587": {
+      "key": "6f07a7394efff4f7b4c8e31e6c6134e5ec455e61",
+      "name": "Icon / circle-check",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:606": {
+      "key": "ca6347a4843bed7d1d384ea33e2457a1251060fd",
+      "name": "Icon / trending-up",
+      "description": "statistics",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:343": {
+      "key": "bc5654321afae802cb0124c22b914a3bd2e508f9",
+      "name": "Icon / calendar",
+      "description": "date, month, year, event, birthday, birthdate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:25009": {
+      "key": "fbe7e7b26243b95e145c1247f862aa37b0f83aed",
+      "name": "Icon / panel-left-open",
+      "description": "primary, drawer, show, reveal, chevron, right, >",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:356": {
+      "key": "d0ac52c76bad022644158bc5268c69de8f374f4a",
+      "name": "Icon / log-out",
+      "description": "sign out, arrow, exit, auth",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:472": {
+      "key": "2febcc8575142452016c3af2e9a972b09df0ebb1",
+      "name": "Icon / user",
+      "description": "person, account, contact",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:470": {
+      "key": "fe02133567a09d2717b87712e6d59a1a1d7b8e2c",
+      "name": "Icon / arrow-up-down",
+      "description": "bidirectional, two-way, 2-way, swap, switch, network, mobile data, internet, sort, reorder, move",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "8:598": {
+      "key": "9867f31a97d7b2195404a04ab27693d790b887e9",
+      "name": "Icon / loader",
+      "description": "loading, wait, busy, progress, spinner, spinning, throbber",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:6123": {
+      "key": "9b755a43732bf906884f03a1e7a83f6daef79711",
+      "name": "Icon / list-filter",
+      "description": "options",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:5774": {
+      "key": "3a72cd4c0ac0523ce51e11c790a978e7b345b0aa",
+      "name": "Icon / search",
+      "description": "find, scan, magnifier, magnifying glass, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "364:30030": {
+      "key": "9ea1386b256df2131349916e9c8b876f5295c781",
+      "name": "Icon / clock-1",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "177:16864": {
+      "key": "f86708e41fcb14df2c4e887d1740bc4a5533662a",
+      "name": "Icon / badge-check",
+      "description": "verified, check",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "177:25609": {
+      "key": "30588fc22e25c36690300633aedc73180bab664d",
+      "name": "Icon / slash",
+      "description": "divide, division, or, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:4384": {
+      "key": "20075eb061ec1b8770da3a0b1db10ec1489f0dae",
+      "name": "Icon / blank",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "275:66641": {
+      "key": "39104992d2d447f878a5bea905a17bf9a74341a0",
+      "name": "Icon / lock",
+      "description": "security, password, secure, admin",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54158": {
+      "key": "775961fc0be7f1f86105cc5814e9cf2b8f86983a",
+      "name": "Icon / a-arrow-down",
+      "description": "letter, font size, text, formatting, smaller",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53609": {
+      "key": "7e1ff21ba2479ee9d82dba8b257b04e78a41e2fd",
+      "name": "Icon / a-arrow-up",
+      "description": "letter, font size, text, formatting, larger, bigger",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53821": {
+      "key": "44fe087733bac176a7f5fe635d2e7c2cb3f02377",
+      "name": "Icon / a-large-small",
+      "description": "letter, font size, text, formatting",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54131": {
+      "key": "c891e709518b6d75afc5703d78cb4a7b52e7b7ef",
+      "name": "Icon / accessibility",
+      "description": "disability, disabled, dda, wheelchair",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54148": {
+      "key": "ca8c0bd04b096a08c53d5010fa2c16546e8b68c7",
+      "name": "Icon / activity",
+      "description": "pulse, action, motion, movement, exercise, fitness, healthcare, heart rate monitor, vital signs, vitals, emergency room, er, intensive care, hospital, defibrillator, earthquake, siesmic, magnitude, richter scale, aftershock, tremor, shockwave, audio, waveform, synthesizer, synthesiser, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53943": {
+      "key": "fa4df158862b0e6e8537af439e2568b594519f4c",
+      "name": "Icon / air-vent",
+      "description": "air conditioner, ac, central air, cooling, climate-control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53583": {
+      "key": "72ed55daddb932c68567203dd93bf70846a967b7",
+      "name": "Icon / airplay",
+      "description": "stream, cast, mirroring, screen, monitor, macos, osx",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54163": {
+      "key": "02b2633deae4a68bff44dc6cebe9f50c666ed157",
+      "name": "Icon / alarm-clock-check",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53682": {
+      "key": "32e0fcc361462ecacd547476e7ecc483d9cb37b7",
+      "name": "Icon / alarm-clock-minus",
+      "description": "remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53363": {
+      "key": "9bca30bc3d32fba08ef85e83add1a87f970eab20",
+      "name": "Icon / alarm-clock-off",
+      "description": "morning, turn-off",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54154": {
+      "key": "7370c9e1e7db7d1c3e3ccc7f42e22718ef2a832a",
+      "name": "Icon / alarm-clock-plus",
+      "description": "add",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54031": {
+      "key": "bc6d190b23fb47a72ef5b7e56afd97184109bc26",
+      "name": "Icon / alarm-clock",
+      "description": "morning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53965": {
+      "key": "672e7fb5f7503198ca9bba78178f77b4ca453a0a",
+      "name": "Icon / alarm-smoke",
+      "description": "fire, alert, warning, detector, carbon monoxide, safety, equipment, amenities",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54091": {
+      "key": "8ed7c1c4b84f1edad97c2b3fa3d340207fd886a9",
+      "name": "Icon / album",
+      "description": "photo, book",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53553": {
+      "key": "f0a4c0c3ccee7014cb55f326c23b25da6d27d479",
+      "name": "Icon / align-center-horizontal",
+      "description": "items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53746": {
+      "key": "620e7a7cc246857884ed2c0d9d0e4f253b150270",
+      "name": "Icon / align-center-vertical",
+      "description": "items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53672": {
+      "key": "1bab2b2c19989ecb747e0189ad38f0f7fc6b270d",
+      "name": "Icon / align-center",
+      "description": "text, alignment, center",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54041": {
+      "key": "5d39ab907635f3ed22a4f747abcd8646e92ac829",
+      "name": "Icon / align-end-horizontal",
+      "description": "items, bottom, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53273": {
+      "key": "6245a8493bad2b0954b9cb3a1c247489270e4b45",
+      "name": "Icon / align-end-vertical",
+      "description": "items, right, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53963": {
+      "key": "26fa403f8c7a60c1237734e2c63a6ac3baf07231",
+      "name": "Icon / align-horizontal-distribute-center",
+      "description": "items, flex, justify, space, evenly, around",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54022": {
+      "key": "d7845247a103e03276b035c838e9531004e84b07",
+      "name": "Icon / align-horizontal-distribute-end",
+      "description": "right, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54076": {
+      "key": "f506cf6c1f723d8c62e41edcef07acd88e9cb6ef",
+      "name": "Icon / align-horizontal-distribute-start",
+      "description": "left, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53935": {
+      "key": "703211d4e62a45fa8d911f817736fda2b12e7cea",
+      "name": "Icon / align-horizontal-justify-center",
+      "description": "center, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53915": {
+      "key": "4f3145cf4ba54e4428417a1443f85de59e089fd9",
+      "name": "Icon / align-horizontal-justify-end",
+      "description": "right, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54108": {
+      "key": "df04e40be2b73858d03af4a7b415da05c126dc61",
+      "name": "Icon / align-horizontal-justify-start",
+      "description": "left, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54126": {
+      "key": "883afdac0e3650c4d4d54136b72e07e6eeac0f61",
+      "name": "Icon / align-horizontal-space-around",
+      "description": "center, items, flex, justify, distribute, between",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53417": {
+      "key": "99a7486fd5fe87f9f028ecda8a2626fb8f5059f8",
+      "name": "Icon / align-horizontal-space-between",
+      "description": "around, items, bottom, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54099": {
+      "key": "a0a204a5cee9f3262a3f1e5c50763a4039875c38",
+      "name": "Icon / align-justify",
+      "description": "text, alignment, justified, menu, list",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54093": {
+      "key": "7bd54147cd8da7146ba7192fd57ef0fde17505a3",
+      "name": "Icon / align-left",
+      "description": "text, alignment, left, list",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54082": {
+      "key": "71f3ba35a1f251e3a855473089137a3233595e8e",
+      "name": "Icon / align-right",
+      "description": "text, alignment, right",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53308": {
+      "key": "99e72fd1f02b9eabb8d73c071fefeaff035064b0",
+      "name": "Icon / align-start-horizontal",
+      "description": "top, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53335": {
+      "key": "3008df700db6ce56e55f7263f1b8553302583ce0",
+      "name": "Icon / align-start-vertical",
+      "description": "left, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53348": {
+      "key": "64de0a0094f541e66e81b6d28a874698cc677410",
+      "name": "Icon / align-vertical-distribute-center",
+      "description": "items, flex, justify, space, evenly, around",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54054": {
+      "key": "eb0f71c0d670ef89235e912cfd21aa54626a4fe2",
+      "name": "Icon / align-vertical-distribute-end",
+      "description": "bottom, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53585": {
+      "key": "bf7fd4259c6bb2be72efda089cb2c93a6eac8251",
+      "name": "Icon / align-vertical-distribute-start",
+      "description": "top, items, flex, justify",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53816": {
+      "key": "5896bfbfb5cf1dad6c6c7b59ba07634b81bda0c9",
+      "name": "Icon / align-vertical-justify-center",
+      "description": "center, items, flex, justify, distribute, between",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54070": {
+      "key": "d386c7fb4be10eaf929962ca8bed3f3eeb50dabc",
+      "name": "Icon / align-vertical-justify-end",
+      "description": "bottom, items, flex, justify, distribute, between",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54121": {
+      "key": "21863e94cfdaa960d232780d72617bbda6d6cb65",
+      "name": "Icon / align-vertical-justify-start",
+      "description": "top, items, flex, justify, distribute, between",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53922": {
+      "key": "012f0fa0c13051782a910dbf56b0d09c7029867f",
+      "name": "Icon / align-vertical-space-around",
+      "description": "center, items, flex, justify, distribute, between",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53770": {
+      "key": "922cb5e156a708dfec9edf83df1e72b4930dfd66",
+      "name": "Icon / align-vertical-space-between",
+      "description": "center, items, flex, justify, distribute, between",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53693": {
+      "key": "e7b9321e11175ff5c78c6884c15da46d924e7efc",
+      "name": "Icon / ambulance",
+      "description": "ambulance, emergency, medical, vehicle, siren, healthcare, transportation, rescue, urgent, first aid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54138": {
+      "key": "822d349a26498066a2827dd15c7d5243bba79e0b",
+      "name": "Icon / ampersand",
+      "description": "and, typography, operator, join, concatenate, code, &",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54061": {
+      "key": "14c7ffa077a9a8f50ea6949163377e33d6d9680a",
+      "name": "Icon / ampersands",
+      "description": "and, operator, then, code, &&",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54060": {
+      "key": "aab1b06c0e04acfcc97f5ac4da82e2970ccf0eab",
+      "name": "Icon / amphora",
+      "description": "pottery, artifact, artefact, vase, ceramics, clay, archaeology, museum, wine, oil",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54100": {
+      "key": "06c9b4a0b9b679f51795bf1968d801a18cd63d10",
+      "name": "Icon / anchor",
+      "description": "ship",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53917": {
+      "key": "d3ff59eee65c482490b307d3f36055a88c79fce0",
+      "name": "Icon / angry",
+      "description": "emoji, anger, face, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53804": {
+      "key": "c0c679a71b47a973872eb21cfd396b95600ede4b",
+      "name": "Icon / annoyed",
+      "description": "emoji, nuisance, face, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53188": {
+      "key": "188a36abb70fd341ddd016d33e40325b2ad83eb8",
+      "name": "Icon / antenna",
+      "description": "signal, connection, connectivity, tv, television, broadcast, live, frequency, tune, scan, channels, aerial, receiver, transmission, transducer, terrestrial, satellite, cable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54049": {
+      "key": "ba565eb8c2d1cd73dfdf5da0461fc0fead44c04c",
+      "name": "Icon / anvil",
+      "description": "metal, iron, alloy, materials, heavy, weight, blacksmith, forge, acme",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53862": {
+      "key": "789ae26fba2ae08be99590c5ea96991aba7ee5ac",
+      "name": "Icon / aperture",
+      "description": "camera, photo, pictures, shutter, exposure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53192": {
+      "key": "78a4f2eca0aabe69d7f14f3c298620b422288c1a",
+      "name": "Icon / app-window-mac",
+      "description": "application, menu bar, pane, preferences, macos, osx, executable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54013": {
+      "key": "3c86645b12e762a4a49ed5658c03924f07416aeb",
+      "name": "Icon / app-window",
+      "description": "application, menu bar, pane, executable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53786": {
+      "key": "2f3571d780c4a8b97cc4643662979dbac4a2e8db",
+      "name": "Icon / apple",
+      "description": "fruit, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53446": {
+      "key": "5dda2399b63a7fad5d0386428160a20538b60cff",
+      "name": "Icon / archive-restore",
+      "description": "unarchive, index, backup, box, storage, records",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54033": {
+      "key": "0fcfc018b558481c37f05b14a9e48b9d39b6abc2",
+      "name": "Icon / archive-x",
+      "description": "index, backup, box, storage, records, junk",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54028": {
+      "key": "a9b4323cdcc2640b9660160525b1b9fb089c5094",
+      "name": "Icon / archive",
+      "description": "index, backup, box, storage, records",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54132": {
+      "key": "62ebdef4bb80324a32388aba8bca4981e2ed8051",
+      "name": "Icon / armchair",
+      "description": "sofa, furniture, leisure, lounge, loveseat, couch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54023": {
+      "key": "b682b177ef3cd030d38172b3228aefb8f8c41507",
+      "name": "Icon / arrow-big-down-dash",
+      "description": "backwards, reverse, slow, direction, south, download",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53948": {
+      "key": "026499bb16bec2a8a5b3ee280a91bd303d03b0f1",
+      "name": "Icon / arrow-big-down",
+      "description": "backwards, reverse, direction, south",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54146": {
+      "key": "d6f61603df8fba537400815c45164ea9644767c4",
+      "name": "Icon / arrow-big-left-dash",
+      "description": "previous, back, direction, west, turn, corner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54157": {
+      "key": "d970a5b7cb776fc3e107b2e54ea0363b646eaf53",
+      "name": "Icon / arrow-big-left",
+      "description": "previous, back, direction, west, indicate turn",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54026": {
+      "key": "db858d851db733131a3c0668ab49e883b23315d1",
+      "name": "Icon / arrow-big-right-dash",
+      "description": "next, forward, direction, east, turn, corner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53986": {
+      "key": "242f025a83a3557d7bf77620fa9990a0a4889896",
+      "name": "Icon / arrow-big-right",
+      "description": "next, forward, direction, east, indicate turn",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54006": {
+      "key": "dd8aaae084109070dee04a27982468bc8009d7fe",
+      "name": "Icon / arrow-big-up-dash",
+      "description": "caps lock, capitals, keyboard, button, mac, forward, direction, north, faster, speed, boost",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53618": {
+      "key": "c1508e4ed7abdd2406aa9c2e78a78a543f6889fb",
+      "name": "Icon / arrow-big-up",
+      "description": "shift, keyboard, button, mac, capitalize, capitalise, forward, direction, north",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53984": {
+      "key": "44990cab9cfaa8e866ce754a6b3d0fc1f301aa25",
+      "name": "Icon / arrow-down-0-1",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, numerical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54008": {
+      "key": "832c029dd8ecd61d57ff6673b7169a98f1455c3c",
+      "name": "Icon / arrow-down-1-0",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, numerical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54002": {
+      "key": "4b816a056c6c8e84628c126711a805d6467736f8",
+      "name": "Icon / arrow-down-a-z",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, alphabetical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53831": {
+      "key": "a5c9e0aafb2d7427f4efd7bbc409cffd5fe03cfc",
+      "name": "Icon / arrow-down-from-line",
+      "description": "backwards, reverse, direction, south, download, expand, fold, vertical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53554": {
+      "key": "996b7832015122118aca5f1d2a50c78ed765093a",
+      "name": "Icon / arrow-down-left",
+      "description": "direction, south-west, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53999": {
+      "key": "9db164154e93715be29e33fc988113325dbaafa0",
+      "name": "Icon / arrow-down-narrow-wide",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54044": {
+      "key": "715f45fc2b6450ce7c4a7dae47c94714bd9df195",
+      "name": "Icon / arrow-down-right",
+      "description": "direction, south-east, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53910": {
+      "key": "2407ab1ac8927e6b18ec3669df1013f2f7dde834",
+      "name": "Icon / arrow-down-to-dot",
+      "description": "direction, south, waypoint, location, step, into",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54133": {
+      "key": "5e0592d89114ec1b669e2f3ac9c0a632efc06d03",
+      "name": "Icon / arrow-down-to-line",
+      "description": "behind, direction, south, download, save, git, version control, pull, collapse, fold, vertical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54029": {
+      "key": "e7dcb3319c4b923a991760f467854d5f4c3fef18",
+      "name": "Icon / arrow-down-up",
+      "description": "bidirectional, two-way, 2-way, swap, switch, network, traffic, flow, mobile data, internet, sort, reorder, move",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53720": {
+      "key": "58ba3a84f76db8828270e83135a374d9db4cb826",
+      "name": "Icon / arrow-down-wide-narrow",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54066": {
+      "key": "c9ce2fa993743b978bad39d99af5aa6da57bb7fc",
+      "name": "Icon / arrow-down-z-a",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, alphabetical, reverse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54004": {
+      "key": "62ed8c1ea90504f982814656eaa73c48db5aa68f",
+      "name": "Icon / arrow-down",
+      "description": "backwards, reverse, direction, south",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53575": {
+      "key": "40a4046ff245efc783661347fab267db8d016928",
+      "name": "Icon / arrow-left-from-line",
+      "description": "previous, back, direction, west, expand, fold, horizontal, <-|",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53706": {
+      "key": "7dec0f36ee8b924ede65b9c13590c08ad386c0c2",
+      "name": "Icon / arrow-left-right",
+      "description": "bidirectional, two-way, 2-way, swap, switch, transaction, reorder, move, <-, ->",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53903": {
+      "key": "52a96e7e4b2dfe0a892886cc009bbb8fa59d09cc",
+      "name": "Icon / arrow-left-to-line",
+      "description": "previous, back, direction, west, collapse, fold, horizontal, |<-",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53402": {
+      "key": "066eafa8c18c9f4dab1fa2aa41eed5bce3892c98",
+      "name": "Icon / arrow-left",
+      "description": "previous, back, direction, west, <-",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53942": {
+      "key": "aac1bc2e7d6944d74f6390522ba0beddc014df3e",
+      "name": "Icon / arrow-right-from-line",
+      "description": "next, forward, direction, east, export, expand, fold, horizontal, |->",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53988": {
+      "key": "0a562331fd1ed1f3b9d17493f9fe89fd9095d472",
+      "name": "Icon / arrow-right-left",
+      "description": "bidirectional, two-way, 2-way, swap, switch, transaction, reorder, move, <-, ->",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54136": {
+      "key": "c537494c7bdc91ae0c1fc5ca1996071ee3210c99",
+      "name": "Icon / arrow-right-to-line",
+      "description": "next, forward, direction, east, tab, keyboard, mac, indent, collapse, fold, horizontal, ->|",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54085": {
+      "key": "5abc3c47d3ec3e4ed48001304cf242e022c61519",
+      "name": "Icon / arrow-up-0-1",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, numerical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54016": {
+      "key": "1d12c85f027425425655046805fced137aa77aa2",
+      "name": "Icon / arrow-up-1-0",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, numerical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54025": {
+      "key": "92e5e76d90ead718e71d5f4a3e3687729006df18",
+      "name": "Icon / arrow-up-a-z",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, alphabetical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53507": {
+      "key": "3f9e99055ef9ca0d9cb349fc43f287a499f69ff8",
+      "name": "Icon / arrow-up-from-dot",
+      "description": "direction, north, step, out",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53702": {
+      "key": "bd894305060f58cd6d4b3d737e6db27670a00312",
+      "name": "Icon / arrow-up-from-line",
+      "description": "forward, direction, north, upload, git, version control, push, expand, fold, vertical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53893": {
+      "key": "a0223222b3605d9e7b70ab4da1e692fba2d8193c",
+      "name": "Icon / arrow-up-left",
+      "description": "direction, north-west, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53871": {
+      "key": "443c0985a8dcf899c7cfecef9833b7d1e6832772",
+      "name": "Icon / arrow-up-narrow-wide",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54072": {
+      "key": "ab5cc9f51ea355e0a58619c15c87672939263476",
+      "name": "Icon / arrow-up-right",
+      "description": "direction, north-east, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53993": {
+      "key": "bc588448e42d419e542bb782b24cc1f93777e84e",
+      "name": "Icon / arrow-up-to-line",
+      "description": "forward, direction, north, upload, collapse, fold, vertical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54159": {
+      "key": "196ce4641ac9cfcfe599a43faafcfcded2e3cf73",
+      "name": "Icon / arrow-up-wide-narrow",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54063": {
+      "key": "8d0ef14aa43d10aa3aec026977cd6f51e0273ac7",
+      "name": "Icon / arrow-up-z-a",
+      "description": "filter, sort, ascending, descending, increasing, decreasing, rising, falling, alphabetical, reverse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53982": {
+      "key": "c5f78084e22d9f28b100defb83d5300ea6019ce5",
+      "name": "Icon / arrow-up",
+      "description": "forward, direction, north",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53163": {
+      "key": "c50a6cc0b0af15325eb54a92213a588f67d6b76e",
+      "name": "Icon / arrows-up-from-line",
+      "description": "direction, orientation, this way up, vertical, package, box, fragile, postage, shipping",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53744": {
+      "key": "6a5a4aaf54855ff0bc7a32c726853086203f5fc0",
+      "name": "Icon / asterisk",
+      "description": "reference, times, multiply, multiplication, operator, code, glob pattern, wildcard, *",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53978": {
+      "key": "d969aca1a9d1421b713be098ee62125e550389ae",
+      "name": "Icon / at-sign",
+      "description": "mention, at, email, message, @",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53761": {
+      "key": "f6f996005b83454a412c48a688acf35a42a7a36e",
+      "name": "Icon / atom",
+      "description": "atomic, nuclear, physics, particle, element, molecule, electricity, energy, chemistry",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53969": {
+      "key": "620f5787bd754bb2fa13a65b1cd734286d4a1d7f",
+      "name": "Icon / audio-lines",
+      "description": "graphic equaliser, sound, noise, listen, hearing, hertz, frequency, wavelength, vibrate, sine, synthesizer, synthesiser, levels, track, music, playback, radio, broadcast, airwaves, voice, vocals, singer, song",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53620": {
+      "key": "34361f7a1cef760bfd1f5a57445aefa26a52ee96",
+      "name": "Icon / audio-waveform",
+      "description": "sound, noise, listen, hearing, hertz, frequency, wavelength, vibrate, sine, synthesizer, synthesiser, levels, track, music, playback, radio, broadcast, airwaves, voice, vocals, singer, song",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53652": {
+      "key": "5a2d9afd943cf0a6803664a28405744341af871b",
+      "name": "Icon / award",
+      "description": "achievement, badge, rosette, prize, winner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53957": {
+      "key": "7868c082cf7e6788f6c3993302e80c7dbdd635ae",
+      "name": "Icon / axe",
+      "description": "hatchet, weapon, chop, sharp, equipment, fireman, firefighter, brigade, lumberjack, woodcutter, logger, forestry",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53967": {
+      "key": "227e14c753938a3d8a5e707d7412875753fe37a0",
+      "name": "Icon / axis-3d",
+      "description": "gizmo, coordinates",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53571": {
+      "key": "2af5dc1d49c5a1d311c83dae252e73f9ba09015a",
+      "name": "Icon / baby",
+      "description": "child, childproof, children",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53152": {
+      "key": "67d95c2e36d8d80f87332e649d2915b1e197b932",
+      "name": "Icon / backpack",
+      "description": "bag, hiking, travel, camping, school, childhood",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53857": {
+      "key": "41de77bb6a2b60be8f93373cb558fce123045d62",
+      "name": "Icon / badge-alert",
+      "description": "check, verified, unverified, security, safety, issue",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53528": {
+      "key": "da3563e79b227b3d93b3ffa2314d87479d5cacdb",
+      "name": "Icon / badge-cent",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, cents, dollar, usd, $, \u00a2",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54083": {
+      "key": "1db0b1945fe191927d456c2c1d16413750646905",
+      "name": "Icon / badge-dollar-sign",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, usd, $",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53937": {
+      "key": "0214238e3990bc9bdc3c183f0a081c2a5db4de87",
+      "name": "Icon / badge-euro",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, \u20ac",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53812": {
+      "key": "5ec46fc1f8d17a0b06dabac8eb3ff67236b237c1",
+      "name": "Icon / badge-help",
+      "description": "verified, unverified, help",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53319": {
+      "key": "1154f002cc6fff87d899171c035d5c68b5c27cba",
+      "name": "Icon / badge-indian-rupee",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, inr, \u20b9",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54149": {
+      "key": "ff1491542abd875bbf8ef4bee07f81d396d978f2",
+      "name": "Icon / badge-info",
+      "description": "verified, unverified, help",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53933": {
+      "key": "b004addadeaf599155ddd517567590becab90139",
+      "name": "Icon / badge-japanese-yen",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, jpy, \u00a5",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53923": {
+      "key": "93a4d5ba364efef705b9df1f58744fcb5a8ce398",
+      "name": "Icon / badge-minus",
+      "description": "verified, unverified, delete, remove, erase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54046": {
+      "key": "6fd95d620ebe4aa60865c36898a011ab9bd01fe1",
+      "name": "Icon / badge-percent",
+      "description": "verified, unverified, sale, discount, offer, marketing, sticker, price tag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54042": {
+      "key": "e3578b1fafc8d0b87a1c58bbe4fbe08fd5afdba8",
+      "name": "Icon / badge-plus",
+      "description": "verified, unverified, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54115": {
+      "key": "f9c2cae20f51437ed2a075811329a04885de9687",
+      "name": "Icon / badge-pound-sterling",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, british, gbp, \u00a3",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53740": {
+      "key": "838cc8e5d7660c9ec569475e73766a13a81f186c",
+      "name": "Icon / badge-russian-ruble",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, rub, \u20bd",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53852": {
+      "key": "0dbf13be72a243f44dd1fb79596765b17469275e",
+      "name": "Icon / badge-swiss-franc",
+      "description": "discount, offer, sale, voucher, tag, monetization, marketing, finance, financial, exchange, transaction, payment, chf, \u20a3",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53577": {
+      "key": "cbe5e9c04acb5b855deebd700c4e9437b3e86c72",
+      "name": "Icon / badge-x",
+      "description": "verified, unverified, lost, delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53918": {
+      "key": "7a6466808832a6b7378c719a3a3279728320c90e",
+      "name": "Icon / badge",
+      "description": "check, verified, unverified",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53574": {
+      "key": "f9521205b98b282aef91f235519e980e1edc77db",
+      "name": "Icon / baggage-claim",
+      "description": "baggage, luggage, travel, cart, trolley, suitcase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53806": {
+      "key": "d21a85a1f41e932bd7df8d15ee0c86ddd2c3c8a5",
+      "name": "Icon / ban",
+      "description": "cancel, no, stop, forbidden, prohibited, error, incorrect, mistake, wrong, failure, circle, slash, null, void",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53863": {
+      "key": "c7686119ce041ef3fe1c6f53b5becf6977191902",
+      "name": "Icon / banana",
+      "description": "fruit, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53911": {
+      "key": "fc5b18b71581851662cf7f08987f04b8291a9629",
+      "name": "Icon / bandage",
+      "description": "plaster, band-aid, first aid, medical, health, wound, injury, care, treatment, healing, protection, emergency, aid, safety",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54165": {
+      "key": "abade9c849e5df26b90d4392a0dfa456a18ffc3c",
+      "name": "Icon / banknote-arrow-down",
+      "description": "bill, currency, money, payment, funds, transaction, cash, finance, withdraw, expense, out, payout, refund, debit, spending, decrease",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53271": {
+      "key": "c79fbf45ddbde3a0b80525b95573b7a2152e9f75",
+      "name": "Icon / banknote-arrow-up",
+      "description": "bill, currency, money, payment, funds, transaction, cash, finance, deposit, earnings, income, in, credit, prepaid, growth, increase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53823": {
+      "key": "d7bb5bd41b4dbf02ddf6aae06c0a6c0ef8d93e8c",
+      "name": "Icon / banknote-x",
+      "description": "bill, currency, money, payment, funds, transaction, cash, finance, error, failed, rejected, canceled, declined, lost, delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53220": {
+      "key": "35b8b6bfbc4569d6e3f8a1b1f2931bd4bee38ff7",
+      "name": "Icon / banknote",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53758": {
+      "key": "f1e564b306fc055491543ff6963af8ac9ae4306d",
+      "name": "Icon / barcode",
+      "description": "scan, checkout, till, cart, transaction, purchase, buy, product, packaging, retail, consumer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53748": {
+      "key": "a2d021b037d793e621286a71d17320353a812c3c",
+      "name": "Icon / baseline",
+      "description": "text, format, color",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54018": {
+      "key": "59249325eb7f4a900ad1322b61c7eff6001f69a9",
+      "name": "Icon / bath",
+      "description": "amenities, services, bathroom, shower",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53900": {
+      "key": "d3824633e0c7235be5dfa4c8744583442a628a3e",
+      "name": "Icon / battery-charging",
+      "description": "power, electricity, energy, accumulator, charge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53525": {
+      "key": "945d6f6c746dfa6a1fb98610fd12866da82d52f3",
+      "name": "Icon / battery-full",
+      "description": "power, electricity, energy, accumulator, charge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53894": {
+      "key": "b9e7421c4804e5be9ef1e99991d004228aab9fdd",
+      "name": "Icon / battery-low",
+      "description": "power, electricity, energy, accumulator, charge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53979": {
+      "key": "01dda1d1f271ad272209f64898a38499acaf551d",
+      "name": "Icon / battery-medium",
+      "description": "power, electricity, energy, accumulator, charge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53550": {
+      "key": "ce625ac166939727cc841660290dec9fb4e55c8b",
+      "name": "Icon / battery-plus",
+      "description": "power, electricity, energy, accumulator, charge, plus, economy, health, add, new, maximum, upgrade, extra, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53890": {
+      "key": "31b0bb4cfd288488cb40eb4fe93e7e27b6bde204",
+      "name": "Icon / battery-warning",
+      "description": "power, electricity, energy, accumulator, charge, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53972": {
+      "key": "a12cb526077dbfc153bf51c0c76b6f11ac6bfd12",
+      "name": "Icon / battery",
+      "description": "power, electricity, energy, accumulator, charge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54015": {
+      "key": "a010c271fa5cf97eb2892fd2570e8bd7eccdbd9b",
+      "name": "Icon / beaker",
+      "description": "cup, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53853": {
+      "key": "8e6d251da92f8260285227e17746be9e459177e0",
+      "name": "Icon / bean-off",
+      "description": "soy free, legume, soy, food, seed, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53955": {
+      "key": "22adfece3594c10aa3d6228e95f8512c5d60ac27",
+      "name": "Icon / bean",
+      "description": "legume, soy, food, seed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53887": {
+      "key": "c64ea184bb7ddabb6936dc3c4ae8dc32c68cd1e7",
+      "name": "Icon / bed-double",
+      "description": "sleep, hotel, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53421": {
+      "key": "55019d7fb2d68a39343a657de2574283a6cb79c4",
+      "name": "Icon / bed-single",
+      "description": "sleep, hotel, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53368": {
+      "key": "708cc7aaf00d9921d3096a5252ea2c22beb5cbb3",
+      "name": "Icon / bed",
+      "description": "sleep, hotel, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53880": {
+      "key": "2115fa64062e9e7b9bfba58fabee3d8c126f6ac2",
+      "name": "Icon / beef",
+      "description": "food, dish, restaurant, course, meal, meat, bbq, steak",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53397": {
+      "key": "7427d77c9f349967e09bd59b2b7ddd058fd819ef",
+      "name": "Icon / beer-off",
+      "description": "alcohol, bar, beverage, brewery, drink",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53878": {
+      "key": "bc29ea3baeb9b4872f5e7b8d93a85ee7d76f0792",
+      "name": "Icon / beer",
+      "description": "alcohol, bar, beverage, brewery, drink",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53951": {
+      "key": "1a192ba73a7ba68891d560da12226ca5663747c3",
+      "name": "Icon / bell-dot",
+      "description": "alarm, notification, sound, reminder, unread",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53697": {
+      "key": "638ba6130a59165d85bf5fed40811d213d6ebeff",
+      "name": "Icon / bell-electric",
+      "description": "fire alarm, flames, smoke, firefighter, fireman, department, brigade, station, emergency, alert, safety, school bell, period break, recess, doorbell, entrance, entry, ring, reception",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53877": {
+      "key": "6b6383c2d1cbc817a821b629bfb36113b404ec32",
+      "name": "Icon / bell-minus",
+      "description": "alarm, notification, silent, reminder, delete, remove, erase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53566": {
+      "key": "b53d5b2b6af351e7a3d4874abb9794cc0fd63dee",
+      "name": "Icon / bell-off",
+      "description": "alarm, notification, silent, reminder",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53867": {
+      "key": "3bd632b726aba653230e9aee99cba40099fea25d",
+      "name": "Icon / bell-plus",
+      "description": "notification, silent, reminder, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53595": {
+      "key": "fcb7e26b739b7b14b3b42516143950af8622cd3a",
+      "name": "Icon / bell-ring",
+      "description": "alarm, notification, sound, reminder",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53840": {
+      "key": "810c424927c74c0fc5da631e35e3d854f720fc14",
+      "name": "Icon / bell",
+      "description": "alarm, notification, sound, reminder",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54009": {
+      "key": "de20fedb62b0390d49c473ef65846a8f9dfd76ca",
+      "name": "Icon / between-horizontal-end",
+      "description": "insert, add, left, slot, squeeze, space, vertical, grid, table, rows, cells, excel, spreadsheet, accountancy, data, enter, entry, entries, blocks, rectangles, chevron",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53855": {
+      "key": "c14c16acc8a396ca0dcb002f6c2bef0e768b1337",
+      "name": "Icon / between-horizontal-start",
+      "description": "insert, add, right, slot, squeeze, space, vertical, grid, table, rows, cells, excel, spreadsheet, accountancy, data, enter, entry, entries, blocks, rectangles, chevron",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53845": {
+      "key": "2b67d47e56dd55da1ef1794a039219385826efc5",
+      "name": "Icon / between-vertical-end",
+      "description": "insert, add, top, slot, squeeze, space, vertical, grid, table, columns, cells, data, enter, entry, entries, blocks, rectangles, chevron",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53913": {
+      "key": "df1f740fb6d06df6c877d707eee86e77962042c4",
+      "name": "Icon / between-vertical-start",
+      "description": "insert, add, bottom, slot, squeeze, space, vertical, grid, table, columns, cells, data, enter, entry, entries, blocks, rectangles, chevron",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53630": {
+      "key": "564ae34c9c3b1b404f25e02f745f4a082809cc9d",
+      "name": "Icon / biceps-flexed",
+      "description": "arm, muscle, strong, working out, athletic, toned, muscular, forelimb, curled",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54034": {
+      "key": "48fb585c0191bab7b8c97e43ff7f65e5ca2b2fb7",
+      "name": "Icon / bike",
+      "description": "bicycle, transport, trip",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53750": {
+      "key": "39803d83e9f60b8797e1532f9f2513de3f486210",
+      "name": "Icon / binary",
+      "description": "code, digits, computer, zero, one, boolean",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53842": {
+      "key": "4ca8d4674bae00ad3395f9dae608ec9e8bd451fe",
+      "name": "Icon / binoculars",
+      "description": "field glasses, lorgnette, pince-nez, observation, sightseeing, nature, wildlife, birdwatching, scouting, surveillance, search, discovery, monitoring, lookout, viewpoint, travel, tourism, research",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53559": {
+      "key": "ea83d82849eba4fd2d5b7df86c4019ab2092d818",
+      "name": "Icon / biohazard",
+      "description": "fallout, waste, biology, chemistry, chemical, element",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53501": {
+      "key": "005bb3a43b8fd7a69c8dc409c29d8df1f6055a10",
+      "name": "Icon / bird",
+      "description": "peace, freedom, wing, avian, tweet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53710": {
+      "key": "605f05e519bf660fc510f9240760990724a495a2",
+      "name": "Icon / bitcoin",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53292": {
+      "key": "0be630820f2d7c452c395b8a72a1eed0e9e01b8e",
+      "name": "Icon / blend",
+      "description": "mode, overlay, multiply, screen, opacity, transparency, alpha, filters, lenses, mixed, shades, tints, hues, saturation, brightness, overlap, colors, colours",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53884": {
+      "key": "ea573a40cfcf664824bd69d27b3d7fb6820b66e8",
+      "name": "Icon / blinds",
+      "description": "shades, screen, curtain, shutter, roller blind, window, lighting, household, home",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54150": {
+      "key": "3aed0997db2635cbd7526ffb65a4a3629fdb2913",
+      "name": "Icon / blocks",
+      "description": "addon, plugin, integration, extension, package, build, stack, toys, kids, children, learning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54113": {
+      "key": "c920ca9ac7060ced5f1bdc9eab112e87668626cc",
+      "name": "Icon / bluetooth-connected",
+      "description": "paired",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53495": {
+      "key": "9278cc9fac982ac92f630a4925951bc50e49efd3",
+      "name": "Icon / bluetooth-off",
+      "description": "lost",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53834": {
+      "key": "b77e22cb858ad1e58d11ee6213a0195420a8a666",
+      "name": "Icon / bluetooth-searching",
+      "description": "pairing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53874": {
+      "key": "3b56d8a6d9ed137313de88a2f425e945d858320a",
+      "name": "Icon / bluetooth",
+      "description": "wireless",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53813": {
+      "key": "890d2619ca48b5f3731f07dbe05ec2095f58e8e2",
+      "name": "Icon / bold",
+      "description": "text, strong, format",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53864": {
+      "key": "67a5b32b0660b59e922e78d3068edf3bae3e1e34",
+      "name": "Icon / bolt",
+      "description": "nut, screw, settings, preferences, configuration, controls, edit, diy, fixed, build, construction, parts",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53257": {
+      "key": "16fe911b26f32e5e04b5f28ef25c6e50ba9c2f4a",
+      "name": "Icon / bomb",
+      "description": "fatal, error, crash, blockbuster, mine, explosion, explode, explosive",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53833": {
+      "key": "d55f77e44e0113ca3e1dd3b6c4c52a003bb1d422",
+      "name": "Icon / bone",
+      "description": "health, skeleton, skull, death, pets, dog",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53817": {
+      "key": "55a9159d300fe89eec8a37f0afe323c35d6a7214",
+      "name": "Icon / book-a",
+      "description": "dictionary, define, definition, thesaurus, encyclopedia, encyclopaedia, reading, booklet, magazine, leaflet, pamphlet, tome, library, writing, written, writer, author, story, script, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, language, translate, alphabetical, a-z, ordered",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53287": {
+      "key": "bae8e921a5d9198e120704cd51375df6b832e328",
+      "name": "Icon / book-audio",
+      "description": "audiobook, reading, listening, sound, story, fiction, novel, information, knowledge, education, student, study, learning, research",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53826": {
+      "key": "46f7fbc8ae727116d65ac8197608090e0795d0cf",
+      "name": "Icon / book-check",
+      "description": "read, booklet, magazine, leaflet, pamphlet, library, written, authored, published, informed, knowledgeable, educated, schooled, homework, examined, tested, marked, passed, graduated, studied, learned, lesson, researched, documented, revealed, blank, plain language, true, truth, verified, corrected, task, todo, done, completed, finished, ticked",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53810": {
+      "key": "c1264daec91a3c5b3c99b30a02d333ccf80b1552",
+      "name": "Icon / book-copy",
+      "description": "code, coding, version control, git, repository, clone, fork, duplicate, multiple, books, library, copies, copied, plagiarism, plagiarised, plagiarized, reading list, information, informed, knowledge, knowledgeable, knowledgable, education, high school, university, college, academy, student, study, learning, research, smart, intelligent, intellectual",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54074": {
+      "key": "daa5a67a8d8456acaa884d17b9b6b36e902b46f1",
+      "name": "Icon / book-dashed",
+      "description": "code, coding, version control, git, repository, template, draft, script, screenplay, writing, writer, author, unwritten, unpublished, untold",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53240": {
+      "key": "62b1e9dc93f666aaf517c5322df9408725fd619f",
+      "name": "Icon / book-down",
+      "description": "code, coding, version control, git, repository, pull",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53802": {
+      "key": "10f03e32e7180bdb02ccb5eed6962c927231651b",
+      "name": "Icon / book-headphones",
+      "description": "audiobook, reading, listening, sound, story, fiction, novel, information, knowledge, education, student, study, learning, research",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53475": {
+      "key": "fb60d04142edd599bb6ab4b43887b850d1d1a5b4",
+      "name": "Icon / book-heart",
+      "description": "diary, romance, novel, journal, entry, entries, personal, private, secret, crush, like, love, emotion, feminine, girls, teens, teenager, therapy, theraputic, therapist, planner, organizer, organiser, notes, notepad, stationery, sketchbook, writing, written, reading, favorite, favourite, high school",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53788": {
+      "key": "b5df97cf73238910c411bb2b40e27e8a661f36b6",
+      "name": "Icon / book-image",
+      "description": "images, pictures, photos, album, collection, event, magazine, catalog, catalogue, brochure, browse, gallery",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53822": {
+      "key": "e307a70b5da9835754f29a1676f191e1400d7389",
+      "name": "Icon / book-key",
+      "description": "code, coding, version control, git, repository, private, public, secret, unlocked, hidden, revealed, knowledge, learning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53795": {
+      "key": "004317416cda2989d9596db68a74882513e12407",
+      "name": "Icon / book-lock",
+      "description": "code, coding, version control, git, repository, private, secret, hidden, knowledge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53819": {
+      "key": "48b01cacbc856a3e9293f5c76512226973c29482",
+      "name": "Icon / book-marked",
+      "description": "dictionary, reading, booklet, magazine, leaflet, pamphlet, tome, library, writing, written, writer, author, story, script, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, documentation, saved, later, future, reference, index, code, coding, version control, git, repository",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53901": {
+      "key": "294590c3f3d0ede1df0b8de6b01e5559a6162c68",
+      "name": "Icon / book-minus",
+      "description": "code, coding, version control, git, repository, remove, delete, censor, cancel, forbid, prohibit, ban, uneducated, re-educate, unlearn, downgrade",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53580": {
+      "key": "0df57288c3469fadbce21a056ae4dab4a6499015",
+      "name": "Icon / book-open-check",
+      "description": "read, pages, booklet, magazine, leaflet, pamphlet, library, written, authored, published, informed, knowledgeable, educated, schooled, homework, examined, tested, marked, passed, graduated, studied, learned, lesson, researched, documented, revealed, blank, plain language, true, truth, verified, corrected, task, todo, done, completed, finished, ticked",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53147": {
+      "key": "7bd5a615b4e6d4e433783f9b106c2c852cf157df",
+      "name": "Icon / book-open-text",
+      "description": "reading, pages, booklet, magazine, leaflet, pamphlet, library, writing, written, writer, author, story, script, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, documentation, revealed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53506": {
+      "key": "3947f2281e90995e0f9168cd778f8a5d401d3671",
+      "name": "Icon / book-open",
+      "description": "reading, pages, booklet, magazine, leaflet, pamphlet, library, writing, written, writer, author, story, script, screenplay, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, documentation, revealed, blank, plain",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53792": {
+      "key": "665cee266b2b0e26be2557ca28670bf8063cb3be",
+      "name": "Icon / book-plus",
+      "description": "code, coding, version control, git, repository, remove, delete, read, write, author, publish, inform, graduate, re-educate, study, learn, research, knowledge, improve, upgrade, level up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53777": {
+      "key": "7f478f0cb32e68dbb3f4b9ef53b52fb3487ed96d",
+      "name": "Icon / book-text",
+      "description": "reading, booklet, magazine, leaflet, pamphlet, tome, library, writing, written, writer, author, story, script, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, documentation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53774": {
+      "key": "d25283fe883e7374c33213e09a88eff55745d706",
+      "name": "Icon / book-type",
+      "description": "thesaurus, synonym, reading, booklet, magazine, leaflet, pamphlet, tome, library, writing, written, writer, author, story, script, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, language, translate, typography, fonts, collection",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53773": {
+      "key": "20411a0cf685250cefd6a91ee5347c7d2a6e0693",
+      "name": "Icon / book-up-2",
+      "description": "code, coding, version control, git, repository, push, force",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53765": {
+      "key": "d5b7b12ff47b3b03d6b0423f92334147321a3840",
+      "name": "Icon / book-up",
+      "description": "code, coding, version control, git, repository, push",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53762": {
+      "key": "de4431434bd9b24239e04f7687c27e60f839acc2",
+      "name": "Icon / book-user",
+      "description": "person, people, family, friends, acquaintances, contacts, details, addresses, phone numbers, directory, listing, networking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53179": {
+      "key": "ca6abeae99fd4dbc6b33414bcb8f0fbe57fc0178",
+      "name": "Icon / book-x",
+      "description": "code, coding, version control, git, repository, remove, delete, reading, misinformation, disinformation, misinformed, charlatan, sophistry, false, lies, untruth, propaganda, censored, cancelled, forbidden, prohibited, banned, uneducated, re-education, unlearn",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53677": {
+      "key": "5b41ec625bace2ae5655f81f12b4f047f602fa49",
+      "name": "Icon / book",
+      "description": "reading, paperback, booklet, magazine, leaflet, pamphlet, tome, library, writing, written, writer, author, story, script, fiction, novel, information, knowledge, education, high school, university, college, academy, student, study, learning, homework, research, documentation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53756": {
+      "key": "3c202b6ddf35d95493445e6bbcae4c6df405fe2a",
+      "name": "Icon / bookmark-check",
+      "description": "read, finished, complete, clip, marker, tag, task, todo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53755": {
+      "key": "474147ab8191c6424fa7259755d6628476eba462",
+      "name": "Icon / bookmark-minus",
+      "description": "delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53170": {
+      "key": "7d5d6cf799972716a5afe66a5e8301986c37ff28",
+      "name": "Icon / bookmark-plus",
+      "description": "add",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53752": {
+      "key": "1fee6c3bce55ab02d0014a6c9c6484f354d046eb",
+      "name": "Icon / bookmark-x",
+      "description": "read, clip, marker, tag, cancel, close, delete, remove, clear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53379": {
+      "key": "539b1b5ddd2dbade95e46169267e571479dcbf48",
+      "name": "Icon / boom-box",
+      "description": "radio, speakers, audio, music, sound, broadcast, live, frequency",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53173": {
+      "key": "895fd91db40fff43b780bda2f8d7d0656450e8d7",
+      "name": "Icon / bot-message-square",
+      "description": "robot, ai, chat, assistant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53745": {
+      "key": "28cc8f6beff8b29f2efbef196507b16f575a726b",
+      "name": "Icon / bot-off",
+      "description": "robot, ai, chat, assistant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53647": {
+      "key": "29dbc3f9a129e85fe2f9d2f0cbd5f9de7e290a58",
+      "name": "Icon / bot",
+      "description": "robot, ai, chat, assistant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53825": {
+      "key": "369124d9dc3dc884a829811a7827f7ec08214b73",
+      "name": "Icon / bow-arrow",
+      "description": "archer, archery, game, war, weapon",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53738": {
+      "key": "ec5405874bc21b6636fcbb3f8c89450322f18b03",
+      "name": "Icon / box",
+      "description": "cube, package, container, storage, geometry, 3d, isometric",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53736": {
+      "key": "bb7701fc6da09c1b5abd2dab9f4d141078eaac90",
+      "name": "Icon / boxes",
+      "description": "cubes, packages, parts, group, units, collection, cluster, geometry",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53586": {
+      "key": "a5b7542a4c43b923ddbb0e8310b81133d81af61d",
+      "name": "Icon / braces",
+      "description": "json, code, token, curly brackets, data, {, }",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53305": {
+      "key": "e1425dd4d6d9b54b05145d81e0a90f8777efd91b",
+      "name": "Icon / brackets",
+      "description": "code, token, array, list, square, [, ]",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53433": {
+      "key": "cd3518d7f9be01a52bc768357bea44a8117a84c0",
+      "name": "Icon / brain-circuit",
+      "description": "mind, intellect, artificial intelligence, ai, deep learning, machine learning, computing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53742": {
+      "key": "9abe06b4a9dd318b2128e541cc0450de0a8c3f2a",
+      "name": "Icon / brain-cog",
+      "description": "mind, intellect, artificial intelligence, ai, deep learning, machine learning, computing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53615": {
+      "key": "d97912b1cae4d1fd2dac3089a069e769a2990a1d",
+      "name": "Icon / brain",
+      "description": "medical, mind, intellect, cerebral, consciousness, genius, artificial intelligence, ai",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53733": {
+      "key": "ef3c62e466e59b744c411f527acf3f9bfc75fafc",
+      "name": "Icon / brick-wall-fire",
+      "description": "firewall, security, bricks, mortar, cement, materials, construction, builder, labourer, quantity surveyor, blocks, stone, campfire, camping, wilderness, outdoors, lit, warmth, wood, twigs, sticks",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53851": {
+      "key": "28f26f85315034627114535ae65149ffd507bc2c",
+      "name": "Icon / brick-wall",
+      "description": "bricks, mortar, cement, materials, construction, builder, labourer, quantity surveyor, blocks, stone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53732": {
+      "key": "c717acff5936681df9c1997845ceb32e510d244d",
+      "name": "Icon / briefcase-business",
+      "description": "work, bag, baggage, folder, portfolio",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53731": {
+      "key": "72bb9eca41600e645f40c931c06e15359c11c81c",
+      "name": "Icon / briefcase-conveyor-belt",
+      "description": "baggage, luggage, travel, suitcase, conveyor, carousel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53807": {
+      "key": "5747f4745d8af6b7393649d3c922f6e6ce77245a",
+      "name": "Icon / briefcase-medical",
+      "description": "doctor, medicine, first aid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53728": {
+      "key": "11b0354b8cdd1f5e47bf91990551db5d91dc692f",
+      "name": "Icon / briefcase",
+      "description": "work, bag, baggage, folder",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53725": {
+      "key": "967f34ef4ec17788bff0cf77a006606ed6559806",
+      "name": "Icon / bring-to-front",
+      "description": "bring, send, move, over, forward, front, overlap, layer, order",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53839": {
+      "key": "3e3c0f618cc27e80ddf37b37e1ead643061d6c08",
+      "name": "Icon / brush-cleaning",
+      "description": "cleaning, utensil, housekeeping, tool, sweeping, scrubbing, hygiene, maintenance, household, cleaner, chores, equipment, sanitation, bristles, handle, home care, sanitize, purify, wash, disinfect, sterilize, scrub, polish, decontaminate, wipe, spotless, remove, empty, erase, purge, eliminate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53743": {
+      "key": "19e7f886924b7969ab11ef2953f7d6c491605d9e",
+      "name": "Icon / brush",
+      "description": "clean, sweep, refactor, remove, draw, paint, color, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54032": {
+      "key": "06baea3973be20e6c3c2c9a8a74a4e968d997b43",
+      "name": "Icon / bubbles",
+      "description": "water, cleaning, soap, bath, hygiene, freshness, wash, foam, cleanliness, shampoo, purity, splash, lightness, airy, relaxation, spa, bubbly, fluid, floating, drop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53726": {
+      "key": "4efc491cbd0177fba7e39a7e41ecdc65960a7d22",
+      "name": "Icon / bug-off",
+      "description": "debug, code, insect, kill, exterminate, pest control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53941": {
+      "key": "a73309a91c7bede011d0a753c9839c4ce0fd47b0",
+      "name": "Icon / bug-play",
+      "description": "debug, code, insect",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53303": {
+      "key": "c1fcaad77e4f841f35c0fe9f2d8c76d5f140d7dc",
+      "name": "Icon / bug",
+      "description": "issue, report, debug, code, insect",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53722": {
+      "key": "021f6f8422407c6b3b1e4a4618d37c4842a7900c",
+      "name": "Icon / building-2",
+      "description": "business, company, enterprise, skyscraper, organisation, organization, city",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53861": {
+      "key": "04575828ac77afdfea233a8950a3cd3b5c19f38d",
+      "name": "Icon / building",
+      "description": "organisation, organization",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53700": {
+      "key": "969ac4e52624ccba36b60150e9f001aa06ed0e9a",
+      "name": "Icon / bus-front",
+      "description": "coach, vehicle, trip, road",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53716": {
+      "key": "dee2ab39041e852e7927ceac3d29276a3eeb14d6",
+      "name": "Icon / bus",
+      "description": "bus, vehicle, transport, trip",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53649": {
+      "key": "dc082656fd82e9ea388a7164e5e299c91c1ceec8",
+      "name": "Icon / cable-car",
+      "description": "ski lift, winter holiday, alpine, resort, mountains",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53300": {
+      "key": "963d60579c3bcdcae5e658dc3986744fc35fb30e",
+      "name": "Icon / cable",
+      "description": "cord, wire, connector, connection, link, signal, console, computer, equipment, electricity, energy, electronics, recharging, charger, power, supply, disconnected, unplugged, plugs, interface, input, output, audio video, av, rca, scart, tv, television, optical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53713": {
+      "key": "ef7169c04df3aa711b9a148cf948bc5b2a435b64",
+      "name": "Icon / cake-slice",
+      "description": "birthday, birthdate, celebration, party, surprise, gateaux, dessert, candles, wish, fondant, icing sugar, sweet, baking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53610": {
+      "key": "d71b409364facebc686ce581592c9d3a7093087d",
+      "name": "Icon / cake",
+      "description": "birthday, birthdate, celebration, party, surprise, gateaux, dessert, fondant, icing sugar, sweet, baking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53709": {
+      "key": "d9c0d1cb0b0bd3f1dd0fe386f75327bbfa15e17c",
+      "name": "Icon / calculator",
+      "description": "count, calculating machine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54104": {
+      "key": "e959304be9348778673a2abc6e76113074ad2a62",
+      "name": "Icon / calendar-1",
+      "description": "date, month, year, event, single, singular, once, 1, first",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53715": {
+      "key": "bcb413180f9ca02f05a22b011bfee791f60651d4",
+      "name": "Icon / calendar-arrow-down",
+      "description": "date, month, year, event, sort, order, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53176": {
+      "key": "f14e7f1f3a942b57cdea9ffccaba033c25f11470",
+      "name": "Icon / calendar-arrow-up",
+      "description": "date, month, year, event, sort, order, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53708": {
+      "key": "f6d9a73644824ec5049bcd6cc56f293302f34c1b",
+      "name": "Icon / calendar-check-2",
+      "description": "date, day, month, year, event, confirm, subscribe, schedule, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53399": {
+      "key": "ce1c4794e3c48587a081c6ab37f00a1f3bc32a31",
+      "name": "Icon / calendar-check",
+      "description": "date, day, month, year, event, confirm, subscribe, schedule, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53705": {
+      "key": "4571962183bde222877a51c2b849b507a3dcad4f",
+      "name": "Icon / calendar-clock",
+      "description": "date, day, month, year, event, clock, hour",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53703": {
+      "key": "3ffe838e9f8e0f0bc6848b837f3bd6ee56f30356",
+      "name": "Icon / calendar-cog",
+      "description": "date, day, month, year, events, settings, gear, cog",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53694": {
+      "key": "dd962e5a07d8fc030976223cb627bf242fb6d83b",
+      "name": "Icon / calendar-days",
+      "description": "date, month, year, event",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53908": {
+      "key": "762799111741b06463dd60909f8e7f54ac2fe6ac",
+      "name": "Icon / calendar-fold",
+      "description": "date, month, year, event, birthday, birthdate, ics",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53404": {
+      "key": "fd95fd6fb4923f7f5a2b28479e1138dc52e63a43",
+      "name": "Icon / calendar-heart",
+      "description": "date, month, year, event, heart, favourite, subscribe, valentines day",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53689": {
+      "key": "7fab05262a77476f69b17f836dd891a05fa3d79a",
+      "name": "Icon / calendar-minus-2",
+      "description": "date, day, month, year, event, delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53687": {
+      "key": "b62307fa1e263a538e08db2b1272b11575fb93c4",
+      "name": "Icon / calendar-minus",
+      "description": "date, day, month, year, event, delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53518": {
+      "key": "b7f6041d4776ae7a79330e8a676854a19c384b39",
+      "name": "Icon / calendar-off",
+      "description": "date, day, month, year, event, delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54087": {
+      "key": "6b30959ff4c0843b8b5b281effef5166fb9328b0",
+      "name": "Icon / calendar-plus-2",
+      "description": "date, day, month, year, event, add, subscribe, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53920": {
+      "key": "fa8d59806551db10d985e81427cc196dda383885",
+      "name": "Icon / calendar-plus",
+      "description": "date, day, month, year, event, add, subscribe, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53772": {
+      "key": "63ac7d35534c07d2df8a5c149b2aa6d903502f15",
+      "name": "Icon / calendar-range",
+      "description": "date, day, month, year, event, range, period",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53960": {
+      "key": "07876f937122c12ab9df654876a93c8b2c996f19",
+      "name": "Icon / calendar-search",
+      "description": "date, day, month, year, events, search, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53675": {
+      "key": "05fdb17c224fd18483c135a57cd76bf2d868bec2",
+      "name": "Icon / calendar-sync",
+      "description": "repeat, refresh, reconnect, transfer, backup, date, month, year, event, subscribe, recurring, schedule, reminder, automatic, auto",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54058": {
+      "key": "93adb003ed0a40da2d4edc9f74e37fd7f926636a",
+      "name": "Icon / calendar-x-2",
+      "description": "date, day, month, year, event, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53643": {
+      "key": "a0a22f81bb09c8cb6e2a2561b13a2bba1716d28a",
+      "name": "Icon / calendar-x",
+      "description": "date, day, month, year, event, remove, busy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53784": {
+      "key": "2e19de56a7affe8c5f57575d8fc3f99c39206526",
+      "name": "Icon / camera-off",
+      "description": "photo, webcam, video",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53673": {
+      "key": "baba28d1796834fddd2a221cee09e9a1b58ddc04",
+      "name": "Icon / camera",
+      "description": "photo, webcam, video",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53670": {
+      "key": "09812350068e0e61f0a1d9157cf672430ee0867e",
+      "name": "Icon / candy-cane",
+      "description": "sugar, food, sweet, christmas, xmas",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53301": {
+      "key": "6ceae5de7ebca2f3072b4d4dbe7129191bd7e2d6",
+      "name": "Icon / candy-off",
+      "description": "sugar free, food, sweet, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53664": {
+      "key": "bbf414a49d44fe6d100ad2e6c22e0db5bddcf454",
+      "name": "Icon / candy",
+      "description": "sugar, food, sweet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53653": {
+      "key": "7e6db18a27d11b9dd48094fde7bb0ca01b1aa733",
+      "name": "Icon / cannabis",
+      "description": "cannabis, weed, leaf",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53662": {
+      "key": "522b2a9562b6d2661a38c0413f7cb3e1707727dc",
+      "name": "Icon / captions-off",
+      "description": "closed captions, subtitles, subhead, transcription, transcribe, dialogue, accessibility",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53661": {
+      "key": "8f59aa9f9c4e9d9189156d5543f6b767fbf2b090",
+      "name": "Icon / captions",
+      "description": "closed captions, subtitles, subhead, transcription, transcribe, dialogue, accessibility",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53464": {
+      "key": "4ebb74d04bab9e61f7231ce5ba2dc745cab68f94",
+      "name": "Icon / car-front",
+      "description": "vehicle, drive, trip, journey",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53659": {
+      "key": "ffb2f519dc16049cca6a76b09b750708a24c88e2",
+      "name": "Icon / car-taxi-front",
+      "description": "cab, vehicle, drive, trip, journey",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53654": {
+      "key": "9717260076a90f36841c5542e6dca7cb62285649",
+      "name": "Icon / car",
+      "description": "vehicle, drive, trip, journey",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53591": {
+      "key": "b2609e304e3724d616caaed2f9c2d6d62e6d2bc1",
+      "name": "Icon / caravan",
+      "description": "trailer, tow, camping, campsite, mobile home, holiday, nomadic, wilderness, outdoors",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53651": {
+      "key": "c1512618c51f7904e9e3c19ee5d2f10cc48ae09a",
+      "name": "Icon / carrot",
+      "description": "vegetable, food, eat",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53114": {
+      "key": "2aac0b50ef6746fd6e51d238d9ad38e28e614ec3",
+      "name": "Icon / case-lower",
+      "description": "text, letters, characters, font, typography",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53648": {
+      "key": "421efb6a413f0a622e35f41d034546a0a5ea22c1",
+      "name": "Icon / case-sensitive",
+      "description": "text, letters, characters, font, typography",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53803": {
+      "key": "06c1cfd0f15a59e9ef8fa68033e582ccdbcbfd76",
+      "name": "Icon / case-upper",
+      "description": "text, letters, characters, font, typography",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54098": {
+      "key": "661a8a01d6326e6a0880102f997c773b96bd9d3f",
+      "name": "Icon / cassette-tape",
+      "description": "audio, music, recording, play",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53411": {
+      "key": "4f06a06843399397381d744de808405097fdd7c8",
+      "name": "Icon / cast",
+      "description": "chromecast, airplay, screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54019": {
+      "key": "874ece0d1141f4235ce37f058932c2465c26dc3c",
+      "name": "Icon / castle",
+      "description": "fortress, stronghold, palace, chateau, building",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53809": {
+      "key": "9525e02b67d4f2f24899f40a44d4a617ba2e28ac",
+      "name": "Icon / cat",
+      "description": "animal, pet, kitten, feline",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53314": {
+      "key": "48ea7ec097895701efdc0aad6b527bd2f75e2417",
+      "name": "Icon / cctv",
+      "description": "camera, surveillance, recording, film, videotape, crime, watching",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53644": {
+      "key": "8a3d4777ea293ae2e963d542092700105d86dab8",
+      "name": "Icon / chart-area",
+      "description": "statistics, analytics, diagram, graph, area",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53799": {
+      "key": "793802ec03659bbf0b7c802680e85321efa9dd1d",
+      "name": "Icon / chart-bar-big",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53796": {
+      "key": "b57763033802ecc3ebf314bdd2ebf41c33a4b5b7",
+      "name": "Icon / chart-bar-decreasing",
+      "description": "statistics, analytics, diagram, graph, trending down",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53954": {
+      "key": "a686ba3e0cbf3880aa8357762e7907f2ccba6f9c",
+      "name": "Icon / chart-bar-increasing",
+      "description": "statistics, analytics, diagram, graph, trending up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53642": {
+      "key": "02f9d3c768f6cf005c34ea941a931ce638097395",
+      "name": "Icon / chart-bar-stacked",
+      "description": "statistics, analytics, diagram, graph, multivariate, categorical, comparison",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53637": {
+      "key": "3877935901e9647c4c481f48d052f36c74d41248",
+      "name": "Icon / chart-bar",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53696": {
+      "key": "7a6749e66f3c3430c7b84b9dcea3376690aa838d",
+      "name": "Icon / chart-candlestick",
+      "description": "trading, trader, financial, markets, portfolio, assets, prices, value, valuation, commodities, currencies, currency, stocks, exchange, hedge fund, statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53324": {
+      "key": "2f0a579aa058bb13e1998820916237a94fab1d24",
+      "name": "Icon / chart-column-big",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53636": {
+      "key": "1533c3acc0cdceddd688dfd62ebd8a3f512f89dd",
+      "name": "Icon / chart-column-decreasing",
+      "description": "statistics, analytics, diagram, graph, trending down",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53538": {
+      "key": "9fbfc188beabde934e1e09aab318cb05962fb6be",
+      "name": "Icon / chart-column-increasing",
+      "description": "statistics, analytics, diagram, graph, trending up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54017": {
+      "key": "b41e40349fcc3e7938ec6f9a16d7adaafa531490",
+      "name": "Icon / chart-column-stacked",
+      "description": "statistics, analytics, diagram, graph, multivariate, categorical, comparison",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53707": {
+      "key": "e046bf47c1e920b262366283e9a2e21bd665acc9",
+      "name": "Icon / chart-column",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53631": {
+      "key": "a6541526d69afddccab290361e0ac5e22e6def4e",
+      "name": "Icon / chart-gantt",
+      "description": "diagram, graph, timeline, planning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53349": {
+      "key": "4941d13ffc9d78ab388c5ec0fcea37df05ebd20f",
+      "name": "Icon / chart-line",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53797": {
+      "key": "a8d3d77e7edf58a5e42a97bb892d4152656fc362",
+      "name": "Icon / chart-network",
+      "description": "statistics, analytics, diagram, graph, topology, cluster, web, nodes, connections, edges",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53628": {
+      "key": "2b61bf1b616a116435d2bddd3f674b675a2bbf86",
+      "name": "Icon / chart-no-axes-column-decreasing",
+      "description": "statistics, analytics, diagram, graph, trending down",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53267": {
+      "key": "d68e776191adf38e34c92728a1e2fc4988b7d83a",
+      "name": "Icon / chart-no-axes-column-increasing",
+      "description": "statistics, analytics, diagram, graph, trending up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54142": {
+      "key": "b6c949bce89fe1ef5ce03c8acefb19db76da6e3f",
+      "name": "Icon / chart-no-axes-column",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54043": {
+      "key": "a241292c604c290de96fa92f83fedcae91e6b87d",
+      "name": "Icon / chart-no-axes-combined",
+      "description": "statistics, analytics, diagram, graph, trending up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53625": {
+      "key": "ec766a84343a8b55ffdacac753722fec875697c1",
+      "name": "Icon / chart-no-axes-gantt",
+      "description": "projects, manage, overview, roadmap, plan, intentions, timeline, deadline, date, event, range, period, productivity, work, agile, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53622": {
+      "key": "81aedc01fe899d389d067dc797b9ae7f6b21d483",
+      "name": "Icon / chart-pie",
+      "description": "statistics, analytics, diagram, presentation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53562": {
+      "key": "300879df676a85a5e7ce2e0d03790a535113abac",
+      "name": "Icon / chart-scatter",
+      "description": "statistics, analytics, diagram, graph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53612": {
+      "key": "55b7f3ce9b4fceee61382e534b6268b66833f2df",
+      "name": "Icon / chart-spline",
+      "description": "statistics, analytics, diagram, graph, curve, continuous, smooth, polynomial, quadratic, function, interpolation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54010": {
+      "key": "b0aa05e4c82cdf94783291c3e11779512fd907f6",
+      "name": "Icon / check-check",
+      "description": "done, received, double, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53526": {
+      "key": "6850a237ba8c6be3a072b8cf5b5dbdefcc220f7b",
+      "name": "Icon / check-line",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53711": {
+      "key": "6341b3479fcb11487f7bf755fd05be1cb66733b6",
+      "name": "Icon / chef-hat",
+      "description": "cooking, food, kitchen, restaurant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53237": {
+      "key": "e8ae5cb905c43756b28ad92fdbf8909b9ca338af",
+      "name": "Icon / cherry",
+      "description": "fruit, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53600": {
+      "key": "85e6a89c060df028c799bb222881e49f8e853c35",
+      "name": "Icon / chevron-first",
+      "description": "previous, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54089": {
+      "key": "9a29c9e12ad0942e9fc5f29e185e0bcff9fd6857",
+      "name": "Icon / chevron-last",
+      "description": "skip, next, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53515": {
+      "key": "0e3de4b0f87c80b6e2edcb245b0ca92388f541d4",
+      "name": "Icon / chevrons-down-up",
+      "description": "collapse, fold, vertical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54086": {
+      "key": "c610d51730cf9103c30b1397a3f7424ca9aa61c5",
+      "name": "Icon / chevrons-down",
+      "description": "backwards, reverse, slower",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53607": {
+      "key": "aca6e19f0940bec1c1da1fb3a6b5edc26bb3cc22",
+      "name": "Icon / chevrons-left-right-ellipsis",
+      "description": "internet, network, connection, cable, lan, port, router, switch, hub, modem, web, online, networking, communication, socket, plug, slot, controller, connector, interface, console, signal, data, input, output",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53974": {
+      "key": "a564bf145172831c9417801447f874003ed9d930",
+      "name": "Icon / chevrons-left-right",
+      "description": "expand, horizontal, unfold",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53599": {
+      "key": "bd5b45f24f8f4c74b5f37196ca2b5526d328391b",
+      "name": "Icon / chevrons-left",
+      "description": "turn, corner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53624": {
+      "key": "661f86221c97052cb305b90acb78182195231e4c",
+      "name": "Icon / chevrons-right-left",
+      "description": "collapse, fold, horizontal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53598": {
+      "key": "a277c143128e6098e4e09097f11eb996c0fad646",
+      "name": "Icon / chevrons-right",
+      "description": "turn, corner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53660": {
+      "key": "ee58f6e4d8d4dfba980f941733dbeaa6add1e106",
+      "name": "Icon / chevrons-up",
+      "description": "forward, ahead, faster, speed, boost",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53671": {
+      "key": "54e1d981f63c24c047a6a53280eca5824655fb0a",
+      "name": "Icon / chrome",
+      "description": "browser, logo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53997": {
+      "key": "bf3bb085b5583420a81a96f68cce4a7518ba716a",
+      "name": "Icon / church",
+      "description": "temple, building",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54095": {
+      "key": "0cb23d3f7f395201b52f9d503cdd9cb3d4b7b819",
+      "name": "Icon / cigarette-off",
+      "description": "smoking, no-smoking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53597": {
+      "key": "724c2539eee9dccda12d170d9250b87a23c0ec3d",
+      "name": "Icon / cigarette",
+      "description": "smoking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53594": {
+      "key": "0319db79133aabcdaabb97bb8ac6733ecd0f8ec9",
+      "name": "Icon / circle-arrow-down",
+      "description": "backwards, reverse, direction, south, sign, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54114": {
+      "key": "d827cb581631ab9c52f406b90b43051ac969aa2b",
+      "name": "Icon / circle-arrow-left",
+      "description": "previous, back, direction, west, sign, turn, button, <-",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53593": {
+      "key": "892a911208c785db225276964db6691c2472b996",
+      "name": "Icon / circle-arrow-out-down-left",
+      "description": "outwards, direction, south-west, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53523": {
+      "key": "dfe30d7372d46acb13b9a7e83a04aa53996ea43a",
+      "name": "Icon / circle-arrow-out-down-right",
+      "description": "outwards, direction, south-east, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53542": {
+      "key": "b234365c6d91f3a1273be86053e8fc1296e24a27",
+      "name": "Icon / circle-arrow-out-up-left",
+      "description": "outwards, direction, north-west, diagonal, keyboard, button, escape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53588": {
+      "key": "0e93fa21911dcb6a1b61fd0e1fc1eca130710144",
+      "name": "Icon / circle-arrow-out-up-right",
+      "description": "outwards, direction, north-east, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53581": {
+      "key": "0b54baddd4181043f3b1db3f228c6ec721aa8e56",
+      "name": "Icon / circle-arrow-right",
+      "description": "next, forward, direction, east, sign, turn, button, ->",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53579": {
+      "key": "e4b7fbaeb9a619eb34c6955676c2484f6a56857e",
+      "name": "Icon / circle-arrow-up",
+      "description": "forward, direction, north, sign, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54081": {
+      "key": "b9b0d090d2fc3a68e1b4113e8bd3bd9d34035836",
+      "name": "Icon / circle-check-big",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54156": {
+      "key": "f41970802ccfea69fafd7e15b20d71b10bd0ba91",
+      "name": "Icon / circle-chevron-down",
+      "description": "back, menu",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53576": {
+      "key": "4c8dec923a3115fe3c862c50e3d4f8aba669bb4f",
+      "name": "Icon / circle-chevron-left",
+      "description": "back, previous, less than, fewer, menu, <",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53572": {
+      "key": "09f0e55762eeaf72a75d72b701c052e7fb1874a1",
+      "name": "Icon / circle-chevron-right",
+      "description": "back, more than, greater, menu, >",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54039": {
+      "key": "2520ce7d0ab9ef0a3302f1a16a1430abf0a75336",
+      "name": "Icon / circle-chevron-up",
+      "description": "caret, ahead, menu, ^",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53692": {
+      "key": "b5a4754515101bfeec87cfc18e912f0706e71106",
+      "name": "Icon / circle-divide",
+      "description": "calculate, math, \u00f7, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53569": {
+      "key": "0738e389d980b7e917dfe8f5a65b70f3c911fcf5",
+      "name": "Icon / circle-dollar-sign",
+      "description": "monetization, marketing, currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53251": {
+      "key": "e46d940ae5e826ba6b38de44621a043607212dfe",
+      "name": "Icon / circle-dot-dashed",
+      "description": "pending, dot, progress, issue, draft, code, coding, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53444": {
+      "key": "0e8258c85a345a1177fac3bd2049095498ba8edc",
+      "name": "Icon / circle-dot",
+      "description": "pending, dot, progress, issue, code, coding, version control, choices, multiple choice, choose",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53621": {
+      "key": "bf33adb6e36fce1fdcde9a33e67f9b05d3fa3021",
+      "name": "Icon / circle-ellipsis",
+      "description": "ellipsis, et cetera, etc, loader, loading, progress, pending, throbber, menu, options, operator, code, spread, rest, more, further, extra, overflow, dots, \u2026, ...",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53737": {
+      "key": "9aa06c2c6deda9d6aff977336dc5e3dd3d0182a5",
+      "name": "Icon / circle-equal",
+      "description": "calculate, shape, =",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53634": {
+      "key": "b5ecfa1215c75bddb0ba2ff6bd1d83ac5b7c83d8",
+      "name": "Icon / circle-fading-arrow-up",
+      "description": "north, up, upgrade, improve, circle, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53683": {
+      "key": "0b374305fb80a2fddd58c26e3bffae39d432354d",
+      "name": "Icon / circle-fading-plus",
+      "description": "stories, social media, instagram, facebook, meta, snapchat, sharing, content",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53565": {
+      "key": "fda036a2c1c60b81186971341655a9459e639c53",
+      "name": "Icon / circle-gauge",
+      "description": "dashboard, dial, meter, speed, pressure, measure, level",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53668": {
+      "key": "82998d824c503ea0520cd2f8eecba234c665a5f1",
+      "name": "Icon / circle-help",
+      "description": "question mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53563": {
+      "key": "d4f50870957ba6c44b5565c4fa658a2a34f83d31",
+      "name": "Icon / circle-minus",
+      "description": "subtract, remove, decrease, reduce, calculate, line, operator, code, coding, minimum, downgrade, -",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53730": {
+      "key": "7abc03df83fb0c7e8954c338d21449da39305d34",
+      "name": "Icon / circle-off",
+      "description": "diameter, zero, \u00d8, nothing, null, void, cancel, ban, no, stop, forbidden, prohibited, error, incorrect, mistake, wrong, failure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54155": {
+      "key": "519ea94ddcc0ef30e1171405fab76f72b4c76a4f",
+      "name": "Icon / circle-parking-off",
+      "description": "parking lot, car park, no parking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54118": {
+      "key": "262e4ac3ac6c0f87b29a2205cbd5af17f628df23",
+      "name": "Icon / circle-parking",
+      "description": "parking lot, car park",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54037": {
+      "key": "d8ab1f71e5e692d873054c4f7cff5554c58ca548",
+      "name": "Icon / circle-pause",
+      "description": "music, audio, stop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53723": {
+      "key": "27a25ea61caadb62462f0ff3db61be425e2f5adb",
+      "name": "Icon / circle-percent",
+      "description": "verified, unverified, sale, discount, offer, marketing, sticker, price tag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53889": {
+      "key": "fd3891043bafc38b12488702b1e799d5e00cafc2",
+      "name": "Icon / circle-play",
+      "description": "music, start, run",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53113": {
+      "key": "8ca77554572e8f817b888f7b5070ad729db0279d",
+      "name": "Icon / circle-plus",
+      "description": "add, new, increase, increment, positive, calculate, crosshair, aim, target, scope, sight, reticule, maximum, upgrade, extra, operator, join, concatenate, code, coding, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53556": {
+      "key": "f6661eaa52e55658e0e35dfb454064bb59c49bbc",
+      "name": "Icon / circle-pound-sterling",
+      "description": "monetization, coin, penny, marketing, currency, money, payment, british, gbp, \u00a3",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53926": {
+      "key": "35eaf26cbc3c5228c3bde918774225c85981f832",
+      "name": "Icon / circle-power",
+      "description": "on, off, device, switch, toggle, binary, boolean, reboot, restart, button, keyboard, troubleshoot",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53611": {
+      "key": "1f8dbc524b3d25b445f58988aa4782158726af80",
+      "name": "Icon / circle-slash-2",
+      "description": "diameter, zero, \u00f8, nothing, null, void, ban, math, divide, division, half, split, /, average, avg, mean, median, normal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54050": {
+      "key": "fe2a0fc926cf96ce6b482b5b4a64bdc6e06e374a",
+      "name": "Icon / circle-slash",
+      "description": "diameter, zero, \u00d8, nothing, null, void, cancel, ban, no, stop, forbidden, prohibited, error, incorrect, mistake, wrong, failure, divide, division, or, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53587": {
+      "key": "6e6a072a30c4a4762e2313f3caf2404149464be6",
+      "name": "Icon / circle-small",
+      "description": "shape, bullet, gender, genderless",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53663": {
+      "key": "4ed89b2554e533f8751187535f13bc9d047a23d8",
+      "name": "Icon / circle-stop",
+      "description": "media, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54124": {
+      "key": "15ef20c25cf95e6f36d6bbf3006aaa027c52d639",
+      "name": "Icon / circle-user-round",
+      "description": "person, account, contact",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53870": {
+      "key": "c4eab0efe4a6f1dd8dd1f2811ba22aef0c2aec7d",
+      "name": "Icon / circle-user",
+      "description": "person, account, contact",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53111": {
+      "key": "523f883664d9730d69f248260fd57a120e789fc3",
+      "name": "Icon / circle-x",
+      "description": "cancel, close, delete, remove, times, clear, error, incorrect, wrong, mistake, failure, linter, multiply, multiplication",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53601": {
+      "key": "ee0bf5c3ccb7f9686c2927820c36e073457a6653",
+      "name": "Icon / circle",
+      "description": "off, zero, record, shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53543": {
+      "key": "d4ae0d823165700f52d2439645aa4bc8822c20cd",
+      "name": "Icon / circuit-board",
+      "description": "computing, electricity, electronics",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53578": {
+      "key": "cdd47c4aded1f4c6aa55b1711fac6deaf6f4aab9",
+      "name": "Icon / citrus",
+      "description": "lemon, orange, grapefruit, fruit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53767": {
+      "key": "53f31e643c9275945d70df31d8d3c43c0c97863c",
+      "name": "Icon / clapperboard",
+      "description": "movie, film, video, camera, cinema, cut, action, television, tv, show, entertainment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53896": {
+      "key": "3a8566afcee9be68f91cb2f1a444bad44e3a1700",
+      "name": "Icon / clipboard-check",
+      "description": "copied, pasted, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53540": {
+      "key": "486ef89f1f092b01dc995286fb6d7f253557b56d",
+      "name": "Icon / clipboard-copy",
+      "description": "copy, paste",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53680": {
+      "key": "aa6818a30cc6d0740eef1456855398cf516b2a12",
+      "name": "Icon / clipboard-list",
+      "description": "copy, paste, tasks",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53592": {
+      "key": "763566e9ced95ece7768e5643c31265c57e4909f",
+      "name": "Icon / clipboard-minus",
+      "description": "copy, delete, remove, erase, document, medical, report, doctor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54071": {
+      "key": "e2ebe6ca33805c508fb903c48d937c423cd0fb86",
+      "name": "Icon / clipboard-paste",
+      "description": "copy, paste",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53534": {
+      "key": "b5446ddedfd121dfa5e363174e7efd1afa2dc223",
+      "name": "Icon / clipboard-pen-line",
+      "description": "paste",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53879": {
+      "key": "1cc0cc111031b32503881c98613c22e900cfda55",
+      "name": "Icon / clipboard-pen",
+      "description": "paste, signature",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53533": {
+      "key": "e06beeeadb626e087539cc26cf7a45f0eded40d8",
+      "name": "Icon / clipboard-plus",
+      "description": "copy, paste, add, create, new, document, medical, report, doctor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53091": {
+      "key": "75a1985a9ea5ea86576ffb8cae35f98468f89aa2",
+      "name": "Icon / clipboard-type",
+      "description": "paste, format, text",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53994": {
+      "key": "886f2371bd49619bc0ea723a6e42cdb37260601d",
+      "name": "Icon / clipboard-x",
+      "description": "copy, paste, discard, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54020": {
+      "key": "7ad9afc9a76a4e1b3f80f859dc5959e3d73eee6e",
+      "name": "Icon / clipboard",
+      "description": "copy, paste",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53875": {
+      "key": "3b20035e6d3c125f6943336f0da3db59d80bc4bd",
+      "name": "Icon / clock-1",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53791": {
+      "key": "7a5b48470bdf5e3156c59be63d796622ddf22cfb",
+      "name": "Icon / clock-2",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54068": {
+      "key": "9e063c8cf00dcbd96d43e2e4cb82838413db1de5",
+      "name": "Icon / clock-3",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53531": {
+      "key": "066639702b6d863f944c032eb2f2f08ba733825e",
+      "name": "Icon / clock-4",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53529": {
+      "key": "5545989bcf8efa84a2177f694173c56f31cdeee4",
+      "name": "Icon / clock-5",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53567": {
+      "key": "78c06c8176e7505b8abc6c675e87ccab4f8e21d9",
+      "name": "Icon / clock-6",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53616": {
+      "key": "6829dccc3288a378e55707ce7f4562f4b47cd060",
+      "name": "Icon / clock-7",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53633": {
+      "key": "d81ac37a6bf7f1bf52499620273d3d29a9876fd6",
+      "name": "Icon / clock-8",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54112": {
+      "key": "7af9cce0fcc67d7d777e8de194b9322b46dd1bd8",
+      "name": "Icon / clock-9",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53836": {
+      "key": "dac7d739d8466e5ab1beefe3bb759917574672b1",
+      "name": "Icon / clock-10",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53527": {
+      "key": "84d59ef5e23fb82f089251067bf55f5af28f7f58",
+      "name": "Icon / clock-11",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53524": {
+      "key": "622796c63077fbad53c2b1c01402cd31ddca574f",
+      "name": "Icon / clock-12",
+      "description": "time, watch, alarm, noon, midnight",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53679": {
+      "key": "29fa70a6c467b4e34f6bcf25a8cc3f1e19908b75",
+      "name": "Icon / clock-alert",
+      "description": "time, watch, alarm, warning, wrong",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54048": {
+      "key": "233b02bb65a49bff8ea8e62d58a85bb97502d60c",
+      "name": "Icon / clock-arrow-down",
+      "description": "time, watch, alarm, sort, order, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53522": {
+      "key": "8295f58723530c85213cd68454f9bcc420c45eed",
+      "name": "Icon / clock-arrow-up",
+      "description": "time, watch, alarm, sort, order, ascending, descending, increasing, decreasing, rising, falling",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53646": {
+      "key": "6ebb85730197fc3bc6deab85b359146c4544d9b2",
+      "name": "Icon / clock-fading",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53824": {
+      "key": "c4e067d7ea18eb4971400a9e880129da3d4138b9",
+      "name": "Icon / clock-plus",
+      "description": "time, watch, alarm, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53268": {
+      "key": "30a8f3d663ee1dc193ed15d078b3f3ed6bc8a4f6",
+      "name": "Icon / clock",
+      "description": "time, watch, alarm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53983": {
+      "key": "5dc96d4c7c66df1ccdf29b058941d988e46e9e6a",
+      "name": "Icon / cloud-alert",
+      "description": "weather, danger, warning, alert, error, sync, network, exclamation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53519": {
+      "key": "91b9643c1cc41de30f0b365b07f8e6df4a060f4a",
+      "name": "Icon / cloud-check",
+      "description": "sync, network, success, done, completed, saved, persisted",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53513": {
+      "key": "382fefc6227d3050e0491e0822560e19b9e7aac5",
+      "name": "Icon / cloud-cog",
+      "description": "computing, ai, cluster, network",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53512": {
+      "key": "47f7940c6f127b6a2aa37f03092fc199b8ee28c5",
+      "name": "Icon / cloud-download",
+      "description": "import",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53510": {
+      "key": "0dc98a542775b84bfd6acf3239983698d0e9f0a4",
+      "name": "Icon / cloud-drizzle",
+      "description": "weather, shower",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54141": {
+      "key": "57ecb57079d9e7a89e6c0b5c1fa4528846fc2866",
+      "name": "Icon / cloud-fog",
+      "description": "weather, mist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53356": {
+      "key": "f1e218f64c0f64e0419375ad0541bb804a635c91",
+      "name": "Icon / cloud-hail",
+      "description": "weather, rainfall",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53503": {
+      "key": "6dc2c7981b5584bb70967d9db3ad1d166e28cf2d",
+      "name": "Icon / cloud-lightning",
+      "description": "weather, bolt",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53500": {
+      "key": "0af925eaa39a3d612bd797fc65e6c4f9740a1c52",
+      "name": "Icon / cloud-moon-rain",
+      "description": "weather, partly, night, rainfall",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53293": {
+      "key": "79cf7fbe5857137af7cb8ef0b540e69775e8b85f",
+      "name": "Icon / cloud-moon",
+      "description": "weather, night",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53498": {
+      "key": "29750a499f23874d80a70f52000a9531ba1fd0ed",
+      "name": "Icon / cloud-off",
+      "description": "disconnect",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53496": {
+      "key": "e2e73bfc18b774e41fc32b1ff076bf7aff3ce00c",
+      "name": "Icon / cloud-rain-wind",
+      "description": "weather, rainfall",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53492": {
+      "key": "8d25613028e7f9ccaee815c4710e06aea4ea3bb6",
+      "name": "Icon / cloud-rain",
+      "description": "weather, rainfall",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53491": {
+      "key": "19d3369a4590d66b2e8eb6eabd31569cbf411e04",
+      "name": "Icon / cloud-snow",
+      "description": "weather, blizzard",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53490": {
+      "key": "58038ddc927c2c39744874f94cd6f6d4c260ca19",
+      "name": "Icon / cloud-sun-rain",
+      "description": "weather, partly, rainfall",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53489": {
+      "key": "64045e3d43b80588010f547fc8476bab58af1def",
+      "name": "Icon / cloud-sun",
+      "description": "weather, partly",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53487": {
+      "key": "3ec74d62f3334122749a88a83fc5e783d70e0322",
+      "name": "Icon / cloud-upload",
+      "description": "file",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54027": {
+      "key": "74b2c6af7c16990e6f6492a3a2b5fe860e81830f",
+      "name": "Icon / cloud",
+      "description": "weather",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53481": {
+      "key": "af3e365fc42cef593740aaaae8026bcd8f0e91cc",
+      "name": "Icon / cloudy",
+      "description": "weather, clouds",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54073": {
+      "key": "f919afd7f1c01c26a9fbd217038ef4a6752a8889",
+      "name": "Icon / clover",
+      "description": "leaf, luck, plant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53947": {
+      "key": "0f70f6a8390fb874e736b52e58117e4f40e6f3eb",
+      "name": "Icon / club",
+      "description": "shape, suit, playing, cards",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53478": {
+      "key": "748708237ef9ac49e9e71214d1c149a5aad0bf80",
+      "name": "Icon / code-xml",
+      "description": "source, programming, html, xml",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53985": {
+      "key": "3d0a9270fff949fa06f355e1730ea4220c75a31e",
+      "name": "Icon / code",
+      "description": "source, programming, html, xml",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53676": {
+      "key": "2a412f843727444c1a2b0a24cc1a504f725af8a7",
+      "name": "Icon / codepen",
+      "description": "logo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53477": {
+      "key": "14f86375413b7731d89804add7f0b5174584b8d9",
+      "name": "Icon / codesandbox",
+      "description": "logo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53476": {
+      "key": "c4abe252a5b8e7ea4f7192f106ab1ac6769c9b27",
+      "name": "Icon / coffee",
+      "description": "drink, cup, mug, tea, cafe, hot, beverage",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53472": {
+      "key": "44202cd43cb80bc453a5df99f3258d637538acc8",
+      "name": "Icon / cog",
+      "description": "computing, settings, cog, edit, gear, preferences, controls, configuration, fixed, build, construction, parts",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53504": {
+      "key": "a8b633581e8bd47849ee7796e8fc7d44fb46c836",
+      "name": "Icon / coins",
+      "description": "money, cash, finance, gamble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53627": {
+      "key": "e3c08bf87865ad064850a400b75419110000971d",
+      "name": "Icon / columns-2",
+      "description": "lines, list, queue, preview, panel, parallel, series, split, vertical, horizontal, half, center, middle, even, sidebar, drawer, gutter, fold, reflow, typography, pagination, pages",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53691": {
+      "key": "986f8b3fdda628d8040198f21a17fdc9e66ddd6b",
+      "name": "Icon / columns-3-cog",
+      "description": "columns, settings, customize, table, grid, adjust, configuration, panel, layout",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53469": {
+      "key": "7303e2beaf3173193b8663698b05ad08cfb13c3f",
+      "name": "Icon / columns-3",
+      "description": "lines, list, queue, preview, parallel, series, split, vertical, horizontal, thirds, triple, center, middle, alignment, even, sidebars, drawers, gutters, fold, reflow, typography, pagination, pages",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53466": {
+      "key": "ac40b8ac0d9b7fe00e12392149ae6311d635b41b",
+      "name": "Icon / columns-4",
+      "description": "lines, list, queue, preview, parallel, series, split, vertical, horizontal, thirds, triple, center, middle, alignment, even, sidebars, drawers, gutters, fold, reflow, typography, pagination, pages, prison, jail, bars, sentence, police, cops, cell, crime, criminal, justice, law, enforcement, grill",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53465": {
+      "key": "069e9d84733810ce19815586318f8d6e9f022102",
+      "name": "Icon / combine",
+      "description": "cubes, packages, parts, units, collection, cluster, combine, gather, merge",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53463": {
+      "key": "27471c9b7a6061b632013c8eeab2ad6b070dc805",
+      "name": "Icon / command",
+      "description": "keyboard, key, mac, cmd, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53205": {
+      "key": "d8da42bbfc67d9e58fd048448e4fc47829995dd3",
+      "name": "Icon / compass",
+      "description": "direction, north, east, south, west, safari, browser",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53207": {
+      "key": "9be4c99b4559708e3826fb5eb37b274eb2649997",
+      "name": "Icon / component",
+      "description": "design, element, group, module, part, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53461": {
+      "key": "723f43f69999ba6490d9ba8d536965c49cc20b32",
+      "name": "Icon / computer",
+      "description": "pc, chassis, codespaces, github",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53763": {
+      "key": "ad10a75db48526362d6793f03bf837637a9564d2",
+      "name": "Icon / concierge-bell",
+      "description": "reception, bell, porter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53460": {
+      "key": "f07a9b2cd728e2d0ee9ee25808ed82a69951ea1c",
+      "name": "Icon / cone",
+      "description": "conical, triangle, triangular, geometry, filter, funnel, hopper, spotlight, searchlight",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53508": {
+      "key": "f88f98947f0682dcf6377308c61076f58bd30a05",
+      "name": "Icon / construction",
+      "description": "roadwork, maintenance, blockade, barricade",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53459": {
+      "key": "f64129bdf50736267bc2cde464abb3362849d3c5",
+      "name": "Icon / contact-round",
+      "description": "user, person, family, friend, acquaintance, listing, networking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53775": {
+      "key": "e7e2cad91554cb321f17648fbb317c269de4a1b7",
+      "name": "Icon / contact",
+      "description": "user, person, family, friend, acquaintance, listing, networking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53511": {
+      "key": "c8d279c1833c9e95e021ecf9e413e2cd0aa9a9c0",
+      "name": "Icon / container",
+      "description": "storage, shipping, freight, supply chain, docker, environment, devops, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53456": {
+      "key": "22caf97de2b54e990715b08f045e4f48b8313a98",
+      "name": "Icon / contrast",
+      "description": "display, accessibility",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53455": {
+      "key": "9cab1c333d44e05efa24c1c033237fbbc8fe2f95",
+      "name": "Icon / cookie",
+      "description": "biscuit, privacy, legal, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53516": {
+      "key": "d1758c254e2090f414c768228c5188b98a5fbd36",
+      "name": "Icon / cooking-pot",
+      "description": "pod, cooking, recipe, food, kitchen, chef, restaurant, dinner, lunch, breakfast, meal, eat",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53782": {
+      "key": "3a90013d20c83367ad95948261926d4ce3336adf",
+      "name": "Icon / copy-check",
+      "description": "clone, duplicate, done, multiple",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53494": {
+      "key": "9436255f384222114a9be0cc8c8cae422f682579",
+      "name": "Icon / copy-minus",
+      "description": "clone, duplicate, remove, delete, collapse, subtract, multiple, -",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53990": {
+      "key": "d6e8e9e5a96ac6ac980165b57e9cf1ff95584173",
+      "name": "Icon / copy-plus",
+      "description": "clone, duplicate, add, multiple, expand, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53452": {
+      "key": "7feb25ab19ff7242f2b0bee274a90215d396cae4",
+      "name": "Icon / copy-slash",
+      "description": "clone, duplicate, cancel, ban, no, stop, forbidden, prohibited, error, multiple, divide, division, split, or, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53451": {
+      "key": "fa04f4a1c640d076d8f3e0cd8ee217975023a240",
+      "name": "Icon / copy-x",
+      "description": "cancel, close, delete, remove, clear, multiple, multiply, multiplication, times",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53449": {
+      "key": "2770d8946c7d3ca18fe63e03348d73ccd2176703",
+      "name": "Icon / copy",
+      "description": "clone, duplicate, multiple",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54056": {
+      "key": "275af6f8fa1638300cc838e40a965d64a2025fca",
+      "name": "Icon / copyleft",
+      "description": "licence",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53447": {
+      "key": "5c592f2f5b3cdf57e5e532bf5950dc6e0c6ef6a6",
+      "name": "Icon / copyright",
+      "description": "licence, license",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53445": {
+      "key": "0d740a9e97def08f18ee4f12e5a92a40a60ba8f6",
+      "name": "Icon / corner-down-left",
+      "description": "arrow, return",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53443": {
+      "key": "935604ffd698062ab3e92b716622efe1c1209483",
+      "name": "Icon / corner-down-right",
+      "description": "arrow, indent, tab",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53441": {
+      "key": "927080288bebd6457160438a228c0b73eba167f0",
+      "name": "Icon / corner-left-down",
+      "description": "arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53439": {
+      "key": "247127ef5b83e02259432a5d9178dfb757c01155",
+      "name": "Icon / corner-left-up",
+      "description": "arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54130": {
+      "key": "56ab9fea82d2456cb2a3fcc464b0d9b284f8a2f8",
+      "name": "Icon / corner-right-down",
+      "description": "arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53891": {
+      "key": "2f51530a02b629aa138c5a73c7cdc5305e832e0a",
+      "name": "Icon / corner-right-up",
+      "description": "arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53545": {
+      "key": "af5afaf6bdb0f6e2441e92bdbb332e0aea0041d6",
+      "name": "Icon / corner-up-left",
+      "description": "arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53437": {
+      "key": "ec3cf19cb2a8824d392ddaae2e8891c5a869cd45",
+      "name": "Icon / corner-up-right",
+      "description": "arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53858": {
+      "key": "cae25581ed11d2955c087899da1afac33eab2e5b",
+      "name": "Icon / cpu",
+      "description": "processor, cores, technology, computer, chip, circuit, memory, ram, specs, gigahertz, ghz",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53435": {
+      "key": "94b7015d1607df23a2589d6dbb3cdc5f9a4a1c23",
+      "name": "Icon / creative-commons",
+      "description": "licence, license",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53541": {
+      "key": "55d7e4ecf64ee97057a40c8859890482de5f168d",
+      "name": "Icon / credit-card",
+      "description": "bank, purchase, payment, cc",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53434": {
+      "key": "275954bbb6e2b87f6acd9f7408995f68053b7944",
+      "name": "Icon / croissant",
+      "description": "bakery, cooking, food, pastry",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53431": {
+      "key": "615f80d0e88f69829f4a2487aa4197c6b11ba043",
+      "name": "Icon / crop",
+      "description": "photo, image",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53430": {
+      "key": "d76b1af88246baafa3bf0b538426746d9acf32d5",
+      "name": "Icon / cross",
+      "description": "healthcare, first aid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53427": {
+      "key": "06f337463d80891f5e463053a201bb0cc781a724",
+      "name": "Icon / crosshair",
+      "description": "aim, target",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53882": {
+      "key": "25f96dbb5be9e0114976a6bb7d2a27690a0c281c",
+      "name": "Icon / crown",
+      "description": "diadem, tiara, circlet, corona, king, ruler, winner, favourite",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53426": {
+      "key": "a476fdb390e1610243951957d99c2141fadb786b",
+      "name": "Icon / cuboid",
+      "description": "brick, block, container, storage, geometry, rectangular, hexahedron",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53419": {
+      "key": "9d6dd898418d99a47f0177b4af96f890ccffdf24",
+      "name": "Icon / cup-soda",
+      "description": "beverage, cup, drink, soda, straw, water",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53416": {
+      "key": "77d7b33365761d1d513f6a7e2f34dea2785ed40b",
+      "name": "Icon / currency",
+      "description": "finance, money",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53931": {
+      "key": "5d3a9d07f4453d3fb6b101b225f3710bf82acb6a",
+      "name": "Icon / cylinder",
+      "description": "shape, elliptical, geometry, container, storage, tin, pot",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53641": {
+      "key": "358db101ea613885ef9012d9b465f3655f21b5f4",
+      "name": "Icon / dam",
+      "description": "electricity, energy, water",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53667": {
+      "key": "515f0b6943c818403fab59ce60ed6742da8cc290",
+      "name": "Icon / database-backup",
+      "description": "storage, memory, bytes, servers, backup, timemachine, rotate, arrow, left",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54065": {
+      "key": "23710b228ee0cacc016b87ac37603d19584239d2",
+      "name": "Icon / database-zap",
+      "description": "cache busting, storage, memory, bytes, servers, power, crash",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53521": {
+      "key": "247c16486fa9e97967b4334936732105a804940d",
+      "name": "Icon / database",
+      "description": "storage, memory, container, tin, pot, bytes, servers",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53415": {
+      "key": "bc97bfd98bf0f6b01ba790db2f7e9eb7fe2facbc",
+      "name": "Icon / decimals-arrow-left",
+      "description": "numerical, decimal, decrease, less, fewer, precision, rounding, digits, fraction, float, number",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54036": {
+      "key": "7d613dcc5e21f100c0c7e3ac121c8d56453be3fb",
+      "name": "Icon / decimals-arrow-right",
+      "description": "numerical, decimal, increase, more, precision, rounding, digits, fraction, float, number",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53829": {
+      "key": "8788ddcbfa4b349259008bff2abb26f7540f0966",
+      "name": "Icon / delete",
+      "description": "backspace, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53409": {
+      "key": "cb02e71213199bf0314f2130f87df192d3602def",
+      "name": "Icon / dessert",
+      "description": "pudding, christmas, xmas, custard, iced bun, icing, fondant, cake, ice cream, gelato, sundae, scoop, dollop, sugar, food, sweet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53408": {
+      "key": "82cceea3f6462f2724fa2df84d3fcb1727dfe93d",
+      "name": "Icon / diameter",
+      "description": "shape, circle, geometry, trigonometry, width, height, size, calculate, measure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53827": {
+      "key": "a2d13181416b307320d8b87f3b10d085b452fff4",
+      "name": "Icon / diamond-minus",
+      "description": "keyframe, subtract, remove, decrease, reduce, calculator, button, keyboard, line, divider, separator, horizontal rule, hr, html, markup, markdown, ---, toolbar, operator, code, coding, minimum, downgrade",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53406": {
+      "key": "b7ba145d544e290fa9155e771725319d9c6ae52b",
+      "name": "Icon / diamond-percent",
+      "description": "verified, unverified, sale, discount, offer, marketing, sticker, price tag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53930": {
+      "key": "aa6d15c8969b09d3e7fd763087f1192f40bbfa5f",
+      "name": "Icon / diamond-plus",
+      "description": "keyframe, add, new, increase, increment, positive, calculate, toolbar, crosshair, aim, target, scope, sight, reticule, maximum, upgrade, extra, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53107": {
+      "key": "3fd6d9c039f0d80a00591db670d4b35222c04fde",
+      "name": "Icon / diamond",
+      "description": "square, rectangle, oblique, rhombus, shape, suit, playing, cards",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53899": {
+      "key": "105ee4a49f29e865c7dda1cd1bf1e04d914da9d0",
+      "name": "Icon / dice-1",
+      "description": "dice, random, tabletop, 1, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53401": {
+      "key": "b44293305a54f0dbc6a91ab012f72d1e6eb556f5",
+      "name": "Icon / dice-2",
+      "description": "dice, random, tabletop, 2, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53916": {
+      "key": "677bbd7e335a52d9233d7b2a94aa1f44cc1343c5",
+      "name": "Icon / dice-3",
+      "description": "dice, random, tabletop, 3, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53398": {
+      "key": "8a13ac47a14319617efe6dc59f7b47aa51d0a715",
+      "name": "Icon / dice-4",
+      "description": "dice, random, tabletop, 4, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53393": {
+      "key": "ca69032f54d11a17c2576882b1b1013d92f53d02",
+      "name": "Icon / dice-5",
+      "description": "dice, random, tabletop, 5, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53391": {
+      "key": "9bb2456694380b65a6c43326336066e9450b51d5",
+      "name": "Icon / dice-6",
+      "description": "dice, random, tabletop, 6, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53814": {
+      "key": "bcf89e0f7133185d95694c181272d107747dac31",
+      "name": "Icon / dices",
+      "description": "dice, random, tabletop, board, game",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54030": {
+      "key": "2896af83748c80912aafbf1cb201c53b6c01c838",
+      "name": "Icon / diff",
+      "description": "patch, difference, compare, plus, minus, plus-minus, math",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53388": {
+      "key": "818536551e5dc2599d4bb07ed93584724fc693ed",
+      "name": "Icon / disc-2",
+      "description": "album, music, vinyl, record, cd, dvd, format, dj, spin, rotate, rpm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53282": {
+      "key": "3137fb5989ae8976aecabeb67b9347c154573e80",
+      "name": "Icon / disc-3",
+      "description": "album, music, vinyl, record, cd, dvd, format, dj, spin, rotate, rpm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53385": {
+      "key": "d53caebd134c3e96bb45ad7d16dc7fe0633da0db",
+      "name": "Icon / disc-album",
+      "description": "album, music, songs, format, cd, dvd, vinyl, sleeve, cover, platinum, compilation, ep, recording, playback, spin, rotate, rpm, dj",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53382": {
+      "key": "214bd07cf4848ca645546d0b139f18570e281ebc",
+      "name": "Icon / disc",
+      "description": "album, music, songs, format, cd, dvd, vinyl, sleeve, cover, platinum, compilation, ep, recording, playback, spin, rotate, rpm, dj",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53380": {
+      "key": "23bdfa956184448c783a28a692c3c03ed037e893",
+      "name": "Icon / divide",
+      "description": "calculate, math, division, operator, code, \u00f7, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53376": {
+      "key": "ec1738f808e948b0617db80218e44ed5af4284e0",
+      "name": "Icon / dna-off",
+      "description": "gene, gmo free, helix, heredity, chromosome, nucleic acid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53860": {
+      "key": "14ce91f1e62fd4620464084124d0aa7d9f38a726",
+      "name": "Icon / dna",
+      "description": "gene, gmo, helix, heredity, chromosome, nucleic acid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53589": {
+      "key": "549436581e7d849ace663843a6a19aaafb917e2e",
+      "name": "Icon / dock",
+      "description": "desktop, applications, launch, home, menu bar, bottom, line, macos, osx",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53793": {
+      "key": "04144153030ea95a3c54d388488eda2435d29037",
+      "name": "Icon / dog",
+      "description": "animal, pet, puppy, hound, canine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53100": {
+      "key": "a770cef292d562a0ddef06816161163aea30c3cf",
+      "name": "Icon / dollar-sign",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53374": {
+      "key": "31fcd9241ca856b0f170de99f6f3fcab5a4b18f6",
+      "name": "Icon / donut",
+      "description": "doughnut, sprinkles, topping, fast food, junk food, snack, treat, sweet, sugar, dessert, hollow, ring",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53373": {
+      "key": "a733a18eddbd7c4ef233d277760afc8de1335d31",
+      "name": "Icon / door-closed-locked",
+      "description": "entrance, entry, exit, ingress, egress, gate, gateway, emergency exit, lock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53372": {
+      "key": "56f1ce47e9553a43758fbd579881d9cbd78a72a8",
+      "name": "Icon / door-closed",
+      "description": "entrance, entry, exit, ingress, egress, gate, gateway, emergency exit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53958": {
+      "key": "473688e54088f741b4a4fb9c0abe2691514f6af8",
+      "name": "Icon / door-open",
+      "description": "entrance, entry, exit, ingress, egress, gate, gateway, emergency exit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53369": {
+      "key": "1799fc9ac7d3a9a15b1eb73d9b40a1877a4b26f5",
+      "name": "Icon / dot",
+      "description": "interpunct, interpoint, middot, step, punctuation, period, full stop, end, finish, final, characters, font, typography, type, center, .",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53367": {
+      "key": "f8dc6d07a8869aeae6819dfd941a4bc0230fad09",
+      "name": "Icon / download",
+      "description": "import, export, save",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53364": {
+      "key": "50488e8ceebf8da4c45fc8227e39d0dd35baad54",
+      "name": "Icon / drafting-compass",
+      "description": "geometry, trigonometry, radius, diameter, circumference, calculate, measure, arc, curve, draw, sketch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53361": {
+      "key": "d5640bef52dc9df65f9777c4709a8f9fdbc9e40d",
+      "name": "Icon / drama",
+      "description": "drama, masks, theater, theatre, entertainment, show",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53359": {
+      "key": "3e03fe03e854662494b1ce3a157206a566f45542",
+      "name": "Icon / dribbble",
+      "description": "design, social",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53357": {
+      "key": "ac98f3c2fa787357a12bcdaa85dfb35fbb2d9e2a",
+      "name": "Icon / drill",
+      "description": "power, bit, head, hole, diy, toolbox, build, construction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53353": {
+      "key": "39161f0f6e22fd13c21536c0337139f6091413b8",
+      "name": "Icon / droplet-off",
+      "description": "water, weather, liquid, fluid, wet, moisture, damp, bead, globule",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53347": {
+      "key": "4b20df18ff3d29f1cb0dceb420aaff34bab35648",
+      "name": "Icon / droplet",
+      "description": "water, weather, liquid, fluid, wet, moisture, damp, bead, globule",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54007": {
+      "key": "b90dc3bb283a4887ad78b79ac92ad8319ea391da",
+      "name": "Icon / droplets",
+      "description": "water, weather, liquid, fluid, wet, moisture, damp, bead, globule",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53345": {
+      "key": "ba2e1c15b0d73af451b2f16c9a0535d8006c28fb",
+      "name": "Icon / drum",
+      "description": "drummer, kit, sticks, instrument, beat, bang, bass, backing track, band, play, performance, concert, march, music, audio, sound, noise, loud",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53497": {
+      "key": "21162b45e09b3eafa7202e6f3384d8603045d244",
+      "name": "Icon / drumstick",
+      "description": "food, chicken, meat",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53343": {
+      "key": "a2725a0e9928c7d42234344aecf60bab4322cadd",
+      "name": "Icon / dumbbell",
+      "description": "barbell, weight, workout, gym",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53340": {
+      "key": "a8a306e51ac4e2c595efd42ea4abf0f5538bb5f3",
+      "name": "Icon / ear-off",
+      "description": "hearing, hard of hearing, hearing loss, deafness, noise, silence, audio, accessibility",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53338": {
+      "key": "78e4a632e06c889f5e535c2968fe9eba4af538b7",
+      "name": "Icon / ear",
+      "description": "hearing, noise, audio, accessibility",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53337": {
+      "key": "bc3abdbf1c2313fb4f51a62ca88bfc111be38aa9",
+      "name": "Icon / earth-lock",
+      "description": "vpn, private, privacy, network, world, browser, security, encryption, protection, connection",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53331": {
+      "key": "87b7cf7131b06355bbcdba9c853224260bc863d0",
+      "name": "Icon / earth",
+      "description": "world, browser, language, translate, globe",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53328": {
+      "key": "7b70407c61b641a7cf68c68d55bd6bf2bf1a801b",
+      "name": "Icon / eclipse",
+      "description": "lunar, solar, crescent moon, sun, earth, day, night, planet, space, mode, dark, light, toggle, switch, color, css, styles, display, accessibility, contrast, brightness, blend, shade",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53326": {
+      "key": "d48481be1488d95521e4d4fcac677e08a2a0fdf2",
+      "name": "Icon / egg-fried",
+      "description": "food, breakfast",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53325": {
+      "key": "d69a9f203866d591e2713c57e357f1a8e2480598",
+      "name": "Icon / egg-off",
+      "description": "egg free, vegan, hatched, bad egg",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53355": {
+      "key": "d763bb1d19bf0e2d3fd24234da4adff21015e617",
+      "name": "Icon / egg",
+      "description": "bird, chicken, nest, hatch, shell, incubate, soft boiled, hard, breakfast, brunch, morning, easter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53570": {
+      "key": "032e5f9f29f73cf75b772d9e918ed9c619382849",
+      "name": "Icon / equal-approximately",
+      "description": "about, calculate, math, operater",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53323": {
+      "key": "d7f3070841fdedc5d6dd5d43667f834a3561cd92",
+      "name": "Icon / equal-not",
+      "description": "calculate, off, math, operator, code, \u2260",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53320": {
+      "key": "62bea00e7702c03229d3cab8100916ee9f2dff44",
+      "name": "Icon / equal",
+      "description": "calculate, math, operator, assignment, code, =",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53316": {
+      "key": "00f8cfffeb920c8d7209198287edfe26b1cc4283",
+      "name": "Icon / eraser",
+      "description": "pencil, drawing, undo, delete, clear, trash, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54051": {
+      "key": "23cff5436d77cd7c9a7250804609ca5eee9874c7",
+      "name": "Icon / ethernet-port",
+      "description": "internet, network, connection, cable, lan, port, router, switch, hub, modem, web, online, networking, communication, socket, plug, slot, controller, connector, interface, console, signal, data, input, output",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53509": {
+      "key": "2a378d0979f4657c21bb48238034d23302595011",
+      "name": "Icon / euro",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53315": {
+      "key": "88fd2f21e003f8fd03e7bc7391c02e0ed2d4bf54",
+      "name": "Icon / expand",
+      "description": "scale, fullscreen, maximize, minimize, contract",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53313": {
+      "key": "bf1bf7f002269563576b836b033d5ad3f9294b0f",
+      "name": "Icon / external-link",
+      "description": "outbound, open, share",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54092": {
+      "key": "c52b97a88eab19127bd47453919aeb59208bd691",
+      "name": "Icon / eye-closed",
+      "description": "view, watch, see, hide, conceal, mask, hidden, visibility, vision",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53422": {
+      "key": "162b7ee0eabb148f53b8cf93598b9d892a9222e7",
+      "name": "Icon / eye-off",
+      "description": "view, watch, see, hide, conceal, mask, hidden, visibility, vision",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53885": {
+      "key": "d9f7a857b576553b981159aea8d9ce79f3568f56",
+      "name": "Icon / eye",
+      "description": "view, watch, see, show, expose, reveal, display, visible, visibility, vision, preview, read",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53312": {
+      "key": "0362f3b619c0e636c520aca41d1d67b75ad6d6fd",
+      "name": "Icon / facebook",
+      "description": "logo, social",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53914": {
+      "key": "716f73f4720152caa399acc609deb1e2ac8d1af6",
+      "name": "Icon / factory",
+      "description": "building, business, energy, industry, manufacture, sector",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53946": {
+      "key": "1944f9220abb1d2dbb64f7b850709d9279dfb489",
+      "name": "Icon / fan",
+      "description": "air, cooler, ventilation, ventilator, blower",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54035": {
+      "key": "5aaa8ac07933b4e5a904060f735ee1d80fa98b5a",
+      "name": "Icon / fast-forward",
+      "description": "music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53307": {
+      "key": "045779804b7b5ba0c1ec3e2d0d98f53008c65a57",
+      "name": "Icon / feather",
+      "description": "logo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53306": {
+      "key": "9bab43f95659d270318270db9dfb36c2de0f1651",
+      "name": "Icon / fence",
+      "description": "picket, panels, woodwork, diy, materials, suburban, garden, property, territory",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53980": {
+      "key": "1c05fde91bf1c9b2e564a48175aef66e728eee3c",
+      "name": "Icon / ferris-wheel",
+      "description": "big wheel, daisy wheel, observation, attraction, entertainment, amusement park, theme park, funfair",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53555": {
+      "key": "6b251fa8c3a35b23d41a0b3637b46df9547c050d",
+      "name": "Icon / figma",
+      "description": "logo, design, tool",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53304": {
+      "key": "d7342f572d6e20b76aaadccbe1a73132e11ee37c",
+      "name": "Icon / file-archive",
+      "description": "zip, package, archive",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53302": {
+      "key": "5e4983037e9988d6b9d5dfee36f8467a7952c663",
+      "name": "Icon / file-audio-2",
+      "description": "music, audio, sound, headphones",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53311": {
+      "key": "954c7f56e7bef48f012482035ffbfab3075291fa",
+      "name": "Icon / file-audio",
+      "description": "music, audio, sound, headphones",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53949": {
+      "key": "3927be79bedda28bbdb5a0f2bb61aad2c35f26b9",
+      "name": "Icon / file-axis-3d",
+      "description": "model, 3d, axis, coordinates",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53299": {
+      "key": "1465f78e48301c581a35eea5978b1274f13a7c3b",
+      "name": "Icon / file-badge-2",
+      "description": "award, achievement, badge, rosette, prize, winner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53297": {
+      "key": "af839e98733d41b811a3a5bd20a01b5dbb72c220",
+      "name": "Icon / file-badge",
+      "description": "award, achievement, badge, rosette, prize, winner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53888": {
+      "key": "a2a0a060bbac7fc6445924412104815e006af4a2",
+      "name": "Icon / file-box",
+      "description": "box, package, model",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53295": {
+      "key": "65894de3f75cb4b15c7c585034c26d7dc1fa65d0",
+      "name": "Icon / file-chart-column-increasing",
+      "description": "statistics, analytics, diagram, graph, presentation, trending up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54135": {
+      "key": "684449ccf895c12ef7d5d6fd96cd2acae8236c50",
+      "name": "Icon / file-chart-column",
+      "description": "statistics, analytics, diagram, graph, presentation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53291": {
+      "key": "76e8e19df46cb11b13f57e4dc63f04da87d42ca2",
+      "name": "Icon / file-chart-line",
+      "description": "statistics, analytics, diagram, graph, presentation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53290": {
+      "key": "eb927694c9a8c0b14bde460802d9ab5541d9a100",
+      "name": "Icon / file-chart-pie",
+      "description": "statistics, analytics, diagram, graph, presentation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53413": {
+      "key": "ab18c0d9fd5b9749597d6d8e30beb6138e96dd05",
+      "name": "Icon / file-check-2",
+      "description": "done, document, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53360": {
+      "key": "4f54a1b1f4ef5129bb097d16c87221d062c42631",
+      "name": "Icon / file-check",
+      "description": "done, document, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53640": {
+      "key": "93441fcadad1152bfa012e7c9c4167c9d94f53e3",
+      "name": "Icon / file-clock",
+      "description": "history, log, clock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53735": {
+      "key": "be9bab0ccb664e339ed0a493b847a4aa28b6e924",
+      "name": "Icon / file-code-2",
+      "description": "script, document, html, xml, property list, plist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53289": {
+      "key": "3fd4d82ba90725ff632e27cff447c23c1f1babb1",
+      "name": "Icon / file-code",
+      "description": "script, document, gist, html, xml, property list, plist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53288": {
+      "key": "23b3d2f067f6b40dc1d62bd53c909455cdc90d8b",
+      "name": "Icon / file-cog",
+      "description": "executable, settings, cog, edit, gear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53412": {
+      "key": "7a85f940b9ac4a2131a5420654dbb8f707048015",
+      "name": "Icon / file-diff",
+      "description": "diff, patch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53286": {
+      "key": "369ea7ac69bff35ac6c41de6fb1c4c472fab0cce",
+      "name": "Icon / file-digit",
+      "description": "number, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53283": {
+      "key": "722b83a01635d6546dfbc74abced711225b64f53",
+      "name": "Icon / file-down",
+      "description": "download, import, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53281": {
+      "key": "d3a7a5784d52509e04c5befadd0ea1f24b90119f",
+      "name": "Icon / file-heart",
+      "description": "heart, favourite, bookmark, quick link",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53277": {
+      "key": "141a82a0f1023d846c0c26b360638db490fccfc0",
+      "name": "Icon / file-image",
+      "description": "image, graphics, photo, picture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53341": {
+      "key": "d6e42f32e311ffb82ed52a890fad9a802da690eb",
+      "name": "Icon / file-input",
+      "description": "document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53906": {
+      "key": "95b31d785fe56db6faaf09e2834ab75192bd71a1",
+      "name": "Icon / file-json-2",
+      "description": "code, json, curly braces, curly brackets",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53505": {
+      "key": "dbf21b1ad247e8870ad669379c6b3f48633c4e09",
+      "name": "Icon / file-json",
+      "description": "code, json, curly braces, curly brackets",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54052": {
+      "key": "114f15ba926160da76310838c7d00f1e3e5d8e44",
+      "name": "Icon / file-key-2",
+      "description": "key, private, public, security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53808": {
+      "key": "7d132f431e9c945ae7abaa6f4f61ddcc59d1b44d",
+      "name": "Icon / file-key",
+      "description": "key, private, public, security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54003": {
+      "key": "d529321ea454d419a960516ff09beeb0a9c3f0f8",
+      "name": "Icon / file-lock-2",
+      "description": "lock, password, security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53789": {
+      "key": "038d9c8d93e040e708d6d200a93526ccde4e49e0",
+      "name": "Icon / file-lock",
+      "description": "lock, password, security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53350": {
+      "key": "54b0b257ade735d8d020c2add35d463d0e4c7cf4",
+      "name": "Icon / file-minus-2",
+      "description": "document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53276": {
+      "key": "cd7f07badf4b875ce00141b8de9d9d08191fabb9",
+      "name": "Icon / file-minus",
+      "description": "delete, remove, erase, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53130": {
+      "key": "5b3d0aef81728340f032811fcd1437c4704909fb",
+      "name": "Icon / file-music",
+      "description": "audio, sound, noise, track, digital, recording, playback, piano, keyboard, keys, notes, chord, midi, octave",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53140": {
+      "key": "a0c4a909796c3ce28462e1efd0343c2603001d57",
+      "name": "Icon / file-output",
+      "description": "document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54102": {
+      "key": "9fb549b3be6cdda8560ab0aa1b9ea4fa9e7999dd",
+      "name": "Icon / file-pen-line",
+      "description": "edit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53484": {
+      "key": "9c6989bebe3a717e96b5b0d525f9528a0b7326e2",
+      "name": "Icon / file-pen",
+      "description": "signature",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53310": {
+      "key": "8ea48cefddd085d75115dbf7cff7b07cbc81dd1b",
+      "name": "Icon / file-plus-2",
+      "description": "add, create, new, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53953": {
+      "key": "af76244c517d738969655c2e91bb0ceec57bd082",
+      "name": "Icon / file-plus",
+      "description": "add, create, new, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53272": {
+      "key": "b90283ec061c0a0305d413805631e1dac8ba64c9",
+      "name": "Icon / file-question",
+      "description": "readme, help, question",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53269": {
+      "key": "b7da9406e50909ac342d9b0e26e9747ae8e58887",
+      "name": "Icon / file-scan",
+      "description": "scan, code, qr-code",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53322": {
+      "key": "f2417e2cb36f2317709090316774fb87b8a476ab",
+      "name": "Icon / file-search-2",
+      "description": "lost, document, find, browser, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54011": {
+      "key": "53cd83b3664a08bf0516ad168cef5ef5a077eeb7",
+      "name": "Icon / file-search",
+      "description": "lost, document, find, browser, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53868": {
+      "key": "ccb545bd27a59064fabb9c9715eaf104f3316e2d",
+      "name": "Icon / file-sliders",
+      "description": "cogged, gear, mechanical, machinery, configuration, controls, preferences, settings, system, admin, edit, executable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53695": {
+      "key": "0d8cf54b27bd221fe9496d8bf26ca199a02b7732",
+      "name": "Icon / file-spreadsheet",
+      "description": "spreadsheet, sheet, table",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53544": {
+      "key": "97fb1dfa739256e835c255af7a90258d4a268f6b",
+      "name": "Icon / file-stack",
+      "description": "versions, multiple, copy, documents, revisions, version control, history",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53266": {
+      "key": "2e2e807c6bc6ce05149f6d0e0f53196756710555",
+      "name": "Icon / file-symlink",
+      "description": "symlink, symbolic, link",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53265": {
+      "key": "bab882e9b5c9a043b944afb9c7e501f0d37eb0dc",
+      "name": "Icon / file-terminal",
+      "description": "terminal, bash, script, executable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53264": {
+      "key": "7da217cfb1ab5332c21fc1a7fd3cb963a26c03d4",
+      "name": "Icon / file-text",
+      "description": "data, txt, pdf, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53263": {
+      "key": "d4dedc77e263560b99b2c217ddeae0953ae20e95",
+      "name": "Icon / file-type-2",
+      "description": "font, text, typography, type",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53262": {
+      "key": "57568fc26ed8bceda87ee662d74ba96af6cbe4f3",
+      "name": "Icon / file-type",
+      "description": "font, text, typography, type",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53514": {
+      "key": "bb6a490dbb75a6bb6d5da835c93f0be7c1ed2435",
+      "name": "Icon / file-up",
+      "description": "upload, import, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53195": {
+      "key": "6ddbc7d95f8f0ac23f6b92658ee1cb3e2c71f49f",
+      "name": "Icon / file-user",
+      "description": "person, personal information, people, listing, networking, document, contact, cover letter, resume, cv, curriculum vitae, application form",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53260": {
+      "key": "6630f78fc9aa866ae085313897c8afbbb3a6264f",
+      "name": "Icon / file-video-2",
+      "description": "movie, video, film",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54116": {
+      "key": "596fba32553d7799714b185e55b2dd3f6a1e3f35",
+      "name": "Icon / file-video",
+      "description": "movie, video, film",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54111": {
+      "key": "82588287dbb62640ee46e29a99665269d83cc3c2",
+      "name": "Icon / file-volume-2",
+      "description": "audio, music, volume",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53259": {
+      "key": "5186fc8a2153c4b1444bff633dc479a3321b4a6a",
+      "name": "Icon / file-volume",
+      "description": "audio, music, volume",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53258": {
+      "key": "1f907a20e4020096e012f59f45fb4382e19f5488",
+      "name": "Icon / file-warning",
+      "description": "hidden, warning, alert, danger, protected, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53329": {
+      "key": "a28aff29b4e6afca2582009e1c6935cf0a9f3660",
+      "name": "Icon / file-x-2",
+      "description": "lost, delete, remove, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53474": {
+      "key": "d4782b87a0705266ab3e079338bc1f1a5443e3ae",
+      "name": "Icon / file-x",
+      "description": "lost, delete, remove, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53255": {
+      "key": "7a4b926b7213c9a0511c96539c665035f4e2d80e",
+      "name": "Icon / file",
+      "description": "document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54001": {
+      "key": "b641f3996b39e6d87b91e384869c30f32e1a4318",
+      "name": "Icon / files",
+      "description": "multiple, copy, documents",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53254": {
+      "key": "890b30094f44652043a1b74cf3c99f41b63755d3",
+      "name": "Icon / film",
+      "description": "movie, video, reel, camera, cinema, entertainment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53844": {
+      "key": "309239b63bf87b0df412249594d367f94a6f4a40",
+      "name": "Icon / fingerprint",
+      "description": "2fa, authentication, biometric, identity, security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53193": {
+      "key": "15b577e82aef875169ed8492ba96ef24ae34560a",
+      "name": "Icon / fire-extinguisher",
+      "description": "flames, smoke, foam, water, spray, hose, firefighter, fireman, department, brigade, station, emergency, suppress, compressed, tank, cylinder, safety, equipment, amenities",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54139": {
+      "key": "8ff7c92161e621f53f4104294df7f9f35cdb18d8",
+      "name": "Icon / fish-off",
+      "description": "food, dish, restaurant, course, meal, seafood, animal, pet, sea, marine, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53252": {
+      "key": "4052a12a8d6bd8993844866d10c3e064631e4fc4",
+      "name": "Icon / fish-symbol",
+      "description": "dish, restaurant, course, meal, seafood, pet, sea, marine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53249": {
+      "key": "36f9db2776f88e4c5a867f9bd12cf90a9f3b87ba",
+      "name": "Icon / fish",
+      "description": "dish, restaurant, course, meal, seafood, pet, sea, marine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53246": {
+      "key": "718be47b6e55f76282ef0495fae2312c49e98cf3",
+      "name": "Icon / flag-off",
+      "description": "unflag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53245": {
+      "key": "64272c272a035a7f6dc7a28708a934c63b825760",
+      "name": "Icon / flag-triangle-left",
+      "description": "report, timeline",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53639": {
+      "key": "5ecd11d34a9ea42bd5785d7b15df0254a04c22e3",
+      "name": "Icon / flag-triangle-right",
+      "description": "report, timeline",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53378": {
+      "key": "b2a81f3d2a2aad8fce9a3d906bf32e1098ea46e1",
+      "name": "Icon / flag",
+      "description": "report",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53243": {
+      "key": "33cab57ba0d582352aec46104cf60a51de85c0e5",
+      "name": "Icon / flame-kindling",
+      "description": "campfire, camping, wilderness, outdoors, lit, warmth, wood, twigs, sticks",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53242": {
+      "key": "b48b82c449c2856da9300ba66119a3e0dce369c8",
+      "name": "Icon / flame",
+      "description": "fire, lit, burning, spark, embers, smoke, firefighter, fireman, department, brigade, station, emergency",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53294": {
+      "key": "214807074e2a3237360ca91e179146c15aae561a",
+      "name": "Icon / flashlight-off",
+      "description": "torch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53557": {
+      "key": "ff3e9dae5378aa9ddc4b38a18a4eddb13050f475",
+      "name": "Icon / flashlight",
+      "description": "torch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53241": {
+      "key": "424d8b5855407761f54a77f75927ed444c113c89",
+      "name": "Icon / flask-conical-off",
+      "description": "beaker, erlenmeyer, non toxic, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53238": {
+      "key": "45200d2d9494acbcf96dda88cfcedd228fa4c072",
+      "name": "Icon / flask-conical",
+      "description": "beaker, erlenmeyer, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53236": {
+      "key": "8e0bd3482a8b67ba003f75e760cc49bf26f61184",
+      "name": "Icon / flask-round",
+      "description": "beaker, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53235": {
+      "key": "004680b455083945cc8b255649b29cedeba7a4b7",
+      "name": "Icon / flip-horizontal-2",
+      "description": "reflect, mirror, alignment, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53234": {
+      "key": "072c73cbaa8bd86ccfb2a881ecc4b74f8cf401ec",
+      "name": "Icon / flip-horizontal",
+      "description": "reflect, mirror, alignment, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53457": {
+      "key": "39996d8771e60f27fd845f0ade0bb8434c0b191a",
+      "name": "Icon / flip-vertical-2",
+      "description": "reflect, mirror, alignment, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53936": {
+      "key": "4cd5483ec9172b5813491d41fd7a3e13f4ac4327",
+      "name": "Icon / flip-vertical",
+      "description": "reflect, mirror, alignment, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53608": {
+      "key": "9ddbbdffdc87f2d3bc29acd3adc8b7758ab1c628",
+      "name": "Icon / flower-2",
+      "description": "sustainability, nature, plant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53232": {
+      "key": "51795754b68bac60e36ca8d2fde06f5f01a6c26d",
+      "name": "Icon / flower",
+      "description": "sustainability, nature, plant, spring",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53645": {
+      "key": "188d84708ad9d7453e2458caedfad1aca45d9d07",
+      "name": "Icon / focus",
+      "description": "camera, lens, photo, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53230": {
+      "key": "8aacf04184a98d832a66e184b8844c9e5d30813f",
+      "name": "Icon / fold-horizontal",
+      "description": "arrow, collapse, fold, vertical, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53227": {
+      "key": "2cddc96feb892951c87d147fa75f22de37d7c882",
+      "name": "Icon / fold-vertical",
+      "description": "arrow, collapse, fold, vertical, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53244": {
+      "key": "ca7da0855c298aab3bfcfbce1dc433f3d7ef009e",
+      "name": "Icon / folder-archive",
+      "description": "archive, zip, package",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53488": {
+      "key": "e1d4e621ff2c6b5d4c89768265ba1ec07dc67563",
+      "name": "Icon / folder-check",
+      "description": "done, directory, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53573": {
+      "key": "bdfdd63314a996627fd3e4257b136887e0919c8d",
+      "name": "Icon / folder-clock",
+      "description": "history, directory, clock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54123": {
+      "key": "627d4d04d581f0ca282cb381527a3d57b0f8253a",
+      "name": "Icon / folder-closed",
+      "description": "directory, closed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53226": {
+      "key": "9df8e89576e9a6f34b56929d3361cd8624fffb75",
+      "name": "Icon / folder-code",
+      "description": "directory, coding, develop, software",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53224": {
+      "key": "2df272d7d1a9bfaf6c85333c893f92459b14b55a",
+      "name": "Icon / folder-cog",
+      "description": "directory, settings, control, preferences, cog, edit, gear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53905": {
+      "key": "60c723c6868b8857457755ce8d3dc6bed917f9a1",
+      "name": "Icon / folder-dot",
+      "description": "directory, root, project, pinned, active, current, cogged, gear, mechanical, machinery, configuration, controls, preferences, settings, system, admin, edit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53223": {
+      "key": "adaae517230749a20370c2da3aab92c063f2a96e",
+      "name": "Icon / folder-down",
+      "description": "directory, download, import, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53479": {
+      "key": "871327a2b11dcae2a7e8c5494cf3ee4c3dd1daf8",
+      "name": "Icon / folder-git-2",
+      "description": "directory, root, project, git, repo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53219": {
+      "key": "57e557d26edf317d88db1ee43c629e35c9cd64ac",
+      "name": "Icon / folder-git",
+      "description": "directory, root, project, git, repo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53471": {
+      "key": "9ffa6275b324e33d1f7c84b8f83cd193e1f2d43a",
+      "name": "Icon / folder-heart",
+      "description": "directory, heart, favourite, bookmark, quick link",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53218": {
+      "key": "cd5f71bea98d4919c5c9af20d016bd629af52687",
+      "name": "Icon / folder-input",
+      "description": "directory, import, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53390": {
+      "key": "53c4c44d971ec615ba2d1354563e4684ee8b5f0e",
+      "name": "Icon / folder-kanban",
+      "description": "projects, manage, overview, board, tickets, issues, roadmap, plan, intentions, productivity, work, agile, code, coding, directory, project, root",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53386": {
+      "key": "5296a8cf0c32435456cd19065805f3fe47ae090b",
+      "name": "Icon / folder-key",
+      "description": "directory, key, private, security, protected",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53215": {
+      "key": "d1e28b42d556b1cb2d8ca6bbc565e14f9f665175",
+      "name": "Icon / folder-lock",
+      "description": "directory, lock, private, security, protected",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53213": {
+      "key": "68407d6798ecc6bbda670b04dc5fb86ea0db30af",
+      "name": "Icon / folder-minus",
+      "description": "directory, remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53211": {
+      "key": "fd3ba629b4cf4f508da49b54e299a88179a5791d",
+      "name": "Icon / folder-open-dot",
+      "description": "directory, root, project, active, current, pinned",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54078": {
+      "key": "7d28b56199acf6e80580b8c227c36effec8f9306",
+      "name": "Icon / folder-open",
+      "description": "directory",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53470": {
+      "key": "8063f97b326773139abcd0c8fe49c287bdfe65ca",
+      "name": "Icon / folder-output",
+      "description": "directory, import, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53210": {
+      "key": "c26388944700cb4be95934c161080b4538c69915",
+      "name": "Icon / folder-pen",
+      "description": "directory, rename",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53208": {
+      "key": "98598c567435b80cf9c75b4b1a3c1afedb19368b",
+      "name": "Icon / folder-plus",
+      "description": "directory, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53206": {
+      "key": "59e896eefbf64f1371b83a22dc09167359b73ec5",
+      "name": "Icon / folder-root",
+      "description": "directory, root, project, git, repo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53180": {
+      "key": "ca8212ff1d86254871714c150c70db11c4dde2bc",
+      "name": "Icon / folder-search-2",
+      "description": "directory, search, find, lost, browser, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53718": {
+      "key": "9a342c657bb89a204138fc8588d6a324f1939ea1",
+      "name": "Icon / folder-search",
+      "description": "directory, search, find, lost, browser, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53204": {
+      "key": "b6aa2e523dd60364bf13bc7612859b34f80858e5",
+      "name": "Icon / folder-symlink",
+      "description": "directory, symlink, symbolic, link",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53768": {
+      "key": "c40aba816fcc59c4a2d6563ebffb74e009c29d2f",
+      "name": "Icon / folder-sync",
+      "description": "directory, synchronize, synchronise, refresh, reconnect, transfer, backup",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53203": {
+      "key": "90d52c71963214b1c4c68baeeca475c6a1d49780",
+      "name": "Icon / folder-tree",
+      "description": "directory, tree, browser",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53202": {
+      "key": "d6b610fbcfa88e4901954e776d131f96270f9f8f",
+      "name": "Icon / folder-up",
+      "description": "directory, upload, import, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53655": {
+      "key": "b1beba5db723a55b7fe4f214aa2e9ab11cbee9d3",
+      "name": "Icon / folder-x",
+      "description": "directory, remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53201": {
+      "key": "2feb9af9dc36298516a4dc9044715e2f78b2cd5e",
+      "name": "Icon / folder",
+      "description": "directory",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53605": {
+      "key": "9ac48934ed2a4f70ec1538cfb44e528352832a18",
+      "name": "Icon / folders",
+      "description": "multiple, copy, directories",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53198": {
+      "key": "54e29137029ca87006ac30ebcd9dfac768902b4e",
+      "name": "Icon / footprints",
+      "description": "steps, walking, foot, feet, trail, shoe",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54107": {
+      "key": "007c640a68b5837416016a37ff93881d43d4da89",
+      "name": "Icon / forklift",
+      "description": "vehicle, transport, logistics",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53196": {
+      "key": "dd5ee264070dbcafff1cff7ac443ab49ba250ca6",
+      "name": "Icon / forward",
+      "description": "send, share, email",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53194": {
+      "key": "c3eb9471b59331d7f4f357adb429e3e9528f2030",
+      "name": "Icon / frame",
+      "description": "logo, design, tool",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53191": {
+      "key": "f8655c599475e544d93742ba9001b4ab004daacc",
+      "name": "Icon / framer",
+      "description": "logo, design, tool",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53418": {
+      "key": "68bff8d3db6be1e10bc9caea3445cd53a5ca91ce",
+      "name": "Icon / frown",
+      "description": "emoji, face, bad, sad, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53190": {
+      "key": "695c6f6fc2858821507dcff2d8b8fcaf41547c9b",
+      "name": "Icon / fuel",
+      "description": "filling-station, gas, petrol, tank",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53921": {
+      "key": "5a03b3f0899f57ad7326111d26bd513128e0e9c3",
+      "name": "Icon / fullscreen",
+      "description": "expand, zoom, preview, focus, camera, lens, image",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53396": {
+      "key": "4e85dbedcfeb2ca172058a412882d17a39f0195a",
+      "name": "Icon / funnel-plus",
+      "description": "filter, hopper, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53897": {
+      "key": "2f682e6ad82049256e8780f4484c9165bda1ff96",
+      "name": "Icon / funnel-x",
+      "description": "filter, hopper, remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53187": {
+      "key": "81821c5a46d36e3e8b2d6f2a6fa4f6bdead7fda3",
+      "name": "Icon / funnel",
+      "description": "filter, hopper",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53392": {
+      "key": "6897071c4549c2f91c45df08aee31f657b34c10b",
+      "name": "Icon / gallery-horizontal-end",
+      "description": "carousel, pictures, images, scroll, swipe, album, portfolio, history, versions, backup, time machine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53779": {
+      "key": "8e6fe2298a7b36055923cf4a39a977924d65d82c",
+      "name": "Icon / gallery-horizontal",
+      "description": "carousel, pictures, images, scroll, swipe, album, portfolio",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53099": {
+      "key": "465315a9bb755a521920ad4d971381d4ff755cb1",
+      "name": "Icon / gallery-thumbnails",
+      "description": "carousel, pictures, images, album, portfolio, preview",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54090": {
+      "key": "a9531f91342362d3df16fe84410570ce4294c069",
+      "name": "Icon / gallery-vertical-end",
+      "description": "carousel, pictures, images, scroll, swipe, album, portfolio, history, versions, backup, time machine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53185": {
+      "key": "aa2df61d648c91b8ed266e9ac6f8ca8e5ac5f0cb",
+      "name": "Icon / gallery-vertical",
+      "description": "carousel, pictures, images, scroll, swipe, album, portfolio",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54147": {
+      "key": "5ca245a321dd6ad36cc252c2005c88d613a9448d",
+      "name": "Icon / gamepad-2",
+      "description": "console",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53309": {
+      "key": "464ed7487f1b1074cdf6911e2f6a87bf3c4d4d29",
+      "name": "Icon / gamepad",
+      "description": "console",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53183": {
+      "key": "860f3e9ddf44c9097bd4e1d9312a2a042a644e6c",
+      "name": "Icon / gauge",
+      "description": "dashboard, dial, meter, speed, pressure, measure, level",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53552": {
+      "key": "d4cacaad872e71dd36984c42fc30e58fc9157b35",
+      "name": "Icon / gavel",
+      "description": "hammer, mallet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53714": {
+      "key": "b21bf9b223d273bf0521854425f76b7af5b9df00",
+      "name": "Icon / gem",
+      "description": "diamond, crystal, ruby, jewellery, price, special, present, gift, ring, wedding, proposal, marriage, rubygems",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53996": {
+      "key": "afcdb83f407349433cd72a80b5fce8732e2148f2",
+      "name": "Icon / ghost",
+      "description": "pac-man, spooky",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53181": {
+      "key": "0ad021c63e3fa050b6588964dfa102f47a47d450",
+      "name": "Icon / git-branch-plus",
+      "description": "add, create, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53532": {
+      "key": "6179993be64c5308bd3980c48514e6936842b00e",
+      "name": "Icon / git-branch",
+      "description": "code, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53274": {
+      "key": "fd6b909958f80a73a2112a0df71b179677d49678",
+      "name": "Icon / git-commit-horizontal",
+      "description": "code, version control, waypoint, stop, station",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53177": {
+      "key": "f7c40814b57f30b99599261236e31842db0b4301",
+      "name": "Icon / git-commit-vertical",
+      "description": "code, version control, waypoint, stop, station",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53221": {
+      "key": "535f01882c854675eb8d7bfecfd3437bb6ec63f1",
+      "name": "Icon / git-compare-arrows",
+      "description": "code, version control, diff",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53753": {
+      "key": "dba5e1f79e4d0f41665bacf9788cdec77b8b49d2",
+      "name": "Icon / git-compare",
+      "description": "code, version control, diff",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53747": {
+      "key": "bb0e7a00477a97623b96b47e5b106719a21381ce",
+      "name": "Icon / git-fork",
+      "description": "code, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54109": {
+      "key": "94fdc0089ec23a6e019eab368d4e8d03f792933b",
+      "name": "Icon / git-graph",
+      "description": "code, version control, commit graph, commits, gitlens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53971": {
+      "key": "5b21c2fbbf233ddfed1892637604e1027021bb64",
+      "name": "Icon / git-merge",
+      "description": "code, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53336": {
+      "key": "1d1582c72e14ddf59d4d96ca96ebd61c6c391234",
+      "name": "Icon / git-pull-request-arrow",
+      "description": "code, version control, open",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53175": {
+      "key": "69b1eac84af601415b20474f4790ae8d540c94a0",
+      "name": "Icon / git-pull-request-closed",
+      "description": "code, version control, rejected, closed, cancelled, x",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54151": {
+      "key": "49bc4f7aa306c127370607f0a2b4aaa549ce6943",
+      "name": "Icon / git-pull-request-create-arrow",
+      "description": "code, version control, open, plus, add, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53174": {
+      "key": "95345b6a6868502c6fb5520461342cc39c7e0352",
+      "name": "Icon / git-pull-request-create",
+      "description": "code, version control, open, plus, add, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53172": {
+      "key": "3eb5b65afa27feb95f7be3aa3818733e078b6fb1",
+      "name": "Icon / git-pull-request-draft",
+      "description": "code, version control, open, draft, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53171": {
+      "key": "65a22eb1beec4ac1e11f07c4ef5f59bae5450706",
+      "name": "Icon / git-pull-request",
+      "description": "code, version control, open",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54119": {
+      "key": "ba57f02fc2048276d3bb00be29caf85ca7bd361a",
+      "name": "Icon / github",
+      "description": "logo, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53169": {
+      "key": "a8546b90aad04e0051704a7e94aaaa9fe8075856",
+      "name": "Icon / gitlab",
+      "description": "logo, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53168": {
+      "key": "73e4efe9b803d3707e90e0e45fed2f3bc87c4845",
+      "name": "Icon / glass-water",
+      "description": "beverage, drink, glass, water",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53945": {
+      "key": "ce3c521b097eb8702ac0cba41dd257822d0aaac0",
+      "name": "Icon / glasses",
+      "description": "glasses, spectacles",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53166": {
+      "key": "06de96989695fb9fc299266128f89820afea34b3",
+      "name": "Icon / globe-lock",
+      "description": "vpn, private, privacy, network, world, browser, security, encryption, protection, connection",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53623": {
+      "key": "21a2f88005ffafd454b1b98c4d1fd90f8a8f8e8d",
+      "name": "Icon / globe",
+      "description": "world, browser, language, translate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53164": {
+      "key": "0415a85c2f37d6080b1e303166f7d8afae916a76",
+      "name": "Icon / goal",
+      "description": "flag, bullseye",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53161": {
+      "key": "32ce419605509aca41a0c28e4dd8eefbe3b1d2e0",
+      "name": "Icon / gpu",
+      "description": "processor, cores, technology, computer, chip, circuit, specs, graphics processing unit, video card, display adapter, gddr, rendering, digital image processing, crypto mining",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53160": {
+      "key": "33cdf1d56b67750e612ed7b3486f6d5488e4c3c4",
+      "name": "Icon / grab",
+      "description": "hand",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54144": {
+      "key": "653b4eb5ef54450b39ae7bc8799f537cc79ccc3a",
+      "name": "Icon / graduation-cap",
+      "description": "school, university, learn, study, mortarboard, education, ceremony, academic, hat, diploma, bachlor's, master's, doctorate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53157": {
+      "key": "0cc4bbaac96b6e9b3318536ee5b89385c7689e28",
+      "name": "Icon / grape",
+      "description": "fruit, wine, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53155": {
+      "key": "755279c92e980ece7c1b1aa0b31f8b074fab0e37",
+      "name": "Icon / grid-2x2-check",
+      "description": "table, rows, columns, blocks, plot, land, geometry, measure, data, size, width, height, distance, surface area, square meter, acre",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53405": {
+      "key": "db8ac7935e9c334fcae1a41402313ff00727f6e9",
+      "name": "Icon / grid-2x2-plus",
+      "description": "table, rows, columns, blocks, plot, land, geometry, measure, data, size, width, height, distance, surface area, square meter, acre",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53154": {
+      "key": "5bd550a59672f245b0db16e7561b7e94a17dcc51",
+      "name": "Icon / grid-2x2-x",
+      "description": "table, rows, columns, data, blocks, plot, land, geometry, measure, size, width, height, distance, surface area, square meter, acre",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53425": {
+      "key": "d6238fda86a0e437fb1253f8bf1efe40ec8c62f1",
+      "name": "Icon / grid-2x2",
+      "description": "table, rows, columns, blocks, plot, land, geometry, measure, size, width, height, distance, surface area, square meter, acre, window, skylight",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53838": {
+      "key": "36638fc8644612a5ad52233b666a7ac1737d7d95",
+      "name": "Icon / grid-3x3",
+      "description": "table, rows, columns",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53551": {
+      "key": "d69e96e9a69fa31ffe663ce89f80e97c75606303",
+      "name": "Icon / grip-horizontal",
+      "description": "grab, dots, handle, move, drag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53153": {
+      "key": "0171207a7fc7b19ed59210055b27ec72bd54a0ee",
+      "name": "Icon / grip-vertical",
+      "description": "grab, dots, handle, move, drag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53150": {
+      "key": "eb56524da04ab63b5e487c0e0160940d0c3f03d8",
+      "name": "Icon / grip",
+      "description": "grab, dots, handle, move, drag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53334": {
+      "key": "36d31b7d129379b830b9176f312b604f1a17ff43",
+      "name": "Icon / group",
+      "description": "cubes, packages, parts, units, collection, cluster, gather, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53148": {
+      "key": "f47b886126934088e1f4f71223065fcbed68d64f",
+      "name": "Icon / guitar",
+      "description": "acoustic, instrument, strings, riff, rock, band, country, concert, performance, play, lead, loud, music, audio, sound, noise",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53146": {
+      "key": "03ac9685c47d8bf765e64a026a535e146a799b24",
+      "name": "Icon / ham",
+      "description": "food, pork, pig, meat, bone, hock, knuckle, gammon, cured",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53145": {
+      "key": "d39a9ecc0520a015a1655939e3323b81d839bef8",
+      "name": "Icon / hamburger",
+      "description": "burger, cheeseburger, meat, beef, patty, bun, fast food, junk food, takeaway, takeout, snack, dish, restaurant, lunch, meal, savory, savoury, cookery, cooking, grilled, barbecue, barbeque, bbq, lettuce, tomato, relish, pickles, onions, ketchup, mustard, mayonnaise",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53143": {
+      "key": "f295af5e74337b308939551b4ad6ebeb42552458",
+      "name": "Icon / hammer",
+      "description": "mallet, nails, diy, toolbox, build, construction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53141": {
+      "key": "6e52d55aa808e554dfef288fb88d4e14bbb393d8",
+      "name": "Icon / hand-coins",
+      "description": "savings, banking, money, finance, offers, mortgage, payment, received, wage, payroll, allowance, pocket money, handout, pennies",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53231": {
+      "key": "98a67f630954c256eae86f950bcc282fd24307aa",
+      "name": "Icon / hand-heart",
+      "description": "love, like, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53370": {
+      "key": "9c4cbf7823c04e53ce5fba1c73a38a453fb8e2c9",
+      "name": "Icon / hand-helping",
+      "description": "agreement, help, proposal, charity, begging, terms",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53666": {
+      "key": "e95c795750c2d9b621902297f462dafe45456afd",
+      "name": "Icon / hand-metal",
+      "description": "rock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53137": {
+      "key": "75a30dfd5e9399d91972c88e7bcf725f85f237a3",
+      "name": "Icon / hand-platter",
+      "description": "waiter, waitress, restaurant, table service, served, dinner, dining, meal, course, luxury",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53846": {
+      "key": "f017763c8c8df820f295a2e6a0bae899d7f2bb2e",
+      "name": "Icon / hand",
+      "description": "wave, move, mouse, grab",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54162": {
+      "key": "136dd86c750ad23323b14a3b1db78d079859dfc1",
+      "name": "Icon / handshake",
+      "description": "agreement, partnership, deal, business, assistance, cooperation, friendship, union, terms",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54047": {
+      "key": "e2a701a5919bfa158585e648c23e330f319cfb95",
+      "name": "Icon / hard-drive-download",
+      "description": "computer, server, memory, data, ssd, disk, hard disk, save",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54125": {
+      "key": "9159719efd75170a8612c29d19b03a49d77ea500",
+      "name": "Icon / hard-drive-upload",
+      "description": "computer, server, memory, data, ssd, disk, hard disk, save",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53135": {
+      "key": "1f18fdf8bc1793116aa8dab2a058864634a29f27",
+      "name": "Icon / hard-drive",
+      "description": "computer, server, memory, data, ssd, disk, hard disk",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53133": {
+      "key": "239ffe192d3949e204980e94fe801f38769cca70",
+      "name": "Icon / hard-hat",
+      "description": "helmet, construction, safety, savety",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54128": {
+      "key": "93cfe321485338d41d734ad86d4941420348d138",
+      "name": "Icon / hash",
+      "description": "hashtag, number, pound",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53189": {
+      "key": "04e51694a8087d15399fa112dac1754f92189b9d",
+      "name": "Icon / haze",
+      "description": "mist, fog",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53129": {
+      "key": "e1c4087695223450590a5b9a675072b83d08c93c",
+      "name": "Icon / hdmi-port",
+      "description": "socket, plug, slot, controller, connector, interface, console, signal, audio, video, visual, av, data, input, output",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53977": {
+      "key": "86a2593d50f76f4e6131478e1b1b9b720a659ea2",
+      "name": "Icon / heading-1",
+      "description": "h1, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53128": {
+      "key": "7e94b09cfd044eb9ebc20ada76285b7a2afcde36",
+      "name": "Icon / heading-2",
+      "description": "h2, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53502": {
+      "key": "f5714fc0e1e51b84341e823e7ec5ec70ed0f49f7",
+      "name": "Icon / heading-3",
+      "description": "h3, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53400": {
+      "key": "4e99f2791ea941de34d51ed5346a3c82364c3837",
+      "name": "Icon / heading-4",
+      "description": "h4, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53482": {
+      "key": "b027fd5ea411aac772a3c2c3799ad13b4ce9066d",
+      "name": "Icon / heading-5",
+      "description": "h5, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53549": {
+      "key": "2a3b1ff3e8ba1169261b3f995799926760224f26",
+      "name": "Icon / heading-6",
+      "description": "h6, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53866": {
+      "key": "7b67715bfeae4fe9a35d599523c83eb0570521e2",
+      "name": "Icon / heading",
+      "description": "h1, html, markup, markdown",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53547": {
+      "key": "c2e88faca2de0243b41cf105fffee584aa27204b",
+      "name": "Icon / headphone-off",
+      "description": "music, audio, sound, mute, off",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53384": {
+      "key": "8a0f39ff219aced1b5f8c7ef2614692b45df9146",
+      "name": "Icon / headphones",
+      "description": "music, audio, sound",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53127": {
+      "key": "1f984ed3ab9f626ad3fd05e455f85c577810224f",
+      "name": "Icon / headset",
+      "description": "music, audio, sound, gaming, headphones, headset, call, center, phone, telephone, voip, video",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53248": {
+      "key": "46e8d1f471f44233a760a108bf0e9041dd93762b",
+      "name": "Icon / heart-crack",
+      "description": "heartbreak, sadness, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53366": {
+      "key": "0f66c5dfae9e105201b4c3515335141892dbb142",
+      "name": "Icon / heart-handshake",
+      "description": "agreement, charity, help, deal, terms, emotion, together, handshake",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53139": {
+      "key": "ce699a8c97c52583c4dfb3b322fe4299f8f73e8a",
+      "name": "Icon / heart-minus",
+      "description": "unlike, unfavorite, remove, damage, ui & ux",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53126": {
+      "key": "1890104ea7c3a0844faa16b9b0679c1a260593f7",
+      "name": "Icon / heart-off",
+      "description": "unlike, dislike, hate, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53124": {
+      "key": "26c9cf8f594915299e49233dabb6426e04451f11",
+      "name": "Icon / heart-plus",
+      "description": "plus, like, favorite, add, health, support",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53701": {
+      "key": "efb5e0447515ba5abb0418dbd220953cb9ed7b15",
+      "name": "Icon / heart-pulse",
+      "description": "heartbeat, pulse, health, medical, blood pressure, cardiac, systole, diastole",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53123": {
+      "key": "22bfd3c937e43c0d98ab8c9b4f0fcc170c511033",
+      "name": "Icon / heart",
+      "description": "like, love, emotion, suit, playing, cards",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53375": {
+      "key": "0f75a472c08a32e45ad3672b7e11ec88fb9f47cd",
+      "name": "Icon / heater",
+      "description": "heating, warmth, comfort, fire, stove, electric, electronics, amenities",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53131": {
+      "key": "cb42b839ad527221728a8e38056041bf5e5f8bf1",
+      "name": "Icon / hexagon",
+      "description": "shape, node.js, logo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53462": {
+      "key": "fc9daaafbd4285dc9876ee0a90980bb6aa2d1a17",
+      "name": "Icon / highlighter",
+      "description": "mark, text",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53122": {
+      "key": "4541b77cde49526b588751573c035bf2a6c608d8",
+      "name": "Icon / history",
+      "description": "time, redo, undo, rewind, timeline, version, time machine, backup, rotate, ccw",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53279": {
+      "key": "de04287ff05737467bb7839365a277694ab31e8a",
+      "name": "Icon / hop-off",
+      "description": "beer, brewery, drink, hop free, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53939": {
+      "key": "ec5a2bfc1478d49e70ccd785e8659c688abbe991",
+      "name": "Icon / hop",
+      "description": "beer, brewery, drink",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53121": {
+      "key": "fbcdc7aefa0d3dc09d263ad4d58183f9770457e4",
+      "name": "Icon / hospital",
+      "description": "infirmary, sanatorium, healthcare, doctor, hospice, clinic, emergency room, ward, building, medical, vet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53120": {
+      "key": "a02b9d0880bfbea879d53baa8dbf18aa5f9dd88c",
+      "name": "Icon / hotel",
+      "description": "building, hostel, motel, inn",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53395": {
+      "key": "dda7311cde911cf3b66c1cc65ec9c70e0f954eaf",
+      "name": "Icon / hourglass",
+      "description": "timer, time, sandglass",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53536": {
+      "key": "1f3c86f85dd6ecb761bbbcca8fc3aa38dd6c7761",
+      "name": "Icon / house-plug",
+      "description": "home, living, building, residence, architecture, autarky, energy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53766": {
+      "key": "2651ee3dceabac66f322179f8bbb9c9e0ce2a45a",
+      "name": "Icon / house-plus",
+      "description": "home, living, medical, new, addition, building, residence, architecture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53590": {
+      "key": "eb52c375cc1d44dd8593ff6eff75286da1a00c59",
+      "name": "Icon / house-wifi",
+      "description": "home, living, building, wifi, connectivity",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53118": {
+      "key": "e753994a13b644bbac3b141ce2c745411e40329d",
+      "name": "Icon / house",
+      "description": "home, living, building, residence, architecture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53117": {
+      "key": "89f351682715aa6ce0984a45459d8b1d37831659",
+      "name": "Icon / ice-cream-bowl",
+      "description": "gelato, food, dessert, dish, restaurant, course, meal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53859": {
+      "key": "785e05f9374ae9461918fc63668680d8af7ac5c0",
+      "name": "Icon / ice-cream-cone",
+      "description": "gelato, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53854": {
+      "key": "4402cd07189dd3d92b92efd30eabe888295383f6",
+      "name": "Icon / id-card-lanyard",
+      "description": "id-card, id-card-lanyard, identity, employee, gate-pass",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53197": {
+      "key": "855fe445731e77ad946360c7eb0f41bdc9fcf5d0",
+      "name": "Icon / id-card",
+      "description": "card, badge, identity, authentication, secure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53115": {
+      "key": "9d68cc96967420edc27146367ca813c9f7ef7c59",
+      "name": "Icon / image-down",
+      "description": "picture, photo, download, save, export",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53403": {
+      "key": "12ac5ddfb5c6316c8a8f3536c1d8cba85d3c0941",
+      "name": "Icon / image-minus",
+      "description": "remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53167": {
+      "key": "3514e4887fadcabf53d9bf166ee85967557f3b09",
+      "name": "Icon / image-off",
+      "description": "picture, photo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53952": {
+      "key": "ba7216bcafb994918471e6b46aec8acb79e88023",
+      "name": "Icon / image-play",
+      "description": "picture, gif, photo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54077": {
+      "key": "6146cd6cab3f759f7d4e7440e9e7e30d8c3ac5bd",
+      "name": "Icon / image-plus",
+      "description": "add, create, picture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53112": {
+      "key": "c2812d9647112df7257681e90318dda11392ea02",
+      "name": "Icon / image-up",
+      "description": "picture, photo, upload, import",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53250": {
+      "key": "b59eb6dd78af9e5894b3c70c21967e17507f0917",
+      "name": "Icon / image-upscale",
+      "description": "resize, picture, sharpen, increase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53108": {
+      "key": "b58def155036c4dc41d2923897efeeb0f24a74bd",
+      "name": "Icon / image",
+      "description": "picture, photo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53106": {
+      "key": "2d4adca0975b61ecf1957a06b058234f8c322355",
+      "name": "Icon / images",
+      "description": "picture, photo, multiple, copy, gallery, album, collection, slideshow, showcase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53110": {
+      "key": "2c21dd0e6d873dc04763455984541aa6f0a1a223",
+      "name": "Icon / import",
+      "description": "save",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53104": {
+      "key": "cdaa50e74eb09bc9a706d72b06d6d3495d5eb7e0",
+      "name": "Icon / inbox",
+      "description": "email",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53925": {
+      "key": "e85c53214eb09ecd87d52d53463b9478d15ff032",
+      "name": "Icon / indent-decrease",
+      "description": "text, tab",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53964": {
+      "key": "4265e7d90e5551dce02fbc875f76125695063076",
+      "name": "Icon / indent-increase",
+      "description": "text, tab",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53103": {
+      "key": "344a3a2e84ab227e4745b34accff1d7cb920bf6a",
+      "name": "Icon / indian-rupee",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53976": {
+      "key": "beb4d3e839eee266d5e3d17f3a16062f63a1c42b",
+      "name": "Icon / infinity",
+      "description": "unlimited, forever, loop, math",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53815": {
+      "key": "04319dcb73c1965f2ef424826b1aa3513a5bc5ac",
+      "name": "Icon / info",
+      "description": "help",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54134": {
+      "key": "4a4277163ada1cf55c1e03b7a9f887deb7a884bc",
+      "name": "Icon / inspection-panel",
+      "description": "access, cover, tile, metal, materials, screws",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53101": {
+      "key": "e025b43df94d74e301ecaa3a8c197ca8227f4fde",
+      "name": "Icon / instagram",
+      "description": "logo, camera, social",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53097": {
+      "key": "179310785e04e0fc4dd81407db17d21cc1c3390f",
+      "name": "Icon / italic",
+      "description": "oblique, text, format",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53095": {
+      "key": "8a1d3d6ee2eaeb9ad558fff9c6cd7892ab170083",
+      "name": "Icon / iteration-ccw",
+      "description": "arrow, right",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53092": {
+      "key": "effa5cb27958098cf3113674f4d2fb134ba5f520",
+      "name": "Icon / iteration-cw",
+      "description": "arrow, left",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54103": {
+      "key": "46f31092984f47f0f1416f6cb6389deefcca86fc",
+      "name": "Icon / japanese-yen",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53088": {
+      "key": "ae5ae215e3fd4efcea12f78587be74f3892c79c4",
+      "name": "Icon / joystick",
+      "description": "game, console, control stick",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53086": {
+      "key": "e66e14eabe7c7cae056af7605aff589e6774fa3a",
+      "name": "Icon / kanban",
+      "description": "projects, manage, overview, board, tickets, issues, roadmap, plan, intentions, productivity, work, agile, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53873": {
+      "key": "b0a51f9f626fdbf06182cff9023d4b8ee6633026",
+      "name": "Icon / key-round",
+      "description": "password, login, authentication, secure, unlock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53928": {
+      "key": "bf184cb48943dfe085abe9e3f04641db0d14781a",
+      "name": "Icon / key-square",
+      "description": "password, login, authentication, secure, unlock, car key",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53717": {
+      "key": "5ab89100d8a23a14067b986f7ce4f9d40e676463",
+      "name": "Icon / key",
+      "description": "password, login, authentication, secure, unlock, keychain, key ring, fob",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53084": {
+      "key": "50c5f578e953ff51199d243821b516e36a323b5d",
+      "name": "Icon / keyboard-music",
+      "description": "music, audio, sound, noise, notes, keys, chord, octave, midi, controller, instrument, electric, signal, digital, studio, production, producer, pianist, piano, play, performance, concert",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53082": {
+      "key": "776ca5582e6f401c92f5a4d84915767d946d77f5",
+      "name": "Icon / keyboard-off",
+      "description": "unkeys, layout, spell, settings, mouse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53081": {
+      "key": "781fc2ad7ac958921f88f4a3201d14ac292c74d7",
+      "name": "Icon / keyboard",
+      "description": "layout, spell, settings, mouse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53798": {
+      "key": "442abfd53d1b7eb8c5b893d43fd8afd18d516eee",
+      "name": "Icon / lamp-ceiling",
+      "description": "lighting, household, home, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53080": {
+      "key": "69776d4c44757f4b269849bda7bb7fdd8ed13a08",
+      "name": "Icon / lamp-desk",
+      "description": "lighting, household, office, desk, home, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53734": {
+      "key": "62c752e260e79181995e8537e237ed43b4c9d261",
+      "name": "Icon / lamp-floor",
+      "description": "lighting, household, floor, home, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53078": {
+      "key": "9c2600b8bcbafaf313eff020ae6a4d1df2905a1a",
+      "name": "Icon / lamp-wall-down",
+      "description": "lighting, household, wall, home, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53077": {
+      "key": "bca80c242192d7eeb8e497b8e3819fff9882b696",
+      "name": "Icon / lamp-wall-up",
+      "description": "lighting, household, wall, home, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53776": {
+      "key": "55ef4836609c0b8173e9d51e3862b62a2a9631dd",
+      "name": "Icon / lamp",
+      "description": "lighting, household, home, furniture",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53075": {
+      "key": "4703e319f8860703473058b0b8e2a4986687ac7a",
+      "name": "Icon / land-plot",
+      "description": "area, surface, square metres, allotment, parcel, property, plane, acres, measure, distance, isometric, flag, golf course, hole",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53074": {
+      "key": "2573698e5b3822df4b916013328b6f29554835ba",
+      "name": "Icon / landmark",
+      "description": "bank, building, capitol, finance, money, museum, art gallery, hall, institute, pediment, portico, columns, pillars, classical, architecture, government, institution",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53989": {
+      "key": "18fbdb1f86dcbfd35e2fe1fe310ff827541cd13d",
+      "name": "Icon / languages",
+      "description": "translate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53073": {
+      "key": "8d1a030d89b4ef6ec9de31550aca0124afb993c5",
+      "name": "Icon / laptop-minimal-check",
+      "description": "computer, screen, remote, success, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54106": {
+      "key": "18ab08c2fc0eca0431fc34edc4b81a97aaed1bf6",
+      "name": "Icon / laptop-minimal",
+      "description": "computer, screen, remote",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53072": {
+      "key": "898434a2c256c5763b6419c80fd013847db00635",
+      "name": "Icon / laptop",
+      "description": "computer, screen, remote",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53071": {
+      "key": "f59ddb0d606515e0703d79133252662ed3846a25",
+      "name": "Icon / lasso-select",
+      "description": "select, cursor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53083": {
+      "key": "9991963f7f893cf0b21526498bae2b3f7a4926c8",
+      "name": "Icon / lasso",
+      "description": "select, cursor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53070": {
+      "key": "12b6d16bd6c4af53fd413cd845d5f28b27d2edb1",
+      "name": "Icon / laugh",
+      "description": "emoji, face, happy, good, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53068": {
+      "key": "e01b1d17759a84eb42a11e4f1aa6bfff2dde1cc3",
+      "name": "Icon / layers-2",
+      "description": "stack, pile, pages, sheets, paperwork, copies, copy, duplicate, double, shortcuts",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53436": {
+      "key": "61a7e403738bb7b907e3b8201ee8a8337d49c2c9",
+      "name": "Icon / layers",
+      "description": "stack, pile, pages, sheets, paperwork, copies, copy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53067": {
+      "key": "de4ae532831a277dcff60e494f5c193e40b1474d",
+      "name": "Icon / layout-dashboard",
+      "description": "masonry, brick",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53066": {
+      "key": "dd252d4bb12d0a45e40df9de7307f71c1c25d4bd",
+      "name": "Icon / layout-grid",
+      "description": "app, home, start",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53063": {
+      "key": "dba3a1066798ee9b632eb11c15309292e6f8e221",
+      "name": "Icon / layout-list",
+      "description": "todo, tasks, items, pending, image, photo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53754": {
+      "key": "9f1206f20e74f180486c356a712b1d172cec1867",
+      "name": "Icon / layout-panel-left",
+      "description": "app, home, start, grid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54117": {
+      "key": "037ebf51f05e74453211354d013b82559c9aeb25",
+      "name": "Icon / layout-panel-top",
+      "description": "window, webpage, block, section, grid, template, structure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53414": {
+      "key": "b98bd132aed50b5ef0d5b01ddc8730d7aedac1b9",
+      "name": "Icon / layout-template",
+      "description": "window, webpage, block, section",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53062": {
+      "key": "e548d5071b3e742910d54f1be8f110a15f699301",
+      "name": "Icon / leaf",
+      "description": "sustainability, nature, energy, plant, autumn",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53061": {
+      "key": "619a4dad238bb784b6b8509bacae284e890eba29",
+      "name": "Icon / leafy-green",
+      "description": "salad, lettuce, vegetable, chard, cabbage, bok choy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54055": {
+      "key": "202db19daacb8f3874e15b636b52f156fbbc1fb7",
+      "name": "Icon / lectern",
+      "description": "pulpit, podium, stand",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54129": {
+      "key": "165500c66300d6255d961369c89a7b9cdb421890",
+      "name": "Icon / letter-text",
+      "description": "drop cap, text, format, typography, letter, font size",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53059": {
+      "key": "0969ff4c21e835ba1bb11885aff546cf69cbaadb",
+      "name": "Icon / library-big",
+      "description": "books, reading, written, authors, stories, fiction, novels, information, knowledge, education, high school, university, college, academy, learning, study, research, collection, vinyl, records, albums, music, package",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53058": {
+      "key": "0083ea6cfda43b661da702474fb2013fb6f41cc8",
+      "name": "Icon / library",
+      "description": "books, reading, written, authors, stories, fiction, novels, information, knowledge, education, high school, university, college, academy, learning, study, research, collection, vinyl, records, albums, music, package",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53056": {
+      "key": "1b9c928179fbe9fe77245947375c3a900f2ac6e2",
+      "name": "Icon / life-buoy",
+      "description": "preserver, life belt, lifesaver, help, rescue, ship, ring, raft, inflatable, wheel, donut",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53055": {
+      "key": "8ef29a68230a1ba2d9ed173ca4bb5a9731f5705e",
+      "name": "Icon / ligature",
+      "description": "text, font, typography, alternates, alternatives",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53053": {
+      "key": "12402647a1bbbb82c1f23da2fd612481b99a95eb",
+      "name": "Icon / lightbulb-off",
+      "description": "lights",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53178": {
+      "key": "1209ab4968660b124b64e8b844318e997bfd374d",
+      "name": "Icon / lightbulb",
+      "description": "idea, bright, lights",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53051": {
+      "key": "63c47fe0c4273338d7939e88360f16138e02f45a",
+      "name": "Icon / link-2-off",
+      "description": "unchain, chain",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53050": {
+      "key": "65270cba1b29f249da1a993d5da7f586d837c9f0",
+      "name": "Icon / link-2",
+      "description": "chain, url",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53049": {
+      "key": "1fbb65cb59fbda49fd85bda3b226acc916ffd1f8",
+      "name": "Icon / link",
+      "description": "chain, url",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53811": {
+      "key": "799d1401994a88ea537a78c26840f3348bedec74",
+      "name": "Icon / linkedin",
+      "description": "logo, social media, social",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53820": {
+      "key": "1d4e9e58dd5984b22b1b9794bc0cdbb27e2f720c",
+      "name": "Icon / list-check",
+      "description": "done, check, tick, complete, list, to-do, bom",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53048": {
+      "key": "53a1f8ffcd4b8a0b6090a7022ca78099624366c7",
+      "name": "Icon / list-checks",
+      "description": "todo, done, check, tick, complete, tasks, items, pending",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53047": {
+      "key": "d6e38efad3cf5fc4fab11ec53b3ada0543592b38",
+      "name": "Icon / list-collapse",
+      "description": "items, collapse, expand, details, disclosure, show, hide, toggle, accordion, more, less, fold, unfold",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53046": {
+      "key": "8307bcbc6834be99aff4bb53e0991246935cd9e8",
+      "name": "Icon / list-end",
+      "description": "queue, bottom, end, playlist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53045": {
+      "key": "c2ac2bed334eb0a566ea3eacce344e91ee1edca4",
+      "name": "Icon / list-filter-plus",
+      "description": "filter, plus, options, add",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53044": {
+      "key": "ff03ef9ab59ae952979200d1d397561767e1c59a",
+      "name": "Icon / list-minus",
+      "description": "playlist, remove, song, subtract, delete, unqueue",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53043": {
+      "key": "0bd04904d7d9cf041fedb4a4ba4c189b3f9c5070",
+      "name": "Icon / list-music",
+      "description": "playlist, queue, music, audio, playback",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53959": {
+      "key": "0edc77943fc03de471e94c9ca6245081abe7a908",
+      "name": "Icon / list-ordered",
+      "description": "number, order, queue",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53781": {
+      "key": "a86e81ae69f8fcff9165e33192d57b027fdff52e",
+      "name": "Icon / list-plus",
+      "description": "playlist, add, song, track, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53041": {
+      "key": "98930b2bda71e4b03fecb1f89901004a1535f5cd",
+      "name": "Icon / list-restart",
+      "description": "reset, refresh, reload, playlist, replay",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53968": {
+      "key": "3a820418b56c1e28f9bb0e1664502f3ae828b57c",
+      "name": "Icon / list-start",
+      "description": "queue, top, start, next, playlist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53159": {
+      "key": "90f691ea913a6b3b4214b6bfa3bffd636ebab2e3",
+      "name": "Icon / list-todo",
+      "description": "todo, done, check, tick, complete, tasks, items, pending",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54097": {
+      "key": "20dd097f9c72ecfdf8e3a6a5979d7cdaa4ecb939",
+      "name": "Icon / list-tree",
+      "description": "tree, browser",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53828": {
+      "key": "e36156951d1fde94b26bee1496c56eb73d4eba93",
+      "name": "Icon / list-video",
+      "description": "playlist, video, playback",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53040": {
+      "key": "a73870c4beb68e708881f6693e94605279d69e42",
+      "name": "Icon / list-x",
+      "description": "playlist, subtract, remove, delete, unqueue",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53038": {
+      "key": "c5120fadec7505ed3a0c86216339c5fbaa9016a4",
+      "name": "Icon / list",
+      "description": "options",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53712": {
+      "key": "3e45299358f10a6bf9bac7fe06586eac2bf743e6",
+      "name": "Icon / loader-circle",
+      "description": "loading, wait, busy, progress, spinner, spinning, throbber, circle",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53037": {
+      "key": "e0546ffa8029076acf5aaa6547b14a60b8b6d3e1",
+      "name": "Icon / loader-pinwheel",
+      "description": "loading, wait, busy, progress, throbber, spinner, spinning, beach ball, frozen, freeze",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53209": {
+      "key": "d3454901817af833972f57c4264c680a84801bc6",
+      "name": "Icon / locate-fixed",
+      "description": "map, gps, location, cross",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53036": {
+      "key": "809edcd6c463267dedd62e049871d4c14a37a09c",
+      "name": "Icon / locate-off",
+      "description": "map, gps, location, cross",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53035": {
+      "key": "768734479fb7961e4f6e0b6fdfaa56021d26bffd",
+      "name": "Icon / locate",
+      "description": "map, gps, location, cross",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53256": {
+      "key": "9effe64ef4e75f2a668c71226fec9817c2a2ffe5",
+      "name": "Icon / location-edit",
+      "description": "location, waypoint, marker, drop, edit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54024": {
+      "key": "67db1ceb909a0205a6a26dfce0dd8d1e7df2181f",
+      "name": "Icon / lock-keyhole-open",
+      "description": "security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53034": {
+      "key": "ce0834c66499d7d2c8444abf3bd39cbbdfb3b38d",
+      "name": "Icon / lock-keyhole",
+      "description": "security, password, secure, admin",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53033": {
+      "key": "bb8ce8ca601a749391cf9a216cbe2afcfb1546d7",
+      "name": "Icon / lock-open",
+      "description": "security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53032": {
+      "key": "41278464474e1d32a1098c0a9a9618ff3afb0e4a",
+      "name": "Icon / lock",
+      "description": "security, password, secure, admin",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54021": {
+      "key": "f1e93bdab6ebf3f3709cf1248a3c98ef4b9a4617",
+      "name": "Icon / log-in",
+      "description": "sign in, arrow, enter, auth",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53298": {
+      "key": "fceb2e3f8a14b910ad5fcb5c3f0d93e7ff6eb9f7",
+      "name": "Icon / logs",
+      "description": "options, list, menu, order, queue, tasks, logs",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53429": {
+      "key": "96bf657e3acd25411e5a93129dd0427d12f0dbed",
+      "name": "Icon / lollipop",
+      "description": "lolly, candy, sugar, food, sweet, dessert, spiral",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53407": {
+      "key": "b418541aad080d28a4e44e3c5b91231675be1caa",
+      "name": "Icon / luggage",
+      "description": "baggage, luggage, travel, suitcase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53895": {
+      "key": "3e3a1afa82f11ac87c8b49e9410bde446c072ded",
+      "name": "Icon / magnet",
+      "description": "horseshoe, lock, science, snap",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53665": {
+      "key": "9f4281274f76df52d9c304ac36b4d85da0617af8",
+      "name": "Icon / mail-check",
+      "description": "email, message, letter, subscribe, delivered, success, read, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53975": {
+      "key": "63253a9b49e3acc85c28f97544b8307f17a31d7b",
+      "name": "Icon / mail-minus",
+      "description": "email, message, letter, remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53339": {
+      "key": "3dc49588a47ff687e4390d6671ff03cecf434a7b",
+      "name": "Icon / mail-open",
+      "description": "email, message, letter, read",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53031": {
+      "key": "db13010f87c374e1ebc45b7a4249e5bbbc6d7c0e",
+      "name": "Icon / mail-plus",
+      "description": "email, message, letter, add, create, new, compose",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53929": {
+      "key": "0815f68e30eabde3df5aee597b3bff5094a0732c",
+      "name": "Icon / mail-question",
+      "description": "email, message, letter, delivery, undelivered",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53658": {
+      "key": "d1998ab6a41cacb853d249fceec9f4d41250addd",
+      "name": "Icon / mail-search",
+      "description": "email, message, letter, search, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53030": {
+      "key": "241a7e8a9122542fa273ca1d54f46ae2f33e9cd4",
+      "name": "Icon / mail-warning",
+      "description": "email, message, letter, delivery error, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53029": {
+      "key": "a986ec54755701c79d59e68c80287b00c1df9fca",
+      "name": "Icon / mail-x",
+      "description": "email, message, letter, remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53028": {
+      "key": "7768daa54591581781f9c81b1ae398b7f347bf5b",
+      "name": "Icon / mailbox",
+      "description": "emails, messages, letters, mailing list, newsletter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53027": {
+      "key": "f30d203e775f43b850e370f52176fdbb060a286d",
+      "name": "Icon / mails",
+      "description": "emails, messages, letters, multiple, mailing list, newsletter, copy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53024": {
+      "key": "0901a939273479333d005fdffe77ddeab792c179",
+      "name": "Icon / map-pin-check-inside",
+      "description": "location, waypoint, marker, drop, done, tick, complete, task, added",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53023": {
+      "key": "18d1decf09181497acd5bb5dc33d13bf02e40a0e",
+      "name": "Icon / map-pin-check",
+      "description": "location, waypoint, marker, drop, done, tick, complete, task, added",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53022": {
+      "key": "1edc2a9688c9c5a19853d788a5926395768df585",
+      "name": "Icon / map-pin-house",
+      "description": "location, waypoint, marker, drop, home, living, building, residence, architecture, address, poi, real estate, property, navigation, destination, geolocation, place, landmark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53021": {
+      "key": "fad72ee03c8494918ba2fc7251901b80fd9878df",
+      "name": "Icon / map-pin-minus-inside",
+      "description": "location, waypoint, marker, drop, delete, remove, erase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53548": {
+      "key": "fe49926d2c95b45fd0fe5b0517be98de10a7707d",
+      "name": "Icon / map-pin-minus",
+      "description": "location, waypoint, marker, drop, delete, remove, erase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53020": {
+      "key": "7010e31cdc8f10e75f916ffab2989af2459e4933",
+      "name": "Icon / map-pin-off",
+      "description": "location, waypoint, marker, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53019": {
+      "key": "4d590580db46fc309276346e9841260bbeee7539",
+      "name": "Icon / map-pin-plus-inside",
+      "description": "location, waypoint, marker, drop, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53247": {
+      "key": "691db314bd4162cb1076725c5435d020e0cb155f",
+      "name": "Icon / map-pin-plus",
+      "description": "location, waypoint, marker, drop, add, create, new",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53018": {
+      "key": "779dee8f5cbc5c0c8aee4c426a0f42abacdc85a1",
+      "name": "Icon / map-pin-x-inside",
+      "description": "location, waypoint, marker, drop, delete, remove, erase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53016": {
+      "key": "1ed17281e1746b9c4ad00694a57ef7cb0d31b564",
+      "name": "Icon / map-pin-x",
+      "description": "location, waypoint, marker, drop, delete, remove, erase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53015": {
+      "key": "5a5c2efdae4ba3979da2f035cd1f21437cf32d1e",
+      "name": "Icon / map-pin",
+      "description": "location, waypoint, marker, drop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53014": {
+      "key": "f509928ecffa61793b20af8a043c2c7bcefcecc4",
+      "name": "Icon / map-pinned",
+      "description": "location, waypoint, marker, drop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53013": {
+      "key": "f574d63f3c9966193de061df93f4228f7252dcc9",
+      "name": "Icon / map-plus",
+      "description": "location, navigation, travel, new, add, create",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53012": {
+      "key": "66e2a21735ba0e971a1774faa9166e0070714c07",
+      "name": "Icon / map",
+      "description": "location, navigation, travel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53011": {
+      "key": "070f80751b85bd5eadcaed126149ece2a2579783",
+      "name": "Icon / mars-stroke",
+      "description": "gender, androgyne, transgender",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53009": {
+      "key": "22d5c93be0170f8d473062437937a4039e207439",
+      "name": "Icon / mars",
+      "description": "gender, sex, male, masculine, man, boy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53790": {
+      "key": "2c7b771789db18ffb2c30d6a3326e371164e3f9b",
+      "name": "Icon / martini",
+      "description": "cocktail, alcohol, beverage, bar, drink, glass",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53008": {
+      "key": "a630853c5d92bd2c67982df6de1ce9a46a190d61",
+      "name": "Icon / maximize-2",
+      "description": "fullscreen, arrows, expand",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53006": {
+      "key": "5641451f31df6ff08848b49fdfab4990e583af1f",
+      "name": "Icon / maximize",
+      "description": "fullscreen, expand, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53004": {
+      "key": "e3102ec6e97cc1d01ae7830c487e825725b72319",
+      "name": "Icon / medal",
+      "description": "prize, sports, winner, trophy, award, achievement",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53850": {
+      "key": "7367ef2d1dc08f3eb0bd25f2c498d5cb9ae77d1b",
+      "name": "Icon / megaphone-off",
+      "description": "advertisement, attention, alert, notification, disable, silent",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53003": {
+      "key": "37f64db37838604c8c841fa8b8b7a885fded0656",
+      "name": "Icon / megaphone",
+      "description": "advertisement, attention, alert, notification",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53001": {
+      "key": "001d0ff60de5f4ee05f87dcb3b717f205c80413d",
+      "name": "Icon / meh",
+      "description": "emoji, face, neutral, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53229": {
+      "key": "ada024eb97c9c6b035cafb498f5cf54f3d373c32",
+      "name": "Icon / memory-stick",
+      "description": "ram, random access, technology, computer, chip, circuit, specs, capacity, gigabytes, gb",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53098": {
+      "key": "34b33bf32fce6a7c478b2b2933f978a1cedaf1b4",
+      "name": "Icon / menu",
+      "description": "bars, navigation, hamburger, options",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54101": {
+      "key": "9485c0c3e2fb2d80519479d83aee1a3d20a623f2",
+      "name": "Icon / merge",
+      "description": "combine, join, unite",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53000": {
+      "key": "0454eb5322147cf4b17c1b29381ef43c7755b89b",
+      "name": "Icon / message-circle-code",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, code review, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53321": {
+      "key": "61988f709d7d88ff1a587fbaa7f3dfbcab7dd0d5",
+      "name": "Icon / message-circle-dashed",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, draft",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53561": {
+      "key": "5acaa55856d2af77696327577cd86627a3f82813",
+      "name": "Icon / message-circle-heart",
+      "description": "comment, chat, conversation, dialog, feedback, positive, like, love, interest, valentine, dating, date, speech bubble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52999": {
+      "key": "760327f0fdee10aecec970c0cec7bd9b2d41ff55",
+      "name": "Icon / message-circle-more",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, typing, writing, responding, ellipsis, etc, et cetera, ..., \u2026",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53674": {
+      "key": "b81fef8daa526805593e036f34fbca55b2dff2f6",
+      "name": "Icon / message-circle-off",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, clear, close, delete, remove, cancel, silence, mute, moderate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52998": {
+      "key": "adf1f0a3a826031ea0bdb1db3a68d6d5bd847588",
+      "name": "Icon / message-circle-plus",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, add",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52996": {
+      "key": "e44298e16433823380d1d79f0f291ca1f28c49c4",
+      "name": "Icon / message-circle-question",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, help",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53352": {
+      "key": "cde824c7d071b183b232b0bfe6aa41774777dd98",
+      "name": "Icon / message-circle-reply",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, reply, response",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53132": {
+      "key": "60b8098e3dc19f42b9e8ed3d8b59c9b3e19e57c2",
+      "name": "Icon / message-circle-warning",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, report, abuse, offense, alert, danger, caution, protected, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53094": {
+      "key": "8b33760cabc7d4e6882a093390460aa845fe1f92",
+      "name": "Icon / message-circle-x",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, clear, close, delete, remove, cancel, silence, mute, moderate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52995": {
+      "key": "61fadbe2f322cb00d60baef87eaabd8c3da5129a",
+      "name": "Icon / message-circle",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52994": {
+      "key": "6e59633203d1dad8bdb7b1095b73008310848b6e",
+      "name": "Icon / message-square-code",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, code review, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52993": {
+      "key": "fd45facf7e56c7038671c9a571b672595d9667eb",
+      "name": "Icon / message-square-dashed",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, draft",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52991": {
+      "key": "c35ae07e39840f01a648ffae5a3f6a6d7122e9d0",
+      "name": "Icon / message-square-diff",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, add, patch, difference, plus, minus, plus-minus, math, code review, coding, version control, git",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52990": {
+      "key": "1190c2be77bf1ba3a82171a7f0d0567a55052882",
+      "name": "Icon / message-square-dot",
+      "description": "unread, unresolved, comment, chat, conversation, dialog, feedback, speech bubble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52989": {
+      "key": "670e6c805aa34f1f70b60777ebffe9457328034d",
+      "name": "Icon / message-square-heart",
+      "description": "comment, chat, conversation, dialog, feedback, positive, like, love, interest, valentine, dating, date, speech bubble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54122": {
+      "key": "5f84eb5d572b243ccceb8d5f563f3fb1fc352caa",
+      "name": "Icon / message-square-lock",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, secure, encrypted",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52987": {
+      "key": "0a412c8f4ad055173f60770642187ed32ad4e446",
+      "name": "Icon / message-square-more",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, typing, writing, responding, ellipsis, etc, et cetera, ..., \u2026",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52986": {
+      "key": "ca2b0ba3a3237413ca1877318602a8d01ac604f6",
+      "name": "Icon / message-square-off",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, clear, close, delete, remove, cancel, silence, mute, moderate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52983": {
+      "key": "81953f7187d5241ee7a4b4107505f3cb10a2529c",
+      "name": "Icon / message-square-plus",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, add",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52981": {
+      "key": "bdd2ef6f8e3587d1a874ee25890d0be0e7d6d6b9",
+      "name": "Icon / message-square-quote",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, blockquote, quotation, indent, reply, response",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52979": {
+      "key": "eeb9b9732c15f4ce1dc025ecf6d18f0f2f1765d3",
+      "name": "Icon / message-square-reply",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, reply, response",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53079": {
+      "key": "11aae3afc513f063e59d446b635564a0f6179e12",
+      "name": "Icon / message-square-share",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, network, forward",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53596": {
+      "key": "dd972e97fcf370dc7d55575afdd4f42822b78daa",
+      "name": "Icon / message-square-text",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53354": {
+      "key": "52ad2c485b41d4f72459ab91a7caea7e9321afde",
+      "name": "Icon / message-square-warning",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, report, abuse, offense, alert, danger, caution, protected, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52978": {
+      "key": "8499f0f92bf2bc0d51a6268fc026454854488416",
+      "name": "Icon / message-square-x",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble, clear, close, delete, remove, cancel, silence, mute, moderate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52976": {
+      "key": "ff81744ff1817aca0843aa194496106fece29ecd",
+      "name": "Icon / message-square",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubble",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54161": {
+      "key": "bfb34656a58321444776488b8032bb4d1cf6e829",
+      "name": "Icon / messages-square",
+      "description": "comment, chat, conversation, dialog, feedback, speech bubbles, copy, multiple",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52975": {
+      "key": "b9d917ba8b2c0cf3d371a895b2a208d1d0d15e04",
+      "name": "Icon / mic-off",
+      "description": "record, sound, mute, microphone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54094": {
+      "key": "87d9d0feebe01ec18a3838c71ad15fa6ea6e94ba",
+      "name": "Icon / mic-vocal",
+      "description": "lyrics, voice, listen, sound, music, radio, podcast, karaoke, singing, microphone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52973": {
+      "key": "9363bb2dff25a56d6f3a039356c4f26ac68ee55a",
+      "name": "Icon / mic",
+      "description": "record, sound, listen, radio, podcast, microphone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54110": {
+      "key": "667dfea5a0ed312f60fbb927699a4c35c54f04ea",
+      "name": "Icon / microchip",
+      "description": "processor, cores, technology, computer, chip, integrated circuit, memory, ram, specs, gpu, gigahertz, ghz",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52970": {
+      "key": "dcce9ab2fa0856fa3fd89077a0c38f0ecdfc1799",
+      "name": "Icon / microscope",
+      "description": "medical, education, science, imaging, research",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52969": {
+      "key": "06f76d7afc8bd64ef74423b38f8fb088304f6943",
+      "name": "Icon / microwave",
+      "description": "oven, cooker, toaster oven, bake",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52967": {
+      "key": "1e296d5cc13d1b66b7f864ac6029c95a65d1cfca",
+      "name": "Icon / milestone",
+      "description": "signpost, direction, right, east, forward, version control, waypoint",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53727": {
+      "key": "75a5c9367c357d8506a06162a7979f30547a146e",
+      "name": "Icon / milk-off",
+      "description": "lactose free, bottle, beverage, drink, water, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53635": {
+      "key": "47143f4da7994e92a0893fa075b8907705eabb17",
+      "name": "Icon / milk",
+      "description": "lactose, bottle, beverage, drink, water, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54080": {
+      "key": "f9a77274a96e4897c2477e5a71147ead04bf202b",
+      "name": "Icon / minimize-2",
+      "description": "exit fullscreen, arrows, close, shrink",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54160": {
+      "key": "c56080ceb66e6109b400046b5234e83da78d6a56",
+      "name": "Icon / minimize",
+      "description": "exit fullscreen, close, shrink",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53919": {
+      "key": "929553e2e430e5511c4860bafc77305bd7da52ed",
+      "name": "Icon / monitor-check",
+      "description": "tv, screen, display, desktop, running, active, virtual machine, vm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52966": {
+      "key": "6e089a90f3c461b66e4e7604ca34078da1d0a2f1",
+      "name": "Icon / monitor-cog",
+      "description": "tv, screen, display, virtual machine, vm, executable, settings, cog, edit, gear, configuration, preferences, system, control panel, network, computing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52965": {
+      "key": "aff94d917075da4cda1ce2c4ba6243be30f3554d",
+      "name": "Icon / monitor-dot",
+      "description": "tv, screen, display, desktop, running, active, virtual machine, vm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52963": {
+      "key": "66fda467198b364a856ea105a5e5b9de6af2fd58",
+      "name": "Icon / monitor-down",
+      "description": "tv, screen, display, desktop, download",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53856": {
+      "key": "8158d51f25ead318fa406a069d6dcbe42905c6ba",
+      "name": "Icon / monitor-off",
+      "description": "share",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52962": {
+      "key": "2a62b716702acfab2a201ae2364e595720722463",
+      "name": "Icon / monitor-pause",
+      "description": "tv, screen, display, desktop, video, movie, film, suspend, hibernate, boot, virtual machine, vm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52961": {
+      "key": "4b8c64d7a61a9240faf0ace07500b88a6b19f87b",
+      "name": "Icon / monitor-play",
+      "description": "tv, screen, display, desktop, video, movie, film, running, start, boot, virtual machine, vm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53739": {
+      "key": "cf9993f7897ff5a918fa5e555518740e6f63f1cc",
+      "name": "Icon / monitor-smartphone",
+      "description": "smartphone, phone, cellphone, device, mobile, desktop, monitor, responsive, screens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52958": {
+      "key": "0fee6237ba48d4753eac5175b2b409e6293427b3",
+      "name": "Icon / monitor-speaker",
+      "description": "devices, connect, cast",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52956": {
+      "key": "d4207d0fbb5de0f4d444f4104aec4cdc6851614d",
+      "name": "Icon / monitor-stop",
+      "description": "tv, screen, display, desktop, video, movie, film, stop, shutdown, virtual machine, vm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53757": {
+      "key": "ad791b4abdde1f639c34841287fee07c592fa3d1",
+      "name": "Icon / monitor-up",
+      "description": "tv, screen, display, upload, connect, remote, screen share",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52954": {
+      "key": "49663f93301d93b13e237783e5f0c6f7c37b73ef",
+      "name": "Icon / monitor-x",
+      "description": "tv, screen, display, desktop, virtual machine, vm, close, stop, suspend, remove, delete",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53365": {
+      "key": "4dbf5c423802fef723801f7e3a4c4d3653e31dfd",
+      "name": "Icon / monitor",
+      "description": "tv, screen, display, virtual machine, vm",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52953": {
+      "key": "62bfb1c142b743aa2d1a4e8fad8a3e660d7db6c0",
+      "name": "Icon / moon-star",
+      "description": "dark, night, star",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52951": {
+      "key": "b0c6bc47cf9a0009a6581a2aed02036a7e97e503",
+      "name": "Icon / moon",
+      "description": "dark, night",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53909": {
+      "key": "d2655645d9dcf236ab1227e37b1031ce78db214a",
+      "name": "Icon / mountain-snow",
+      "description": "alpine, climb, snow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52972": {
+      "key": "4530d556a0be9bb07dcf0d4c964ed5410a835cf8",
+      "name": "Icon / mountain",
+      "description": "climb, hike, rock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52950": {
+      "key": "9a79cc98aed9952beea88bc3492cecb2249e2ae0",
+      "name": "Icon / mouse-off",
+      "description": "device, scroll, click, disabled",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52947": {
+      "key": "2981025e4c0c4d437717803a56791b17e810cddc",
+      "name": "Icon / mouse-pointer-2",
+      "description": "click, select",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53973": {
+      "key": "01edc2d0a2ffae9415edce5083f4780c8ace846b",
+      "name": "Icon / mouse-pointer-ban",
+      "description": "wait, busy, loading, blocked, frozen, freeze",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52946": {
+      "key": "5eecb85f0153b84f9f906ba8a66e5a6f8a212ad6",
+      "name": "Icon / mouse-pointer-click",
+      "description": "click, select",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52943": {
+      "key": "f67616e0dd862fdd47a06e79227a681852f5d216",
+      "name": "Icon / mouse-pointer",
+      "description": "click, select",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52942": {
+      "key": "08032d0a421ee4d75fd6f87b0439e3452dc89feb",
+      "name": "Icon / mouse",
+      "description": "device, scroll, click",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52941": {
+      "key": "3a7c599f5d751419ef6aff28a5ec3ea8cccbb917",
+      "name": "Icon / move-3d",
+      "description": "arrows, axis, gizmo, coordinates, transform, translate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54005": {
+      "key": "8094a94abc41b744503a321a8cc3b9ea32fbd837",
+      "name": "Icon / move-diagonal-2",
+      "description": "double, arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53869": {
+      "key": "d40a38fc5f252da3aa6c82b83b2e72a3251629cd",
+      "name": "Icon / move-diagonal",
+      "description": "double, arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52940": {
+      "key": "d526928ba3944fa2c66e3b2a0a5c6d49df369edf",
+      "name": "Icon / move-down-left",
+      "description": "arrow, direction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53805": {
+      "key": "285e48f49a956a5495e78cf9552f0fbbba0fbb28",
+      "name": "Icon / move-down-right",
+      "description": "arrow, direction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52939": {
+      "key": "638f4a015c5685b9a2ef6c3a6113b94c13c3deb6",
+      "name": "Icon / move-down",
+      "description": "arrow, direction, downwards, south",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53042": {
+      "key": "690a4ee959b68d75a11aa71cbdc8eebef61cb807",
+      "name": "Icon / move-horizontal",
+      "description": "double, arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52938": {
+      "key": "c7faa5b1f9f3f196faadbb4b6addf05c51e16004",
+      "name": "Icon / move-left",
+      "description": "arrow, direction, back, west",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52937": {
+      "key": "1b26e6ed198a38e1accfdc02adf2e1700eda3d57",
+      "name": "Icon / move-right",
+      "description": "arrow, direction, trend flat, east",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53881": {
+      "key": "f4e0e4dde5bcd7ad690e2f7a0be1cca391a32b4a",
+      "name": "Icon / move-up-left",
+      "description": "arrow, direction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53760": {
+      "key": "237a5a92ffd8cd7efab846a1560b27d7209f7532",
+      "name": "Icon / move-up-right",
+      "description": "arrow, direction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53144": {
+      "key": "821fc43d69c15922e52bf714d73da50c75d86a99",
+      "name": "Icon / move-up",
+      "description": "arrow, direction, upwards, north",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52936": {
+      "key": "62c3226fe4a0a69a38942921744dd942f62b0f8c",
+      "name": "Icon / move-vertical",
+      "description": "double, arrow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52932": {
+      "key": "a2a54c3914f1dff25e85a2532d8e3c99d19aa5ff",
+      "name": "Icon / move",
+      "description": "arrows",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53156": {
+      "key": "7462968b3ff024a9fec2570be0547f717bb7c7ae",
+      "name": "Icon / music-2",
+      "description": "quaver, eighth note, note",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53849": {
+      "key": "7be1dffaf3da21ff8538a2824853dfb44c12ac04",
+      "name": "Icon / music-3",
+      "description": "crotchet, minim, quarter note, half note, note",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52930": {
+      "key": "e99910054a9fd5de699d30f82ae0da89699a4886",
+      "name": "Icon / music-4",
+      "description": "semiquaver, sixteenth note, note",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52928": {
+      "key": "7a9df20b7bba317bd7f1f6efa41a7ca1d53bef24",
+      "name": "Icon / music",
+      "description": "note, quaver, eighth note",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52926": {
+      "key": "4919882ef083c4cb8af61ca8ec93630531a92d93",
+      "name": "Icon / navigation-2-off",
+      "description": "location, travel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53493": {
+      "key": "d57755777afe8f58561d97c4c5874e28030ccad3",
+      "name": "Icon / navigation-2",
+      "description": "location, travel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52925": {
+      "key": "4af23ba834bda10902005b9dc16d268dd7dfacce",
+      "name": "Icon / navigation-off",
+      "description": "location, travel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53362": {
+      "key": "403e2231773e6c9826fa860543944b699c6d705e",
+      "name": "Icon / navigation",
+      "description": "location, travel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52922": {
+      "key": "8bc793d1c5fd0caa9888eb262fe8675fdd4be86e",
+      "name": "Icon / network",
+      "description": "tree",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52935": {
+      "key": "0709291f37fe3df8765de7b5dc984bc627d155fa",
+      "name": "Icon / newspaper",
+      "description": "news, feed, home, magazine, article, headline",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52921": {
+      "key": "8d98dd3a9cbb1df0d6dcfdfa0906309c50353f3f",
+      "name": "Icon / nfc",
+      "description": "contactless, payment, near-field communication",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53358": {
+      "key": "6ec676e1ce16a32f0ebd4c8a709e429ba9ecafcf",
+      "name": "Icon / non-binary",
+      "description": "gender, nonbinary, enby",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52919": {
+      "key": "f92bd27b7c40d45d1b52163af02fbc123104ec6a",
+      "name": "Icon / notebook-pen",
+      "description": "pencil, notepad, notes, noted, stationery, sketchbook, organizer, organiser, planner, diary, journal, writing, write, written, reading, high school, university, college, academy, student, study, research, homework, eraser, rubber",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52918": {
+      "key": "c3bd73d9d79bd8c0b9cd94407b1fab7e34693bd6",
+      "name": "Icon / notebook-tabs",
+      "description": "notepad, notes, people, family, friends, acquaintances, contacts, details, addresses, phone numbers, directory, listing, networking, alphabetical, a-z, organizer, organiser, planner, diary, stationery",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52917": {
+      "key": "e314018874be780a1d50869fd28afc4d654ffdce",
+      "name": "Icon / notebook-text",
+      "description": "notepad, notes, pages, paper, stationery, sketchbook, organizer, organiser, planner, diary, journal, writing, write, written, reading, high school, university, college, academy, student, study, research, homework, lines, opened",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52916": {
+      "key": "98fdf880918321b2d957748c664deb701bec4271",
+      "name": "Icon / notebook",
+      "description": "notepad, notes, stationery, sketchbook, moleskine, closure, strap, band, elastic, organizer, organiser, planner, diary, journal, writing, written, writer, reading, high school, university, college, academy, student, study, homework, research",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53950": {
+      "key": "b27b939c3bd7bde45669052d1bb2f86090a249b6",
+      "name": "Icon / notepad-text-dashed",
+      "description": "notebook, notes, pages, paper, stationery, diary, journal, writing, write, written, draft, template, lines",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52914": {
+      "key": "aa4e64ef1a210664f13355666bc15a708810108a",
+      "name": "Icon / notepad-text",
+      "description": "notebook, notes, pages, paper, stationery, sketchbook, organizer, organiser, planner, diary, journal, writing, write, written, reading, high school, university, college, academy, student, study, homework, research, lines, opened",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52912": {
+      "key": "7423eeed9e242b727462a92da4401cc1a99744bc",
+      "name": "Icon / nut-off",
+      "description": "hazelnut, acorn, food, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52911": {
+      "key": "0d712211b593556abf341508caf884c16c543c0c",
+      "name": "Icon / nut",
+      "description": "hazelnut, acorn, food, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53261": {
+      "key": "f442f76bede02ac83ef2918488b5804b32931fd9",
+      "name": "Icon / octagon-alert",
+      "description": "warning, alert, danger, exclamation mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52910": {
+      "key": "e7f9962d716c5cf13325c7a28c99b716b2490689",
+      "name": "Icon / octagon-minus",
+      "description": "stop, forbidden, subtract, remove, decrease, reduce, -, traffic, halt, restricted",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52909": {
+      "key": "03fff3749259c7f24b1ca6aa2f14935bbe4aa912",
+      "name": "Icon / octagon-pause",
+      "description": "music, audio, stop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53093": {
+      "key": "550e7744a0cf1d4fcb7b094adac3584edde5785b",
+      "name": "Icon / octagon-x",
+      "description": "delete, stop, alert, warning, times, clear, math",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53719": {
+      "key": "cb9e64136afbf06aac4ee713e2f5853d18e5150a",
+      "name": "Icon / octagon",
+      "description": "stop, shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53818": {
+      "key": "35fbfac36ccaf6796f9e73c6c92d036f4b570336",
+      "name": "Icon / omega",
+      "description": "greek, symbol, mathematics, education, physics, engineering, ohms, electrical resistance, angular frequency, dynamical systems, astronomy, constellations, philosophy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52908": {
+      "key": "920d85e884d436e92c43cafeb053c20b93fcef0e",
+      "name": "Icon / option",
+      "description": "keyboard, key, mac, alt, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52907": {
+      "key": "d22ba8ad7497378233e45ae902046a03438002f7",
+      "name": "Icon / orbit",
+      "description": "planet, space, physics, satellites, moons",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54053": {
+      "key": "e8139309f1cb4c0c72a240321a23a64636f16bc8",
+      "name": "Icon / origami",
+      "description": "paper, bird",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52906": {
+      "key": "1d5ff4e2ba282d45c9cbee1a13fb7c0e82c1655d",
+      "name": "Icon / package-2",
+      "description": "box, container, storage, sealed, packed, unopened, undelivered, archive, zip",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52905": {
+      "key": "97374a58ba6883e01512f68d2d6e1e30c83f915d",
+      "name": "Icon / package-check",
+      "description": "confirm, verified, done, todo, tick, complete, task, delivered",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53002": {
+      "key": "242f793918a951b5b1a743dc65b71d935351806d",
+      "name": "Icon / package-minus",
+      "description": "delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52904": {
+      "key": "b0e26f9f3690e99e90340bef65f0c3bebfe64c7f",
+      "name": "Icon / package-open",
+      "description": "box, container, storage, unpack, unarchive, unzip, opened, delivered",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52903": {
+      "key": "01bef7d886c38a6dbc019080cbad30137cb1f6b2",
+      "name": "Icon / package-plus",
+      "description": "new, add, create",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52901": {
+      "key": "221bc0787f96e2c2d23ffc1265a9b2237dc736cf",
+      "name": "Icon / package-search",
+      "description": "find, product process, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52900": {
+      "key": "d9b64b84699c3cad0afaa5c6255d2c0b1a369cd6",
+      "name": "Icon / package-x",
+      "description": "delete, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52897": {
+      "key": "055e4fd0450c5f85ddbd0eabe785b67de68e0b27",
+      "name": "Icon / package",
+      "description": "box, container, storage, sealed, delivery, undelivered, unopened, packed, archive, zip, module",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52896": {
+      "key": "af7c1ef165adb1eb8cbc058617027c9936c96dbf",
+      "name": "Icon / paint-bucket",
+      "description": "fill, paint, bucket, color, colour",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52895": {
+      "key": "4b9135517a833b165d5f65c3efc5946a81fc41fb",
+      "name": "Icon / paint-roller",
+      "description": "brush, color, colour, decoration, diy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52893": {
+      "key": "7401cae27e015926f8827f8030d5646fa7acbb86",
+      "name": "Icon / paintbrush-vertical",
+      "description": "brush, paintbrush, design, color, colour, decoration, diy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52960": {
+      "key": "f380de5843740c31eb265fabcefdf53a2459820a",
+      "name": "Icon / paintbrush",
+      "description": "brush, paintbrush, design, color, colour, decoration, diy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53233": {
+      "key": "ce74f59142ea6137e2afb5a238fce1889e3a5070",
+      "name": "Icon / palette",
+      "description": "colors, colours, theme, scheme, paint, watercolor, watercolour, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52892": {
+      "key": "a4d054c4111de4a8af3decfe35d8f0fe4200db73",
+      "name": "Icon / panda",
+      "description": "animal, wildlife, bear, zoo, bamboo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53785": {
+      "key": "4a9e3058a767da6ddf31eae995996da13fdb9949",
+      "name": "Icon / panel-bottom-close",
+      "description": "drawer, dock, hide, chevron, down",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54038": {
+      "key": "d311f073e03975a9a5c169ebd63d5495e6abfde5",
+      "name": "Icon / panel-bottom-dashed",
+      "description": "drawer, dock, show, reveal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53076": {
+      "key": "c21174ed62ca9dac48f7c0a4a8e015a05fb1e4f9",
+      "name": "Icon / panel-bottom-open",
+      "description": "drawer, dock, show, reveal, chevron, up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53480": {
+      "key": "c8f630498137bcaeea5adbb76b513ce7092fff97",
+      "name": "Icon / panel-bottom",
+      "description": "drawer, dock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52890": {
+      "key": "58e6f9023cc9f6485f497d8c44a6fc3c7f4b2252",
+      "name": "Icon / panel-left-dashed",
+      "description": "sidebar, primary, drawer, show, reveal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52889": {
+      "key": "9dac2bc4ccc972ff1eb9f2e13d6317d68a6a5fd1",
+      "name": "Icon / panel-right-close",
+      "description": "sidebar, secondary, drawer, hide, chevron, >",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53892": {
+      "key": "582ac5d37ba21123353ae6db958ad553a05342b2",
+      "name": "Icon / panel-right-dashed",
+      "description": "sidebar, secondary, drawer, show, reveal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52886": {
+      "key": "f887c07e16897947e34e1123bd7770a53c57760d",
+      "name": "Icon / panel-right-open",
+      "description": "sidebar, secondary, drawer, show, reveal, chevron, left, <",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53699": {
+      "key": "d49fbb44bc72caadae297ed5c3cceeb3a6393b63",
+      "name": "Icon / panel-right",
+      "description": "sidebar, secondary, drawer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52885": {
+      "key": "694abadf584d4b4c6b2bafc9c31bf6f31ad15f24",
+      "name": "Icon / panel-top-close",
+      "description": "menu bar, drawer, hide, chevron, up",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52883": {
+      "key": "b9d0c0ea46c2cbff6c351eda9ce9c41bf8fc1748",
+      "name": "Icon / panel-top-dashed",
+      "description": "menu bar, drawer, show, reveal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52881": {
+      "key": "4bd1bade6400a874009ff3ab67729bfbb852dfca",
+      "name": "Icon / panel-top-open",
+      "description": "menu bar, drawer, show, reveal, chevron, down",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52880": {
+      "key": "a68128159607781796804705993dcb5527453d5e",
+      "name": "Icon / panel-top",
+      "description": "drawer, browser, webpage",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53454": {
+      "key": "e642ae42ad3a93ebeec39528d1c7839b3a768c6c",
+      "name": "Icon / panels-left-bottom",
+      "description": "drawers, sidebar, primary",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54069": {
+      "key": "c582cd921358ad1c21c7abddfc0817fcb088eed9",
+      "name": "Icon / panels-right-bottom",
+      "description": "drawers, sidebar, secondary",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52879": {
+      "key": "92081ff558b264c837703d330e5237569a99e169",
+      "name": "Icon / panels-top-left",
+      "description": "menu bar, sidebar, primary, drawers, window, webpage, projects, overview",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53606": {
+      "key": "7562f1b0929f50c5d619cee79bad78103305229c",
+      "name": "Icon / paperclip",
+      "description": "attachment, file",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53769": {
+      "key": "248d6f295ae54a1c115321f4ccd1715e09f239a4",
+      "name": "Icon / parentheses",
+      "description": "code, token, parenthesis, parens, brackets, parameters, arguments, args, input, call, math, formula, function, (, )",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52878": {
+      "key": "41d23cf89bf975a4af3403940410eb57c2c4aea4",
+      "name": "Icon / parking-meter",
+      "description": "driving, car park, pay, sidewalk, pavement",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52877": {
+      "key": "2879095e8cd7d1401351e26913835cee5ae91a99",
+      "name": "Icon / party-popper",
+      "description": "emoji, congratulations, celebration, party, tada, \ud83c\udf89, \ud83c\udf8a, excitement, exciting, excites, confetti",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52876": {
+      "key": "35f1ef99e22cd68d652d01561a0f0762cf651737",
+      "name": "Icon / pause",
+      "description": "music, stop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53632": {
+      "key": "ca5520659f94bc39f06c74f6441eef1c24285d7e",
+      "name": "Icon / paw-print",
+      "description": "pets, vets, veterinarian, domesticated, cat, dog, bear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52874": {
+      "key": "ca124d9fdf1f675d9e5e819c580f612123fe5b8a",
+      "name": "Icon / pc-case",
+      "description": "computer, chassis",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52873": {
+      "key": "6a4dcaf5a90c09c19b0d488a910159e6e79c4758",
+      "name": "Icon / pen-line",
+      "description": "pencil, change, create, draw, writer, writing, biro, ink, marker, felt tip, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54059": {
+      "key": "9999736654de8f793c0fe41d973355dbbb503aab",
+      "name": "Icon / pen-off",
+      "description": "disabled, inactive, non-editable, locked, read-only, unmodifiable, frozen, restricted, pencil, change, create, draw, writer, writing, biro, ink, marker, felt tip, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52985": {
+      "key": "5b41a0f3e72b7bcda6e4068520e4aaa1e1ee5a3d",
+      "name": "Icon / pen-tool",
+      "description": "vector, drawing, path",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52871": {
+      "key": "d9e62b415812d14a65c4846bca5ea04db58e8d5e",
+      "name": "Icon / pen",
+      "description": "pencil, change, create, draw, writer, writing, biro, ink, marker, felt tip, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53638": {
+      "key": "0dda814cca0836595dc951e80c463e489562d7ab",
+      "name": "Icon / pencil-line",
+      "description": "pencil, change, create, draw, sketch, draft, writer, writing, biro, ink, marker, felt tip, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52869": {
+      "key": "f838826ae4088da80470b763922563803a8c00b5",
+      "name": "Icon / pencil-off",
+      "description": "disabled, inactive, non-editable, locked, read-only, unmodifiable, frozen, restricted, rubber, edit, create, draw, sketch, draft, writer, writing, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53832": {
+      "key": "be4923e808f565e57baf1e2ef22ddcd8eb5c0a89",
+      "name": "Icon / pencil-ruler",
+      "description": "edit, create, draw, sketch, draft, writer, writing, stationery, artist, measurements, centimeters, cm, millimeters, mm, metre, foot, feet, inches, units, size, length, width, height, dimensions, depth, breadth, extent",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53065": {
+      "key": "94b008300dbe09ffcdd164c166e4d44f10c0459c",
+      "name": "Icon / pentagon",
+      "description": "shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54088": {
+      "key": "e04265e5d1b8820b7c614d1b81180d5488e16b05",
+      "name": "Icon / percent",
+      "description": "percentage, modulo, modulus, remainder, %, sale, discount, offer, marketing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53090": {
+      "key": "5ef437077426a22fee8a63e7d325a998195bd923",
+      "name": "Icon / person-standing",
+      "description": "people, human, accessibility, stick figure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53377": {
+      "key": "36a0aa8e1b82c179d76edf69423bf10227fd59e9",
+      "name": "Icon / philippine-peso",
+      "description": "currency, peso, money, php",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52868": {
+      "key": "5619a8ad933cf98eb089ab629bc346df68e6d216",
+      "name": "Icon / phone-call",
+      "description": "ring",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52866": {
+      "key": "82cebf7b7ee295fedfbe991d266aba6a95f365d7",
+      "name": "Icon / phone-forwarded",
+      "description": "call",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53749": {
+      "key": "21339f80ca55bba64effdc03309b8add9775be0c",
+      "name": "Icon / phone-incoming",
+      "description": "call",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52865": {
+      "key": "f2dd4d9d18bf32c428e5fbf8c910e81e4c1ee4b0",
+      "name": "Icon / phone-missed",
+      "description": "call",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52864": {
+      "key": "6c434dc4169b61a941a7706a177af7a793b3c4d7",
+      "name": "Icon / phone-off",
+      "description": "call, mute",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52863": {
+      "key": "8dfc548fcc4e90bec220131fdf1a5eae07ae60c3",
+      "name": "Icon / phone-outgoing",
+      "description": "call",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53669": {
+      "key": "6aaa9e88b9ea7bda34040a351e6554e656e6bf71",
+      "name": "Icon / phone",
+      "description": "call",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53619": {
+      "key": "d1a225e874eba3b1705a8234fa84d3d9f451e7b1",
+      "name": "Icon / pi",
+      "description": "constant, code, coding, programming, symbol, trigonometry, geometry, formula",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53962": {
+      "key": "6b97ed6426adeca5cf41192f384b38194f8f0e03",
+      "name": "Icon / piano",
+      "description": "music, audio, sound, noise, notes, chord, keys, octave, acoustic, instrument, play, pianist, performance, concert",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53228": {
+      "key": "d4f62d024c421ee6a7951b11f34c912fd89f26fc",
+      "name": "Icon / pickaxe",
+      "description": "mining, mine, land worker, extraction, labor, construction, progress, advancement, crafting, building, creation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52862": {
+      "key": "abcbe3fb13caf7f1781507c023aa2df194c56466",
+      "name": "Icon / picture-in-picture-2",
+      "description": "display, play, video, pop out, always on top, window, inset, multitask",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53537": {
+      "key": "a595a937137efa50e453221ededc5f90f478a754",
+      "name": "Icon / picture-in-picture",
+      "description": "display, play, video, pop out, always on top, window, inset, multitask",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52875": {
+      "key": "6101507c3d6d8b4e380cfc0b6a7003bedb00ff1f",
+      "name": "Icon / piggy-bank",
+      "description": "money, savings",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52861": {
+      "key": "dc6f652b6af77a7cadd4947687720a1c2e913a3f",
+      "name": "Icon / pilcrow-left",
+      "description": "direction, paragraph, mark, paraph, blind, typography, type, text, prose, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52915": {
+      "key": "ce73cca859291352c538f8c7768d2638604c3b05",
+      "name": "Icon / pilcrow-right",
+      "description": "direction, paragraph, mark, paraph, blind, typography, type, text, prose, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53116": {
+      "key": "e5329ce529fc3e78f0b4ca95bc248e64b6cef8d9",
+      "name": "Icon / pilcrow",
+      "description": "paragraph, mark, paraph, blind, typography, type, text, prose, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53801": {
+      "key": "f7ac2e4aa2f22201e1f7d92a728746c32746277e",
+      "name": "Icon / pill-bottle",
+      "description": "medicine, medication, prescription, drug, supplement, vitamin, capsule, jar, container, healthcare, pharmaceutical, tablet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52860": {
+      "key": "971d2748c1044a24debc791a22475ef9ab539c8f",
+      "name": "Icon / pill",
+      "description": "medicine, medication, drug, prescription, tablet, pharmacy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53904": {
+      "key": "c3b7b3ebcc2597c05ba72d63ab6d12cca809480f",
+      "name": "Icon / pin-off",
+      "description": "unpin, map, unlock, unfix, unsave, remove",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52859": {
+      "key": "dc69dfa492a56550c0d7d51b439f53c000629a4b",
+      "name": "Icon / pin",
+      "description": "save, map, lock, fix",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52899": {
+      "key": "7d5d81d045b277302c6d732214f32a38faf97f9f",
+      "name": "Icon / pipette",
+      "description": "eye dropper, color picker, lab, chemistry",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53052": {
+      "key": "11b6b723d05b81a807631a5b50727a7f080b1450",
+      "name": "Icon / pizza",
+      "description": "pie, quiche, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53389": {
+      "key": "52e96e84e248c45f73de10f0f56dc025b68d0b62",
+      "name": "Icon / plane-landing",
+      "description": "arrival, plane, trip, airplane, landing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52858": {
+      "key": "d54d021da28d5deab0c68cee3e01118e65eb4e96",
+      "name": "Icon / plane-takeoff",
+      "description": "departure, plane, trip, airplane, takeoff",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52857": {
+      "key": "a051262b1321b31eb81414ebdaceae09778d9eb6",
+      "name": "Icon / plane",
+      "description": "plane, trip, airplane",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53333": {
+      "key": "615493c3aad62e5787ed695ba30eb87a36ff9467",
+      "name": "Icon / play",
+      "description": "music, audio, video, start, run",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52856": {
+      "key": "e261280acbf064850e4fd0406ab292e4a50fcd11",
+      "name": "Icon / plug-2",
+      "description": "electricity, energy, socket, outlet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52855": {
+      "key": "61a4b128cea4d32b2b87ae2d6f95aad084d16eb2",
+      "name": "Icon / plug-zap",
+      "description": "electricity, energy, electronics, charge, charging, battery, connect",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53060": {
+      "key": "488c5a4ef7bfee886e72f45f9d9fa2763203770b",
+      "name": "Icon / plug",
+      "description": "electricity, energy, electronics, socket, outlet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53162": {
+      "key": "db0aaf4d7754c557d2e4cf11b89a3a72bb3c47e0",
+      "name": "Icon / pocket-knife",
+      "description": "swiss army knife, penknife, multi-tool, multitask, blade, cutter, gadget, corkscrew",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52853": {
+      "key": "6422448c9a6e0e6a06f922b89dbf7a65b6876556",
+      "name": "Icon / pocket",
+      "description": "logo, save",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52852": {
+      "key": "0759e091179e4d336ca8cf85070bd490f70ca8f3",
+      "name": "Icon / podcast",
+      "description": "audio, music, mic, talk, voice, subscribe, subscription, stream",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53253": {
+      "key": "3d896a95e048ac447206d04ecfa8c63738162243",
+      "name": "Icon / pointer-off",
+      "description": "mouse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53165": {
+      "key": "d5100fa4908b81a4f2c1b4f7a31b630c18c6479e",
+      "name": "Icon / pointer",
+      "description": "mouse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53057": {
+      "key": "a925c3e89b9ec834a02edf7ec018b87ad0962a5d",
+      "name": "Icon / popcorn",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53998": {
+      "key": "25555a97b6b462542dda4889e0fda13e39afc27d",
+      "name": "Icon / popsicle",
+      "description": "ice lolly, ice cream, sweet, food",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53907": {
+      "key": "6926764600d23df85f12976a0017ca1c77ddc697",
+      "name": "Icon / pound-sterling",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54079": {
+      "key": "9d3e4425a5146c1d5ae8666153696c4eb8166ee3",
+      "name": "Icon / power-off",
+      "description": "on, off, device, switch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52851": {
+      "key": "91f07a2e55cf3601f145364fc42cd52c89a1d96d",
+      "name": "Icon / power",
+      "description": "on, off, device, switch, toggle, binary, boolean, reboot, restart, button, keyboard, troubleshoot",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53626": {
+      "key": "22906b61b9dee26ed0e7fa48beeb126ab96d77f6",
+      "name": "Icon / presentation",
+      "description": "screen, whiteboard, marker pens, markers, blackboard, chalk, easel, school, learning, lesson, office, meeting, project, planning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53212": {
+      "key": "f0cd266f5b036df787d561d2a1158d44ad48fb3c",
+      "name": "Icon / printer-check",
+      "description": "fax, office, device, success, printed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53089": {
+      "key": "13f5a1955a1472ed90c795287737e7c519529108",
+      "name": "Icon / printer",
+      "description": "fax, office, device",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52849": {
+      "key": "b82329b1173541b503a2d3ea29921e5d5d9e877e",
+      "name": "Icon / projector",
+      "description": "cinema, film, movie, home video, presentation, slideshow, office, meeting, project, planning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52848": {
+      "key": "56fca6b107376948d0a82b207fd0185104f3dfd8",
+      "name": "Icon / proportions",
+      "description": "screens, sizes, rotate, rotation, adjust, aspect ratio, 16:9, widescreen, 4:3, resolution, responsive, mobile, desktop, dimensions, monitor, orientation, portrait, landscape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52847": {
+      "key": "49879aac15a7a5d2c6ba3a87d666313409cec38f",
+      "name": "Icon / puzzle",
+      "description": "component, module, part, piece",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53690": {
+      "key": "ef3a7fda413f1ce9dd1cf6af9cf81d56b3205b22",
+      "name": "Icon / pyramid",
+      "description": "prism, triangle, triangular, hierarchy, structure, geometry, ancient, egyptian, landmark, tourism",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52846": {
+      "key": "d5fe7668e24869b261cba584d8e4ef72c958a6aa",
+      "name": "Icon / qr-code",
+      "description": "barcode, scan, link, url, information, digital",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52898": {
+      "key": "388623df22b85b378dee5e98a382ebc50ec350fb",
+      "name": "Icon / quote",
+      "description": "quotation",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53473": {
+      "key": "beac7ce9bb37f994e8b4bc4f5fca445924d7a72c",
+      "name": "Icon / rabbit",
+      "description": "animal, rodent, pet, pest, bunny, hare, fast, speed, hop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52844": {
+      "key": "c10e062f1e8c49fecdfa027857c192bd263451c5",
+      "name": "Icon / radar",
+      "description": "scan, sonar, detect, find, locate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52843": {
+      "key": "6852fd643c4e8eba1a2a4db07cac195bbc819f00",
+      "name": "Icon / radiation",
+      "description": "radioactive, nuclear, fallout, waste, atomic, physics, particle, element, molecule",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52982": {
+      "key": "885808997645709ffeaa60300088029be37ad7a8",
+      "name": "Icon / radical",
+      "description": "calculate, formula, math, operator, root, square, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53432": {
+      "key": "ab7fc5e7a56ca6de9f6c53ee4bf80be44c3098d4",
+      "name": "Icon / radio-receiver",
+      "description": "device, music, connect",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53764": {
+      "key": "4d8dd3e24b8976527aa834b5f0722311d4605f34",
+      "name": "Icon / radio-tower",
+      "description": "signal, broadcast, connectivity, live, frequency",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52842": {
+      "key": "6af52bb65d41310e7b63305d2efcd546e255cdf9",
+      "name": "Icon / radio",
+      "description": "signal, broadcast, connectivity, live, frequency",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53780": {
+      "key": "1cd466d8eff0147aa01de1dd11b32a3722fc5116",
+      "name": "Icon / radius",
+      "description": "shape, circle, geometry, trigonometry, radii, calculate, measure, size",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53184": {
+      "key": "26b7ecba5a166b42f8af05713ff6beeded9eda48",
+      "name": "Icon / rail-symbol",
+      "description": "railway, train, track, line",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52841": {
+      "key": "9751b39b093da47022ce1a9b890be2e80669117c",
+      "name": "Icon / rainbow",
+      "description": "colors, colours, spectrum, light, prism, arc, clear, sunshine",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52840": {
+      "key": "cdd6b2a230b166e1b31e8766e0030b0d3623c6a9",
+      "name": "Icon / rat",
+      "description": "mouse, mice, gerbil, rodent, pet, pest, plague, disease",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53835": {
+      "key": "074ba81d7edcbc8d96f468ebea520c9a7f0e7041",
+      "name": "Icon / ratio",
+      "description": "screens, sizes, rotate, rotation, adjust, aspect ratio, proportions, 16:9, widescreen, 4:3, resolution, responsive, mobile, desktop, dimensions, monitor, orientation, portrait, landscape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52839": {
+      "key": "5d6628464bf65808a5b9119cc09c803079545c0e",
+      "name": "Icon / receipt-cent",
+      "description": "bill, voucher, slip, check, counterfoil, currency, cents, dollar, usd, $, \u00a2",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52838": {
+      "key": "6ab64c5bdf7bee949e3fab370a0dc47559183149",
+      "name": "Icon / receipt-euro",
+      "description": "bill, voucher, slip, check, counterfoil, currency, \u20ac",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52836": {
+      "key": "5ff5adc4e136a4a73bb35139faef1fdd13c00c15",
+      "name": "Icon / receipt-indian-rupee",
+      "description": "bill, voucher, slip, check, counterfoil, currency, inr, \u20b9",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53096": {
+      "key": "45f9567a9f245de1a1ed47094c48dc7977af0d4c",
+      "name": "Icon / receipt-japanese-yen",
+      "description": "bill, voucher, slip, check, counterfoil, currency, jpy, \u00a5",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53604": {
+      "key": "c0f8eff740c090a81d9cf95d6a9ac69a6032a185",
+      "name": "Icon / receipt-pound-sterling",
+      "description": "bill, voucher, slip, check, counterfoil, british, currency, gbp, \u00a3",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53558": {
+      "key": "dc9e7661cf890c0ce844b08f544f8b9cc9091c1c",
+      "name": "Icon / receipt-russian-ruble",
+      "description": "bill, voucher, slip, check, counterfoil, currency, rub, \u20bd",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52837": {
+      "key": "052cb3396e80eea5b617929dfa078f802ded10ca",
+      "name": "Icon / receipt-swiss-franc",
+      "description": "bill, voucher, slip, check, counterfoil, currency, chf, \u20a3",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54105": {
+      "key": "112d375e6ba5fa3549e7a1f80550a3187cce8c15",
+      "name": "Icon / receipt-text",
+      "description": "bill, voucher, slip, check, counterfoil, details, small print, terms, conditions, contract",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52835": {
+      "key": "5b91dc9e81cb3853924ef2e8d81a672e7feb1434",
+      "name": "Icon / receipt",
+      "description": "bill, voucher, slip, check, counterfoil, currency, dollar, usd, $",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52834": {
+      "key": "55ebdaa88730b23107f23a10deac920c37345262",
+      "name": "Icon / rectangle-ellipsis",
+      "description": "login, password, authenticate, 2fa, field, fill, ellipsis, et cetera, etc, loader, loading, progress, pending, throbber, menu, options, operator, code, spread, rest, more, further, extra, overflow, dots, \u2026, ...",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53872": {
+      "key": "d7fee967ac21473a587c776168c28243cf173073",
+      "name": "Icon / rectangle-goggles",
+      "description": "vr, virtual, augmented, reality, headset, goggles",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53186": {
+      "key": "3cd6cd489d6ec7fcb01e92fbda9b6868fccba2ef",
+      "name": "Icon / rectangle-horizontal",
+      "description": "rectangle, aspect ratio, 16:9, horizontal, shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54012": {
+      "key": "b50e91b3a254c6da78b0b7a78c66bba0521339f7",
+      "name": "Icon / rectangle-vertical",
+      "description": "rectangle, aspect ratio, 9:16, vertical, shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53886": {
+      "key": "d5e2a182db50009c05ee754e90423cbbe230ae0a",
+      "name": "Icon / recycle",
+      "description": "sustainability, salvage, arrows",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53517": {
+      "key": "af04bfe9361a07feaa1d47453531210ce3d02893",
+      "name": "Icon / redo-2",
+      "description": "undo, rerun, history",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53778": {
+      "key": "44ee190878aa11a86fbf1c928c53bb27de7833f6",
+      "name": "Icon / redo-dot",
+      "description": "redo, history, step, over, forward",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52832": {
+      "key": "fcd0a2f1741f06d57d811e6830461d65ab5fc367",
+      "name": "Icon / redo",
+      "description": "undo, rerun, history",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52831": {
+      "key": "168a2758889620c42357015aabb117b48695183b",
+      "name": "Icon / refresh-ccw-dot",
+      "description": "arrows, rotate, reload, synchronise, synchronize, circular, cycle, issue, code, coding, version control",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52830": {
+      "key": "626ca53b56c377d4d77c5b11506fb8799dbe18ec",
+      "name": "Icon / refresh-ccw",
+      "description": "arrows, rotate, reload, rerun, synchronise, synchronize, circular, cycle",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52829": {
+      "key": "341f00d6d2f3b8a2dc57ec9f31d4c105fbf50eb7",
+      "name": "Icon / refresh-cw-off",
+      "description": "rotate, reload, rerun, synchronise, synchronize, arrows, circular, cycle, cancel, no, stop, error, disconnect, ignore",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52828": {
+      "key": "0878f253d8bfdf9d43213e463c21bd390416b7c6",
+      "name": "Icon / refresh-cw",
+      "description": "rotate, reload, rerun, synchronise, synchronize, arrows, circular, cycle",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53448": {
+      "key": "10c890fa392eb4be85d2abab5acc6132f25a2519",
+      "name": "Icon / refrigerator",
+      "description": "frigerator, fridge, freezer, cooler, icebox, chiller, cold storage",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53830": {
+      "key": "f3067befa19e1cc0f01bec7a40f540231f67dceb",
+      "name": "Icon / regex",
+      "description": "search, text, code",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52827": {
+      "key": "657bb07403684a8c3813a48d8828ef85dc3f8d51",
+      "name": "Icon / remove-formatting",
+      "description": "text, font, typography, format, x, remove, delete, times, clear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52826": {
+      "key": "f26f8aa8e290c91f2c4d75a8ddde2a0bc07e3656",
+      "name": "Icon / repeat-1",
+      "description": "replay",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52825": {
+      "key": "48e4ff1d39b74da7dd1a447e293e365669dcd7a9",
+      "name": "Icon / repeat-2",
+      "description": "arrows, retweet, repost, share, repeat, loop",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53751": {
+      "key": "331e69e258c78cceb46c2e4eb4bdccecbdbbcd53",
+      "name": "Icon / repeat",
+      "description": "loop, arrows",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52824": {
+      "key": "362afd98c9ce27dd656d088516c57d1aad75de2e",
+      "name": "Icon / replace-all",
+      "description": "search, substitute, swap, change",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52823": {
+      "key": "d660b9fb35828089379610d7440a287824323156",
+      "name": "Icon / replace",
+      "description": "search, substitute, swap, change",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52822": {
+      "key": "9655448765e9699cb5a9426dac867d4a20110aa1",
+      "name": "Icon / reply-all",
+      "description": "email",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52821": {
+      "key": "2034eaf01f12ff7748bd47bb29d8fcf0a4a89584",
+      "name": "Icon / reply",
+      "description": "email",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52955": {
+      "key": "182fd9475e3e361c0889fb4c19cfc125a02e0a1d",
+      "name": "Icon / rewind",
+      "description": "music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52819": {
+      "key": "208e0483e0b5d1c0a88bc0591a394a433239f24a",
+      "name": "Icon / ribbon",
+      "description": "awareness, strip, band, tape, strap, cordon",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53280": {
+      "key": "92c9e582214345018504a7e7be6479a72134a6df",
+      "name": "Icon / rocket",
+      "description": "release, boost, launch, space, version",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52818": {
+      "key": "0499bf058980efd8e39ea385fc55b510f7adfbbf",
+      "name": "Icon / rocking-chair",
+      "description": "chair, furniture, seat",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52817": {
+      "key": "32e56e2456c5b4342ec75a764713f59c16d9a329",
+      "name": "Icon / roller-coaster",
+      "description": "attraction, entertainment, amusement park, theme park, funfair",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53442": {
+      "key": "b6ff40e2956b4198111db542c8f09c69625bbe65",
+      "name": "Icon / rotate-3d",
+      "description": "gizmo, transform, orientation, orbit, axis",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53987": {
+      "key": "d585538e2633864d574620482a355702020c8f45",
+      "name": "Icon / rotate-ccw-key",
+      "description": "password, key, refresh, change",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53688": {
+      "key": "bbbbb3d8a88c1c6542aa06a2c68f621a3f1ceaf6",
+      "name": "Icon / rotate-ccw-square",
+      "description": "left, counter-clockwise, rotate, image, 90, 45, degrees, \u00b0",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53428": {
+      "key": "e81d31ad5b200808d8b347df73719e319f3a70b8",
+      "name": "Icon / rotate-ccw",
+      "description": "arrow, left, counter-clockwise, restart, reload, rerun, refresh, backup, undo, replay, redo, retry, rewind, reverse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52816": {
+      "key": "3c206d5ed63eca5d0cd681798e21bd9bd86b80b2",
+      "name": "Icon / rotate-cw-square",
+      "description": "right, clockwise, rotate, image, 90, 45, degrees, \u00b0",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52815": {
+      "key": "0c5beb3ca2ed9015ce71e1092addfea1173ba392",
+      "name": "Icon / rotate-cw",
+      "description": "arrow, right, clockwise, refresh, reload, rerun, redo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53940": {
+      "key": "654f519ef668e1cb0ca54416d401f728e18b0b53",
+      "name": "Icon / route-off",
+      "description": "path, journey, planner, points, stops, stations, reset, clear, cancelled, closed, blocked",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52814": {
+      "key": "03b8245abebfd796de3376860cc3f12beff060af",
+      "name": "Icon / route",
+      "description": "path, journey, planner, points, stops, stations",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52812": {
+      "key": "5399b2ab2b0a23a9a14749ef8be296a718ff1199",
+      "name": "Icon / router",
+      "description": "computer, server, cloud",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53383": {
+      "key": "f9414f47a313eee780e22a62af9781ac900d6887",
+      "name": "Icon / rows-2",
+      "description": "lines, list, queue, preview, panel, paragraphs, parallel, series, split, vertical, horizontal, half, center, middle, even, drawer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52811": {
+      "key": "f09e91bab578d2d1e3e1b7c8cf4c2f2baa9d9dda",
+      "name": "Icon / rows-3",
+      "description": "lines, list, queue, preview, paragraphs, parallel, series, split, vertical, horizontal, half, center, middle, even, drawers",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52810": {
+      "key": "d59b9fbb53922f96b9140c809d2fd38002f3e2a4",
+      "name": "Icon / rows-4",
+      "description": "lines, list, queue, preview, paragraphs, parallel, series, split, vertical, horizontal, half, center, middle, even, drawers, grill",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52807": {
+      "key": "db5576e83ca384ef323620f5fc6367c21ff6e404",
+      "name": "Icon / rss",
+      "description": "feed, subscribe, news, updates, notifications, content, blog, articles, broadcast, syndication, reader, channels, posts, publishing, digest, alert, following, inbox, newsletter, weblog, podcast",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53424": {
+      "key": "7c7e380bbaf8cb85a69bc82b21f39cec9997dc93",
+      "name": "Icon / ruler-dimension-line",
+      "description": "measurements, centimeters, cm, millimeters, mm, metre, foot, feet, inches, units, size, length, width, height, dimensions, depth, breadth, extent, stationery",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54014": {
+      "key": "22022967c78af2f6ca5f0691f05d36116d6fca58",
+      "name": "Icon / ruler",
+      "description": "measurements, centimeters, cm, millimeters, mm, metre, foot, feet, inches, units, size, length, width, height, dimensions, depth, breadth, extent, stationery",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52806": {
+      "key": "4f6c5a145d6e75ecd90513bf729f3dff176ba841",
+      "name": "Icon / russian-ruble",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53468": {
+      "key": "fc962ae749ec3164f57e5738d8b4cc88605093e5",
+      "name": "Icon / sailboat",
+      "description": "ship, boat, harbor, harbour, dock",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52805": {
+      "key": "831fe20acb6b79c858ff54b97360db322d3b3000",
+      "name": "Icon / salad",
+      "description": "food, vegetarian, dish, restaurant, course, meal, side, vegetables, health",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52804": {
+      "key": "9d5f71d80e231936371d15301d38ad57e2f912d9",
+      "name": "Icon / sandwich",
+      "description": "food, snack, dish, restaurant, lunch, meal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52803": {
+      "key": "5fe54fb46712e82478764004e518c8c0db6ba2d4",
+      "name": "Icon / satellite-dish",
+      "description": "antenna, receiver, dish aerial, saucer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53438": {
+      "key": "8c364254807f30780b174cb9a7e30d63cf6c2bb7",
+      "name": "Icon / satellite",
+      "description": "space station, orbit, transmitter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53149": {
+      "key": "efd0aeec306a69cd7db5c1e5b06d6298c92ac4b6",
+      "name": "Icon / saudi-riyal",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53158": {
+      "key": "808cddb96a8ec16eaf18fdb86fed453b0d4e74c1",
+      "name": "Icon / save-all",
+      "description": "floppy disks, copy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52802": {
+      "key": "16d2416d65e87f575fbbe096e49778d22d6d82e4",
+      "name": "Icon / save-off",
+      "description": "floppy disk, unsalvageable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52801": {
+      "key": "773f3f946234174c9b4e25119e8db5e739eb6a19",
+      "name": "Icon / save",
+      "description": "floppy disk",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54096": {
+      "key": "9f06d6b8971e128aaa170b0f248d5e6f6f9f6e9d",
+      "name": "Icon / scale-3d",
+      "description": "gizmo, transform, size, axis",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52920": {
+      "key": "a0c75ab537221490466cf2c9bf7bac72e7c8d376",
+      "name": "Icon / scale",
+      "description": "balance, legal, license, right, rule, law",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53039": {
+      "key": "9ebe4f51afd49fcd1adc2bb3b38c9c914e69eeae",
+      "name": "Icon / scaling",
+      "description": "scale, resize, design",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52800": {
+      "key": "4f7ecf25bedfed1f4dc72b1bd0f1b8ab40c5457a",
+      "name": "Icon / scan-barcode",
+      "description": "checkout, till, cart, transaction, purchase, buy, product, packaging, retail, consumer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52850": {
+      "key": "0d27378d52dbfc3d94e424376801df86b2cb57e9",
+      "name": "Icon / scan-eye",
+      "description": "preview, zoom, expand, fullscreen, gallery, image, camera, watch, surveillance, retina, focus, lens, biometric, identification, authentication, access, login",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52952": {
+      "key": "82803682512dcd3773b32a90dea67987ff0026d1",
+      "name": "Icon / scan-face",
+      "description": "face, biometric, identification, authentication, 2fa, access, login, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52798": {
+      "key": "e9db9c4225688e381ea9d30918e0deb5c8116fd5",
+      "name": "Icon / scan-heart",
+      "description": "health, heart rate, pulse, monitoring, healthiness, screening, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52797": {
+      "key": "f249c56b2d3675a2e21d56e80d5369bcefff0f52",
+      "name": "Icon / scan-line",
+      "description": "checkout, till, cart, transaction, purchase, buy, product, packaging, retail, consumer, qr-code, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52796": {
+      "key": "b93ec96b506212d64174f851beaf67d3174788b5",
+      "name": "Icon / scan-qr-code",
+      "description": "barcode, scan, qrcode, url, information, digital, scanner",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52794": {
+      "key": "f6d0c19d4ba0ca09b4ef02433f4976a2958dd2b8",
+      "name": "Icon / scan-search",
+      "description": "preview, zoom, expand, fullscreen, gallery, image, focus, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52793": {
+      "key": "2b0d5820436f57522b274db0ab86b84ce560792e",
+      "name": "Icon / scan-text",
+      "description": "recognition, read, translate, copy, lines",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52792": {
+      "key": "8a77f5d70ff67a069534002009b12fd18c9f7932",
+      "name": "Icon / scan",
+      "description": "qr-code, barcode, checkout, augmented reality, ar, target, surveillance, camera, lens, focus, frame, select, box, boundary, bounds, area, square, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53614": {
+      "key": "684a0d2e0b315d7131b5a12b61ef8769fb5e653c",
+      "name": "Icon / school",
+      "description": "building, education, childhood, university, learning, campus, scholar, student, lecture, degree, course, academia, study, knowledge, classroom, research, diploma, graduation, professor, tutorial, homework, assignment, exam",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53332": {
+      "key": "c53d84f265d871456e683620117b94dafd9b5165",
+      "name": "Icon / scissors-line-dashed",
+      "description": "cut here, along, snip, chop, stationery, crafts, instructions, diagram",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52791": {
+      "key": "75bf303dc7905d8f6a58081387d27192ca3ea7a4",
+      "name": "Icon / scissors",
+      "description": "cut, snip, chop, stationery, crafts",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53970": {
+      "key": "61598ddd440e770b51ff82b79da1716a537d00cd",
+      "name": "Icon / screen-share-off",
+      "description": "desktop, disconnect, monitor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53136": {
+      "key": "7dbbd048b0ff15f489c95ddd8900fe86446fc698",
+      "name": "Icon / screen-share",
+      "description": "host, desktop, monitor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52790": {
+      "key": "add2c81cabd26fb791c26afe8946479309cf19b6",
+      "name": "Icon / scroll-text",
+      "description": "paper, log, scripture, document, notes, parchment, list, long, script, story, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52789": {
+      "key": "2c5381f01a0696fbed8bbac76a87b5aed35ef720",
+      "name": "Icon / scroll",
+      "description": "paper, log, scripture, document, notes, parchment, list, long, script, story, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52788": {
+      "key": "d8e73be67f92658b2c6d0f2e8d198039609095dd",
+      "name": "Icon / search-check",
+      "description": "find, scan, magnifier, magnifying glass, found, correct, complete, tick, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54137": {
+      "key": "934c89d9086373ebcda9149697ab01ace2f5be3c",
+      "name": "Icon / search-code",
+      "description": "find, scan, magnifier, magnifying glass, grep, chevrons, <>, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52787": {
+      "key": "b44662dcae69d727ec7ba2fafd7e8e9439eaf7f2",
+      "name": "Icon / search-slash",
+      "description": "find, scan, magnifier, magnifying glass, stop, clear, cancel, abort, /, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52913": {
+      "key": "a990481bd48ef61879f11424e2ab0e481559a05a",
+      "name": "Icon / search-x",
+      "description": "find, scan, magnifier, magnifying glass, stop, clear, cancel, abort, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53285": {
+      "key": "896ed0dfabfefdfbbb00b1c93a0cb796621f2375",
+      "name": "Icon / section",
+      "description": "mark, typography, punctuation, legal, type, text, prose, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52786": {
+      "key": "88beb4963cc45b63bc6c1dd782c25ae0b46ff249",
+      "name": "Icon / send-horizontal",
+      "description": "email, message, mail, paper airplane, paper aeroplane, submit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52888": {
+      "key": "9c0e5e40ca80be5da4c358d6220c323738ac3fdc",
+      "name": "Icon / send-to-back",
+      "description": "bring, send, move, under, back, backwards, overlap, layer, order",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52784": {
+      "key": "96eb805b7dde48894d3921581df6899fa213ba0e",
+      "name": "Icon / separator-horizontal",
+      "description": "move, split",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52783": {
+      "key": "abca55a73c55d25ebe321de1a53b52cede360367",
+      "name": "Icon / separator-vertical",
+      "description": "move, split",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52782": {
+      "key": "74b8db5ff8cae1c85892d715e1f7f174ed54f871",
+      "name": "Icon / server-cog",
+      "description": "cloud, storage, computing, cog, gear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52781": {
+      "key": "631d7a901be941850597ca9e078e1d111396a488",
+      "name": "Icon / server-crash",
+      "description": "cloud, storage, problem, error",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52780": {
+      "key": "6efc29e8298b9a04930d0f6c0932ab5fcc92877d",
+      "name": "Icon / server-off",
+      "description": "cloud, storage",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52779": {
+      "key": "1a461afdb735c37428c0038ed898618b1817a855",
+      "name": "Icon / server",
+      "description": "cloud, storage",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53102": {
+      "key": "65b6d55a7dc9d6ce30ffa3501d87d8bd7e9323dc",
+      "name": "Icon / settings-2",
+      "description": "cog, edit, gear, preferences",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52778": {
+      "key": "dfabdabd4e2a0e2e904bc23e2d0d7a50380a035a",
+      "name": "Icon / settings",
+      "description": "cog, edit, gear, preferences",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52777": {
+      "key": "4c73354f7ec09c23d85fc2570c0f2190724302f3",
+      "name": "Icon / shapes",
+      "description": "triangle, equilateral, square, circle, classification, different, collection, toy, blocks, learning",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53410": {
+      "key": "33a6980486746f00e814f42da34a3e257075cb66",
+      "name": "Icon / share-2",
+      "description": "network, connections",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52776": {
+      "key": "c224e016599191d0f6e6c48b786e5abeee5291fe",
+      "name": "Icon / share",
+      "description": "network, connections",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52775": {
+      "key": "02ffd8999b949b56ccef21100499582c611f058e",
+      "name": "Icon / sheet",
+      "description": "spreadsheets, table, excel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53026": {
+      "key": "da4f9f6c139c90eb29a1f2adfe38ce96a389cca0",
+      "name": "Icon / shell",
+      "description": "beach, sand, holiday, sealife, fossil, ammonite, biology, ocean, terminal, command line, session, bash, zsh, roll, wrap, chewing gum, bubble gum, sweet, sugar, hosepipe, carpet, string, spiral, spinner, hypnotise, hypnosis",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53217": {
+      "key": "ea073744c5ec0cb1909f99ca95119cb065520a1c",
+      "name": "Icon / shield-ban",
+      "description": "unshielded, cybersecurity, insecure, unsecured, safety, unsafe, protection, unprotected, guardian, unguarded, unarmored, unarmoured, defenseless, defenceless, undefended, defender, blocked, stopped, intercepted, interception, saved, thwarted, threat, prevention, unprevented, antivirus, vigilance, vigilant, detection, detected, scanned, found, exploit, vulnerability, vulnerable, weakness, infection, infected, comprimised, data leak, audited, admin, verification, unverified, uncertified, cancel, error, crest, bravery, attacked, damaged, injured, hit, expired, eliminated, disabled, inactive, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53342": {
+      "key": "05dc38d251442b237d5d4087b60b0908fe4748c3",
+      "name": "Icon / shield-check",
+      "description": "cybersecurity, secured, safety, protection, protected, guardian, guarded, armored, armoured, defense, defence, defended, blocked, threat, prevention, prevented, antivirus, vigilance, vigilant, active, activated, enabled, detection, scanned, found, strength, strong, tough, invincible, invincibility, invulnerable, undamaged, audited, admin, verification, verified, certification, certified, tested, passed, qualified, cleared, cleaned, disinfected, uninfected, task, completed, todo, done, ticked, checked, crest, bravery",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52902": {
+      "key": "2986f58ebd129370b61b64d85a8d50871baa8096",
+      "name": "Icon / shield-ellipsis",
+      "description": "cybersecurity, securing, protecting, guarding, armoring, armouring, defending, blocking, preventing, antivirus, detecting, scanning, finding, auditing, admin, verifying, crest, upgrading, loader, loading, throbber, progress, dots, more, etc, ..., \u2026",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52774": {
+      "key": "6a1621093a13771031875ef4346008349eefab9e",
+      "name": "Icon / shield-half",
+      "description": "cybersecurity, secure, safety, protection, guardian, armored, armoured, defense, defence, defender, block, threat, prevention, antivirus, vigilance, vigilant, detection, scan, strength, strong, tough, invincible, invincibility, invulnerable, undamaged, audit, admin, verification, crest, logo, sigil, flag, team, faction, fraternity, university, college, academy, school, education, uniform, bravery, knight, foot soldier, infantry, trooper, pawn, battle, war, military, ranking, army, cadet, scout",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53794": {
+      "key": "01325e11c2ad51f1b79971e98a9d5d26f0bd0548",
+      "name": "Icon / shield-minus",
+      "description": "unshield, cybersecurity, unsecure, unguard, unblock, antivirus, clean, clear, disinfect, patch, fix, stop, cancel, remove, relax, admin, crest, bravery, weakened, damaged, hit, unarm, disable, deactivate, decommission, downgraded, minimum, -",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52773": {
+      "key": "4a5783df44d645ed065d1fa2be962233918d85cf",
+      "name": "Icon / shield-off",
+      "description": "unshielded, cybersecurity, insecure, unsecured, safety, unsafe, protection, unprotected, guardian, unguarded, unarmored, unarmoured, defenseless, defenceless, undefended, defender, interception, threat, prevention, unprevented, antivirus, detection, undetected, exploit, vulnerability, vulnerable, weakness, infected, infection, comprimised, data leak, unaudited, admin, verification, unverified, inactive, cancelled, error, crest, bravery, damaged, injured, hit, expired, eliminated",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53546": {
+      "key": "fb04a1d46acbf7281563143cdb003f29df813e76",
+      "name": "Icon / shield-plus",
+      "description": "cybersecurity, secure, safety, protection, guardian, armored, armoured, defense, defence, defender, block, threat, prevention, antivirus, vigilance, vigilant, detection, scan, strength, strong, tough, invincible, invincibility, invulnerable, undamaged, extra, added, professional, enterprise, full, maximum, upgraded, ultra, activate, enable, audit, admin, verification, crest, medic, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52772": {
+      "key": "9f59304db07495d1eb79d30116fbaafd57547a91",
+      "name": "Icon / shield-question",
+      "description": "unshielded, cybersecurity, insecure, unsecured, safety, unsafe, protection, unprotected, guardian, unguarded, unarmored, unarmoured, defenseless, defenceless, undefended, defender, threat, prevention, unprevented, antivirus, vigilance, vigilant, detection, undetected, scan, find, exploit, vulnerability, vulnerable, weakness, infection, comprimised, data leak, audit, admin, verification, unverified, uncertified, uncertain, unknown, inactive, crest, question mark, ?",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54153": {
+      "key": "779ac68999050960677394ea7e7bb82cfd80a089",
+      "name": "Icon / shield-user",
+      "description": "shield, user, admin, protection, protected, safety, guard",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53394": {
+      "key": "dfcffd44a8f85abecf0ca80a8931d99bda95bb1a",
+      "name": "Icon / shield-x",
+      "description": "unshielded, cybersecurity, insecure, unsecured, safety, unsafe, protection, unprotected, guardian, unguarded, unarmored, unarmoured, defenseless, defenceless, undefended, defender, blocked, stopped, intercepted, interception, saved, thwarted, threat, prevention, prevented, antivirus, vigilance, vigilant, detection, detected, scanned, found, exploit, vulnerability, vulnerable, weakness, infection, infected, comprimised, data leak, audited, admin, verification, unverified, inactive, cancel, error, wrong, false, crest, bravery, attacked, damaged, injured, hit, dead, deceased, expired, eliminated, exterminated",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52771": {
+      "key": "b2c2f66fd206fd122d90fea7a318a17a9943691a",
+      "name": "Icon / shield",
+      "description": "cybersecurity, secure, safety, protection, guardian, armored, armoured, defense, defence, defender, block, threat, prevention, antivirus, vigilance, vigilant, detection, scan, find, strength, strong, tough, invincible, invincibility, invulnerable, undamaged, audit, admin, verification, crest, bravery, knight, foot soldier, infantry, trooper, pawn, battle, war, military, army, cadet, scout",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52770": {
+      "key": "30984211a229b91036de4abff456d691ac92a205",
+      "name": "Icon / ship-wheel",
+      "description": "steering, rudder, boat, knots, nautical mile, maritime, sailing, yacht, cruise, ocean liner, tanker, vessel, navy, trip",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52769": {
+      "key": "e99503093f067aea69f5b41f9669c81289279d18",
+      "name": "Icon / ship",
+      "description": "boat, knots, nautical mile, maritime, sailing, yacht, cruise, ocean liner, tanker, vessel, navy, trip",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52768": {
+      "key": "70cb769a223c93253d3b43bfcce5014cae544415",
+      "name": "Icon / shirt",
+      "description": "t-shirt, shopping, store, clothing, clothes",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52767": {
+      "key": "36fc8ea8eef8c1a146f1252271573fbb9df22cb5",
+      "name": "Icon / shopping-bag",
+      "description": "ecommerce, cart, purchase, store",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53371": {
+      "key": "01e45ee0004ead62f4ee911afe6e81e70f9e1b97",
+      "name": "Icon / shopping-basket",
+      "description": "cart, e-commerce, store, purchase, products, items, ingredients",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53582": {
+      "key": "cf1b13f311025f29de07e0fcf185164ef96ad7cc",
+      "name": "Icon / shopping-cart",
+      "description": "trolley, cart, basket, e-commerce, store, purchase, products, items, ingredients",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52766": {
+      "key": "f54710ec862d3b2ccbc292f1719a0d11cc2cdf69",
+      "name": "Icon / shovel",
+      "description": "dig, spade, treasure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52765": {
+      "key": "1c5b8dbc23a0d02ed0361875703e73c0026467f9",
+      "name": "Icon / shower-head",
+      "description": "shower, bath, bathroom, amenities, services",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53010": {
+      "key": "a387f4b2f5f724a4aeaab69c77e6955890083aad",
+      "name": "Icon / shredder",
+      "description": "file, paper, tear, cut, delete, destroy, remove, erase, document,, destruction, secure , security, confidential, data, trash, dispose, disposal, information, waste, permanent",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53278": {
+      "key": "dd153e7c1611e07eb3ae8f84e52fa30fc407e880",
+      "name": "Icon / shrimp",
+      "description": "seafood, shellfish, crustacean, prawn, scallop, whelk, arthropod, littleneck, quahog, cherrystone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53944": {
+      "key": "a25861150c3a050b29eaa0d3a2280176118ab80d",
+      "name": "Icon / shrink",
+      "description": "scale, fullscreen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53883": {
+      "key": "be61cb8a876715aa2433d9df34228dd314e8ae56",
+      "name": "Icon / shrub",
+      "description": "forest, undergrowth, park, nature",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52764": {
+      "key": "476fbd71dd8f8e9cb92d61860e81ba7fd4e68551",
+      "name": "Icon / shuffle",
+      "description": "music, random, reorder",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52763": {
+      "key": "816878bf67d9e727d7cd7f3911a1f022b3d1fb1f",
+      "name": "Icon / sigma",
+      "description": "sum, calculate, formula, math, enumeration, enumerate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53934": {
+      "key": "37515759ab282345062cde06cef8e7cda002b629",
+      "name": "Icon / signal-high",
+      "description": "connection, wireless, gsm, phone, 2g, 3g, 4g, 5g",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53017": {
+      "key": "f1b7907fdd0d6ba7f6804fbb34fb514a148f3e6d",
+      "name": "Icon / signal-low",
+      "description": "connection, wireless, gsm, phone, 2g, 3g, 4g, 5g",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52762": {
+      "key": "5d2882d8c144857977b83d57b3e47f4929e39f13",
+      "name": "Icon / signal-medium",
+      "description": "connection, wireless, gsm, phone, 2g, 3g, 4g, 5g",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52761": {
+      "key": "3f11a145693d6810c1d63348e34ae1a740b0c431",
+      "name": "Icon / signal-zero",
+      "description": "connection, wireless, gsm, phone, 2g, 3g, 4g, 5g, lost",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52760": {
+      "key": "87e39ed1a9057078e3205f9b32ef05be2f2ecf2a",
+      "name": "Icon / signal",
+      "description": "connection, wireless, gsm, phone, 2g, 3g, 4g, 5g",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53898": {
+      "key": "3161c05c6851da0ec665b3e526fc449774a1fa6e",
+      "name": "Icon / signature",
+      "description": "text, format, input, contract, autograph, handwriting, sign, cursive, ink, scribble, authorize, personal, agreement, legal, document, identity, authentic, approval, verification, unique",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53603": {
+      "key": "7de1f5c441a6878611333f833f1e82442fc95f16",
+      "name": "Icon / signpost-big",
+      "description": "bidirectional, left, right, east, west",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52759": {
+      "key": "0689971abd327bab077cfa2098d19542f48baa42",
+      "name": "Icon / signpost",
+      "description": "bidirectional, left, right, east, west",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52758": {
+      "key": "1e01d3546da48ce6ba2ba47ed8cf6521581779a6",
+      "name": "Icon / siren",
+      "description": "police, ambulance, emergency, security, alert, alarm, light",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53535": {
+      "key": "0fb298dba692524a42cced3ff5b07cd8a527eb20",
+      "name": "Icon / skip-back",
+      "description": "arrow, previous, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52757": {
+      "key": "af454f53df089249be90a44246ab2f462eb2fc07",
+      "name": "Icon / skip-forward",
+      "description": "arrow, skip, next, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52756": {
+      "key": "bcd9aa2ba57077bd10b82626c9b7331cd2a5e331",
+      "name": "Icon / skull",
+      "description": "death, danger, bone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52754": {
+      "key": "a6a9512a69d8fbdb547fa67fab8784edef7cf30e",
+      "name": "Icon / slack",
+      "description": "logo",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53119": {
+      "key": "5674b37f91c4fd3a359bbe40dbdc4e5f9f0d78b4",
+      "name": "Icon / slice",
+      "description": "cutter, scalpel, knife",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52753": {
+      "key": "5697921b3e24e49a75340c89d9cd5f161c444851",
+      "name": "Icon / sliders-horizontal",
+      "description": "settings, filters, controls",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53560": {
+      "key": "aed3099bd82d5e45bd5d2c45a4922a150300768b",
+      "name": "Icon / sliders-vertical",
+      "description": "settings, controls",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52752": {
+      "key": "3334e7975c0c51258c976b277c9b81fd4595f2ac",
+      "name": "Icon / smartphone-charging",
+      "description": "phone, cellphone, device, power, screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52750": {
+      "key": "661c7de75b7e22c184b076b7be2da3172e6ad7b6",
+      "name": "Icon / smartphone-nfc",
+      "description": "contactless, payment, near-field communication, screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52749": {
+      "key": "f3a07a0d5335fc6c508fdd7f5840ed1a4a98c176",
+      "name": "Icon / smartphone",
+      "description": "phone, cellphone, device, screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52748": {
+      "key": "6f86375805bbeb46e70c3c1b250a199949f64a5d",
+      "name": "Icon / smile-plus",
+      "description": "emoji, face, happy, good, emotion, react, reaction, add",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52747": {
+      "key": "7a5e858fe25b458b6285e17f07ca9c24ff2db3ab",
+      "name": "Icon / smile",
+      "description": "emoji, face, happy, good, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53087": {
+      "key": "26c8ecf6435bdfa614191c89018296f6d46defa8",
+      "name": "Icon / snail",
+      "description": "animal, insect, slow, speed, delicacy, spiral",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52745": {
+      "key": "f1a587a1db92db9eb5bb1dc48abfba0dc1286e7c",
+      "name": "Icon / snowflake",
+      "description": "cold, weather, freeze, snow, winter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52743": {
+      "key": "5b53dd4eac5cfddf0563039de8f13a2a1aff39df",
+      "name": "Icon / soap-dispenser-droplet",
+      "description": "wash, baht, water, liquid, fluid, wet, moisture, damp, bead, globule",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53602": {
+      "key": "bfd824ba7816c859d57dcc5f7578ca5be555fc37",
+      "name": "Icon / sofa",
+      "description": "armchair, furniture, leisure, lounge, loveseat, couch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53800": {
+      "key": "9f0db9c8247593472834a8bde0b8b90a496e2dac",
+      "name": "Icon / soup",
+      "description": "food, dish, restaurant, course, meal, bowl, starter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52742": {
+      "key": "8e8e700db89982901906bb491ee9466680410928",
+      "name": "Icon / space",
+      "description": "text, selection, letters, characters, font, typography",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53344": {
+      "key": "7abf3c28d48c7891bb2beba649affb1b1b2ad224",
+      "name": "Icon / spade",
+      "description": "shape, suit, playing, cards",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53584": {
+      "key": "0830bccc5a9262ec638ea9368769ea5d75869fd3",
+      "name": "Icon / sparkle",
+      "description": "star, effect, filter, night, magic, shiny, glitter, twinkle, celebration",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52992": {
+      "key": "a548dff71e09565260fef93f576b4471a35888ae",
+      "name": "Icon / sparkles",
+      "description": "stars, effect, filter, night, magic",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52741": {
+      "key": "916aaaeeb8ceddb14fb4cc744a10075c3481e960",
+      "name": "Icon / speaker",
+      "description": "sound, audio, music, tweeter, subwoofer, bass, production, producer, dj",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53843": {
+      "key": "bba474cd814034dfd79d6557290a0524d434ef5a",
+      "name": "Icon / speech",
+      "description": "disability, disabled, dda, human, accessibility, people, sound",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52785": {
+      "key": "3436ad67c80d7cd501208a875f545ae5b08fcc28",
+      "name": "Icon / spell-check-2",
+      "description": "spelling, error, mistake, oversight, typo, correction, code, linter, a",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52740": {
+      "key": "828ec097878946623f7a0ad26cea2c95d6377a63",
+      "name": "Icon / spell-check",
+      "description": "spelling, error, mistake, oversight, typo, correction, code, linter, a",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52739": {
+      "key": "eb3cd0efc57eb4090fb286edf764be3c724a95c3",
+      "name": "Icon / spline-pointer",
+      "description": "path, tool, curve, node, click, pointer, target, vector",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53142": {
+      "key": "1fc994df6c782f01103fc07a87dda26c7182759c",
+      "name": "Icon / spline",
+      "description": "path, pen, tool, shape, curve, draw",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53837": {
+      "key": "b4776efca4127533666b5a2f53ba09d160f374f4",
+      "name": "Icon / split",
+      "description": "break, disband, divide, separate, branch, disunite",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52988": {
+      "key": "eea1eeb1e71e1c2b4857cd3b938e258f77a16859",
+      "name": "Icon / spray-can",
+      "description": "paint, color, graffiti, decoration, aerosol, deodorant, shaving foam, air freshener",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53539": {
+      "key": "aee7fcc4cd20878779d4b3d676903efa935b267e",
+      "name": "Icon / sprout",
+      "description": "leaf, nature, plant",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52737": {
+      "key": "88cda031fa038de4ab7c451581844cc01114d879",
+      "name": "Icon / square-activity",
+      "description": "pulse, action, motion, movement, exercise, fitness, healthcare, heart rate monitor, vital signs, vitals, emergency room, er, intensive care, hospital, defibrillator, earthquake, siesmic, magnitude, richter scale, aftershock, tremor, shockwave, audio, waveform, synthesizer, synthesiser, music",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52736": {
+      "key": "5f98a66afc488e5774838b5520fe656ba8147f09",
+      "name": "Icon / square-arrow-down-left",
+      "description": "direction, south-west, diagonal, sign, turn, keyboard, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53865": {
+      "key": "fb931f6a9b5c4984d7287fd6d2dba5e1bdc17981",
+      "name": "Icon / square-arrow-down-right",
+      "description": "direction, south-east, diagonal, sign, turn, keyboard, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52734": {
+      "key": "9bb414f1857e40421666b11f745f90a04dbe85d1",
+      "name": "Icon / square-arrow-down",
+      "description": "backwards, reverse, direction, south, sign, keyboard, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52733": {
+      "key": "d0269ddbceec8d2b190a41f2e23966a19b715ae3",
+      "name": "Icon / square-arrow-left",
+      "description": "previous, back, direction, west, sign, keyboard, button, <-",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53318": {
+      "key": "a21326fc11c21d2387cde3527f7ab94e7597dfc5",
+      "name": "Icon / square-arrow-out-down-left",
+      "description": "outwards, direction, south-west, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53214": {
+      "key": "2924733e88a7cc245b5707251e390602af2bdb50",
+      "name": "Icon / square-arrow-out-down-right",
+      "description": "outwards, direction, south-east, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53617": {
+      "key": "1ccd9ae54beeaf385cd32cf854f003156cbe1848",
+      "name": "Icon / square-arrow-out-up-left",
+      "description": "outwards, direction, north-west, diagonal",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52732": {
+      "key": "ab8eff9e3908103c7651138360400f87f6c82e7a",
+      "name": "Icon / square-arrow-out-up-right",
+      "description": "outwards, direction, north-east, diagonal, share, open, external, link",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54075": {
+      "key": "27ff8c9c6a69cb03ef39b5b3a431d33ceb76b1ef",
+      "name": "Icon / square-arrow-right",
+      "description": "next, forward, direction, west, sign, keyboard, button, ->",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52731": {
+      "key": "974a7ae8df153d7ed87c3fd70c4c1207b1931f03",
+      "name": "Icon / square-arrow-up-left",
+      "description": "direction, north-west, diagonal, sign, keyboard, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52974": {
+      "key": "0eeb32ccce053d49895410506b07637aa637dcc7",
+      "name": "Icon / square-arrow-up-right",
+      "description": "direction, north-east, diagonal, sign, keyboard, button, share",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52729": {
+      "key": "663a14b0cc2c245cba4a2e3ffe51493e918268f7",
+      "name": "Icon / square-arrow-up",
+      "description": "forward, direction, north, sign, keyboard, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52728": {
+      "key": "94d906939ced943740f4655cacf6d91f4f233ddd",
+      "name": "Icon / square-asterisk",
+      "description": "password, secret, access, key, multiply, multiplication, glob pattern, wildcard, *",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53902": {
+      "key": "c35248c0c86e9345f2e64f5d06208dffa3b8ef5f",
+      "name": "Icon / square-bottom-dashed-scissors",
+      "description": "cut, snippet, chop, stationery, crafts",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53927": {
+      "key": "b51863a8c9f9773d97661a286fbf7796ce7763f9",
+      "name": "Icon / square-chart-gantt",
+      "description": "projects, manage, overview, roadmap, plan, intentions, timeline, deadline, date, event, range, period, productivity, work, agile, code, coding, toolbar, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54084": {
+      "key": "ef0955a517c583b22158af4bb6b42c1e427df32d",
+      "name": "Icon / square-check-big",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52727": {
+      "key": "d2e65624b29af9b6a5e28fe9b55f0016d5ec8407",
+      "name": "Icon / square-check",
+      "description": "done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52726": {
+      "key": "93f872777ec0ba22c9ac6efb372f39d5df91192e",
+      "name": "Icon / square-chevron-down",
+      "description": "back, menu, panel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52724": {
+      "key": "330fad5ec388d1ed7558b54bc0359648d2a1bbf6",
+      "name": "Icon / square-chevron-left",
+      "description": "back, previous, less than, fewer, menu, panel, button, keyboard, <",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52723": {
+      "key": "cef939c64ab38b1ebe529e591161ff8810b7d9ca",
+      "name": "Icon / square-chevron-right",
+      "description": "forward, next, more than, greater, menu, panel, code, coding, command line, terminal, prompt, shell, console, >",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53109": {
+      "key": "fe466f6bf74eb0b8dce6762d0c2c9c14f20bd6bb",
+      "name": "Icon / square-chevron-up",
+      "description": "caret, keyboard, button, mac, control, ctrl, superscript, exponential, power, ahead, menu, panel, ^",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52721": {
+      "key": "673eeada9e3f4f743da39276d176a137b3034db0",
+      "name": "Icon / square-code",
+      "description": "gist, source, programming, html, xml, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52744": {
+      "key": "b0e7785dd58e9a161c8b83811a7de2bed745a33e",
+      "name": "Icon / square-dashed-bottom-code",
+      "description": "rectangle, aspect ratio, 1:1, shape, snippet, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52720": {
+      "key": "993d1407e1a184f15c26f97f6a2572ff2759e853",
+      "name": "Icon / square-dashed-bottom",
+      "description": "rectangle, aspect ratio, 1:1, shape, snippet, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53450": {
+      "key": "ed83c800b5e156fb3f83b0cad1a3a7c234bdbcfc",
+      "name": "Icon / square-dashed-kanban",
+      "description": "projects, manage, overview, board, tickets, issues, roadmap, plan, intentions, productivity, work, agile, draft, template, boilerplate, code, coding",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52719": {
+      "key": "38831c03a65f99ddb9e8376142fdec71219f6385",
+      "name": "Icon / square-dashed-mouse-pointer",
+      "description": "inspector, element, mouse, click, pointer, box, browser, selector, target, dom, node",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53327": {
+      "key": "7a7567a9d07ec0892c4d181dfa1e417d0ccdd0aa",
+      "name": "Icon / square-dashed-top-solid",
+      "description": "square, border, width, layout, style, design, rectangular, marquee, dashed, box, rectangle, aspect ratio, 1:1",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52964": {
+      "key": "d2181a8a44dbb7b5c7fb397793fb3f54a7d7463d",
+      "name": "Icon / square-divide",
+      "description": "calculate, math, \u00f7, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53686": {
+      "key": "9bda5cb72f4137dd137974138c2748c2e985cf5b",
+      "name": "Icon / square-dot",
+      "description": "git, diff, modified, .",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53296": {
+      "key": "1c10488f289c74ac91d505a3ed36db2fb3ca0063",
+      "name": "Icon / square-equal",
+      "description": "calculate, =",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52718": {
+      "key": "953ce24fec439379734daf13d2d7564e932bd218",
+      "name": "Icon / square-function",
+      "description": "programming, code, automation, math",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52833": {
+      "key": "090a7e48d25e92f35818abab452ade30efe62e70",
+      "name": "Icon / square-kanban",
+      "description": "projects, manage, overview, board, tickets, issues, roadmap, plan, intentions, productivity, work, agile, code, coding, toolbar, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52957": {
+      "key": "abcc7017adad1509245e732c21255d25cc24703d",
+      "name": "Icon / square-library",
+      "description": "books, reading, written, authors, stories, fiction, novels, information, knowledge, education, high school, university, college, academy, learning, study, research, collection, vinyl, records, albums, music, package",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52717": {
+      "key": "bb454a02fcb72e112f37823470bd44fd778f8db5",
+      "name": "Icon / square-m",
+      "description": "metro, subway, underground, track, line",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52715": {
+      "key": "51e1ab1e735020402cac9121fbfd59d01c0c38b5",
+      "name": "Icon / square-menu",
+      "description": "bars, navigation, hamburger, options, menu bar, panel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53200": {
+      "key": "789e02e46215defbbbbad2575c89382b8dbbe2d5",
+      "name": "Icon / square-minus",
+      "description": "subtract, remove, decrease, reduce, calculator, button, keyboard, line, divider, separator, horizontal rule, hr, html, markup, markdown, ---, toolbar, operator, code, coding, minimum, downgrade",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52712": {
+      "key": "22cd1df7320b3d3f39d2fa1c026af2981e56b6c0",
+      "name": "Icon / square-mouse-pointer",
+      "description": "inspector, element, mouse, click, pointer, box, browser, selector, target, dom, node",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52725": {
+      "key": "f965b19e673a4004eef6c9a5ff6b14f21be8c1a3",
+      "name": "Icon / square-parking-off",
+      "description": "parking lot, car park, no parking",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52711": {
+      "key": "c27327a1d9d8fa555fd3963b55d05d0f39b49cd8",
+      "name": "Icon / square-parking",
+      "description": "parking lot, car park",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52709": {
+      "key": "33245f8d62451652efc92b89046beea170b13ec3",
+      "name": "Icon / square-pen",
+      "description": "pencil, edit, change, create, draw, sketch, draft, writer, writing, biro, ink, marker, felt tip, stationery, artist",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52949": {
+      "key": "ddaad394001ac7ff2eba55bee3d9826de222ce6c",
+      "name": "Icon / square-percent",
+      "description": "verified, unverified, sale, discount, offer, marketing, sticker, price tag",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52708": {
+      "key": "2de18010479957eea8177681d9a54823b965f4ff",
+      "name": "Icon / square-pi",
+      "description": "constant, code, coding, programming, symbol, trigonometry, geometry, formula",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52714": {
+      "key": "26d9359d77bec4625f68ee47c4727ec5cc1d3879",
+      "name": "Icon / square-pilcrow",
+      "description": "paragraph, mark, paraph, blind, typography, type, text, prose, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53284": {
+      "key": "375b9aa2ae53ae61becbc9d38fe8ecc14362b3e7",
+      "name": "Icon / square-play",
+      "description": "music, audio, video, start, run",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52751": {
+      "key": "777e0b77f6dac84d4336df80dcdcbf7d5eda1891",
+      "name": "Icon / square-plus",
+      "description": "add, new, increase, increment, positive, calculate, calculator, button, keyboard, toolbar, maximum, upgrade, extra, operator, join, concatenate, code, coding, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53741": {
+      "key": "262ae27003bc9000f1f123a26604dd2150967ce0",
+      "name": "Icon / square-power",
+      "description": "on, off, device, switch, toggle, binary, boolean, reboot, restart, button, keyboard, troubleshoot",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52707": {
+      "key": "9ca6e58ff071c149b4747a1badd1275d02ce3649",
+      "name": "Icon / square-radical",
+      "description": "calculate, formula, math, operator, root, square, symbol",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52705": {
+      "key": "6d4ed0f9872a22182320f17c840943e3c2e52279",
+      "name": "Icon / square-round-corner",
+      "description": "border, radius, style, design, corner, layout, round, rounded",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53650": {
+      "key": "ddb083a2e998b6e0f2f73d34e2ec01c445f2a16e",
+      "name": "Icon / square-scissors",
+      "description": "cut, snippet, chop, stationery, crafts, toolbar, button",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53134": {
+      "key": "8d6cce300cd7547d0ae4ea2c2ca05e8a4ee7ef4e",
+      "name": "Icon / square-sigma",
+      "description": "sum, calculate, formula, math, enumeration, enumerate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52945": {
+      "key": "0341e12eadd896af97462ff0194acca2d354b207",
+      "name": "Icon / square-slash",
+      "description": "git, diff, ignored, divide, division, shortcut, or, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52924": {
+      "key": "868c88335e7bb358d3b7511ec6f54cc90f51b0a8",
+      "name": "Icon / square-split-horizontal",
+      "description": "split, divide",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54164": {
+      "key": "11d433f347158a101b6d563a62d9e36253cb75e6",
+      "name": "Icon / square-split-vertical",
+      "description": "split, divide",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53981": {
+      "key": "0aca0e589c7895bf7d9d215deda51935c87e4902",
+      "name": "Icon / square-square",
+      "description": "float, center, rectangle",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52704": {
+      "key": "54ffe3063b02f597ac05d93c6b56d09e535d5a8e",
+      "name": "Icon / square-stack",
+      "description": "versions, clone, copy, duplicate, multiple, revisions, version control, backup, history",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53613": {
+      "key": "1a112643eed5488bf5bd8897456af7a8598c7dd7",
+      "name": "Icon / square-terminal",
+      "description": "code, command line, prompt, shell",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52702": {
+      "key": "803a4df180182e4168ba834eb3a54c0ae8e520bc",
+      "name": "Icon / square-user-round",
+      "description": "person, account, contact",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53759": {
+      "key": "67b8982e4b66316396e1ca46005811ad72b036b3",
+      "name": "Icon / square-user",
+      "description": "person, account, contact",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54067": {
+      "key": "a14d8118465121afc815ff2a7ac8be68d08d5b68",
+      "name": "Icon / square-x",
+      "description": "cancel, close, delete, remove, times, clear, math, multiply, multiplication",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52700": {
+      "key": "02dba2e37ec9b5d2d4b8e0294fbf0cce161296f4",
+      "name": "Icon / square",
+      "description": "rectangle, aspect ratio, 1:1, shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52698": {
+      "key": "2962585127d1c1339e096d7606127c9011feb141",
+      "name": "Icon / squares-exclude",
+      "description": "sqaure, pathfinder, path, exclude, invert, xor, shape, vector",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53848": {
+      "key": "b63857c23239021a0e300f888ef564a3908f8d06",
+      "name": "Icon / squares-intersect",
+      "description": "sqaure, pathfinder, path, intersect, shape, include, vector",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52697": {
+      "key": "8659cd350ed7f4b2b14cf0487b3fde6f1509e424",
+      "name": "Icon / squares-subtract",
+      "description": "sqaure, pathfinder, path, minus, subtract, subtraction, shape, front, vector",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52820": {
+      "key": "9fa9ccaf95face6e7416bb86f389b5037a60e538",
+      "name": "Icon / squares-unite",
+      "description": "sqaure, pathfinder, path, unite, union, shape, merge, vector",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53453": {
+      "key": "1ba2ebd8ce99029516cfcd752aa34e78877a1258",
+      "name": "Icon / squircle",
+      "description": "shape",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52696": {
+      "key": "aa74cc8c3f68f2df0e2e99513562c9237014a2e0",
+      "name": "Icon / squirrel",
+      "description": "animal, rodent, pet, pest, nuts, retrieve, updates, storage, stash",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52813": {
+      "key": "e504c114888466f158581ebb3d6c0fdaadd50aa3",
+      "name": "Icon / stamp",
+      "description": "mark, print, clone, loyalty, library",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52695": {
+      "key": "84667090580ff1909d4c2210857faba249cf49c2",
+      "name": "Icon / star-half",
+      "description": "bookmark, favorite, like, review, rating",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53966": {
+      "key": "6451d45ad7b75df430db1cf4fdd890dec4958d69",
+      "name": "Icon / star-off",
+      "description": "dislike, unlike, remove, unrate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53199": {
+      "key": "cad54a0972cc6e234a9ae9000ddc140d5fc721e0",
+      "name": "Icon / star",
+      "description": "bookmark, favorite, like, review, rating",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52693": {
+      "key": "bebcca82bfd8f7ea0e89c657febbbbe9cad15031",
+      "name": "Icon / step-back",
+      "description": "arrow, previous, music, left, reverse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54000": {
+      "key": "4a68a8aafafef9d7b02b39ff61dd87d7a935da9b",
+      "name": "Icon / step-forward",
+      "description": "arrow, next, music, right, continue",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52934": {
+      "key": "95001b90098d2966e646a605767af42c578da496",
+      "name": "Icon / stethoscope",
+      "description": "phonendoscope, medical, heart, lungs, sound",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53064": {
+      "key": "e2b9cbc6d0284d6a07a75a74d747ee8629ecc426",
+      "name": "Icon / sticker",
+      "description": "reaction, emotion, smile, happy, feedback",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52692": {
+      "key": "8217e6d8bf18618627a88b6cef4f70a72d265c99",
+      "name": "Icon / sticky-note",
+      "description": "post-it, comment, annotation, reaction, memo, reminder, todo, task, idea, brainstorm, document, page, paper, sheet, stationary, office",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52691": {
+      "key": "0430795a82400d17a4b6e4adabe007f56ff02861",
+      "name": "Icon / store",
+      "description": "shop, supermarket, stand, boutique, building",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53105": {
+      "key": "c2d932eb579e3fa856071f0225d3d1afd61cff22",
+      "name": "Icon / stretch-horizontal",
+      "description": "items, flex, justify, distribute",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53729": {
+      "key": "54f05786deed0908573afac281d95b0daa45761a",
+      "name": "Icon / stretch-vertical",
+      "description": "items, flex, justify, distribute",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53678": {
+      "key": "b529458c7113515fe69039e96ba86c5d31f32c2d",
+      "name": "Icon / strikethrough",
+      "description": "cross out, delete, remove, format",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53924": {
+      "key": "681abf43e143ca27f2f632cf3b2f616817eaf305",
+      "name": "Icon / subscript",
+      "description": "text",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53440": {
+      "key": "5c8a861d194d9c0d2c0ab00d11818c13275e0887",
+      "name": "Icon / sun-dim",
+      "description": "brightness, dim, low, brightness low",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52690": {
+      "key": "4188151962e1cb84602fbcb69b5bd4d544a1ec8b",
+      "name": "Icon / sun-medium",
+      "description": "brightness, medium",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53151": {
+      "key": "2cf207ebc39b6528ad8ecb8cf7472d23eb303f94",
+      "name": "Icon / sun-moon",
+      "description": "night, dark, light, moon, sun, brightness, theme, auto theme, system theme, appearance",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52689": {
+      "key": "c3968d894e801023d50a852cc404ac0081c4b594",
+      "name": "Icon / sun-snow",
+      "description": "weather, air conditioning, temperature, hot, cold, seasons",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52687": {
+      "key": "25980507dcaf23549e7e141f8d6dbe693ec24a04",
+      "name": "Icon / sun",
+      "description": "brightness, weather, light, summer",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52686": {
+      "key": "7d069ffefd2074bfd061701ebcd79030c4c27562",
+      "name": "Icon / sunrise",
+      "description": "weather, time, morning, day",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53721": {
+      "key": "d66096a5e4dacf06dbf0050482b82e1307a63b1c",
+      "name": "Icon / sunset",
+      "description": "weather, time, evening, night",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52870": {
+      "key": "f82eb93c5426e47b49662b7538b81158689ddf36",
+      "name": "Icon / superscript",
+      "description": "text, exponent",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53787": {
+      "key": "becbd225f314e43a22170377062e21c0563719a8",
+      "name": "Icon / swatch-book",
+      "description": "colors, colours, swatches, pantone, shades, tint, hue, saturation, brightness, theme, scheme, palette, samples, textile, carpet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53992": {
+      "key": "4be63e9116e2263528bf6365c84eee58b5caaea3",
+      "name": "Icon / swiss-franc",
+      "description": "currency, money, payment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52887": {
+      "key": "fc82e9ce035872beddaad49af481a7b2cdabecb4",
+      "name": "Icon / switch-camera",
+      "description": "photo, selfie, front, back",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52894": {
+      "key": "c10eb3aef9b056dbe897e4a76cea82fb52768a9c",
+      "name": "Icon / sword",
+      "description": "battle, challenge, game, war, weapon",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52685": {
+      "key": "89565667d3702cff533f998f9d85f62c27602f30",
+      "name": "Icon / swords",
+      "description": "battle, challenge, game, war, weapon",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53330": {
+      "key": "70bab4b827bb76e08f2021e28deb407d3ccf30e7",
+      "name": "Icon / syringe",
+      "description": "medicine, medical, needle, pump, plunger, nozzle, blood",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52684": {
+      "key": "7f849fb5477ec599c12ab95f32a31acce1bba5d8",
+      "name": "Icon / table-2",
+      "description": "spreadsheet, grid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52959": {
+      "key": "5c851cc0eedbb1ab69ddd61926c40e70ef6612cc",
+      "name": "Icon / table-cells-merge",
+      "description": "spreadsheet, grid, row",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52683": {
+      "key": "e1acfd38ba424f005f1663e993507be57443436b",
+      "name": "Icon / table-cells-split",
+      "description": "spreadsheet, grid, row",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53568": {
+      "key": "0c71d0376cbae44a0ed3ed22386307bc79dd2c09",
+      "name": "Icon / table-columns-split",
+      "description": "spreadsheet, grid, cut, break, divide, separate, segment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52681": {
+      "key": "92ca14ffaf923422e1afe8e730ebf2286ab0dde9",
+      "name": "Icon / table-of-contents",
+      "description": "toc, outline, navigation, document structure, index, overview, sections, chapters, content, documentation, manual, knowledge base, faq",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52680": {
+      "key": "80a1f7b4361cadbf22714298aef0e644f3641637",
+      "name": "Icon / table-properties",
+      "description": "property list, plist, spreadsheet, grid, dictionary, object, hash",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52679": {
+      "key": "677a494f214854a63b7b7e17b255695ce8822587",
+      "name": "Icon / table-rows-split",
+      "description": "spreadsheet, grid, cut, break, divide, separate, segment",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52678": {
+      "key": "2981d8da9a73b5458b3a866cd8567fed9c1fe2f4",
+      "name": "Icon / table",
+      "description": "spreadsheet, grid",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52677": {
+      "key": "292e3f55e15fb54acd2bb61fcd0c9c7810508040",
+      "name": "Icon / tablet-smartphone",
+      "description": "responsive, screens, browser, testing, mobile",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52676": {
+      "key": "918455808d240c624a0788593d12a3641a0c3b84",
+      "name": "Icon / tablet",
+      "description": "device",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53912": {
+      "key": "c4d300de449832069b13c42113ae7afd7fafcf7c",
+      "name": "Icon / tablets",
+      "description": "medicine, medication, drug, prescription, pills, pharmacy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54140": {
+      "key": "1acc5c1f922f215d0ecef3301167ae3914f2ea19",
+      "name": "Icon / tag",
+      "description": "label, badge, ticket, mark",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52675": {
+      "key": "b83edb7c4ddbf2c3f0da9aa50088a8bdcb4b2e40",
+      "name": "Icon / tags",
+      "description": "labels, badges, tickets, marks, copy, multiple",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54045": {
+      "key": "2ab7f650b8707587db28eaa080a3e57f8186393b",
+      "name": "Icon / tally-1",
+      "description": "count, score, enumerate, days, one, 1, first, bar, prison, cell, sentence",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53483": {
+      "key": "4d8eb77dee60839ddffc25b3192eb07d13419c98",
+      "name": "Icon / tally-2",
+      "description": "count, score, enumerate, days, two, 2, second, double, bars, prison, cell, sentence",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52674": {
+      "key": "9dae810eb748ab1e47e4e532ce53a1f91cdb9665",
+      "name": "Icon / tally-3",
+      "description": "count, score, enumerate, days, three, 3, third, triple, bars, prison, cell, sentence",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52673": {
+      "key": "bee6bbaa94677475684abcf7b2012ee878a5f79e",
+      "name": "Icon / tally-4",
+      "description": "count, score, enumerate, days, 4, fourth, quadruple, bars, prison, cell, sentence",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52672": {
+      "key": "9cc26819cbb17cf3a441dea276e3848ced19c73e",
+      "name": "Icon / tally-5",
+      "description": "count, score, enumerate, days, five, 5, fifth, bars, prison, cell, sentence, slash, /",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53025": {
+      "key": "0730e8019e7cd24b6244b986d43a0bf64ada7aa1",
+      "name": "Icon / tangent",
+      "description": "tangential, shape, circle, geometry, trigonometry, bezier curve",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52984": {
+      "key": "95657fbfb623d96a3ad807ea076d8b62c8f875d3",
+      "name": "Icon / target",
+      "description": "logo, bullseye, deadline, projects, overview, work, productivity",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52671": {
+      "key": "343691eb3d32adb0bc543aa618cd7787d105387e",
+      "name": "Icon / telescope",
+      "description": "astronomy, space, discovery, exploration, explore, vision, perspective, focus, stargazing, observe, view",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54152": {
+      "key": "7dd863770b7ecece8a545de81a37484797dc0d35",
+      "name": "Icon / tent-tree",
+      "description": "camping, campsite, holiday, retreat, nomadic, wilderness, outdoors",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52670": {
+      "key": "a5bfb0852933e226822635baf4163acaeb85cf28",
+      "name": "Icon / tent",
+      "description": "tipi, teepee, wigwam, lodge, camping, campsite, holiday, retreat, nomadic, native american, indian, wilderness, outdoors",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53239": {
+      "key": "85dccf62f331b4455a4546cc38706225ae2cf93e",
+      "name": "Icon / terminal",
+      "description": "code, command line, prompt, shell",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52668": {
+      "key": "6703d629049191bcbd3707380c2a6955bf7e6b4e",
+      "name": "Icon / test-tube-diagonal",
+      "description": "tube, vial, phial, flask, ampoule, ampule, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53499": {
+      "key": "8f6650c6a82b04369df6e380322adf206e78db09",
+      "name": "Icon / test-tube",
+      "description": "tube, vial, phial, flask, ampoule, ampule, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52667": {
+      "key": "80b1fccedf0e786b96a3e0365827abed68eec2c8",
+      "name": "Icon / test-tubes",
+      "description": "tubes, vials, phials, flasks, ampoules, ampules, lab, chemistry, experiment, test",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52665": {
+      "key": "7163709260bba1da860e8046c2f3aba59a6f9265",
+      "name": "Icon / text-cursor-input",
+      "description": "select",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52710": {
+      "key": "bea5107edc863694f41598f01d544f441cf25fcc",
+      "name": "Icon / text-cursor",
+      "description": "select",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53698": {
+      "key": "ffdd849916dc0fb1726ade249400a57e0b130543",
+      "name": "Icon / text-quote",
+      "description": "blockquote, quotation, indent, reply, response",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53182": {
+      "key": "f29c86e87df9f5bf2a00e32d806fd36345fec7de",
+      "name": "Icon / text-search",
+      "description": "find, data, copy, txt, pdf, document, scan, magnifier, magnifying glass, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52664": {
+      "key": "5d7d2e4550d49a4e4b4f090895e32dd50fdc4cc1",
+      "name": "Icon / text-select",
+      "description": "find, search, selection, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52884": {
+      "key": "51f1ea795fc193edfb0d64f57b822e590ef5913b",
+      "name": "Icon / text",
+      "description": "find, search, data, txt, pdf, document",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52663": {
+      "key": "bb28139778e2b5356905e35edaebcc2f492d5eef",
+      "name": "Icon / theater",
+      "description": "theater, theatre, entertainment, podium, stage, musical",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52980": {
+      "key": "e2329b9914f9701f3e4a2f3ac7fc70ed6eb73e13",
+      "name": "Icon / thermometer-snowflake",
+      "description": "temperature, celsius, fahrenheit, weather, cold, freeze, freezing",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52661": {
+      "key": "783c19f6a15b8efedba334b57b1337c97a5082ab",
+      "name": "Icon / thermometer-sun",
+      "description": "temperature, celsius, fahrenheit, weather, warm, hot",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52722": {
+      "key": "ef858d5b33f282687a7ad24d128713090529430e",
+      "name": "Icon / thermometer",
+      "description": "temperature, celsius, fahrenheit, weather",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52882": {
+      "key": "0108f0236106105fe641843ffd321825110609e4",
+      "name": "Icon / thumbs-down",
+      "description": "dislike, bad, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52795": {
+      "key": "0cee1c61c8de5966dd8727259e7f99dcea3fd6b1",
+      "name": "Icon / thumbs-up",
+      "description": "like, good, emotion",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53216": {
+      "key": "6085b3357e016a8b3f64695319b9981b9f660226",
+      "name": "Icon / ticket-check",
+      "description": "entry, pass, voucher, event, concert, show, booked, purchased, receipt, redeemed, validated, verified, certified, checked, used",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52660": {
+      "key": "27155dee4c56feecee3f2311bc0857aafe232df2",
+      "name": "Icon / ticket-minus",
+      "description": "entry, pass, voucher, event, concert, show, remove, cancel, unbook, subtract, decrease, -",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53685": {
+      "key": "546e8769876854d7a0af100bcb44084cdfd1ce3f",
+      "name": "Icon / ticket-percent",
+      "description": "discount, reduced, offer, voucher, entry, pass, event, concert, show, book, purchase, %",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53876": {
+      "key": "33c293251af4f694668e337ce63dd19511c881d5",
+      "name": "Icon / ticket-plus",
+      "description": "entry, pass, voucher, event, concert, show, book, purchase, add, +",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52659": {
+      "key": "4ef7308923e58365c3c2c6fa0bc4b4c8d8ec9051",
+      "name": "Icon / ticket-slash",
+      "description": "entry, pass, voucher, event, concert, show, redeemed, used, marked, checked, verified, spoiled, invalidated, void, denied, refused, banned, barred, forbidden, prohibited, cancelled, cancellation, refunded, delete, remove, clear, error",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52845": {
+      "key": "32c5e1276e34f7bf9ed57bceef8a6073fdd016a0",
+      "name": "Icon / ticket-x",
+      "description": "entry, pass, voucher, event, concert, show, cancelled, cancellation, refunded, used, void, invalidated, spoiled, denied, refused, banned, barred, forbidden, prohibited, delete, remove, clear, error, x",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53771": {
+      "key": "997ee46c2bafd7669037580c8e6e937aadc0f26f",
+      "name": "Icon / ticket",
+      "description": "entry, pass, voucher, event, concert, show, perforated, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52658": {
+      "key": "a8c3d404c846fbc680bd35d8bce87a4d1eeaec5e",
+      "name": "Icon / tickets-plane",
+      "description": "plane, trip, airplane, flight, travel, fly, takeoff, vacation, passenger, pass, check-in, airport",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52997": {
+      "key": "b352d97ae17f168212ba59afad03f1e624d73cd1",
+      "name": "Icon / tickets",
+      "description": "trip, travel, pass, entry, voucher, event, concert, show, perforated, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54062": {
+      "key": "ba5398b3cb884823cd41d92ee990915addf660c4",
+      "name": "Icon / timer-off",
+      "description": "time, timer, stopwatch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52657": {
+      "key": "35c875408a7f9064db125e940ce3fce10ffc4924",
+      "name": "Icon / timer-reset",
+      "description": "time, timer, stopwatch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53222": {
+      "key": "9571e06d5b713bb0e2d619ba6b391aa8dc98c3c0",
+      "name": "Icon / timer",
+      "description": "time, timer, stopwatch",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53724": {
+      "key": "80cef72f13260ae502f1254093b5a5278fdefa06",
+      "name": "Icon / toggle-left",
+      "description": "on, off, switch, boolean",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53225": {
+      "key": "cd66e653f1ac8b75b1d9f97a541040eb427512a3",
+      "name": "Icon / toggle-right",
+      "description": "on, off, switch, boolean",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52656": {
+      "key": "b3454afe05554939703e747bf0d97ecb9c8ffa4a",
+      "name": "Icon / toilet",
+      "description": "toilet, potty, bathroom, washroom",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53938": {
+      "key": "c475fed552f28ae36c495b6f92d99bb3a4682d19",
+      "name": "Icon / tornado",
+      "description": "weather, wind, storm, hurricane",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52872": {
+      "key": "2dd7ee63e61fd399d90efdddb5429f4d46f42ea8",
+      "name": "Icon / torus",
+      "description": "donut, doughnut, ring, hollow, 3d, fast food, junk food, snack, treat, sweet, sugar, dessert",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53420": {
+      "key": "5af6b941755b6412d6a2b678f51a41c8fc4f09ec",
+      "name": "Icon / touchpad-off",
+      "description": "trackpad, cursor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52655": {
+      "key": "cde6b91a45d3be7f11cb7ccd29b7ede5601f05a2",
+      "name": "Icon / touchpad",
+      "description": "trackpad, cursor",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53995": {
+      "key": "5fd2c7c1c7f5c29b9d62854011f67c5b3f79347f",
+      "name": "Icon / tower-control",
+      "description": "airport, travel, tower, transportation, lighthouse",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52654": {
+      "key": "f0cd4471971c6467ba9d3478671c39401630d65b",
+      "name": "Icon / toy-brick",
+      "description": "lego, block, addon, plugin, integration",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52653": {
+      "key": "a4d1ea203123f692ce9b05d32742f4a46743e185",
+      "name": "Icon / tractor",
+      "description": "farming, farmer, ranch, harvest, equipment, vehicle",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54145": {
+      "key": "595925c8daa5faec953f1c0dcf5a4daf82762f94",
+      "name": "Icon / traffic-cone",
+      "description": "roadworks, tarmac, safety, block",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52688": {
+      "key": "9ee32707e94592e3003385e0438b4f64f12100e4",
+      "name": "Icon / train-front-tunnel",
+      "description": "railway, metro, subway, underground, speed, bullet, fast, track, line",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52738": {
+      "key": "26fa8a47a69573e9fcd5e0b140f7b84a7b63f1de",
+      "name": "Icon / train-front",
+      "description": "railway, metro, subway, underground, high-speed, bullet, fast, track, line",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52694": {
+      "key": "0535d1bd94afc2ab89579df1e08fb0c804f6cb2c",
+      "name": "Icon / train-track",
+      "description": "railway, line",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52699": {
+      "key": "89582c5c9991b8bf2746a5a762e9614e0938b92f",
+      "name": "Icon / tram-front",
+      "description": "railway, metro, subway, underground, track, line, tourism",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52652": {
+      "key": "263c09ea30831ce4092c79e81646e080c0af036e",
+      "name": "Icon / transgender",
+      "description": "gender, inclusive",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53346": {
+      "key": "97c17e7254fb61e97681ecaed269444125b205d1",
+      "name": "Icon / trash-2",
+      "description": "garbage, delete, remove, bin",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52651": {
+      "key": "b758ad832c1035936a1664a9ac22acc948eaf75e",
+      "name": "Icon / tree-deciduous",
+      "description": "tree, forest, park, nature",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53932": {
+      "key": "f09242a0471ce272b711497a9225442c2a544f02",
+      "name": "Icon / tree-palm",
+      "description": "vacation, leisure, island",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53629": {
+      "key": "0cd361085cd8fd4bd24b8e1eb61d3e27faf5b61c",
+      "name": "Icon / tree-pine",
+      "description": "tree, pine, forest, park, nature",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52650": {
+      "key": "f6b411bb3bff8f348978264bc788971b38fd4125",
+      "name": "Icon / trees",
+      "description": "tree, forest, park, nature",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52649": {
+      "key": "9feba434867181af6c0c8d43032c79cd9e013501",
+      "name": "Icon / trello",
+      "description": "logo, brand",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52648": {
+      "key": "fcdbd48378d0b22a16c4f4e4a9aa2f518730b879",
+      "name": "Icon / trending-down",
+      "description": "statistics",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53520": {
+      "key": "f1e9358bf86fb375bc99da42026d011fe96bd982",
+      "name": "Icon / trending-up-down",
+      "description": "arrows, estimated, indeterminate, data fluctuation, uncertain, forecast, variable, prediction, dynamic, volatile",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54127": {
+      "key": "a39a927a0023f248d81c90abdfb834cd84a669ca",
+      "name": "Icon / triangle-alert",
+      "description": "warning, alert, danger, exclamation mark, linter",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52647": {
+      "key": "e46f7b7f9cbd4953d0fd5513c19cbdddd88ab77a",
+      "name": "Icon / triangle-dashed",
+      "description": "equilateral, delta, shape, pyramid, hierarchy, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52646": {
+      "key": "5fbfb7679f7bd0364f14b0c8484bdac1afd9e91d",
+      "name": "Icon / triangle-right",
+      "description": "volume, controls, controller, tv remote, geometry, delta, ramp, slope, incline, increase",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52799": {
+      "key": "64cb4c89df729117416d88a36c96d96ddaa87589",
+      "name": "Icon / triangle",
+      "description": "equilateral, delta, shape, pyramid, hierarchy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53486": {
+      "key": "b68a5774e55e14d1e4c8752c31fe8fd61e2e749f",
+      "name": "Icon / trophy",
+      "description": "prize, sports, winner, achievement, award, champion, celebration, victory",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53681": {
+      "key": "e4a64a62e01153b25f3180b894da818f5029f0f9",
+      "name": "Icon / truck-electric",
+      "description": "delivery, van, shipping, haulage, lorry, electric",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52644": {
+      "key": "8d51abadd4b2303c2fb5f402cb649f5933252a64",
+      "name": "Icon / truck",
+      "description": "delivery, van, shipping, haulage, lorry",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53381": {
+      "key": "9766a42fbfff0cc3763ab9089a1ad12e332ee661",
+      "name": "Icon / turtle",
+      "description": "animal, pet, tortoise, slow, speed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52682": {
+      "key": "000e871b8b06195d7789716f2dd42388674e7bf2",
+      "name": "Icon / tv-minimal-play",
+      "description": "flatscreen, television, stream, display, widescreen, high-definition, hd, 1080p, 4k, 8k, smart, digital, video, movie, live, ott, running, start, film, home cinema, entertainment, showtime, channels, catchup",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54064": {
+      "key": "5efe4535edaa4fabc87bb8045f52638665f72d11",
+      "name": "Icon / tv-minimal",
+      "description": "flatscreen, television, stream, display, widescreen, high-definition, hd, 1080p, 4k, 8k, smart, digital, video, home cinema, entertainment, showtime, channels, catchup",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52643": {
+      "key": "65ec929ceafef6263584681236d721d004baa28b",
+      "name": "Icon / tv",
+      "description": "television, stream, display, widescreen, high-definition, hd, 1080p, 4k, 8k, smart, digital, video, entertainment, showtime, channels, terrestrial, satellite, cable, broadcast, live, frequency, tune, scan, aerial, receiver, transmission, signal, connection, connectivity",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52642": {
+      "key": "1f4d8fa22cf6392538a585ba9c88d51699978cd0",
+      "name": "Icon / twitch",
+      "description": "logo, social",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52641": {
+      "key": "0755b8fa895215cfe6989393a82495a7cee20383",
+      "name": "Icon / twitter",
+      "description": "logo, social",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52706": {
+      "key": "4ece330a52d0eb2c38c80b8fe85ad76d32864c70",
+      "name": "Icon / type-outline",
+      "description": "text, font, typography, silhouette, profile, contour, stroke, line",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53317": {
+      "key": "698625365c87a2aac77835f6bf5dd872dc1730f3",
+      "name": "Icon / type",
+      "description": "text, font, typography",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52977": {
+      "key": "08fff154805c975089689d20758d4eb53a103cfc",
+      "name": "Icon / umbrella-off",
+      "description": "rain, weather, uncovered, uninsured, antivirus, unprotected, risky",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53657": {
+      "key": "16560821ff0bbed00e0a2960747dcb34a741281d",
+      "name": "Icon / umbrella",
+      "description": "rain, weather",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52640": {
+      "key": "5b7bab0aeaaae74bf4fd1e312727089ad92c5eac",
+      "name": "Icon / underline",
+      "description": "text, format",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52730": {
+      "key": "251c2af2ff1ab40dc0ea935d7f9875c0987ac18c",
+      "name": "Icon / undo-2",
+      "description": "redo, rerun, history, back, return, reverse, revert, direction, u-turn",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53656": {
+      "key": "d7b466390395ac0092d25bbd679dc10afacb104e",
+      "name": "Icon / undo-dot",
+      "description": "redo, history, step, back",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52638": {
+      "key": "aec64b74e12f14ecdc35057c8ae98d10a71a2de7",
+      "name": "Icon / undo",
+      "description": "redo, rerun, history",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52971": {
+      "key": "5ba1309e6ed3dc86405fa6e200b43f8c6f6b959f",
+      "name": "Icon / unfold-horizontal",
+      "description": "arrow, collapse, fold, vertical, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52637": {
+      "key": "2d69e57aaf70b4fadb5e4980a35235c4ded29b8c",
+      "name": "Icon / unfold-vertical",
+      "description": "arrow, expand, vertical, dashed",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52636": {
+      "key": "14a265862f71d0e6a75ed156017f225fa79498ff",
+      "name": "Icon / ungroup",
+      "description": "cubes, packages, parts, units, collection, cluster, separate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53961": {
+      "key": "a5f5b3775cad9feb87481f3a932cf6fefb7b2c23",
+      "name": "Icon / university",
+      "description": "building, education, childhood, school, college, academy, institute",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52635": {
+      "key": "c8b83703ae225190f834dc6531a6a31990e959c4",
+      "name": "Icon / unlink-2",
+      "description": "url, unchain",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52634": {
+      "key": "2ab4fd73904b7bc91ee2be54624aefece5e25d23",
+      "name": "Icon / unlink",
+      "description": "url, unchain",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52633": {
+      "key": "3826deb8134c45df455d00e28612e0b215bd21ac",
+      "name": "Icon / unplug",
+      "description": "electricity, energy, electronics, socket, outlet, disconnect",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52631": {
+      "key": "4445399a31010a49d3d83eb34d6b5a6226990dd8",
+      "name": "Icon / upload",
+      "description": "file",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53275": {
+      "key": "cc163c51b8fae0a1466cfa51d5c190ebe212ddda",
+      "name": "Icon / usb",
+      "description": "universal, serial, bus, controller, connector, interface",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52630": {
+      "key": "5bce2fbc587a31ec21025c39d8b1d1511e47195a",
+      "name": "Icon / user-check",
+      "description": "followed, subscribed, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52755": {
+      "key": "0459e8a6af6baccab2a0fbab94902f14e96fd687",
+      "name": "Icon / user-cog",
+      "description": "settings, edit, cog, gear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53387": {
+      "key": "ddb2f3efd65ce2af8d1f046c06f7df661445299e",
+      "name": "Icon / user-lock",
+      "description": "person, lock, locked, account, secure",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52629": {
+      "key": "d6c1df9bc1da1896145278e9b6cdf5e5bffa25cd",
+      "name": "Icon / user-minus",
+      "description": "delete, remove, unfollow, unsubscribe",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52669": {
+      "key": "04e4a94f36176be4d85df5baf22b726f69f9f121",
+      "name": "Icon / user-pen",
+      "description": "person, account, contact, profile, edit, change",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52628": {
+      "key": "9ab27a7d85ca7052eec287da8f7b4c93132553cc",
+      "name": "Icon / user-plus",
+      "description": "new, add, create, follow, subscribe",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53841": {
+      "key": "951fb4bfcda7b9b7b5f26d3a8939e3dd1141eb5f",
+      "name": "Icon / user-round-check",
+      "description": "followed, subscribed, done, todo, tick, complete, task",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52867": {
+      "key": "2905b90eb0bd4a06900c431f37babf0fd0d83e74",
+      "name": "Icon / user-round-cog",
+      "description": "settings, edit, cog, gear",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52627": {
+      "key": "5881c3756c1600a3ffe29eeb5a8b0cb786e54b0b",
+      "name": "Icon / user-round-minus",
+      "description": "delete, remove, unfollow, unsubscribe",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52626": {
+      "key": "77aaf8c7240f6abdc6db4b391f52775b8f91b5ff",
+      "name": "Icon / user-round-pen",
+      "description": "person, account, contact, profile, edit, change",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52625": {
+      "key": "f6da36c5d36e2090a3b535efeec52a9604fe5360",
+      "name": "Icon / user-round-plus",
+      "description": "new, add, create, follow, subscribe",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53684": {
+      "key": "e2d1d5acc2fd5ab03174f8f0688568a214850c89",
+      "name": "Icon / user-round-search",
+      "description": "person, account, contact, find, scan, magnifier, magnifying glass, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52703": {
+      "key": "44be14ff312365a553cac44da1bac8184f038243",
+      "name": "Icon / user-round-x",
+      "description": "delete, remove, unfollow, unsubscribe, unavailable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52624": {
+      "key": "20e281ad8cd49a12df6e1bfd82545ea056a00d6e",
+      "name": "Icon / user-round",
+      "description": "person, account, contact",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53138": {
+      "key": "d711132d6a53d61c79283e4de5e38c202c9dc247",
+      "name": "Icon / user-search",
+      "description": "person, account, contact, find, scan, magnifier, magnifying glass, lens",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52623": {
+      "key": "91e42ee4881ab53db017ba162470a49aa2f11a0d",
+      "name": "Icon / user-x",
+      "description": "delete, remove, unfollow, unsubscribe, unavailable",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52854": {
+      "key": "d52970eee3e306960c544c1c3d59b54cff056d73",
+      "name": "Icon / users-round",
+      "description": "group, people",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52662": {
+      "key": "d782ac4748d4acf26d619046c22c0af651baa870",
+      "name": "Icon / users",
+      "description": "group, people",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52713": {
+      "key": "e94b426892ef3389f82b847821765bd826467830",
+      "name": "Icon / utensils-crossed",
+      "description": "fork, knife, cutlery, flatware, tableware, silverware, food, restaurant, meal, breakfast, dinner, supper",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52622": {
+      "key": "1190a1f73b7686923883a1441180e2bb035ddeec",
+      "name": "Icon / utensils",
+      "description": "fork, knife, cutlery, flatware, tableware, silverware, food, restaurant, meal, breakfast, dinner, supper",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52621": {
+      "key": "6a3d27dcc98082a80f576cee6b829ccd471ae1c2",
+      "name": "Icon / utility-pole",
+      "description": "electricity, energy, transmission line, telegraph pole, power lines, phone",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54040": {
+      "key": "1b38717f7eb1374c4be693e2eb9000f68b8e6947",
+      "name": "Icon / variable",
+      "description": "code, coding, programming, symbol, calculate, algebra, x, parentheses, parenthesis, brackets, parameter, (, )",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52620": {
+      "key": "398783eda2d09dc8d51ab99f40b4d8a5cc7cbb5e",
+      "name": "Icon / vault",
+      "description": "safe, lockbox, deposit, locker, coffer, strongbox, safety, secure, storage, valuables, bank",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53005": {
+      "key": "26d2653e69f9e28fdd17a3d0d834ae8ae164bd6a",
+      "name": "Icon / vegan",
+      "description": "vegetarian, fruitarian, herbivorous, animal rights, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54120": {
+      "key": "98ebe8e1da4e84e2973e2effdc03b6f993e5c604",
+      "name": "Icon / venetian-mask",
+      "description": "mask, masquerade, impersonate, secret, incognito",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52746": {
+      "key": "06d453698c92b639ce175c69db29c5702bed9a63",
+      "name": "Icon / venus-and-mars",
+      "description": "gender, sex, intersex, androgynous, hermaphrodite",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52891": {
+      "key": "47e4ef18204823f4e8132e1bf5de98f465929f33",
+      "name": "Icon / venus",
+      "description": "gender, sex, female, feminine, woman, girl",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52716": {
+      "key": "99240f54d7893919ea86446c521ceb0e35e58541",
+      "name": "Icon / vibrate-off",
+      "description": "smartphone, notification, rumble, haptic feedback, notifications, screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53458": {
+      "key": "9dae2f07e567c89746f5ed399a3052af21372fad",
+      "name": "Icon / vibrate",
+      "description": "smartphone, notification, rumble, haptic feedback, screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52619": {
+      "key": "7b5390757da2d4e08b70be1a7f7b4ebccbc60f55",
+      "name": "Icon / video-off",
+      "description": "camera, movie, film",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53530": {
+      "key": "dfada2954a866b1bfc6da42731c520d7eb18211e",
+      "name": "Icon / video",
+      "description": "camera, movie, film, recording, motion picture, camcorder, reel",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52618": {
+      "key": "361c2e9e374be5abf6b438fd20ab02cb5d4bcbf9",
+      "name": "Icon / videotape",
+      "description": "vhs, movie, film, recording, motion picture, showreel, cassette",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52617": {
+      "key": "ed6190c9b659d44f593612193deaa46e14108f76",
+      "name": "Icon / view",
+      "description": "eye, look",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53485": {
+      "key": "63803e94c0133d5b7229b9cc32c3911a16632425",
+      "name": "Icon / voicemail",
+      "description": "phone, cassette, tape, reel, recording, audio",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52948": {
+      "key": "46d5d5e6f82b83a0d81c6192b974c67344dae331",
+      "name": "Icon / volleyball",
+      "description": "beach, sand, net, holiday, vacation, summer, soccer, football, futbol, kick, pitch, goal, score, bounce, leather, wool, yarn, knitting, sewing, thread, embroidery, textile",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52616": {
+      "key": "609a0b9112edae2609e01b14abff89cb1eb9ec9b",
+      "name": "Icon / volume-1",
+      "description": "music, sound, speaker",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52615": {
+      "key": "d9d224f39adbee91cdd57293605bb162ab738632",
+      "name": "Icon / volume-2",
+      "description": "music, sound, speaker",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52809": {
+      "key": "b6545f6dad78c141eb2416928ba6e70be70346cf",
+      "name": "Icon / volume-off",
+      "description": "music, sound, mute, speaker",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52614": {
+      "key": "f6264caba101f8d764283b6d4f6a2c1d101ebab7",
+      "name": "Icon / volume-x",
+      "description": "music, sound, mute, speaker",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52613": {
+      "key": "46b51d7ab76440640b2dba8dfcb36022a5e0c389",
+      "name": "Icon / volume",
+      "description": "music, sound, mute, speaker",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53991": {
+      "key": "cd699564c83905d4d457052c7065f76f0b320a56",
+      "name": "Icon / vote",
+      "description": "vote, poll, ballot, political, social, check, tick",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52639": {
+      "key": "5b4f4e0557f2a515b052a3101858af67205318e2",
+      "name": "Icon / wallet-cards",
+      "description": "money, finance, pocket, credit, purchase, payment, shopping, retail, consumer, cc",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52666": {
+      "key": "aecfacf9ff029b7df92ef1079fc59a88524bb0a2",
+      "name": "Icon / wallet-minimal",
+      "description": "finance, pocket",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52645": {
+      "key": "3055661a93b06986a5faddd7b59f06079ef3c4fe",
+      "name": "Icon / wallet",
+      "description": "money, finance, pocket",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52632": {
+      "key": "9809ace272098fb3859851cfdbd02fd6d419a6aa",
+      "name": "Icon / wallpaper",
+      "description": "cover, lock screen",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52612": {
+      "key": "d5001611086dc23da64d7c675c0b58d4a5393c43",
+      "name": "Icon / wand-sparkles",
+      "description": "magic, wizard, magician",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53351": {
+      "key": "8d47e99647e67144288bf00584681666e393aa14",
+      "name": "Icon / wand",
+      "description": "magic, selection",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52808": {
+      "key": "82c1f0d23cfa79cc53d9aa1c42f98d7624f30883",
+      "name": "Icon / warehouse",
+      "description": "storage, storehouse, depot, depository, repository, stockroom, logistics, building",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52944": {
+      "key": "c2a198d2b23c412c41dfbfcb8da68670f02881ad",
+      "name": "Icon / washing-machine",
+      "description": "tumble dryer, amenities, electronics, cycle, clothes, rinse, spin, drum",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54057": {
+      "key": "e53cecd9fd9ab7a268b6ac508150201bd650491d",
+      "name": "Icon / watch",
+      "description": "clock, time",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53054": {
+      "key": "82a2da2270e375e6cd135119d4c0d75e101ba879",
+      "name": "Icon / waves-ladder",
+      "description": "swimming, water, pool, lifeguard, ocean, \ud83c\udf0a, \ud83c\udfca\u200d\u2642\ufe0f, \ud83c\udfca\u200d\u2640\ufe0f, \ud83c\udfca, \ud83e\udd7d",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52968": {
+      "key": "9ae9677b9b3c053c233e931b79ecee27569d9dd0",
+      "name": "Icon / waves",
+      "description": "water, sea, sound, hertz, wavelength, vibrate",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53125": {
+      "key": "94bee96b69a665e6cb870e5982a9cb3d7f62997f",
+      "name": "Icon / waypoints",
+      "description": "indirection, vpn, virtual private network, proxy, connections, bounce, reroute, path, journey, planner, stops, stations, shared, spread, viral",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53564": {
+      "key": "49aed63094307f11e94b9cf3611739a39eec7ad3",
+      "name": "Icon / webcam",
+      "description": "camera, security",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52701": {
+      "key": "e500f6de7380a261e613d4165a07590bcd430a23",
+      "name": "Icon / webhook-off",
+      "description": "push api, interface, callback",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52611": {
+      "key": "9db897c2dfdc8290cbf054f89d92f87626fb8cba",
+      "name": "Icon / webhook",
+      "description": "push api, interface, callback",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52610": {
+      "key": "a7d65a19b977e74cf05bc990e21f2f0c21ca6556",
+      "name": "Icon / weight",
+      "description": "mass, heavy, lead, metal, measure, geometry, scales, balance",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52609": {
+      "key": "d3cb899140dd11755b339761d25bb07b3d689ac8",
+      "name": "Icon / wheat-off",
+      "description": "corn, cereal, grain, gluten free, allergy, intolerance, diet",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53956": {
+      "key": "f7df0529f53a8c86e2a4996ea75feed51d26074d",
+      "name": "Icon / wheat",
+      "description": "corn, cereal, grain, gluten",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53270": {
+      "key": "dfde6286e7079221ac6a9039ead192c2e6a84a28",
+      "name": "Icon / whole-word",
+      "description": "text, selection, letters, characters, font, typography",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53467": {
+      "key": "4bb57cd2ef3f74782e8c2f1e4fcc7db5749e6ddf",
+      "name": "Icon / wifi-high",
+      "description": "connection, signal, wireless",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52933": {
+      "key": "8bd83d6a27a70445878641c8d4bd90ae7f11a67a",
+      "name": "Icon / wifi-low",
+      "description": "connection, signal, wireless",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52608": {
+      "key": "ee1dd432c5ee449559f8f33ba63d29ff3fbe76a6",
+      "name": "Icon / wifi-off",
+      "description": "disabled",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53847": {
+      "key": "d19feb12dd944c162e6593152268dea29712eeaa",
+      "name": "Icon / wifi-pen",
+      "description": "edit, wifi, pen, change, network",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52607": {
+      "key": "2fb61f6bfe24733fa555f127de36b79b9b59660b",
+      "name": "Icon / wifi-zero",
+      "description": "connection, signal, wireless",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:54143": {
+      "key": "c7820d293950b47f1472f30603f2235291db5712",
+      "name": "Icon / wifi",
+      "description": "connection, signal, wireless",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52606": {
+      "key": "5c2fc26ac71247f95ae36d775eb89d73aa31870c",
+      "name": "Icon / wind-arrow-down",
+      "description": "weather, air, pressure, blow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52929": {
+      "key": "d74d5182f7de80fd428039e5583e479fad5c103e",
+      "name": "Icon / wind",
+      "description": "weather, air, blow",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53704": {
+      "key": "c8d19253900c3a907cb3ff53a80a17df2778fc55",
+      "name": "Icon / wine-off",
+      "description": "alcohol, beverage, drink, glass, alcohol free, abstinence, abstaining, teetotalism, allergy, intolerance",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53085": {
+      "key": "795d28fb1f940910eaa6661f0d9c2c1476ab8679",
+      "name": "Icon / wine",
+      "description": "alcohol, beverage, bar, drink, glass, sommelier, vineyard, winery",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53783": {
+      "key": "ddc7c742fab67946478fb0a78a1f9c1e633975ce",
+      "name": "Icon / workflow",
+      "description": "action, continuous integration, ci, automation, devops, network, node, connection",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52605": {
+      "key": "ce473149d8318c7ea205887ff133587362e4810b",
+      "name": "Icon / worm",
+      "description": "invertebrate, grub, larva, snake, crawl, wiggle, slither, pest control, computer virus, malware",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53069": {
+      "key": "e015855b6f417386b0dbc2691fd1101e64eeb9e4",
+      "name": "Icon / wrap-text",
+      "description": "words, lines, break, paragraph",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53007": {
+      "key": "752e7de5e2de46e2792f2b597d088a7c4d9bc165",
+      "name": "Icon / wrench",
+      "description": "account, settings, spanner, diy, toolbox, build, construction",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52923": {
+      "key": "824e7cec95416e144c55ba410c579ffd0efb0eb6",
+      "name": "Icon / youtube",
+      "description": "logo, social, video, play",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:53423": {
+      "key": "819d99f42a5bd89d6818a452b0e0e4481469ab90",
+      "name": "Icon / zap-off",
+      "description": "flash, camera, lightning, electricity, energy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52604": {
+      "key": "276a323fc7e5313b747da88e57296f1372247697",
+      "name": "Icon / zap",
+      "description": "flash, camera, lightning, electricity, energy",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52927": {
+      "key": "a0d470b8db9821326fffaeaac18de271b4fb978d",
+      "name": "Icon / zoom-in",
+      "description": "magnifying glass, plus",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52931": {
+      "key": "850f7cbd273f27c2e9b70a2270a49c8e8389a271",
+      "name": "Icon / zoom-out",
+      "description": "magnifying glass, plus",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52603": {
+      "key": "30cf448e6d8571097d50f46394a8ad75f6176501",
+      "name": "Icon / gift",
+      "description": "present, box, birthday, party",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52735": {
+      "key": "944e7d1c6bf8bcc65a17e4ae6cbd95bfa8382a14",
+      "name": "Icon / popcorn",
+      "description": "cinema, movies, films, salted, sweet, sugar, candy, snack",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "533:52602": {
+      "key": "ef85ddd140caa6595c766e9588eb44b664bc2927",
+      "name": "Icon / send",
+      "description": "email, message, mail, paper airplane, paper aeroplane, submit",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "66:5032": {
+      "key": "e0a4ec3f4189692fd8c2c3fdc838a3ea64105226",
+      "name": "State=Open",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5034",
+      "documentationLinks": []
+    },
+    "66:5033": {
+      "key": "c7027e7b6959dc6490606a0188898b836fbd5c5d",
+      "name": "State=Closed",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5034",
+      "documentationLinks": []
+    },
+    "66:5035": {
+      "key": "f6b385b2604fbc39459955fe22f61ff57737cbbc",
+      "name": "State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5034",
+      "documentationLinks": []
+    },
+    "66:5041": {
+      "key": "6d19abaceefae52bb3841a525c6f3542d4197531",
+      "name": "Accordion Content",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "58:5414": {
+      "key": "c094c4997ff8c40ce806df8e84ab6d8ed2660e18",
+      "name": "Type=Neutral, Flip Icon=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "58:5416",
+      "documentationLinks": []
+    },
+    "9:1070": {
+      "key": "7fc0d694f704a3a8d9ef0acf3000c0d82e729c80",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "58:5415": {
+      "key": "52aa930a07308876241f21f847bddc89e95c6322",
+      "name": "Type=Error, Flip Icon=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "58:5416",
+      "documentationLinks": []
+    },
+    "61:9637": {
+      "key": "9eb98f80bd33d65242b4342babdb73cbf28517e3",
+      "name": "Type=Neutral, Flip Icon=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "58:5416",
+      "documentationLinks": []
+    },
+    "61:9651": {
+      "key": "9c4272617f01ccfcc8a121af88c1312152ec5808",
+      "name": "Type=Error, Flip Icon=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "58:5416",
+      "documentationLinks": []
+    },
+    "139:11939": {
+      "key": "f18536acaa86e9bae0f4e96b4dbe8841edadc8b2",
+      "name": "Type=Mobile",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11941",
+      "documentationLinks": []
+    },
+    "9:1068": {
+      "key": "c8dfd5d7536428c6290a90bb835b7e1df7af4f2c",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "139:11940": {
+      "key": "690b55ba5af6d9baccf9a40def2ae4f6b5dbeec1",
+      "name": "Type=Desktop",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11941",
+      "documentationLinks": []
+    },
+    "9:1067": {
+      "key": "2ddfb9e78a8866d5ba57b148431b7dac09ba2574",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "18:1361": {
+      "key": "7543bde60d38b058b9d40c6c1d6db8313d3de7c7",
+      "name": "Picture=Off, Size=Regular, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "18:1397": {
+      "key": "a05e99f49f6b0cc3a00f7520aca1a0c88d043f35",
+      "name": "Picture=On, Size=Regular, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9413": {
+      "key": "5b7d485db2e64411577f53c9408851023de6c26d",
+      "name": "Picture=Off, Size=Small, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "761:106480": {
+      "key": "2414ba9310f788d192c9959fdc16e29d89d2e103",
+      "name": "Picture=Off, Size=Tiny, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "780:40565": {
+      "key": "ddd6330cd568637ecb1b091f7c133e2e88d1b838",
+      "name": "Picture=Off, Size=Extra Tiny, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9416": {
+      "key": "9564580218e3b71c1c52320ed3184a42116e0870",
+      "name": "Picture=On, Size=Small, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "761:106483": {
+      "key": "332ebf135b05bc914a41f67fa31aa597517ed038",
+      "name": "Picture=On, Size=Tiny, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "780:40571": {
+      "key": "18f2030c665d0d154c10de36eb0abd0c498b7cb0",
+      "name": "Picture=On, Size=Extra Tiny, Roundness Type=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9464": {
+      "key": "d7613696dfa328d95893a480eaa364ca8760195a",
+      "name": "Picture=Off, Size=Regular, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9467": {
+      "key": "47b03e2ba533ac997877e54ef130baf871b6dc23",
+      "name": "Picture=On, Size=Regular, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9448": {
+      "key": "7087e59ece95942b66fd61becf0d739acde7bbf8",
+      "name": "Picture=Off, Size=Small, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "761:106485": {
+      "key": "2beca5bf66cbe9522068bf6f9d079d6d03ed8fa6",
+      "name": "Picture=Off, Size=Tiny, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "780:40568": {
+      "key": "ad1977a72f5ab7610db1c2ef7e42692af39058b9",
+      "name": "Picture=Off, Size=Extra Tiny, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9453": {
+      "key": "6cead089b448fd0097d5e46eb38d738c7a8f5114",
+      "name": "Picture=On, Size=Small, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "761:106488": {
+      "key": "faaa7dce826a176a2f665c5040d3f2ee1295c4fe",
+      "name": "Picture=On, Size=Tiny, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "780:40573": {
+      "key": "ed7f8651bb24da54a8055bed845adc7a1f1c3006",
+      "name": "Picture=On, Size=Extra Tiny, Roundness Type=Roundrect",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1398",
+      "documentationLinks": []
+    },
+    "22:9475": {
+      "key": "4f1fac935051c44a390797f8017e9f45a8782c6d",
+      "name": "Size=Small, Type=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "22:9509",
+      "documentationLinks": []
+    },
+    "22:9507": {
+      "key": "0b628b1404cff21dadf9947f85e6d6f7379652a3",
+      "name": "Size=Regular, Type=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "22:9509",
+      "documentationLinks": []
+    },
+    "19:7020": {
+      "key": "ba3552507746e36b55d70b9279084988ecd76c2c",
+      "name": "Roundness=Default, Variant=Primary, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121927": {
+      "key": "e1198632b09a8d25ed2a86da39a30a8239fe912a",
+      "name": "Roundness=Round, Variant=Primary, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "19:7012": {
+      "key": "2ec04319b7de1ad561c9906babd1a91bc168b5e2",
+      "name": "Roundness=Default, Variant=Secondary, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121935": {
+      "key": "4b4473d46bfdb26994afb2f11d7bf384827eebff",
+      "name": "Roundness=Round, Variant=Secondary, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "19:7092": {
+      "key": "b5ca82347352043028bb77f01948cf02e831645d",
+      "name": "Roundness=Default, Variant=Outline, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121943": {
+      "key": "4780c609cbfa6bca9843a1ab8ec46ea92a6af551",
+      "name": "Roundness=Round, Variant=Outline, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "19:7068": {
+      "key": "96fd2eeca1b59b13d8379c31e0ffd70eda8ff8f8",
+      "name": "Roundness=Default, Variant=Ghost, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121951": {
+      "key": "71629e7e76a8e0f18562ba51e50e942994778bd3",
+      "name": "Roundness=Round, Variant=Ghost, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "19:7044": {
+      "key": "962abe18400fc5a45fe6484a05acbb2e3041db7c",
+      "name": "Roundness=Default, Variant=Destructive, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121959": {
+      "key": "af662e3cb37c51a3abd0d5a6035174eda9cd6302",
+      "name": "Roundness=Round, Variant=Destructive, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "162:17776": {
+      "key": "14924615acc2d216e9fbf82083e3cbd70a336392",
+      "name": "Roundness=Default, Variant=Primary, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121967": {
+      "key": "7b9b18594cfd805fc48d4802c4d735740de2a8c2",
+      "name": "Roundness=Round, Variant=Primary, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "162:17768": {
+      "key": "2dff68d07d9af775109de6f1fdc3abe3a181b49c",
+      "name": "Roundness=Default, Variant=Secondary, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121975": {
+      "key": "0f5eb948a79f48cd217b00a19b8ba55cce0ce69b",
+      "name": "Roundness=Round, Variant=Secondary, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "162:17752": {
+      "key": "55c59f76a4e41cb26e6c5444ca13c22e7ec259c8",
+      "name": "Roundness=Default, Variant=Outline, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121983": {
+      "key": "96773f1fd2f611e79eb0b7f2bd19fa9c390b7c13",
+      "name": "Roundness=Round, Variant=Outline, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "162:17760": {
+      "key": "cc646d2e74dfca523bfb1e5bd150d1de110cf777",
+      "name": "Roundness=Default, Variant=Ghost, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121991": {
+      "key": "0eb74d044f4005ddacad292cc43c7f6b2657b379",
+      "name": "Roundness=Round, Variant=Ghost, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "162:17784": {
+      "key": "5655e197008fad2ec87a87f48f23775d19071371",
+      "name": "Roundness=Default, Variant=Destructive, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "757:121999": {
+      "key": "44f276796ae8de1c731ae08bcb67944114a15cd8",
+      "name": "Roundness=Round, Variant=Destructive, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6979",
+      "documentationLinks": []
+    },
+    "68:7354": {
+      "key": "0e778909e7b9eca905963e31d9083e18d3a76de0",
+      "name": "Breadcrumb",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "13:1002": {
+      "key": "ce688c393b8e4ca68bb66ecbaecf8e95d3928dfe",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:14838": {
+      "key": "17a47d4da90e626f137fa6a6a6952ac15df95849",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15318": {
+      "key": "ec0a9da874c0930b773681aa368d838a37de7922",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19872": {
+      "key": "6eea153d2d9e10df360016b9141f858ac5c5cafb",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1064": {
+      "key": "1c7f9c6ec92b3177f205630999a81310d8d80601",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14830": {
+      "key": "7f173be5dcf297bb775f155343ce59a397440dd3",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15310": {
+      "key": "fcac750ac9b171a15a7e19cfc10acdcb411636d4",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19864": {
+      "key": "45f9c44a813fe96fd9e8d8fd81b3fdbc29ed8f32",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14862": {
+      "key": "32748cb422f79d3a8f685c683ccd09434b062e3f",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15342": {
+      "key": "e2845a4024f3809cd6c23e070e189770ea98276c",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19848": {
+      "key": "425350517fdaeb5cb6cddb547044c94d034bdacc",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14854": {
+      "key": "b3f2ed11c9d257dfc2757e1125ae19e8253435e1",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15334": {
+      "key": "ccb2e89025c97ddb9200ab3bfe600fc34c9fdaaa",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19856": {
+      "key": "7e77a719e93150511b9a940f565c46ab38c3872c",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133771": {
+      "key": "f65dbff6e895acff77196a61165914e62045b28c",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133803": {
+      "key": "9277bd7a4548a2590526ddfac352165878105d6a",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133819": {
+      "key": "cfaf176fdf1d2f61047abcc709cca1eb4a73e12c",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133787": {
+      "key": "1f0fd2bf1bb0f52036b38bc76e29720c7425d0f3",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14846": {
+      "key": "0fa6c5b55760e5ce763fd7f6e7d66663a92337df",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15326": {
+      "key": "078d5c7e82e452dba3fc2f19412517b6e87c3a46",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19880": {
+      "key": "2c8f1838f4b4dc34610b93d2e38064707d5c25bc",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1059": {
+      "key": "6eafdef44b03178f7a7d0e66d638173433bf652b",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15638": {
+      "key": "f41973bd4ac15ed939050e661ac71e47974e8e30",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:16769": {
+      "key": "b4a3b339a9c0d8d286d8a06f788963bfd74abc53",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19552": {
+      "key": "35a980a5a7d47a5bffcb90788cfbf6c37a227dc9",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1065": {
+      "key": "ec758c61e9f4ab428ca5324241182496afa2bd9e",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15630": {
+      "key": "c79ea935a273a73f797658d5e83ea7e0fe8c6ac2",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:16761": {
+      "key": "adeaf1b3a96c0196671eb7ceee902b8a5a793e5f",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19544": {
+      "key": "fe8b30dfe83474d83d5e026cd805aabe9b96e084",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1061": {
+      "key": "e1ebcf76dc8a23e1122d41ce89d3e8abf638241d",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15662": {
+      "key": "e6444ff7547226797f773a034160873a95926a86",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:16793": {
+      "key": "609a187f56cd41dc88e42656fe1d8ee6b8212f23",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19528": {
+      "key": "4469978e0c0b100d56ff72b6fa80eeac19916386",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "11:826": {
+      "key": "36b8c4cdffe73fc16aaf20cae6aa03eff816076d",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15654": {
+      "key": "2c9c7c2f3229e0e01582feef37c6ca0042d13348",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:16785": {
+      "key": "1d6cb0f3fc7a5b1b8c827597c6d30dd4db8a440c",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19536": {
+      "key": "fdf22c16c8cb8cd15a52f4e83bf04e422da0bb9e",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133835": {
+      "key": "c00eef37711520bfad8c1d828071ff3298804bb5",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133867": {
+      "key": "a9772a435d99898b2cc1d7853e1e01c512786812",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133883": {
+      "key": "676487c972e228eefa43c76783b7d51b5193d827",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133851": {
+      "key": "f513b6a1fc1924fadbf1d7792d3c8b84456af6c4",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1060": {
+      "key": "81d6c5ca3b63bbfd2e5b81c02154909aacfe1462",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:15646": {
+      "key": "f3059c7bd2af7c69bf359a09b4462375a6df107f",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:16777": {
+      "key": "9357860236c13c0fa397c34d9c03b409eb44264c",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:19560": {
+      "key": "8e91ba4cb04d13f6af97325deccb2d246ddc5f16",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1062": {
+      "key": "7bed1d7bf013cb8dac06e6090363654854ac4abc",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14198": {
+      "key": "f9bdd1284e12d170a81049a420f1ad9a2d7dbac2",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14518": {
+      "key": "77c26999fe78eb17512830282b325b81f8116345",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:17145": {
+      "key": "3d4e8578bc2ddf8f265f9d9447594fa140add0f1",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1063": {
+      "key": "616e711491195aa4daf79cd9e6148656cbd133b1",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14190": {
+      "key": "f49994ea631728ca60f998b16a2affb58d5688c0",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14510": {
+      "key": "d68d1b8e255aad2a7314e840d33ab36c62abcf99",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:17137": {
+      "key": "759f49571ad8d17f9e4057e246a967e0be913bf8",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1069": {
+      "key": "5bf9aa8e4772a4ef2ac9691d73ae3a4f21e8857a",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14222": {
+      "key": "47fb0c3eb3d7adaebf7cd317208fe9ddca4ebcb7",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14542": {
+      "key": "49746f2f905abbbbd2f588362ddad1bcd9989cc7",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:17121": {
+      "key": "86e0064d5e4061ffdcea786e6214475c35ad86f5",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "11:834": {
+      "key": "e63ed967a917ef4433e2a7453d14386f367a4a9e",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14214": {
+      "key": "425a9675108ee016444bd4c4181146eff26e36c0",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14534": {
+      "key": "4b9ecc2fbfd6b6c26614ec382366be2290d5b774",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:17129": {
+      "key": "ab7bb2a638b6db930fa868999d3357927d5bd048",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133899": {
+      "key": "7996a30693e1812ba7a6943c9a61bf96832a7944",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133931": {
+      "key": "123f3e699a12033ea515deebf6f035e746455e41",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133947": {
+      "key": "82f3230a4421d902ad75251005dd4a178d2fc497",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133915": {
+      "key": "d98530ac4c9ce6f3d63c9c4594fad80bf45951f6",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "9:1066": {
+      "key": "e1537c62ac0aadf69562b6849f8dadedbc43029e",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14206": {
+      "key": "4a6508682a4ff2cbb2195bb64626fc1d4614e94e",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:14526": {
+      "key": "0b4c9151ddf9500c9a8246326050d306ab048804",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:17153": {
+      "key": "2faf6998ad6b84c5f5bdcbc43c07b0d6f76a8eb7",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "133:14163": {
+      "key": "8c4064c49c3fc2ba9480073c87cd49dc600a998c",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13558": {
+      "key": "c5c8df0202df1c1453134f5b3dbdbeb5186b682b",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13878": {
+      "key": "c45eaf5e5bb4c34544cf631ef18d556b4eaf4cde",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:20192": {
+      "key": "13239be5b739dd6ffbde8453e0192254cd13d639",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "133:14155": {
+      "key": "14d82fc24492008f76dd1d1b56b138fb1c3f57df",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13550": {
+      "key": "5679b6a59993a1c03b01640fa7734aa38388deb1",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13870": {
+      "key": "26cfe52358da0d82cd86d063e65b0fcaaf7f141a",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:20184": {
+      "key": "9be3ff3c860e9cb791a0b508ff931d9a549b3de0",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "133:14187": {
+      "key": "260f38f15a25a7e17a56d08b224cf30e12bc98ea",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13582": {
+      "key": "0dcc584c269f42aa93eab8413cf66e040b59928d",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13902": {
+      "key": "aa3b1cad75ddc2ca59e5301a5216f42a0b3e998e",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:20168": {
+      "key": "857ed8419fe0d170f6ebbc16ab7ecdf4b2fb1c47",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "133:14179": {
+      "key": "8b45e43db7706d2ecc74c108dea1cfc2ae463b5e",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13574": {
+      "key": "1c7e4fade522714d3740911d5052005dd64202aa",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13894": {
+      "key": "ec73d5e246f3571e002ebf27875474d80270a331",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:20176": {
+      "key": "ec0b4730bed37897625494ae3bc88e28d0ef6140",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133963": {
+      "key": "71aabdb549e2eaff765a256559c06e8630eb5f11",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133995": {
+      "key": "9a9ddb28a759d70771f8622d3e1d1fc8ba2f2e1a",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:134011": {
+      "key": "4e24a900d740551b52911e89b69dae655916bfe2",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133979": {
+      "key": "98c6b42589d7c536a0d6809f35ff914d38d0aca7",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "133:14171": {
+      "key": "d86ebbd1e5bd32d23dc8e7e2de8f657ac79b83f7",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13566": {
+      "key": "ef6e75ac8bdca45232f14b81f0159f0b78610043",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "153:13886": {
+      "key": "cf6d011b00ae9bc761f90b1b15215828a8d7ea8b",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "176:20200": {
+      "key": "3d36e9872d224e9e4292a0a31403857c8a456be0",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98677": {
+      "key": "8bd399e87d6f0613802e0a6c706dfe003b46040b",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98693": {
+      "key": "d53f58dd905b1eb7c4b3c140e888c0f6dbbb0642",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98701": {
+      "key": "6e5eebbabdb61a8e3b13d555e28217b72848ec6d",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98685": {
+      "key": "dee54bf8b3ed1843952a05c65273c6a6f1c8eb39",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98549": {
+      "key": "659d7198cfe81e3928e30824d4be56f95ad5ed40",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98565": {
+      "key": "2abb3c8d94156c90735f331f0eb3c18921526899",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98573": {
+      "key": "504e43ea20818b998a4ce8970dcfe6d906e35e39",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98557": {
+      "key": "68ebb131de566b3159f330b3d0e401e5f6bedc38",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98421": {
+      "key": "cb651c95815197a405eb63aa736213a2c52d2ba8",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98437": {
+      "key": "79a897cd76394669607a8bb0344170f5a56c77da",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98445": {
+      "key": "41de6c6f957c6811959ec02d4332ad66d9c6fcfe",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98429": {
+      "key": "2f956b6b633776fc6d27e74504a3301220ac1767",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98293": {
+      "key": "d81a648477c5bc7c4d7830ae20fa6d751dca48e1",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98309": {
+      "key": "f3643725f45d4cd1496c6bcc9dec509355c7fb78",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98317": {
+      "key": "8dff4f45900b16f3960705b735cb119c5b232acf",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98301": {
+      "key": "4464cc0a68a3c8ef6b0ff4e4fe09b215f9daf74d",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133779": {
+      "key": "3a839ee7dd48afbce16452c75b8c1dc1c653efc1",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133811": {
+      "key": "ddcc599c3f9e17d1276e5de8fee48e832ae2dc6a",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133827": {
+      "key": "b7aaef6ce696bf8b30399ea226427d58c86765e2",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133795": {
+      "key": "7adc9836e3b27a6dc79200886ec2c3893c84b580",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98165": {
+      "key": "3399b251d2101c095680c7a2946ac6ea3e130a07",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98181": {
+      "key": "05c32c45fff0c4dcfbf64e607c5e4ad78b9e6e15",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98189": {
+      "key": "cad4a46d5efbecda225489c3559b7dc3d78e9bc0",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98173": {
+      "key": "4a8619d87ab07027a13b72533fafb1e2e056f148",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98709": {
+      "key": "700b134606aa7c9dec46fd6724ed808707e3e5e8",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98725": {
+      "key": "16b57ade60ac6a692324c12240c93cdf38e063a3",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98733": {
+      "key": "cb6f6e94134c4c3a2eb77e1425fb90f1368a5db9",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98717": {
+      "key": "f2c3b9a5652d459a6e44daf803db6923d2eefd0b",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98581": {
+      "key": "7bd9e8aabe71abf9fd0f5066e809d33fc83739d0",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98597": {
+      "key": "4771d19aa45328887890732e039fd44ea2d59030",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98605": {
+      "key": "31ba3b33e0a03d3dfbc8221c480444de1e3198b8",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98589": {
+      "key": "344a3c057d85ee185c3533cb15c629bdc35f408d",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98453": {
+      "key": "9ee286f2bd90b040cd0fbd924d4e978410481664",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98469": {
+      "key": "fe5652753fd30861e5dda451116088e9b3dde20d",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98477": {
+      "key": "7c5b67e3417c199233c5134f161c5d97ab0ed351",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98461": {
+      "key": "cb4fccc8e573e84c29b57ac89c54afc1c156f14b",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98325": {
+      "key": "d01a2151f083968bca14926518a0a01b4ed4190c",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98341": {
+      "key": "15659f176027d771d8ac92101646062a6303232f",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98349": {
+      "key": "bc1e5adf2f861c8f12e9183208691218e4183ee9",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98333": {
+      "key": "0a68e062b21b8dd443667d8d10070faee1563c74",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133843": {
+      "key": "3de6172ecc0f2e5955bdaf7002a1686cad8945bf",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133875": {
+      "key": "0c4d4da09ce3c9756f656caf6a21a5eb3fcd3898",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133891": {
+      "key": "647ca8a7e22bd21d66ac6404247714fa5919cb05",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133859": {
+      "key": "bc93916808a1a87dc8adf39e60757abb4480f065",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98197": {
+      "key": "30589c98fe2f3271dd93956378121ad1133d16b4",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98213": {
+      "key": "ee54d02bb22769c066ab5cf2ebd2f772499f2f5a",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98221": {
+      "key": "1083004357a8e2e16d72d6e1610f4f512204f892",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98205": {
+      "key": "48b584a35734c7a8d4ef24b3f0cb472b33d756a6",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98741": {
+      "key": "b2788bb20f268d274b93280adb54ec1d9a08ef1d",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98757": {
+      "key": "c16af4badcd9f27f5b728d986fba70bb341d8b2d",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98765": {
+      "key": "cf52a1b2a8b557fe75eb1b8a5e0f424fd1d5a75a",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98749": {
+      "key": "893662127fb14d5a91902c6b2f7e7c10af9b19de",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98613": {
+      "key": "e511a6352f8ecbf9a4a83d758f568e69840e53e3",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98629": {
+      "key": "1b6da0dddac8552cf2900d0d2e3157374beba258",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98637": {
+      "key": "8b6ac198951f12578e55c8a3076fc4c71ad94323",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98621": {
+      "key": "38c3b6e9839e7584f1a8193fc8c1c9322519c887",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98485": {
+      "key": "d30f1e766a684608c1c3150c752c788694cde7ee",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98501": {
+      "key": "32512283ffeb517df09bdc5718abe1db7c23e199",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98509": {
+      "key": "0e83b21bb54ee5791d52a587573130b5000163d3",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98493": {
+      "key": "c3a0dd325ec115bc051ed500cbc01310de541323",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98357": {
+      "key": "bccb570e45a9207f0c5e1e41b92c62713fce2628",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98373": {
+      "key": "b5bd05b68b56fd74102417077ee1a5bad2a3fcee",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98381": {
+      "key": "11e9328742993be70c4dec2462e3f46f70dab25e",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98365": {
+      "key": "6aa8461db98a0ffb5be7a3070d7cb1b0f782cb1d",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133907": {
+      "key": "73498b8edadc8479db514e94277c5f506f06caa8",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133939": {
+      "key": "d5d0554fb58dd5399972d3584a9635b1774a986b",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133955": {
+      "key": "f32d298f6afc8b109470310e29387d075816fa94",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133923": {
+      "key": "bd9850bd046ddef26725fd694008958b965ee33b",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98229": {
+      "key": "eb2909ed3db2e22c697c94d5151d04aa6d98e851",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98245": {
+      "key": "18474849256442d6e6eb1afb1d2bcf1d59822de5",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98253": {
+      "key": "80139910893bb08c785ab3c7353eb8f9411fd227",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98237": {
+      "key": "7165cbc05a5cd1a5d82826ac60f18d436b4504db",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98773": {
+      "key": "7adb4ab27724847aad1cfcd74dac961244f94444",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98789": {
+      "key": "1e7dea7e930e9caa971509b9e1b37a959d672004",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98797": {
+      "key": "baaef5226c0129d48e418c2d82e71e79ef70464c",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98781": {
+      "key": "df0f188bd00af107e184e3c2fa577176c508df7b",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98645": {
+      "key": "f545deac875de122ffe4693c9ba5cb21f79d490e",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98661": {
+      "key": "3ccd2b83f2616f12fbba32f970937c48f7955404",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98669": {
+      "key": "db269e88c5c7190096880dfff9035abb4bfe6c35",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98653": {
+      "key": "062982cab3d04f5925441b45b1b8f8eb022ac67d",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98517": {
+      "key": "cdbe312e0bb762b0e4c976f95d87cf0103d48224",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98533": {
+      "key": "0394d4a3a0ff62c187c4bc3aee60f4e50fe637dd",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98541": {
+      "key": "e876330261ecf36b4039964ae8ad2e62438b0494",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98525": {
+      "key": "2b0ad3f651922fffc9f4af96d07c2fe652d39ffa",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98389": {
+      "key": "f8280ac9c9087162c6dc0de6a0032a8a20b62edb",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98405": {
+      "key": "8c24bbd302a6a6db77aca911dfc18afc1a8d0c94",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98413": {
+      "key": "b4c05c771c57c14a22c716104b14b8e6d153c3cd",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98397": {
+      "key": "a2019c1da7d1a2a0abc116b733624c1af36a3161",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133971": {
+      "key": "398fd995c48e69a918aad54d89d3207b7cd0952b",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:134003": {
+      "key": "8c6cd49d0bce2c27c655a032800657dc466e709e",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:134019": {
+      "key": "7353ef4f2cc3094c2d3435da6c387be5da8ec41f",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "757:133987": {
+      "key": "da8dce5174d5bb1ca6b0972f5d04832273fd5644",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98261": {
+      "key": "5b9fb09f02b048dfe9e66473e02f2609803c9d2a",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98277": {
+      "key": "4358f7f8ba1db40a4b21424d7bb7587851bf433c",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98285": {
+      "key": "877977c48b1596712930ea32f817c7575ed71c23",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "756:98269": {
+      "key": "1b3390b5b8f85c5d27c423b2554aa51d661a5123",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:1071",
+      "documentationLinks": []
+    },
+    "784:83993": {
+      "key": "7807b5814c563d5fa411eee02922f62ec506741f",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84013": {
+      "key": "95b6d86aedff97a65715c65fa094eaea55f90c94",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84033": {
+      "key": "be92e243e66d755a2438dd9a5792be9e7edc8018",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104675": {
+      "key": "69841a52f65b3a2208fa1d066d15747fb8c6465e",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84053": {
+      "key": "24dd75a1ecc168ad3be406bd5456e85a9ed3801d",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84073": {
+      "key": "3832151a1ea045213e4cc57ec250fe32a761c880",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84093": {
+      "key": "e38743d67ae1204a17363f41f8dc784f7439c421",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104645": {
+      "key": "0b3cc77e7220b2de0f94e2615f838a62776832e3",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84113": {
+      "key": "1c269e782f4e083b60abf6b9172861894cdf7cda",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84133": {
+      "key": "f720a0bdf720984d1ee06948f2a76df8125e1d76",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84153": {
+      "key": "990baa986b9e97311ca15a0499505b0b6d194f77",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84173": {
+      "key": "e95e0a903efa4f8d3055b6288ddb54607b793855",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84193": {
+      "key": "5808e8f068089b6021e1ef406f5c74f9340b9da0",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104705": {
+      "key": "f8916a93847e52c0cd77920d9e4931f3a64fa094",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84213": {
+      "key": "07b4a163c4e4b9d88ed572aa028909b6c138fe9a",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104735": {
+      "key": "39b2f794a57b382f1ec0648c1f926ab2af977798",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84473": {
+      "key": "5605173dde317b47851c114b97d7260312aa6c87",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84493": {
+      "key": "d04c8e71d32bf45e365b53fefb1a0c2f28bfeb83",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84513": {
+      "key": "120f6e79a78649751c4511bea84ad71d7afe9f1c",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104795": {
+      "key": "c591c19131993c9e7c94eb94ca203227959cf37f",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84533": {
+      "key": "4b4492aeb58e5efb19b639da2dbb63507fcaf1c2",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84553": {
+      "key": "8b6231c7fd5697d494b4c3b20f6eb6cab26ddf9c",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84573": {
+      "key": "6a8347f9a1050b33e3773bfbe7ef3dcc340a42dc",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104765": {
+      "key": "41a0d3dce34ebac145bdea79f190d3c40365bc13",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84593": {
+      "key": "694c792bf045da05ac3f0cc1fd2adafe0c6949b8",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84613": {
+      "key": "f527499a55ec2fa1dbcb28a50f3317b5b0ece090",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84633": {
+      "key": "122187346126591dba7fccc0f18a2539ccae719e",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84653": {
+      "key": "e0362efab6ac69a20e8ce3a481fe979dfce8f798",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84673": {
+      "key": "f2aad0419218a3e11f4c406f58d32fb4dc267dcd",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104825": {
+      "key": "d4ed69c3add3ffd97cdc7518edc947242e879860",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84693": {
+      "key": "3de5a5eff9b89552d8f707a16ed9e66007cc2574",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104855": {
+      "key": "afdf6338433ac958cbb252df0be2f49c79ca25ff",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84953": {
+      "key": "5ec7b04e096b1d999f579076959c8fda0d39edfd",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84973": {
+      "key": "22a6b40496e626d465e4f66e8a1be2dde0635e86",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:84993": {
+      "key": "20b3ddba1a2a2a50daa766d5b7dabfb845a8f7fd",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104665": {
+      "key": "ae62df71222fa5f17caabae970f26e6c8a7905e9",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85013": {
+      "key": "227a3b4c08e7cbc09de93c2779749446f45df620",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85033": {
+      "key": "c4007a7017303227bccb1832e02e288815cbf9f6",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85053": {
+      "key": "abc9683edab08159bf88eed14399dfecb20b1c09",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104635": {
+      "key": "2f327ee5998ffdbfb1ab8cfe176a40a43b7a3467",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85073": {
+      "key": "3cf96b8f2605b3d39b19d0bdd04514e8a98332d2",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85093": {
+      "key": "4f55d7a5b351ad8e37a4df15a5dd1c7e7b2ca267",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85113": {
+      "key": "f45332d0c201d00ab8fd9120365a5587ed44b308",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85133": {
+      "key": "f5966b9013c65e3f0be688ec8d10673fd59a0f86",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85153": {
+      "key": "62e0dfad22055ee45c5acde665b7144a9f81dbd8",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104695": {
+      "key": "1d1739aa05796b0e6b01f863f1da0820a3669707",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85173": {
+      "key": "d18cfa580339effbb4112fda1c46152b138ae1c2",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104725": {
+      "key": "795d901691bda92208b2f70e4b5b56db8cb76a4b",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85433": {
+      "key": "842b82df9c4a5b1ce284c7c1154ad087a9887537",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85453": {
+      "key": "d589b13468a9726977e6660ae2d602848dc4f101",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85473": {
+      "key": "05cfa65bc60a6502c4c053087dcfd7a5ad247423",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104785": {
+      "key": "5f5e7e56c2b922fd0389b0e3e8e979ed4dd9cacc",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85493": {
+      "key": "27783ad255119edab46211a160bcb3559c9cdabf",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85513": {
+      "key": "fd29025447d636325f635fde633fa4c52d7d35e9",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85533": {
+      "key": "9ddd8225f7f9e7e29f9045c7a6c55943b658a60a",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104755": {
+      "key": "4da1d77570c0a9d8c6b1848b41e7b0da172e53dc",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85553": {
+      "key": "af92206460f58cda16054de4e60e43fc15f1018a",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85573": {
+      "key": "a3212e6be3f454031adbe6bed3934303126ec367",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85593": {
+      "key": "538e840c1bda82ba22095e94c2839eacf6ffe713",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85613": {
+      "key": "81f531671590ff349d2970a431dc07fbbf8276d7",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85633": {
+      "key": "0f5b55a1522a9a60161973016bb2c1ea1e8029aa",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104815": {
+      "key": "f48f8bb6e9c1a6b3deca9648ab376e01bf607d85",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85653": {
+      "key": "64baf3072da3c53d6c9da30f3b9fc46dd606dd15",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104845": {
+      "key": "7c0f882369edbf10c48598990070cd7139bec1fe",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85913": {
+      "key": "e77a7bee5d96a4a010e6cf0ce6663c1fccf8d88a",
+      "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85933": {
+      "key": "4b74f3cadab93f2886569c17adce455948d74f56",
+      "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85953": {
+      "key": "cd51aac86f9ff910325cca7df1d158f22b9e100a",
+      "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104655": {
+      "key": "8c4c18581c24165f8491ec92ff4246f4a1a94fc3",
+      "name": "Skin=Outlined, Size=Regular, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85973": {
+      "key": "65f958eb967d7abf5d246c269992f1fe0170ab50",
+      "name": "Skin=Outlined, Size=Regular, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:85993": {
+      "key": "8cfae561d19cdf5d0846e3d13b30818f111fae9e",
+      "name": "Skin=Outlined, Size=Regular, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86013": {
+      "key": "16e982304a468d39a53ec4c3a39e3a8fc5ec3a8a",
+      "name": "Skin=Outlined, Size=Regular, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104625": {
+      "key": "37c944c7da29074a712cc1315bb2c945045209bb",
+      "name": "Skin=Outlined, Size=Regular, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86033": {
+      "key": "666c357510e7bf5f0c1a9b2d0d64debc9cdf7085",
+      "name": "Skin=Outlined, Size=Regular, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86053": {
+      "key": "802a3ea04af8aa13bf7bcc46e0ab3dacb702dec9",
+      "name": "Skin=Outlined, Size=Regular, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86073": {
+      "key": "112c40f170131bf9bb6f64bcdc6b8ab3e905f58c",
+      "name": "Skin=Outlined, Size=Regular, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86093": {
+      "key": "25a799e4ddc15f584de0b27bd874f086472d88c4",
+      "name": "Skin=Outlined, Size=Regular, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86113": {
+      "key": "e35ba6a12f87787522a6811f61e590e020f17fa2",
+      "name": "Skin=Outlined, Size=Regular, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104685": {
+      "key": "27b176448f05144e2ed06bd52c3b35e12478c279",
+      "name": "Skin=Outlined, Size=Regular, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86133": {
+      "key": "65afc1c31f1c8f36041f36d763a362369521665b",
+      "name": "Skin=Outlined, Size=Regular, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104715": {
+      "key": "fc84a51619959144bd25003bddd0986df616150f",
+      "name": "Skin=Outlined, Size=Regular, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86393": {
+      "key": "f91097fb58eb0f2dac06d5c6401e55ecc55231c4",
+      "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86413": {
+      "key": "3439bcb3326fa7980914e44abdc17d8f2c8fa03d",
+      "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86433": {
+      "key": "7e769aea6d4a7493f2317ccfbfbd84e7b25c9752",
+      "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104775": {
+      "key": "b3a3e37c989dd36f6bbd6443607df91073d54110",
+      "name": "Skin=Ghost, Size=Regular, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86453": {
+      "key": "eec4f88356d27983de808c346eb613bc117911c7",
+      "name": "Skin=Ghost, Size=Regular, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86473": {
+      "key": "e9cdc6beb4d36e72498e7ba563a3d21738f83fe0",
+      "name": "Skin=Ghost, Size=Regular, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86493": {
+      "key": "d566dfac6422f06ad8c53e27dc45b4bb97a38a6e",
+      "name": "Skin=Ghost, Size=Regular, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104745": {
+      "key": "aa513834bfa6911e949e6ee35544fae4e30679d9",
+      "name": "Skin=Ghost, Size=Regular, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86513": {
+      "key": "e2c59d77f782bdd12070b4eaca62e2a110473ad6",
+      "name": "Skin=Ghost, Size=Regular, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86533": {
+      "key": "481e769ffd1dcbf00878e1cd32e697d29d24f55b",
+      "name": "Skin=Ghost, Size=Regular, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86553": {
+      "key": "59bb664d83cd1204e28e202a15d4c346e30a6132",
+      "name": "Skin=Ghost, Size=Regular, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86573": {
+      "key": "95428f1b0498398c6f74086cda30b5fc8d4a1424",
+      "name": "Skin=Ghost, Size=Regular, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86593": {
+      "key": "658dc380cc56c0222c5cf9d71b329edffb0cf9df",
+      "name": "Skin=Ghost, Size=Regular, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104805": {
+      "key": "afbe6fdd5355819ac4c95f5abc54b923130fe088",
+      "name": "Skin=Ghost, Size=Regular, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:86613": {
+      "key": "4ca25f09cde25510b77c90efbfa580a3087dda06",
+      "name": "Skin=Ghost, Size=Regular, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "788:104835": {
+      "key": "00a57e9ef0c0c2676de792b52a740bc60d9ee400",
+      "name": "Skin=Ghost, Size=Regular, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:82792",
+      "documentationLinks": []
+    },
+    "784:87184": {
+      "key": "537be68b478a29872159c20c41cd83867f6475fd",
+      "name": "Skin=Outlined, Size=Default, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87194": {
+      "key": "7e4fd8697839c2db6d1c5ef35e897e59bd552af0",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87204": {
+      "key": "aceeef006f89efa208ab53fae3ed532bfc63e4b2",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87264": {
+      "key": "aa45938ead7dc2aeed023af7167cbda5fcd968c2",
+      "name": "Skin=Outlined, Size=Default, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279862": {
+      "key": "570e7a0e1e3ad8001b4d25ea69eac344176c822e",
+      "name": "Skin=Outlined, Size=Default, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87274": {
+      "key": "9e39ee2df3133d4a21084f15fa5a80ff4162de46",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279867": {
+      "key": "d76308b347e8cb0d41a366c2b393dc947b7cff36",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87284": {
+      "key": "79b283110b144465167719d63c66c50aede468dc",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279872": {
+      "key": "148c60c6df43d44fcb6497c838244af035b9649b",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87344": {
+      "key": "8ee8aaf28d62d4d237f6fa8bc980e828d3d0572e",
+      "name": "Skin=Outlined, Size=Default, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87354": {
+      "key": "844bd01e64ca50b261b173054fce85c72729f134",
+      "name": "Skin=Outlined, Size=Large, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87364": {
+      "key": "8b3d6948757a407fe29a86025107f0326035e92b",
+      "name": "Skin=Outlined, Size=Small, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87424": {
+      "key": "78c03b687a0b788daa578e1131915671c0b25199",
+      "name": "Skin=Outlined, Size=Default, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87434": {
+      "key": "a74279e3d07f280c78e6e27f7db671cf28c4f624",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87444": {
+      "key": "50372b2f57458ea6f6743567d9ccc78a78277f58",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87504": {
+      "key": "69795da7fa5cf363601aebbe2fb0ac70a085cd9b",
+      "name": "Skin=Outlined, Size=Default, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279877": {
+      "key": "bca70bd0598e612f20fb84d12296ee17ee691f45",
+      "name": "Skin=Outlined, Size=Default, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87514": {
+      "key": "e8ddfee4708cac1f74e37b651071737ddd1b977f",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279882": {
+      "key": "ec92f87274c32ca67448404da9a9c55bc30592c9",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87524": {
+      "key": "3d517148577e0cb9e6a0b53f0a6bbf033f8ecf36",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279887": {
+      "key": "b8c844d4cf7da90ec170743f75936780b60666c9",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87584": {
+      "key": "a74ad558afb36458f22cbdd2a26d930c26234caf",
+      "name": "Skin=Outlined, Size=Default, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87594": {
+      "key": "c621dacaeb32fe8e0602047956058d9e07ca9340",
+      "name": "Skin=Outlined, Size=Large, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87604": {
+      "key": "8cdb1c7a5f52010e67c28a4e17513d20f35a1765",
+      "name": "Skin=Outlined, Size=Small, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87664": {
+      "key": "b141a7e58b9861a1decf70001c26d40d44ac4565",
+      "name": "Skin=Outlined, Size=Default, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87674": {
+      "key": "1fffa1fe90eb84bba28e8c8e1a3bbae3ea403cf6",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87684": {
+      "key": "220bf3a8591515c5ef88ee382b0880e4ffaf28d5",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87744": {
+      "key": "4e59ffc7726b9c834942ce8cdb4a1d3a7e6ca45d",
+      "name": "Skin=Outlined, Size=Default, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279892": {
+      "key": "e5984ece23ee0ec08f2e2e274da3ffc802d96628",
+      "name": "Skin=Outlined, Size=Default, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87754": {
+      "key": "c5f68008cb13068525311a080a700298bafc2321",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279897": {
+      "key": "528fa687a7310eb872e8350325707464dd21c6c3",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87764": {
+      "key": "89e5febe790347cbb5232cf8211673a6c45fc4d8",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279902": {
+      "key": "73edd89b01b45840b7645349eb159b3bb49361c9",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87824": {
+      "key": "a3559d145c6224c879a0efe2bd0669eee4e234f9",
+      "name": "Skin=Outlined, Size=Default, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87834": {
+      "key": "a1776aab499ffe41155318dfb37830aafe9c02ef",
+      "name": "Skin=Outlined, Size=Large, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87844": {
+      "key": "8f406a535b0595348420de1c6ffb0d46f57d9ae2",
+      "name": "Skin=Outlined, Size=Small, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87904": {
+      "key": "db9cbf8743ffd147a19e76cdf5f9065f32d2f33a",
+      "name": "Skin=Outlined, Size=Default, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87914": {
+      "key": "b4109f371f5a95164dd02254e826369b444a18c7",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87924": {
+      "key": "eedc03c69fac0151d4fc8c528a6080f216442e9e",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87984": {
+      "key": "6d8e8fed44c9ffe9ad6ec2fb325f1835f56d7f42",
+      "name": "Skin=Outlined, Size=Default, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279907": {
+      "key": "c13b6a095ff1538b90645d8a9fb1630ca9e9f3de",
+      "name": "Skin=Outlined, Size=Default, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:87994": {
+      "key": "73c2ec2ac73437f4c5372c9a8937c8065d38bd0b",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279912": {
+      "key": "309c95900bee01d3bccd1d4838dbe6c8e1eb606b",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88004": {
+      "key": "ce81914eafc387e346da4616eb735da2284b2c52",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279917": {
+      "key": "085588c9ce58bcdf67ccc0f10acf3f8843e20e36",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88064": {
+      "key": "07d455c53c9e54c946a26d4c678d2ee4ba69f388",
+      "name": "Skin=Outlined, Size=Default, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88074": {
+      "key": "a3bd4c89bf224a485c427bbf6ad0531a0847e525",
+      "name": "Skin=Outlined, Size=Large, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88084": {
+      "key": "c05e85aff8ca4a79e869861679bfb5d962b06602",
+      "name": "Skin=Outlined, Size=Small, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88144": {
+      "key": "6aa8d028bb95bce6db6deadb4fd22d8ccc2b1d98",
+      "name": "Skin=Ghost, Size=Default, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88154": {
+      "key": "193877f4d7fa043d3cd6e0af07c0e6acc2d19339",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88164": {
+      "key": "eaed85185844f473fe4e98bfdc113756ab612596",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88224": {
+      "key": "df5bf21e3ca7b125e4dcf3b4b31857539ca51f0f",
+      "name": "Skin=Ghost, Size=Default, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279922": {
+      "key": "ad4acdb6ee7150def8ad3189ce1b97c215567cff",
+      "name": "Skin=Ghost, Size=Default, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88234": {
+      "key": "c25ab356e0967a7e4299acadad8eab329d8f2272",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279927": {
+      "key": "c8dd7f025e791ae2d6082a4a36170bd8d1c1fa2a",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88244": {
+      "key": "188f5687ba6bf992d4350606ac398c0979cf8d26",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279932": {
+      "key": "c136ff9d4189ee9cf9d5454f03c7cc85310b0bb8",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88304": {
+      "key": "60825948c6d871256f3c75d494c3687e91e112b7",
+      "name": "Skin=Ghost, Size=Default, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88314": {
+      "key": "d443c2142427d53c39a72f69bffb12b693ac27c6",
+      "name": "Skin=Ghost, Size=Large, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88324": {
+      "key": "552e60fcc3289d646d2c95d01ba87b2e0c005e64",
+      "name": "Skin=Ghost, Size=Small, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88384": {
+      "key": "1592b887634943b98d5c077593101932f614da2d",
+      "name": "Skin=Ghost, Size=Default, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88394": {
+      "key": "5c2094d25db9184da045cda09dc35586c9a0c19a",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88404": {
+      "key": "14a788e23d4c3547767b931fdb285450214eb26d",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88464": {
+      "key": "90f4ba1bef87ab711e866f3a0c682c1b3739c976",
+      "name": "Skin=Ghost, Size=Default, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279937": {
+      "key": "5605101a1f8e8c25c7833bf2a637cf3beb15da3f",
+      "name": "Skin=Ghost, Size=Default, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88474": {
+      "key": "18ce29844cf909f1ec2af6d2c98942a8faf4fffa",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279942": {
+      "key": "ed783b47df508e720eddde21277da7de4f3fdd14",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88484": {
+      "key": "c76c34400844592d0b9183d82b2b86a83b37a2cb",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279947": {
+      "key": "f5593589b44653f8ae59f1b0ddb5251992975bf7",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88544": {
+      "key": "4820c71e5a956d3bd7358e1c1f573551ae1f5418",
+      "name": "Skin=Ghost, Size=Default, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88554": {
+      "key": "c883fa97387c3c0e9ca2defbf0b7e00629980d23",
+      "name": "Skin=Ghost, Size=Large, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88564": {
+      "key": "acb7311ad733f8a56011f362ce4d43b8869e74e5",
+      "name": "Skin=Ghost, Size=Small, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88624": {
+      "key": "6aed6c577dc2c5439ac95f1f36a4116e625b5848",
+      "name": "Skin=Ghost, Size=Default, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88634": {
+      "key": "202e89ab9bd95a6df89ebe317c922b6f2ea8a0bb",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88644": {
+      "key": "e1411cc293c99cf3eaa8dafef7721b0d2fa1420a",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88704": {
+      "key": "636068601f91796ebc5548e48ad0e233ad928fae",
+      "name": "Skin=Ghost, Size=Default, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279952": {
+      "key": "c9253e6ddf41a3f2eac7439ada8c561e500b38ac",
+      "name": "Skin=Ghost, Size=Default, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88714": {
+      "key": "879c2c64757654cbb64ee7a7ef89fbc7c1636f5d",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279957": {
+      "key": "d8ce6f859eb7af1919136b52926e490a0ea461af",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88724": {
+      "key": "643890b1009797a67c490b0e7b5866091436bec2",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279962": {
+      "key": "bd5ed8d42d65da2b34994d83e06db9e5809852a0",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88784": {
+      "key": "535ae1f8b3e89e2860659111283b844671f57f7f",
+      "name": "Skin=Ghost, Size=Default, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88794": {
+      "key": "ba07e4d2c6c8585a2a8c4b808dfb3a16790527d9",
+      "name": "Skin=Ghost, Size=Large, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88804": {
+      "key": "71d116b771b15cc3122062731838957f03ba9717",
+      "name": "Skin=Ghost, Size=Small, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88864": {
+      "key": "db0492a16342272bc04b81ee5957b91f25b8ee8b",
+      "name": "Skin=Ghost, Size=Default, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88874": {
+      "key": "b9a53549180d3b6422076e9065f394105b143267",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88884": {
+      "key": "4704436cde5d5bcc5a4a931923b4ca8c0a59f633",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88944": {
+      "key": "15f3d5767dc2dfcd8deb22984e17d30de45fc995",
+      "name": "Skin=Ghost, Size=Default, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279967": {
+      "key": "68c0e4bb9742ab9f0434b34db4021af73fbff5c1",
+      "name": "Skin=Ghost, Size=Default, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88954": {
+      "key": "fd44d5e8b7aae3fba1f3c8ade92ff5e8fb7b840b",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279972": {
+      "key": "7b0e40f64451e5ab808fa6736c8037559d7b16af",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:88964": {
+      "key": "61e5fe02dac208f4c6c2214895ffeba003ab6c85",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "788:279977": {
+      "key": "7e31381d9bbef73da82757498af782bdce15fe50",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:89024": {
+      "key": "b58157c05d24bf7869ec1f6e14a4a1c53d7d3b4d",
+      "name": "Skin=Ghost, Size=Default, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:89034": {
+      "key": "22720845ae4081f1cc4533d50aa655f4b97f184a",
+      "name": "Skin=Ghost, Size=Large, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "784:89044": {
+      "key": "10b55b56d6d27648316f3fbf6723349f185028b4",
+      "name": "Skin=Ghost, Size=Small, Position=Single, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "784:87178",
+      "documentationLinks": []
+    },
+    "55:4701": {
+      "key": "b5dd6883795b53cf294665045159b7bdf6fadb44",
+      "name": "Slot No.=1 Slot",
+      "description": "",
+      "remote": false,
+      "componentSetId": "179:29234",
+      "documentationLinks": []
+    },
+    "151:12276": {
+      "key": "903e036999e4cdec6b28725a01b41f0d706f5e6e",
+      "name": ".Slot",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "189:36854": {
+      "key": "5389687d2461c0aad465ddc1e1b1b6f4b9f7e2ee",
+      "name": ".Slot Inner",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "179:29232": {
+      "key": "c352368b8dedb66f44220f39795b0c7cb42e1ef5",
+      "name": "Slot No.=2 Slots",
+      "description": "",
+      "remote": false,
+      "componentSetId": "179:29234",
+      "documentationLinks": []
+    },
+    "179:29233": {
+      "key": "d0f43d865dbe32918d94fae337570ac170abcb1a",
+      "name": "Slot No.=3 Slots",
+      "description": "",
+      "remote": false,
+      "componentSetId": "179:29234",
+      "documentationLinks": []
+    },
+    "189:49476": {
+      "key": "b8c1f548b36182511ccc366839b107a889f2990d",
+      "name": ".Card Header Default",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "162:11707": {
+      "key": "5e10e6095b3aff2bd1a1dbbfb455d8c6425ab28d",
+      "name": ".Support Fields",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "120:13758": {
+      "key": "339e6ceb7b14c4b72478acd70db4ee21ed1c9e24",
+      "name": "Type=Text Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13754",
+      "documentationLinks": []
+    },
+    "16:1663": {
+      "key": "5dc7e65cd5631beaf29c1628572e20b98ddc648b",
+      "name": "Layout=Block",
+      "description": "",
+      "remote": false,
+      "componentSetId": "103:9453",
+      "documentationLinks": []
+    },
+    "16:1737": {
+      "key": "1b85cc05135ab0faac9a945193518feb9dd2ab3a",
+      "name": "Roundness=Default, Size=Regular, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "18:1290": {
+      "key": "cdce830673ed7bbe3e74d682655b59a448b825de",
+      "name": "Type=Icon, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "120:13755": {
+      "key": "f7781e58a25697141906a684e9cbb76930d53ce5",
+      "name": "Type=Select",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13754",
+      "documentationLinks": []
+    },
+    "16:1730": {
+      "key": "13dc532c688428403c574312586f5cf017d692bd",
+      "name": "Size=Regular, State=Default, Lines=1 Line",
+      "description": "Dropdown",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:40339": {
+      "key": "1302858af486356bb9a90f72d0cf8fe6a622759c",
+      "name": "Type=Select",
+      "description": "",
+      "remote": false,
+      "componentSetId": "673:40340",
+      "documentationLinks": []
+    },
+    "120:13761": {
+      "key": "20c18cd643ca3381a526714777866279d8f61bf5",
+      "name": "Type=Textarea",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13754",
+      "documentationLinks": []
+    },
+    "16:1744": {
+      "key": "77ed3a6b458796ebab530d075c6e24545b228c76",
+      "name": "State=Placeholder, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "179:29500": {
+      "key": "80b174c543abffdcfa8e9ba7be74e78ebd47ab5e",
+      "name": ".Login Form",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:2026": {
+      "key": "0829019a3579387fe3f0ed33c6e2cbd2bbdde0e6",
+      "name": "Roundness=Default, Size=Regular, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "189:50227": {
+      "key": "f62b20cf393b4d1035378daf14af9d886813d451",
+      "name": ".Default Footer",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "179:29637": {
+      "key": "72a5c3872af5c64e51b764dac772a0c6b0f9cb9d",
+      "name": ".ExampleHeader",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "179:29638": {
+      "key": "b26f75f595fed19ee267ebf4a646dabca78bc2fd",
+      "name": ".Example Image Content Area",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "179:29639": {
+      "key": "3600f2236177e01636d9e79e47f29324e0bd021e",
+      "name": ".Example Footer",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "179:30062": {
+      "key": "5c9ddf01e1c5d67b8334603ead710718abd8de7b",
+      "name": ".Content",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "164:18291": {
+      "key": "a649a0cefe8b3a3b4a042ca038e98b302489be1f",
+      "name": "Slides=1 Slide",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18293",
+      "documentationLinks": []
+    },
+    "9:852": {
+      "key": "bad38169338698263cda45565fe4056803fd6515",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "164:18290": {
+      "key": "ddc649e3012f90b318a7309cd54221c86b7ace0e",
+      "name": "Slides=2 Slides",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18293",
+      "documentationLinks": []
+    },
+    "164:18292": {
+      "key": "50167dcdd5223b515aab06b1063aead2468904d8",
+      "name": "Slides=3 Slides",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18293",
+      "documentationLinks": []
+    },
+    "164:18361": {
+      "key": "b54e2112f63504907b7c880a03cc9e06858a5b8a",
+      "name": "Type=2 Slides",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18350",
+      "documentationLinks": []
+    },
+    "164:18369": {
+      "key": "fa8d0decb139ec2eb81f9cd538283b08eb50b4fa",
+      "name": "Type=1 Slide",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18350",
+      "documentationLinks": []
+    },
+    "164:18351": {
+      "key": "0cae35aa204f6fef13acfa5d51f5225fa5fbb9ff",
+      "name": "Type=3 Slides",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18350",
+      "documentationLinks": []
+    },
+    "222:27780": {
+      "key": "bac796fbcf961bfe0a4ba0d464ad75d6c4ac68b2",
+      "name": ".Pie Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "55:5094": {
+      "key": "eb3e3c0c5c59e21c0c0428269709f8883cf01826",
+      "name": ".Line Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "55:5093": {
+      "key": "3fdca11926c8615031e607e70c8e7e3d59e855d9",
+      "name": ".Vertical Bar Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "55:5095": {
+      "key": "08b01eb2a995dab57971d6fe8c084d61ec4e2ea0",
+      "name": ".Horizontal Bar Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "222:27781": {
+      "key": "c5ab1aaf5206d54e8b12c47ed960b1de1de4ea47",
+      "name": ".Donut Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "667:72577": {
+      "key": "2f5464aac62d7fb941e4cf957025909c2656a737",
+      "name": ".Donut Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "304:253216": {
+      "key": "7c871f915e9ce3f3dffcab12cff2b33bbf85adc6",
+      "name": ".Chart Tooltip 1",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "304:253218": {
+      "key": "66b0e7b3789a1697e23e39fe385270812ff6f708",
+      "name": ".Chart Tooltip 2",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "304:253217": {
+      "key": "447fe40899b925e578ac01807c0c3c636aec8690",
+      "name": ".Chart Tooltip 3",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "55:5096": {
+      "key": "a5958f0eae7fd9942c764abd200b454b3cad4638",
+      "name": ".Area Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "304:253118": {
+      "key": "c8de9351515d9bbb1ca4ef6c4c4b2c3a8cc3128b",
+      "name": ".Radar Chart",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "280:104398": {
+      "key": "fe24d1796f77a995a40395a3b941175890a9aa3e",
+      "name": "Checked?=Indeterminate, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "16:1791": {
+      "key": "d7d0568f0709c94e73da11c91bf4b727c4b98578",
+      "name": "Checked?=False, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "16:1789": {
+      "key": "dd37e4b53f9c99dd83e28b5c53199f176d4c70e1",
+      "name": "Checked?=True, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "147:11599": {
+      "key": "b5cc95a81ab58f44a96b1c103466ea6063b2b74c",
+      "name": "Checked?=False, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "147:11595": {
+      "key": "9a967fd38a17a5c73f0aedd677475028c02ec232",
+      "name": "Checked?=True, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "176:25079": {
+      "key": "789fd8e5210837c57494ff696ecac2c558460706",
+      "name": "Checked?=False, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "176:25089": {
+      "key": "a6325932cbf1fb66da8254d56f498c7377b0b59a",
+      "name": "Checked?=True, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "176:25101": {
+      "key": "f33cb25df2a651577cde09021173343efe5ac302",
+      "name": "Checked?=False, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "176:25103": {
+      "key": "343e40c366058724724ef12cd13b423cf1f26c74",
+      "name": "Checked?=True, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "16:1907": {
+      "key": "0cb96c90a7754a4327688f4bd00b82cbd1789c1e",
+      "name": "Checked?=False, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "176:20404": {
+      "key": "e11ea2e4c77a2c5460cc0841d26a1d8c9e78a24a",
+      "name": "Checked?=True, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "16:1914": {
+      "key": "f2c0c1875fe2ea2eb98375cab25d8ef1b6d43ff6",
+      "name": "Checked?=Indeterminate, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "147:11601": {
+      "key": "7ce674369e5967a79a387081e934b842ade62ee5",
+      "name": "Checked?=Indeterminate, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1790",
+      "documentationLinks": []
+    },
+    "103:9438": {
+      "key": "409919c20e996b6e215b50a33b26560fbbd85341",
+      "name": "Layout=Inline, Checked?=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6040",
+      "documentationLinks": []
+    },
+    "103:9432": {
+      "key": "4147e6142d7ed0f57c3cb031cebba79893326fe6",
+      "name": "Layout=Inline, Checked?=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6040",
+      "documentationLinks": []
+    },
+    "280:104486": {
+      "key": "c63084642b552aaff3acd51604ee0279dc52d9f0",
+      "name": "Layout=Block, Checked?=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6040",
+      "documentationLinks": []
+    },
+    "280:104489": {
+      "key": "ef483a95be21b61ccc8ffd67113ea91b3c2fb60f",
+      "name": "Layout=Block, Checked?=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6040",
+      "documentationLinks": []
+    },
+    "19:6352": {
+      "key": "ff675680fd057f5e21d77734ae5ddaace8db3555",
+      "name": "Checked?=False, Flipped=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6351",
+      "documentationLinks": []
+    },
+    "19:6358": {
+      "key": "430cc137207de798977295bdcc5ce0f1ab19523a",
+      "name": "Checked?=True, Flipped=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6351",
+      "documentationLinks": []
+    },
+    "761:108811": {
+      "key": "9a255b3c9e31729a0b101f87c206f6fcaaa25f87",
+      "name": "Checked?=False, Flipped=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6351",
+      "documentationLinks": []
+    },
+    "761:108817": {
+      "key": "07dc3184128a92224e8ac922ece48c599edd0c0d",
+      "name": "Checked?=True, Flipped=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6351",
+      "documentationLinks": []
+    },
+    "66:5046": {
+      "key": "615c83742842c317737e3bec4f26a0670d931132",
+      "name": "Command",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:1306": {
+      "key": "0ea56ef4511600a272cea771bc4c83f13b9b0e93",
+      "name": "Roundness=Default, Size=Small, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "176:26203": {
+      "key": "6e6db483a02ee48f2a7a42948bf9f8fd3a24a469",
+      "name": "Spacing=Regular, Direction=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:26202",
+      "documentationLinks": []
+    },
+    "18:998": {
+      "key": "54d8da012cb5db81439a9c64d278486c75a40807",
+      "name": "Type=Small, Indented?=False",
+      "description": "Use this as the equivalent of an optgroup.",
+      "remote": false,
+      "componentSetId": "80:10189",
+      "documentationLinks": []
+    },
+    "66:5515": {
+      "key": "472b353377ab1b49527c587a8e6fc53a6f012efd",
+      "name": "State=Regular",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5600",
+      "documentationLinks": []
+    },
+    "18:995": {
+      "key": "9432e5a6064219ac43538f8ee7b6d59e30bb824d",
+      "name": "Size=Regular, Type=Default, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "66:5519": {
+      "key": "38a64723006bdbe6c119cc5ca1fe3f5961adedb6",
+      "name": "State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5600",
+      "documentationLinks": []
+    },
+    "65:4976": {
+      "key": "c172ad9b77026cf439b0f2620033fc2833a60219",
+      "name": "Size=Regular, Type=Default, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "66:5596": {
+      "key": "66d075d37aab5bbfbe4f8a5f7637ee28b4143c80",
+      "name": "State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5600",
+      "documentationLinks": []
+    },
+    "65:5198": {
+      "key": "8a7a51bc9e90cacb281693d4d9d537f4756585dc",
+      "name": "Size=Regular, Type=Default, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "19:6480": {
+      "key": "c553b442b299db8d4afb9dc0f91df3c9e1e7debc",
+      "name": "Content=Text, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4898": {
+      "key": "0a680d47cf870e0fda107f4bf01272d56e95205c",
+      "name": "Content=Text, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4932": {
+      "key": "597edd5db22147aab8241665b7156b748f124493",
+      "name": "Content=Text, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4966": {
+      "key": "296f65e241d55e08e932313d7ccf70e0ad7532ea",
+      "name": "Content=Text, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5606": {
+      "key": "876b8ef8b7cb2f7efb105b00841f8ab2b7738370",
+      "name": "Content=Text, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5609": {
+      "key": "6ecc4447f9113979989172207ae0241a599fea53",
+      "name": "Content=Text, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5612": {
+      "key": "ef4fa345896fa9152b8017123a96eee57436c22b",
+      "name": "Content=Text, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5615": {
+      "key": "ca16d8f006c1193f279a4fb92da8696d6d6d677e",
+      "name": "Content=Text, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "19:6315": {
+      "key": "74fb47202daed8cf94f2cb0c77cdf1521c6d8be4",
+      "name": "Content=Sortable, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4901": {
+      "key": "62d33532ffadb6bdc4fc62baccaa56b162910d9b",
+      "name": "Content=Sortable, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4935": {
+      "key": "acfa02beb316553cefa62423717707d99888fa78",
+      "name": "Content=Sortable, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4969": {
+      "key": "c0f1e4ae617465cfcae5bd66abe44d502c3dd4d7",
+      "name": "Content=Sortable, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5650": {
+      "key": "bbe0f48a6c7c22a38a9047a6930fd37b1e1b15f7",
+      "name": "Content=Sortable, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5654": {
+      "key": "a8c28d7193b6c92d2f154f09e8322092968d239e",
+      "name": "Content=Sortable, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5658": {
+      "key": "cafea1ffff55e60e8c746f4f958f2a2da4e31e39",
+      "name": "Content=Sortable, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "28:5662": {
+      "key": "e991d60c4cba23f192f6b3457947f9cc22e466ce",
+      "name": "Content=Sortable, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "19:6476": {
+      "key": "bf7dbdbb16ee0896f8f433f1e5aada646157d956",
+      "name": "Content=Checkbox, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42971": {
+      "key": "45b5a2b030aec4fe6847f998d754d99c33cf41aa",
+      "name": "Content=Checkbox, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4905": {
+      "key": "f36abb44e83bddd12e324991430caecf5695a1ad",
+      "name": "Content=Checkbox, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42974": {
+      "key": "b363dabb569a46a2bb1f1c48214ddc985aef8229",
+      "name": "Content=Checkbox, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4939": {
+      "key": "d45f0b6f36eb80616be242d2d6630898ba8b245d",
+      "name": "Content=Checkbox, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42977": {
+      "key": "df8f458c01e3e59d4725087b54a7d78b31e5d7e3",
+      "name": "Content=Checkbox, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4973": {
+      "key": "f137a4a10a90aa7d73ddf13c07b36f6e99dc4a0b",
+      "name": "Content=Checkbox, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42980": {
+      "key": "6292182c010f88d4b2a49986ab1a0ac133db2d66",
+      "name": "Content=Checkbox, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "9:757": {
+      "key": "47a7284d0c4d11e0f48fd6727186dd937db6ca5c",
+      "name": "Content=Empty, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42995": {
+      "key": "06b46a2290e89f31e21e622d83535bdf7edd69d1",
+      "name": "Content=Empty, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4908": {
+      "key": "0952e6c5f429caaf2b43af282677a8dc482ff291",
+      "name": "Content=Empty, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42997": {
+      "key": "cfad2bbb656d2c3eccd7d213ee00ec9b68798157",
+      "name": "Content=Empty, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4942": {
+      "key": "f396a8bee9b8f835afeeb88855f00e12f305ea7b",
+      "name": "Content=Empty, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:42999": {
+      "key": "2843c9574596cbfaa8914a42899f11de09cf8814",
+      "name": "Content=Empty, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "20:4976": {
+      "key": "092ed32fc975e6b37644924db4511266e79d3e0b",
+      "name": "Content=Empty, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "737:43001": {
+      "key": "e13fe5daae491b0de1ac8583a58778f059e8912c",
+      "name": "Content=Empty, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6472",
+      "documentationLinks": []
+    },
+    "9:756": {
+      "key": "aa66e42bff12740657afad1ecaae4d2940890d90",
+      "name": "Content=Text (1 Line), Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3164": {
+      "key": "ff4d9c376485ce75133751db6e9464cfca88ef45",
+      "name": "Content=Text (1 Line), Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3268": {
+      "key": "ded51d379f90e8452448a53dd312cdd1b4567bde",
+      "name": "Content=Text (1 Line), Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3371": {
+      "key": "c5a0ca12f3828d04c9cb6185b85b5e6fdacca7cd",
+      "name": "Content=Text (1 Line), Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "19:6302": {
+      "key": "2c9dc6d473b5b8fd2af7887e5bfce7e19c292339",
+      "name": "Content=Text (1 Line), Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3167": {
+      "key": "198d714d0646a2c2d8086e3385477e954758ea59",
+      "name": "Content=Text (1 Line), Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3265": {
+      "key": "60d7d31bec5c42e72314466a92aac082c3305af9",
+      "name": "Content=Text (1 Line), Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3374": {
+      "key": "e9bc087f778043e32b07f564c66659e910e1b563",
+      "name": "Content=Text (1 Line), Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "162:14676": {
+      "key": "abb3e0df67026de3c5ea9d01f505ec838e07816d",
+      "name": "Content=Text (2 Lines), Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32186": {
+      "key": "54ffe54264897d3756141c0624800df6bdc905b8",
+      "name": "Content=Text (2 Lines), Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "162:14679": {
+      "key": "e31f3796c7cdef6c666db66c51b7933ae8b894c8",
+      "name": "Content=Text (2 Lines), Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32191": {
+      "key": "cd275a6bddf64c23533d1a0d50cc4facd5d97fd2",
+      "name": "Content=Text (2 Lines), Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "162:14682": {
+      "key": "1f4b01806cd438593d40f1dcdef69a386464d50b",
+      "name": "Content=Text (2 Lines), Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32196": {
+      "key": "75f346cbc43bfebcccd9aa94facadb124e48c3f2",
+      "name": "Content=Text (2 Lines), Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "162:14685": {
+      "key": "d134d3ce918b2b42a15acc786b332191485a125d",
+      "name": "Content=Text (2 Lines), Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32201": {
+      "key": "c483d20311bd1e37ed0157aabc759f98c603258e",
+      "name": "Content=Text (2 Lines), Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9193": {
+      "key": "fa7376b0f67164b1fc35dbf07136a5e2a55dff35",
+      "name": "Content=Actions, Alignment=Left, State=Default",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "9:868": {
+      "key": "de37ae85a096131a89b537ba1736f2b415408258",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "79:9199": {
+      "key": "efd931b4c7293a652565f0d6f661344ef2285ecf",
+      "name": "Content=Actions, Alignment=Left, State=Hover",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9205": {
+      "key": "0c3aefb49160efed9bc5ab413102010bbf73b2a0",
+      "name": "Content=Actions, Alignment=Left, State=Active",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9211": {
+      "key": "a4abdd79e5577b93ff9c79d84b137d3968a89c1c",
+      "name": "Content=Actions, Alignment=Left, State=Selected",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "19:6299": {
+      "key": "2f51da14ae7d685dd8cd9966fb91c15f4fd83f93",
+      "name": "Content=Actions, Alignment=Right, State=Default",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3170": {
+      "key": "87f4eb27c9f4d2f95aa1703edabbbd27b9562aaf",
+      "name": "Content=Actions, Alignment=Right, State=Hover",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3260": {
+      "key": "9e24d70ac1f9755fcce469c703365c018221dee7",
+      "name": "Content=Actions, Alignment=Right, State=Active",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3377": {
+      "key": "e3243de10b686c4e00ac3981b6b6a845bcf4a2af",
+      "name": "Content=Actions, Alignment=Right, State=Selected",
+      "description": "Table cell with icons (showing icon buttons). You can have up to 3 icons. You can combine this with a table cell with buttons to show actions, typically on the right side of a datagrid.",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "19:6307": {
+      "key": "a59c586261e885c36c98610725daa9f13c76852b",
+      "name": "Content=Checkbox, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32461": {
+      "key": "159684f2e370c72d0231a8992a0dd3cb71f2c82c",
+      "name": "Content=Checkbox, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3175": {
+      "key": "b56f64b1fc6812cd4dc137ad916066c1093c6ae8",
+      "name": "Content=Checkbox, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32464": {
+      "key": "451d8e683bf90c112755180d98b1b0c5743f41d4",
+      "name": "Content=Checkbox, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3257": {
+      "key": "11ec28b3c5942a03415ee6c86b55c6d07ced68f6",
+      "name": "Content=Checkbox, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32467": {
+      "key": "8f8ed9a164f0831ef0f56b3f7866044b2b5a1f01",
+      "name": "Content=Checkbox, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3382": {
+      "key": "bad7fcea6f0d5533e55bf1b9d629487dd5ef81f2",
+      "name": "Content=Checkbox, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:32470": {
+      "key": "8323a30922a3c07da3472d3265c0c28116899f07",
+      "name": "Content=Checkbox, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3709": {
+      "key": "be9515e4bf7c875134d1b826ba25f1d5321ebc7c",
+      "name": "Content=Badge, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3712": {
+      "key": "29cb732a259b579d0f9a5f73199cfff569adeb93",
+      "name": "Content=Badge, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3715": {
+      "key": "32e7f58dc1d47b9e10c09a7077167e0ba7146796",
+      "name": "Content=Badge, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "20:3718": {
+      "key": "c07097f5432231f7f63cc81b80aa91b34741c5ad",
+      "name": "Content=Badge, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "58:5243": {
+      "key": "b6ad46c3f1b99b43dc130a4496d48e91831510d1",
+      "name": "Content=Badge, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "58:5240": {
+      "key": "053f83d0c0308f280e499790e8b42b456fc120c9",
+      "name": "Content=Badge, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "58:5246": {
+      "key": "7eb85f451127f20fcd0f66294a822d4c2ed42154",
+      "name": "Content=Badge, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "58:5249": {
+      "key": "1782f331115159e610196ad3ff0624e4fce4a715",
+      "name": "Content=Badge, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:5611": {
+      "key": "d2f087060526a182ea3b0a259cff342858466c03",
+      "name": "Content=Buttons, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:5608": {
+      "key": "7006f8324c241adab2ffb03e5487afb093e05ec2",
+      "name": "Content=Buttons, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:5614": {
+      "key": "2ea6e79ef41cdfc054d67453c5387bba4f7418fa",
+      "name": "Content=Buttons, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:5617": {
+      "key": "364fa219db6d20139a2f9bc612fe08b3be42897e",
+      "name": "Content=Buttons, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:6788": {
+      "key": "e96fd6c38124ec507a97bdffccdf4a4e9418e51d",
+      "name": "Content=Buttons, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:6785": {
+      "key": "4a6c47122343bf55d4c1d5d60d3e676e8d1152c3",
+      "name": "Content=Buttons, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:6791": {
+      "key": "f0c512cd1c6844f7f408aa401a15d76052f95136",
+      "name": "Content=Buttons, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "59:6794": {
+      "key": "61df80c9b5d8dcd33e0a2efc72f35fef93b38942",
+      "name": "Content=Buttons, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9085": {
+      "key": "b2f4c9d75a66302ebb030ff5c0c8de0bf13406b8",
+      "name": "Content=Avatar, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33269": {
+      "key": "5cfedae2b5d34ca05167fa324f3f300e2ea33567",
+      "name": "Content=Avatar, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9089": {
+      "key": "7a5ad9d43538a947158e470b9918db02d3d88e4b",
+      "name": "Content=Avatar, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33272": {
+      "key": "4a596fa66faee1b0f321bcf3e22984fd2fd73d53",
+      "name": "Content=Avatar, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9093": {
+      "key": "09ab54e68db651a2381244f515e6a8d89d881e48",
+      "name": "Content=Avatar, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33275": {
+      "key": "44f8564f611013bf5c39a13a1b25ea8d1574a1cf",
+      "name": "Content=Avatar, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "79:9097": {
+      "key": "d78cecf66975c76d2c200085370f1f5c6a1a47a9",
+      "name": "Content=Avatar, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33278": {
+      "key": "c4e6b053cd619dc3b12117486bc53a12d2718ea3",
+      "name": "Content=Avatar, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "68:11683": {
+      "key": "21482eab411c05b8ffad8104aaf9330a27862403",
+      "name": "Content=Avatar + Name, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33319": {
+      "key": "55272bb059af0d8739fef3d6813e9fbc23ee35e8",
+      "name": "Content=Avatar + Name, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "68:11686": {
+      "key": "5d01cc532f479a675aca72d32f649f9dd90108f3",
+      "name": "Content=Avatar + Name, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33323": {
+      "key": "17ba5f903126b4b3becf8fa17afe5b0e10e831a5",
+      "name": "Content=Avatar + Name, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "68:11689": {
+      "key": "ab80f153e882587dfacd1e3378e67514f9f7d68b",
+      "name": "Content=Avatar + Name, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33327": {
+      "key": "a35b67337d1ea645d802cd867e71b27238cd847a",
+      "name": "Content=Avatar + Name, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "68:11692": {
+      "key": "9e648b1ad7cab4abd08b1f7d1f9a04b3fc37af84",
+      "name": "Content=Avatar + Name, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33331": {
+      "key": "9d15f0c28bfc8d16d15bfabb6337a03c64d1424a",
+      "name": "Content=Avatar + Name, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "115:10153": {
+      "key": "af98ea6d8e2badde4ec32d41ece48ce2c67eaa5d",
+      "name": "Content=Input, Alignment=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "19:2030": {
+      "key": "5881c21f9fa67bdd8072d146c02b4d9f01f1784b",
+      "name": "Roundness=Default, Size=Small, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "737:33367": {
+      "key": "24c0688210376107154f38c3bff2dc1238d0d432",
+      "name": "Content=Input, Alignment=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "115:10156": {
+      "key": "0a802a08b451d6520514bab91ab6e7b7e25b3584",
+      "name": "Content=Input, Alignment=Left, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33370": {
+      "key": "2ccd5c96412cb4630aee7bb212df2ed6f89ccf83",
+      "name": "Content=Input, Alignment=Right, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "115:10159": {
+      "key": "7e3c07496bfb5655d852e01bcade8e3971fe8a4a",
+      "name": "Content=Input, Alignment=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33373": {
+      "key": "26a05aef3a7c8487ee390adfb0acd2897176157b",
+      "name": "Content=Input, Alignment=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "115:10162": {
+      "key": "3fd9d3914b65d79e4ae3998a2ddf2bc76ce5377d",
+      "name": "Content=Input, Alignment=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "737:33376": {
+      "key": "1a01ba7f8324417e2b34162508c7b854329e940b",
+      "name": "Content=Input, Alignment=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6314",
+      "documentationLinks": []
+    },
+    "68:15998": {
+      "key": "bac96c29e1eb5a8952a542224d4877902e808de8",
+      "name": ".Row",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "190:27724": {
+      "key": "5a1c4b2e1d0ecae93ecfc32f5dcd6059944d5d28",
+      "name": "Months=1 Month",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:119954",
+      "documentationLinks": []
+    },
+    "264:28466": {
+      "key": "1fb7598b9bc980f2099061fa52392d2efc45cd68",
+      "name": "Type=1 Month",
+      "description": "",
+      "remote": false,
+      "componentSetId": "264:29273",
+      "documentationLinks": []
+    },
+    "13:986": {
+      "key": "57602dfc5dd3353c475a0bc5ff15aa2087337309",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "22:7455": {
+      "key": "3e1afc33c2a00eb367e3d09a5ad19c93816a6bd5",
+      "name": ".Date Picker / Weekday Name",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "781:40923": {
+      "key": "7662260b31e98592c481d94d942c9a69f449d360",
+      "name": "Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40941": {
+      "key": "78939497038e6ce16234849fa20117df07ba5bd4",
+      "name": "Position=Middle, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40953": {
+      "key": "a4018de1a93db185857561c7130c489cc7c92684",
+      "name": "Position=Single, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "190:27722": {
+      "key": "075beaba20a1529b67d495e79c166646c46b3ac4",
+      "name": "Months=2 months",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:119954",
+      "documentationLinks": []
+    },
+    "264:30496": {
+      "key": "22f099ea079ff5637b38970e5bb18be91cdecd43",
+      "name": "Type=2 Months",
+      "description": "",
+      "remote": false,
+      "componentSetId": "264:29273",
+      "documentationLinks": []
+    },
+    "190:27721": {
+      "key": "8eeb8f56909a6eb9817406316424d1875bdb5d6f",
+      "name": "Months=3 months",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:119954",
+      "documentationLinks": []
+    },
+    "264:30497": {
+      "key": "7eaced7aa51d5ca4f2f6bbc8ff6ae0ef31c89e96",
+      "name": "Type=3 Months",
+      "description": "",
+      "remote": false,
+      "componentSetId": "264:29273",
+      "documentationLinks": []
+    },
+    "781:40957": {
+      "key": "83b3b4c9897d1055aeefe131a5cf91bbc85d9165",
+      "name": "Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40961": {
+      "key": "70d4adfed690b54ca00b8ff1b7cfcf68b817e9d2",
+      "name": "Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40965": {
+      "key": "37955499a3554a2803d96c10fa098d5004c8309e",
+      "name": "Position=Single, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40925": {
+      "key": "6ccfe1f38682d2816127a98bb87ca2f1bf535406",
+      "name": "Position=Middle, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40927": {
+      "key": "fafd2c7c7270b18b8ecb2cb044bc58c497eba03b",
+      "name": "Position=Left, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40929": {
+      "key": "62f80e25aa48d5efc2af91f6f3445b1b61e841c7",
+      "name": "Position=Single, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40931": {
+      "key": "40ef2d17f9a7edde92b953ac43f396e8dc2ad9be",
+      "name": "Position=Right, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40933": {
+      "key": "a748099b91eab730ecccd31bcb95b3f6d2cb215a",
+      "name": "Position=Middle, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40935": {
+      "key": "d814b947e63a44e6036f2fc2e1a7bae3f10558fc",
+      "name": "Position=Left, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40937": {
+      "key": "3c63e0c29574401efde1678f3e495d87d0392940",
+      "name": "Position=Single, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40939": {
+      "key": "8981d020f294f7b3739f4101e301175f56a6a5b2",
+      "name": "Position=Right, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40945": {
+      "key": "e3ae24b7fde17f7a66516b23bd047ba58774778d",
+      "name": "Position=Left, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "781:40949": {
+      "key": "273bee2b7d4a575119ad2cfa2b84aa91b7e65be6",
+      "name": "Position=Right, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "781:40922",
+      "documentationLinks": []
+    },
+    "60:9332": {
+      "key": "a4a6d5fdab7a814a8db2e827d56f412426671352",
+      "name": "State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "60:9340",
+      "documentationLinks": []
+    },
+    "60:9339": {
+      "key": "727560dcfd999455d781e66bcac6046e15376df9",
+      "name": "State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "60:9340",
+      "documentationLinks": []
+    },
+    "19:1308": {
+      "key": "ce18e8a02f26b38cf3ea81930e032ac0f3b9ce65",
+      "name": "Roundness=Default, Size=Small, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "179:29000": {
+      "key": "866644cc120f7a95dc1e04d952d94fe9f4ff2f69",
+      "name": "State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "60:9340",
+      "documentationLinks": []
+    },
+    "140:11553": {
+      "key": "658711f2461ec164b19a494327d3cb3bb7b240a2",
+      "name": "Roundness=Default, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "264:29248": {
+      "key": "897977668c166a64175f695cd2b8f962a7f4671e",
+      "name": "Type=Year and Month",
+      "description": "",
+      "remote": false,
+      "componentSetId": "264:29273",
+      "documentationLinks": []
+    },
+    "19:1574": {
+      "key": "50a3056e3371a34ce8286f1c15fc9d342334e9cf",
+      "name": "Size=Small, State=Default, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "264:31953": {
+      "key": "4447b781937204fe0ce66b0e9bb88b2499d37c1f",
+      "name": "Type=Only Month",
+      "description": "",
+      "remote": false,
+      "componentSetId": "264:29273",
+      "documentationLinks": []
+    },
+    "264:32007": {
+      "key": "1beb104c195d0d9d1865b5f5fca87a8c3258154f",
+      "name": "Type=Only Year",
+      "description": "",
+      "remote": false,
+      "componentSetId": "264:29273",
+      "documentationLinks": []
+    },
+    "190:27732": {
+      "key": "2e66acb54965ad368bb8ae6c1176f7db482fdc8b",
+      "name": "Spacing=16px",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:27848",
+      "documentationLinks": []
+    },
+    "16:1736": {
+      "key": "250608e891a2c189273a3baf6dc57e8f79f04b12",
+      "name": "Roundness=Default, Size=Regular, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "176:26205": {
+      "key": "5df1be2c25b26e62c634a376057e332e2f3b1de8",
+      "name": "Spacing=None, Direction=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:26202",
+      "documentationLinks": []
+    },
+    "176:26212": {
+      "key": "9f1eda370f06ee9498563206d25981af4735292d",
+      "name": "Spacing=None, Direction=Vertical",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:26202",
+      "documentationLinks": []
+    },
+    "151:12297": {
+      "key": "635f2a8a59bbd4b1b69953fafcf033dc9fbac6cd",
+      "name": "Type=Desktop",
+      "description": "",
+      "remote": false,
+      "componentSetId": "151:12298",
+      "documentationLinks": []
+    },
+    "153:12986": {
+      "key": "f0818fdd920721362496c593189c4bb65f460a4e",
+      "name": "Type=Desktop Scrollable",
+      "description": "",
+      "remote": false,
+      "componentSetId": "151:12298",
+      "documentationLinks": []
+    },
+    "176:22529": {
+      "key": "ff784dff34f5c5ed073fae68449d98ed97636e2b",
+      "name": "Type=Close Only",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:22344",
+      "documentationLinks": []
+    },
+    "176:20584": {
+      "key": "5e0b636c2f545626f4b1f3bf39c95063be113f0a",
+      "name": "Type=2 Buttons Right",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:21284",
+      "documentationLinks": []
+    },
+    "151:12284": {
+      "key": "eab0845ecb1ca2757d2533521e47ba5870a5bd90",
+      "name": "Type=Mobile",
+      "description": "",
+      "remote": false,
+      "componentSetId": "151:12298",
+      "documentationLinks": []
+    },
+    "153:13079": {
+      "key": "d1665a446bb453a5643e442b3e03d174b02dadfe",
+      "name": "Type=Mobile Full Screen Scrollable",
+      "description": "",
+      "remote": false,
+      "componentSetId": "151:12298",
+      "documentationLinks": []
+    },
+    "176:22345": {
+      "key": "aa73fce947464381662e1af8fd36676970e67dac",
+      "name": "Type=Header",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:22344",
+      "documentationLinks": []
+    },
+    "176:22535": {
+      "key": "fed75d5635ba433b517d868557ec14ce13fb48e0",
+      "name": "Type=Icon Button Close",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:22344",
+      "documentationLinks": []
+    },
+    "176:21019": {
+      "key": "ef29b58434344e04850b2872028faff9e922298c",
+      "name": "Type=2 Full-width Buttons",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:21284",
+      "documentationLinks": []
+    },
+    "176:21283": {
+      "key": "0a71626caa122ecfbd3a1b5adbcb6aa038af4872",
+      "name": "Type=Single Full-width Button",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:21284",
+      "documentationLinks": []
+    },
+    "164:16280": {
+      "key": "a8c4d1b7ee400bfedd81f5a62874d1bb1d3bacc8",
+      "name": ".Form",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "19:5986": {
+      "key": "88eeb1697c772caf018946e8439eb99781cd216f",
+      "name": "Checked?=True, Flipped=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:5987",
+      "documentationLinks": []
+    },
+    "16:1794": {
+      "key": "cc9f154e43ed8a4cb68a46ac13a97f5b47c4bf30",
+      "name": "Checked?=True, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "19:5985": {
+      "key": "1d46b942d0da088af1972573183f852f2067b2ad",
+      "name": "Checked?=False, Flipped=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:5987",
+      "documentationLinks": []
+    },
+    "16:1795": {
+      "key": "8311e0ddd026f4c3a0fcc085e1f9581678780759",
+      "name": "Checked?=False, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "151:12313": {
+      "key": "3980e9818748a1bfded30d3075f11478ae6c6790",
+      "name": "Drawer",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "782:45087": {
+      "key": "3ae8e20252306216fe843d38ca265d1bae7631db",
+      "name": ".Empty Decorative Icon",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "11:2010": {
+      "key": "56151399b4e852d12ac1890612019361edb56ac1",
+      "name": "Roundness=Default, Size=Default, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "157:11601": {
+      "key": "67be5a2e92e44ae1a2289d47687aff7fd61f967a",
+      "name": "Type=Slider",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13754",
+      "documentationLinks": []
+    },
+    "65:4894": {
+      "key": "843649c79028c40e7aeb5992a26e48fb84c9c675",
+      "name": "Type=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "65:4902",
+      "documentationLinks": []
+    },
+    "65:4895": {
+      "key": "c1c6671570044ab59c1b91370c330d949816be02",
+      "name": "State=Regular",
+      "description": "",
+      "remote": false,
+      "componentSetId": "162:17957",
+      "documentationLinks": []
+    },
+    "120:13764": {
+      "key": "00177ed07cd4e292319df9d8207a12b4650e597b",
+      "name": "Type=Radio",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13754",
+      "documentationLinks": []
+    },
+    "19:6049": {
+      "key": "4ad2a1e8417a1cdf418b4d6ebb0eed5dfd641336",
+      "name": "Checked?=True, Layout=Inline",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6048",
+      "documentationLinks": []
+    },
+    "19:6052": {
+      "key": "2c6dfa55f68932a8ea4788475785d88d2b5e16bd",
+      "name": "Checked?=False, Layout=Inline",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6048",
+      "documentationLinks": []
+    },
+    "120:13769": {
+      "key": "b0168538dbdb88b6381392fd215b253cc4b3ebc5",
+      "name": "Type=Checkbox",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13754",
+      "documentationLinks": []
+    },
+    "120:13779": {
+      "key": "60bbf5b5ec34aae4c55daf65c1494268ee2fa664",
+      "name": "Type=Text Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13775",
+      "documentationLinks": []
+    },
+    "103:9452": {
+      "key": "496a5eb005abebee25f93113dcc40f2f73f799da",
+      "name": "Layout=Inline",
+      "description": "",
+      "remote": false,
+      "componentSetId": "103:9453",
+      "documentationLinks": []
+    },
+    "120:13776": {
+      "key": "80deaa98d71621ea58148eab75380e6c25c8c33d",
+      "name": "Type=Select",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13775",
+      "documentationLinks": []
+    },
+    "120:13782": {
+      "key": "bb6e8e344cc5088ab1a4de0eadf33ea20d1a31c4",
+      "name": "Type=Textarea",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13775",
+      "documentationLinks": []
+    },
+    "157:11620": {
+      "key": "51733b7e1d66656a6b59a496c0e8a5c67cca8c19",
+      "name": "Type=Slider",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13775",
+      "documentationLinks": []
+    },
+    "120:13785": {
+      "key": "1b6cd512d9bb552668330088670e0c4706c02591",
+      "name": "Type=Radio",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13775",
+      "documentationLinks": []
+    },
+    "120:13790": {
+      "key": "ce31a00f59c669afbf76fea1ae3d9aac2515650e",
+      "name": "Type=Checkbox",
+      "description": "",
+      "remote": false,
+      "componentSetId": "120:13775",
+      "documentationLinks": []
+    },
+    "162:11545": {
+      "key": "9e3a208ddc4594ba46feea5554a3a48ac36bb4f8",
+      "name": ".Value Fields",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "303:246487": {
+      "key": "32f4852c5f9a489b0b32e5e235df4da07ffd2d7d",
+      "name": "Hover Card",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "11:2013": {
+      "key": "d157e98b51584b159c9aff3d44d72cee1a7e54f7",
+      "name": "Roundness=Default, Size=Default, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "303:246583": {
+      "key": "a4d853e49ced85becbd2c1b15d01d1d454d512cf",
+      "name": ".Hover Card Content",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "9:820": {
+      "key": "42a603c3e8fbc60d623cb0292c8059ef82a3c527",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33702": {
+      "key": "194bdceb1c4a4f7f8c1321f6b3cb6ec63e5da114",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16892": {
+      "key": "7a9caae74dfb5425c11186d0fd6ecf730cbc8ea9",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33706": {
+      "key": "d0eb01e88a9b281e6c2d3ceb793a1f259070de89",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17181": {
+      "key": "ad5bac8a4bb608da8d58d9681bd75043a608d9f8",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33710": {
+      "key": "8d2c052a9b3afdb9abb1f924eae2a722ed1e26fc",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17341": {
+      "key": "b6bf452b52fb2113290558cae1e0702e24f71f08",
+      "name": "Roundness=Default, Variant=Destructive, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33714": {
+      "key": "87f30414f9fcf1aeac7e787d62d56dfc08484da8",
+      "name": "Roundness=Round, Variant=Destructive, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:846": {
+      "key": "7938e53c5a36f6ca61907c58136085d669400faf",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33718": {
+      "key": "00ef07e492bae3eb22ac159e0ba9b81d44aa49d1",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16732": {
+      "key": "8a58bd3c3ab61b5f4a057290d37dcc6294570571",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33722": {
+      "key": "0664c1e8429b29231a6e1a6bebbefd7da763d4ef",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17501": {
+      "key": "e6e5ec2581be57ef82e0c527ecf53d818a4da9a7",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33726": {
+      "key": "afd8ef4ab01af13eea19b0051077b44f921c7600",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17661": {
+      "key": "d0e04b163b4ecaba3b7eedac58708f3ad64469ab",
+      "name": "Roundness=Default, Variant=Destructive, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33730": {
+      "key": "f58df6cf52ce5fa1d21e1ae6648f747ab9e4108e",
+      "name": "Roundness=Round, Variant=Destructive, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:994": {
+      "key": "41e610e77a2bdf969a82ad2efd7fee01a3c18bd2",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33734": {
+      "key": "88275ec1c1dfca6ba7165d2cdace4eb4769ceef8",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16572": {
+      "key": "988ab91055d2fd6c1f9ee018a03ec764488b0510",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33738": {
+      "key": "1f3a912a290114c7560071889ddc571b1151434a",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17821": {
+      "key": "b73a700e344f1f4a94d02715bd045e248a5f19cb",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33742": {
+      "key": "9633f97ec1f2b984d88a146bf85174f55d5bf090",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17981": {
+      "key": "edc2c9aeb698c92d8845fba3102af83ed72069fb",
+      "name": "Roundness=Default, Variant=Destructive, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33746": {
+      "key": "ce54c06bf0aa497a62917057811c0af4bd020b93",
+      "name": "Roundness=Round, Variant=Destructive, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18333": {
+      "key": "388b8d82affb8155621c4be4c6e06eb2762527e8",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33750": {
+      "key": "ac12d829e2a5cc6d5e19a95ae2feb2834554f470",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:13805": {
+      "key": "c3b87cf56dca82cbb067c5b660c79041483fff73",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33754": {
+      "key": "c0742924b2e3cfd5e09f2c7dd703bb7709a6bedf",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18337": {
+      "key": "76f6f50beb249d08ebd3426d8e1c448693c2198b",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33758": {
+      "key": "264043d7b992c28f9421bf8907433d7fb5302fba",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18341": {
+      "key": "b4444e22129f9540cd59fdcda3b9bbb2912c63d1",
+      "name": "Roundness=Default, Variant=Destructive, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33762": {
+      "key": "31a784e5e376da015e375b4123c79bd18beb5385",
+      "name": "Roundness=Round, Variant=Destructive, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125846": {
+      "key": "829115e24fcba9e0fa0019d6764c5bd0ceba56cc",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33766": {
+      "key": "4eced9f86413fdeb83eadfc997dcb6f9e22783bc",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125850": {
+      "key": "c0a7fc9216d406791ba2eaa49088894247dd1bcf",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16880": {
+      "key": "63e4eda8c9012360ec16ea6ea485d4a040e3f472",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125854": {
+      "key": "751abbee4fe8d61f35198d745ea09339ae30ccc8",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33770": {
+      "key": "b2e65a359ab84b7c43b07346252bdefe4967347c",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125858": {
+      "key": "c6b211e5abfa86c7e106961948bb96798d029347",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17169": {
+      "key": "6891889e9b7e8cb6e2ef3a978a186fba0f74040e",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125862": {
+      "key": "d48e1c350cbf15d256d3239896443616206d97f6",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33774": {
+      "key": "9ee63aad3233cc6a385c101ed371a0bb5469cc46",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125866": {
+      "key": "acdaee201e4ac38b41ac52f774e365b15866cd4f",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17329": {
+      "key": "d8554f7fa99588097d152a81b4c55e3a00c1ba62",
+      "name": "Roundness=Default, Variant=Ghost, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125870": {
+      "key": "1265d8a251a5d5e298f567beff09adae7d38263d",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33778": {
+      "key": "7c7a1d4a14d9cb045a21de0191c7752f37efae7a",
+      "name": "Roundness=Round, Variant=Ghost, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125874": {
+      "key": "8df9f181ec86a35014de1653f0e874f753036228",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:854": {
+      "key": "7a5a4983e3e8d332769427cf93079217bf3edc0f",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125878": {
+      "key": "78685c1918e5cf7edbd57d8654d6cf95b707c8dd",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33782": {
+      "key": "8343f8e8402d8110a07b304ff658c2d899696689",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125882": {
+      "key": "792a78ef5aa7eab54765721b6099e5ae1d4dbe86",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16720": {
+      "key": "09de964ba6b67ed3778122fd44a03e247e7e1533",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125886": {
+      "key": "4bf2525f094afeffe15014147ce7887145396109",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33786": {
+      "key": "b0135098afdeda78a10831ce557fef2a8a7775db",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125890": {
+      "key": "acf1b734e32eac5a2a1c434f1fb3707e70ccacf9",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17489": {
+      "key": "59b173bd3bb5bf77a7498236b995b21c56b5f3c6",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125894": {
+      "key": "196491b70e6b1585538bb98271adc0a72ac82097",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33790": {
+      "key": "75ffc98eb28ddfdf965177852dfa3b4b9c1d76c9",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125898": {
+      "key": "f6a2d619b3d39e1bd541040e0a70bf0ac120c1b3",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17649": {
+      "key": "25e172ba3121b180cc7579e22422f57b5a4568db",
+      "name": "Roundness=Default, Variant=Ghost, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125902": {
+      "key": "843418067806d940b5198c5fda1507c4604934e5",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33794": {
+      "key": "532e440d8e33e67cf1562e6c8c85b07cb493a790",
+      "name": "Roundness=Round, Variant=Ghost, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125906": {
+      "key": "a7b1f7babaea0684a0ecd83607d49ddb1f36fc60",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125910": {
+      "key": "c901702f3a53722e648fcfa07875f9ed22023c58",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33798": {
+      "key": "356646103d784e1dee1ce1e0879724826e104c4b",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125914": {
+      "key": "78ac519d520706a78b7cab3c39e8edc3015f2dc0",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16560": {
+      "key": "c10cc6b1a8584ae25627c5e95d8c3dd537117b12",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125918": {
+      "key": "16a587d68a76810915431de9731a5fb047052a77",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33802": {
+      "key": "ac6d41c816753655ffdd14503c129ad09eb69888",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125922": {
+      "key": "769dc42cffcb48d118ef768fad62b39d9a2c4924",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17809": {
+      "key": "3ba9c40166f5f7451f531823e2089f50e55ae66d",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125926": {
+      "key": "3a862248e0d977408bcffe62727dc78b821f5002",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33806": {
+      "key": "01a256976e81ae37d5fd2c451493f5a9d4374f4a",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125930": {
+      "key": "478bbb92905c6cb760ab5df9958578c8a13f888e",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17969": {
+      "key": "8634cdbe232433ed052ab6c394351c2d213a1c2e",
+      "name": "Roundness=Default, Variant=Ghost, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125934": {
+      "key": "88acdf05be9035c5ccfe7e0e768c877289fd5d61",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33810": {
+      "key": "efa19ddb255691230b0fb91f1182a1a3bd7a7445",
+      "name": "Roundness=Round, Variant=Ghost, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125938": {
+      "key": "a16c970cdbb9af383b26089538e535861d892448",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18297": {
+      "key": "0d64140126f3884db894757641f7bcbb1ee1ea54",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125942": {
+      "key": "d596768a344adfcd932f2cd1e55edcf49b757af9",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33814": {
+      "key": "c31bdb00eb54074cda4fc3f10d5101c77c0597ac",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125946": {
+      "key": "601c9fae0f699f235a6b86970e6fee432dd2d95f",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:13793": {
+      "key": "22a73eddcbfa0d7e0adfa1ea408344a6c4c39305",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125950": {
+      "key": "4f08ef14a5885df71a5c8689bc762c0e539a3f2b",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33818": {
+      "key": "21b0c4993a1f8c24c15238602513b7302bc58465",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125954": {
+      "key": "feebd2b95cbcc85c13247e4acb4d57214d7a2e2f",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18301": {
+      "key": "1d66244d63babb4a0ac234200ccbfab362c2951f",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125958": {
+      "key": "fc69b822a3bd31d4b946a9200763e18d48491e7c",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33822": {
+      "key": "e83dbddb90d96fc84828a12eb3c73f87c05d4f4d",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125962": {
+      "key": "c4ad6f1130758475110835735671e1c4e45fc5da",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18305": {
+      "key": "37c1974e100c1612e7a35362b5258d43a79202c9",
+      "name": "Roundness=Default, Variant=Ghost, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125966": {
+      "key": "d7b776f0d7aa05a6883871bcc421b21467dba552",
+      "name": "Roundness=Default, Variant=Ghost Muted, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33826": {
+      "key": "9d6b3966e1eb0d44dca4f494c056fc32e236593c",
+      "name": "Roundness=Round, Variant=Ghost, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "757:125970": {
+      "key": "f40d95d71d39de3bb2e219e6b687928441bda7b9",
+      "name": "Roundness=Round, Variant=Ghost Muted, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33830": {
+      "key": "6b9b9b521d041fdc6a4b4806e109ad4a12228c24",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16876": {
+      "key": "72978dbee3e253d85069294b0c3fc9d71954dc3d",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33834": {
+      "key": "148b916e9de7616d17b2e9611159c801c08bb972",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17165": {
+      "key": "bc03128e4f570f9ec659f19519f0d40533340b53",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33838": {
+      "key": "c2d116b0468d229d8b5651b2cd352cd249e98d4d",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17325": {
+      "key": "73ff11c078511d38507571f81cbd382de5d4afb0",
+      "name": "Roundness=Default, Variant=Outline, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33842": {
+      "key": "f6f1ad3a69c18a98331055ff3ca1cf245a600e49",
+      "name": "Roundness=Round, Variant=Outline, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:762": {
+      "key": "99e2ed3b0664b476433bbc5433b47480da3ba024",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33846": {
+      "key": "e4777f65deaedc6fcb58687ccce0b756c63d4aff",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16716": {
+      "key": "6c6a38313dfdbe63a5d1b1e7ac88ca054416ce7c",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33850": {
+      "key": "bcff83c8f9603adff60d7c0d6d7d54cc4eb764ad",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17485": {
+      "key": "bea229ae2ee673c5618883dfc04ba7913807ad48",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33854": {
+      "key": "a383f26d873cbabd3ab7f2abf7495d36679b1e1e",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17645": {
+      "key": "e106820501ec0223f8ed721b1335b99ed6f1df65",
+      "name": "Roundness=Default, Variant=Outline, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33858": {
+      "key": "15b5593f4239edbaeeb81e8fd4ad95146a808f5a",
+      "name": "Roundness=Round, Variant=Outline, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33862": {
+      "key": "787e4a4d091617a0fe3ae7dbdcfda807ba876710",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16556": {
+      "key": "1bd727080ad9d607fdfc2e850c7dec692d1d873c",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33866": {
+      "key": "7956b153df0eba5ad12cdabea110d094c8dccd81",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17805": {
+      "key": "6fad6f0a6ef0a4aa7a399b7ac487cf61c6d57f92",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33870": {
+      "key": "8ac94d79338fd6fccb26eb926785378069b8ae33",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17965": {
+      "key": "ed6e1fad5eee01005224d6115d2d9edd88e09a8b",
+      "name": "Roundness=Default, Variant=Outline, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33874": {
+      "key": "ba059f2eea45a511821cbb2f163287682e367562",
+      "name": "Roundness=Round, Variant=Outline, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18285": {
+      "key": "c1f655786aacb5770d499cddb3bd95a9779d59d2",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33878": {
+      "key": "8d0fae0e7ad5f0061d1bca4f02c2dadf73681670",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:13789": {
+      "key": "051791f49f0b79a60148a199235ff2ff86ca7bf9",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33882": {
+      "key": "976cb5dff8c9dd9922b9534ef95c01d0cb83b49c",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18289": {
+      "key": "6a74a1f2f3628608c7cc1cedb612f92b6b0854e7",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33886": {
+      "key": "3bca2335d2c7e6b85be01c06cb7c765c7fa3d2dd",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18293": {
+      "key": "45ec57d761d1b1a2c64cc852fb840a65c949b42d",
+      "name": "Roundness=Default, Variant=Outline, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33890": {
+      "key": "7176961108a065e5ca909cec442b4c52031f0d32",
+      "name": "Roundness=Round, Variant=Outline, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "9:836": {
+      "key": "234d8f51ac03c3e8e8e2ca27f7add2005b432c37",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33894": {
+      "key": "9ee8df69a056dd46d1b51dd5aacfb48d2e6f3809",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16884": {
+      "key": "3d1d6993323bef27fbd5b003f234a8e660f76547",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33898": {
+      "key": "9ffd7b56a0bd9a70bee47536a06be4e921d007be",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17173": {
+      "key": "cc7dc496e5c2f5b5a81dce75e4a7e74aa503a2bc",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33902": {
+      "key": "4d374dd1bd1762c225b9a79b647eecc66b0c3533",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17333": {
+      "key": "2d999931da5ded6690b6c647c52c7448d2c146d3",
+      "name": "Roundness=Default, Variant=Secondary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33906": {
+      "key": "4f9c614d038dc0fc83a02ea1b72d70a23139bed5",
+      "name": "Roundness=Round, Variant=Secondary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:850": {
+      "key": "0d847487769a3212a5429aa3b3d8e80a073b230e",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33910": {
+      "key": "81343b79f608200aeffcb773f388ddc7ace3815a",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16724": {
+      "key": "5da38dc11161dd65c4717156fc71518e8317d439",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33914": {
+      "key": "59d42f2422542a703f97d4346d33c24941c7b925",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17493": {
+      "key": "47afbd2f3d688def4a1e232216ef9039d637b090",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33918": {
+      "key": "03e8d745ab83cffdef45a37c5c17c1963a8897c9",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17653": {
+      "key": "bde9c461fc23406b7689818d0c3d0786381c6780",
+      "name": "Roundness=Default, Variant=Secondary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33922": {
+      "key": "5716518bdd5c2d0361e3f7a0fc856331a29df2f7",
+      "name": "Roundness=Round, Variant=Secondary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:998": {
+      "key": "2a7d702dd44d7abd375818425aa5b7647a4fa772",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33926": {
+      "key": "ac5b28df7eaf7524e393cca2dcf1b7394bc790a6",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16564": {
+      "key": "30549ede9b402370bb9784eddb87ce9a028b88da",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33930": {
+      "key": "f8eaa9557a6c8bedf0c596bef7178d22ce3683bc",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17813": {
+      "key": "bff23d4e82bea8857d407a86a7d8369d1af1e4b9",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33934": {
+      "key": "10b4b398e9f3430e7bf0dbff824d6ad96b8f35d9",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17973": {
+      "key": "17e61ae0cdbbf23f6604164bbc64e7d46568689d",
+      "name": "Roundness=Default, Variant=Secondary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33938": {
+      "key": "ee21d85af1448a56f04d3ff21adab6b4d9ff345a",
+      "name": "Roundness=Round, Variant=Secondary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18309": {
+      "key": "d6a2be591dfa1623ac0f7bd47badc2aac44f8ba8",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33942": {
+      "key": "2a820976e32693ef7e6c73784702440c7a925a2d",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:13797": {
+      "key": "52203908014db4f966f05125b3f7f5a3ca2568a9",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33946": {
+      "key": "8a2ac5d43c1220ce7b51833cd0745dd5818e00b3",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18313": {
+      "key": "6436b2037ba5cff5f6d963a89ddd8c8d6c75d6d9",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33950": {
+      "key": "9bc5eb604e8aa4678687adff28814b067e673dfe",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18317": {
+      "key": "c4ee28466cb7ed7c8a89e7ca66855ccd4383ae52",
+      "name": "Roundness=Default, Variant=Secondary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33954": {
+      "key": "671f20ea00885d3e6e745ffa6eb398b0604c0676",
+      "name": "Roundness=Round, Variant=Secondary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "9:786": {
+      "key": "0730f54c932f2e8c14e6265890e781d95ceffd76",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33958": {
+      "key": "fc58c970461c73bebce6ee1c12151a6db9a9d027",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16888": {
+      "key": "90dd7a1baebe2a6b35aedf1aafc2b149774ee65c",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33962": {
+      "key": "6b5416bd2bbbc30f0a7f015eac306c021156ebb8",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17177": {
+      "key": "0524115cea5304aaf712ec24267da8fa7ac199e8",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33966": {
+      "key": "7120cf01987b09f692f5b577fb97abeaceb232ca",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17337": {
+      "key": "630ecb1c9fca417fb069f26dc592b1be8b2ed577",
+      "name": "Roundness=Default, Variant=Primary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33970": {
+      "key": "33bf2e42a638ec3ec1fbdb473745649c6106ffc5",
+      "name": "Roundness=Round, Variant=Primary, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:842": {
+      "key": "16e1908c843b2bc7fdf4e6a3d0ce346f82ab00cc",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33974": {
+      "key": "899dc497b63dafa02166007a9d035b250162ead0",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16728": {
+      "key": "9cd17e88f1aae82ea4503308b808bcbdeaeea792",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33978": {
+      "key": "f6ac3dffed2986e35f5dc93171ef3dc5a5ac9cda",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17497": {
+      "key": "1aa983b1a3a2405b4afd978e5b1e983b51c92823",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33982": {
+      "key": "b0b705b4876da180276804b4f828b34f5b929bd2",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17657": {
+      "key": "d7400111271058457c17f4345e74d9dbfd57ba07",
+      "name": "Roundness=Default, Variant=Primary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33986": {
+      "key": "7ac7a8f87486ce1e3909289bbbb83f68f1681120",
+      "name": "Roundness=Round, Variant=Primary, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "13:990": {
+      "key": "8decf4ef86cb0f8c51c84508101e2a8bb3f6c322",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33990": {
+      "key": "5708255f54a24c84f4ee152eec94d7d808b281de",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:16568": {
+      "key": "4a67eaa95f81b4e1abdf6d0c3881eeb1d9a833bd",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33994": {
+      "key": "5165fc490b52d373db9186800225d0ad70e64efe",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17817": {
+      "key": "ccba4f1bca9e82956b212c59366977b2e8068213",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:33998": {
+      "key": "32b9b2cf8661923d78a2fd04573137593630137f",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:17977": {
+      "key": "0e125a32c9ef55da2d9a8b5bfca2002ceaf25462",
+      "name": "Roundness=Default, Variant=Primary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:34002": {
+      "key": "f9eb727b689c5a4e2cc388f5994082f9d942cb4e",
+      "name": "Roundness=Round, Variant=Primary, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18321": {
+      "key": "32dc479b9ca7ab79835ca071de7644a3bee8ad5c",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:34006": {
+      "key": "72cca15102e908beb6b31d9268c70cdbd2ce71e0",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "176:13801": {
+      "key": "8076041c7b43eb0c2ceeb037d95ddd0c27cb401c",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:34010": {
+      "key": "823f70ac29e199394b12338044cc3d3ac59bd359",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18325": {
+      "key": "f25da6c95ebf02fa2526b2dda6b517e4f8f7f367",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:34014": {
+      "key": "88bcedef5e08df415601413ce7de5714a9564e9b",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "153:18329": {
+      "key": "6d8152a77769291b5ca843c5d173151ef5430695",
+      "name": "Roundness=Default, Variant=Primary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:34018": {
+      "key": "8e5d71ff0641e9b05c41bfd334890d0e53c18d21",
+      "name": "Roundness=Round, Variant=Primary, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:775",
+      "documentationLinks": []
+    },
+    "755:41584": {
+      "key": "c0d0cadd412e791f7c4b0f8ddd6e3a7ce002a5ed",
+      "name": "Roundness=Round, Size=Regular, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:2028": {
+      "key": "ab12d2417378fbf096963b00dcd7bb63cff0ce7a",
+      "name": "Roundness=Default, Size=Large, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41471": {
+      "key": "d75577e75458adb8e8f9bbbfdc496d8104688dcb",
+      "name": "Roundness=Round, Size=Large, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41496": {
+      "key": "c9c3620f504971811c659460c4520e888662560f",
+      "name": "Roundness=Round, Size=Small, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38675": {
+      "key": "decc0d101c3fb0b36ab6b3ec034003573a8ba520",
+      "name": "Roundness=Default, Size=Mini, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41623": {
+      "key": "aeeb46685e6e6c3cb38936428e6cb744703e7826",
+      "name": "Roundness=Round, Size=Mini, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41542": {
+      "key": "fdfcb6071f3b77bdc26fd3c20dcb9c8831e3a8f1",
+      "name": "Roundness=Round, Size=Regular, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1286": {
+      "key": "0908ee671bf4d59202647c49a457d8f3844a4ec6",
+      "name": "Roundness=Default, Size=Large, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41482": {
+      "key": "c067851cda8d8becf99cd3e4bfb97c55dca5d246",
+      "name": "Roundness=Round, Size=Large, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41514": {
+      "key": "162110b627ca68d1101178db29b9ab2ab6ef404b",
+      "name": "Roundness=Round, Size=Small, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38633": {
+      "key": "0f2f44b3da128b48ebed295186e27562e8f8e628",
+      "name": "Roundness=Default, Size=Mini, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41549": {
+      "key": "a63a7fc043bec8fb22d72cdf256948ac4510dd79",
+      "name": "Roundness=Round, Size=Mini, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41528": {
+      "key": "21a5f610b2a27c15a87067b592f98e0627281e04",
+      "name": "Roundness=Round, Size=Regular, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1288": {
+      "key": "3b65b3b18caed3c2ccf471c91c5dfd66fc4452a0",
+      "name": "Roundness=Default, Size=Large, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41535": {
+      "key": "d8b6422dcf20982701bfb986f04c5a5d4c92628a",
+      "name": "Roundness=Round, Size=Large, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41556": {
+      "key": "147503a0acdc57f2b485a7ef8f086cff96a822b3",
+      "name": "Roundness=Round, Size=Small, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38640": {
+      "key": "0d87b1f9c686b33c1e8d25fad31ccefb0a919ab6",
+      "name": "Roundness=Default, Size=Mini, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41570": {
+      "key": "60ff2196861efef0feec72b20fff7c7257610dc2",
+      "name": "Roundness=Round, Size=Mini, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "140:11539": {
+      "key": "0bf19264e84446ce7c32b2c475924c8e30390b5a",
+      "name": "Roundness=Default, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41563": {
+      "key": "02c4d54a1808db6c30b7a59d24a51ffebad6f552",
+      "name": "Roundness=Round, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "140:11546": {
+      "key": "24f2ae99d60e98ca43aa03a2c6a8a64b9b524e78",
+      "name": "Roundness=Default, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41507": {
+      "key": "a538fd2e966e9f876c8b0481a89308131c03f305",
+      "name": "Roundness=Round, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41489": {
+      "key": "e179f09560d9ed81fe5d783d8c8f50f11993abd9",
+      "name": "Roundness=Round, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38647": {
+      "key": "ed58905a5b90cfcbfbe1e98bc9d1d6ee70d27054",
+      "name": "Roundness=Default, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41609": {
+      "key": "005e97c38377cc4719feb989cb1bc61b6dfc3c3a",
+      "name": "Roundness=Round, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "16:1735": {
+      "key": "5b5e3303d3c9a06c10be3233a2c337a8bfad3c2c",
+      "name": "Roundness=Default, Size=Regular, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41500": {
+      "key": "0122a80dd0413270f9f295ff758e5649f2200b03",
+      "name": "Roundness=Round, Size=Regular, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1292": {
+      "key": "06832b5896fe8becf75c0396ca4c62f510e150ba",
+      "name": "Roundness=Default, Size=Large, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41521": {
+      "key": "68858204756533c0e5ad4a000f574d53acb4f988",
+      "name": "Roundness=Round, Size=Large, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1312": {
+      "key": "380a049dd82565544c2e5d149bb7b4a5ab10e46d",
+      "name": "Roundness=Default, Size=Small, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41595": {
+      "key": "2dc55592de700f6b48f6be9d1be892358597c983",
+      "name": "Roundness=Round, Size=Small, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38661": {
+      "key": "d4f7486e5ab1f1dd948ea1988117e5401e7508a3",
+      "name": "Roundness=Default, Size=Mini, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41577": {
+      "key": "c5125657caeed95a180d666955240bdcdeb32bea",
+      "name": "Roundness=Round, Size=Mini, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "16:1733": {
+      "key": "0f0814d720e7bc9f71842b2b8f9ba531021dc619",
+      "name": "Roundness=Default, Size=Regular, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41588": {
+      "key": "07cb8cfacbd6c91383ecf906034435a7c13f652f",
+      "name": "Roundness=Round, Size=Regular, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1294": {
+      "key": "e20fa74be0cbc048f1349cc7bed4de5c4df1584a",
+      "name": "Roundness=Default, Size=Large, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41616": {
+      "key": "cde6123e13f63572dc6a3978dad13587b4496c57",
+      "name": "Roundness=Round, Size=Large, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1314": {
+      "key": "78c0fbd317cc8b9bf99b783eacfbbc2eca065e4b",
+      "name": "Roundness=Default, Size=Small, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41641": {
+      "key": "43424fa166ab74ff9ebf201d06cb0ec2b47ff3ae",
+      "name": "Roundness=Round, Size=Small, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38668": {
+      "key": "bdaa225515cb14122ba4c6eb4b4808ce51bcf4dd",
+      "name": "Roundness=Default, Size=Mini, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41627": {
+      "key": "6eba629a952c3af8ee6d82d8d705f4f6270a2419",
+      "name": "Roundness=Round, Size=Mini, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "16:1734": {
+      "key": "7052fbf9110bf47435301e8951b97813544ff4db",
+      "name": "Roundness=Default, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41634": {
+      "key": "98ee1e899f2298e22c779f477c21cb1a0692b51d",
+      "name": "Roundness=Round, Size=Regular, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1290": {
+      "key": "73bdb4169dfd362583f8f4fc2842fc9446e1aa0b",
+      "name": "Roundness=Default, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41648": {
+      "key": "894e96e6dd0c92ff862cc2450eafc1076e42912c",
+      "name": "Roundness=Round, Size=Large, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "19:1310": {
+      "key": "5b4a916d83a8435561c697c8be03c221353194b4",
+      "name": "Roundness=Default, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41602": {
+      "key": "6a1014fed6c545cf05c5dbbae6a3f210dd8c97c9",
+      "name": "Roundness=Round, Size=Small, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "225:38654": {
+      "key": "9cd33c33b4bcdeb5475b8d0dbb9fd0d41f366c77",
+      "name": "Roundness=Default, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "755:41475": {
+      "key": "a65e05f33be7c81b7533eafa59cf68a2f3713e8e",
+      "name": "Roundness=Round, Size=Mini, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1738",
+      "documentationLinks": []
+    },
+    "65:5081": {
+      "key": "242b7e88161508ee43df58d2c9854a4b85332424",
+      "name": "Type=Text, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "18:994": {
+      "key": "b21a48c1d0d590f8d2839de6dbdea2ddd3281fdb",
+      "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91671": {
+      "key": "18b88f292e20b13ee3772340e3a3c7bfb6562f7d",
+      "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "66:6006": {
+      "key": "c550efee94383c1b74c60e53c736f5bb2372c7ac",
+      "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91663": {
+      "key": "22b571453d8aca14487040d44b467bae6f479086",
+      "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "66:5990": {
+      "key": "615859a4b9e44ce7f59bb40374ce8852112822d5",
+      "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91691": {
+      "key": "f028c61ccb9f5120eabbfeafe5ca9869d2d0911f",
+      "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:38988": {
+      "key": "64d482d32bf6c1a3f390afade4d0c1fdf2acc760",
+      "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91779": {
+      "key": "18b4482eee8cf5103c9de745b42c1e5d9fa7f1cf",
+      "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29058": {
+      "key": "62a29cc9e0cb99bcbff8964e659c65be8e1fedb7",
+      "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91723": {
+      "key": "a19891db04b0cf1377dfb931ef5e4489521c5bb2",
+      "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29066": {
+      "key": "2668f85184244b03de0192b8bc9bbab2986f0823",
+      "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91703": {
+      "key": "e3af3a38f96d5f6f3a43c87516d51670703e00e8",
+      "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29062": {
+      "key": "d7ef27f608066d47312b6c37814077f02174efa3",
+      "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91667": {
+      "key": "6e6e16bc3fcfcc7a93dd0a5c6c6a22933609dc68",
+      "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:39000": {
+      "key": "1bd596d5e06b6ab49a79116fa7fbbd1d15b8e74d",
+      "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91683": {
+      "key": "9e400f67ea98ce32297d8ba37a50a019bb15891b",
+      "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29106": {
+      "key": "61eeb207c12bc565ba40ad2ee4817777e8d2376f",
+      "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91679": {
+      "key": "26af7295cde7951f13328456a9759170d9a0289d",
+      "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29114": {
+      "key": "8b7365ef5694fcdf2f2de8f2737d3bf75fcb9b3a",
+      "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91687": {
+      "key": "7e031c24dbf6b9e3b580192d5ab90a1e2815334d",
+      "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29110": {
+      "key": "9f095a529d658a662efc4c7666a26fff72b87cca",
+      "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91675": {
+      "key": "1386930b6725718a2a0929f4c7cd17f89f5baf6d",
+      "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:38992": {
+      "key": "81376c31a2a347626d52010b513e2677bcee30c1",
+      "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91731": {
+      "key": "d277d62f68262aece15157dc8515ae89c2246d04",
+      "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29122": {
+      "key": "94e98b3bb61589ebb19a8aa7b17dbe5e976ca860",
+      "name": "Roundness=Default, File Chosen?=False, Size=Regular, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91707": {
+      "key": "c9d76f6005628b98d763001e3dd67da557fed5ea",
+      "name": "Roundness=Round, File Chosen?=False, Size=Regular, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29118": {
+      "key": "ceb513793a9510216468903ca70bf8728e8a56bb",
+      "name": "Roundness=Default, File Chosen?=False, Size=Large, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91659": {
+      "key": "2e659d4d0a0052f59ed97d780e4e44d1b7c14d31",
+      "name": "Roundness=Round, File Chosen?=False, Size=Large, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29126": {
+      "key": "574cfb90137b7a78cd1bbb3d71adbe5dd9a723dc",
+      "name": "Roundness=Default, File Chosen?=False, Size=Small, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91719": {
+      "key": "b56a25977d22afce99e3c626f9f43ff8ab33e2e3",
+      "name": "Roundness=Round, File Chosen?=False, Size=Small, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:38996": {
+      "key": "becc11dba994a4fedd7cfac8d527b8f1cd1f5ac2",
+      "name": "Roundness=Default, File Chosen?=False, Size=Mini, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91727": {
+      "key": "58a1e801b8be4a8dd61ba0cc02c1f9be77cacbae",
+      "name": "Roundness=Round, File Chosen?=False, Size=Mini, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "66:5980": {
+      "key": "c7ddd4f4fe304fd897dfa1cdc08b93bb17e7d413",
+      "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91735": {
+      "key": "bcff4db03c0651836c9bfa098566377a14423f58",
+      "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "66:6010": {
+      "key": "8a450c0b01487abb5ff9e1e6bc2e548ce478c5ad",
+      "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91739": {
+      "key": "1cb031729ec3fcbbc8cf1f0e7809f3a646fda494",
+      "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "66:5994": {
+      "key": "d24df732321e2e72e328186b1b4ca1ef39300e67",
+      "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91759": {
+      "key": "73077b40bb31318c292213de9f5f0c3931fd5338",
+      "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:39004": {
+      "key": "d6852a488ed60e1e7fcc140b608930e003078f02",
+      "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91763": {
+      "key": "1c02bd497442af4824e00d843d6c409aae51d68f",
+      "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29082": {
+      "key": "8ea5a0f2699a84ed6ba3e2bf9c268bdd970590cb",
+      "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91767": {
+      "key": "13448a000b53e0781edc14d99f59fd53e770cbc7",
+      "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29090": {
+      "key": "1b44ea7910e0f33ff0f78d4151432eb7094d0c4c",
+      "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91695": {
+      "key": "ba98a9f5c322ab127a6eed5d8a4ce63d2f241210",
+      "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29086": {
+      "key": "cdca42609f5413a5741691d4ff5a0c8eb54c78ec",
+      "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91699": {
+      "key": "65d4549b5e45cdd4c02942229277becac78f8a02",
+      "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:39016": {
+      "key": "360d5f88850f93c5e603cd1c163715e741ba3f1d",
+      "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91743": {
+      "key": "cfdf5278879d5740d4497af4a7b024d8b0c4dd59",
+      "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29142": {
+      "key": "0dd847d06ba7ac9812cd5cca53061a99cc584b90",
+      "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91747": {
+      "key": "5f2ceac78b4b3e3f8e3b52cd9871efa7f5b423a0",
+      "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29150": {
+      "key": "be18d41ca7e96cb779fd70dec5eefb5c86cb0785",
+      "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91751": {
+      "key": "9338b45964c65541121f8d0186f7b52d238ae959",
+      "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29146": {
+      "key": "c76e9473b40dfdf014e715cde68e6a3331bcb943",
+      "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91755": {
+      "key": "1d6bf94f77d93f28b888538dce36268723abe4ca",
+      "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:39008": {
+      "key": "bfbdcc21dc7d3a14e12d24f10d6c04b2ec975acd",
+      "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91771": {
+      "key": "01919e4d94de9bafeeb6d92b209c01e4be779dbb",
+      "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29166": {
+      "key": "477112fc37541b67517ec9091c9b3a857c38be8d",
+      "name": "Roundness=Default, File Chosen?=True, Size=Regular, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91775": {
+      "key": "0c41d373f3eaf23d806bff3bd26be2b41cc0b295",
+      "name": "Roundness=Round, File Chosen?=True, Size=Regular, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29174": {
+      "key": "30a53a6d2f38121f3841ff0e5ffff8785c70bab2",
+      "name": "Roundness=Default, File Chosen?=True, Size=Large, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91711": {
+      "key": "9f69dafac6828926502bf1cf6daeed6833a36e60",
+      "name": "Roundness=Round, File Chosen?=True, Size=Large, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "179:29170": {
+      "key": "7094d388b9c82200d7dd1f4a4008bb9e9dec6b4b",
+      "name": "Roundness=Default, File Chosen?=True, Size=Small, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91715": {
+      "key": "79e7b8970753ab9247c8cd51e7a27590ebb99591",
+      "name": "Roundness=Round, File Chosen?=True, Size=Small, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "225:39012": {
+      "key": "d0e69448f53a3490e94102af01f40134dfc233cf",
+      "name": "Roundness=Default, File Chosen?=True, Size=Mini, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "756:91655": {
+      "key": "f428fc5d367416b3ee8ea9801f9ef3522e3e478d",
+      "name": "Roundness=Round, File Chosen?=True, Size=Mini, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "66:5981",
+      "documentationLinks": []
+    },
+    "140:11701": {
+      "key": "326ff9e689c2d7515c5d9cf903fff85d03f7ac40",
+      "name": "Size=Default, Position=Left, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11704": {
+      "key": "1d510c2cc7db447ac1055e22b817a1ea214ee5b4",
+      "name": "Size=Default, Position=Middle, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11707": {
+      "key": "b23537ada16d5550cc1fe8ad38f67e08cfe5285d",
+      "name": "Size=Default, Position=Right, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12035": {
+      "key": "b54bd1ae7ed0a0ebab91d450888f9f66e7b42c77",
+      "name": "Size=Large, Position=Left, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12046": {
+      "key": "347c09199f2df59704322e40c5d79991a477b734",
+      "name": "Size=Large, Position=Middle, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12057": {
+      "key": "2e5d15165b46f6d83f71b5d6f17fb0bafd35ae36",
+      "name": "Size=Large, Position=Right, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12155": {
+      "key": "0d089cb1e695d076e9d491581aed013f9a662344",
+      "name": "Size=Small, Position=Left, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12166": {
+      "key": "d4bb07c50179de83d565ab640f567c8d1d8d3a36",
+      "name": "Size=Small, Position=Middle, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12177": {
+      "key": "6bfadd83e89f58ed49faa34bac21ceff2dfec288",
+      "name": "Size=Small, Position=Right, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38903": {
+      "key": "60fadff13bde4e3713d02c1f6c5b3070f3e436ee",
+      "name": "Size=Mini, Position=Left, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38914": {
+      "key": "e1b057a28e456ba1a526d62e23e0bc96830948a2",
+      "name": "Size=Mini, Position=Middle, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38925": {
+      "key": "ce25ff0912cf4faef74082ec646f63723c9f5cdd",
+      "name": "Size=Mini, Position=Right, State=Empty",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11674": {
+      "key": "cab6ebf378c5b8fa26f22cbcffb515e79d800d6e",
+      "name": "Size=Default, Position=Left, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11677": {
+      "key": "848732d73031817e51eeec2735ba5119bee06e13",
+      "name": "Size=Default, Position=Middle, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11680": {
+      "key": "3329438ec2fc73420da875936a34927c2a0a28f9",
+      "name": "Size=Default, Position=Right, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12032": {
+      "key": "80b98889a3814b2bfe11185769ec0749dfba2e06",
+      "name": "Size=Large, Position=Left, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12043": {
+      "key": "1393d959532019eb148f67e2d68a162b0f0c056e",
+      "name": "Size=Large, Position=Middle, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12054": {
+      "key": "4f5905967194242bff68ef6ccb849473febac3ef",
+      "name": "Size=Large, Position=Right, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12152": {
+      "key": "85cf9e94b595c845d1e8908f6e7b3f53320f220c",
+      "name": "Size=Small, Position=Left, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12163": {
+      "key": "a08ea183ce5a19c9ae75ef0e7b7632b29f8c4acf",
+      "name": "Size=Small, Position=Middle, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12174": {
+      "key": "bbfb338dcdfaf6c16cef635a352107adf702e70b",
+      "name": "Size=Small, Position=Right, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38900": {
+      "key": "f6d01788eebd47f17d4701fea7009cf4809b754f",
+      "name": "Size=Mini, Position=Left, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38911": {
+      "key": "daaebfdb591885a69dec0becdea4314b7eee3ea9",
+      "name": "Size=Mini, Position=Middle, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38922": {
+      "key": "688060d905655919e88ab24282f4eb7ae211ff30",
+      "name": "Size=Mini, Position=Right, State=Placeholder",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11457": {
+      "key": "253830a9d078d6ceaf3c233db1a94b6d0b27c234",
+      "name": "Size=Default, Position=Left, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11456": {
+      "key": "c007a8a39d504a4c650042d99fe8ae351e924f14",
+      "name": "Size=Default, Position=Middle, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11458": {
+      "key": "504983919eaed19264b8c21d90238c7b2e94b491",
+      "name": "Size=Default, Position=Right, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12026": {
+      "key": "9c0bca7b0fd85102dd97387b27ac6f253ed54002",
+      "name": "Size=Large, Position=Left, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12037": {
+      "key": "2900c47081f2eb3a059f8349a64c951a89b8e5ec",
+      "name": "Size=Large, Position=Middle, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12048": {
+      "key": "f4aba5519cc48d7422e7e3901a7e4057011a3fa2",
+      "name": "Size=Large, Position=Right, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12146": {
+      "key": "31335260dae55295dbffdd34b070b4a3f627ac0c",
+      "name": "Size=Small, Position=Left, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12157": {
+      "key": "664bc4816485a6410a5071bd31adf9a0b4ab5286",
+      "name": "Size=Small, Position=Middle, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12168": {
+      "key": "e4730549a1bb2bb7db450afd57db30bf86436bbe",
+      "name": "Size=Small, Position=Right, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38894": {
+      "key": "c71a34a462951ce80ecc1ba765c108e486cd9165",
+      "name": "Size=Mini, Position=Left, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38905": {
+      "key": "3fd7d416be388904eaa3afaabf1dedfc1e3791db",
+      "name": "Size=Mini, Position=Middle, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38916": {
+      "key": "a590b04899d1f5009f6e4a132ce64156251e0333",
+      "name": "Size=Mini, Position=Right, State=Value",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11662": {
+      "key": "5105c9e9ca3d570bd6329e8ce2e3ea56bdbebe4d",
+      "name": "Size=Default, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11481": {
+      "key": "39841d3a0c07253aa7fc8519c4ac5955aa151db2",
+      "name": "Size=Default, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11656": {
+      "key": "fba233aa5052f84e1c6848963bff1cb4c45470bc",
+      "name": "Size=Default, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12059": {
+      "key": "87d20c0c51195b5568ce1f5b68a72270507b2e6d",
+      "name": "Size=Large, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12068": {
+      "key": "6d6b89d7e11ccbd89feebbd2a7cbea744d56c8c3",
+      "name": "Size=Large, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12077": {
+      "key": "655c46c721abf586c7b9b749fe4be75a7486a40a",
+      "name": "Size=Large, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12179": {
+      "key": "df757bd6eae63034d1ebb18a4649e5da55b998de",
+      "name": "Size=Small, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12188": {
+      "key": "4b2f846578107ba314da033c1b2d2e36f98125d2",
+      "name": "Size=Small, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12197": {
+      "key": "11fcb1242b818317f7a3169cf7b38d3ad3a9e3ca",
+      "name": "Size=Small, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38927": {
+      "key": "0c9295c3030de055e5cdf1026836b073cf7e0a61",
+      "name": "Size=Mini, Position=Left, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38936": {
+      "key": "a4ae49c877a3be10d0d161e4569450e6d3895ff1",
+      "name": "Size=Mini, Position=Middle, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38945": {
+      "key": "483643b8d125be5cc9debe3f5a3518f7f417607a",
+      "name": "Size=Mini, Position=Right, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11744": {
+      "key": "ac12179b72863a7f8cafc0878b38b339e3705dae",
+      "name": "Size=Default, Position=Left, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11747": {
+      "key": "11104914995de4866840b4dfaf719616661f0d80",
+      "name": "Size=Default, Position=Middle, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11750": {
+      "key": "551d0ecc070f63f6a9674ac549ab094d461a6b9f",
+      "name": "Size=Default, Position=Right, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12065": {
+      "key": "01573ceecc8c537878d32e83483c358d6c40800a",
+      "name": "Size=Large, Position=Left, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12074": {
+      "key": "674d2d21ea35837cfd054e94ea6183ed42a4c186",
+      "name": "Size=Large, Position=Middle, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12083": {
+      "key": "a15af72c7d9c1f455bd5629fb27d145455f6e162",
+      "name": "Size=Large, Position=Right, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12185": {
+      "key": "e02bec10ad8052627edbf592e72e3456aaff3eb0",
+      "name": "Size=Small, Position=Left, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12194": {
+      "key": "1c380fec68d01d18c1382c736f9d7c2e4e83d882",
+      "name": "Size=Small, Position=Middle, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12203": {
+      "key": "a86450314d78275945cc8b7c7ce330667b1184f1",
+      "name": "Size=Small, Position=Right, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38933": {
+      "key": "22d8ddbc1200a12cd6b0c6bc16e2598e06f3dcfe",
+      "name": "Size=Mini, Position=Left, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38942": {
+      "key": "a044d3e2f9ae3cd51b6017c2954a15581377dbb1",
+      "name": "Size=Mini, Position=Middle, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38951": {
+      "key": "a0303d6bb261a97b5a35b86c2b666b36b631b3e0",
+      "name": "Size=Mini, Position=Right, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11719": {
+      "key": "c46c8646c4ea3fe22fafde31e5fd3591477e4b2a",
+      "name": "Size=Default, Position=Left, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11722": {
+      "key": "3fda59b38918adbfa7c6dcab0520b0bdb1374eaa",
+      "name": "Size=Default, Position=Middle, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11725": {
+      "key": "274f55db03a78dbea1f1cedcc573adb98be6a07c",
+      "name": "Size=Default, Position=Right, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12062": {
+      "key": "c81abbef909ac56e392d9e6d0a3a2c4894314f86",
+      "name": "Size=Large, Position=Left, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12071": {
+      "key": "8d9b9a8ff2c95d016217a18853dadb13788886b5",
+      "name": "Size=Large, Position=Middle, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12080": {
+      "key": "a19f3c61ac4f71033007021d4521272fcada0c9b",
+      "name": "Size=Large, Position=Right, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12182": {
+      "key": "6d88d5f0dc569e4b07d63b63b422dab047310d3e",
+      "name": "Size=Small, Position=Left, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12191": {
+      "key": "999d9cb3f8fd2cca731ff5b5db70953b8f61bd67",
+      "name": "Size=Small, Position=Middle, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12200": {
+      "key": "e78e5263c0a8cacf4394f1de478e4f98a30c2d65",
+      "name": "Size=Small, Position=Right, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38930": {
+      "key": "cee6f0c6ef9e3898100a61ead8e3d3d4760aacb1",
+      "name": "Size=Mini, Position=Left, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38939": {
+      "key": "23d9cbaf567d5a333310418039b5b458ee2c002a",
+      "name": "Size=Mini, Position=Middle, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38948": {
+      "key": "b0ad4cf07e24fe5d7e1b42490a7a0a24151313eb",
+      "name": "Size=Mini, Position=Right, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11762": {
+      "key": "1f278bcf5cc3f4178cb25e889c05e7fe0ece1098",
+      "name": "Size=Default, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11765": {
+      "key": "81921d5d0d80ea494aff1dd67a0adc8067a5357a",
+      "name": "Size=Default, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:11768": {
+      "key": "311a3679c115d3df11b2fd476c093ca09d6032b3",
+      "name": "Size=Default, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12029": {
+      "key": "5154d95101039cc71a075558f291c6fb814b76ca",
+      "name": "Size=Large, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12040": {
+      "key": "b0eec54bbfa20dc9795cca08e49781a794c3303f",
+      "name": "Size=Large, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12051": {
+      "key": "f346e9a80bb0cbe646ba32c3c3b459b301214b95",
+      "name": "Size=Large, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12149": {
+      "key": "0ef7f95dfcd79e3229fe408db175b6e38972d5b8",
+      "name": "Size=Small, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12160": {
+      "key": "b3c8c2b0e5eb4d51e5d869d98f476ae2953f5209",
+      "name": "Size=Small, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "140:12171": {
+      "key": "e5fa95431b89ed7123d515ade9f41a0421a60c33",
+      "name": "Size=Small, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38897": {
+      "key": "62c76ca6e580ac78ea75feacd7e73925b12165d6",
+      "name": "Size=Mini, Position=Left, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38908": {
+      "key": "ab75c22b12aa66dfc16a5b10818482dd916de5bd",
+      "name": "Size=Mini, Position=Middle, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "225:38919": {
+      "key": "1671247c268db0a3cb8396bda85e2a7ffc2f5744",
+      "name": "Size=Mini, Position=Right, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "140:11468",
+      "documentationLinks": []
+    },
+    "780:42511": {
+      "key": "cd0cb515737ae99391f7ca477cd6aa79dcba01d8",
+      "name": "kbd",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "780:43835": {
+      "key": "62cb22d21273dbfb8bb621d03e1a939583793159",
+      "name": "kbd combo",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "162:17323": {
+      "key": "2bba0f3520c37485bc560efb292ff53b88c80c12",
+      "name": "Roundness=Default, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154942": {
+      "key": "333aa3d2f7972057258bdc733e661d2ed8c8f6d5",
+      "name": "Roundness=Round, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "156:13794": {
+      "key": "50fe65987ea83a8d270c09e9611c4abfca4652af",
+      "name": "Roundness=Default, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154950": {
+      "key": "e708d6674a54071a21ad1e0dd6e5cc07116b8a83",
+      "name": "Roundness=Round, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "156:13786": {
+      "key": "9e7f4ca4f7cd82cb926fae3ddea33c568e23cd69",
+      "name": "Roundness=Default, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154958": {
+      "key": "3dfe98045016b586724b2f37f471d5c2c3d5bf29",
+      "name": "Roundness=Round, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "162:17315": {
+      "key": "d03963a0b5fa722e7d87c1f104852f28225770c4",
+      "name": "Roundness=Default, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154966": {
+      "key": "14991a318f4a4dc259dcc6c563a3b38038f039ef",
+      "name": "Roundness=Round, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "11:2008": {
+      "key": "02f0777d318c9f56fafceb6777588b99ac4a2da0",
+      "name": "Roundness=Default, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154974": {
+      "key": "ddf89316cc808d8969b26a80b5d02d52b8727f65",
+      "name": "Roundness=Round, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "11:2009": {
+      "key": "33822bb3342d1e17001ac880974dfa42bf7d4de4",
+      "name": "Roundness=Default, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154982": {
+      "key": "f8360c9c53e8146bfb7d8680329d318d68d7a612",
+      "name": "Roundness=Round, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "162:17307": {
+      "key": "6f7a7899ced0ab8b3a1902199333b37d47ea39fc",
+      "name": "Roundness=Default, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154990": {
+      "key": "b0c6a32e58bd842a49a4db4286d96703ec32cc9d",
+      "name": "Roundness=Round, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "11:2011": {
+      "key": "0b7003d8c6842dc28cbcfc6bd249a7163bc8ce40",
+      "name": "Roundness=Default, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:154998": {
+      "key": "85b38216eba393de090c274d5fe9f91031c0f1c4",
+      "name": "Roundness=Round, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "11:2012": {
+      "key": "57f494b8e3d7f30d4618b482421efb61c35a61cb",
+      "name": "Roundness=Default, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:155006": {
+      "key": "33c0c231f2fa562c351a96f24bd9d601575dc725",
+      "name": "Roundness=Round, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "162:17299": {
+      "key": "f7bc3d15d46a2b80c87dc007936654886b575848",
+      "name": "Roundness=Default, Size=Default, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:155014": {
+      "key": "bfeef2b517118b5ff305d3088876fe76323a77d9",
+      "name": "Roundness=Round, Size=Default, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:155022": {
+      "key": "6d612016d06ae61c628853d801d715e031eb5006",
+      "name": "Roundness=Round, Size=Default, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "757:155030": {
+      "key": "abf588d8d31c939037ee488315cc490142094473",
+      "name": "Roundness=Round, Size=Default, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:2014",
+      "documentationLinks": []
+    },
+    "11:422": {
+      "key": "d7ac599734331974de574807968caac40a822a92",
+      "name": "Roundness=Default, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "11:1107": {
+      "key": "6a2beaebc428d24b5eae33b551f3fab21aa7cd3c",
+      "name": "Type=Mirrored",
+      "description": "",
+      "remote": false,
+      "componentSetId": "757:154511",
+      "documentationLinks": []
+    },
+    "757:154210": {
+      "key": "457d3e25e1c8b1d60ddddfd7100a6b919a556060",
+      "name": "Roundness=Round, Size=Regular, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17148": {
+      "key": "9f278b128ef3ff6aaf611bfa2e16304bb4affc1b",
+      "name": "Roundness=Default, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154213": {
+      "key": "96ddf3e51532150e2add377c32c8dc9dbbaa4acb",
+      "name": "Roundness=Round, Size=Regular, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17129": {
+      "key": "26bfac3cb643adb548ef8564eba555f1ab291b90",
+      "name": "Roundness=Default, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154216": {
+      "key": "0311306c3409bff9540d2af77aee35485732cda7",
+      "name": "Roundness=Round, Size=Regular, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "11:427": {
+      "key": "465240a77cfae1c4a40cbd1b4a5575bd7a31cd20",
+      "name": "Roundness=Default, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154219": {
+      "key": "aa7068597d359124963d1400fd8bba77141ae1fb",
+      "name": "Roundness=Round, Size=Large, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17151": {
+      "key": "c9fcc564b965b4afe5ff36fdf559a07c7da8587e",
+      "name": "Roundness=Default, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154222": {
+      "key": "b8628e5ed04a7a7e5ee880baa094a7400a107097",
+      "name": "Roundness=Round, Size=Large, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17132": {
+      "key": "bd8a6c7347d417849db1c8a85077a5edfffa5ad4",
+      "name": "Roundness=Default, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154225": {
+      "key": "ea997a668186417702ff576037484f58dbeccb9c",
+      "name": "Roundness=Round, Size=Large, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "11:432": {
+      "key": "f72e78f521e3fd36e408f74ce35a4f339ef4e9aa",
+      "name": "Roundness=Default, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154228": {
+      "key": "e9d06d9831c291ad5014e61e5a028085fff32aaa",
+      "name": "Roundness=Round, Size=Small, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17154": {
+      "key": "dfe2db8d4ed65f94c372f2294bcc4d0a53a4b920",
+      "name": "Roundness=Default, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154231": {
+      "key": "3dd0aad6222612d5b08e14c6836d4125b4c69cb9",
+      "name": "Roundness=Round, Size=Small, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17135": {
+      "key": "c3a771fbe0229a7f34544f6d8f6f5d774aadd6d0",
+      "name": "Roundness=Default, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154234": {
+      "key": "4911a66e00d02e5f40d9dbbdf0e27ff86978ed32",
+      "name": "Roundness=Round, Size=Small, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "156:13718": {
+      "key": "fad956f16b7e67df04c9120fa6d18c57e618ebb1",
+      "name": "Roundness=Default, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154237": {
+      "key": "a3d6b583a81da41bf83c2b63d268350df1d0d534",
+      "name": "Roundness=Round, Size=Mini, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17145": {
+      "key": "888db4bba9fa5493a176ecf2a515e3064a3c527b",
+      "name": "Roundness=Default, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154240": {
+      "key": "251c5d4711d9bc1775afc66b297d075ed1d38ccd",
+      "name": "Roundness=Round, Size=Mini, State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "162:17138": {
+      "key": "eec9433bc66501cc765eff20f67280aaa0ce25dd",
+      "name": "Roundness=Default, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "757:154243": {
+      "key": "dc9fd5812f5aa737fdbc55f9ba1167614eef603c",
+      "name": "Roundness=Round, Size=Mini, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "11:1126",
+      "documentationLinks": []
+    },
+    "294:233298": {
+      "key": "f9485bc3109f446d954474f984f33f7f59ef8cff",
+      "name": "Navigation Menu",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "177:25932": {
+      "key": "525cb0469a26982921c417ebf5da86e72b0040a5",
+      "name": ".Navigation Menu Content",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27849": {
+      "key": "653cd36af5ad7922f7219d690d36a6733e14d6cc",
+      "name": "Spacing=8px",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:27848",
+      "documentationLinks": []
+    },
+    "133:10576": {
+      "key": "c4f2479953ac9de3edef5a51dbd88c9df0b5fe4f",
+      "name": "Type=Previous, State=Regular",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:11358",
+      "documentationLinks": []
+    },
+    "133:10785": {
+      "key": "0f599318c7d816992a82051a34e462404d252696",
+      "name": "Type=Next, State=Regular",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:11358",
+      "documentationLinks": []
+    },
+    "133:12555": {
+      "key": "aa61eb1bfd95acbb0330d62591969ae21b9a2b46",
+      "name": "Type=Previous, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:11358",
+      "documentationLinks": []
+    },
+    "133:12557": {
+      "key": "761fe52d783cc2d05155cf1ef676aecc3eb61a4c",
+      "name": "Type=Next, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:11358",
+      "documentationLinks": []
+    },
+    "133:10928": {
+      "key": "9fe2af838b4da476f88804eab310206f0c9138a4",
+      "name": "Active=On",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:12195",
+      "documentationLinks": []
+    },
+    "133:11356": {
+      "key": "2d62365afcb2635ebad9d5440852b0eaf03f702a",
+      "name": "Active=Off",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:12195",
+      "documentationLinks": []
+    },
+    "133:11355": {
+      "key": "f1a8c0e41bf1729f52ce6be29c162d0433b6281d",
+      "name": "Pagination Ellipsis",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "843:105650": {
+      "key": "4a1b1bba7cc299ea07e4d23d13e2cc70d488d327",
+      "name": "Progress=0",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "843:105647": {
+      "key": "ee7ea6f5161edf6bcb4475e9f877b6c56185917c",
+      "name": "Progress=10",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "438:64982": {
+      "key": "76fdeb42a498c5191deea57fe392b46c59f31ee7",
+      "name": "Progress=25",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "843:105653": {
+      "key": "a4ad5c071f26a49eb0e1c85b1befda8d1d0ec6ba",
+      "name": "Progress=33",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "438:64985": {
+      "key": "e77c9569c410f65cfcd6b56373db4ede50b44600",
+      "name": "Progress=50",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "843:105656": {
+      "key": "305aa08ed0ab7e3458097a6131dca926d3205744",
+      "name": "Progress=66",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "438:64988": {
+      "key": "517131f181addd05df2574302e27b1ad8da090b9",
+      "name": "Progress=75",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "843:105659": {
+      "key": "b9ad91494781736eb75ca4cfbc8115df14694680",
+      "name": "Progress=90",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "438:64991": {
+      "key": "ea92c0ecd56339245db35d2d8fdaf98e53e30d60",
+      "name": "Progress=100",
+      "description": "",
+      "remote": false,
+      "componentSetId": "438:64981",
+      "documentationLinks": []
+    },
+    "147:11605": {
+      "key": "e91af957077dc9833b5e8b0cc68e815d8b4f94f3",
+      "name": "Checked?=False, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "147:11607": {
+      "key": "80dda4834d34a54ebdf3a6e5223ed87c79ff6952",
+      "name": "Checked?=True, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "176:25062": {
+      "key": "f3d0b7f25e3792597bbe87f8fb461ff019546cec",
+      "name": "Checked?=False, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "176:25066": {
+      "key": "18dce7f669b85b711f441c2c31338a0d19a4589a",
+      "name": "Checked?=True, State=Error",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "176:25116": {
+      "key": "7e0f63ee9fd5cd9e8fd32040794232d216e4376a",
+      "name": "Checked?=False, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "176:25118": {
+      "key": "7a0ae23bd1062fcd03cfee16010bb0ceef8584e7",
+      "name": "Checked?=True, State=Error Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "16:1912": {
+      "key": "933a8bbef4dc3dec1c5e593e71e4a9f1b877bbf4",
+      "name": "Checked?=False, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "16:1909": {
+      "key": "11cf7eb84ac0650ae07a885217ffb6b570eb4b54",
+      "name": "Checked?=True, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1796",
+      "documentationLinks": []
+    },
+    "280:104410": {
+      "key": "867d2389bf32d08a02b3465bbe725a66ff89be5f",
+      "name": "Checked?=False, Layout=Block",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6048",
+      "documentationLinks": []
+    },
+    "280:104413": {
+      "key": "16b7cc7480491eb5ba2954e37d8d1009a0ee0175",
+      "name": "Checked?=True, Layout=Block",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6048",
+      "documentationLinks": []
+    },
+    "761:108632": {
+      "key": "ed144aae5a893cfac33dd1d547bf342d2e555b24",
+      "name": "Checked?=False, Flipped=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:5987",
+      "documentationLinks": []
+    },
+    "761:108638": {
+      "key": "3551166ae7ecfc9aadd976d463ff5b07328f3cb7",
+      "name": "Checked?=True, Flipped=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:5987",
+      "documentationLinks": []
+    },
+    "222:27675": {
+      "key": "a7d4ba529ed0f5c101de94d3f4cbd7803ba1590d",
+      "name": "Orientation=Vertical",
+      "description": "",
+      "remote": false,
+      "componentSetId": "222:27733",
+      "documentationLinks": []
+    },
+    "222:27709": {
+      "key": "67fcd5540f1d2cce98a063d98d49447422333b31",
+      "name": "Orientation=Horizontal",
+      "description": "",
+      "remote": false,
+      "componentSetId": "222:27733",
+      "documentationLinks": []
+    },
+    "164:18668": {
+      "key": "d2d4a8cf5d44e26df816992795f0efffd4c039a1",
+      "name": "Type=Vertical",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18669",
+      "documentationLinks": []
+    },
+    "164:18667": {
+      "key": "df651b2aeefeb69eab0c8906f6fe6d8735834011",
+      "name": "Type=Horizontal",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18669",
+      "documentationLinks": []
+    },
+    "164:18666": {
+      "key": "27b1eb7db892d8a331646d2108ff733b740752e4",
+      "name": "Type=Horizontal",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18670",
+      "documentationLinks": []
+    },
+    "673:37063": {
+      "key": "b78bfb366aaaa7657b594085333d61c6871d4cca",
+      "name": "Size=Regular, State=Placeholder, Lines=1 Line",
+      "description": "Dropdown",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1478": {
+      "key": "be4ea4806d2671cecd2d96269e0e3febcafb046c",
+      "name": "Size=Large, State=Default, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37069": {
+      "key": "477edf7dfb0f26ca19b794de9dce57f374bfd0b8",
+      "name": "Size=Large, State=Placeholder, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37075": {
+      "key": "446a529816998489ae768a41464fde22da71d39b",
+      "name": "Size=Small, State=Placeholder, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:105885": {
+      "key": "3af92c9a3044cd52b239a502a0fc9974fb9a5824",
+      "name": "Size=Mini, State=Default, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37081": {
+      "key": "9e29cc5c5ce2430e2005ce4c4bfb90ef85ebeab7",
+      "name": "Size=Mini, State=Placeholder, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "16:1731": {
+      "key": "d93eae475403647cc027aec5f3b4f412bbb5edc1",
+      "name": "Size=Regular, State=Focus, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1484": {
+      "key": "69e92d0db01a7bfd671a2ccaa364ed63a908f013",
+      "name": "Size=Large, State=Focus, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1580": {
+      "key": "2de093219968b3f8b9ee620700ba25155fecc54c",
+      "name": "Size=Small, State=Focus, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:105906": {
+      "key": "1bf0342b2a661434952c4103a47c519ac645098f",
+      "name": "Size=Mini, State=Focus, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "18:980": {
+      "key": "7b20d6fdf9d59370ff38378b6335214595ee30be",
+      "name": "Size=Regular, State=Error, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1490": {
+      "key": "9f8f0c19ce0664c82800321f405d9ebcae10f143",
+      "name": "Size=Large, State=Error, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1586": {
+      "key": "71f420aa740aeb68b43cb23bb7c92a44a19bcf57",
+      "name": "Size=Small, State=Error, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:105927": {
+      "key": "c95e35ca5a28310c66d2363df4dc3b7c67cfeb74",
+      "name": "Size=Mini, State=Error, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "18:976": {
+      "key": "216a28cdfdf03c44221958b6c61e3dc8ac8e4c8d",
+      "name": "Size=Regular, State=Disabled, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1496": {
+      "key": "14e4136867b1cc03d7a36f0e3d73e92e6285f32e",
+      "name": "Size=Large, State=Disabled, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "19:1592": {
+      "key": "3229bb8b8201522fb6258cc42e01820e743f4eb0",
+      "name": "Size=Small, State=Disabled, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:105948": {
+      "key": "452a443b816076c5730a17a54de2ba9d432eb3f5",
+      "name": "Size=Mini, State=Disabled, Lines=1 Line",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17940": {
+      "key": "3a6ac2cb0a447cea31dbf4a0e6b134ad96d743fc",
+      "name": "Size=Regular, State=Default, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37087": {
+      "key": "3a13a5735df99033e2b540102bff03b9f6c80807",
+      "name": "Size=Regular, State=Placeholder, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17946": {
+      "key": "229849ace91e93922cdd5ae44936a4de2e6b003e",
+      "name": "Size=Large, State=Default, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37094": {
+      "key": "fc3930b7e409acb493b943c6fb17c3f6e8ea8379",
+      "name": "Size=Large, State=Placeholder, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17952": {
+      "key": "31819be91e235816ee3266c48fd6ebfa49be9f46",
+      "name": "Size=Small, State=Default, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37101": {
+      "key": "d42559258a6c3990c41ba780d018ccc456c86356",
+      "name": "Size=Small, State=Placeholder, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:105969": {
+      "key": "e8e7adf5fcf8940ba175a127c1e633facb444164",
+      "name": "Size=Mini, State=Default, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:37108": {
+      "key": "d950586f259a796062923acc8b22849594fab070",
+      "name": "Size=Mini, State=Placeholder, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17958": {
+      "key": "f46368e77c3e4ddf606a54233178559a024fb22c",
+      "name": "Size=Regular, State=Focus, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17964": {
+      "key": "370b204657f4f43610d7b696b20010b3f8c13e8e",
+      "name": "Size=Large, State=Focus, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17970": {
+      "key": "29a5c483b868e10cffc337efce5f57c2eac69c50",
+      "name": "Size=Small, State=Focus, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:105991": {
+      "key": "04179f31165447f9bf8b2bdabab6e318fa5b68c8",
+      "name": "Size=Mini, State=Focus, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17976": {
+      "key": "f1039f16f8b5f015b8a0908116650d8421dfd989",
+      "name": "Size=Regular, State=Error, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17982": {
+      "key": "6670b3e2460ca11f221e59df3297a2139263c82d",
+      "name": "Size=Large, State=Error, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17988": {
+      "key": "1f9dd3751cd35c8301dfdb103103c3416d76f0a0",
+      "name": "Size=Small, State=Error, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:106013": {
+      "key": "d3fbe5c8f7dd455fccab6a52cb8d8373d9d88bed",
+      "name": "Size=Mini, State=Error, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:17994": {
+      "key": "e25c015a9597b1594f91ec1d328de8c19b539dab",
+      "name": "Size=Regular, State=Disabled, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:18000": {
+      "key": "6908f6f4db90fbd15e32ca35554f7f691d190aca",
+      "name": "Size=Large, State=Disabled, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "68:18006": {
+      "key": "77c6338352d3aed928ad760c0b36eb9777f541b4",
+      "name": "Size=Small, State=Disabled, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "281:106035": {
+      "key": "e1d9a5f41b64b21c4492e1f742f3fc5d32ec5086",
+      "name": "Size=Mini, State=Disabled, Lines=2 Lines",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1732",
+      "documentationLinks": []
+    },
+    "673:40337": {
+      "key": "9bfed8f8baf5024c1c5706286aaa7fb46b2f6aa6",
+      "name": "Type=Combobox",
+      "description": "",
+      "remote": false,
+      "componentSetId": "673:40340",
+      "documentationLinks": []
+    },
+    "190:27739": {
+      "key": "9ea373efecc0d529e320dea86842a3357767b3f0",
+      "name": "Spacing=24px",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:27848",
+      "documentationLinks": []
+    },
+    "19:5560": {
+      "key": "64c2aed6633c89182ae4891232ef9fd6b0c3a948",
+      "name": "Spacing=2px",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:27848",
+      "documentationLinks": []
+    },
+    "176:27847": {
+      "key": "7cd2a21253cccbbac0c0d35b386b6e2a7e0b78b7",
+      "name": "Spacing=None",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:27848",
+      "documentationLinks": []
+    },
+    "176:26563": {
+      "key": "b83bcfeaf3c1fb2bbaee8346e700f3334b0dde9b",
+      "name": "Size=Large, Type=Default, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:26573": {
+      "key": "11196902f4e5f9203288b7503870ed7f66153625",
+      "name": "Size=Large, Type=Default, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:26578": {
+      "key": "1c0fb542ba2088b899603d4d578a77804251fe2c",
+      "name": "Size=Large, Type=Default, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "189:40776": {
+      "key": "0a562c620be3bcfed62c5c4061ca06e471f377e9",
+      "name": "Size=Regular, Type=Default, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "189:40783": {
+      "key": "4c94e1673e73adba01df876dd1a7361836db7158",
+      "name": "Size=Large, Type=Default, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "18:996": {
+      "key": "0eb3e38f0c7baa3fbb42d439307b53c46d46b83a",
+      "name": "Size=Regular, Type=Default, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:26558": {
+      "key": "a0b7c71eba8ffbc3c5a8989b49c66d48de04eb25",
+      "name": "Size=Large, Type=Default, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "18:997": {
+      "key": "51dd7234d8a72ac0e150b02f92e8fd1c54958a56",
+      "name": "Size=Regular, Type=Default, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:26583": {
+      "key": "14a28277421f3892424e2b44cd3d3b294c82107e",
+      "name": "Size=Large, Type=Default, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "68:17850": {
+      "key": "04f964b80f4a1bd2537d23d2cf72b5e2b040fba7",
+      "name": "Size=Regular, Type=Destructive, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:34709": {
+      "key": "9449be866bf891117727e2871a982d555b361462",
+      "name": "Size=Large, Type=Destructive, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:34684": {
+      "key": "e65e21f45e7f1d97a7110a700e42fd1d87527b70",
+      "name": "Size=Regular, Type=Destructive, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "176:26568": {
+      "key": "a0693292056bddfb1d7d3683ed1b99a1c8adf829",
+      "name": "Size=Large, Type=Destructive, State=Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95489": {
+      "key": "a1e6db5ba1fee60a5741bf9dcb18ceb9695cb2cb",
+      "name": "Size=Regular, Type=Destructive, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95496": {
+      "key": "0a213ba38dea9d8bba76e85a54d1999da4d36255",
+      "name": "Size=Large, Type=Destructive, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95552": {
+      "key": "0f4faaa07d97e8c785b85a1c6114df978a22103b",
+      "name": "Size=Regular, Type=Destructive, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95559": {
+      "key": "537216d27c481ba06dc28f9217559693a8b52d08",
+      "name": "Size=Large, Type=Destructive, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95613": {
+      "key": "7f7e970eacf9a4fa4bb1eeffb4ec11465fe2ce80",
+      "name": "Size=Regular, Type=Destructive, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95620": {
+      "key": "208bf155cd58b2f8b2d34908d240cc8bec5207ea",
+      "name": "Size=Large, Type=Destructive, State=Selected",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95676": {
+      "key": "d0bceb38665f66e59156e7a325ebfc5d8b241ada",
+      "name": "Size=Regular, Type=Destructive, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "288:95683": {
+      "key": "91dabf33ba2bdd759b0bcd59b4a9947113c23384",
+      "name": "Size=Large, Type=Destructive, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1010",
+      "documentationLinks": []
+    },
+    "80:10194": {
+      "key": "ce51dcec9b40d22f754a93c1463adff8f350a5d8",
+      "name": "Type=Regular, Indented?=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "80:10189",
+      "documentationLinks": []
+    },
+    "80:10188": {
+      "key": "c762f03cc22649a1836d3378f6d6b6c55a0728c3",
+      "name": "Type=Small, Indented?=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "80:10189",
+      "documentationLinks": []
+    },
+    "80:10196": {
+      "key": "e52898ae38260ad2f7aa51614d6dd71f3538be81",
+      "name": "Type=Regular, Indented?=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "80:10189",
+      "documentationLinks": []
+    },
+    "28:6831": {
+      "key": "76d872803c808e2808530e4d62233d061304f5bb",
+      "name": "Scroll Direction=Scroll Up",
+      "description": "",
+      "remote": false,
+      "componentSetId": "28:6842",
+      "documentationLinks": []
+    },
+    "28:6840": {
+      "key": "62ebd801d83650ab9db02c2d957688db1699542a",
+      "name": "Scroll Direction=Scroll Down",
+      "description": "",
+      "remote": false,
+      "componentSetId": "28:6842",
+      "documentationLinks": []
+    },
+    "18:1295": {
+      "key": "e9b1e4367fd7449db32519d89047b78eedf0b377",
+      "name": "Type=Avatar, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "22:9609": {
+      "key": "1f24fcaeddc8692bb394caf0948816ea1a2427ca",
+      "name": "Type=Checkbox, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "68:17645": {
+      "key": "9567d51a61b61ba145e007920605aa4b478781cd",
+      "name": "Type=Text Muted, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "65:5258": {
+      "key": "3840b5ef82038524ae27d7b92b237c724ffab792",
+      "name": "Type=Radio, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:41612": {
+      "key": "0246e1a5680ec6e09710a6f6a8c20822c129f9f1",
+      "name": "Type=Deco Icon Primary, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:41638": {
+      "key": "adba2c9dc1967f32d519154db7285304751646b9",
+      "name": "Type=Deco Icon Outline, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "66:5932": {
+      "key": "6120d960a23afc4b0d777860153f025a7eaa6f41",
+      "name": "Type=Blank, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26454": {
+      "key": "a0c13413cc76e57908a3d33594cf45d8909c826f",
+      "name": "Type=Icon, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26460": {
+      "key": "a2b8567d62ecb1183ea486f6b920091f0af75205",
+      "name": "Type=Avatar, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26462": {
+      "key": "b3f547a7d72e4f0c941e5adbe4088bea3daeb654",
+      "name": "Type=Checkbox, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26464": {
+      "key": "14795d2e4b609e102351e8898367f5e2ac50c508",
+      "name": "Type=Text, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26466": {
+      "key": "c515fe9d35760821a5f1a692dfabaa1e28708d5b",
+      "name": "Type=Text Muted, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26469": {
+      "key": "d38c7241aa4775a0500773234080da886f3dab04",
+      "name": "Type=Radio, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26238": {
+      "key": "50d62c57e4345ec09ade854639ae4ae6d8e51a47",
+      "name": "Type=Deco Icon Primary, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26271": {
+      "key": "2633fe950f7bf681298095215283c7cec42e1de4",
+      "name": "Type=Deco Icon Outline, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:26468": {
+      "key": "ecdc6060e80f503c7293939de4eadaa984722f89",
+      "name": "Type=Blank, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "833:105568": {
+      "key": "6ec94dcc5a0444a3ac59525d2f8e04f9b6edd71e",
+      "name": "Type=Icon muted, Size=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "833:105573": {
+      "key": "259855ee75be967ff2c50bd7c06c31a052acd14c",
+      "name": "Type=Icon muted, Size=Large",
+      "description": "",
+      "remote": false,
+      "componentSetId": "18:1373",
+      "documentationLinks": []
+    },
+    "176:27418": {
+      "key": "6212b68a9a383de016f3f3b9dba4260bd9b19e44",
+      "name": ".Theme Selection",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27408": {
+      "key": "b1dedd02a386fdc9521b85a56eb8ae4f6508ffb9",
+      "name": ".Person Selection",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27243": {
+      "key": "f0ced81c000238c7ea4e17707d42bdbb7d416ea5",
+      "name": ".PersonList",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27615": {
+      "key": "d3f77ff65eda72ea27eee4e9e83179677fef145c",
+      "name": ".Team Selection",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27332": {
+      "key": "72d1cb78b1fdfff1152c75629c074b30c77c854e",
+      "name": ".Search",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27507": {
+      "key": "b80134ee5c2b33ff4270d16372351d51ac10b9ff",
+      "name": ".Dropdown",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27328": {
+      "key": "24baa2011bdd7797eccb60fbe8e1fd0b04c174f4",
+      "name": ".Dropdown Child",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27310": {
+      "key": "1ade59d5f805d5e15a179693236e02b721d5c7ae",
+      "name": ".Context Menu Example",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:27322": {
+      "key": "c2300014d2c90402aa8fd2e4e6e100cf9d997e88",
+      "name": ".Context Menu Child Example",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:34390": {
+      "key": "a6b68aaef48b674aa0488f35f1626d6ba0a72c49",
+      "name": ".Person Addition",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:34653": {
+      "key": "704df076fa31fea04bebf8d6fae8638bafea19eb",
+      "name": ".Project Options Addition",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "176:26207": {
+      "key": "c1bf7273dc0a8f148b2d6489528f51ec0f4398db",
+      "name": "Spacing=Spacious, Direction=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:26202",
+      "documentationLinks": []
+    },
+    "176:26216": {
+      "key": "bffb29ed98c9fe721726780578c3097f9f9a77ee",
+      "name": "Spacing=Spacious, Direction=Vertical",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:26202",
+      "documentationLinks": []
+    },
+    "164:18665": {
+      "key": "ec3bbe13dfbeedd4e68c376d48bad3147a86d586",
+      "name": "Spacing=Regular, Direction=Vertical",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:26202",
+      "documentationLinks": []
+    },
+    "151:12343": {
+      "key": "47cbed12d1313cb936ef2392cf78f1061266698f",
+      "name": "Scrollable=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "301:243831",
+      "documentationLinks": []
+    },
+    "151:12330": {
+      "key": "a8622e1f7fe132c8046db7968d41babd4f4970d9",
+      "name": "Scrollable=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "301:243831",
+      "documentationLinks": []
+    },
+    "28:5229": {
+      "key": "6ff3d10dc77c3e2e1bb52a9ab6675cf9d947347d",
+      "name": "State=Regular",
+      "description": "",
+      "remote": false,
+      "componentSetId": "28:5228",
+      "documentationLinks": []
+    },
+    "28:5238": {
+      "key": "f2657abf5769bc3a99dc5b58bc970ba05f761739",
+      "name": "State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "28:5228",
+      "documentationLinks": []
+    },
+    "848:48013": {
+      "key": "afb895343428b21ee485443f38cc02767c9152c3",
+      "name": "Sidebar Badge",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "28:6894": {
+      "key": "34725215fa24cadea7275ebca8d394749f8dc948",
+      "name": "State=Default, Type=Base",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "27:3420": {
+      "key": "f06dd48a308dc30ed6015b2f9fc54842846b873a",
+      "name": "State=Default, Type=Expanded",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "28:5295": {
+      "key": "e8b8b3319d6994e67cb7e2cf32f43d6f017b8939",
+      "name": "State=Default, Type=Collapsed",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "176:23859": {
+      "key": "0e172e7b83161c3ee4d3acb52f2928d067205476",
+      "name": "State=Default, Type=Dropdown",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "176:24070": {
+      "key": "70e6534095a641532f2419be30734730a50806a9",
+      "name": "State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:24085",
+      "documentationLinks": []
+    },
+    "176:24214": {
+      "key": "e46949776813274d30ab62138db0bdc5bcca2d38",
+      "name": "State=Default, Type=Badge",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:67801": {
+      "key": "930689e5382051085ef2100d2344fe57ac32250b",
+      "name": "State=Focus, Type=Base",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:67807": {
+      "key": "0c78977a414aede5988624d44f69bd8885461e18",
+      "name": "State=Focus, Type=Expanded",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:67816": {
+      "key": "8d7d5240f790790f60b75c469ef3cc1479a64f3c",
+      "name": "State=Focus, Type=Collapsed",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:67825": {
+      "key": "c2b06f3b2bca1d49661940ef16a2ad78ce04b56b",
+      "name": "State=Focus, Type=Dropdown",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:67832": {
+      "key": "866717f3da85ea08f719620358c0280623cac14a",
+      "name": "State=Focus, Type=Badge",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "28:6903": {
+      "key": "6a9ba954cc5c44fb3ffc1415087a712b4fc8df6e",
+      "name": "State=Active, Type=Base",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "28:5076": {
+      "key": "a0981bd38db2f02cfe49a8752ae1b1debf8e4497",
+      "name": "State=Active, Type=Expanded",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "28:5339": {
+      "key": "48ee589e0907f77d08c0f63b198579eac8c60c51",
+      "name": "State=Active, Type=Collapsed",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "176:23868": {
+      "key": "624afbc30bcfe0c72920e62a0049be22e3b03b51",
+      "name": "State=Active, Type=Dropdown",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "176:24221": {
+      "key": "f4bb1f9c6c198117f0027202a74defd8e4f55bd2",
+      "name": "State=Active, Type=Badge",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:68071": {
+      "key": "a65d3178f44fbe2cad1f1e2fd8c91d9e77a86470",
+      "name": "State=Active Focus, Type=Base",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:68077": {
+      "key": "5a2111f3ceef1bc3d73644adbc3d9fbfcc2f9c85",
+      "name": "State=Active Focus, Type=Expanded",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:68086": {
+      "key": "ef59bd18408f937139e0d2f4241bb24f737d121d",
+      "name": "State=Active Focus, Type=Collapsed",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:68095": {
+      "key": "629551cad9be56d6c4da1d64cc8ef1f579c9b387",
+      "name": "State=Active Focus, Type=Dropdown",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "189:68102": {
+      "key": "15f2275e4f6adee66de37cb547c1cc4dae4f78c7",
+      "name": "State=Active Focus, Type=Badge",
+      "description": "",
+      "remote": false,
+      "componentSetId": "27:3414",
+      "documentationLinks": []
+    },
+    "28:5049": {
+      "key": "7b431b06a001fdc55d39c2406302e120ce731857",
+      "name": "State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "28:5147",
+      "documentationLinks": []
+    },
+    "28:5146": {
+      "key": "1ffb35f6ed9077513e8b7a709446cd2529f40d68",
+      "name": "State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "28:5147",
+      "documentationLinks": []
+    },
+    "27:3493": {
+      "key": "a5b2394340150fe2258ffbb393ce057f413d3b2d",
+      "name": "Type=Base",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:23790",
+      "documentationLinks": []
+    },
+    "176:23789": {
+      "key": "0cff497858df1f587424951749d58f36e944299b",
+      "name": "Type=Action",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:23790",
+      "documentationLinks": []
+    },
+    "176:24774": {
+      "key": "2b8683791964c4062ea6f589f4bc9a2136c6bb66",
+      "name": "Type=Expanded",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:23790",
+      "documentationLinks": []
+    },
+    "176:24781": {
+      "key": "cd591b9e398db6df9d1f46602a345288b8ebdfb9",
+      "name": "Type=Collapsed",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:23790",
+      "documentationLinks": []
+    },
+    "176:24079": {
+      "key": "0f1964878e919315940239aabbeae9d0e3d64add",
+      "name": "State=Hover & Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "176:24085",
+      "documentationLinks": []
+    },
+    "176:26457": {
+      "key": "4781891fbbb88af5432797cbc79259c33804fdc4",
+      "name": ".Select Left Decoration/Icon Muted/Large",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "303:246698": {
+      "key": "f6893d55900a2f7ea99418cabe3b26fa04396ac3",
+      "name": "Skeleton",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "222:27480": {
+      "key": "5d9e75200e0a4014986c2a819dc3f058747469f5",
+      "name": "Skeleton / Placeholder Avatar",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "222:27481": {
+      "key": "bb76226abb8aabb3b205bdccc655186b38fd4a90",
+      "name": "Skeleton / Placeholder Line",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "222:27487": {
+      "key": "921b37d8dc526f18c2c31d70f53317b29fd66d32",
+      "name": "Skeleton / Placeholder Object",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "65:4901": {
+      "key": "8e60237e171f2ecc43e1e62d7a775a8ea20eefdd",
+      "name": "Type=Range narrow",
+      "description": "",
+      "remote": false,
+      "componentSetId": "65:4902",
+      "documentationLinks": []
+    },
+    "761:109548": {
+      "key": "ae781e89e70f9d270f9d7aa1c7d04ac18e230569",
+      "name": "Type=Range wide",
+      "description": "",
+      "remote": false,
+      "componentSetId": "65:4902",
+      "documentationLinks": []
+    },
+    "162:17940": {
+      "key": "994a2edf053483c98eb4da0f47d459c2d3dead40",
+      "name": "Type=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "162:17939",
+      "documentationLinks": []
+    },
+    "162:17944": {
+      "key": "1b433c954e8f6dcc066c5ca1889973b680e40cec",
+      "name": "Type=Range narrow",
+      "description": "",
+      "remote": false,
+      "componentSetId": "162:17939",
+      "documentationLinks": []
+    },
+    "761:109659": {
+      "key": "c7b674accc0d5154bb19d228ecdde7ec0f800f8b",
+      "name": "Type=Range wide",
+      "description": "",
+      "remote": false,
+      "componentSetId": "162:17939",
+      "documentationLinks": []
+    },
+    "162:17956": {
+      "key": "527c54287348b5ff2c51be976a79325b45da2074",
+      "name": "State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "162:17957",
+      "documentationLinks": []
+    },
+    "139:11359": {
+      "key": "333c6aa31658705e78a1ff981b939b2637bc2960",
+      "name": "Stack=1 Level",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11361",
+      "documentationLinks": []
+    },
+    "139:11362": {
+      "key": "b958f2f985d47a1515ea9edb1fc4846aef333ad1",
+      "name": "Type=Lines and button",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11366",
+      "documentationLinks": []
+    },
+    "139:11358": {
+      "key": "cac3d1e735c211e687a9dbe52ff8e93ff1cd489c",
+      "name": "Stack=2 Levels",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11361",
+      "documentationLinks": []
+    },
+    "139:11360": {
+      "key": "5737fd6ea211ccb382c8fb9093bcabfcf13a7209",
+      "name": "Stack=3 Levels",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11361",
+      "documentationLinks": []
+    },
+    "139:11363": {
+      "key": "34492e97181c35830aff86cdf63f6b0252769205",
+      "name": "Type=Loading",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11366",
+      "documentationLinks": []
+    },
+    "139:11364": {
+      "key": "b3c6ed1aea05ea3dec8fb446ead631742b2917a9",
+      "name": "Type=Line and button",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11366",
+      "documentationLinks": []
+    },
+    "139:11365": {
+      "key": "eec975f3da109d4fdcc8c83f35db49afe013bf8e",
+      "name": "Type=Simple",
+      "description": "",
+      "remote": false,
+      "componentSetId": "139:11366",
+      "documentationLinks": []
+    },
+    "757:154510": {
+      "key": "9b72bfafb35630aec2d7bc5ee0ebec7f432ce6b6",
+      "name": "Type=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "757:154511",
+      "documentationLinks": []
+    },
+    "16:1799": {
+      "key": "119332d3f7c3133416dca9c5980eacf9e621a63b",
+      "name": "Checked?=False, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1801",
+      "documentationLinks": []
+    },
+    "16:1800": {
+      "key": "2b972406e5d906e5265425011cec0120a00ef2a0",
+      "name": "Checked?=True, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1801",
+      "documentationLinks": []
+    },
+    "147:11620": {
+      "key": "6a18ca40d96607b3b7bb7071b78d1e4a7097f3b8",
+      "name": "Checked?=False, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1801",
+      "documentationLinks": []
+    },
+    "147:11617": {
+      "key": "0aaf274ab7d7eefe075919a3a1433eb50cbd6695",
+      "name": "Checked?=True, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1801",
+      "documentationLinks": []
+    },
+    "147:11588": {
+      "key": "58ec3cb5f762d0c0de10a484b8335fdd7136d72b",
+      "name": "Checked?=False, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1801",
+      "documentationLinks": []
+    },
+    "147:11592": {
+      "key": "12b13b3ce8f691150e52c77d558200675cf636a3",
+      "name": "Checked?=True, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1801",
+      "documentationLinks": []
+    },
+    "103:9413": {
+      "key": "0748a4a3459fd29e9dcb9bc6c2e72d6eb9f6fe38",
+      "name": "Layout=Inline, Checked?=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6406",
+      "documentationLinks": []
+    },
+    "103:9418": {
+      "key": "463c77ff0466e8fe45b9ccb103833ad85cd5eb65",
+      "name": "Layout=Inline, Checked?=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6406",
+      "documentationLinks": []
+    },
+    "19:6410": {
+      "key": "423bbc0e9a16fd76460fde9e7cb2b6c89b7c29fe",
+      "name": "Layout=Block, Checked?=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6406",
+      "documentationLinks": []
+    },
+    "19:6407": {
+      "key": "dc2866dc9461230550291a91e1db8224f5d22e40",
+      "name": "Layout=Block, Checked?=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6406",
+      "documentationLinks": []
+    },
+    "19:6375": {
+      "key": "076ceb3c5c7c257104fbefbcd688af4fd5b43fe6",
+      "name": "Checked?=False, Flipped=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6374",
+      "documentationLinks": []
+    },
+    "19:6381": {
+      "key": "694325cf4a8e536c7719b4994ee16c1d0a917485",
+      "name": "Checked?=True, Flipped=False",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6374",
+      "documentationLinks": []
+    },
+    "761:108995": {
+      "key": "f8d9ccab7c447a4d3c80b26e9c915e54b24f4349",
+      "name": "Checked?=False, Flipped=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6374",
+      "documentationLinks": []
+    },
+    "761:109001": {
+      "key": "748aaa5adc8dfd395d8d1e0ba8892994701eb8db",
+      "name": "Checked?=True, Flipped=True",
+      "description": "",
+      "remote": false,
+      "componentSetId": "19:6374",
+      "documentationLinks": []
+    },
+    "164:18404": {
+      "key": "37dc071b95349c30b3b5a4693d87553874ccc4a4",
+      "name": "Cell Type=Heading",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:18430",
+      "documentationLinks": []
+    },
+    "164:18405": {
+      "key": "7fa5cd0922361c52dd7596c592549fc51e3b3612",
+      "name": "Parity=Odd, Alignment=Left",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:172242",
+      "documentationLinks": []
+    },
+    "164:18406": {
+      "key": "379f3cdc6c144b9ab1af03cbf856bc808ebe7ff6",
+      "name": "Parity=Even, Alignment=Left",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:172242",
+      "documentationLinks": []
+    },
+    "164:18522": {
+      "key": "7f43f712f20c5e181029f6a5f9c349cc7f400f2b",
+      "name": "Parity=Odd, Alignment=Right",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:172242",
+      "documentationLinks": []
+    },
+    "164:18524": {
+      "key": "cf9e821263888bde10453b88a190b6a4490adae3",
+      "name": "Parity=Even, Alignment=Right",
+      "description": "",
+      "remote": false,
+      "componentSetId": "288:172242",
+      "documentationLinks": []
+    },
+    "9:637": {
+      "key": "2cbddb3aa937d2ae76ef98e08ab4a276973efa52",
+      "name": "Size=Regular, Content=Label, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43120": {
+      "key": "420b7de3cef7642d98b829b07d5b057eeac3795d",
+      "name": ".Tabs Counter",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "9:997": {
+      "key": "b61e63f3de90ee1535cbe29de52089f6faafac7e",
+      "name": "Size=Regular, Content=Icon, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "89:9807": {
+      "key": "71666485f10d56f4a3fc2956dfcd53380c08999f",
+      "name": "Size=Regular, Content=Icon + Label, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43683": {
+      "key": "8ef0d09db02e854996dea9e7f6205a0f5c44f2da",
+      "name": "Size=Regular, Content=Label, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43910": {
+      "key": "7ebcb393a627d0542203e26a78679d30a5e362df",
+      "name": "Size=Regular, Content=Icon, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43740": {
+      "key": "331991326cfd4178a8b6027a3b70fe7d2baf66f9",
+      "name": "Size=Regular, Content=Icon + Label, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "9:635": {
+      "key": "a8553ca90b86fe32beefd8eefefe8463fcfff545",
+      "name": "Size=Regular, Content=Label, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "20:5142": {
+      "key": "94d0daa92d0c3461cdca2bc92838c117d6d0ae4e",
+      "name": "Size=Regular, Content=Icon, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "89:9805": {
+      "key": "e9dd3b5b4e29baa6d5cd34fcee968549ca0dafc0",
+      "name": "Size=Regular, Content=Icon + Label, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43703": {
+      "key": "f9d0c2ab40640db49ee79309e8e4dff03b4b5714",
+      "name": "Size=Regular, Content=Label, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43978": {
+      "key": "018fb3174f130519dcff3830f63043eef427f49c",
+      "name": "Size=Regular, Content=Icon, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43842": {
+      "key": "f39e4caab90414aac971bdcba808bc4ace42bef2",
+      "name": "Size=Regular, Content=Icon + Label, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43711": {
+      "key": "bc66f2dd4e95390ed1cbcea56fb30376e6304f98",
+      "name": "Size=Regular, Content=Label, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43918": {
+      "key": "c6a5e6aab1054bef057ae4a9c81591900bc807b2",
+      "name": "Size=Regular, Content=Icon, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43774": {
+      "key": "0b026798b264ca728a4e4e056e1cfed962e8176a",
+      "name": "Size=Regular, Content=Icon + Label, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43719": {
+      "key": "a4e5863378eeaa3a1641626a23b7b4b10a988bf2",
+      "name": "Size=Regular, Content=Label, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43914": {
+      "key": "f83fee9c872094d66cd6c80faea4a39f56d8cb23",
+      "name": "Size=Regular, Content=Icon, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:43808": {
+      "key": "d0a36cda46b8a28a1863b759eadb428e802308e3",
+      "name": "Size=Regular, Content=Icon + Label, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44685": {
+      "key": "77fb864f0a2ef4d2572182088fc78b575aad402b",
+      "name": "Size=Large, Content=Label, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44688": {
+      "key": "1ae947cd667d4bbc875b6d2f3dc7d9ad31217b8c",
+      "name": "Size=Large, Content=Icon, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44691": {
+      "key": "74d444743d44075c09fcd57c98b472059c6dfcaf",
+      "name": "Size=Large, Content=Icon + Label, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44695": {
+      "key": "85eb96b41489c011a7af7362dc431936ca216d13",
+      "name": "Size=Large, Content=Label, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44698": {
+      "key": "f5568c2545eeb7019af3021c58d025d696ea6f96",
+      "name": "Size=Large, Content=Icon, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44701": {
+      "key": "1e4974a87be99009f58e4c6ded82a039b8ded2ff",
+      "name": "Size=Large, Content=Icon + Label, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44705": {
+      "key": "52a8ffb23e4e7588d8e78aab498d0b87f5455338",
+      "name": "Size=Large, Content=Label, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44708": {
+      "key": "1e6512ccf34158a15776de95f1200a9760d55950",
+      "name": "Size=Large, Content=Icon, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44711": {
+      "key": "a5e4c18b69a76dbc052f0f8b822540fc6ac44530",
+      "name": "Size=Large, Content=Icon + Label, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44715": {
+      "key": "81142386a4324fb37726144be6235aacadf5b283",
+      "name": "Size=Large, Content=Label, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44718": {
+      "key": "41161acddcff120d46e879235102f409413b1208",
+      "name": "Size=Large, Content=Icon, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44721": {
+      "key": "988364dc70c0aef5c8be33d18d5d663d9fb8196c",
+      "name": "Size=Large, Content=Icon + Label, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44725": {
+      "key": "269bcb41f0cca622feb5efa3e20f0f0ead0d860d",
+      "name": "Size=Large, Content=Label, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44728": {
+      "key": "03cb2d1ca613391076ab76d4e6fd753cf213f101",
+      "name": "Size=Large, Content=Icon, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44731": {
+      "key": "2c52d717c3e0a65ea9e820b554210f46084ae5e2",
+      "name": "Size=Large, Content=Icon + Label, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44735": {
+      "key": "ec754b5b7a9797828e45ac9e79fe270467628699",
+      "name": "Size=Large, Content=Label, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44738": {
+      "key": "7af5cf25dcc7ce482a487df11ea38b75a9482596",
+      "name": "Size=Large, Content=Icon, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:44741": {
+      "key": "3e0f0a1e4320b59a1619fbba196bae234d4ec171",
+      "name": "Size=Large, Content=Icon + Label, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45573": {
+      "key": "65e710d71890a612698d95a0aba5bed970860b7e",
+      "name": "Size=Small, Content=Label, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45576": {
+      "key": "6cb31ce1a537db4878d73fb1fac2f8456c972520",
+      "name": "Size=Small, Content=Icon, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45579": {
+      "key": "7b1dfe92210825c51706ee306638db58ea425f21",
+      "name": "Size=Small, Content=Icon + Label, State=Inactive",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45583": {
+      "key": "2b9c8d5b38f7858a0c83b2ebb0632832bb92e887",
+      "name": "Size=Small, Content=Label, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45586": {
+      "key": "66ebe2b6673afc0fa0cac86654746eb671053058",
+      "name": "Size=Small, Content=Icon, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45589": {
+      "key": "e7fcf70057c5d9a7e1e826a6f5b724a4bcf06083",
+      "name": "Size=Small, Content=Icon + Label, State=Inactive Hover",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45593": {
+      "key": "5a15a260eb5d698c5d11f421f2bfb08d7c6f5cba",
+      "name": "Size=Small, Content=Label, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45596": {
+      "key": "1bb17efdc3a0081230bb07ed2eb315e4c533e698",
+      "name": "Size=Small, Content=Icon, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45599": {
+      "key": "9b29a5574e55620df0f4065763c7e9839e1342a9",
+      "name": "Size=Small, Content=Icon + Label, State=Active",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45603": {
+      "key": "cb390498901f9734f5d2c0dbfdb96af8feec2bc1",
+      "name": "Size=Small, Content=Label, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45606": {
+      "key": "235c2301708a37b6c0d6191d1109229a93141e49",
+      "name": "Size=Small, Content=Icon, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45609": {
+      "key": "fdad4109b7caf0aad92da591d6fcc1ccef1a1008",
+      "name": "Size=Small, Content=Icon + Label, State=Active Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45613": {
+      "key": "0f6221d386ddf1a33c7b034d387915170f1333a9",
+      "name": "Size=Small, Content=Label, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45616": {
+      "key": "642845eada2b78afd78ccb772c4a9cee86f15988",
+      "name": "Size=Small, Content=Icon, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45619": {
+      "key": "13beaa2ff30ce748332678f6f9954af0400df902",
+      "name": "Size=Small, Content=Icon + Label, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45623": {
+      "key": "63e069c1e521d1e1c48730fcb3e53c250b4e54c0",
+      "name": "Size=Small, Content=Label, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45626": {
+      "key": "bd355a82de8d495771ccffa1b32a869daacd201b",
+      "name": "Size=Small, Content=Icon, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "189:45629": {
+      "key": "b8ddc202f42f498e1ba9ee33cb804664ec90c10a",
+      "name": "Size=Small, Content=Icon + Label, State=Inactive Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:634",
+      "documentationLinks": []
+    },
+    "9:640": {
+      "key": "5db6511c1f40b2fcbc9f2c2ee65337021cd0955b",
+      "name": "Size=Regular, Content=Label, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "68:6587": {
+      "key": "1ed15760f38fec46366f56056d8934ddcc9d31c8",
+      "name": "Size=Regular, Content=Icon, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:42603": {
+      "key": "7b037c25a2b767ffbd8180717661dd74f02a4901",
+      "name": "Size=Regular, Content=Icon + Label, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "68:6537": {
+      "key": "ede9a71b5571b4260b6e6607758d245ba601dec0",
+      "name": "Size=Regular, Content=Label, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "68:6649": {
+      "key": "938d530bda574e7476b13032ee5a73e926582eff",
+      "name": "Size=Regular, Content=Icon, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:42607": {
+      "key": "b3ff7970bd58c5195b4b5c3f6caae97269c63db7",
+      "name": "Size=Regular, Content=Icon + Label, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "9:652": {
+      "key": "8336620e120a5fb07bf7212704dd3884a6c78a01",
+      "name": "Size=Regular, Content=Label, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "68:6737": {
+      "key": "c6737a376502d74e6ecdc84c4a15276caef34561",
+      "name": "Size=Regular, Content=Icon, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:42612": {
+      "key": "863c2567fe754ef41213457fb655a6a69ca7f832",
+      "name": "Size=Regular, Content=Icon + Label, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "9:645": {
+      "key": "68581eca4a29b5e638fd25d415fad63cf5ba4f44",
+      "name": "Size=Regular, Content=Label, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "68:6853": {
+      "key": "75ec3b8d502290013bbc26660dbc553ade7ef5e9",
+      "name": "Size=Regular, Content=Icon, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:42618": {
+      "key": "6d84c79cae29648d98b07762c927205259eab48c",
+      "name": "Size=Regular, Content=Icon + Label, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46387": {
+      "key": "8fc8565ab9df95581b47f2053b98d871f7113ba2",
+      "name": "Size=Large, Content=Label, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46391": {
+      "key": "6a69d93ce01b1bb167e40eb8648174cb0173cf16",
+      "name": "Size=Large, Content=Icon, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46395": {
+      "key": "7429af3651e57353808b83cc8f0ebe964160dad2",
+      "name": "Size=Large, Content=Icon + Label, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46399": {
+      "key": "77b7ad87247a10d96d995330853b71ca8c449680",
+      "name": "Size=Large, Content=Label, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46404": {
+      "key": "bf7670247ed880a2bc1e988ce54e06904f5f0314",
+      "name": "Size=Large, Content=Icon, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46409": {
+      "key": "232aa45305c1f72635a234dc02e825ec7130adb1",
+      "name": "Size=Large, Content=Icon + Label, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46414": {
+      "key": "575787d17a480a69c67752afb5f486bcde98126e",
+      "name": "Size=Large, Content=Label, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46420": {
+      "key": "b7a52c72294f31aa8e40e77dbd7383afbba5f96f",
+      "name": "Size=Large, Content=Icon, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46426": {
+      "key": "1ab3c99289598e76ccbb4f524cabd79eb3c2de00",
+      "name": "Size=Large, Content=Icon + Label, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46432": {
+      "key": "b8834236498906db37728ef1aafb385ae35e35bc",
+      "name": "Size=Large, Content=Label, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46439": {
+      "key": "b05e043e154924d93ec486a02ee151a456332dc7",
+      "name": "Size=Large, Content=Icon, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:46446": {
+      "key": "8af76da6a7379a5460265a3e46737316c4b9397e",
+      "name": "Size=Large, Content=Icon + Label, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47961": {
+      "key": "b635880088305129bda5efc05016a14cc4b0f863",
+      "name": "Size=Small, Content=Label, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47965": {
+      "key": "a461dcae2a2f6b0eae3b320056b8fc049f98c3ad",
+      "name": "Size=Small, Content=Icon, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47969": {
+      "key": "028b4e25ca3aefa5a3ba80b4dd2a61cc403da8d9",
+      "name": "Size=Small, Content=Icon + Label, Parts=2 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47973": {
+      "key": "60fbd1ad050581aad224988ed0692e1f14a14007",
+      "name": "Size=Small, Content=Label, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47978": {
+      "key": "3211d264accdd459d2d6c04b6a9f161d74f8a9bb",
+      "name": "Size=Small, Content=Icon, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47983": {
+      "key": "e17b320051872bf063b856d9ed633757519cfc67",
+      "name": "Size=Small, Content=Icon + Label, Parts=3 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47988": {
+      "key": "df726d70f315b861b24b25885aeac9bf8d1218ae",
+      "name": "Size=Small, Content=Label, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:47994": {
+      "key": "8804b058190c17ec18abf532f03abd0495c1617a",
+      "name": "Size=Small, Content=Icon, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:48000": {
+      "key": "b73d06210eee4d00f06646f43277719254e93858",
+      "name": "Size=Small, Content=Icon + Label, Parts=4 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:48006": {
+      "key": "e5b5cd776eaa1eac931655032446b7c1b8c1f96f",
+      "name": "Size=Small, Content=Label, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:48013": {
+      "key": "89d24a30108d77c4f22aacc68d7528ffc7e0be2e",
+      "name": "Size=Small, Content=Icon, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "189:48020": {
+      "key": "ae1cafbee6494bd5de50968d97a543faad756478",
+      "name": "Size=Small, Content=Icon + Label, Parts=5 Parts",
+      "description": "",
+      "remote": false,
+      "componentSetId": "9:639",
+      "documentationLinks": []
+    },
+    "140:11507": {
+      "key": "ead5eb4a19130452d3ada2f9d5e2eebb81fd0abd",
+      "name": "State=Empty, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125059": {
+      "key": "c0fb3dd5daeaf29b6cfebded3792a65bbb20eb24",
+      "name": "State=Empty, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125061": {
+      "key": "a1ca27f06e110792055328d673d7214856226b09",
+      "name": "State=Placeholder, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "16:1743": {
+      "key": "8f8d3118314bc07d5162874c8932d2f532fef2ed",
+      "name": "State=Value, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125064": {
+      "key": "3df38607a3da85c96e175de095d0e55b0254ca9a",
+      "name": "State=Value, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "140:11514": {
+      "key": "99cbd3fc077c7726e21f033490c5cc263a6fd658",
+      "name": "State=Focus, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125067": {
+      "key": "7f0604bdb1aff7f8f8d5430dacf00cb8ba1fe5c3",
+      "name": "State=Focus, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "18:984": {
+      "key": "f27d18cde6e9263346ebb4bc5a3bc54650b657d6",
+      "name": "State=Error, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125070": {
+      "key": "1ea69c5314518364d40adaedea5bd6c8da6746d8",
+      "name": "State=Error, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "19:1057": {
+      "key": "e1adec418928844e96b6dce16698c96adead5653",
+      "name": "State=Error Focus, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125073": {
+      "key": "5f9d98ce4d86ff1d86e02610d26ae3bec393cc93",
+      "name": "State=Error Focus, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "19:1060": {
+      "key": "cc27677465e995b7c2d084cc4d9b0844dd65edb1",
+      "name": "State=Disabled, Roundness=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "757:125076": {
+      "key": "49636952133063dc924146ddb754f11dea160683",
+      "name": "State=Disabled, Roundness=Round",
+      "description": "",
+      "remote": false,
+      "componentSetId": "16:1745",
+      "documentationLinks": []
+    },
+    "816:112828": {
+      "key": "2e52d5f9d472ad36fe9872dd84b4bbfc96a80144",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112838": {
+      "key": "79233fa649fdcbae0339b62923de29c41747350a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112848": {
+      "key": "c9928fe4c862fe55747854358f6b3f5b3c284ccd",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112858": {
+      "key": "0f8bea248f9d0be3694f26b6718efe945092c3d2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112868": {
+      "key": "598623b69a44dab783e60b8051e70ca8ba459dd4",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112878": {
+      "key": "75cfb241134479b4b3a8185004f1de88c74abff8",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112888": {
+      "key": "b5475e24f2cf31e813e8f4fe7290e0aa5a01c0e6",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112898": {
+      "key": "3fe3af8e20b1d207368dd93ca6cc905c1b7af46b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112908": {
+      "key": "37a3a7925ac3cae45b3535c1677198cb97b104ae",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112918": {
+      "key": "b6437a5575fa98f221aff5be595964a8f257cb41",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112928": {
+      "key": "a503ed78252eb7dc3e88b22ddbb55505ca178bf2",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112938": {
+      "key": "4de96cebce76c157da327aa2dd97daeeca7e02e5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112948": {
+      "key": "584dc8b47c6405730891f6b769fbe7c95b1b01bb",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112958": {
+      "key": "bea8a51b7c4cd70eeb3a74f157d3c25fee5f96a4",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112968": {
+      "key": "f503bc9a6f97c6db674b857d1cc086ced925f621",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112978": {
+      "key": "eaa07993282fc95ab71ef86c4b845f1cba523b98",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112988": {
+      "key": "47b5ee537ff47027888964207e4c3a76336b8ce9",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:112998": {
+      "key": "c48bc63ef8001017e486c3ee680a9858669d4f97",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113008": {
+      "key": "18d720549586037b9080541a94a23b387695919d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113018": {
+      "key": "b88e06bda9c603c09df9e2642ba160cf4c580bc2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113028": {
+      "key": "f1468c940a2eb9b961971964341476a400b20869",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113038": {
+      "key": "93d4ea37168411dee5ef737eaaefb01910941dc4",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113048": {
+      "key": "ae9992fe164c117534dc8937ff6b812332b1df29",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113058": {
+      "key": "7e479d7132e42ebc05db78e004aa33831590def2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113068": {
+      "key": "0e3fb108780547c040350af3f1eab8ad1fede96b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113078": {
+      "key": "1fd897db6ccbe6699c49b3b58b9d2e1edd709c9e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113088": {
+      "key": "284052f665d54ec228477a24cffa9355f2ccbfc2",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113098": {
+      "key": "4c0a837b82d958af4a28c91ea2b0d0e7875cb2b4",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113108": {
+      "key": "ce6050560499ecec55aada78896f858fe5a846ad",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113118": {
+      "key": "3fe7a967f310c2ca0af918d6cb8ba0906c066fab",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113128": {
+      "key": "91def380fadafb6d9eb38ce37d76b9c38a210be3",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113138": {
+      "key": "441db4cd897f43fd3118ebcb5b7edac0087a5d1e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113148": {
+      "key": "ec624ffcb046af35b0ed86681a57f72a94bcc688",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113158": {
+      "key": "1d55c7fd96eb02d041a300c4c91d88ecc8d6318c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113168": {
+      "key": "1db830c5d0054aceb5a4ae075994ffdc0726b88c",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113178": {
+      "key": "42b07770f006072d8d43960c84889a8b7812c42e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113188": {
+      "key": "a438ba68ea60af64757e0a8f74277149b2f68b36",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113198": {
+      "key": "b6fa17f20f14665e4e479681743675ab14884fc3",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113208": {
+      "key": "bb44f11a387a12f88307046955536a5561442e16",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113218": {
+      "key": "7742530811f7083ea38658b84d74057897e1d5b0",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113228": {
+      "key": "25ad33ad641dda994e59243cc3e9ea1be23ce6c4",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113238": {
+      "key": "70d3300fddfd6fdefed53fbecd8c379c31044351",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113248": {
+      "key": "65504d99c081301b8498d5c8a02605ed17142252",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113258": {
+      "key": "e8f2024c6632fa5cac2a07fd19499e7c28b735e1",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113268": {
+      "key": "252698f42a77f7158d93ff6267a4fc84a1fb3ac5",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113278": {
+      "key": "e5c5ed16dd42b86251f54e4a8f8eb61ce935e485",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113288": {
+      "key": "3780059271c2d288811c4b5e567dd1c54be26652",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113298": {
+      "key": "23b0caceeb9071a67e5868d2834adebf2c2318cf",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113308": {
+      "key": "c840ae1132d4bd0c80f510fee122f296b3db915f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113318": {
+      "key": "2e4c6afff85675e1de8b2ff9d3ae4a94d77bf042",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113328": {
+      "key": "ec1867c032cadb283bbe826c0ba98dd0f8e0b111",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113338": {
+      "key": "74ff39891be5d1087879b2559a1e88755fb59d5d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113348": {
+      "key": "5b7f46a0db60d6fe950f61d29e5e657fdd10c4dc",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113358": {
+      "key": "9e99c19d7684ad5da70423a4243819190a56d35a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113368": {
+      "key": "1e57951b6a82c59d2f438fd22e5ddadc6da25ea2",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113378": {
+      "key": "8e6985b01795800613d23e695bc811b5d20b06c8",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113388": {
+      "key": "8b88ef818d3628e32f910dadef731fdc4ca61bcb",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113398": {
+      "key": "c5790c6ee41af04b6790cad67d96edad59aa46f4",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113408": {
+      "key": "af737c1cc76eac7430033ce1ed08e1100d8385ae",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113418": {
+      "key": "87748c4032bd3fbad4f87df629b8ed00c7948c69",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113428": {
+      "key": "3ad48f72f1e9f843da7cf9de1f072e500cc2b1c1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113438": {
+      "key": "82132a30c2546b1125de6a2cdac29a8eb4e61389",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113448": {
+      "key": "310ebba1c73542ad42eb4dd03412e32e9a00a78b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113458": {
+      "key": "b672df56cad2664b6ec23d7f37e52a03a96ac75e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113468": {
+      "key": "165ba4da6cb6c25e32b38340ae2cee8f7c2c89bf",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113478": {
+      "key": "df1aa1185577c72a1a07a55abadd8c3ce9087cb6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113488": {
+      "key": "7a73e6c640b6f84e2eceff5db7924c243bff23f4",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113498": {
+      "key": "089408a4d63949971e823656f577f01229b2cf5e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113508": {
+      "key": "477769c37816c8332259de7596c62f7ca3d52429",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113518": {
+      "key": "d5aa08aed6d8e1fbe5353395be103a08897dd706",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113528": {
+      "key": "b7682f4b445734d7d3b786759e8d7bdb560b412a",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113538": {
+      "key": "35176b01e1cf8d21c3b1a10770030d0dde2949db",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113548": {
+      "key": "880c3e1567547d077fc33e0dbded5876533c14b8",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113558": {
+      "key": "cc0d599b9b4d896c2836cb9fb52572303f13b98a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113568": {
+      "key": "6d17de2be78e55c5dc70195d2499d550cddf440d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113578": {
+      "key": "d1f8c650fa43380ec566bcdbc4bb03e3e0be628e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113588": {
+      "key": "bd104fe05a21c00cbe7392555d7cd2166381d222",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113598": {
+      "key": "b63cd85062ca6ee13e0cfef0e89706f187a3bd84",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113608": {
+      "key": "e27345984a974f7f2fadf95349b0ace00e5d92f0",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113618": {
+      "key": "cfa4c1e461e4b37a5ca519bd456c6474a7a9221e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113628": {
+      "key": "4d80d6b487af26824251a46661b3df4010a1c921",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113638": {
+      "key": "9d5f522cbd04a139c83fcbfa692c68ee2766f57b",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113648": {
+      "key": "65fde93f6698c4c874a7b041d96ead85e043bf9c",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113658": {
+      "key": "d92b7e636d4c9ea433113e0bc5529f3985f4fc51",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113668": {
+      "key": "2f88d137e4fac5dca1fc6be390b208cd70ab9fe1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113678": {
+      "key": "ab6ee8b86a8179f33c288a66ece2c0b20b20dcb5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113688": {
+      "key": "91b6ba580afc5c9369e6a65a4307fe3d8f86f9bc",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113698": {
+      "key": "a45b46e8bffdb28fb531bb49e8d3db3936ade1c2",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113708": {
+      "key": "56f5e2493c568082b1f8698899e082725c20aea2",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113718": {
+      "key": "f1fee51eec133073ca33f035211191bbe055b8a7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113728": {
+      "key": "81b754ea57841913ce0f9495e4911d3e1c986bf1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113738": {
+      "key": "73d59fd96ad455074d1fdcb6db823e154b353204",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113748": {
+      "key": "fab472cfcaac2683b52d6233d99721e150d1d7a6",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113758": {
+      "key": "de74ba2cfa49b8547d59494ed0a0acf062f7ca08",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113768": {
+      "key": "c131482c80f113889c802131ca47c3abbb485bd3",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113778": {
+      "key": "88efd32dd8e01ad06f7604069dd0aa44fac90f41",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113788": {
+      "key": "ad7e8686fabfbaf5868a79c83ac3ed4779c23091",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113798": {
+      "key": "470d25e8d19aa4a6fddbf0f08be707824db8c2b4",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113808": {
+      "key": "0c75f79926eeeab55038cd5aabe1f72889924dbb",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113818": {
+      "key": "1e5683172af6cd3768c7de7204108f76903c4063",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113828": {
+      "key": "8d0a224a1ce4838326c5a323d96879be44a47eb1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113838": {
+      "key": "99bcfd81cb85117f730cc6f1ac6046c1514571bf",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113848": {
+      "key": "f3a531bbd3d8629c2c238456ccdb70f4d4706dc1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113858": {
+      "key": "f867e0ec9f20607bec02516ab5e76f0dbe89169f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113868": {
+      "key": "d19298afe9774dd19c1895f772f27540dec2ab0b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113878": {
+      "key": "2440bb530675e17a07a3e7cc71474431c09b26c2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113888": {
+      "key": "aa6c1f3961db5640f857a15e06f37ec0c2dc95fe",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113898": {
+      "key": "568ffd02c384181a7520ba5976132fc379b99643",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113908": {
+      "key": "0b72228586185ca67a75331d632e2556ca905445",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113918": {
+      "key": "15617279c0f42157b6281e441053daa1fe7ca6eb",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113928": {
+      "key": "2a42896937850d34bb2a18eacf6ca048ca8117e1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113938": {
+      "key": "60fccfc02a760ef2ec1b49810aea9e147ccf0e08",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113948": {
+      "key": "2cf13cad9ca8086666b3ce3d30b23f760ee34eef",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113958": {
+      "key": "64139556d1b22cbee4d8a3de127063a40fd160f6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113968": {
+      "key": "b4b879bc6df56acd3ba8b847767e2c68bbf398a9",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113978": {
+      "key": "b60989872aca83736661eba57e9120eda0505e26",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113988": {
+      "key": "e7fc1fa9c5a524cd8adba1f71217fbb76d108810",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:113998": {
+      "key": "af1d7a9ed986cae1a723f7eb873ce45c18076320",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114008": {
+      "key": "83c9d0500280a683911f4c5511b8b4c449cd6371",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114018": {
+      "key": "edc508bdd78dc64c42014b07a18d8a9f56a1b8e6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114028": {
+      "key": "35eb6e8361b72cc0230760473bb2d53c11c7d0fb",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114038": {
+      "key": "2875cfed14233051c0e6b8a69cae06d2aa6923be",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114048": {
+      "key": "521563b8c98eea16c1aff30462efb15ff9161747",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114058": {
+      "key": "699a361b691293030b6aeb4acbf40f37da49c2a6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114068": {
+      "key": "326df8640d689660d2476f853741f183e6738a57",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114078": {
+      "key": "1366694c741d6146786935f9051367b2924b1c10",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114088": {
+      "key": "96dd9d318f58c6fc9b8986b107d8d2d022cdf328",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114098": {
+      "key": "f13341f2ee9c4d97e05726b04fa8d799749a2980",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114108": {
+      "key": "1456b5d898888583f5512038d1d54a07f8d3a5fe",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114118": {
+      "key": "64b795bf473a863245d86ae3247ea2e34570f602",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114128": {
+      "key": "a11340c393a53418726d0a86fc51fca291ccedeb",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114138": {
+      "key": "151728dbc34afe5e91340b93b1b63d4bac978825",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114148": {
+      "key": "161122c4813279b298fe42b0ae47f4978365719b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114158": {
+      "key": "7a212fedb4664cd7cd93c667d3ba35083aa82b51",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114168": {
+      "key": "7073e10b39fb43b107e1762cb71a7dd21250cb01",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114178": {
+      "key": "9b3e94d8b984efdb01930c986fa0c66311321d28",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114188": {
+      "key": "e8574a36b220d769f68bf76dcaccdbe421e185cf",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114198": {
+      "key": "4cbc1027c6007d666a75c0c54f77684d6b6aef92",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114208": {
+      "key": "8478bbe2fa3b44bf4e41e2a8b15c7dd1380e8c07",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114218": {
+      "key": "14454d810e4ce710d1ce5dd2c16a0b1ed4d2640c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114228": {
+      "key": "29704f76d9e58d03c9892fdc7a5ee7d1c6de9e2a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114238": {
+      "key": "26b9c33e131a252896c5310b58a6e5f474d41823",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114248": {
+      "key": "b787ad6f4b22bfd5c71ea6b75d05071e48ca27f8",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114258": {
+      "key": "239bdb7b017780040df24d11685f8851cb6ecb7f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114268": {
+      "key": "2427ffe13dcc68c10b8f9350efcd48f3196c75e9",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114278": {
+      "key": "e06eca4d4e0d25d3a1b145219db996564b2d7282",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114288": {
+      "key": "8f4f1a21e9230b173cac5a80dc096c2e7f25e845",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114298": {
+      "key": "c1bc348d9f9c353f4ea9b1a114b57dbb09918a65",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114308": {
+      "key": "0111f26efd4003b1b4836e23a79814bc0804b53b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114318": {
+      "key": "e2200cbf2af7235eb979bd3b97b981400a8d4ecb",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114328": {
+      "key": "1ee40c8b866eaaa2922dce462a2dcf4444b1a9e5",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114338": {
+      "key": "659217f0fa163603fdbb4299be7c6cf4b39b4a13",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114348": {
+      "key": "7fd6a8014202966cec2436be70dc67488fb723fc",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114358": {
+      "key": "b503b6cdd269fb1b4f5adc5f4520c66bbd094977",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114368": {
+      "key": "64a3e96cc3569bc203838a0bc8f127b9b432331e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114378": {
+      "key": "87b23400a8042cd25071e55938a11f2b700ab4d5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114388": {
+      "key": "7dd5d8a9d59f53ace3eb10ab98a5eabad42fce0b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114398": {
+      "key": "6df083115331bbd6e15ce38e0941f097acc4c963",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114408": {
+      "key": "92bb7ece6b6cffc31318cce52928393492151fdc",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114418": {
+      "key": "8a2609910ab2f931d59325b79373b0b494edaa67",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114428": {
+      "key": "8a0e55fa24f95620452e88601577fbd8247e8ae5",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114438": {
+      "key": "7081ec1378b4d2ad34154a1d0681e84cf323d113",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114448": {
+      "key": "07a2b9807ba162befe25b0a98498e00edb90a4a7",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114458": {
+      "key": "86c2dfaa97cb7149328a512f3f06fd18c770800f",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114468": {
+      "key": "cd51fbc24df17443345fff7b26b3884976bb010f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114478": {
+      "key": "d0013fb68a43bb4631037e7a8d54a3f2dcf05cd5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114488": {
+      "key": "6a7aa14b2c0dee174c7d4be4bac4188264e8e1cc",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114498": {
+      "key": "6d4c39bff168148a7409091f3c96dd3698b49a70",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114508": {
+      "key": "d579dec391a3b4cb2bcbf79d56a3fc0a88839430",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114518": {
+      "key": "ff1e226ef062b6504034439d7a07851db7c5ec51",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114528": {
+      "key": "bbceceed6132d474e79d71eb4276d53f62ba9b18",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114538": {
+      "key": "cc3f92b64fbcf0398c5375e6d136702036baba33",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114548": {
+      "key": "1d7214660575c69f4ef65885c7a4ab491e7db10f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114558": {
+      "key": "c8bf9faed16f1248363a696b20397a84dc834352",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114568": {
+      "key": "ed15de4f4875a88bd5d36dcd489e53fa527d4764",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114578": {
+      "key": "a037866d54507d13d3aa19c5ee5b82bc4683381d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114588": {
+      "key": "123e2400690e73808afa5bec024d86e30cecf773",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114598": {
+      "key": "0a5973e0faac4ee577d053b618162ce315a85533",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114608": {
+      "key": "ec22e8a98af8f8cac8d7572b7d9cfebd8ca8795f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114618": {
+      "key": "5c477989d30f02c751ff0576b2b08794688f8f1d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114628": {
+      "key": "c3cb17596c516fcf9553f612a1df79911b4efb34",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114638": {
+      "key": "6cf689dc61eb434abadcd25b2640b030f73b03b3",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114648": {
+      "key": "22409de872cc7e9daa0f4d67c189810502a9d9ed",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114658": {
+      "key": "e79cceb7fbe800629dfcc22d2bbb9a0ce719a0b7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114668": {
+      "key": "d70da9ca3339f148600473f7ccead21d2db460a1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114678": {
+      "key": "cb9afbb54a95b262c769dc02058c69dee0d93194",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114688": {
+      "key": "1b0b9b3cfd2d1d3bd25f30a6aea82d4d177a22a7",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114698": {
+      "key": "53333171652d977d34a1aaa76715f0aaaf4aad06",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114708": {
+      "key": "47938939c07eeaa15a7934e9d3101c1ecd4992f0",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114718": {
+      "key": "69f7408157fbcd1c24eb1f7719110f527d602c82",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114728": {
+      "key": "fd4731d280413594013b596820889baec7e1988a",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114738": {
+      "key": "b91a6e3362178013b7fee05aa615af088fc27546",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114748": {
+      "key": "c8f3e95c44a731d3c4c3a0044f805fa7367c9463",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114758": {
+      "key": "fc08b258d193e377001958836207f318ddeaeb7a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114768": {
+      "key": "d096f449bc7f0c45c8d76561366d002deb35741b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114778": {
+      "key": "01c56af437e62f118d4d4b55a3974822c3f24279",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114788": {
+      "key": "376fd33ae0c5c9bb0903aebe96145e617e0338be",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114798": {
+      "key": "b401fab7bdf697dd9d714769af2911a8fc0cf116",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114808": {
+      "key": "cabc08b5123b8ac3f70947b94eb7407647720fe3",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114818": {
+      "key": "041c7f3152417d34dc9eef857d98ec1be5b643a6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114828": {
+      "key": "cd43c5092d2d5bdcbd54c65818aa2440285b7bac",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114838": {
+      "key": "096c28fea593a4344a5b38016da19862c909e0e3",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114848": {
+      "key": "7e36828277ba6c805bc21b2c809ca1058bc92d3b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114858": {
+      "key": "b641b207b42a4e4abae386909834c4d8d3a0b16b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114868": {
+      "key": "f649a67f8534ffecaa4c683355ea0f7ca1fc74f1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114878": {
+      "key": "bd0c55821c40af19c368816a11e097d241c55148",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114888": {
+      "key": "48d4d31866eb6bf2f2c2e9319b69b95530e56061",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114898": {
+      "key": "87d892ab9480f340850990effa2b090f8885fd97",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114908": {
+      "key": "409d5c0d257deefc759514c3eef718918e69126b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114918": {
+      "key": "d9d7ee217b27a9eb428f2c99abfc78cecf7febaf",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114928": {
+      "key": "5910b0e6beaad30c95f3acdfb8dfd6b0c26c7e77",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114938": {
+      "key": "545e0afadbad165feb6a6b8d9cff0d8eb9ff96ef",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114948": {
+      "key": "48cb022afbdfc004233c3b8dbc2741565bbd5620",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114958": {
+      "key": "a0562b000adc5aeb47d323f5f7d7bcf5bf228d29",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114968": {
+      "key": "147ae9b9af4a0d43ecf002cf08fca24afa67a28a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114978": {
+      "key": "53c9f1e9bfebcb0c9306befa69279e175f9c323e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114988": {
+      "key": "ed8d02d6e91aa23fe079fac87c25cd8708c1d02c",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:114998": {
+      "key": "4fdd2b67b2ea6765efce5346355e3077faa973b7",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115008": {
+      "key": "16922027b89e873f5baecf2fc10f801047bc3b2f",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115018": {
+      "key": "3218e0b803edf9a7bcadecb22f06a652d8f620f9",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115028": {
+      "key": "c1a10578e9107fcd737efe1bfc85201987195a4e",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115038": {
+      "key": "4115f22f4d2cf411fda9992cbdd3f0af06ef5826",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115048": {
+      "key": "f37606f5563722889a73e0797432a270ba402d19",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115058": {
+      "key": "27852d5a848671e849d146e56818b03a1d5561cb",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115068": {
+      "key": "4694f19551ab9c5d7ea72476fab51c0e4cbbe2b5",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115078": {
+      "key": "932ea0ed36675db9c8a9db25922dbf945b6d28d7",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115088": {
+      "key": "5f944447db42497d1c0900607953de6bc1fbbfde",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115098": {
+      "key": "8cfc9350256e6f40b9161fcb565bbc5d49d866cc",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115108": {
+      "key": "c0b345e8cc306f96fc43dbf9612daff2fdb6d550",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115118": {
+      "key": "9b8a02fe4f6e29a0da7acc9101a65510442de921",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115128": {
+      "key": "80bca42950aa5869b2579e5cafdca0d752f4e072",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115138": {
+      "key": "4b8f4c18ba096e6fc2a8b43c643dca575e609b16",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115148": {
+      "key": "697d49c78597e3f833c790ad856a2fbb297b70ae",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115158": {
+      "key": "04ee9e3342e31bd65e19c0657201c0f168d44066",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115168": {
+      "key": "7cead2b2b1432bfa609b9f2f03018d32e333b856",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115178": {
+      "key": "b6c029fff7303aedfc6fd83f078a8b02ef6979b3",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115188": {
+      "key": "dfd5e3ff3aa3406c1b2860f2eba076bf6f3c09e0",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115198": {
+      "key": "4556013c02a94ccff7ea024b11fb3f317ed02fd6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115208": {
+      "key": "3a39648ed79d5dd9f92188a06e2216e50f56fff7",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115218": {
+      "key": "8598fbe3d0ef37d5cd586b77cf3b7811fc3e75b9",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115228": {
+      "key": "d4b4c41210d181e8bc0c15ef291fba8135b2ab13",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115238": {
+      "key": "700b4e3f2d2f8dda64e607a8d0e88d7ed74f36a2",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115248": {
+      "key": "1e5e4e857f0d077892c11b6c5424b7b42cf0644e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115258": {
+      "key": "6656ff60918e7d8e76c9eb74be24bb647fd55290",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115268": {
+      "key": "2ae8fcaef2f63b08c2d7de38da73821be533c399",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115278": {
+      "key": "c642e4b473aab4aa9229e4e86cec1647019cfdcd",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115288": {
+      "key": "26a9702b061ab8a49c102974c77a461265294b58",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115298": {
+      "key": "9f3812c923f2406aa0faf894909c7a0ab3e2063c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115308": {
+      "key": "db573b6b480da57827dbfca95a4e10abd109f25f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115318": {
+      "key": "003b1bf974b5b6ae3374c794e6f0ee779fa6d3ef",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115328": {
+      "key": "b2b202643a6616b8f63446876555015e8247f118",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115338": {
+      "key": "7d335984e171cd69a89893e9aecad2dfd0d58f54",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115348": {
+      "key": "01c38645312c30d2a84962e8245c4c0c0a2e3e48",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115358": {
+      "key": "ab64d41eecf6dee548b75cf474d3485adc639a75",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115368": {
+      "key": "f24b1b5cdbc1b144e91ec9de0339466783d946f7",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115378": {
+      "key": "5f2cedbd26e48dfdbb44aa1b3d1dc769d4fb221b",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115388": {
+      "key": "19fe50cc66c4fcfce4f733506a2f85a7959dfb88",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115398": {
+      "key": "2060c6ac49fb46ca8071107f996878702de00bf1",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115408": {
+      "key": "a212a88f67c79cf6cc9465d35931ef240791b8e3",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115418": {
+      "key": "e737514e8baf377f298a4d9c31bb1fdc842074a6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115428": {
+      "key": "d2aeb4605788d676b7fac369952a7bc76842990f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115438": {
+      "key": "3de2dccab6ce7d30c572ade953139d1ea5597bf3",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115448": {
+      "key": "c91bb7e3e5a8fa7e49973a2aba1c68066f4cbb6f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115458": {
+      "key": "9b1d7198e2afc4f38df71ef406b3c45e7554f7bf",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115468": {
+      "key": "4c1a14f095300be0da22267e7f88a32324875c3f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115478": {
+      "key": "97797c20c95d1cc37a2dc8ecf0e243c06d773deb",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115488": {
+      "key": "dc6b9e45a74857df874652cc2f8bc0619e8a1884",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115498": {
+      "key": "4d9d42a7ad4436c5ae3f7bbc3191e4c787b0fcd7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115508": {
+      "key": "897a517f5ac13227ef6587cf757cf595683108c7",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115518": {
+      "key": "44c9b23282b05c9f2b343d0bb367b35da58d529f",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115528": {
+      "key": "ec9d74c75f52eac04fe916a094a00ea5a0a1069e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115538": {
+      "key": "304be27e41bfa86dfc03fbdf99ef9c5c8ee2b650",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115548": {
+      "key": "c862c7af830f6e31fdb13c7c589870e685ad0424",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115558": {
+      "key": "53ce16216ed9981ea48dbfa520cdd37dfd51ad73",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115568": {
+      "key": "1af0c2894afd3ca84bbaba8bc6d0af61a74da216",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115578": {
+      "key": "33c9405caab696cb42263a5175a5fc0962dfc673",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115588": {
+      "key": "bbd7f59b26ee3a9d3632bb9c0a4328b6c2bc99f4",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115598": {
+      "key": "008356d67ca11c88337e86bf443f5f15234bd23a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115608": {
+      "key": "05f677093cbf69e5b2755261c56786d32d13d087",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115618": {
+      "key": "de4d15cb553cfb9ef199ff6cc3040b4253e4cdfd",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115628": {
+      "key": "37ebba91e4462be69464d8b34af3d5a6b9b3c679",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115638": {
+      "key": "b21b434d8e9e38ef175ed87a4e44b36e8d121cb5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115648": {
+      "key": "c96e7e2765c68db560656dc8bae5a52fd1639def",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115658": {
+      "key": "be5ffb4411bc5a347c2294dd6f2fac5262d8bf8b",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115668": {
+      "key": "2e834c18ffec4cb1802fe3e52b8d54e5e833b9cf",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115678": {
+      "key": "8f7264e2dc2e2d85b32ef2e9e2673ca4b38fe3bb",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115688": {
+      "key": "2eef15ed83d4fe8be6bd746da3b31d8dc6648d74",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115698": {
+      "key": "c8bd2e78d809e9a221f1d961ca15c58620094750",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115708": {
+      "key": "27c35b361c7a724bfbbac62d2589a7163d2fbe04",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115718": {
+      "key": "db95f4a6b0ff4c8fefa1119d62b5ce5398d7228e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115728": {
+      "key": "4aec36fee0e9d51e80621289030dd85f9ac40dea",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115738": {
+      "key": "0056a13ad2ce1b2216491eb4310be4798a498236",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115748": {
+      "key": "67d0fa78f22cdae3f85e263cee2af4ae9e562341",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115758": {
+      "key": "07cef29b1f7c616a88bf6f7f46d664eac8c9e611",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115768": {
+      "key": "e2568e2b92f8e20fc8c8df4efd0384a37f78fa30",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115778": {
+      "key": "a7d4c18908ee8a2fe817cbf045291a20e3cf7a19",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115788": {
+      "key": "919c430494b561d2d4a320a835ce9bda022bf238",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115798": {
+      "key": "6772aca2413daea7c2c2e2e13fc4422248dee6d0",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115808": {
+      "key": "85901d2ed36d40b4053c1fc759c3ff3d1444e747",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115818": {
+      "key": "621c017cedd5a11c89733922fbffa18c518a2040",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115828": {
+      "key": "a6af46b8ab08e8f2e82b843eb1517ca73db8cce1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115838": {
+      "key": "8ab0afffa93710b78b35fc31156bbd08a21e803c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115848": {
+      "key": "e729da4b1e5865c976afc09091895a39e69049d1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115858": {
+      "key": "312e78ee55d23c8180cc5394084effe271871b9c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115868": {
+      "key": "d7e83984799b43d277a897e4b41a828020838c26",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115878": {
+      "key": "a0eaaa4ff3b05d11db517a2d29f857b3234a2b46",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115888": {
+      "key": "ab7f9b5e65eff3f94fd59f6b77a623978fb6bd7d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115898": {
+      "key": "365f553050ae485cc69f58c298c8918dad72a537",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115908": {
+      "key": "245cfc2f6625acc9acdc6cc58d7143c33cd8a17d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115918": {
+      "key": "4d04238b38918bfbb50e32d8ea9eace90b6675d5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115928": {
+      "key": "7d95ea6798114cdcc8ce60919bedf32cd214a9b6",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115938": {
+      "key": "a60a9979591f35dad7802c46ac7eb9d81b822f24",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115948": {
+      "key": "b25d8466ed1dc2666f6165eb9b678d4b9c0ef460",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115958": {
+      "key": "6bc600345338cd209bceaadd385bc905c27b3974",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115968": {
+      "key": "2f4be3eaa7df9e6e381ab50e56a3642a630f1f78",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115978": {
+      "key": "a3bcb7d023226fd3660ca3dbe128f195db07e64a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115988": {
+      "key": "c585a2917aecb5232f6a4bbafe34028d46b0d5aa",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:115998": {
+      "key": "12218ca77af689923676228f73d27f41149a8ecd",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116008": {
+      "key": "34b1c94997ac14f1cdda4a8ae0156ed695d703b9",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116018": {
+      "key": "5536cd5559a1e08d0224481d0e9ff6e518454749",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116028": {
+      "key": "7c7d9b0dc9fe9433ae36e1a1a0f9649929858481",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116038": {
+      "key": "a6d904050518850dfc481e4487f2eddb7867cd37",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116048": {
+      "key": "03a10d4e734b0f98047c7d877c5c89a07976ff0e",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116058": {
+      "key": "7c739ac99554f0a95de3cabc8142ffbf5fb44c9d",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116068": {
+      "key": "fb6fdb211d88c2d5a824272c1be03f5da9d26c61",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116078": {
+      "key": "d963afd5877819414620f9a7f93fd3ea7e4062bf",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116088": {
+      "key": "20c8490e397ff8617b59ee0d936711f872c0f5c1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116098": {
+      "key": "f360a8cf62fc1baeaea364033c9a92836e9b194a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116108": {
+      "key": "66492c72f95963d0a877f39a28a251f089ff853d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116118": {
+      "key": "fecc8e0c55ce5f8d65dacbad7b0f702910f24b60",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116128": {
+      "key": "f9c79065e462229c3551ea36cf35a0d1851d3a2e",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116138": {
+      "key": "2c3971c3315408a7a4a7621c627a1594fbc5f49e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116148": {
+      "key": "c2a7f1e6481ba6aceca350610f7d7fb24f8168c3",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116158": {
+      "key": "11692e60e9ae7ce419dfbfad7a86703af45816bc",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116168": {
+      "key": "e8ecbc3d6160e5a329fd1b77be094a5df8cffbd6",
+      "name": "Roundness=Default, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116178": {
+      "key": "0bf63f78603cd086487dedb88afc68a65484e095",
+      "name": "Roundness=Round, Skin=Outlined, Size=Regular, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116188": {
+      "key": "2e87ddb3866b5a797a1b2264f7c28a6e7b2aa645",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116198": {
+      "key": "95c0633d73852829837c3eaf699fced28e412a94",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116208": {
+      "key": "12ac8458d8559683f8f9077187d93b8957063783",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116218": {
+      "key": "7abc6beb8bffd08397c6330fd8988acbca055aa6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116228": {
+      "key": "c5ab1e83079b6a836a3e310238825f660b3e9852",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116238": {
+      "key": "337c76c548ffecbd1711c7f251cc80e9f56e343b",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116248": {
+      "key": "52a8b3912394ce3da828e2caa9d3e9fde2c8002c",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116258": {
+      "key": "2e410297081799fb20ba6d05edbb2b18732e4586",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116268": {
+      "key": "9adf1aad22e897009584863bd8d8222b936d260f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116278": {
+      "key": "b2bf45f1da4d7339570ae10ac101b852096bde36",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116288": {
+      "key": "cb8d157de1bfb70f91ea3ec0cebbafc2c7e3abce",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116298": {
+      "key": "1ca7e154c4f240e808c4f5f3b978b02a07447525",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116308": {
+      "key": "563af82600fa810945343123a6454ae833ccd66b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116318": {
+      "key": "ceb4d3f704dbeaaccecb329fa84d73d1b626267f",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116328": {
+      "key": "66310d0c6ca4ff098ed77271cee55a7edd8fb0ed",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116338": {
+      "key": "6fb352d66c5cd0c496ef019288c09afd0360e738",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116348": {
+      "key": "212b72e8e547d097cb999a6bd7e331d64cdf1031",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116358": {
+      "key": "2b488fe72e1f8719882c86745180b99c7644cd74",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116368": {
+      "key": "c45be8e4ed5a12d420e74e905df7542db8baba32",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116378": {
+      "key": "37356d1a1ebbd504276b51f393841f8aeed3f73d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116388": {
+      "key": "bddb91659ea7e5bed5a43de7057f1cc99de999d1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116398": {
+      "key": "31154044d3b229cee630a3862b6aa98fe671059b",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116408": {
+      "key": "f05a3b4893d4bfa5e6e5d46903725737bb5a80e9",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116418": {
+      "key": "6f3ac4a71e793b5cd7e823d7ec496bec84010373",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116428": {
+      "key": "1161d2a78ce85aa4f301b75009b3fa37b660389a",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116438": {
+      "key": "bab44c88c5d93e21a87d7c714f037bc7822d7ab2",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116448": {
+      "key": "af0622c3f84aa964334d976d8637f463feadeb4c",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116458": {
+      "key": "3e352b0af8c856197f0fdc6eb8be515fef3a073c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116468": {
+      "key": "08ce9c26069337436576e7db42dda12b235368b7",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116478": {
+      "key": "dda97b523b14d148fffef51ef27caae1bc9ea1e9",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116488": {
+      "key": "7db75da21e1e3f3e590253f8e750e1da5818815d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116498": {
+      "key": "35fa4250e097f92b4e69025519d353face83fc2c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116508": {
+      "key": "4c2cb83b067bc2280dd857a4658ba55c761a9214",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116518": {
+      "key": "11f5e145b4ed3d358ac208e3ceb106b65d5cf229",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116528": {
+      "key": "8378edf8e08df74307c683d7ed309f9026484d67",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116538": {
+      "key": "0f03aa80a29c5714ce986dbc0c28e18de901b6ad",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116548": {
+      "key": "cdbe957ca8db6536ae014a83ff1a582a839d4f4d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116558": {
+      "key": "ee96e5cb3a6fcee7138c48d586c2779b1442f419",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116568": {
+      "key": "2ab8445503097abf8f3596b307dc866337cd9713",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116578": {
+      "key": "3ab9225dd4cdd7f688262565caeaae68112fb7d2",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116588": {
+      "key": "ed9dfc01f47fee5f94c91f35532a197436bdc536",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116598": {
+      "key": "463df81cd2002352cf5101a10c3e562c993a9482",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116608": {
+      "key": "3730fbf2a6400c531f0dddb8a8a9a7c044a4f822",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116618": {
+      "key": "65b0b21b09a9091d6b4fa916f9c01b127de094ca",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116628": {
+      "key": "509ec0a12bdc1d1dde693547078a3d0268bc3f9c",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116638": {
+      "key": "c179a8d50536b8639b2150b7321ccef7ff2e31ca",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116648": {
+      "key": "942e088833df02025e623bea122342c48d948e64",
+      "name": "Roundness=Default, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "816:116658": {
+      "key": "3047ece25db5fbcddc6b9cf18870b6fcb5ef1e27",
+      "name": "Roundness=Round, Skin=Ghost, Size=Regular, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "816:112827",
+      "documentationLinks": []
+    },
+    "164:20361": {
+      "key": "ae93a29cf7d286fce8a277ce0b89bb97b9f51b7c",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20348": {
+      "key": "e415bf549e2b390aabd58dd63cfa4403c2d1ab41",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21362": {
+      "key": "faf287a8e67f40ef9328ccb209f628b4f731f777",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21356": {
+      "key": "b9b66bdce2661f1ae427dcf7f41eda325dd74b13",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22370": {
+      "key": "7da4a88112a54147c7358f559d86d05d37526303",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22364": {
+      "key": "ba1274ca8afa6286c77644a3d06d1f336aac0037",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23743": {
+      "key": "28c05987cae1fd4a44323eb1d0df44e9c3160b2e",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23737": {
+      "key": "79dd1b5b779d555da8dddad98f1d7d647d50f7ad",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44402": {
+      "key": "e72256b8182c13efe27332b70d4d3ffb0afdf61e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44396": {
+      "key": "c43a65576f15bc3e8106ce0a7b0c52abdbef5d7c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44306": {
+      "key": "532f0d69b27d336b1b91464dee66308af3be755a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44300": {
+      "key": "f01d385aca7dc7d0d107711f8d711cd8964751d3",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44210": {
+      "key": "6f014fe0074467c764e5a7b4217e05f0d8dbfaea",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44204": {
+      "key": "d800c3faee3d69b3d94eb9cac245af61b2a5a8f0",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44114": {
+      "key": "faf9a478f4c22c29c553b52f3eb3298337e708e6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44108": {
+      "key": "7458d3fe49821d691a65d44e86c29f72b95402b6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20363": {
+      "key": "0b56ffe7a0fca7fe862a583e41f235e8243c2643",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20345": {
+      "key": "bb4eb3ee6520cda93da394fd7b05d748adee4da9",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21366": {
+      "key": "82c427804eb482907cd8c7a630a3ec7af71c55af",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21360": {
+      "key": "0f7e8ebe7f35caecc002adf9c719fdce8e052218",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22374": {
+      "key": "9f63376aecda7fa3d1e408cfabf8839a424a7faa",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22368": {
+      "key": "b25af4ab145e420522ee105dfbf65424514dbd15",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23747": {
+      "key": "ffb01a762cf327297cc20ce42cbdfd0631f8e80d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23741": {
+      "key": "987dcad795ce00318111e79f00162ffde3e698a8",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44406": {
+      "key": "7b53daa7cea4d23d825e838ea61ee241f643839d",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44400": {
+      "key": "323a5fccacd7633a41c874b47d96ca008614fdf1",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44310": {
+      "key": "af181b60ba54e4dddece33f1ab6f467d65590641",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44304": {
+      "key": "5e3c05967c1c76484f62e3d25a10b7ad4a1734c5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44214": {
+      "key": "b4e364132e9bc44e4e0fe16d3efba88ddeef6568",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44208": {
+      "key": "527fbd662bf5b15101c955eeb64a41612b934d8d",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44118": {
+      "key": "02ed6cba51ec493416b00d504be70bcbfbae080d",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44112": {
+      "key": "e2a2ec22fded2ba9e6387ea0299abe72263dd54b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20347": {
+      "key": "b08c2a300e3d02fc1303c6982370ea4571151cbd",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20346": {
+      "key": "c2c26668f9200488c7de81edc9423b29b395730a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21364": {
+      "key": "6a66a8a1ac139344f3a35dd2cd3943403ac8c6ab",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21358": {
+      "key": "d6ef0be108ef1c8688560c3e1b587f53313dfba3",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22372": {
+      "key": "9fa48f165aa4ce72899337e1ce8ad06c4a63704b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22366": {
+      "key": "6365f37e1baea18fe4b0db4dfa3c0146505e5376",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23745": {
+      "key": "433bdf7e17ae4ef1e935cc2cce710faa4df96c19",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23739": {
+      "key": "a68a712d0601819673288b2f89ebb4265d3ed3fd",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44404": {
+      "key": "61f577b49e98abb3fdc1a665927e7efbe0a4fdd2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44398": {
+      "key": "3ef5e3cfcb4bb6d61f54820435a32b7366f4eb3b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44308": {
+      "key": "4c4e74290411f2283bf323e361bb5ee6e237399a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44302": {
+      "key": "bccb13facade3cbbefdcd817cfbe7a7d24702112",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44212": {
+      "key": "7253138865d6936378ef78161f7cd1e927aab818",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44206": {
+      "key": "34499c0bf5032fe8f90fa147b9eb9512b82ac30a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44116": {
+      "key": "563bdc14e27e3c0af415efac3fe2bca64e8a92f8",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44110": {
+      "key": "98cf7ff036efeea2b22b951920dffbe6ddb03bb8",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20373": {
+      "key": "68e58e8fa006f11fe74b1271a73478edb045b96d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20353": {
+      "key": "19b55a9f788ee4f2edc1c731cdea1312af7c5c66",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21350": {
+      "key": "ec5c15c0d0625bed8504d902cf70a064d2c49ef8",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21344": {
+      "key": "a786c006f8ac7fa1de4269c64c49c1ca9c1af89c",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22358": {
+      "key": "c3908d53b713bdc91477b6bc78e2e30913cd97f4",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22352": {
+      "key": "d6ffc49210a58f991b783879c307add024b89d93",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23731": {
+      "key": "7d756520bc048cf3511e46946262e29db293efc8",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23725": {
+      "key": "339d0869e16d9d6131a6f6281b92ee9c3034eced",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44390": {
+      "key": "604e572b0a5a6ff68bbd23b5b4cc964ffa216541",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44384": {
+      "key": "23bf2adf1b60f4623d8d9bb2be20163b992ce38b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44294": {
+      "key": "c5630f3801e5a794047ad1b96e3e37eab52b6863",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44288": {
+      "key": "4a7f69bea4fa701fd9a4c9e0cfaea25cba27f918",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44198": {
+      "key": "a8161841497bd1e902397c732fb264f674eba740",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44192": {
+      "key": "09dc4a1b708d83e51982e32a186ac7f92b8672f5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44102": {
+      "key": "541429afd3526138b92cf65d8a3764af4e02e91b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44096": {
+      "key": "186eb5f85cbfce9231a9b6d7a1de1ec8ec6b90de",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20376": {
+      "key": "5a977d0fd407e5e9da3dd196ce41ebc3da692aa9",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20360": {
+      "key": "7695cea412e748ac079a3e3ce574c34aa6656782",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21354": {
+      "key": "e0404cfc7550a8657db500024dd80a34e1fe159d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21348": {
+      "key": "7fb51ea6dddf4795f6845abebb1bc9869bd68642",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22362": {
+      "key": "78a83bef2db0e28ccdf348cc3664d856318fdd3b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22356": {
+      "key": "1524958927a19871d54eec129c2268407981d9aa",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23735": {
+      "key": "e281441e5db41d8c1d992f9c92e25b500b56c290",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23729": {
+      "key": "ea15c96160fc12814b5e847b1246e5c25e88c368",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44394": {
+      "key": "19d9314239f05780730a808b91aba89b3878bf56",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44388": {
+      "key": "f8fa99dfb8c8d8cf630fe9d2260567b4f48c7d79",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44298": {
+      "key": "300423c83b0aeec4290d61a41b934aaeb2c1573e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44292": {
+      "key": "f6b1c8b2361cbcc7dfcd3e1176dbbe6e0657ccbd",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44202": {
+      "key": "f6536c2d701acc89ff2583e5f0af1f2a8fd252a5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44196": {
+      "key": "bec3a00e9c7bfc0d1576f39dbabab81dcb6a02fc",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44106": {
+      "key": "6a9c4d4dd4d62a3b042456bb7be24f3086919cbc",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44100": {
+      "key": "59fd7d04ac2a3cedf0a1eeed1d17a3ec3b6e40db",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20349": {
+      "key": "133ed808bde855fdb77338643ea5a475abc7b07a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20350": {
+      "key": "f941b01e650a12e100227dfcca5411ed4677b561",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21352": {
+      "key": "165f7e027f425dbb68d3901f391b83bdd8b7af80",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21346": {
+      "key": "386fcadd5610d864940e65e3bdae31ffb7eaa3d4",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22360": {
+      "key": "f2079c7eec65f54163bc872cb5d562a94788b6ce",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22354": {
+      "key": "a89f4197658a6198f1d4b566e27e97394ec6da07",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23733": {
+      "key": "a3f57254f68d3aebcd95dfaa045047c9906f3c00",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23727": {
+      "key": "c0165628fd83350284d0d3566fc3ac6e6ca7413e",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44392": {
+      "key": "bd16deb33d97bfeb5056d6b67b867972fdd3a80b",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44386": {
+      "key": "cb4f0f3f6c577726cb917ce40d8cd7f8265d1cce",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44296": {
+      "key": "b394b2ca887fbaa85d52b1dd8dd3f4e3d1558841",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44290": {
+      "key": "64c6d55cc23a31ce150592b0fb2168f9dd7f5121",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44200": {
+      "key": "bd5573cadf69e1eaf210c48ae9e0d56a635e4303",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44194": {
+      "key": "de1acd09487d8a5471a8655b1a4ef0ffb4c8d710",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44104": {
+      "key": "b17a85ed044f0eeac159adf5f4120e493404610c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44098": {
+      "key": "cc99887f8d04e82e9e0d70cb0ec19ed7253ff190",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20342": {
+      "key": "69351c2a6ec83499880c19f91c2df431a4e23ce2",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20357": {
+      "key": "43fa3bf3735b980eb995574f4f1be4ca10056a4a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21374": {
+      "key": "40cdca63bce7525b1c82eef7e3dde21eea43ea2b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21368": {
+      "key": "58e4fa51b61710a1e20babda09aae8bb611bd710",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22382": {
+      "key": "3a71babd0434bdf3e32c9e868b7ea4752892fc31",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22376": {
+      "key": "7309611d473e0854890c022318a2fa030193ca0d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23755": {
+      "key": "414e7fbf5448d45bf43e3d6d04129392c4643dca",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23749": {
+      "key": "86422a094a8bb66ca5eff9ffbcc7dc3b8c1fe63b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44420": {
+      "key": "a092da129ffb348ffbc37b72a04f04bfac8fa055",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44408": {
+      "key": "dd372cfb2f8fdae0821a61e621d945bb4e03011f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44324": {
+      "key": "62b832c47fa4891f54967d19e9e076509add7d91",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44312": {
+      "key": "3f53e621c87e665ff4c898adb1bf18a7840b7d7f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44228": {
+      "key": "3f0e1ac733de4f9a1f21454c19a48a303f6e950c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44216": {
+      "key": "ee5e63755a4b007842695ef4f44867fa01700624",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44132": {
+      "key": "4a870e8273a1a03da131873543acd80771c25086",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44120": {
+      "key": "16f1c3ac78d09d91ea1c1feca5eb4125761df3dd",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20351": {
+      "key": "85b059498f9d5894b9b2718f189f0a9a6fe1402b",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20343": {
+      "key": "e0f36ec8c98538b06393fe33be17212baa237949",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21378": {
+      "key": "1a6c696c515016db8467ae3d8092ecba3572da1a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21372": {
+      "key": "c2aafb231328b90f93a1ce200df226f66f39fa4c",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22386": {
+      "key": "40dd0aae859eb0cc279be9eb6faa879841119edf",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22380": {
+      "key": "0a692bc2e063c505f7b33552bc65f70c4b0f6bdd",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23759": {
+      "key": "0847e88e0baae2ed03e129c86607326d66726d72",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23753": {
+      "key": "2f6a058994894f9120623d6b35f16afa0ef05c50",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44428": {
+      "key": "b587b1e3ffa9eb246b784cef9e3a8aecb14ff912",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44416": {
+      "key": "ccd803ede9276f0741e731586bfad3ec7f3ec25e",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44332": {
+      "key": "1ec825eb382fc073f99e6d35b338378b6cf80e2a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44320": {
+      "key": "86725997f3426ccba3226159ced4ed3b1a9315b7",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44236": {
+      "key": "9018e9599e3cddbbc92f513ce0f8a6bfaa81c084",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44224": {
+      "key": "b907e6668af1d43deb8e131b47cf7de3b82acd90",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44140": {
+      "key": "4f0e3d38871277f1a8faa1ad2aba116d646d24ce",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44128": {
+      "key": "b181c925cf4dc06e9a3f38b5dc52ab9bc87173c2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20366": {
+      "key": "72bd5896615a3eccb63056554f02830bce66cd71",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20344": {
+      "key": "8b71f5eabe2072d87317fae7befb929fe81f31a6",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21376": {
+      "key": "5ef6975ef52a3e86ccdc7ad0a3861612c9fa6872",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21370": {
+      "key": "e0ccd8585b77d040c5e812b93c3c4dee43ea30d0",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22384": {
+      "key": "b10e7396dd3fa09b997213a839e073e13050ed43",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22378": {
+      "key": "6703ad179ea35d21489f2563ca56a305b4ff4ebb",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23757": {
+      "key": "8f7b8ae16009f2d4bd159b579c2324896a0f8b9d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23751": {
+      "key": "8f4a9abff9c151d7a77e02be8010cf251ba033ca",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44424": {
+      "key": "7fe52fb21978753c64b9cc6d3a736771305f41c9",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44412": {
+      "key": "bbecb6f0cc70c624ed7c92dacc6381585ae1b55f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44328": {
+      "key": "112fafedc404f02e14672725b47147c4f38b0fe5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44316": {
+      "key": "e6cbe2cc39a91c534b82cebe70f46f95ca411ff3",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44232": {
+      "key": "c7261bd204988a1e02482a56d94f2c9725a9b667",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44220": {
+      "key": "2aa61139d9234e664ff8da4a256309587f08f681",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44136": {
+      "key": "6678aa95638b9b3772a3e881c6acb0d5e473c9e2",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44124": {
+      "key": "87a62ffbf30a828774e7b696e72c3feb071ca648",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33414": {
+      "key": "e16a0c5480fdcde9b2ebb9f72b92a0f59b2418f0",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33390": {
+      "key": "e7acb45e5dd8d66fd4ea53cc1fc4c77ad3cbf96a",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33416": {
+      "key": "5a8952f3c8cb8cfb89a6149519a965c6be67fb3d",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33392": {
+      "key": "9f112d122c7c70dee89cb8821ecbe2a017d858aa",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33418": {
+      "key": "d728ba34aba9d015f55a51460729830e16e00a62",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33394": {
+      "key": "ccaf8aae44cdb33aa41818ecc065d848e83fcbcc",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33420": {
+      "key": "ee39b827e6cc913c0abb02412ffdb7b0117ff3c5",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33396": {
+      "key": "2495136b2faddd620f8355730446298bb81225f7",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44422": {
+      "key": "44ca7e42376ae5869c20c14611c34fa2a3a1ff78",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44410": {
+      "key": "54856949298f1c4dd6f9a472cbb9bbdc78a9e46f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44326": {
+      "key": "20f98fc3cbd1f54c6e0456881796e7f533bbc7e6",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44314": {
+      "key": "dd770e528fa4f86abe497e8590204516cc806640",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44230": {
+      "key": "ded6bd95fa5568c8e8daa89dcebef79472d0b23f",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44218": {
+      "key": "5467ddc60d6928dc6d310b12029c935ab49b5b03",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44134": {
+      "key": "ef566d37e99f0805a3f864e6a0a72afe5b227328",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44122": {
+      "key": "61fe07673e4c1ba6d7e6ae9130ba1baed8631be5",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33430": {
+      "key": "d74920374d63be3bc7f5005f7b268b79ebb2de22",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33406": {
+      "key": "d444eed68f6de12d3ad7f48cba2b0e8f507288f8",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33432": {
+      "key": "dbed58870bfa6917643eb5b6060f4e96d9d976ab",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33408": {
+      "key": "5bc76a396293f523d4e5346fb027c853b8c8a5a9",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33434": {
+      "key": "dbc0d49b218d37bc73853d984f694c4540d48b13",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33410": {
+      "key": "442cf6838ebc8913ad6755a02b5466ed9fb1a4c1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33436": {
+      "key": "22fb0c82fb7630479aa872b34f3db0eeacb3baa0",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33412": {
+      "key": "1b13176fcd94e8c0c8ab7fed6d3411cc85598ffc",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44430": {
+      "key": "2ac9bbc4289ee9fa4804a7a8997f1957d0e1cf50",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44418": {
+      "key": "8684711450cd7c61224e4b9d415e1c97a8f56e58",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44334": {
+      "key": "8437a5e1866cdafc9e52d2d50b1d9cb0f70fd1ca",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44322": {
+      "key": "4af821649000e842889f13d7994a01a24dc4c4f4",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44238": {
+      "key": "f8da7c5e03d9d87b62ef6efb2490406681f6c59c",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44226": {
+      "key": "66dbfb53bbc0eea700843ae5a2f9a6d7cbf53962",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44142": {
+      "key": "6ab170751e10db9409690b3846d38505b4153fee",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44130": {
+      "key": "8e4e4736e91edb3e210b0ab10678023bd953517a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33422": {
+      "key": "ba42cd0ed58ebbcdda063c1b108466276ca9bb38",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33398": {
+      "key": "d0faabaccbf0ca37a029825974ceff060e334bba",
+      "name": "Roundness=Default, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33424": {
+      "key": "927ac455ce9c29274aecff01b91babac1ffca6db",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33400": {
+      "key": "7e97f1fb891bfb4f55d16a780511f0e5f4571606",
+      "name": "Roundness=Default, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33426": {
+      "key": "99dbdbd518193af253adc9faa2e39bab6ac1e011",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33402": {
+      "key": "22570ac7fc6a1a2217e2841bdc1328c5664589ff",
+      "name": "Roundness=Default, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33428": {
+      "key": "df8dbbe2c7f3e05354480b6bf0d11080b62255c1",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:33404": {
+      "key": "4ba9fb92a48f46ac1eb8011e9c24c49c39d88881",
+      "name": "Roundness=Default, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44426": {
+      "key": "0af7ceaee8739da338c41b288ef8c8bea11dfb84",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44414": {
+      "key": "2fb531e78f50d5993a397e7883140bc7c40c0328",
+      "name": "Roundness=Round, Skin=Outlined, Size=Default, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44330": {
+      "key": "70bb67c22d4766b8147a66d16136fced7d068e85",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44318": {
+      "key": "baf5043bee7ca6a7eae3c3cc4f92c39848b51760",
+      "name": "Roundness=Round, Skin=Outlined, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44234": {
+      "key": "38503627bd5bb3f90fe67ca6ccc425cc51040d91",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44222": {
+      "key": "31df923b76d6b1a968dc0f1d8b3223843e711e01",
+      "name": "Roundness=Round, Skin=Outlined, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44138": {
+      "key": "7c1bebbd6e54fbf4d1062248e747df4ae310235a",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44126": {
+      "key": "3111d0d8a0eaad58c1a84b06e9545d4dc9c513e8",
+      "name": "Roundness=Round, Skin=Outlined, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20364": {
+      "key": "1dc03589e0284f399d3661913d78e0dd6c4cb5fe",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20367": {
+      "key": "76c7eff061ad4575558f22e17a830b53e718461b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21326": {
+      "key": "23b36ed8cb983bdee4d73b1db398d92b45f626ef",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21320": {
+      "key": "543e72c5baf32e1201b37e4fdeeb6f86b7498f11",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22334": {
+      "key": "65e22295b003a4344ba6b1991d6684152e645e12",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22328": {
+      "key": "2baa8dde492b1274554d0501ad105448310ee3ad",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23707": {
+      "key": "9ae153d2f7940184dc1aad8e8a45730f3902f35e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23701": {
+      "key": "e792fac410e6ff501c3813da90484160ebcd8b82",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44354": {
+      "key": "971da136094fdef5b25713dbab413273134f0f3a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44348": {
+      "key": "9ea46709928310d5038980dbe3b455d1050e7da1",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44258": {
+      "key": "b45e23c0a1418048a0d402e4d2c3a00ab7229b8b",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44252": {
+      "key": "4bf63e915c9253eb930479bb099d99328db10903",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44162": {
+      "key": "6bb249584cc5382ad495a24d364205d936d8b9e7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44156": {
+      "key": "d354f92f5a4e9645b654ad4114d642c53b296ced",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44066": {
+      "key": "881d3efdb2245cd010ccc16e37d69d59473a4776",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44060": {
+      "key": "6c0ea9076529a7345ae25acbf2a77883c36cef6d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20372": {
+      "key": "b56bf82d321f343f96effdc62873a7c24f4cd7c5",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20368": {
+      "key": "68ce5456a5893e143e5e9ad83469b6fc4466fb60",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21330": {
+      "key": "69eff4d3b0c819a9118096324a260897f185adbd",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21324": {
+      "key": "a097f7fa319cbb6b01c1cfa498cb09650917cd18",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22338": {
+      "key": "e4a913bbbdb6fefb219848c55db58550ed8979cd",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22332": {
+      "key": "c2657811203c6dfa2e2c0ef5bcea76714b5cb208",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23711": {
+      "key": "f215e78d43fbfaa99f0d78e33709ebf43648a970",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23705": {
+      "key": "76c5d8a9d175899dee400bac99e4b69e15263673",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44358": {
+      "key": "96b8279938e832ecbc2b4f8527b9b49c3677b2a0",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44352": {
+      "key": "23d25f42caba155ef7af93987ec16a700e8ce190",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44262": {
+      "key": "42bd24e3bd9b579bee97b67b2a6361fb69d880ed",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44256": {
+      "key": "090c3698c68e3d519bf54cfb04296a63fbe48334",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44166": {
+      "key": "bf5a3cddd922bdf7d2b0f30975ecfdcf3e9de8b6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44160": {
+      "key": "f72f8a7bc758805624c58fa952f12f71203d0b71",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44070": {
+      "key": "b0fea34c4d5fc6b741e656eac473681dfad99901",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44064": {
+      "key": "e5e2ad5e06a213c79e83ea86237ba88a0fa43743",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20359": {
+      "key": "fa3098eff4e1a0b40f54cc6275f990a23d9a0b1e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20365": {
+      "key": "dc7e3c19ff32b47abbadbf2a02b7667f4b29f724",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21328": {
+      "key": "9247f75d7bf6b1ad54c824e7bc9451208e589b1f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21322": {
+      "key": "ad953efcf637f6694a1f7af0af761a5365ca4219",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22336": {
+      "key": "ad2063f2aa258e8e823197aa3af0cc7b66c4a388",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22330": {
+      "key": "68e56396c2cebf859da05fc00d35985494bc8e02",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23709": {
+      "key": "ce99114bf27cb5b749a2d78b575a78370081d63d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23703": {
+      "key": "822fbb2e15465d53f128e0d39b54161e2c3e3a3d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44356": {
+      "key": "02ef9280ec69c71fd18eef3d57e807a46cd3510f",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44350": {
+      "key": "463b872bd7c77ae93076d9390816853005932767",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44260": {
+      "key": "13b2c92a63e8ad08b2f90baecdc88854e894b809",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44254": {
+      "key": "cde598c449df12c6ff5cebe4c0c7763e9daaa4af",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44164": {
+      "key": "c26c8828c7eb7fe70f51de5ae8658cf83afc41c6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44158": {
+      "key": "fc5d48531a4fd7c7d317d04553c9203766f5a689",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44068": {
+      "key": "afc38e91a1c34818d05816517c3c4eb32b5c8cda",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44062": {
+      "key": "96f3cfa350795ab868a288a3f748773ba782f48c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Left, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20377": {
+      "key": "3f69a7f34c70076b3f26ddda7da5e244ed1ef64d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20370": {
+      "key": "5486a319d02809349493d1817503bbdbc0072d89",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21314": {
+      "key": "a5a7f3244d54da202fadc3821547f128203502e5",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21308": {
+      "key": "a904ebcceeefb7b8d41a2fe6adda82037c5b1f70",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22322": {
+      "key": "eeaee57ba357ad75c876828c5a534f8b9255f2c2",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22316": {
+      "key": "023e7600667f83f0dc1c82f19d128203f52a1c5e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23695": {
+      "key": "fcef59736f3b8324db912fe226bab1869d8d15f2",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23689": {
+      "key": "3d50775c6fe8b7ee5417e1695e6631fd9d957ded",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44342": {
+      "key": "cd3d1b73deabc79cdb5e0fbc7dd38736da796cdb",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44336": {
+      "key": "6b2a25146974acde8f79e254bec713de8cc5380c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44246": {
+      "key": "57561744f892785d82957f405ad0c352661d022a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44240": {
+      "key": "0ac55c545fbf16fa77f58d3a7025191bc013fceb",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44150": {
+      "key": "dc7cdde40f87650a233a674e79095ff2c860361e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44144": {
+      "key": "8ee9ef6acb8e111956deafcf8b0a2e1343f87c4d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44054": {
+      "key": "ff5bcceffeddc8ae6c997ee9497acf2ae3a4b97a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44048": {
+      "key": "6e27d89c69fd6e9f4b18fcded4e3690884efb820",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20369": {
+      "key": "f008522e7e84ca1088acb2fe277b2e3ee614fa1d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20374": {
+      "key": "1023eb8e4c7ae8c42bdfe1dbcf39d43e689ae82f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21318": {
+      "key": "5e8eefae9f0c5e64d96bab0fc95f9284da1c2ca1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21312": {
+      "key": "67f615c1207625be41c003210d321141b8d38002",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22326": {
+      "key": "da858aa1c095d430851e02006f4db3c903bc49fa",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22320": {
+      "key": "cecafa525924c4e240608cf36bd70f9d7f0f4d8b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23699": {
+      "key": "2c366745fe8c546ec600c6be932431fbcfea0009",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23693": {
+      "key": "2e915e6372f2e3e7aa11973bf7625af0cdd8015a",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44346": {
+      "key": "97da153d000d211fc195ce4c2162b5f4148899ba",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44340": {
+      "key": "96a2edc57a17efb444715f3ea3f6a3696937d2c6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44250": {
+      "key": "dea721195db26d103888945faab66e5f25d1b127",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44244": {
+      "key": "2cb9979fe82bb905e666e47ee02d063b1b137436",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44154": {
+      "key": "e820974eeab49878eb4662defe8d76f76e27c91e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44148": {
+      "key": "d1a6cca1b445af905c100df32930a9eeccb58e8d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44058": {
+      "key": "6048afada97ca807cdaad59bd0f599ef2ea8b7c9",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44052": {
+      "key": "9ddc27ee7d61ea7f16970fd5828f9fe89a8063b9",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20371": {
+      "key": "4b9f2d62f1fab93fcef3a84cf44b34285a405af9",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20375": {
+      "key": "dc33b59816bc048d93c303c40c6df7a3fbde64cf",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21316": {
+      "key": "46c0ed01360ea94f63e66020516515035c49798e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21310": {
+      "key": "4327b656bade90c8bc1e23233898d5e9705552ef",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22324": {
+      "key": "e41639e81ec0e8df8845623b5a329e0b46373e5b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22318": {
+      "key": "b9552edf6e9f70a2ff5fd7b26e0d5fa7e8764a42",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23697": {
+      "key": "d058a970786383f00370f9a13a48c55406a2316e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23691": {
+      "key": "c83995e4431de713d537c04e950ef56ec6c2f633",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44344": {
+      "key": "c7dfb14cc533b7bd3f31e92d277f9ba8e0457bb6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44338": {
+      "key": "370014ec9a6bf90c58d28f0c7749e17f5af0cf35",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44248": {
+      "key": "5ebcfe1deee3d4701e873e87c09feabb16d317db",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44242": {
+      "key": "2c0d8c6cb3ebd577287923ee28c16465b40b9c17",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44152": {
+      "key": "92eea4ba019cd71ea99970d53aae1441c57ebd18",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44146": {
+      "key": "9be16b9987a0e14b2ccd805db5ab3d1e406411fc",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44056": {
+      "key": "52fba98893a84d5161f9ed909665e9c9f0bba87e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44050": {
+      "key": "5230d8a180d17f854dc63e0b00c8a65cbeb171d7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Middle, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20352": {
+      "key": "ef4bf3fcf1892bb9e1f76cfbd05af5cdbac15a5c",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20354": {
+      "key": "12c3c7d262e7ba9ff6c203531495874c5bfbe061",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21338": {
+      "key": "3ac12663babec0155bee1ce82f2243558091dc67",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21332": {
+      "key": "b03061d242f44e69daa09ad36e93ab7c652f45f6",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22346": {
+      "key": "abb5d60cfdbfec0d545f965ccd2c2b4daf1d8f1a",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22340": {
+      "key": "cba51ba9a07641c48dd9dde009c090775b783c89",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23719": {
+      "key": "65cb5d21d571b028185af87c923ffdf08cb8aafa",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23713": {
+      "key": "3ef06c02112d9653f2dc1625c8b9a662e8553f89",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44372": {
+      "key": "99a1484707a61f7b5d85329563074df5618fec14",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44360": {
+      "key": "a3736a461a85cff5e12b92577b317faa5f7fcfde",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44276": {
+      "key": "b5820330c86b6094886a12bd62262d022e11e628",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44264": {
+      "key": "fefb4cd852a7fc2afa887b9c896b631b3469659e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44180": {
+      "key": "0a8909451ecd9840ceac8452884dc0bb2f17d78c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44168": {
+      "key": "cdf65cfeb6309a64d447b8bb42e55193ed87224a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44084": {
+      "key": "4d0c3c89e5b581f53c36031d59edd969e4eb1e99",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44072": {
+      "key": "867307bfb9529b1ea1d2fd3283909e8f71e219b3",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20362": {
+      "key": "c807ea99772dc527caeb20423eea0644c5bca159",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20356": {
+      "key": "94a41691922cdfcd182a656a8817d1b2e9a69008",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21342": {
+      "key": "4ed07dfd5f32a0dce223effa956259dd524e2626",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21336": {
+      "key": "add177d133c8bf871d7d25636f261ec665d95039",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22350": {
+      "key": "e184b1b5b2891c3895872fe78d3453802c6f36d2",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22344": {
+      "key": "952b69e1c91e6e83358572dbaca6ff630215601d",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23723": {
+      "key": "85fe935ac50146766ece1ad675c13343a3348732",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23717": {
+      "key": "c38fc3d1da4e04d9535f2a12e682ce0081d07101",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44380": {
+      "key": "f54ee45cbee6b9e7bc722aa3be0a123429a0e35f",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44368": {
+      "key": "ac969cf97b2f0ec1d0f4682ce6e1926bbaf2b55c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44284": {
+      "key": "027ede9d1b4570fe957d99271a70a28db7f469ce",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44272": {
+      "key": "3f6e2b3bb7f610729c43f273dd0576206b54895d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44188": {
+      "key": "a135af2dd334e734fcb16e91b0282bfa8b5a368c",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44176": {
+      "key": "6c6692531a036f11a72a92145578b8e20811eb08",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44092": {
+      "key": "b853c55b7616a2e149128aa5ba879559a78bd589",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44080": {
+      "key": "9a3feef76cfb92f3f826b31b7473ae3d85287f98",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20355": {
+      "key": "aa0b35177715903c4ff2d86a2f8fe4e4152d94ff",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:20358": {
+      "key": "1dacf9e888dc379090ed519402dc74460794f94b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21340": {
+      "key": "906932f24023b7798ed7a60a9f25a0d986ec0615",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:21334": {
+      "key": "00105e30d22273655e2eb33f8ab4716f3db50868",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22348": {
+      "key": "64c29bcbda6e8b6485821165193c89020de5b053",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:22342": {
+      "key": "e02d119d97a9e51b2bd27c92626381c9fe8a3ba1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23721": {
+      "key": "eae92ca51ca977888ca30999c34e9da8c715e495",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "164:23715": {
+      "key": "b8dd0ff34f4f84395e9bc7a619715365af9ebc18",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44376": {
+      "key": "3c777ef088ef26b396aa0d0a91904a9fab2e74dc",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44364": {
+      "key": "146380b6ac350f3f9e4e2147424215c3e6f89a54",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44280": {
+      "key": "d1158659ee8c3dd5b42cf7067c3f7088fab61471",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44268": {
+      "key": "a52c5ee053087ee98b9c59d42075c6cadb9250f5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44184": {
+      "key": "5049d3329d56a757f288016754e7917774fa6cc5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44172": {
+      "key": "f8afe17a027971e42ba05a5194642cbd777405c4",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44088": {
+      "key": "2d3b4fb3a7e709346ed35f7560174c76fba4f01a",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44076": {
+      "key": "4c3c9c5f4747495b51cdfada36f30011b31febb9",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Right, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32742": {
+      "key": "2428582c35d16af9bfe8e688e10f6322780eb4d8",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32718": {
+      "key": "bb18c38a3f66ffcc60bea5bf578cfa2160435344",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32744": {
+      "key": "d8a0a92e9c7c56019ffc858382e089f774233a6f",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32720": {
+      "key": "1b18e66b002354dd4041cf2962e7a000bd98f1a1",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32746": {
+      "key": "0b61338821d7f2f582b7b749719b68ec98f02bec",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32722": {
+      "key": "692df7cc62de8f5c684b7b8be41e6d7563955326",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32748": {
+      "key": "c0b68af24506cb4b270783c82596aa8a262fe82c",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32724": {
+      "key": "3fe6d660ee5be4e346b39377df8da1b8691c07ad",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44374": {
+      "key": "15c7475d427ed25df9aeaf937747f93c51836238",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44362": {
+      "key": "9244774dbd560b36425d33f65e95478ea60e1d5d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44278": {
+      "key": "241b1e7854b867369656958f8e7bfcbb9c3a1019",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44266": {
+      "key": "fadbc46f99c180828e9eec5204817e17349d8520",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44182": {
+      "key": "cb75317015df876efdcdcea5483d53518228d81e",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44170": {
+      "key": "288499ec019bc8e540ab52d7d62c845a32a3eff5",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44086": {
+      "key": "3a93697a41aade6a701e5c004e2b36490d01df08",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44074": {
+      "key": "4d034986626f2fd2d46d7883972a69a5f5c5e26d",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Default",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32758": {
+      "key": "62f46240138674c508c83c334484a166d712e5a4",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32734": {
+      "key": "c683f2867cb870edfd823d22137270ada0734561",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32760": {
+      "key": "a9b2268759c211675369b36c38eb6ca1b51a11b2",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32736": {
+      "key": "18a1858e25538711e879d83b92557e68c95d6e50",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32762": {
+      "key": "f5105c62e201c7f4286ddc592309a51e9a2c8d01",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32738": {
+      "key": "553bb1765cc8312ce8d8373a03c30edbcc5f390b",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32764": {
+      "key": "dd47ac64d053233262c9a81eea39dbcb00fd0fd3",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32740": {
+      "key": "85ae484497ebfb1ad5723236162b9897c75c17ad",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44382": {
+      "key": "eff1ae535bc04d1812ce0e6d8ae262f66dfd4f17",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44370": {
+      "key": "5691a9841a0e5986c628c83d374965ed98233188",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44286": {
+      "key": "e768b44c48c953a3306edc31338e15e2319d9eca",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44274": {
+      "key": "eacc85650ccb9f1ff8d304382753db75beee5d53",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44190": {
+      "key": "b20c2d6fea1f479cd042b2b682badc737626f675",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44178": {
+      "key": "3ed7e066c71459b6f284b731c8c7c27f6be159d7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44094": {
+      "key": "4fcf177257bd710e2830a8380cbc138341c2f405",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44082": {
+      "key": "a95b563c8811231a2c4ecbc53edcdd19566ca344",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Disabled",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32750": {
+      "key": "c6e262fc6d7c20ccdc9d96a08016572e239e41a5",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32726": {
+      "key": "1edc14da0b9512c989e1326b9dc64ebb78871198",
+      "name": "Roundness=Default, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32752": {
+      "key": "64f3c2aeab701d048aceb10dda3950d2288e3973",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32728": {
+      "key": "08e18afffc5db0230f6d016429fad148855bf4fe",
+      "name": "Roundness=Default, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32754": {
+      "key": "9b389d19d4228eb2070c22f5c2cd6f6921ecfdbb",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32730": {
+      "key": "0ea07f2ec70121e82777e5a14c256dbaddc94d69",
+      "name": "Roundness=Default, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32756": {
+      "key": "55bbdc2f431d85c136968a0ac72a29f45902655e",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "189:32732": {
+      "key": "b8726dd659294881c4cdc542a00081a9f99cce28",
+      "name": "Roundness=Default, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44378": {
+      "key": "b2b9fdb720a64ae2983706c8c64e3c28081df922",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44366": {
+      "key": "7e63fcba228211f6c690ca3ae0f117883ee58466",
+      "name": "Roundness=Round, Skin=Ghost, Size=Default, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44282": {
+      "key": "f2cb58d6eefdd9a988dcb78c27f82d1fe7e2a9c6",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44270": {
+      "key": "6b34250ac526c5e1b64c5cabd67f11026bc355c7",
+      "name": "Roundness=Round, Skin=Ghost, Size=Large, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44186": {
+      "key": "64fcdc01fa58493930b385493664bf4b0ea1b9ca",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44174": {
+      "key": "f283c3c574faacdedc09dfb9fb79e70f0b9333a4",
+      "name": "Roundness=Round, Skin=Ghost, Size=Small, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44090": {
+      "key": "c8ecc86a6122003f5d4410cfde24851729ace1de",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=Yes, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "761:44078": {
+      "key": "f50e926e47d0c4e5e51bc3d13026f37b3d6e57e2",
+      "name": "Roundness=Round, Skin=Ghost, Size=Mini, Position=Single, Active?=No, State=Focus",
+      "description": "",
+      "remote": false,
+      "componentSetId": "164:20378",
+      "documentationLinks": []
+    },
+    "133:14785": {
+      "key": "9e0b5ecc69a34c2445395c3f3990ad4527dfb08c",
+      "name": "Side=Top",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:14788",
+      "documentationLinks": []
+    },
+    "133:14787": {
+      "key": "bee19845dc5da6ce8613af47acab01af5caee530",
+      "name": "Side=Bottom",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:14788",
+      "documentationLinks": []
+    },
+    "133:14786": {
+      "key": "a46ce9d0d8b710b6d0c15b54ba9fcba5c48bd2c6",
+      "name": "Side=Left",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:14788",
+      "documentationLinks": []
+    },
+    "133:14784": {
+      "key": "4cf74f1f0059879f994dd2d3a7c4a35da7f7a52c",
+      "name": "Side=Right",
+      "description": "",
+      "remote": false,
+      "componentSetId": "133:14788",
+      "documentationLinks": []
+    },
+    "680:60413": {
+      "key": "21b36ebedcc4bfbead3a0dd9020512ca1225f0ab",
+      "name": ".Form",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "658:35085": {
+      "key": "2441bf0e2ba43ca11c5a1fdf134d1d36425e839b",
+      "name": ".MobileCell",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "680:68282": {
+      "key": "c8a2b4c8da103f6a49c154bee2f832c4116e1066",
+      "name": ".MobileForm",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "658:34934": {
+      "key": "f4773f1e8156feda8b4aa902adec0e195f61182b",
+      "name": ".Row",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    },
+    "658:34787": {
+      "key": "bb581eb76bb357ac6da4a989c53bed5620dece26",
+      "name": ".Row",
+      "description": "",
+      "remote": false,
+      "documentationLinks": []
+    }
+  },
+  "component_sets": {
+    "9:1071": {
+      "key": "bce63fbd74024fe645b5511cec90cb5b1446d393",
+      "name": "Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "66:5034": {
+      "key": "c022afca047316355c6c8f8f072bcf27ae807b72",
+      "name": "Accordion Trigger",
+      "description": "",
+      "documentationLinks": []
+    },
+    "58:5416": {
+      "key": "9360c01084cec1d1f9d6e1cea81a9086f40c5e06",
+      "name": "Alert",
+      "description": "",
+      "documentationLinks": []
+    },
+    "139:11941": {
+      "key": "67f514b01ca7185895c37ac4cfc5f2f6c059d7b1",
+      "name": "Alert Dialog",
+      "description": "",
+      "documentationLinks": []
+    },
+    "18:1398": {
+      "key": "d3ae7dd8c38a45b161d12b3fc5b3da47be8eacdf",
+      "name": "Avatar",
+      "description": "",
+      "documentationLinks": []
+    },
+    "22:9509": {
+      "key": "ef5d2554e7622e0f3a8789b0f6225ff9839b41e1",
+      "name": "Avatar Stack",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6979": {
+      "key": "c39c0ca33155187ac861fa37c2cdf178b0fb5270",
+      "name": "Badge",
+      "description": "",
+      "documentationLinks": []
+    },
+    "9:775": {
+      "key": "cc34f9e3fbaaa78b7f958be7df795774e2fd830a",
+      "name": "Icon Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "784:82792": {
+      "key": "8d3c7cbdcfde8549e52bfa15735777c4943941a8",
+      "name": "Button Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "784:87178": {
+      "key": "ed4bab9146b303d5b16965a0aadb2931c1df23dd",
+      "name": "Button Group Icon Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "179:29234": {
+      "key": "0296f7b7fb9dd115e6e2b35f605e3043813a1c1e",
+      "name": "Card",
+      "description": "",
+      "documentationLinks": []
+    },
+    "120:13754": {
+      "key": "66ab348c30343cd7b20e399e00859aa26135139a",
+      "name": "Vertical Field",
+      "description": "",
+      "documentationLinks": []
+    },
+    "103:9453": {
+      "key": "c167b971890395c6d899cced59ef5f62b2f83f04",
+      "name": "Label",
+      "description": "",
+      "documentationLinks": []
+    },
+    "16:1738": {
+      "key": "735cd57150a03dcbec6a9a201b56f7fc5b0ddaec",
+      "name": "Input",
+      "description": "",
+      "documentationLinks": []
+    },
+    "18:1373": {
+      "key": "777cd46e93904f03a699b7dad2a35d91972ad3de",
+      "name": ".Select Left Decoration",
+      "description": "",
+      "documentationLinks": []
+    },
+    "16:1732": {
+      "key": "68b25012d80b641694f739976d70845bced844e2",
+      "name": "Select & Combobox",
+      "description": "",
+      "documentationLinks": []
+    },
+    "673:40340": {
+      "key": "1f7d763cf4c5b14cfcd3c35e17ae2c0f0ae44a56",
+      "name": ".Select & Combobox Right Decoration",
+      "description": "",
+      "documentationLinks": []
+    },
+    "16:1745": {
+      "key": "16768fe924982cb6de27bc08400f41045ebe737b",
+      "name": "Textarea",
+      "description": "",
+      "documentationLinks": []
+    },
+    "164:18293": {
+      "key": "ea99f6370f478f57b6e1b4e32d8b61865da7e6e6",
+      "name": "Carousel",
+      "description": "",
+      "documentationLinks": []
+    },
+    "164:18350": {
+      "key": "c20a64902cebcd8b1295ea6701b1c07a9fd90bae",
+      "name": "Carousel with Image",
+      "description": "",
+      "documentationLinks": []
+    },
+    "16:1790": {
+      "key": "3904c6a6aa9a210d69ec330cb5cd98998036230b",
+      "name": "Checkbox",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6040": {
+      "key": "4849a4c03af05fb6ef78044a94d454debb788637",
+      "name": "Checkbox Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6351": {
+      "key": "6772f09b688522783430552972985b047f2ee823",
+      "name": "Rich Checkbox Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "176:26202": {
+      "key": "9593c664a99fd0a7008340b784160e52ca24a2da",
+      "name": "Separator",
+      "description": "",
+      "documentationLinks": []
+    },
+    "80:10189": {
+      "key": "7449ad1610592b4a7750a07b4bad31f4e581337e",
+      "name": "Select Menu Group Label",
+      "description": "",
+      "documentationLinks": []
+    },
+    "66:5600": {
+      "key": "c479b92772bbdcfc5f63cdab0d071dad6ca58482",
+      "name": "Command Item",
+      "description": "",
+      "documentationLinks": []
+    },
+    "18:1010": {
+      "key": "955900d421e515560a843bebb863cd98a79105f2",
+      "name": "Menu Item",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6472": {
+      "key": "24bb4f120676e40af0602cc141151d733b549d0c",
+      "name": "Table Header",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6314": {
+      "key": "387db7e74fbc61b69f92bc8aee573d16bef089c4",
+      "name": "Table Cell",
+      "description": "",
+      "documentationLinks": []
+    },
+    "288:119954": {
+      "key": "f9e4781ff38fa0aae85a98e0f67f8a6b2985d5a0",
+      "name": "Date Picker",
+      "description": "",
+      "documentationLinks": []
+    },
+    "264:29273": {
+      "key": "adfd5e6d25341553bb2311f35e61a500d783ed9c",
+      "name": ".Date Picker / Header",
+      "description": "",
+      "documentationLinks": []
+    },
+    "781:40922": {
+      "key": "8a5cd39377300cdf6835539d318c8a2b455a219d",
+      "name": ".Date Picker / Day",
+      "description": "",
+      "documentationLinks": []
+    },
+    "60:9340": {
+      "key": "887aa5d6aa8d0631f8d96e80400e4f55511a661a",
+      "name": "Date Picker Input",
+      "description": "",
+      "documentationLinks": []
+    },
+    "176:27848": {
+      "key": "ccc89748c565bf4ca23b0a8f05f6198758c8d88a",
+      "name": "Menu",
+      "description": "Popup, Popover",
+      "documentationLinks": []
+    },
+    "151:12298": {
+      "key": "01b848541d6b4ebf9ecd20931d3eddde3929248e",
+      "name": "Dialog",
+      "description": "",
+      "documentationLinks": []
+    },
+    "176:22344": {
+      "key": "6bf3083b52e96fb2813a6fe9bb2959dcfc6402e8",
+      "name": "Dialog Header",
+      "description": "",
+      "documentationLinks": []
+    },
+    "176:21284": {
+      "key": "167ba429d9319f8402b0314a50e4dd8787a7d3e4",
+      "name": "Dialog Footer",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:5987": {
+      "key": "fc49fe3b53d424bcd44e927595df1790c2187a7d",
+      "name": "Rich Radio Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "16:1796": {
+      "key": "46fe4a965c5ced9e172c9bdb9e1b334a3a526511",
+      "name": "Radio",
+      "description": "",
+      "documentationLinks": []
+    },
+    "11:2014": {
+      "key": "6c6239cf0a5284b015a20bc8770685b8a18d7eb4",
+      "name": "Link Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "65:4902": {
+      "key": "61d590b63799ee3916d22acb6576fc765962b7d7",
+      "name": "Slider Horizontal",
+      "description": "",
+      "documentationLinks": []
+    },
+    "162:17957": {
+      "key": "dff579647f57881c8bb6b1534ccb0caf2531b80c",
+      "name": ".Marker",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6048": {
+      "key": "45f161a04b18ac01fa264c1b3e1f88f2ea54efe7",
+      "name": "Radio Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "120:13775": {
+      "key": "861f9052d0ff5946ac5907b71e8941443e42dbaa",
+      "name": "Horizontal Field",
+      "description": "",
+      "documentationLinks": []
+    },
+    "66:5981": {
+      "key": "3409b73da8a932b318ca023f011d553aee136a40",
+      "name": "Input File",
+      "description": "",
+      "documentationLinks": []
+    },
+    "140:11468": {
+      "key": "93ad1e3364cdf9e8077778f01642114146ac73b8",
+      "name": "Input OTP",
+      "description": "",
+      "documentationLinks": []
+    },
+    "11:1126": {
+      "key": "c9c074039937614b6c91ef2ad2185710e35cd8e0",
+      "name": "Loading Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "757:154511": {
+      "key": "d70d1fc9b5d08fb47e98bdc42ebacd334cb39a45",
+      "name": "Spinner",
+      "description": "",
+      "documentationLinks": []
+    },
+    "133:11358": {
+      "key": "ab78a858b4aa0b7efa053d22821197c1b17894cd",
+      "name": "Pagination",
+      "description": "",
+      "documentationLinks": []
+    },
+    "133:12195": {
+      "key": "afc7dc4cbd35ad38fa9b9655379e0ac39101555c",
+      "name": "Pagination Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "438:64981": {
+      "key": "83e38b66c2055fa085e2304f423b3dec2eadb372",
+      "name": "Progress",
+      "description": "",
+      "documentationLinks": []
+    },
+    "222:27733": {
+      "key": "ec2b49b5b739aab2b8c24a061098eadfeef57366",
+      "name": "Resizable",
+      "description": "",
+      "documentationLinks": []
+    },
+    "164:18669": {
+      "key": "11916565843269cb5f268815563ca0304594d2d2",
+      "name": "Scrollbar",
+      "description": "",
+      "documentationLinks": []
+    },
+    "164:18670": {
+      "key": "794032f5d52ded270a31dd4051fe02cdb9f79468",
+      "name": "Separator",
+      "description": "",
+      "remote": false
+    },
+    "28:6842": {
+      "key": "aa9c06da689feb20150c2ff3e9c68842f1adfc45",
+      "name": "Select Menu Overflow",
+      "description": "",
+      "documentationLinks": []
+    },
+    "301:243831": {
+      "key": "3641fca84815ebe8809459a2d60906d6e1babea3",
+      "name": "Sheet",
+      "description": "",
+      "documentationLinks": []
+    },
+    "28:5228": {
+      "key": "b17838ec0a31c7e86652273726730216e8debee9",
+      "name": "Sidebar Item / Collapsed",
+      "description": "",
+      "documentationLinks": []
+    },
+    "27:3414": {
+      "key": "8c27dea925603a1af74375ea04094de078501db1",
+      "name": "Sidebar Item / Expanded / 1st Level",
+      "description": "",
+      "documentationLinks": []
+    },
+    "176:24085": {
+      "key": "f71b2535d57b8a996004fd7aa9e7a82bd51e4105",
+      "name": ".Sidebar Mini Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "28:5147": {
+      "key": "efa2144c2c4901463227cf53fc123dab35dba299",
+      "name": "Sidebar Item / Expanded / 2nd Level",
+      "description": "",
+      "documentationLinks": []
+    },
+    "176:23790": {
+      "key": "813cd548a76aee995ae2a99e6120c11d0853e2f6",
+      "name": "Sidebar Group Label",
+      "description": "",
+      "documentationLinks": []
+    },
+    "162:17939": {
+      "key": "0375fe6c41a97d4732bc1d2d68f207bfbfd96b3c",
+      "name": "Slider Vertical",
+      "description": "",
+      "documentationLinks": []
+    },
+    "139:11361": {
+      "key": "9ecc4169bbd632d30939bada005cb0175c445e38",
+      "name": "Sonner",
+      "description": "",
+      "documentationLinks": []
+    },
+    "139:11366": {
+      "key": "78ffa9b1bce3d404a2c8f364108d6892cf373f05",
+      "name": "Sonner Content",
+      "description": "",
+      "documentationLinks": []
+    },
+    "16:1801": {
+      "key": "2bce038ac00a84957b2c4ff35655566ae2b5ffa7",
+      "name": "Switch",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6406": {
+      "key": "2c7b2cc950e8cc6003cbde9495480e9b18cc322a",
+      "name": "Switch Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "19:6374": {
+      "key": "24a88fc4b37f1131b7e4cbe1d15d47775469d486",
+      "name": "Rich Switch Group",
+      "description": "",
+      "documentationLinks": []
+    },
+    "164:18430": {
+      "key": "a6347bf6ba549f82bdf9aa85e74b2440f236253c",
+      "name": "Basic Table Header",
+      "description": "",
+      "documentationLinks": []
+    },
+    "288:172242": {
+      "key": "a210b50115154a8e9d83a790d739e7e05530b910",
+      "name": "Basic Table Cell",
+      "description": "",
+      "documentationLinks": []
+    },
+    "9:634": {
+      "key": "ad3590c8c8e7e9eda25fe4a310c14d8d8520e9b4",
+      "name": "Tab",
+      "description": "",
+      "documentationLinks": []
+    },
+    "9:639": {
+      "key": "044936adf20b4f86f4379067abb6d3add6a2b756",
+      "name": "Tabs",
+      "description": "",
+      "documentationLinks": []
+    },
+    "816:112827": {
+      "key": "519b0c1f0fd30452cc30020c91367cb6bcd880ea",
+      "name": "Toggle Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "164:20378": {
+      "key": "a3063d20b721e640ffdb14883cf08c3eea38be08",
+      "name": "Toggle Icon Button",
+      "description": "",
+      "documentationLinks": []
+    },
+    "133:14788": {
+      "key": "896c89416627193c50121e88d87bdb1576750180",
+      "name": "Tooltip",
+      "description": "",
+      "documentationLinks": []
+    }
+  },
+  "total_components": 3814,
+  "total_sets": 74
+}
\ No newline at end of file
diff --git a/.dss/data/_system/style-dictionary.config.json b/.dss/data/_system/style-dictionary.config.json
new file mode 100644
index 0000000..3252020
--- /dev/null
+++ b/.dss/data/_system/style-dictionary.config.json
@@ -0,0 +1,20 @@
+{
+  "source": ["tokens/tokens.json"],
+  "platforms": {
+    "css": {
+      "transformGroup": "css",
+      "buildPath": "themes/",
+      "files": [{"destination": "tokens.css", "format": "css/variables"}]
+    },
+    "scss": {
+      "transformGroup": "scss",
+      "buildPath": "themes/",
+      "files": [{"destination": "_tokens.scss", "format": "scss/variables"}]
+    },
+    "json": {
+      "transformGroup": "js",
+      "buildPath": "themes/",
+      "files": [{"destination": "tokens.json", "format": "json/flat"}]
+    }
+  }
+}
diff --git a/.dss/data/_system/styles.json b/.dss/data/_system/styles.json
new file mode 100644
index 0000000..d24599a
--- /dev/null
+++ b/.dss/data/_system/styles.json
@@ -0,0 +1,408 @@
+{
+  "all": [
+    {
+      "name": "heading 1",
+      "key": "6:83",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "heading 2",
+      "key": "6:84",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/regular",
+      "key": "7:129",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/bold",
+      "key": "22:7579",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "heading 3",
+      "key": "6:85",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph/bold",
+      "key": "22:7578",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph/regular",
+      "key": "6:87",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph mini/regular",
+      "key": "19:5809",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "heading 4",
+      "key": "6:86",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "monospaced",
+      "key": "199:32930",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph/medium",
+      "key": "869:27329",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/medium",
+      "key": "869:27330",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph mini/bold",
+      "key": "22:9520",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph mini/medium",
+      "key": "869:27331",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-sm",
+      "key": "9:772",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-lg",
+      "key": "14:1579",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-2xs",
+      "key": "16:1667",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-xs",
+      "key": "16:1668",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-md",
+      "key": "16:1669",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-xl",
+      "key": "16:1670",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-2xl",
+      "key": "16:1671",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "focus ring",
+      "key": "147:11610",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "focus ring error",
+      "key": "176:25107",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "focus ring sidebar",
+      "key": "653:49231",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/medium",
+      "key": "363:28805",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/regular",
+      "key": "363:28952",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph/bold",
+      "key": "862:71716",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph mini/bold",
+      "key": "862:71791",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph mini/regular",
+      "key": "862:73098",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-xs",
+      "key": "862:73052",
+      "type": "EFFECT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/bold",
+      "key": "862:73054",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "paragraph small/regular",
+      "key": "862:71752",
+      "type": "TEXT",
+      "properties": {}
+    },
+    {
+      "name": "shadow-sm",
+      "key": "862:71996",
+      "type": "EFFECT",
+      "properties": {}
+    }
+  ],
+  "by_type": {
+    "TEXT": [
+      {
+        "name": "heading 1",
+        "key": "6:83",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "heading 2",
+        "key": "6:84",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/regular",
+        "key": "7:129",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/bold",
+        "key": "22:7579",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "heading 3",
+        "key": "6:85",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph/bold",
+        "key": "22:7578",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph/regular",
+        "key": "6:87",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph mini/regular",
+        "key": "19:5809",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "heading 4",
+        "key": "6:86",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "monospaced",
+        "key": "199:32930",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph/medium",
+        "key": "869:27329",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/medium",
+        "key": "869:27330",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph mini/bold",
+        "key": "22:9520",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph mini/medium",
+        "key": "869:27331",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/medium",
+        "key": "363:28805",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/regular",
+        "key": "363:28952",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph/bold",
+        "key": "862:71716",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph mini/bold",
+        "key": "862:71791",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph mini/regular",
+        "key": "862:73098",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/bold",
+        "key": "862:73054",
+        "type": "TEXT",
+        "properties": {}
+      },
+      {
+        "name": "paragraph small/regular",
+        "key": "862:71752",
+        "type": "TEXT",
+        "properties": {}
+      }
+    ],
+    "FILL": [],
+    "EFFECT": [
+      {
+        "name": "shadow-sm",
+        "key": "9:772",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-lg",
+        "key": "14:1579",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-2xs",
+        "key": "16:1667",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-xs",
+        "key": "16:1668",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-md",
+        "key": "16:1669",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-xl",
+        "key": "16:1670",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-2xl",
+        "key": "16:1671",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "focus ring",
+        "key": "147:11610",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "focus ring error",
+        "key": "176:25107",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "focus ring sidebar",
+        "key": "653:49231",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-xs",
+        "key": "862:73052",
+        "type": "EFFECT",
+        "properties": {}
+      },
+      {
+        "name": "shadow-sm",
+        "key": "862:71996",
+        "type": "EFFECT",
+        "properties": {}
+      }
+    ],
+    "GRID": []
+  }
+}
\ No newline at end of file
diff --git a/.dss/data/_system/themes/_tokens.scss b/.dss/data/_system/themes/_tokens.scss
new file mode 100644
index 0000000..3ebbcf4
--- /dev/null
+++ b/.dss/data/_system/themes/_tokens.scss
@@ -0,0 +1,99 @@
+
+// Do not edit directly, this file was auto-generated.
+
+$color-background: #ffffff;
+$color-foreground: #09090b;
+$color-card: #ffffff;
+$color-card-foreground: #09090b;
+$color-popover: #ffffff;
+$color-popover-foreground: #09090b;
+$color-primary: #18181b; // zinc-900 - brand primary
+$color-primary-foreground: #fafafa; // zinc-50
+$color-secondary: #f4f4f5;
+$color-secondary-foreground: #18181b;
+$color-muted: #f4f4f5;
+$color-muted-foreground: #71717a;
+$color-accent: #f4f4f5;
+$color-accent-foreground: #18181b;
+$color-destructive: #ef4444;
+$color-destructive-foreground: #fafafa;
+$color-border: #e4e4e7;
+$color-input: #e4e4e7;
+$color-ring: #18181b; // matches primary
+$color-dark-background: #09090b;
+$color-dark-foreground: #fafafa;
+$color-dark-card: #09090b;
+$color-dark-card-foreground: #fafafa;
+$color-dark-popover: #09090b;
+$color-dark-popover-foreground: #fafafa;
+$color-dark-primary: #fafafa;
+$color-dark-primary-foreground: #18181b;
+$color-dark-secondary: #27272a;
+$color-dark-secondary-foreground: #fafafa;
+$color-dark-muted: #27272a;
+$color-dark-muted-foreground: #a1a1aa;
+$color-dark-accent: #27272a;
+$color-dark-accent-foreground: #fafafa;
+$color-dark-destructive: #7f1d1d;
+$color-dark-destructive-foreground: #fafafa;
+$color-dark-border: #27272a;
+$color-dark-input: #27272a;
+$color-dark-ring: #d4d4d8;
+$radius-sm: 0.125rem;
+$radius-md: 0.375rem;
+$radius-lg: 0.5rem; // default border radius for cards
+$radius-xl: 0.75rem;
+$radius-full: 9999px;
+$effect-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+$effect-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+$effect-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+$effect-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+$effect-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+$effect-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+$effect-focus-ring: 0 0 0 3px rgba(59, 130, 246, 0.5);
+$spacing-0: 0;
+$spacing-1: 0.25rem;
+$spacing-2: 0.5rem;
+$spacing-3: 0.75rem;
+$spacing-4: 1rem;
+$spacing-5: 1.25rem;
+$spacing-6: 1.5rem;
+$spacing-8: 2rem;
+$spacing-10: 2.5rem;
+$spacing-12: 3rem;
+$spacing-16: 4rem;
+$typography-heading-1-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-heading-1-font-weight: 700;
+$typography-heading-1-font-size: 3rem;
+$typography-heading-1-line-height: 1;
+$typography-heading-1-letter-spacing: -0.025em;
+$typography-heading-2-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-heading-2-font-weight: 600;
+$typography-heading-2-font-size: 1.875rem;
+$typography-heading-2-line-height: 1.2;
+$typography-heading-2-letter-spacing: -0.025em;
+$typography-heading-3-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-heading-3-font-weight: 600;
+$typography-heading-3-font-size: 1.5rem;
+$typography-heading-3-line-height: 1.3;
+$typography-heading-3-letter-spacing: -0.025em;
+$typography-heading-4-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-heading-4-font-weight: 600;
+$typography-heading-4-font-size: 1.25rem;
+$typography-heading-4-line-height: 1.4;
+$typography-heading-4-letter-spacing: 0;
+$typography-paragraph-regular-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-paragraph-regular-font-weight: 400;
+$typography-paragraph-regular-font-size: 1rem;
+$typography-paragraph-regular-line-height: 1.5;
+$typography-paragraph-regular-letter-spacing: 0;
+$typography-paragraph-bold-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-paragraph-bold-font-weight: 500;
+$typography-paragraph-bold-font-size: 1rem;
+$typography-paragraph-bold-line-height: 1.5;
+$typography-paragraph-bold-letter-spacing: 0;
+$typography-paragraph-small-regular-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+$typography-paragraph-small-regular-font-weight: 400;
+$typography-paragraph-small-regular-font-size: 0.875rem;
+$typography-paragraph-small-regular-line-height: 1.5;
+$typography-paragraph-small-regular-letter-spacing: 0;
diff --git a/.dss/data/_system/themes/tokens.css b/.dss/data/_system/themes/tokens.css
new file mode 100644
index 0000000..0a5cc2b
--- /dev/null
+++ b/.dss/data/_system/themes/tokens.css
@@ -0,0 +1,102 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --color-background: #ffffff;
+  --color-foreground: #09090b;
+  --color-card: #ffffff;
+  --color-card-foreground: #09090b;
+  --color-popover: #ffffff;
+  --color-popover-foreground: #09090b;
+  --color-primary: #18181b; /** zinc-900 - brand primary */
+  --color-primary-foreground: #fafafa; /** zinc-50 */
+  --color-secondary: #f4f4f5;
+  --color-secondary-foreground: #18181b;
+  --color-muted: #f4f4f5;
+  --color-muted-foreground: #71717a;
+  --color-accent: #f4f4f5;
+  --color-accent-foreground: #18181b;
+  --color-destructive: #ef4444;
+  --color-destructive-foreground: #fafafa;
+  --color-border: #e4e4e7;
+  --color-input: #e4e4e7;
+  --color-ring: #18181b; /** matches primary */
+  --color-dark-background: #09090b;
+  --color-dark-foreground: #fafafa;
+  --color-dark-card: #09090b;
+  --color-dark-card-foreground: #fafafa;
+  --color-dark-popover: #09090b;
+  --color-dark-popover-foreground: #fafafa;
+  --color-dark-primary: #fafafa;
+  --color-dark-primary-foreground: #18181b;
+  --color-dark-secondary: #27272a;
+  --color-dark-secondary-foreground: #fafafa;
+  --color-dark-muted: #27272a;
+  --color-dark-muted-foreground: #a1a1aa;
+  --color-dark-accent: #27272a;
+  --color-dark-accent-foreground: #fafafa;
+  --color-dark-destructive: #7f1d1d;
+  --color-dark-destructive-foreground: #fafafa;
+  --color-dark-border: #27272a;
+  --color-dark-input: #27272a;
+  --color-dark-ring: #d4d4d8;
+  --radius-sm: 0.125rem;
+  --radius-md: 0.375rem;
+  --radius-lg: 0.5rem; /** default border radius for cards */
+  --radius-xl: 0.75rem;
+  --radius-full: 9999px;
+  --effect-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  --effect-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+  --effect-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+  --effect-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  --effect-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+  --effect-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+  --effect-focus-ring: 0 0 0 3px rgba(59, 130, 246, 0.5);
+  --spacing-0: 0;
+  --spacing-1: 0.25rem;
+  --spacing-2: 0.5rem;
+  --spacing-3: 0.75rem;
+  --spacing-4: 1rem;
+  --spacing-5: 1.25rem;
+  --spacing-6: 1.5rem;
+  --spacing-8: 2rem;
+  --spacing-10: 2.5rem;
+  --spacing-12: 3rem;
+  --spacing-16: 4rem;
+  --typography-heading-1-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-heading-1-font-weight: 700;
+  --typography-heading-1-font-size: 3rem;
+  --typography-heading-1-line-height: 1;
+  --typography-heading-1-letter-spacing: -0.025em;
+  --typography-heading-2-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-heading-2-font-weight: 600;
+  --typography-heading-2-font-size: 1.875rem;
+  --typography-heading-2-line-height: 1.2;
+  --typography-heading-2-letter-spacing: -0.025em;
+  --typography-heading-3-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-heading-3-font-weight: 600;
+  --typography-heading-3-font-size: 1.5rem;
+  --typography-heading-3-line-height: 1.3;
+  --typography-heading-3-letter-spacing: -0.025em;
+  --typography-heading-4-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-heading-4-font-weight: 600;
+  --typography-heading-4-font-size: 1.25rem;
+  --typography-heading-4-line-height: 1.4;
+  --typography-heading-4-letter-spacing: 0;
+  --typography-paragraph-regular-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-paragraph-regular-font-weight: 400;
+  --typography-paragraph-regular-font-size: 1rem;
+  --typography-paragraph-regular-line-height: 1.5;
+  --typography-paragraph-regular-letter-spacing: 0;
+  --typography-paragraph-bold-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-paragraph-bold-font-weight: 500;
+  --typography-paragraph-bold-font-size: 1rem;
+  --typography-paragraph-bold-line-height: 1.5;
+  --typography-paragraph-bold-letter-spacing: 0;
+  --typography-paragraph-small-regular-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --typography-paragraph-small-regular-font-weight: 400;
+  --typography-paragraph-small-regular-font-size: 0.875rem;
+  --typography-paragraph-small-regular-line-height: 1.5;
+  --typography-paragraph-small-regular-letter-spacing: 0;
+}
diff --git a/.dss/data/_system/themes/tokens.json b/.dss/data/_system/themes/tokens.json
new file mode 100644
index 0000000..1aa56ce
--- /dev/null
+++ b/.dss/data/_system/themes/tokens.json
@@ -0,0 +1,98 @@
+{
+  "ColorBackground": "#ffffff",
+  "ColorForeground": "#09090b",
+  "ColorCard": "#ffffff",
+  "ColorCardForeground": "#09090b",
+  "ColorPopover": "#ffffff",
+  "ColorPopoverForeground": "#09090b",
+  "ColorPrimary": "#18181b",
+  "ColorPrimaryForeground": "#fafafa",
+  "ColorSecondary": "#f4f4f5",
+  "ColorSecondaryForeground": "#18181b",
+  "ColorMuted": "#f4f4f5",
+  "ColorMutedForeground": "#71717a",
+  "ColorAccent": "#f4f4f5",
+  "ColorAccentForeground": "#18181b",
+  "ColorDestructive": "#ef4444",
+  "ColorDestructiveForeground": "#fafafa",
+  "ColorBorder": "#e4e4e7",
+  "ColorInput": "#e4e4e7",
+  "ColorRing": "#18181b",
+  "ColorDarkBackground": "#09090b",
+  "ColorDarkForeground": "#fafafa",
+  "ColorDarkCard": "#09090b",
+  "ColorDarkCardForeground": "#fafafa",
+  "ColorDarkPopover": "#09090b",
+  "ColorDarkPopoverForeground": "#fafafa",
+  "ColorDarkPrimary": "#fafafa",
+  "ColorDarkPrimaryForeground": "#18181b",
+  "ColorDarkSecondary": "#27272a",
+  "ColorDarkSecondaryForeground": "#fafafa",
+  "ColorDarkMuted": "#27272a",
+  "ColorDarkMutedForeground": "#a1a1aa",
+  "ColorDarkAccent": "#27272a",
+  "ColorDarkAccentForeground": "#fafafa",
+  "ColorDarkDestructive": "#7f1d1d",
+  "ColorDarkDestructiveForeground": "#fafafa",
+  "ColorDarkBorder": "#27272a",
+  "ColorDarkInput": "#27272a",
+  "ColorDarkRing": "#d4d4d8",
+  "RadiusSm": "0.125rem",
+  "RadiusMd": "0.375rem",
+  "RadiusLg": "0.5rem",
+  "RadiusXl": "0.75rem",
+  "RadiusFull": "9999px",
+  "EffectShadowXs": "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+  "EffectShadowSm": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)",
+  "EffectShadowMd": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
+  "EffectShadowLg": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)",
+  "EffectShadowXl": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)",
+  "EffectShadow2xl": "0 25px 50px -12px rgba(0, 0, 0, 0.25)",
+  "EffectFocusRing": "0 0 0 3px rgba(59, 130, 246, 0.5)",
+  "Spacing0": "0",
+  "Spacing1": "0.25rem",
+  "Spacing2": "0.5rem",
+  "Spacing3": "0.75rem",
+  "Spacing4": "1rem",
+  "Spacing5": "1.25rem",
+  "Spacing6": "1.5rem",
+  "Spacing8": "2rem",
+  "Spacing10": "2.5rem",
+  "Spacing12": "3rem",
+  "Spacing16": "4rem",
+  "TypographyHeading1FontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyHeading1FontWeight": "700",
+  "TypographyHeading1FontSize": "3rem",
+  "TypographyHeading1LineHeight": "1",
+  "TypographyHeading1LetterSpacing": "-0.025em",
+  "TypographyHeading2FontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyHeading2FontWeight": "600",
+  "TypographyHeading2FontSize": "1.875rem",
+  "TypographyHeading2LineHeight": "1.2",
+  "TypographyHeading2LetterSpacing": "-0.025em",
+  "TypographyHeading3FontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyHeading3FontWeight": "600",
+  "TypographyHeading3FontSize": "1.5rem",
+  "TypographyHeading3LineHeight": "1.3",
+  "TypographyHeading3LetterSpacing": "-0.025em",
+  "TypographyHeading4FontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyHeading4FontWeight": "600",
+  "TypographyHeading4FontSize": "1.25rem",
+  "TypographyHeading4LineHeight": "1.4",
+  "TypographyHeading4LetterSpacing": "0",
+  "TypographyParagraphRegularFontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyParagraphRegularFontWeight": "400",
+  "TypographyParagraphRegularFontSize": "1rem",
+  "TypographyParagraphRegularLineHeight": "1.5",
+  "TypographyParagraphRegularLetterSpacing": "0",
+  "TypographyParagraphBoldFontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyParagraphBoldFontWeight": "500",
+  "TypographyParagraphBoldFontSize": "1rem",
+  "TypographyParagraphBoldLineHeight": "1.5",
+  "TypographyParagraphBoldLetterSpacing": "0",
+  "TypographyParagraphSmallRegularFontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+  "TypographyParagraphSmallRegularFontWeight": "400",
+  "TypographyParagraphSmallRegularFontSize": "0.875rem",
+  "TypographyParagraphSmallRegularLineHeight": "1.5",
+  "TypographyParagraphSmallRegularLetterSpacing": "0"
+}
diff --git a/.dss/data/_system/tokens/base.json b/.dss/data/_system/tokens/base.json
new file mode 100644
index 0000000..07d27c2
--- /dev/null
+++ b/.dss/data/_system/tokens/base.json
@@ -0,0 +1,9 @@
+{
+  "_meta": {
+    "version": "1.0.0",
+    "generated": null,
+    "source": "awaiting Figma sync",
+    "status": "empty"
+  },
+  "tokens": {}
+}
diff --git a/.dss/data/_system/tokens/resolved-meta.json b/.dss/data/_system/tokens/resolved-meta.json
new file mode 100644
index 0000000..d22fc25
--- /dev/null
+++ b/.dss/data/_system/tokens/resolved-meta.json
@@ -0,0 +1,11 @@
+{
+  "resolved_at": "2025-12-10T21:38:48.326466",
+  "skin": "shadcn",
+  "theme": "default",
+  "token_count": 68,
+  "layers": [
+    "core/primitives",
+    "skins/shadcn",
+    "themes/default"
+  ]
+}
\ No newline at end of file
diff --git a/.dss/data/_system/tokens/tokens.json b/.dss/data/_system/tokens/tokens.json
new file mode 100644
index 0000000..e938f95
--- /dev/null
+++ b/.dss/data/_system/tokens/tokens.json
@@ -0,0 +1,320 @@
+{
+  "color": {
+    "background": {
+      "value": "#ffffff"
+    },
+    "foreground": {
+      "value": "#09090b"
+    },
+    "card": {
+      "value": "#ffffff"
+    },
+    "card-foreground": {
+      "value": "#09090b"
+    },
+    "popover": {
+      "value": "#ffffff"
+    },
+    "popover-foreground": {
+      "value": "#09090b"
+    },
+    "primary": {
+      "value": "#18181b",
+      "comment": "zinc-900 - brand primary"
+    },
+    "primary-foreground": {
+      "value": "#fafafa",
+      "comment": "zinc-50"
+    },
+    "secondary": {
+      "value": "#f4f4f5"
+    },
+    "secondary-foreground": {
+      "value": "#18181b"
+    },
+    "muted": {
+      "value": "#f4f4f5"
+    },
+    "muted-foreground": {
+      "value": "#71717a"
+    },
+    "accent": {
+      "value": "#f4f4f5"
+    },
+    "accent-foreground": {
+      "value": "#18181b"
+    },
+    "destructive": {
+      "value": "#ef4444"
+    },
+    "destructive-foreground": {
+      "value": "#fafafa"
+    },
+    "border": {
+      "value": "#e4e4e7"
+    },
+    "input": {
+      "value": "#e4e4e7"
+    },
+    "ring": {
+      "value": "#18181b",
+      "comment": "matches primary"
+    }
+  },
+  "color-dark": {
+    "background": {
+      "value": "#09090b"
+    },
+    "foreground": {
+      "value": "#fafafa"
+    },
+    "card": {
+      "value": "#09090b"
+    },
+    "card-foreground": {
+      "value": "#fafafa"
+    },
+    "popover": {
+      "value": "#09090b"
+    },
+    "popover-foreground": {
+      "value": "#fafafa"
+    },
+    "primary": {
+      "value": "#fafafa"
+    },
+    "primary-foreground": {
+      "value": "#18181b"
+    },
+    "secondary": {
+      "value": "#27272a"
+    },
+    "secondary-foreground": {
+      "value": "#fafafa"
+    },
+    "muted": {
+      "value": "#27272a"
+    },
+    "muted-foreground": {
+      "value": "#a1a1aa"
+    },
+    "accent": {
+      "value": "#27272a"
+    },
+    "accent-foreground": {
+      "value": "#fafafa"
+    },
+    "destructive": {
+      "value": "#7f1d1d"
+    },
+    "destructive-foreground": {
+      "value": "#fafafa"
+    },
+    "border": {
+      "value": "#27272a"
+    },
+    "input": {
+      "value": "#27272a"
+    },
+    "ring": {
+      "value": "#d4d4d8"
+    }
+  },
+  "radius": {
+    "sm": {
+      "value": "0.125rem"
+    },
+    "md": {
+      "value": "0.375rem"
+    },
+    "lg": {
+      "value": "0.5rem",
+      "comment": "default border radius for cards"
+    },
+    "xl": {
+      "value": "0.75rem"
+    },
+    "full": {
+      "value": "9999px"
+    }
+  },
+  "effect": {
+    "shadow-xs": {
+      "value": "0 1px 2px 0 rgba(0, 0, 0, 0.05)"
+    },
+    "shadow-sm": {
+      "value": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)"
+    },
+    "shadow-md": {
+      "value": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)"
+    },
+    "shadow-lg": {
+      "value": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)"
+    },
+    "shadow-xl": {
+      "value": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)"
+    },
+    "shadow-2xl": {
+      "value": "0 25px 50px -12px rgba(0, 0, 0, 0.25)"
+    },
+    "focus-ring": {
+      "value": "0 0 0 3px rgba(59, 130, 246, 0.5)"
+    }
+  },
+  "spacing": {
+    "0": {
+      "value": "0"
+    },
+    "1": {
+      "value": "0.25rem"
+    },
+    "2": {
+      "value": "0.5rem"
+    },
+    "3": {
+      "value": "0.75rem"
+    },
+    "4": {
+      "value": "1rem"
+    },
+    "5": {
+      "value": "1.25rem"
+    },
+    "6": {
+      "value": "1.5rem"
+    },
+    "8": {
+      "value": "2rem"
+    },
+    "10": {
+      "value": "2.5rem"
+    },
+    "12": {
+      "value": "3rem"
+    },
+    "16": {
+      "value": "4rem"
+    }
+  },
+  "typography": {
+    "heading-1": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "700"
+      },
+      "font-size": {
+        "value": "3rem"
+      },
+      "line-height": {
+        "value": "1"
+      },
+      "letter-spacing": {
+        "value": "-0.025em"
+      }
+    },
+    "heading-2": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "600"
+      },
+      "font-size": {
+        "value": "1.875rem"
+      },
+      "line-height": {
+        "value": "1.2"
+      },
+      "letter-spacing": {
+        "value": "-0.025em"
+      }
+    },
+    "heading-3": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "600"
+      },
+      "font-size": {
+        "value": "1.5rem"
+      },
+      "line-height": {
+        "value": "1.3"
+      },
+      "letter-spacing": {
+        "value": "-0.025em"
+      }
+    },
+    "heading-4": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "600"
+      },
+      "font-size": {
+        "value": "1.25rem"
+      },
+      "line-height": {
+        "value": "1.4"
+      },
+      "letter-spacing": {
+        "value": "0"
+      }
+    },
+    "paragraph-regular": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "400"
+      },
+      "font-size": {
+        "value": "1rem"
+      },
+      "line-height": {
+        "value": "1.5"
+      },
+      "letter-spacing": {
+        "value": "0"
+      }
+    },
+    "paragraph-bold": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "500"
+      },
+      "font-size": {
+        "value": "1rem"
+      },
+      "line-height": {
+        "value": "1.5"
+      },
+      "letter-spacing": {
+        "value": "0"
+      }
+    },
+    "paragraph-small-regular": {
+      "font-family": {
+        "value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      "font-weight": {
+        "value": "400"
+      },
+      "font-size": {
+        "value": "0.875rem"
+      },
+      "line-height": {
+        "value": "1.5"
+      },
+      "letter-spacing": {
+        "value": "0"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/.dss/schema/skin-contract.json b/.dss/schema/skin-contract.json
new file mode 100644
index 0000000..4e37308
--- /dev/null
+++ b/.dss/schema/skin-contract.json
@@ -0,0 +1,87 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "DSS Skin Contract",
+  "description": "Defines required tokens that all skins must provide. Themes should only override these stable tokens.",
+  "version": "1.0.0",
+  "required_tokens": {
+    "color": {
+      "description": "Semantic color tokens",
+      "required": [
+        "primary",
+        "primary-foreground",
+        "secondary",
+        "secondary-foreground",
+        "background",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "accent",
+        "accent-foreground",
+        "destructive",
+        "destructive-foreground",
+        "border",
+        "input",
+        "ring",
+        "card",
+        "card-foreground",
+        "popover",
+        "popover-foreground"
+      ]
+    },
+    "effect": {
+      "description": "Shadow and focus effect tokens",
+      "required": [
+        "shadow-xs",
+        "shadow-sm",
+        "shadow-md",
+        "shadow-lg",
+        "shadow-xl",
+        "shadow-2xl",
+        "focus-ring"
+      ]
+    },
+    "radius": {
+      "description": "Border radius tokens",
+      "required": [
+        "sm",
+        "md",
+        "lg",
+        "xl",
+        "full"
+      ]
+    },
+    "typography": {
+      "description": "Typography style tokens",
+      "required": [
+        "heading-1",
+        "heading-2",
+        "heading-3",
+        "heading-4",
+        "paragraph-regular",
+        "paragraph-bold",
+        "paragraph-small-regular"
+      ]
+    },
+    "spacing": {
+      "description": "Spacing scale tokens",
+      "required": [
+        "0",
+        "1",
+        "2",
+        "3",
+        "4",
+        "5",
+        "6",
+        "8",
+        "10",
+        "12",
+        "16"
+      ]
+    }
+  },
+  "optional_categories": [
+    "animation",
+    "breakpoint",
+    "z-index"
+  ]
+}
diff --git a/.dss/skins/figma-source/tokens.json b/.dss/skins/figma-source/tokens.json
new file mode 100644
index 0000000..48d45f3
--- /dev/null
+++ b/.dss/skins/figma-source/tokens.json
@@ -0,0 +1,306 @@
+{
+  "_meta": {
+    "name": "figma-source",
+    "description": "Tokens extracted from Figma: Obra shadcn/ui (uikit)",
+    "version": "1.0.0",
+    "layer": "skin",
+    "source": "figma:evCZlaeZrP7X20NIViSJbl",
+    "generated": "2025-12-10T20:49:27.631185"
+  },
+  "typography": {
+    "heading-1": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 600
+      },
+      "font-size": {
+        "value": "48px"
+      },
+      "line-height": {
+        "value": "48px"
+      },
+      "letter-spacing": {
+        "value": "-1.5px"
+      },
+      "_contract": true
+    },
+    "heading-2": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 600
+      },
+      "font-size": {
+        "value": "30px"
+      },
+      "line-height": {
+        "value": "30px"
+      },
+      "letter-spacing": {
+        "value": "-1.0px"
+      },
+      "_contract": true
+    },
+    "paragraph-small-regular": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 400
+      },
+      "font-size": {
+        "value": "14px"
+      },
+      "line-height": {
+        "value": "21px"
+      },
+      "letter-spacing": {
+        "value": "0.07px"
+      },
+      "_contract": true
+    },
+    "paragraph-small-bold": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 500
+      },
+      "font-size": {
+        "value": "14px"
+      },
+      "line-height": {
+        "value": "21px"
+      },
+      "letter-spacing": {
+        "value": "0.07px"
+      },
+      "_contract": false
+    },
+    "heading-3": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 600
+      },
+      "font-size": {
+        "value": "24px"
+      },
+      "line-height": {
+        "value": "29px"
+      },
+      "letter-spacing": {
+        "value": "-1.0px"
+      },
+      "_contract": true
+    },
+    "paragraph-bold": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 500
+      },
+      "font-size": {
+        "value": "16px"
+      },
+      "line-height": {
+        "value": "24px"
+      },
+      "letter-spacing": {
+        "value": "0.0px"
+      },
+      "_contract": true
+    },
+    "paragraph-regular": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 400
+      },
+      "font-size": {
+        "value": "16px"
+      },
+      "line-height": {
+        "value": "24px"
+      },
+      "letter-spacing": {
+        "value": "0.0px"
+      },
+      "_contract": true
+    },
+    "paragraph-mini-regular": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 400
+      },
+      "font-size": {
+        "value": "12px"
+      },
+      "line-height": {
+        "value": "16px"
+      },
+      "letter-spacing": {
+        "value": "0.18px"
+      },
+      "_contract": false
+    },
+    "heading-4": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 600
+      },
+      "font-size": {
+        "value": "20px"
+      },
+      "line-height": {
+        "value": "24px"
+      },
+      "letter-spacing": {
+        "value": "0.0px"
+      },
+      "_contract": true
+    },
+    "monospaced": {
+      "font-family": {
+        "value": "Menlo"
+      },
+      "font-weight": {
+        "value": 400
+      },
+      "font-size": {
+        "value": "16px"
+      },
+      "line-height": {
+        "value": "24px"
+      },
+      "letter-spacing": {
+        "value": "0.0px"
+      },
+      "_contract": false
+    },
+    "paragraph-medium": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 500
+      },
+      "font-size": {
+        "value": "16px"
+      },
+      "line-height": {
+        "value": "24px"
+      },
+      "letter-spacing": {
+        "value": "0.0px"
+      },
+      "_contract": false
+    },
+    "paragraph-small-medium": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 500
+      },
+      "font-size": {
+        "value": "14px"
+      },
+      "line-height": {
+        "value": "21px"
+      },
+      "letter-spacing": {
+        "value": "0.07px"
+      },
+      "_contract": false
+    },
+    "paragraph-mini-bold": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 500
+      },
+      "font-size": {
+        "value": "12px"
+      },
+      "line-height": {
+        "value": "16px"
+      },
+      "letter-spacing": {
+        "value": "0.18px"
+      },
+      "_contract": false
+    },
+    "paragraph-mini-medium": {
+      "font-family": {
+        "value": "Inter"
+      },
+      "font-weight": {
+        "value": 500
+      },
+      "font-size": {
+        "value": "12px"
+      },
+      "line-height": {
+        "value": "16px"
+      },
+      "letter-spacing": {
+        "value": "0.18px"
+      },
+      "_contract": false
+    }
+  },
+  "effect": {
+    "shadow-sm": {
+      "value": "0.0px 1.0px 2.0px -1.0px rgba(0, 0, 0, 0.1), 0.0px 1.0px 3.0px 0px rgba(0, 0, 0, 0.1)",
+      "_contract": true
+    },
+    "shadow-lg": {
+      "value": "0.0px 4.0px 6.0px -4.0px rgba(0, 0, 0, 0.1), 0.0px 10.0px 15.0px -3.0px rgba(0, 0, 0, 0.1)",
+      "_contract": true
+    },
+    "shadow-2xs": {
+      "value": "0.0px 1.0px 0.0px 0px rgba(0, 0, 0, 0.05)",
+      "_contract": false
+    },
+    "shadow-xs": {
+      "value": "0.0px 1.0px 2.0px 0px rgba(0, 0, 0, 0.05)",
+      "_contract": true
+    },
+    "shadow-md": {
+      "value": "0.0px 2.0px 4.0px -2.0px rgba(0, 0, 0, 0.1), 0.0px 4.0px 6.0px -1.0px rgba(0, 0, 0, 0.1)",
+      "_contract": true
+    },
+    "shadow-xl": {
+      "value": "0.0px 8.0px 10.0px -6.0px rgba(0, 0, 0, 0.1), 0.0px 20.0px 25.0px -5.0px rgba(0, 0, 0, 0.1)",
+      "_contract": true
+    },
+    "shadow-2xl": {
+      "value": "0.0px 25.0px 50.0px 12.0px rgba(0, 0, 0, 0.25)",
+      "_contract": true
+    },
+    "focus-ring": {
+      "value": "0.0px 0.0px 0.0px 3.0px rgb(203, 213, 225)",
+      "_contract": true
+    },
+    "focus-ring-error": {
+      "value": "0.0px 0.0px 0.0px 3.0px rgb(252, 165, 165)",
+      "_contract": false
+    },
+    "focus-ring-sidebar": {
+      "value": "0.0px 0.0px 0.0px 3.0px rgb(203, 213, 225)",
+      "_contract": false
+    }
+  }
+}
\ No newline at end of file
diff --git a/.dss/skins/shadcn/tokens.json b/.dss/skins/shadcn/tokens.json
new file mode 100644
index 0000000..8096d4b
--- /dev/null
+++ b/.dss/skins/shadcn/tokens.json
@@ -0,0 +1,132 @@
+{
+  "_meta": {
+    "name": "shadcn",
+    "description": "shadcn/ui skin - maps primitives to semantic tokens",
+    "version": "1.0.0",
+    "layer": "skin",
+    "extends": "core/primitives",
+    "source": "https://ui.shadcn.com"
+  },
+  "color": {
+    "background": { "value": "{color.white}" },
+    "foreground": { "value": "{color.zinc.950}" },
+    "card": { "value": "{color.white}" },
+    "card-foreground": { "value": "{color.zinc.950}" },
+    "popover": { "value": "{color.white}" },
+    "popover-foreground": { "value": "{color.zinc.950}" },
+    "primary": { "value": "{color.zinc.900}" },
+    "primary-foreground": { "value": "{color.zinc.50}" },
+    "secondary": { "value": "{color.zinc.100}" },
+    "secondary-foreground": { "value": "{color.zinc.900}" },
+    "muted": { "value": "{color.zinc.100}" },
+    "muted-foreground": { "value": "{color.zinc.500}" },
+    "accent": { "value": "{color.zinc.100}" },
+    "accent-foreground": { "value": "{color.zinc.900}" },
+    "destructive": { "value": "{color.red.500}" },
+    "destructive-foreground": { "value": "{color.zinc.50}" },
+    "border": { "value": "{color.zinc.200}" },
+    "input": { "value": "{color.zinc.200}" },
+    "ring": { "value": "{color.zinc.950}" }
+  },
+  "color-dark": {
+    "background": { "value": "{color.zinc.950}" },
+    "foreground": { "value": "{color.zinc.50}" },
+    "card": { "value": "{color.zinc.950}" },
+    "card-foreground": { "value": "{color.zinc.50}" },
+    "popover": { "value": "{color.zinc.950}" },
+    "popover-foreground": { "value": "{color.zinc.50}" },
+    "primary": { "value": "{color.zinc.50}" },
+    "primary-foreground": { "value": "{color.zinc.900}" },
+    "secondary": { "value": "{color.zinc.800}" },
+    "secondary-foreground": { "value": "{color.zinc.50}" },
+    "muted": { "value": "{color.zinc.800}" },
+    "muted-foreground": { "value": "{color.zinc.400}" },
+    "accent": { "value": "{color.zinc.800}" },
+    "accent-foreground": { "value": "{color.zinc.50}" },
+    "destructive": { "value": "{color.red.900}" },
+    "destructive-foreground": { "value": "{color.zinc.50}" },
+    "border": { "value": "{color.zinc.800}" },
+    "input": { "value": "{color.zinc.800}" },
+    "ring": { "value": "{color.zinc.300}" }
+  },
+  "radius": {
+    "sm": { "value": "{radius.sm}" },
+    "md": { "value": "{radius.md}" },
+    "lg": { "value": "{radius.lg}" },
+    "xl": { "value": "{radius.xl}" },
+    "full": { "value": "{radius.full}" }
+  },
+  "effect": {
+    "shadow-xs": { "value": "0 1px 2px 0 rgba(0, 0, 0, 0.05)" },
+    "shadow-sm": { "value": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)" },
+    "shadow-md": { "value": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)" },
+    "shadow-lg": { "value": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)" },
+    "shadow-xl": { "value": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)" },
+    "shadow-2xl": { "value": "0 25px 50px -12px rgba(0, 0, 0, 0.25)" },
+    "focus-ring": { "value": "0 0 0 3px rgba(59, 130, 246, 0.5)" }
+  },
+  "spacing": {
+    "0": { "value": "{spacing.0}" },
+    "1": { "value": "{spacing.1}" },
+    "2": { "value": "{spacing.2}" },
+    "3": { "value": "{spacing.3}" },
+    "4": { "value": "{spacing.4}" },
+    "5": { "value": "{spacing.5}" },
+    "6": { "value": "{spacing.6}" },
+    "8": { "value": "{spacing.8}" },
+    "10": { "value": "{spacing.10}" },
+    "12": { "value": "{spacing.12}" },
+    "16": { "value": "{spacing.16}" }
+  },
+  "typography": {
+    "heading-1": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.bold}" },
+      "font-size": { "value": "{font.size.5xl}" },
+      "line-height": { "value": "1" },
+      "letter-spacing": { "value": "-0.025em" }
+    },
+    "heading-2": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.semibold}" },
+      "font-size": { "value": "{font.size.3xl}" },
+      "line-height": { "value": "1.2" },
+      "letter-spacing": { "value": "-0.025em" }
+    },
+    "heading-3": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.semibold}" },
+      "font-size": { "value": "{font.size.2xl}" },
+      "line-height": { "value": "1.3" },
+      "letter-spacing": { "value": "-0.025em" }
+    },
+    "heading-4": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.semibold}" },
+      "font-size": { "value": "{font.size.xl}" },
+      "line-height": { "value": "1.4" },
+      "letter-spacing": { "value": "0" }
+    },
+    "paragraph-regular": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.normal}" },
+      "font-size": { "value": "{font.size.base}" },
+      "line-height": { "value": "1.5" },
+      "letter-spacing": { "value": "0" }
+    },
+    "paragraph-bold": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.medium}" },
+      "font-size": { "value": "{font.size.base}" },
+      "line-height": { "value": "1.5" },
+      "letter-spacing": { "value": "0" }
+    },
+    "paragraph-small-regular": {
+      "font-family": { "value": "{font.family.sans}" },
+      "font-weight": { "value": "{font.weight.normal}" },
+      "font-size": { "value": "{font.size.sm}" },
+      "line-height": { "value": "1.5" },
+      "letter-spacing": { "value": "0" }
+    }
+  }
+}
diff --git a/.dss/themes/default.json b/.dss/themes/default.json
new file mode 100644
index 0000000..d388f67
--- /dev/null
+++ b/.dss/themes/default.json
@@ -0,0 +1,18 @@
+{
+  "_meta": {
+    "name": "default",
+    "description": "Default theme - brand overrides on top of shadcn skin",
+    "version": "1.0.0",
+    "layer": "theme",
+    "extends": "skins/shadcn",
+    "contract_version": "1.0.0"
+  },
+  "color": {
+    "primary": { "value": "#18181b", "comment": "zinc-900 - brand primary" },
+    "primary-foreground": { "value": "#fafafa", "comment": "zinc-50" },
+    "ring": { "value": "#18181b", "comment": "matches primary" }
+  },
+  "radius": {
+    "lg": { "value": "0.5rem", "comment": "default border radius for cards" }
+  }
+}
diff --git a/.githooks/pre-commit b/.githooks/pre-commit
index ecca3d7..5d8a711 100755
--- a/.githooks/pre-commit
+++ b/.githooks/pre-commit
@@ -4,12 +4,22 @@
 
 echo "🛡️  DSS Immutability Check..."
 
-# List of protected files (core principles only)
+# List of protected files (core principles and config)
 PROTECTED_FILES=(
   ".knowledge/dss-principles.json"
   ".knowledge/dss-architecture.json"
   ".clauderc"
   "PROJECT_CONFIG.md"
+  ".dss/config/figma.json"
+)
+
+# DSS Core Structure - ONLY modifiable by Figma sync
+# These paths require ALLOW_FIGMA_SYNC=true to modify
+DSS_CORE_PATHS=(
+  ".dss/data/_system/"
+  ".dss/schema/"
+  "dss-claude-plugin/core/skins/"
+  "dss/core_tokens/"
 )
 
 # Check if any protected files are being modified
@@ -43,6 +53,76 @@ if [ ${#MODIFIED_PROTECTED[@]} -gt 0 ]; then
   echo "✅ ALLOW_CORE_CHANGES=true detected. Proceeding with commit."
 fi
 
+# Check DSS Core paths (Figma sync only)
+MODIFIED_DSS_CORE=()
+for path in "${DSS_CORE_PATHS[@]}"; do
+  if git diff --cached --name-only | grep -q "^${path}"; then
+    while IFS= read -r file; do
+      MODIFIED_DSS_CORE+=("$file")
+    done < <(git diff --cached --name-only | grep "^${path}")
+  fi
+done
+
+if [ ${#MODIFIED_DSS_CORE[@]} -gt 0 ]; then
+  echo ""
+  echo "🔒 DSS CORE STRUCTURE PROTECTION"
+  echo "   The following paths can ONLY be modified via Figma sync:"
+  for file in "${MODIFIED_DSS_CORE[@]}"; do
+    echo "   - $file"
+  done
+  echo ""
+  echo "   Source of truth: Figma → DSS Pipeline → These files"
+  echo ""
+  echo "   To proceed (Figma sync only): ALLOW_FIGMA_SYNC=true"
+  echo ""
+
+  if [ "$ALLOW_FIGMA_SYNC" != "true" ]; then
+    echo "❌ Commit blocked. DSS core structure is Figma-sync only."
+    exit 1
+  fi
+
+  echo "✅ ALLOW_FIGMA_SYNC=true detected. Proceeding with Figma sync commit."
+
+  # Verify hash manifest is also being updated
+  if ! git diff --cached --name-only | grep -q "^.dss/core-hashes.sha256$"; then
+    echo ""
+    echo "⚠️  WARNING: core-hashes.sha256 not updated!"
+    echo "   Figma sync should regenerate: .dss/core-hashes.sha256"
+    echo "   Run: scripts/regenerate-core-hashes.sh"
+  fi
+fi
+
+# Hash verification for DSS core files
+HASH_FILE=".dss/core-hashes.sha256"
+if [ -f "$HASH_FILE" ] && [ ${#MODIFIED_DSS_CORE[@]} -gt 0 ]; then
+  echo ""
+  echo "🔐 Verifying DSS core file hashes..."
+  HASH_FAILURES=()
+
+  for file in "${MODIFIED_DSS_CORE[@]}"; do
+    if grep -q "  ${file}$" "$HASH_FILE" 2>/dev/null; then
+      EXPECTED=$(grep "  ${file}$" "$HASH_FILE" | cut -d' ' -f1)
+      # Get hash from staged version
+      ACTUAL=$(git show ":${file}" 2>/dev/null | sha256sum | cut -d' ' -f1)
+      if [ "$EXPECTED" != "$ACTUAL" ] && [ "$ALLOW_FIGMA_SYNC" != "true" ]; then
+        HASH_FAILURES+=("$file")
+      fi
+    fi
+  done
+
+  if [ ${#HASH_FAILURES[@]} -gt 0 ]; then
+    echo "❌ Hash verification failed for:"
+    for file in "${HASH_FAILURES[@]}"; do
+      echo "   - $file"
+    done
+    echo ""
+    echo "   These files have been modified outside Figma sync pipeline."
+    echo "   Revert changes or run Figma sync to update properly."
+    exit 1
+  fi
+  echo "✅ Hash verification passed."
+fi
+
 echo "✅ Immutability check passed."
 echo ""
 
@@ -59,6 +139,24 @@ else
   echo "⚠️  Warning: scripts/verify-quality.sh not found, skipping quality checks"
 fi
 
+# Run Python validation hook (documentation, schemas, terminology)
+echo ""
+echo "📚 Running Documentation & Schema Checks..."
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+if [ -f "${SCRIPT_DIR}/pre-commit-python" ]; then
+  if ! python3 "${SCRIPT_DIR}/pre-commit-python"; then
+    echo ""
+    echo "❌ Validation checks failed. Please fix the errors above."
+    echo "To bypass (not recommended): git commit --no-verify"
+    exit 1
+  fi
+elif [ -f ".git/hooks/pre-commit" ] && file ".git/hooks/pre-commit" | grep -q Python; then
+  if ! python3 ".git/hooks/pre-commit"; then
+    echo "❌ Python validation checks failed."
+    exit 1
+  fi
+fi
+
 echo ""
 echo "✅ All pre-commit checks passed!"
 exit 0
diff --git a/.githooks/pre-commit-python b/.githooks/pre-commit-python
new file mode 100755
index 0000000..5500a77
--- /dev/null
+++ b/.githooks/pre-commit-python
@@ -0,0 +1,364 @@
+#!/usr/bin/env python3
+"""
+DSS Pre-Commit Hook
+Enforces DSS architectural guardrails before allowing commits
+
+Validators:
+1. Immutable file protection
+2. Temp folder discipline
+3. Schema validation
+4. Terminology checks
+5. Audit logging
+"""
+
+import sys
+import os
+import json
+import subprocess
+from pathlib import Path
+from datetime import datetime
+import re
+
+# Configuration
+DSS_ROOT = Path("/home/overbits/dss")
+IMMUTABLE_FILES = [
+    ".dss/schema/*.schema.json",
+    ".dss-boundaries.yaml",
+    "API_SPECIFICATION_IMMUTABLE.md",
+    "dss-claude-plugin/.mcp.json",
+    "dss-mvp1/dss/validators/schema.py",
+]
+
+AUDIT_LOG = DSS_ROOT / ".dss/logs/git-hooks.jsonl"
+TEMP_DIR = DSS_ROOT / ".dss/temp"
+
+class Colors:
+    RED = '\033[0;31m'
+    GREEN = '\033[0;32m'
+    YELLOW = '\033[1;33m'
+    NC = '\033[0m'  # No Color
+
+def log_audit(validator, status, details):
+    """Log hook events to audit trail"""
+    AUDIT_LOG.parent.mkdir(parents=True, exist_ok=True)
+
+    log_entry = {
+        "timestamp": datetime.utcnow().isoformat(),
+        "hook": "pre-commit",
+        "validator": validator,
+        "status": status,
+        "details": details,
+    }
+
+    with open(AUDIT_LOG, "a") as f:
+        f.write(json.dumps(log_entry) + "\n")
+
+def get_staged_files():
+    """Get list of staged files"""
+    result = subprocess.run(
+        ["git", "diff", "--cached", "--name-only", "--diff-filter=ACM"],
+        capture_output=True,
+        text=True,
+        cwd=DSS_ROOT
+    )
+    return [Path(f) for f in result.stdout.strip().split("\n") if f]
+
+def check_immutable_files(staged_files):
+    """Validate that immutable files are not modified"""
+    from fnmatch import fnmatch
+
+    violations = []
+
+    for file_path in staged_files:
+        for pattern in IMMUTABLE_FILES:
+            if fnmatch(str(file_path), pattern):
+                # Only block if file exists in last commit (modification, not addition)
+                result = subprocess.run(
+                    ["git", "ls-tree", "--name-only", "HEAD", str(file_path)],
+                    capture_output=True,
+                    text=True,
+                    cwd=DSS_ROOT
+                )
+                if result.stdout.strip():  # File exists in HEAD
+                    violations.append(str(file_path))
+
+    if violations:
+        # Check for bypass via environment variable or commit message
+        bypass = os.environ.get("DSS_IMMUTABLE_BYPASS") == "1"
+
+        if not bypass:
+            # Try to get commit message from various sources
+            commit_msg_file = DSS_ROOT / ".git/COMMIT_EDITMSG"
+            if commit_msg_file.exists():
+                commit_msg = commit_msg_file.read_text()
+                if "[IMMUTABLE-UPDATE]" in commit_msg:
+                    bypass = True
+                    log_audit("immutable_files", "bypass", {
+                        "files": violations,
+                        "commit_message": commit_msg.split("\n")[0],
+                        "method": "commit_message"
+                    })
+
+        if bypass:
+            log_audit("immutable_files", "bypass", {
+                "files": violations,
+                "method": "environment_variable"
+            })
+
+        if not bypass:
+            print(f"{Colors.RED}✗ IMMUTABLE FILE VIOLATION{Colors.NC}")
+            print(f"\nThe following protected files cannot be modified:")
+            for v in violations:
+                print(f"  - {v}")
+            print(f"\nTo update immutable files:")
+            print(f"  1. Use commit message: [IMMUTABLE-UPDATE] Reason for change")
+            print(f"  2. Include justification in commit body")
+            print(f"\nProtected files:")
+            for pattern in IMMUTABLE_FILES:
+                print(f"  - {pattern}")
+
+            log_audit("immutable_files", "rejected", {"files": violations})
+            return False
+
+    log_audit("immutable_files", "passed", {"files_checked": len(staged_files)})
+    return True
+
+def check_temp_folder(staged_files):
+    """Validate that temp files are only in .dss/temp/"""
+    violations = []
+
+    # Patterns that indicate temp files
+    temp_patterns = [
+        r".*\.tmp$",
+        r".*\.temp$",
+        r".*~$",
+        r".*\.swp$",
+        r".*\.swo$",
+        r".*\.backup$",
+        r".*\.bak$",
+        r"^temp/",
+        r"^tmp/",
+        r"^scratch/",
+    ]
+
+    for file_path in staged_files:
+        file_str = str(file_path)
+
+        # Check if it matches temp patterns but is NOT in .dss/temp/
+        if any(re.match(pattern, file_str) for pattern in temp_patterns):
+            if not file_str.startswith(".dss/temp/"):
+                violations.append(file_str)
+
+    if violations:
+        print(f"{Colors.RED}✗ TEMP FOLDER VIOLATION{Colors.NC}")
+        print(f"\nTemp files must be created in .dss/temp/ only:")
+        for v in violations:
+            print(f"  - {v}")
+        print(f"\nAll temporary files MUST go in: .dss/temp/[session-id]/")
+        print(f"Use the get_temp_dir() helper function.")
+
+        log_audit("temp_folder", "rejected", {"files": violations})
+        return False
+
+    log_audit("temp_folder", "passed", {"files_checked": len(staged_files)})
+    return True
+
+def check_schemas(staged_files):
+    """Validate JSON and YAML schemas"""
+    violations = []
+
+    for file_path in staged_files:
+        if file_path.suffix in [".json", ".yaml", ".yml"]:
+            full_path = DSS_ROOT / file_path
+
+            try:
+                if file_path.suffix == ".json":
+                    with open(full_path) as f:
+                        json.load(f)
+                elif file_path.suffix in [".yaml", ".yml"]:
+                    try:
+                        import yaml
+                        with open(full_path) as f:
+                            yaml.safe_load(f)
+                    except ImportError:
+                        # YAML not available, skip validation
+                        continue
+            except Exception as e:
+                violations.append({
+                    "file": str(file_path),
+                    "error": str(e)
+                })
+
+    if violations:
+        print(f"{Colors.RED}✗ SCHEMA VALIDATION FAILED{Colors.NC}")
+        print(f"\nInvalid JSON/YAML files:")
+        for v in violations:
+            print(f"  - {v['file']}")
+            print(f"    Error: {v['error']}")
+
+        log_audit("schema_validation", "rejected", {"violations": violations})
+        return False
+
+    log_audit("schema_validation", "passed", {"files_checked": len(staged_files)})
+    return True
+
+def check_documentation(staged_files):
+    """Check that new implementations have documentation"""
+    violations = []
+    warnings = []
+
+    # Track new Python files that need docstrings
+    python_files = [f for f in staged_files if f.suffix == ".py"]
+
+    for file_path in python_files:
+        full_path = DSS_ROOT / file_path
+
+        if not full_path.exists():
+            continue
+
+        try:
+            content = full_path.read_text()
+
+            # Check for classes without docstrings
+            class_pattern = r'class\s+(\w+)[^:]*:\s*\n\s*(?!""")'
+            missing_class_docs = re.findall(class_pattern, content)
+
+            # Check for public functions without docstrings (not starting with _)
+            func_pattern = r'def\s+([a-zA-Z][^_][^(]*)\([^)]*\):\s*\n\s*(?!""")'
+            missing_func_docs = re.findall(func_pattern, content)
+
+            if missing_class_docs:
+                warnings.append({
+                    "file": str(file_path),
+                    "type": "class",
+                    "items": missing_class_docs[:5]  # Limit to first 5
+                })
+
+            if missing_func_docs:
+                warnings.append({
+                    "file": str(file_path),
+                    "type": "function",
+                    "items": missing_func_docs[:5]  # Limit to first 5
+                })
+
+        except Exception as e:
+            continue
+
+    # Check if significant code changes have knowledge updates
+    code_extensions = [".py", ".ts", ".tsx", ".js", ".jsx"]
+    code_files_changed = [f for f in staged_files if f.suffix in code_extensions]
+    knowledge_files_changed = [f for f in staged_files if ".knowledge" in str(f)]
+
+    # If many code files changed but no knowledge updates, warn
+    if len(code_files_changed) > 5 and len(knowledge_files_changed) == 0:
+        warnings.append({
+            "file": "general",
+            "type": "knowledge",
+            "items": [f"Changed {len(code_files_changed)} code files but no .knowledge/ updates"]
+        })
+
+    if warnings:
+        print(f"{Colors.YELLOW}⚠ DOCUMENTATION WARNING{Colors.NC}")
+        print(f"\nMissing documentation found (non-blocking):")
+        for w in warnings:
+            if w["type"] == "class":
+                print(f"  - {w['file']}: Classes without docstrings: {', '.join(w['items'])}")
+            elif w["type"] == "function":
+                print(f"  - {w['file']}: Functions without docstrings: {', '.join(w['items'])}")
+            elif w["type"] == "knowledge":
+                print(f"  - {w['items'][0]}")
+        print(f"\n  Tip: Add docstrings to new classes/functions")
+        print(f"  Tip: Update .knowledge/ files when adding major features\n")
+
+        log_audit("documentation", "warning", {"warnings": warnings})
+    else:
+        log_audit("documentation", "passed", {"files_checked": len(staged_files)})
+
+    # Always return True (warnings only) - change to False to make blocking
+    return True
+
+
+def check_terminology(staged_files):
+    """Check for deprecated terminology (warn only)"""
+    warnings = []
+
+    deprecated_terms = {
+        "swarm": "Design System Server / DSS",
+        "organism": "component",
+    }
+
+    for file_path in staged_files:
+        # Only check text files
+        if file_path.suffix in [".py", ".js", ".ts", ".md", ".txt", ".json", ".yaml", ".yml"]:
+            full_path = DSS_ROOT / file_path
+
+            try:
+                content = full_path.read_text()
+
+                for old_term, new_term in deprecated_terms.items():
+                    if re.search(rf"\b{old_term}\b", content, re.IGNORECASE):
+                        warnings.append({
+                            "file": str(file_path),
+                            "term": old_term,
+                            "suggested": new_term
+                        })
+            except:
+                # Skip binary or unreadable files
+                continue
+
+    if warnings:
+        print(f"{Colors.YELLOW}⚠ TERMINOLOGY WARNING{Colors.NC}")
+        print(f"\nDeprecated terminology found (non-blocking):")
+        for w in warnings:
+            print(f"  - {w['file']}: '{w['term']}' → use '{w['suggested']}'")
+        print()
+
+        log_audit("terminology", "warning", {"warnings": warnings})
+    else:
+        log_audit("terminology", "passed", {"files_checked": len(staged_files)})
+
+    # Always return True (warnings only)
+    return True
+
+def main():
+    """Run all validators"""
+    print(f"{Colors.GREEN}Running DSS pre-commit validations...{Colors.NC}\n")
+
+    staged_files = get_staged_files()
+
+    if not staged_files:
+        print("No files to validate.")
+        return 0
+
+    validators = [
+        ("Immutable File Protection", check_immutable_files),
+        ("Temp Folder Discipline", check_temp_folder),
+        ("Schema Validation", check_schemas),
+        ("Documentation Check", check_documentation),
+        ("Terminology Check", check_terminology),
+    ]
+
+    results = []
+    for name, validator in validators:
+        print(f"• {name}...", end=" ")
+        result = validator(staged_files)
+        results.append(result)
+
+        if result:
+            print(f"{Colors.GREEN}✓{Colors.NC}")
+        else:
+            print(f"{Colors.RED}✗{Colors.NC}")
+            print()
+
+    if all(results):
+        print(f"\n{Colors.GREEN}✓ All validations passed{Colors.NC}")
+        log_audit("pre_commit", "success", {"files": len(staged_files)})
+        return 0
+    else:
+        print(f"\n{Colors.RED}✗ Pre-commit validation failed{Colors.NC}")
+        print(f"Fix the issues above and try again.\n")
+        log_audit("pre_commit", "failed", {"files": len(staged_files)})
+        return 1
+
+if __name__ == "__main__":
+    sys.exit(main())
diff --git a/.knowledge/DSS_CORE.json b/.knowledge/DSS_CORE.json
index b918530..27e33aa 100644
--- a/.knowledge/DSS_CORE.json
+++ b/.knowledge/DSS_CORE.json
@@ -1,6 +1,6 @@
 {
   "$schema": "dss-core-v1",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "last_updated": "2025-12-10",
   "purpose": "Single source of truth for AI agents working with DSS",
 
@@ -24,7 +24,7 @@
 
   "canonical_structure": {
     "tokens": ["colors", "spacing", "typography", "borders", "shadows", "motion"],
-    "components": ["Button", "Input", "Card", "Badge", "Toast", "..."],
+    "components": "59 shadcn/ui components - see .dss/components/shadcn-registry.json",
     "patterns": ["forms", "navigation", "layouts"],
     "rule": "This structure NEVER changes. All inputs normalize to this."
   },
@@ -87,6 +87,57 @@
     "context_compiler": ["dss_get_resolved_context", "dss_get_compiler_status"]
   },
 
+  "token_architecture": {
+    "description": "3-Layer Token Cascade with Skin Contract validation",
+    "layers": {
+      "1_core_primitives": {
+        "path": ".dss/core/primitives.json",
+        "purpose": "Raw Tailwind-style values (colors, spacing, radius, fonts)",
+        "immutable": true,
+        "shared": "Across all skins"
+      },
+      "2_skin": {
+        "path": ".dss/skins/{skin_name}/tokens.json",
+        "purpose": "Semantic mapping from primitives to design tokens",
+        "contract": ".dss/schema/skin-contract.json",
+        "examples": ["shadcn", "heroui", "material"],
+        "rule": "Must provide ALL tokens defined in skin-contract"
+      },
+      "3_theme": {
+        "path": ".dss/themes/{theme_name}.json",
+        "purpose": "Brand overrides on top of skin",
+        "rule": "May ONLY override tokens defined in skin-contract",
+        "survives": "Skin updates (stable API through contract)"
+      }
+    },
+    "cascade_flow": "Core Primitives -> Skin (semantic) -> Theme (brand) = Final Tokens",
+    "validation": {
+      "script": "scripts/validate-theme.py",
+      "checks": [
+        "Skin provides all contract-required tokens",
+        "Theme only overrides contract tokens"
+      ]
+    },
+    "resolution": {
+      "script": "scripts/resolve-tokens.py",
+      "output": ".dss/data/_system/tokens/tokens.json",
+      "resolves": "Token references like {color.zinc.500} using primitives"
+    },
+    "storybook_generation": {
+      "script": "scripts/generate-storybook.py",
+      "output": "admin-ui/src/stories/",
+      "generates": [
+        "Overview.stories.js - Introduction and architecture",
+        "ColorPrimitives.stories.js - Tailwind color palette",
+        "Spacing.stories.js - Spacing scale",
+        "Radius.stories.js - Border radius tokens",
+        "Typography.stories.js - Typography styles from Figma",
+        "Effects.stories.js - Shadows and focus rings",
+        "SemanticColors.stories.js - Semantic color tokens from skin"
+      ]
+    }
+  },
+
   "context_compiler": {
     "cascade": "Base Skin -> Extended Skin -> Project Overrides = Final Context",
     "caching": "mtime-based invalidation",
@@ -114,7 +165,16 @@
     "skills": "dss-claude-plugin/skills/",
     "commands": "dss-claude-plugin/commands/",
     "logs": ".dss/logs/",
-    "cache": ".dss/cache/"
+    "cache": ".dss/cache/",
+    "core_primitives": ".dss/core/primitives.json",
+    "skin_contract": ".dss/schema/skin-contract.json",
+    "skins": ".dss/skins/",
+    "themes": ".dss/themes/",
+    "token_resolver": "scripts/resolve-tokens.py",
+    "theme_validator": "scripts/validate-theme.py",
+    "storybook_generator": "scripts/generate-storybook.py",
+    "storybook_stories": "admin-ui/src/stories/",
+    "component_registry": ".dss/components/shadcn-registry.json"
   },
 
   "coding_rules_summary": {
@@ -222,7 +282,27 @@
     "cli": "dss ingest --source figma --file tokens.json"
   },
 
+  "component_registry": {
+    "path": ".dss/components/shadcn-registry.json",
+    "source": "shadcn/ui (https://ui.shadcn.com)",
+    "total_components": 59,
+    "categories": {
+      "form": "21 components (Button, Input, Select, Checkbox, etc.)",
+      "data-display": "11 components (Table, Badge, Avatar, Chart, etc.)",
+      "feedback": "7 components (Alert, Toast, Progress, Spinner, etc.)",
+      "navigation": "6 components (Tabs, Breadcrumb, Sidebar, etc.)",
+      "overlay": "9 components (Dialog, Sheet, Dropdown, Tooltip, etc.)",
+      "layout": "5 components (Card, Separator, Scroll Area, etc.)"
+    },
+    "dependencies": {
+      "radix": "26 Radix UI primitives",
+      "additional": ["cmdk", "embla-carousel", "react-day-picker", "recharts", "sonner", "vaul"]
+    }
+  },
+
   "changelog": [
+    {"version": "1.3.0", "date": "2025-12-10", "notes": "Add 59-component shadcn registry, expand primitives to full Tailwind palette"},
+    {"version": "1.2.0", "date": "2025-12-10", "notes": "Add 3-layer token architecture with skin contract validation"},
     {"version": "1.1.0", "date": "2025-12-10", "notes": "Migrate from SQLite to JSON file storage"},
     {"version": "1.0.0", "date": "2025-12-10", "notes": "Initial core definition"}
   ]
diff --git a/.knowledge/FIGMA_SYNC_ARCHITECTURE.md b/.knowledge/FIGMA_SYNC_ARCHITECTURE.md
new file mode 100644
index 0000000..3cfa452
--- /dev/null
+++ b/.knowledge/FIGMA_SYNC_ARCHITECTURE.md
@@ -0,0 +1,236 @@
+# Intelligent Figma Sync Architecture
+
+> Deep research synthesis from Figmagic, Design Tokens plugin, Figma MCP patterns, and Gemini 3 Pro analysis.
+
+## Executive Summary
+
+DSS intelligent Figma sync should implement a **4-layer pipeline** architecture with hybrid token extraction, W3C token format compliance, intelligent caching, and strict design contract enforcement.
+
+## Architecture Overview
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    FIGMA API LAYER                          │
+├─────────────────────────────────────────────────────────────┤
+│  GET /files/{key}           → File metadata, lastModified   │
+│  GET /files/{key}/variables → Variables + collections       │
+│  GET /files/{key}/styles    → Color, text, effect styles    │
+│  GET /files/{key}/nodes     → Component structure           │
+│  GET /images/{key}          → Component thumbnails          │
+└─────────────────────────────────────────────────────────────┘
+                              ↓
+┌─────────────────────────────────────────────────────────────┐
+│                  VALIDATION LAYER (NEW)                     │
+├─────────────────────────────────────────────────────────────┤
+│  DesignLinter:                                              │
+│    - Reject components without proper variant props         │
+│    - Enforce naming conventions (no "Property 1", "Frame X")│
+│    - Mark non-compliant as "Raw" (skip code gen)            │
+│    - Generate lint report for designers                     │
+└─────────────────────────────────────────────────────────────┘
+                              ↓
+┌─────────────────────────────────────────────────────────────┐
+│                  EXTRACTION LAYER                           │
+├─────────────────────────────────────────────────────────────┤
+│  VariableExtractor  → semantic tokens (color, spacing)      │
+│  StyleExtractor     → typography, effects, grids            │
+│  ComponentExtractor → component sets, variants, props       │
+│  AssetExtractor     → icons, images (optional)              │
+└─────────────────────────────────────────────────────────────┘
+                              ↓
+┌─────────────────────────────────────────────────────────────┐
+│               TRANSLATION LAYER                             │
+├─────────────────────────────────────────────────────────────┤
+│  FigmaToDSSTranslator:                                      │
+│    - Maps Figma naming → DSS canonical names                │
+│    - Preserves variable REFERENCES (not resolved values)    │
+│    - Normalizes units (px → rem where appropriate)          │
+│    - Applies merge strategies (PREFER_FIGMA, LAST, etc)     │
+│    - Outputs W3C Design Token format                        │
+│    - Separates Visual Props from Interaction States         │
+└─────────────────────────────────────────────────────────────┘
+                              ↓
+┌─────────────────────────────────────────────────────────────┐
+│                  OUTPUT LAYER                               │
+├─────────────────────────────────────────────────────────────┤
+│  TokenWriter    → .dss/data/_system/tokens/figma-tokens.json│
+│  ComponentWriter→ .dss/components/figma-registry.json       │
+│  StoryGenerator → admin-ui/src/stories/Components/*.stories │
+│  CSSGenerator   → .dss/themes/figma.css                     │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## Key Architectural Decisions
+
+### 1. Hybrid Token Extraction Strategy
+
+| Source | Token Types | Priority |
+|--------|-------------|----------|
+| Variables | Semantic colors, spacing, breakpoints | Primary |
+| Styles | Typography, effects, grids | Secondary |
+| Components | UI registry, variants | Tertiary |
+
+**Rationale**: Variables provide modern theming with modes (light/dark), while Styles capture typography which isn't fully available in Variables yet.
+
+### 2. W3C Design Token Format
+
+```json
+{
+  "$schema": "https://design-tokens.org/schema.json",
+  "color": {
+    "primary": {
+      "$value": "{color.blue.600}",
+      "$type": "color",
+      "$extensions": {
+        "figma": {"styleId": "S:abc123", "source": "variables"}
+      }
+    }
+  }
+}
+```
+
+**Critical**: Preserve token **references** (`{color.blue.600}`), not resolved values (`#0066cc`). This enables:
+- Multi-theme switching (Skins)
+- Style Dictionary transformation
+- Proper CSS variable generation
+
+### 3. Component Variant Classification
+
+```python
+VARIANT_CLASSIFICATION = {
+    # Visual Props → React props / Storybook args
+    "visual_props": ["Size", "Variant", "Roundness", "Type", "Icon"],
+
+    # Interaction States → CSS pseudo-classes (NOT React props)
+    "interaction_states": ["State", "Hover", "Focused", "Pressed", "Disabled"],
+
+    # Boolean toggles → React boolean props
+    "boolean_props": ["Checked?", "Selected", "Open", "Expanded"]
+}
+```
+
+**Example Mapping**:
+- Figma: `Button / Primary / Hover / Large`
+- Code: `<Button variant="primary" size="large" />`
+- CSS handles `:hover` state via pseudo-class
+
+### 4. Canonical Token Interface (CTI)
+
+DSS defines universal tokens that Skins map to:
+
+```
+DSS Canonical          →  shadcn Skin           →  HeroUI Skin
+─────────────────────────────────────────────────────────────
+--dss-action-bg        →  --primary             →  --heroui-primary
+--dss-action-fg        →  --primary-foreground  →  --heroui-primary-fg
+--dss-surface-bg       →  --background          →  --heroui-background
+--dss-muted-bg         →  --muted               →  --heroui-default-100
+```
+
+## Intelligent Caching Strategy
+
+### ETag-like Caching
+
+```python
+class FigmaSyncCache:
+    def should_sync(self, file_key: str) -> bool:
+        manifest = self.load_manifest()
+        cached = manifest.get(file_key, {})
+
+        # Lightweight API call for lastModified
+        remote_modified = self.get_file_version(file_key)
+
+        return (
+            cached.get("lastModified") != remote_modified or
+            cached.get("age_hours", 999) > 24
+        )
+
+    def get_changed_nodes(self, file_key: str) -> list:
+        """Compare node hashes to find what changed"""
+        local_hashes = self.load_node_hashes(file_key)
+        remote_nodes = self.fetch_node_tree(file_key)
+
+        changed = []
+        for node_id, node in remote_nodes.items():
+            node_hash = hash_node_properties(node)
+            if local_hashes.get(node_id) != node_hash:
+                changed.append(node_id)
+
+        return changed
+```
+
+### Cache Manifest Structure
+
+```json
+{
+  "evCZlaeZrP7X20NIViSJbl": {
+    "lastModified": "2025-12-10T12:00:00Z",
+    "syncedAt": "2025-12-10T12:05:00Z",
+    "nodeHashes": {
+      "66:5034": "abc123...",
+      "58:5416": "def456..."
+    },
+    "extractedTokens": 245,
+    "extractedComponents": 67
+  }
+}
+```
+
+## Implementation Priorities
+
+| Priority | Task | Impact | Effort |
+|----------|------|--------|--------|
+| **P0** | Rate limit handling (exponential backoff, request queue) | Critical | Low |
+| **P0** | lastModified caching check | High | Low |
+| **P1** | Variable extraction (Figma Variables API) | High | Medium |
+| **P1** | Translation layer (Figma → DSS canonical) | High | Medium |
+| **P1** | Design validation/linting | Medium | Medium |
+| **P2** | Incremental node-level sync | Medium | High |
+| **P2** | W3C token output format | Medium | Low |
+| **P3** | Storybook story generation with variant controls | Medium | Medium |
+| **P3** | Asset extraction (icons, images) | Low | Low |
+
+## Design Contract Enforcement
+
+**Principle**: Don't write complex code to handle messy design. Enforce design standards.
+
+### Required Variant Properties
+
+Components must have properly named variant properties to be eligible for code generation:
+
+```
+✓ Valid:   Button[Size=Large, Variant=Primary, State=Hover]
+✗ Invalid: Button[Property 1=true, Frame 4221]
+```
+
+### Naming Convention Rules
+
+1. Variant properties: PascalCase (`Size`, `Variant`, `State`)
+2. Variant values: PascalCase (`Large`, `Primary`, `Hover`)
+3. No auto-generated names (`Property 1`, `Frame 123`)
+4. Boolean variants: End with `?` (`Checked?`, `Selected?`)
+
+## File Outputs
+
+| File | Purpose | Format |
+|------|---------|--------|
+| `.dss/data/_system/tokens/figma-variables.json` | Raw Figma variables | W3C Token |
+| `.dss/data/_system/tokens/figma-styles.json` | Typography & effects | W3C Token |
+| `.dss/components/figma-registry.json` | Component catalog | DSS Registry |
+| `.dss/cache/figma-sync-manifest.json` | Sync state cache | Internal |
+| `.dss/logs/figma-lint-report.json` | Design validation | Report |
+
+## Research Sources
+
+- [Figmagic](https://github.com/mikaelvesavuori/figmagic) - Design token extraction patterns
+- [Design Tokens Plugin](https://github.com/lukasoppermann/design-tokens) - W3C format, Style Dictionary integration
+- [Tokens Studio](https://docs.tokens.studio) - Variable aliasing, theming
+- [Figma MCP](https://www.seamgen.com/blog/figma-mcp-complete-guide-to-design-to-code-automation) - AI-assisted code generation
+- [Figma Developer API](https://www.figma.com/developers/api) - Official documentation
+
+## Next Steps
+
+1. **Implement P0 items**: Rate limiting and caching
+2. **Create token-map.json**: Bridge between Figma IDs and DSS canonical names
+3. **Build validation layer**: Design linting before extraction
+4. **Test with Obra shadcn UIKit**: Validate against real Figma file
diff --git a/.mcp.json b/.mcp.json
index 7498457..8b4dbba 100644
--- a/.mcp.json
+++ b/.mcp.json
@@ -2,14 +2,14 @@
   "$schema": "https://raw.githubusercontent.com/anthropics/claude-code/main/schemas/mcp-servers.schema.json",
   "mcpServers": {
     "dss": {
-      "command": "${workspaceFolder}/venv/bin/python3",
-      "args": ["${workspaceFolder}/dss-claude-plugin/servers/dss-mcp-server.py"],
+      "command": "/home/overbits/dss/.venv/bin/python3",
+      "args": ["/home/overbits/dss/dss-claude-plugin/servers/dss-mcp-server.py"],
       "env": {
-        "PYTHONPATH": "${workspaceFolder}:${workspaceFolder}/dss-claude-plugin",
-        "DSS_HOME": "${workspaceFolder}/.dss",
-        "DSS_DATABASE": "${workspaceFolder}/.dss/dss.db",
-        "DSS_CACHE": "${workspaceFolder}/.dss/cache",
-        "DSS_BASE_PATH": "${workspaceFolder}"
+        "PYTHONPATH": "/home/overbits/dss:/home/overbits/dss/dss-claude-plugin",
+        "DSS_HOME": "/home/overbits/dss/.dss",
+        "DSS_DATABASE": "/home/overbits/dss/.dss/dss.db",
+        "DSS_CACHE": "/home/overbits/dss/.dss/cache",
+        "DSS_BASE_PATH": "/home/overbits/dss"
       },
       "description": "Design System Server MCP - local development"
     }
diff --git a/admin-ui/.gitignore b/admin-ui/.gitignore
index 1b3184d..3ae52b8 100644
--- a/admin-ui/.gitignore
+++ b/admin-ui/.gitignore
@@ -32,3 +32,6 @@ __coverage__
 # Logs
 logs
 *.log
+
+*storybook.log
+storybook-static
diff --git a/admin-ui/.storybook/main.js b/admin-ui/.storybook/main.js
new file mode 100644
index 0000000..0d1fd67
--- /dev/null
+++ b/admin-ui/.storybook/main.js
@@ -0,0 +1,25 @@
+
+
+/** @type { import('@storybook/html-vite').StorybookConfig } */
+const config = {
+  "stories": [
+    "../src/**/*.mdx",
+    "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"
+  ],
+  "addons": [
+    "@chromatic-com/storybook",
+    "@storybook/addon-vitest",
+    "@storybook/addon-a11y",
+    "@storybook/addon-docs"
+  ],
+  "framework": "@storybook/html-vite",
+  viteFinal: async (config) => {
+    config.server = config.server || {};
+    config.server.allowedHosts = [
+      'localhost',
+      'storybook.dss.overbits.luz.uy'
+    ];
+    return config;
+  }
+};
+export default config;
\ No newline at end of file
diff --git a/admin-ui/.storybook/preview.js b/admin-ui/.storybook/preview.js
new file mode 100644
index 0000000..c69a74b
--- /dev/null
+++ b/admin-ui/.storybook/preview.js
@@ -0,0 +1,23 @@
+// Import DSS design tokens
+import '../css/tokens.css';
+
+/** @type { import('@storybook/html-vite').Preview } */
+const preview = {
+  parameters: {
+    controls: {
+      matchers: {
+       color: /(background|color)$/i,
+       date: /Date$/i,
+      },
+    },
+    backgrounds: {
+      default: 'light',
+      values: [
+        { name: 'light', value: '#ffffff' },
+        { name: 'dark', value: '#1a1a1a' },
+      ],
+    },
+  },
+};
+
+export default preview;
\ No newline at end of file
diff --git a/admin-ui/css/dss-components.css b/admin-ui/css/dss-components.css
deleted file mode 100644
index 304bc82..0000000
--- a/admin-ui/css/dss-components.css
+++ /dev/null
@@ -1,750 +0,0 @@
-/**
- * DSS Components - Layer 3 (Component Styles)
- *
- * All component styling using semantic tokens from dss-theme.css.
- *
- * FIRST PRINCIPLES:
- * - This layer references semantic tokens (--header-*, --sidebar-*, etc.)
- * - NO fallback values - tokens and theme layers MUST load first
- * - If layers are missing, theme-loader.js handles it
- * - Uses BEM methodology for class naming
- */
-
-/* ==========================================================================
-   App Header
-   ========================================================================== */
-
-.app-header {
-  background-color: var(--header-bg);
-  border-bottom: 1px solid var(--header-border);
-  color: var(--header-text);
-  padding: 0 var(--ds-space-4);
-  gap: var(--ds-space-4);
-  height: var(--header-height);
-}
-
-.app-header__project-selector {
-  flex: 0 0 auto;
-}
-
-.app-header__team-selector {
-  flex: 0 0 auto;
-}
-
-.app-header__actions {
-  display: flex;
-  align-items: center;
-  gap: var(--ds-space-2);
-  margin-left: auto;
-}
-
-/* ==========================================================================
-   Sidebar
-   ========================================================================== */
-
-.sidebar {
-  background-color: var(--sidebar-bg);
-  border-right: 1px solid var(--sidebar-border);
-  color: var(--sidebar-text);
-  padding: var(--ds-space-4);
-  width: var(--sidebar-width);
-}
-
-.sidebar__header {
-  margin-bottom: var(--ds-space-6);
-}
-
-.sidebar__logo {
-  display: flex;
-  align-items: center;
-  gap: var(--ds-space-2);
-  font-weight: var(--ds-font-weight-semibold);
-  font-size: var(--ds-font-size-lg);
-}
-
-.sidebar__logo-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  background-color: var(--ds-color-primary);
-  color: var(--ds-color-primary-foreground);
-  border-radius: var(--ds-radius-md);
-}
-
-.sidebar__nav {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-2);
-  flex: 1;
-}
-
-.sidebar__help {
-  margin-top: auto;
-  padding-top: var(--ds-space-4);
-  border-top: 1px solid var(--sidebar-border);
-}
-
-.sidebar__footer {
-  margin-top: var(--ds-space-4);
-  padding-top: var(--ds-space-4);
-  border-top: 1px solid var(--sidebar-border);
-}
-
-/* ==========================================================================
-   Navigation
-   ========================================================================== */
-
-.nav-section {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-1);
-}
-
-.nav-section + .nav-section {
-  margin-top: var(--ds-space-4);
-  padding-top: var(--ds-space-4);
-  border-top: 1px solid var(--sidebar-border);
-}
-
-.nav-section__title {
-  font-size: var(--ds-font-size-xs);
-  font-weight: var(--ds-font-weight-semibold);
-  color: var(--nav-section-title);
-  text-transform: uppercase;
-  letter-spacing: var(--ds-letter-spacing-wider);
-  padding: var(--ds-space-2) var(--ds-space-3);
-}
-
-.nav-section__content {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-1);
-}
-
-/* Sub-sections within nav sections */
-.nav-sub-section {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-1);
-  margin-top: var(--ds-space-1);
-}
-
-.nav-sub-section__title {
-  font-size: var(--ds-font-size-xs);
-  font-weight: var(--ds-font-weight-medium);
-  color: var(--nav-section-title);
-  padding: var(--ds-space-1) var(--ds-space-3);
-  padding-left: var(--ds-space-4);
-  opacity: 0.8;
-}
-
-/* Navigation item levels */
-.nav-item--level-1 {
-  padding-left: var(--ds-space-3);
-}
-
-.nav-item--level-2 {
-  padding-left: var(--ds-space-6);
-  font-size: var(--ds-font-size-sm);
-}
-
-.nav-item {
-  display: flex;
-  align-items: center;
-  gap: var(--nav-item-gap);
-  padding: var(--nav-item-padding);
-  border-radius: var(--nav-item-radius);
-  color: var(--nav-item-text);
-  font-size: var(--ds-font-size-sm);
-  font-weight: var(--ds-font-weight-medium);
-  transition: all var(--ds-transition-fast) var(--ds-ease-out);
-  border: 2px solid transparent;
-  cursor: pointer;
-}
-
-.nav-item:hover {
-  background-color: var(--nav-item-bg-hover);
-  color: var(--nav-item-text);
-}
-
-.nav-item:focus {
-  outline: none;
-  border-color: var(--nav-item-border-focus);
-  background-color: var(--nav-item-bg-hover);
-}
-
-.nav-item.active {
-  background-color: var(--nav-item-bg-active);
-  color: var(--nav-item-text-active);
-  font-weight: var(--ds-font-weight-semibold);
-}
-
-.nav-item__icon {
-  width: 18px;
-  height: 18px;
-  flex-shrink: 0;
-  opacity: 0.7;
-  transition: transform var(--ds-transition-fast) var(--ds-ease-out);
-}
-
-.nav-item:hover .nav-item__icon {
-  transform: scale(1.05);
-  opacity: 1;
-}
-
-/* ==========================================================================
-   Main Content Area
-   ========================================================================== */
-
-.app-main {
-  background-color: var(--main-bg);
-  color: var(--main-text);
-}
-
-.app-content {
-  flex: 1;
-  overflow-y: auto;
-  padding: var(--ds-space-6);
-}
-
-/* ==========================================================================
-   Landing Page
-   ========================================================================== */
-
-.landing-page {
-  display: none;
-  flex: 1;
-  flex-direction: column;
-  overflow-y: auto;
-  padding: var(--ds-space-6);
-  background-color: var(--landing-bg);
-  width: 100%;
-}
-
-.landing-page.active {
-  display: flex;
-}
-
-.landing-hero {
-  text-align: center;
-  padding: var(--ds-space-8) 0;
-  margin-bottom: var(--ds-space-8);
-}
-
-.landing-hero h1 {
-  font-size: var(--ds-font-size-3xl);
-  font-weight: var(--ds-font-weight-bold);
-  color: var(--landing-hero-text);
-  margin-bottom: var(--ds-space-3);
-}
-
-.landing-hero p {
-  font-size: var(--ds-font-size-lg);
-  color: var(--landing-hero-subtitle);
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.landing-content {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-8);
-}
-
-/* ==========================================================================
-   Dashboard Category
-   ========================================================================== */
-
-.dashboard-category {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-4);
-}
-
-.dashboard-category__title {
-  font-size: var(--ds-font-size-lg);
-  font-weight: var(--ds-font-weight-semibold);
-  color: var(--category-title-text);
-  padding-bottom: var(--ds-space-3);
-  border-bottom: 1px solid var(--category-title-border);
-}
-
-/* ==========================================================================
-   Dashboard Grid
-   ========================================================================== */
-
-.dashboard-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
-  gap: var(--ds-space-4);
-}
-
-/* ==========================================================================
-   Dashboard Card
-   ========================================================================== */
-
-.dashboard-card {
-  display: flex;
-  flex-direction: column;
-  padding: var(--ds-space-5);
-  background-color: var(--dashboard-card-bg);
-  border: 1px solid var(--dashboard-card-border);
-  border-radius: var(--card-radius);
-  color: var(--dashboard-card-text);
-  cursor: pointer;
-  transition: all var(--ds-transition-normal) var(--ds-ease-out);
-  text-decoration: none;
-  gap: var(--ds-space-3);
-}
-
-.dashboard-card:hover {
-  border-color: var(--dashboard-card-border-hover);
-  box-shadow: var(--dashboard-card-shadow-hover);
-  transform: translateY(-2px);
-}
-
-.dashboard-card:focus {
-  outline: var(--focus-ring-width) solid var(--focus-ring-color);
-  outline-offset: var(--focus-ring-offset);
-}
-
-.dashboard-card__icon {
-  font-size: var(--ds-font-size-2xl);
-}
-
-.dashboard-card__content {
-  display: flex;
-  flex-direction: column;
-  gap: var(--ds-space-1);
-  flex: 1;
-}
-
-.dashboard-card__title {
-  font-size: var(--ds-font-size-base);
-  font-weight: var(--ds-font-weight-semibold);
-  color: var(--dashboard-card-text);
-}
-
-.dashboard-card__description {
-  font-size: var(--ds-font-size-sm);
-  color: var(--dashboard-card-text-muted);
-  line-height: var(--ds-line-height-relaxed);
-}
-
-.dashboard-card__meta {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  color: var(--dashboard-card-text-muted);
-  font-size: var(--ds-font-size-lg);
-}
-
-/* ==========================================================================
-   AI Sidebar (Right Panel)
-   ========================================================================== */
-
-.app-sidebar {
-  width: 360px;
-  background-color: var(--sidebar-bg);
-  border-left: 1px solid var(--sidebar-border);
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
-.app-sidebar[hidden] {
-  display: none;
-}
-
-/* ==========================================================================
-   Buttons
-   ========================================================================== */
-
-ds-button,
-.ds-button {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: var(--ds-space-2);
-  padding: var(--button-padding-y) var(--button-padding-x);
-  font-size: var(--button-font-size);
-  font-weight: var(--button-font-weight);
-  border-radius: var(--button-radius);
-  transition: all var(--ds-transition-fast) var(--ds-ease-out);
-  cursor: pointer;
-  border: 1px solid transparent;
-}
-
-ds-button[data-variant="default"],
-.ds-button--default {
-  background-color: var(--button-bg);
-  color: var(--button-text);
-  border-color: var(--button-border);
-}
-
-ds-button[data-variant="default"]:hover,
-.ds-button--default:hover {
-  background-color: var(--button-bg-hover);
-}
-
-ds-button[data-variant="ghost"],
-.ds-button--ghost {
-  background-color: var(--button-ghost-bg);
-  color: var(--button-ghost-text);
-}
-
-ds-button[data-variant="ghost"]:hover,
-.ds-button--ghost:hover {
-  background-color: var(--button-ghost-bg-hover);
-}
-
-ds-button[data-variant="outline"],
-.ds-button--outline {
-  background-color: var(--button-outline-bg);
-  color: var(--button-outline-text);
-  border-color: var(--button-outline-border);
-}
-
-ds-button[data-variant="outline"]:hover,
-.ds-button--outline:hover {
-  background-color: var(--button-outline-bg-hover);
-}
-
-ds-button[data-size="icon"],
-.ds-button--icon {
-  padding: var(--ds-space-2);
-  width: 36px;
-  height: 36px;
-}
-
-ds-button:focus,
-.ds-button:focus {
-  outline: var(--focus-ring-width) solid var(--focus-ring-color);
-  outline-offset: var(--focus-ring-offset);
-}
-
-/* ==========================================================================
-   Cards
-   ========================================================================== */
-
-ds-card,
-.ds-card {
-  display: block;
-  background-color: var(--card-bg);
-  border: 1px solid var(--card-border);
-  border-radius: var(--card-radius);
-  padding: var(--card-padding);
-  box-shadow: var(--card-shadow);
-  color: var(--card-text);
-}
-
-ds-card:hover,
-.ds-card:hover {
-  box-shadow: var(--card-shadow-hover);
-}
-
-/* ==========================================================================
-   Badges
-   ========================================================================== */
-
-ds-badge,
-.ds-badge {
-  display: inline-flex;
-  align-items: center;
-  padding: var(--badge-padding-y) var(--badge-padding-x);
-  font-size: var(--badge-font-size);
-  font-weight: var(--ds-font-weight-medium);
-  border-radius: var(--badge-radius);
-  background-color: var(--badge-bg);
-  color: var(--badge-text);
-}
-
-ds-badge[data-variant="secondary"],
-.ds-badge--secondary {
-  background-color: var(--badge-secondary-bg);
-  color: var(--badge-secondary-text);
-}
-
-ds-badge[data-variant="outline"],
-.ds-badge--outline {
-  background-color: var(--badge-outline-bg);
-  color: var(--badge-outline-text);
-  border: 1px solid var(--badge-outline-border);
-}
-
-ds-badge[data-variant="success"],
-.ds-badge--success {
-  background-color: var(--badge-success-bg);
-  color: var(--badge-success-text);
-}
-
-ds-badge[data-variant="warning"],
-.ds-badge--warning {
-  background-color: var(--badge-warning-bg);
-  color: var(--badge-warning-text);
-}
-
-ds-badge[data-variant="error"],
-.ds-badge--error {
-  background-color: var(--badge-error-bg);
-  color: var(--badge-error-text);
-}
-
-/* ==========================================================================
-   Inputs
-   ========================================================================== */
-
-ds-input,
-.ds-input,
-input[type="text"],
-input[type="email"],
-input[type="password"],
-input[type="search"],
-textarea {
-  display: block;
-  width: 100%;
-  padding: var(--input-padding-y) var(--input-padding-x);
-  background-color: var(--input-bg);
-  color: var(--input-text);
-  border: 1px solid var(--input-border);
-  border-radius: var(--input-radius);
-  font-size: var(--ds-font-size-sm);
-  transition: border-color var(--ds-transition-fast) var(--ds-ease-out);
-}
-
-ds-input:focus,
-.ds-input:focus,
-input:focus,
-textarea:focus {
-  outline: none;
-  border-color: var(--input-border-focus);
-  box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
-}
-
-ds-input::placeholder,
-.ds-input::placeholder,
-input::placeholder,
-textarea::placeholder {
-  color: var(--input-placeholder);
-}
-
-/* ==========================================================================
-   Select
-   ========================================================================== */
-
-select,
-.ds-select {
-  display: block;
-  width: 100%;
-  padding: var(--input-padding-y) var(--input-padding-x);
-  background-color: var(--input-bg);
-  color: var(--input-text);
-  border: 1px solid var(--input-border);
-  border-radius: var(--input-radius);
-  font-size: var(--ds-font-size-sm);
-  cursor: pointer;
-}
-
-select:focus,
-.ds-select:focus {
-  outline: none;
-  border-color: var(--input-border-focus);
-  box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
-}
-
-.team-select {
-  padding: var(--ds-space-1-5) var(--ds-space-3);
-  background-color: var(--input-bg);
-  border: 1px solid var(--input-border);
-  border-radius: var(--input-radius);
-}
-
-/* ==========================================================================
-   Avatar
-   ========================================================================== */
-
-.ds-avatar {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: var(--avatar-size-md);
-  height: var(--avatar-size-md);
-  background-color: var(--avatar-bg);
-  color: var(--avatar-text);
-  border: 1px solid var(--avatar-border);
-  border-radius: var(--ds-radius-full);
-  font-size: var(--ds-font-size-sm);
-  font-weight: var(--ds-font-weight-medium);
-  cursor: pointer;
-}
-
-.ds-avatar:focus {
-  outline: var(--focus-ring-width) solid var(--focus-ring-color);
-  outline-offset: var(--focus-ring-offset);
-}
-
-/* ==========================================================================
-   Help Panel
-   ========================================================================== */
-
-.help-panel {
-  background-color: var(--help-panel-bg);
-  border-radius: var(--ds-radius-md);
-  border: 1px solid var(--help-panel-border);
-}
-
-.help-panel__toggle {
-  display: flex;
-  align-items: center;
-  gap: var(--ds-space-2);
-  padding: var(--ds-space-3);
-  font-size: var(--ds-font-size-sm);
-  font-weight: var(--ds-font-weight-medium);
-  color: var(--help-panel-text);
-  cursor: pointer;
-  list-style: none;
-}
-
-.help-panel__toggle::-webkit-details-marker {
-  display: none;
-}
-
-.help-panel__content {
-  padding: var(--ds-space-3);
-  padding-top: 0;
-  font-size: var(--ds-font-size-sm);
-  color: var(--help-panel-text-muted);
-}
-
-.help-section {
-  margin-bottom: var(--ds-space-3);
-}
-
-.help-section strong {
-  display: block;
-  color: var(--help-panel-text);
-  margin-bottom: var(--ds-space-1);
-}
-
-.help-section ul,
-.help-section ol {
-  padding-left: var(--ds-space-4);
-  list-style: disc;
-}
-
-.help-section ol {
-  list-style: decimal;
-}
-
-.help-section li {
-  margin-bottom: var(--ds-space-1);
-}
-
-/* ==========================================================================
-   Status Indicators
-   ========================================================================== */
-
-.status-dot {
-  width: 8px;
-  height: 8px;
-  border-radius: var(--ds-radius-full);
-  background-color: var(--ds-color-muted-foreground);
-}
-
-.status-dot--success {
-  background-color: var(--ds-color-success);
-}
-
-.status-dot--warning {
-  background-color: var(--ds-color-warning);
-}
-
-.status-dot--error {
-  background-color: var(--ds-color-error);
-}
-
-.status-dot--info {
-  background-color: var(--ds-color-info);
-}
-
-/* ==========================================================================
-   Notification Toggle Container
-   ========================================================================== */
-
-.notification-toggle-container {
-  position: relative;
-}
-
-/* ==========================================================================
-   Project Selector
-   ========================================================================== */
-
-.project-selector {
-  display: flex;
-  align-items: center;
-  gap: var(--ds-space-2);
-}
-
-.project-selector__label {
-  font-size: var(--ds-font-size-sm);
-  font-weight: var(--ds-font-weight-medium);
-  color: var(--text-muted);
-}
-
-.project-selector__select {
-  padding: var(--ds-space-1-5) var(--ds-space-3);
-  background-color: var(--input-bg);
-  border: 1px solid var(--input-border);
-  border-radius: var(--input-radius);
-  font-size: var(--ds-font-size-sm);
-}
-
-/* ==========================================================================
-   Responsive Adjustments
-   ========================================================================== */
-
-@media (max-width: 1024px) {
-  .app-sidebar {
-    width: 300px;
-  }
-
-  .dashboard-grid {
-    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
-  }
-}
-
-@media (max-width: 768px) {
-  .app-header__team-selector {
-    display: none;
-  }
-
-  .app-sidebar {
-    position: fixed;
-    top: var(--header-height);
-    right: 0;
-    bottom: 0;
-    width: 100%;
-    max-width: 360px;
-    transform: translateX(100%);
-    transition: transform var(--ds-transition-slow) var(--ds-ease-out);
-    z-index: 60;
-  }
-
-  .app-sidebar.open {
-    transform: translateX(0);
-  }
-
-  .dashboard-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .landing-hero h1 {
-    font-size: var(--ds-font-size-2xl);
-  }
-
-  .landing-hero p {
-    font-size: var(--ds-font-size-base);
-  }
-}
diff --git a/admin-ui/css/dss-core.css b/admin-ui/css/dss-core.css
deleted file mode 100644
index 45bf704..0000000
--- a/admin-ui/css/dss-core.css
+++ /dev/null
@@ -1,230 +0,0 @@
-/**
- * DSS Core CSS - Layer 0 (Structural Only)
- *
- * This file provides the structural foundation for DSS Admin UI.
- * It contains NO design decisions - only layout and structural CSS.
- * The UI should be functional (but unstyled) with only this file.
- */
-
-/* ==========================================================================
-   CSS Reset / Normalize
-   ========================================================================== */
-
-*, *::before, *::after {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}
-
-html {
-  line-height: 1.15;
-  -webkit-text-size-adjust: 100%;
-  font-size: 16px;
-}
-
-body {
-  min-height: 100vh;
-  text-rendering: optimizeSpeed;
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-}
-
-img, picture, video, canvas, svg {
-  display: block;
-  max-width: 100%;
-}
-
-input, button, textarea, select {
-  font: inherit;
-}
-
-a {
-  text-decoration: none;
-  color: inherit;
-}
-
-ul, ol {
-  list-style: none;
-}
-
-button {
-  cursor: pointer;
-  border: none;
-  background: none;
-}
-
-/* ==========================================================================
-   App Shell - CSS Grid Layout
-   ========================================================================== */
-
-.app-layout {
-  display: grid;
-  grid-template-columns: var(--app-sidebar-width, 240px) 1fr;
-  grid-template-rows: var(--app-header-height, 60px) 1fr;
-  min-height: 100vh;
-  width: 100%;
-  overflow: hidden;
-}
-
-.app-header {
-  grid-column: 1 / -1;
-  grid-row: 1;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  width: 100%;
-  z-index: 40;
-}
-
-.sidebar {
-  grid-column: 1;
-  grid-row: 2;
-  display: flex;
-  flex-direction: column;
-  overflow-y: auto;
-  overflow-x: hidden;
-  z-index: 30;
-}
-
-.app-main {
-  grid-column: 2;
-  grid-row: 2;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  position: relative;
-  z-index: 10;
-}
-
-/* ==========================================================================
-   Flexbox Utilities
-   ========================================================================== */
-
-.flex { display: flex; }
-.flex-col { flex-direction: column; }
-.flex-row { flex-direction: row; }
-.flex-wrap { flex-wrap: wrap; }
-.flex-1 { flex: 1; }
-.flex-auto { flex: auto; }
-.flex-none { flex: none; }
-
-.items-start { align-items: flex-start; }
-.items-center { align-items: center; }
-.items-end { align-items: flex-end; }
-.items-stretch { align-items: stretch; }
-
-.justify-start { justify-content: flex-start; }
-.justify-center { justify-content: center; }
-.justify-end { justify-content: flex-end; }
-.justify-between { justify-content: space-between; }
-.justify-around { justify-content: space-around; }
-
-/* Gap utilities use hardcoded fallbacks since core loads before tokens */
-.gap-1 { gap: 0.25rem; }
-.gap-2 { gap: 0.5rem; }
-.gap-3 { gap: 0.75rem; }
-.gap-4 { gap: 1rem; }
-.gap-5 { gap: 1.25rem; }
-.gap-6 { gap: 1.5rem; }
-
-/* ==========================================================================
-   Grid Utilities
-   ========================================================================== */
-
-.grid { display: grid; }
-.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
-.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
-.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
-.grid-auto-fill { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
-
-/* ==========================================================================
-   Visibility & Display
-   ========================================================================== */
-
-.hidden { display: none !important; }
-.block { display: block; }
-.inline-block { display: inline-block; }
-.inline { display: inline; }
-
-.sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border: 0;
-}
-
-/* ==========================================================================
-   Overflow & Scroll
-   ========================================================================== */
-
-.overflow-hidden { overflow: hidden; }
-.overflow-auto { overflow: auto; }
-.overflow-x-auto { overflow-x: auto; }
-.overflow-y-auto { overflow-y: auto; }
-.overflow-scroll { overflow: scroll; }
-
-/* ==========================================================================
-   Position
-   ========================================================================== */
-
-.relative { position: relative; }
-.absolute { position: absolute; }
-.fixed { position: fixed; }
-.sticky { position: sticky; }
-
-.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
-.top-0 { top: 0; }
-.right-0 { right: 0; }
-.bottom-0 { bottom: 0; }
-.left-0 { left: 0; }
-
-/* ==========================================================================
-   Width & Height
-   ========================================================================== */
-
-.w-full { width: 100%; }
-.w-auto { width: auto; }
-.h-full { height: 100%; }
-.h-auto { height: auto; }
-.min-h-screen { min-height: 100vh; }
-
-/* ==========================================================================
-   Responsive Breakpoints
-   ========================================================================== */
-
-@media (max-width: 1024px) {
-  .app-layout {
-    grid-template-columns: var(--app-sidebar-width-tablet, 200px) 1fr;
-  }
-}
-
-@media (max-width: 768px) {
-  .app-layout {
-    grid-template-columns: 1fr;
-    grid-template-rows: var(--app-header-height, 60px) 1fr;
-  }
-
-  .sidebar {
-    position: fixed;
-    top: var(--app-header-height, 60px);
-    left: 0;
-    bottom: 0;
-    width: var(--app-sidebar-width, 240px);
-    transform: translateX(-100%);
-    transition: transform 0.3s ease;
-    z-index: 50;
-  }
-
-  .sidebar.open {
-    transform: translateX(0);
-  }
-
-  .app-main {
-    grid-column: 1;
-  }
-}
diff --git a/admin-ui/css/dss-integrations.css b/admin-ui/css/dss-integrations.css
deleted file mode 100644
index 608205f..0000000
--- a/admin-ui/css/dss-integrations.css
+++ /dev/null
@@ -1,6 +0,0 @@
-/* Design System Integrations CSS
- * This file contains integration-specific styles for third-party components
- * and external library theming.
- */
-
-/* Placeholder for future integrations */
diff --git a/admin-ui/css/dss-theme.css b/admin-ui/css/dss-theme.css
deleted file mode 100644
index 367bb23..0000000
--- a/admin-ui/css/dss-theme.css
+++ /dev/null
@@ -1,208 +0,0 @@
-/**
- * DSS Theme - Layer 2 (Semantic Mapping)
- *
- * Maps design tokens to semantic purposes.
- * This layer creates the bridge between raw design tokens
- * and component-specific styling.
- *
- * FIRST PRINCIPLES:
- * - No fallback values - tokens layer MUST load first
- * - If tokens are missing, theme-loader.js handles it with fallback CSS file
- * - Components should use these semantic tokens, not raw tokens directly
- */
-
-:root {
-  /* ==========================================================================
-     App Shell Semantic Tokens
-     ========================================================================== */
-
-  /* Header */
-  --header-bg: var(--ds-color-surface-0);
-  --header-border: var(--ds-color-border);
-  --header-text: var(--ds-color-foreground);
-  --header-height: var(--app-header-height);
-
-  /* Sidebar */
-  --sidebar-bg: var(--ds-color-surface-0);
-  --sidebar-border: var(--ds-color-border);
-  --sidebar-text: var(--ds-color-foreground);
-  --sidebar-width: var(--app-sidebar-width);
-
-  /* Main Content */
-  --main-bg: var(--ds-color-background);
-  --main-text: var(--ds-color-foreground);
-
-  /* ==========================================================================
-     Navigation Semantic Tokens
-     ========================================================================== */
-
-  --nav-item-text: var(--ds-color-foreground);
-  --nav-item-text-muted: var(--ds-color-muted-foreground);
-  --nav-item-bg-hover: var(--ds-color-accent);
-  --nav-item-bg-active: var(--ds-color-accent);
-  --nav-item-text-active: var(--ds-color-primary);
-  --nav-item-border-focus: var(--ds-color-ring);
-  --nav-section-title: var(--ds-color-muted-foreground);
-  --nav-item-radius: var(--ds-radius-md);
-  --nav-item-padding: var(--ds-space-3);
-  --nav-item-gap: var(--ds-space-3);
-
-  /* ==========================================================================
-     Button Semantic Tokens
-     ========================================================================== */
-
-  /* Default Button */
-  --button-bg: var(--ds-color-primary);
-  --button-text: var(--ds-color-primary-foreground);
-  --button-border: var(--ds-color-primary);
-  --button-bg-hover: hsl(var(--ds-color-primary-h) var(--ds-color-primary-s) calc(var(--ds-color-primary-l) + 10%));
-
-  /* Secondary Button */
-  --button-secondary-bg: var(--ds-color-secondary);
-  --button-secondary-text: var(--ds-color-secondary-foreground);
-
-  /* Ghost Button */
-  --button-ghost-bg: transparent;
-  --button-ghost-text: var(--ds-color-foreground);
-  --button-ghost-bg-hover: var(--ds-color-accent);
-
-  /* Outline Button */
-  --button-outline-bg: transparent;
-  --button-outline-text: var(--ds-color-foreground);
-  --button-outline-border: var(--ds-color-border);
-  --button-outline-bg-hover: var(--ds-color-accent);
-
-  /* Button Sizing */
-  --button-padding-x: var(--ds-space-4);
-  --button-padding-y: var(--ds-space-2);
-  --button-radius: var(--ds-radius-md);
-  --button-font-size: var(--ds-font-size-sm);
-  --button-font-weight: var(--ds-font-weight-medium);
-
-  /* ==========================================================================
-     Card Semantic Tokens
-     ========================================================================== */
-
-  --card-bg: var(--ds-color-surface-0);
-  --card-border: var(--ds-color-border);
-  --card-text: var(--ds-color-foreground);
-  --card-text-muted: var(--ds-color-muted-foreground);
-  --card-radius: var(--ds-radius-lg);
-  --card-padding: var(--ds-space-5);
-  --card-shadow: var(--ds-shadow-sm);
-  --card-shadow-hover: var(--ds-shadow-md);
-
-  /* ==========================================================================
-     Input Semantic Tokens
-     ========================================================================== */
-
-  --input-bg: var(--ds-color-background);
-  --input-text: var(--ds-color-foreground);
-  --input-placeholder: var(--ds-color-muted-foreground);
-  --input-border: var(--ds-color-border);
-  --input-border-focus: var(--ds-color-ring);
-  --input-radius: var(--ds-radius-md);
-  --input-padding-x: var(--ds-space-3);
-  --input-padding-y: var(--ds-space-2);
-
-  /* ==========================================================================
-     Badge Semantic Tokens
-     ========================================================================== */
-
-  --badge-bg: var(--ds-color-primary);
-  --badge-text: var(--ds-color-primary-foreground);
-  --badge-radius: var(--ds-radius-full);
-  --badge-padding-x: var(--ds-space-2-5);
-  --badge-padding-y: var(--ds-space-0-5);
-  --badge-font-size: var(--ds-font-size-xs);
-
-  /* Badge Variants */
-  --badge-secondary-bg: var(--ds-color-secondary);
-  --badge-secondary-text: var(--ds-color-secondary-foreground);
-  --badge-outline-bg: transparent;
-  --badge-outline-text: var(--ds-color-foreground);
-  --badge-outline-border: var(--ds-color-border);
-  --badge-success-bg: var(--ds-color-success);
-  --badge-success-text: var(--ds-color-success-foreground);
-  --badge-warning-bg: var(--ds-color-warning);
-  --badge-warning-text: var(--ds-color-warning-foreground);
-  --badge-error-bg: var(--ds-color-error);
-  --badge-error-text: var(--ds-color-error-foreground);
-
-  /* ==========================================================================
-     Landing Page Semantic Tokens
-     ========================================================================== */
-
-  --landing-bg: var(--ds-color-background);
-  --landing-hero-text: var(--ds-color-foreground);
-  --landing-hero-subtitle: var(--ds-color-muted-foreground);
-
-  /* Dashboard Card */
-  --dashboard-card-bg: var(--ds-color-surface-0);
-  --dashboard-card-border: var(--ds-color-border);
-  --dashboard-card-border-hover: var(--ds-color-accent);
-  --dashboard-card-text: var(--ds-color-foreground);
-  --dashboard-card-text-muted: var(--ds-color-muted-foreground);
-  --dashboard-card-shadow-hover: var(--ds-shadow-md);
-
-  /* Category Title */
-  --category-title-text: var(--ds-color-foreground);
-  --category-title-border: var(--ds-color-border);
-
-  /* ==========================================================================
-     Toast/Notification Semantic Tokens
-     ========================================================================== */
-
-  --toast-bg: var(--ds-color-surface-0);
-  --toast-text: var(--ds-color-foreground);
-  --toast-border: var(--ds-color-border);
-  --toast-shadow: var(--ds-shadow-lg);
-  --toast-radius: var(--ds-radius-lg);
-
-  --toast-success-bg: var(--ds-color-success);
-  --toast-success-text: var(--ds-color-success-foreground);
-  --toast-warning-bg: var(--ds-color-warning);
-  --toast-warning-text: var(--ds-color-warning-foreground);
-  --toast-error-bg: var(--ds-color-error);
-  --toast-error-text: var(--ds-color-error-foreground);
-  --toast-info-bg: var(--ds-color-info);
-  --toast-info-text: var(--ds-color-info-foreground);
-
-  /* ==========================================================================
-     Avatar Semantic Tokens
-     ========================================================================== */
-
-  --avatar-bg: var(--ds-color-muted);
-  --avatar-text: var(--ds-color-foreground);
-  --avatar-border: var(--ds-color-border);
-  --avatar-size-sm: 32px;
-  --avatar-size-md: 40px;
-  --avatar-size-lg: 48px;
-
-  /* ==========================================================================
-     Help Panel Semantic Tokens
-     ========================================================================== */
-
-  --help-panel-bg: var(--ds-color-surface-1);
-  --help-panel-border: var(--ds-color-border);
-  --help-panel-text: var(--ds-color-foreground);
-  --help-panel-text-muted: var(--ds-color-muted-foreground);
-
-  /* ==========================================================================
-     Typography Semantic Tokens
-     ========================================================================== */
-
-  --text-heading: var(--ds-color-foreground);
-  --text-body: var(--ds-color-foreground);
-  --text-muted: var(--ds-color-muted-foreground);
-  --text-link: var(--ds-color-primary);
-  --text-link-hover: hsl(var(--ds-color-primary-h) var(--ds-color-primary-s) calc(var(--ds-color-primary-l) + 20%));
-
-  /* ==========================================================================
-     Focus Ring
-     ========================================================================== */
-
-  --focus-ring-width: 2px;
-  --focus-ring-color: var(--ds-color-ring);
-  --focus-ring-offset: 2px;
-}
diff --git a/admin-ui/css/dss-tokens.css b/admin-ui/css/dss-tokens.css
deleted file mode 100644
index fb5616b..0000000
--- a/admin-ui/css/dss-tokens.css
+++ /dev/null
@@ -1,246 +0,0 @@
-/**
- * DSS Design Tokens - Layer 1
- *
- * Design decisions expressed as CSS custom properties.
- * These tokens can be:
- * 1. Generated from Figma using DSS extraction tools
- * 2. Manually defined in a design-tokens.json file
- * 3. Use the fallback defaults defined here
- *
- * Format follows W3C Design Tokens specification.
- * All values include fallbacks for bootstrap scenario.
- */
-
-:root {
-  /* ==========================================================================
-     Color Tokens - HSL Format
-     ========================================================================== */
-
-  /* Primary Colors */
-  --ds-color-primary-h: 220;
-  --ds-color-primary-s: 14%;
-  --ds-color-primary-l: 10%;
-  --ds-color-primary: hsl(var(--ds-color-primary-h) var(--ds-color-primary-s) var(--ds-color-primary-l));
-  --ds-color-primary-foreground: hsl(0 0% 100%);
-
-  /* Secondary Colors */
-  --ds-color-secondary-h: 220;
-  --ds-color-secondary-s: 9%;
-  --ds-color-secondary-l: 46%;
-  --ds-color-secondary: hsl(var(--ds-color-secondary-h) var(--ds-color-secondary-s) var(--ds-color-secondary-l));
-  --ds-color-secondary-foreground: hsl(0 0% 100%);
-
-  /* Accent Colors */
-  --ds-color-accent-h: 220;
-  --ds-color-accent-s: 9%;
-  --ds-color-accent-l: 96%;
-  --ds-color-accent: hsl(var(--ds-color-accent-h) var(--ds-color-accent-s) var(--ds-color-accent-l));
-  --ds-color-accent-foreground: hsl(220 14% 10%);
-
-  /* Background Colors */
-  --ds-color-background: hsl(0 0% 100%);
-  --ds-color-foreground: hsl(220 14% 10%);
-
-  /* Surface Colors */
-  --ds-color-surface-0: hsl(0 0% 100%);
-  --ds-color-surface-1: hsl(220 14% 98%);
-  --ds-color-surface-2: hsl(220 9% 96%);
-  --ds-color-surface-3: hsl(220 9% 94%);
-
-  /* Muted Colors */
-  --ds-color-muted: hsl(220 9% 96%);
-  --ds-color-muted-foreground: hsl(220 9% 46%);
-
-  /* Border Colors */
-  --ds-color-border: hsl(220 9% 89%);
-  --ds-color-border-strong: hsl(220 9% 80%);
-
-  /* State Colors */
-  --ds-color-success: hsl(142 76% 36%);
-  --ds-color-success-foreground: hsl(0 0% 100%);
-  --ds-color-warning: hsl(38 92% 50%);
-  --ds-color-warning-foreground: hsl(0 0% 0%);
-  --ds-color-error: hsl(0 84% 60%);
-  --ds-color-error-foreground: hsl(0 0% 100%);
-  --ds-color-info: hsl(199 89% 48%);
-  --ds-color-info-foreground: hsl(0 0% 100%);
-
-  /* Ring/Focus Color */
-  --ds-color-ring: hsl(220 14% 10%);
-
-  /* ==========================================================================
-     Spacing Scale
-     ========================================================================== */
-
-  --ds-space-0: 0;
-  --ds-space-px: 1px;
-  --ds-space-0-5: 0.125rem;  /* 2px */
-  --ds-space-1: 0.25rem;     /* 4px */
-  --ds-space-1-5: 0.375rem;  /* 6px */
-  --ds-space-2: 0.5rem;      /* 8px */
-  --ds-space-2-5: 0.625rem;  /* 10px */
-  --ds-space-3: 0.75rem;     /* 12px */
-  --ds-space-3-5: 0.875rem;  /* 14px */
-  --ds-space-4: 1rem;        /* 16px */
-  --ds-space-5: 1.25rem;     /* 20px */
-  --ds-space-6: 1.5rem;      /* 24px */
-  --ds-space-7: 1.75rem;     /* 28px */
-  --ds-space-8: 2rem;        /* 32px */
-  --ds-space-9: 2.25rem;     /* 36px */
-  --ds-space-10: 2.5rem;     /* 40px */
-  --ds-space-11: 2.75rem;    /* 44px */
-  --ds-space-12: 3rem;       /* 48px */
-  --ds-space-14: 3.5rem;     /* 56px */
-  --ds-space-16: 4rem;       /* 64px */
-  --ds-space-20: 5rem;       /* 80px */
-  --ds-space-24: 6rem;       /* 96px */
-
-  /* ==========================================================================
-     Typography - Font Sizes
-     ========================================================================== */
-
-  --ds-font-size-xs: 0.75rem;    /* 12px */
-  --ds-font-size-sm: 0.875rem;   /* 14px */
-  --ds-font-size-base: 1rem;     /* 16px */
-  --ds-font-size-lg: 1.125rem;   /* 18px */
-  --ds-font-size-xl: 1.25rem;    /* 20px */
-  --ds-font-size-2xl: 1.5rem;    /* 24px */
-  --ds-font-size-3xl: 1.875rem;  /* 30px */
-  --ds-font-size-4xl: 2.25rem;   /* 36px */
-  --ds-font-size-5xl: 3rem;      /* 48px */
-
-  /* ==========================================================================
-     Typography - Font Weights
-     ========================================================================== */
-
-  --ds-font-weight-thin: 100;
-  --ds-font-weight-extralight: 200;
-  --ds-font-weight-light: 300;
-  --ds-font-weight-normal: 400;
-  --ds-font-weight-medium: 500;
-  --ds-font-weight-semibold: 600;
-  --ds-font-weight-bold: 700;
-  --ds-font-weight-extrabold: 800;
-  --ds-font-weight-black: 900;
-
-  /* ==========================================================================
-     Typography - Line Heights
-     ========================================================================== */
-
-  --ds-line-height-none: 1;
-  --ds-line-height-tight: 1.25;
-  --ds-line-height-snug: 1.375;
-  --ds-line-height-normal: 1.5;
-  --ds-line-height-relaxed: 1.625;
-  --ds-line-height-loose: 2;
-
-  /* ==========================================================================
-     Typography - Letter Spacing
-     ========================================================================== */
-
-  --ds-letter-spacing-tighter: -0.05em;
-  --ds-letter-spacing-tight: -0.025em;
-  --ds-letter-spacing-normal: 0;
-  --ds-letter-spacing-wide: 0.025em;
-  --ds-letter-spacing-wider: 0.05em;
-  --ds-letter-spacing-widest: 0.1em;
-
-  /* ==========================================================================
-     Typography - Font Families
-     ========================================================================== */
-
-  --ds-font-family-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-  --ds-font-family-serif: Georgia, Cambria, 'Times New Roman', Times, serif;
-  --ds-font-family-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
-
-  /* ==========================================================================
-     Border Radius
-     ========================================================================== */
-
-  --ds-radius-none: 0;
-  --ds-radius-sm: 0.125rem;   /* 2px */
-  --ds-radius-md: 0.375rem;   /* 6px */
-  --ds-radius-lg: 0.5rem;     /* 8px */
-  --ds-radius-xl: 0.75rem;    /* 12px */
-  --ds-radius-2xl: 1rem;      /* 16px */
-  --ds-radius-full: 9999px;
-
-  /* ==========================================================================
-     Shadows
-     ========================================================================== */
-
-  --ds-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
-  --ds-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-  --ds-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
-  --ds-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
-  --ds-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
-  --ds-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
-  --ds-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
-  --ds-shadow-none: 0 0 #0000;
-
-  /* ==========================================================================
-     Transitions
-     ========================================================================== */
-
-  --ds-transition-fast: 150ms;
-  --ds-transition-normal: 200ms;
-  --ds-transition-slow: 300ms;
-  --ds-transition-slower: 500ms;
-
-  --ds-ease-linear: linear;
-  --ds-ease-in: cubic-bezier(0.4, 0, 1, 1);
-  --ds-ease-out: cubic-bezier(0, 0, 0.2, 1);
-  --ds-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
-
-  /* ==========================================================================
-     Z-Index Scale
-     ========================================================================== */
-
-  --ds-z-0: 0;
-  --ds-z-10: 10;
-  --ds-z-20: 20;
-  --ds-z-30: 30;
-  --ds-z-40: 40;
-  --ds-z-50: 50;
-  --ds-z-auto: auto;
-
-  /* ==========================================================================
-     App-Specific Structural Tokens
-     ========================================================================== */
-
-  --app-header-height: 60px;
-  --app-sidebar-width: 240px;
-  --app-sidebar-width-tablet: 200px;
-}
-
-/* ==========================================================================
-   Dark Mode Tokens
-   ========================================================================== */
-
-[data-theme="dark"],
-.dark {
-  --ds-color-primary-h: 220;
-  --ds-color-primary-s: 14%;
-  --ds-color-primary-l: 90%;
-  --ds-color-primary: hsl(var(--ds-color-primary-h) var(--ds-color-primary-s) var(--ds-color-primary-l));
-  --ds-color-primary-foreground: hsl(220 14% 10%);
-
-  --ds-color-background: hsl(220 14% 10%);
-  --ds-color-foreground: hsl(220 9% 94%);
-
-  --ds-color-surface-0: hsl(220 14% 10%);
-  --ds-color-surface-1: hsl(220 14% 14%);
-  --ds-color-surface-2: hsl(220 14% 18%);
-  --ds-color-surface-3: hsl(220 14% 22%);
-
-  --ds-color-muted: hsl(220 14% 18%);
-  --ds-color-muted-foreground: hsl(220 9% 60%);
-
-  --ds-color-border: hsl(220 14% 22%);
-  --ds-color-border-strong: hsl(220 14% 30%);
-
-  --ds-color-accent: hsl(220 14% 18%);
-  --ds-color-accent-foreground: hsl(220 9% 94%);
-
-  --ds-color-ring: hsl(220 9% 80%);
-}
diff --git a/admin-ui/js/components/admin/ds-admin-settings.js b/admin-ui/js/components/admin/ds-admin-settings.js
deleted file mode 100644
index 613ca7b..0000000
--- a/admin-ui/js/components/admin/ds-admin-settings.js
+++ /dev/null
@@ -1,259 +0,0 @@
-/**
- * ds-admin-settings.js
- * Admin settings panel for DSS configuration
- * Allows configuration of hostname, port, and local/remote setup
- */
-
-import { useAdminStore } from '../../stores/admin-store.js';
-
-export default class AdminSettings extends HTMLElement {
-  constructor() {
-    super();
-    this.adminStore = useAdminStore();
-    this.state = this.adminStore.getState();
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    this.unsubscribe = this.adminStore.subscribe(() => {
-      this.state = this.adminStore.getState();
-      this.updateUI();
-    });
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) this.unsubscribe();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; max-width: 600px;">
-        <h2 style="margin-bottom: 24px; font-size: 20px;">DSS Settings</h2>
-
-        <!-- Hostname Setting -->
-        <div style="margin-bottom: 24px;">
-          <label style="display: block; margin-bottom: 8px; font-weight: 500;">
-            Hostname
-          </label>
-          <input
-            id="hostname-input"
-            type="text"
-            value="${this.state.hostname}"
-            style="
-              width: 100%;
-              padding: 8px 12px;
-              border: 1px solid var(--vscode-input-border);
-              background: var(--vscode-input-background);
-              color: var(--vscode-foreground);
-              border-radius: 4px;
-              font-family: monospace;
-            "
-            placeholder="localhost or IP address"
-          />
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">
-            Default: localhost
-          </div>
-        </div>
-
-        <!-- Port Setting -->
-        <div style="margin-bottom: 24px;">
-          <label style="display: block; margin-bottom: 8px; font-weight: 500;">
-            Storybook Port
-          </label>
-          <input
-            id="port-input"
-            type="number"
-            value="${this.state.port}"
-            style="
-              width: 100%;
-              padding: 8px 12px;
-              border: 1px solid var(--vscode-input-border);
-              background: var(--vscode-input-background);
-              color: var(--vscode-foreground);
-              border-radius: 4px;
-              font-family: monospace;
-            "
-            placeholder="6006"
-            min="1"
-            max="65535"
-          />
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">
-            Default: 6006 (Storybook standard port)
-          </div>
-        </div>
-
-        <!-- DSS Setup Type -->
-        <div style="margin-bottom: 24px;">
-          <label style="display: block; margin-bottom: 12px; font-weight: 500;">
-            DSS Setup Type
-          </label>
-          <div style="display: flex; gap: 16px;">
-            <label style="display: flex; align-items: center; cursor: pointer;">
-              <input
-                type="radio"
-                name="setup-type"
-                value="local"
-                ${this.state.isRemote ? '' : 'checked'}
-                style="margin-right: 8px;"
-              />
-              <span>Local</span>
-            </label>
-            <label style="display: flex; align-items: center; cursor: pointer;">
-              <input
-                type="radio"
-                name="setup-type"
-                value="remote"
-                ${this.state.isRemote ? 'checked' : ''}
-                style="margin-right: 8px;"
-              />
-              <span>Remote (Headless)</span>
-            </label>
-          </div>
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 8px;">
-            <strong>Local:</strong> Uses browser devtools and local services<br/>
-            <strong>Remote:</strong> Uses headless tools and MCP providers
-          </div>
-        </div>
-
-        <!-- Current Configuration Display -->
-        <div style="
-          background: var(--vscode-sidebar);
-          border: 1px solid var(--vscode-border);
-          border-radius: 4px;
-          padding: 12px;
-          margin-bottom: 24px;
-        ">
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px;">CURRENT STORYBOOK URL:</div>
-          <div style="
-            font-family: monospace;
-            font-size: 12px;
-            word-break: break-all;
-            color: var(--vscode-foreground);
-          " id="storybook-url-display">
-            ${this.getStorybookUrlDisplay()}
-          </div>
-        </div>
-
-        <!-- Action Buttons -->
-        <div style="display: flex; gap: 8px;">
-          <button
-            id="save-btn"
-            style="
-              padding: 8px 16px;
-              background: var(--vscode-button-background);
-              color: var(--vscode-button-foreground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-            "
-          >
-            Save Settings
-          </button>
-          <button
-            id="reset-btn"
-            style="
-              padding: 8px 16px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-            "
-          >
-            Reset to Defaults
-          </button>
-        </div>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    const hostnameInput = this.querySelector('#hostname-input');
-    const portInput = this.querySelector('#port-input');
-    const setupTypeRadios = this.querySelectorAll('input[name="setup-type"]');
-    const saveBtn = this.querySelector('#save-btn');
-    const resetBtn = this.querySelector('#reset-btn');
-
-    // Update on input (but don't save immediately)
-    hostnameInput.addEventListener('change', () => {
-      this.adminStore.setHostname(hostnameInput.value);
-    });
-
-    portInput.addEventListener('change', () => {
-      const port = parseInt(portInput.value);
-      if (port > 0 && port <= 65535) {
-        this.adminStore.setPort(port);
-      }
-    });
-
-    setupTypeRadios.forEach(radio => {
-      radio.addEventListener('change', (e) => {
-        this.adminStore.setRemote(e.target.value === 'remote');
-      });
-    });
-
-    saveBtn.addEventListener('click', () => {
-      this.showNotification('Settings saved successfully!');
-      console.log('[AdminSettings] Settings saved:', this.adminStore.getState());
-    });
-
-    resetBtn.addEventListener('click', () => {
-      if (confirm('Reset all settings to defaults?')) {
-        this.adminStore.reset();
-        this.render();
-        this.setupEventListeners();
-        this.showNotification('Settings reset to defaults');
-      }
-    });
-  }
-
-  updateUI() {
-    const hostnameInput = this.querySelector('#hostname-input');
-    const portInput = this.querySelector('#port-input');
-    const setupTypeRadios = this.querySelectorAll('input[name="setup-type"]');
-    const urlDisplay = this.querySelector('#storybook-url-display');
-
-    if (hostnameInput) hostnameInput.value = this.state.hostname;
-    if (portInput) portInput.value = this.state.port;
-
-    setupTypeRadios.forEach(radio => {
-      radio.checked = (radio.value === 'remote') === this.state.isRemote;
-    });
-
-    if (urlDisplay) {
-      urlDisplay.textContent = this.getStorybookUrlDisplay();
-    }
-  }
-
-  getStorybookUrlDisplay() {
-    return this.adminStore.getStorybookUrl('default');
-  }
-
-  showNotification(message) {
-    const notification = document.createElement('div');
-    notification.textContent = message;
-    notification.style.cssText = `
-      position: fixed;
-      bottom: 20px;
-      right: 20px;
-      background: var(--vscode-notifications-background);
-      color: var(--vscode-foreground);
-      padding: 12px 16px;
-      border-radius: 4px;
-      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
-      z-index: 1000;
-      animation: slideIn 0.3s ease;
-    `;
-    document.body.appendChild(notification);
-
-    setTimeout(() => {
-      notification.style.animation = 'slideOut 0.3s ease';
-      setTimeout(() => notification.remove(), 300);
-    }, 3000);
-  }
-}
-
-customElements.define('ds-admin-settings', AdminSettings);
diff --git a/admin-ui/js/components/admin/ds-project-list.js b/admin-ui/js/components/admin/ds-project-list.js
deleted file mode 100644
index cb5aa56..0000000
--- a/admin-ui/js/components/admin/ds-project-list.js
+++ /dev/null
@@ -1,324 +0,0 @@
-/**
- * ds-project-list.js
- * Project management component
- * Create, edit, delete, and select projects
- */
-
-import { useProjectStore } from '../../stores/project-store.js';
-
-export default class ProjectList extends HTMLElement {
-  constructor() {
-    super();
-    this.projectStore = useProjectStore();
-    this.state = {
-      projects: this.projectStore.getProjects(),
-      currentProject: this.projectStore.getCurrentProject(),
-      showEditModal: false,
-      editingProject: null
-    };
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    this.unsubscribe = this.projectStore.subscribe(() => {
-      this.state.projects = this.projectStore.getProjects();
-      this.state.currentProject = this.projectStore.getCurrentProject();
-      this.updateProjectList();
-    });
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) this.unsubscribe();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px;">
-        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px;">
-          <h2 style="margin: 0; font-size: 20px;">Projects</h2>
-          <button id="create-project-btn" style="
-            padding: 8px 16px;
-            background: var(--vscode-button-background);
-            color: var(--vscode-button-foreground);
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-weight: 500;
-          ">
-            + New Project
-          </button>
-        </div>
-
-        <!-- Projects List -->
-        <div id="projects-container" style="display: flex; flex-direction: column; gap: 12px;">
-          ${this.renderProjectsList()}
-        </div>
-      </div>
-
-      <!-- Edit Modal -->
-      <div id="edit-modal" style="
-        display: ${this.state.showEditModal ? 'flex' : 'none'};
-        position: fixed;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-        background: rgba(0, 0, 0, 0.5);
-        align-items: center;
-        justify-content: center;
-        z-index: 1000;
-      ">
-        <div style="
-          background: var(--vscode-editor-background);
-          border: 1px solid var(--vscode-border);
-          border-radius: 8px;
-          padding: 24px;
-          min-width: 400px;
-          max-width: 500px;
-          box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
-        ">
-          <h3 id="modal-title" style="margin: 0 0 16px 0; font-size: 18px;">
-            ${this.state.editingProject ? 'Edit Project' : 'New Project'}
-          </h3>
-
-          <!-- Project ID -->
-          <div style="margin-bottom: 16px;">
-            <label style="display: block; margin-bottom: 6px; font-size: 12px; font-weight: 500;">
-              Project ID (Jira Key)
-            </label>
-            <input
-              id="modal-project-id"
-              type="text"
-              ${this.state.editingProject ? 'disabled' : ''}
-              value="${this.state.editingProject?.id || ''}"
-              placeholder="E.g., DSS-123"
-              style="
-                width: 100%;
-                padding: 8px 12px;
-                border: 1px solid var(--vscode-input-border);
-                background: var(--vscode-input-background);
-                color: var(--vscode-foreground);
-                border-radius: 4px;
-                font-family: monospace;
-              "
-            />
-            <div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 4px;">
-              ${this.state.editingProject ? 'Cannot change after creation' : 'Must match Jira project key'}
-            </div>
-          </div>
-
-          <!-- Project Name -->
-          <div style="margin-bottom: 16px;">
-            <label style="display: block; margin-bottom: 6px; font-size: 12px; font-weight: 500;">
-              Project Name
-            </label>
-            <input
-              id="modal-project-name"
-              type="text"
-              value="${this.state.editingProject?.name || ''}"
-              placeholder="My Design System"
-              style="
-                width: 100%;
-                padding: 8px 12px;
-                border: 1px solid var(--vscode-input-border);
-                background: var(--vscode-input-background);
-                color: var(--vscode-foreground);
-                border-radius: 4px;
-              "
-            />
-          </div>
-
-          <!-- Skin Selection -->
-          <div style="margin-bottom: 24px;">
-            <label style="display: block; margin-bottom: 6px; font-size: 12px; font-weight: 500;">
-              Default Skin
-            </label>
-            <select
-              id="modal-skin-select"
-              style="
-                width: 100%;
-                padding: 8px 12px;
-                border: 1px solid var(--vscode-input-border);
-                background: var(--vscode-input-background);
-                color: var(--vscode-foreground);
-                border-radius: 4px;
-              "
-            >
-              <option value="default" ${this.state.editingProject?.skinSelected === 'default' ? 'selected' : ''}>default</option>
-              <option value="light" ${this.state.editingProject?.skinSelected === 'light' ? 'selected' : ''}>light</option>
-              <option value="dark" ${this.state.editingProject?.skinSelected === 'dark' ? 'selected' : ''}>dark</option>
-            </select>
-          </div>
-
-          <!-- Buttons -->
-          <div style="display: flex; gap: 8px; justify-content: flex-end;">
-            <button id="modal-cancel-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-            ">
-              Cancel
-            </button>
-            <button id="modal-save-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-background);
-              color: var(--vscode-button-foreground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-            ">
-              ${this.state.editingProject ? 'Update' : 'Create'}
-            </button>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  renderProjectsList() {
-    if (this.state.projects.length === 0) {
-      return '<div style="color: var(--vscode-text-dim); text-align: center; padding: 32px;">No projects yet. Create one to get started!</div>';
-    }
-
-    return this.state.projects.map(project => `
-      <div data-project-id="${project.id}" style="
-        display: flex;
-        align-items: center;
-        gap: 12px;
-        padding: 12px;
-        background: ${this.state.currentProject?.id === project.id ? 'var(--vscode-selection)' : 'var(--vscode-sidebar)'};
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        cursor: pointer;
-        transition: background 0.2s;
-      " onmouseover="this.style.background='var(--vscode-selection)'" onmouseout="this.style.background='${this.state.currentProject?.id === project.id ? 'var(--vscode-selection)' : 'var(--vscode-sidebar)'}'">
-        <div style="flex: 1;">
-          <div style="font-weight: 500; margin-bottom: 4px;">${project.name}</div>
-          <div style="font-size: 11px; color: var(--vscode-text-dim);">
-            ID: ${project.id} | Skin: ${project.skinSelected}
-          </div>
-        </div>
-        <div style="display: flex; gap: 4px;">
-          <button class="edit-project-btn" data-project-id="${project.id}" style="
-            padding: 4px 8px;
-            background: var(--vscode-button-secondaryBackground);
-            color: var(--vscode-button-secondaryForeground);
-            border: none;
-            border-radius: 2px;
-            cursor: pointer;
-            font-size: 11px;
-          ">
-            Edit
-          </button>
-          <button class="delete-project-btn" data-project-id="${project.id}" style="
-            padding: 4px 8px;
-            background: #c1272d;
-            color: white;
-            border: none;
-            border-radius: 2px;
-            cursor: pointer;
-            font-size: 11px;
-          ">
-            Delete
-          </button>
-        </div>
-      </div>
-    `).join('');
-  }
-
-  setupEventListeners() {
-    // Create button
-    this.querySelector('#create-project-btn').addEventListener('click', () => {
-      this.state.editingProject = null;
-      this.state.showEditModal = true;
-      this.render();
-      this.setupEventListeners();
-    });
-
-    // Project selection
-    this.querySelectorAll('[data-project-id]').forEach(el => {
-      el.addEventListener('click', (e) => {
-        if (!e.target.closest('button')) {
-          const projectId = el.dataset.projectId;
-          this.projectStore.selectProject(projectId);
-        }
-      });
-    });
-
-    // Edit buttons
-    this.querySelectorAll('.edit-project-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const projectId = btn.dataset.projectId;
-        this.state.editingProject = this.projectStore.getProject(projectId);
-        this.state.showEditModal = true;
-        this.render();
-        this.setupEventListeners();
-      });
-    });
-
-    // Delete buttons
-    this.querySelectorAll('.delete-project-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const projectId = btn.dataset.projectId;
-        const project = this.projectStore.getProject(projectId);
-        if (confirm(`Delete project "${project.name}"? This cannot be undone.`)) {
-          this.projectStore.deleteProject(projectId);
-        }
-      });
-    });
-
-    // Modal buttons
-    const modal = this.querySelector('#edit-modal');
-    if (modal) {
-      this.querySelector('#modal-cancel-btn').addEventListener('click', () => {
-        this.state.showEditModal = false;
-        this.state.editingProject = null;
-        this.render();
-      });
-
-      this.querySelector('#modal-save-btn').addEventListener('click', () => {
-        const id = this.querySelector('#modal-project-id').value.trim();
-        const name = this.querySelector('#modal-project-name').value.trim();
-        const skin = this.querySelector('#modal-skin-select').value;
-
-        if (!id || !name) {
-          alert('Please fill in all fields');
-          return;
-        }
-
-        if (this.state.editingProject) {
-          // Update
-          this.projectStore.updateProject(this.state.editingProject.id, {
-            name,
-            skinSelected: skin
-          });
-        } else {
-          // Create
-          this.projectStore.createProject({ id, name, skinSelected: skin });
-        }
-
-        this.state.showEditModal = false;
-        this.state.editingProject = null;
-        this.render();
-        this.setupEventListeners();
-      });
-    }
-  }
-
-  updateProjectList() {
-    const container = this.querySelector('#projects-container');
-    if (container) {
-      container.innerHTML = this.renderProjectsList();
-      this.setupEventListeners();
-    }
-  }
-}
-
-customElements.define('ds-project-list', ProjectList);
diff --git a/admin-ui/js/components/admin/ds-user-settings.js b/admin-ui/js/components/admin/ds-user-settings.js
deleted file mode 100644
index a601541..0000000
--- a/admin-ui/js/components/admin/ds-user-settings.js
+++ /dev/null
@@ -1,434 +0,0 @@
-/**
- * ds-user-settings.js
- * User settings page component
- * Manages user profile, preferences, integrations, and account settings
- * MVP3: Full integration with backend API and user-store
- */
-
-import { useUserStore } from '../../stores/user-store.js';
-
-export default class DSUserSettings extends HTMLElement {
-  constructor() {
-    super();
-    this.userStore = useUserStore();
-    this.activeTab = 'profile';
-    this.isLoading = false;
-    this.formChanges = {};
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    this.subscribeToUserStore();
-  }
-
-  subscribeToUserStore() {
-    this.unsubscribe = this.userStore.subscribe(() => {
-      this.updateUI();
-    });
-  }
-
-  render() {
-    const user = this.userStore.getCurrentUser();
-    const displayName = this.userStore.getDisplayName();
-    const avatar = this.userStore.getAvatar();
-
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%; background: var(--vscode-bg);">
-        <!-- Header -->
-        <div style="padding: 24px; border-bottom: 1px solid var(--vscode-border);">
-          <div style="display: flex; align-items: center; gap: 16px; margin-bottom: 24px;">
-            <img src="${avatar}" alt="Avatar" style="width: 64px; height: 64px; border-radius: 8px; background: var(--vscode-sidebar);" />
-            <div>
-              <h1 style="margin: 0 0 4px 0; font-size: 24px;">${displayName}</h1>
-              <p style="margin: 0; color: var(--vscode-text-dim); font-size: 12px;">${user?.email || 'Not logged in'}</p>
-            </div>
-          </div>
-        </div>
-
-        <!-- Tabs -->
-        <div style="display: flex; border-bottom: 1px solid var(--vscode-border); padding: 0 24px; gap: 24px; flex-shrink: 0;">
-          <button class="settings-tab" data-tab="profile" style="padding: 12px 0; border: none; background: transparent; color: var(--vscode-text); cursor: pointer; border-bottom: 2px solid transparent; font-size: 13px; transition: all 0.2s;">
-            👤 Profile
-          </button>
-          <button class="settings-tab" data-tab="preferences" style="padding: 12px 0; border: none; background: transparent; color: var(--vscode-text-dim); cursor: pointer; border-bottom: 2px solid transparent; font-size: 13px; transition: all 0.2s;">
-            ⚙️ Preferences
-          </button>
-          <button class="settings-tab" data-tab="integrations" style="padding: 12px 0; border: none; background: transparent; color: var(--vscode-text-dim); cursor: pointer; border-bottom: 2px solid transparent; font-size: 13px; transition: all 0.2s;">
-            🔗 Integrations
-          </button>
-          <button class="settings-tab" data-tab="about" style="padding: 12px 0; border: none; background: transparent; color: var(--vscode-text-dim); cursor: pointer; border-bottom: 2px solid transparent; font-size: 13px; transition: all 0.2s;">
-            ℹ️ About
-          </button>
-        </div>
-
-        <!-- Content -->
-        <div style="flex: 1; overflow-y: auto; padding: 24px;">
-          <!-- Profile Tab -->
-          <div id="profile-tab" class="settings-content">
-            <div style="max-width: 600px;">
-              <h2 style="margin: 0 0 16px 0; font-size: 18px;">Profile Settings</h2>
-
-              <div style="margin-bottom: 16px;">
-                <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 4px;">Full Name</label>
-                <input id="profile-name" type="text" value="${user?.name || ''}" placeholder="Your full name" style="width: 100%; padding: 8px 12px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 4px; font-size: 13px;" />
-              </div>
-
-              <div style="margin-bottom: 16px;">
-                <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 4px;">Email</label>
-                <input id="profile-email" type="email" value="${user?.email || ''}" placeholder="your@email.com" style="width: 100%; padding: 8px 12px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 4px; font-size: 13px;" />
-              </div>
-
-              <div style="margin-bottom: 16px;">
-                <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 4px;">Role</label>
-                <div style="padding: 8px 12px; background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); color: var(--vscode-text-dim); border-radius: 4px; font-size: 13px;">
-                  ${user?.role || 'User'} <span style="color: var(--vscode-text-dim); font-size: 11px;">(Read-only)</span>
-                </div>
-              </div>
-
-              <div style="margin-bottom: 24px;">
-                <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 4px;">Bio</label>
-                <textarea id="profile-bio" placeholder="Tell us about yourself..." style="width: 100%; padding: 8px 12px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 4px; font-size: 13px; min-height: 80px; resize: vertical;" >${user?.bio || ''}</textarea>
-              </div>
-
-              <div style="display: flex; gap: 8px;">
-                <button id="save-profile-btn" style="padding: 8px 16px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 4px; cursor: pointer; font-size: 12px; font-weight: 500;">
-                  Save Changes
-                </button>
-                <button id="change-password-btn" style="padding: 8px 16px; background: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); border: none; border-radius: 4px; cursor: pointer; font-size: 12px; font-weight: 500;">
-                  Change Password
-                </button>
-              </div>
-            </div>
-          </div>
-
-          <!-- Preferences Tab -->
-          <div id="preferences-tab" class="settings-content" style="display: none;">
-            <div style="max-width: 600px;">
-              <h2 style="margin: 0 0 16px 0; font-size: 18px;">Preferences</h2>
-
-              <h3 style="margin: 0 0 12px 0; font-size: 14px; color: var(--vscode-text-dim);">Theme</h3>
-              <div style="margin-bottom: 24px;">
-                <label style="display: flex; align-items: center; gap: 8px; margin-bottom: 8px; cursor: pointer;">
-                  <input type="radio" name="theme" value="dark" checked />
-                  <span style="font-size: 12px;">Dark</span>
-                </label>
-                <label style="display: flex; align-items: center; gap: 8px; cursor: pointer;">
-                  <input type="radio" name="theme" value="light" />
-                  <span style="font-size: 12px;">Light</span>
-                </label>
-              </div>
-
-              <h3 style="margin: 0 0 12px 0; font-size: 14px; color: var(--vscode-text-dim);">Language</h3>
-              <div style="margin-bottom: 24px;">
-                <select id="pref-language" style="padding: 8px 12px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 4px; font-size: 12px; cursor: pointer;">
-                  <option value="en">English</option>
-                  <option value="es">Español</option>
-                  <option value="fr">Français</option>
-                  <option value="de">Deutsch</option>
-                  <option value="ja">日本語</option>
-                </select>
-              </div>
-
-              <h3 style="margin: 0 0 12px 0; font-size: 14px; color: var(--vscode-text-dim);">Notifications</h3>
-              <div style="margin-bottom: 24px;">
-                <label style="display: flex; align-items: center; gap: 8px; margin-bottom: 8px; cursor: pointer;">
-                  <input id="pref-notifications" type="checkbox" checked />
-                  <span style="font-size: 12px;">Enable notifications</span>
-                </label>
-                <label style="display: flex; align-items: center; gap: 8px; margin-bottom: 8px; cursor: pointer;">
-                  <input id="pref-email-notifications" type="checkbox" checked />
-                  <span style="font-size: 12px;">Email notifications</span>
-                </label>
-                <label style="display: flex; align-items: center; gap: 8px; cursor: pointer;">
-                  <input id="pref-desktop-notifications" type="checkbox" checked />
-                  <span style="font-size: 12px;">Desktop notifications</span>
-                </label>
-              </div>
-
-              <button id="save-preferences-btn" style="padding: 8px 16px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 4px; cursor: pointer; font-size: 12px; font-weight: 500;">
-                Save Preferences
-              </button>
-            </div>
-          </div>
-
-          <!-- Integrations Tab -->
-          <div id="integrations-tab" class="settings-content" style="display: none;">
-            <div style="max-width: 600px;">
-              <h2 style="margin: 0 0 16px 0; font-size: 18px;">Integrations</h2>
-
-              <!-- Figma Integration -->
-              <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 12px;">
-                <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-                  <div>
-                    <h3 style="margin: 0 0 4px 0; font-size: 13px; font-weight: 500;">🎨 Figma</h3>
-                    <p style="margin: 0; font-size: 11px; color: var(--vscode-text-dim);">Connect your Figma account for design token extraction</p>
-                  </div>
-                  <span id="figma-status" class="integration-status" style="font-size: 11px; padding: 4px 8px; background: #4CAF50; color: white; border-radius: 3px; display: none;">Connected</span>
-                </div>
-                <div style="display: flex; gap: 8px;">
-                  <input id="figma-api-key" type="password" placeholder="Enter Figma API key" style="flex: 1; padding: 6px 10px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 3px; font-size: 11px;" />
-                  <button class="integration-save-btn" data-service="figma" style="padding: 6px 12px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 3px; cursor: pointer; font-size: 11px;">Save</button>
-                </div>
-              </div>
-
-              <!-- GitHub Integration -->
-              <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 12px;">
-                <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-                  <div>
-                    <h3 style="margin: 0 0 4px 0; font-size: 13px; font-weight: 500;">🐙 GitHub</h3>
-                    <p style="margin: 0; font-size: 11px; color: var(--vscode-text-dim);">Connect GitHub for component library integration</p>
-                  </div>
-                  <span id="github-status" class="integration-status" style="font-size: 11px; padding: 4px 8px; background: #666; color: white; border-radius: 3px; display: none;">Connected</span>
-                </div>
-                <div style="display: flex; gap: 8px;">
-                  <input id="github-api-key" type="password" placeholder="Enter GitHub personal access token" style="flex: 1; padding: 6px 10px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 3px; font-size: 11px;" />
-                  <button class="integration-save-btn" data-service="github" style="padding: 6px 12px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 3px; cursor: pointer; font-size: 11px;">Save</button>
-                </div>
-              </div>
-
-              <!-- Jira Integration -->
-              <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 12px;">
-                <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-                  <div>
-                    <h3 style="margin: 0 0 4px 0; font-size: 13px; font-weight: 500;">📋 Jira</h3>
-                    <p style="margin: 0; font-size: 11px; color: var(--vscode-text-dim);">Connect Jira for issue tracking integration</p>
-                  </div>
-                  <span id="jira-status" class="integration-status" style="font-size: 11px; padding: 4px 8px; background: #666; color: white; border-radius: 3px; display: none;">Connected</span>
-                </div>
-                <div style="display: flex; gap: 8px; margin-bottom: 8px;">
-                  <input id="jira-api-key" type="password" placeholder="Enter Jira API token" style="flex: 1; padding: 6px 10px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 3px; font-size: 11px;" />
-                  <button class="integration-save-btn" data-service="jira" style="padding: 6px 12px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 3px; cursor: pointer; font-size: 11px;">Save</button>
-                </div>
-                <input id="jira-project-key" type="text" placeholder="Jira project key (optional)" style="width: 100%; padding: 6px 10px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 3px; font-size: 11px;" />
-              </div>
-
-              <!-- Slack Integration -->
-              <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 12px;">
-                <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-                  <div>
-                    <h3 style="margin: 0 0 4px 0; font-size: 13px; font-weight: 500;">💬 Slack</h3>
-                    <p style="margin: 0; font-size: 11px; color: var(--vscode-text-dim);">Connect Slack for team notifications</p>
-                  </div>
-                  <span id="slack-status" class="integration-status" style="font-size: 11px; padding: 4px 8px; background: #666; color: white; border-radius: 3px; display: none;">Connected</span>
-                </div>
-                <div style="display: flex; gap: 8px;">
-                  <input id="slack-webhook" type="password" placeholder="Enter Slack webhook URL" style="flex: 1; padding: 6px 10px; background: var(--vscode-input-background); border: 1px solid var(--vscode-border); color: var(--vscode-text); border-radius: 3px; font-size: 11px;" />
-                  <button class="integration-save-btn" data-service="slack" style="padding: 6px 12px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 3px; cursor: pointer; font-size: 11px;">Save</button>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <!-- About Tab -->
-          <div id="about-tab" class="settings-content" style="display: none;">
-            <div style="max-width: 600px;">
-              <h2 style="margin: 0 0 16px 0; font-size: 18px;">About</h2>
-
-              <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-                <h3 style="margin: 0 0 12px 0; font-size: 14px;">Design System Server</h3>
-                <p style="margin: 0 0 8px 0; font-size: 12px; color: var(--vscode-text-dim);">Version: 3.0.0 (MVP3)</p>
-                <p style="margin: 0 0 8px 0; font-size: 12px;">Advanced design system management platform with AI assistance, design tokens, and multi-team collaboration.</p>
-                <p style="margin: 0; font-size: 11px; color: var(--vscode-text-dim);">© 2024 Design System Server. All rights reserved.</p>
-              </div>
-
-              <h3 style="margin: 16px 0 8px 0; font-size: 14px;">Features</h3>
-              <ul style="margin: 0; padding-left: 20px; font-size: 12px;">
-                <li>Design token management and synchronization</li>
-                <li>Figma integration with automated token extraction</li>
-                <li>Multi-team collaboration workspace</li>
-                <li>AI-powered design system analysis</li>
-                <li>Storybook integration and component documentation</li>
-                <li>GitHub and Jira integration</li>
-              </ul>
-
-              <div style="margin-top: 24px;">
-                <h3 style="margin: 0 0 8px 0; font-size: 14px;">Account Actions</h3>
-                <button id="logout-btn" style="padding: 8px 16px; background: #F44336; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 12px; font-weight: 500;">
-                  🚪 Logout
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    // Tab switching
-    this.querySelectorAll('.settings-tab').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        this.switchTab(e.target.closest('button').dataset.tab);
-      });
-    });
-
-    // Profile tab
-    const saveProfileBtn = this.querySelector('#save-profile-btn');
-    if (saveProfileBtn) {
-      saveProfileBtn.addEventListener('click', () => this.saveProfile());
-    }
-
-    // Preferences tab
-    const savePreferencesBtn = this.querySelector('#save-preferences-btn');
-    if (savePreferencesBtn) {
-      savePreferencesBtn.addEventListener('click', () => this.savePreferences());
-    }
-
-    // Integration save buttons
-    this.querySelectorAll('.integration-save-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        const service = e.target.dataset.service;
-        const apiKeyInput = this.querySelector(`#${service}-api-key`) || this.querySelector(`#${service}-webhook`);
-        const apiKey = apiKeyInput?.value || '';
-        this.saveIntegration(service, apiKey);
-      });
-    });
-
-    // Logout button
-    const logoutBtn = this.querySelector('#logout-btn');
-    if (logoutBtn) {
-      logoutBtn.addEventListener('click', () => this.logout());
-    }
-
-    // Change password button
-    const changePasswordBtn = this.querySelector('#change-password-btn');
-    if (changePasswordBtn) {
-      changePasswordBtn.addEventListener('click', () => this.showChangePasswordDialog());
-    }
-  }
-
-  switchTab(tabName) {
-    this.activeTab = tabName;
-
-    // Hide all tabs
-    this.querySelectorAll('.settings-content').forEach(tab => {
-      tab.style.display = 'none';
-    });
-
-    // Show selected tab
-    const selectedTab = this.querySelector(`#${tabName}-tab`);
-    if (selectedTab) {
-      selectedTab.style.display = 'block';
-    }
-
-    // Update tab styling
-    this.querySelectorAll('.settings-tab').forEach(btn => {
-      const isActive = btn.dataset.tab === tabName;
-      btn.style.borderBottomColor = isActive ? 'var(--vscode-accent)' : 'transparent';
-      btn.style.color = isActive ? 'var(--vscode-text)' : 'var(--vscode-text-dim)';
-    });
-  }
-
-  async saveProfile() {
-    const name = this.querySelector('#profile-name')?.value || '';
-    const email = this.querySelector('#profile-email')?.value || '';
-    const bio = this.querySelector('#profile-bio')?.value || '';
-
-    try {
-      await this.userStore.updateProfile({ name, email, bio });
-      this.showNotification('Profile saved successfully', 'success');
-    } catch (error) {
-      this.showNotification('Failed to save profile', 'error');
-      console.error(error);
-    }
-  }
-
-  savePreferences() {
-    const theme = this.querySelector('input[name="theme"]:checked')?.value || 'dark';
-    const language = this.querySelector('#pref-language')?.value || 'en';
-    const notifications = this.querySelector('#pref-notifications')?.checked || false;
-
-    this.userStore.updatePreferences({
-      theme,
-      language,
-      notifications: {
-        enabled: notifications,
-        email: this.querySelector('#pref-email-notifications')?.checked || false,
-        desktop: this.querySelector('#pref-desktop-notifications')?.checked || false
-      }
-    });
-
-    this.showNotification('Preferences saved', 'success');
-  }
-
-  saveIntegration(service, apiKey) {
-    if (!apiKey) {
-      this.userStore.removeIntegration(service);
-      this.showNotification(`${service} integration removed`, 'success');
-    } else {
-      const metadata = {};
-      if (service === 'jira') {
-        metadata.projectKey = this.querySelector('#jira-project-key')?.value || '';
-      }
-      this.userStore.setIntegration(service, apiKey, metadata);
-      this.showNotification(`${service} integration saved`, 'success');
-    }
-
-    this.updateIntegrationStatus();
-  }
-
-  updateIntegrationStatus() {
-    const integrations = this.userStore.getIntegrations();
-    ['figma', 'github', 'jira', 'slack'].forEach(service => {
-      const status = this.querySelector(`#${service}-status`);
-      if (status) {
-        if (integrations[service]?.enabled) {
-          status.style.display = 'inline-block';
-          status.style.background = '#4CAF50';
-          status.textContent = 'Connected';
-        } else {
-          status.style.display = 'none';
-        }
-      }
-    });
-  }
-
-  updateUI() {
-    // Update display when user state changes
-    const user = this.userStore.getCurrentUser();
-    const displayName = this.userStore.getDisplayName();
-
-    // Re-render component
-    this.render();
-    this.setupEventListeners();
-  }
-
-  showChangePasswordDialog() {
-    // Placeholder for password change dialog
-    // In a real implementation, this would show a modal dialog
-    alert('Change password functionality would be implemented here.\n\nIn production, this would show a modal with current password and new password fields.');
-  }
-
-  showNotification(message, type = 'info') {
-    const notificationEl = document.createElement('div');
-    notificationEl.style.cssText = `
-      position: fixed;
-      bottom: 24px;
-      right: 24px;
-      padding: 12px 16px;
-      background: ${type === 'success' ? '#4CAF50' : type === 'error' ? '#F44336' : '#0066CC'};
-      color: white;
-      border-radius: 4px;
-      font-size: 12px;
-      font-weight: 500;
-      z-index: 1000;
-      animation: slideInUp 0.3s ease-out;
-    `;
-    notificationEl.textContent = message;
-    document.body.appendChild(notificationEl);
-
-    setTimeout(() => {
-      notificationEl.style.animation = 'slideOutDown 0.3s ease-in';
-      setTimeout(() => notificationEl.remove(), 300);
-    }, 3000);
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) {
-      this.unsubscribe();
-    }
-  }
-}
-
-customElements.define('ds-user-settings', DSUserSettings);
diff --git a/admin-ui/js/components/base/ds-base-tool.js b/admin-ui/js/components/base/ds-base-tool.js
deleted file mode 100644
index 04774ca..0000000
--- a/admin-ui/js/components/base/ds-base-tool.js
+++ /dev/null
@@ -1,241 +0,0 @@
-/**
- * ds-base-tool.js
- * Base class for all DSS tool components
- *
- * Enforces DSS coding standards:
- * - Shadow DOM encapsulation
- * - Automatic event listener cleanup via AbortController
- * - Constructable Stylesheets support
- * - Standardized lifecycle methods
- * - Logger utility integration
- *
- * Reference: .knowledge/dss-coding-standards.json
- */
-
-import { logger } from '../../utils/logger.js';
-
-/**
- * Base class for DSS tool components
- * All tool components should extend this class to ensure compliance with DSS standards
- */
-export default class DSBaseTool extends HTMLElement {
-  constructor() {
-    super();
-
-    // WC-001: Shadow DOM Required
-    this.attachShadow({ mode: 'open' });
-
-    // EVENT-003: Use AbortController for cleanup
-    this._abortController = new AbortController();
-
-    // Track component state
-    this._isConnected = false;
-
-    logger.debug(`[${this.constructor.name}] Constructor initialized`);
-  }
-
-  /**
-   * Standard Web Component lifecycle: called when element is added to DOM
-   */
-  connectedCallback() {
-    this._isConnected = true;
-    logger.debug(`[${this.constructor.name}] Connected to DOM`);
-
-    // Render the component
-    this.render();
-
-    // Setup event listeners after render
-    this.setupEventListeners();
-  }
-
-  /**
-   * Standard Web Component lifecycle: called when element is removed from DOM
-   * Automatically cleans up all event listeners via AbortController
-   */
-  disconnectedCallback() {
-    this._isConnected = false;
-
-    // EVENT-003: Abort all event listeners
-    this._abortController.abort();
-
-    // Create new controller for potential re-connection
-    this._abortController = new AbortController();
-
-    logger.debug(`[${this.constructor.name}] Disconnected from DOM, listeners cleaned up`);
-  }
-
-  /**
-   * Centralized event binding with automatic cleanup
-   * @param {EventTarget} target - Element to attach listener to
-   * @param {string} type - Event type (e.g., 'click', 'mouseover')
-   * @param {Function} handler - Event handler function
-   * @param {Object} options - Additional addEventListener options
-   */
-  bindEvent(target, type, handler, options = {}) {
-    if (!target || typeof handler !== 'function') {
-      logger.warn(`[${this.constructor.name}] Invalid event binding attempt`, { target, type, handler });
-      return;
-    }
-
-    // Add AbortController signal to options
-    const eventOptions = {
-      ...options,
-      signal: this._abortController.signal
-    };
-
-    target.addEventListener(type, handler, eventOptions);
-
-    logger.debug(`[${this.constructor.name}] Event bound: ${type} on`, target);
-  }
-
-  /**
-   * Event delegation helper for handling multiple elements with data-action attributes
-   * @param {string} selector - CSS selector for the container element
-   * @param {string} eventType - Event type to listen for
-   * @param {Function} handler - Handler function that receives (action, event)
-   */
-  delegateEvents(selector, eventType, handler) {
-    const container = this.shadowRoot.querySelector(selector);
-    if (!container) {
-      logger.warn(`[${this.constructor.name}] Event delegation container not found: ${selector}`);
-      return;
-    }
-
-    this.bindEvent(container, eventType, (e) => {
-      // Find element with data-action attribute
-      const target = e.target.closest('[data-action]');
-      if (target) {
-        const action = target.dataset.action;
-        handler(action, e, target);
-      }
-    });
-
-    logger.debug(`[${this.constructor.name}] Event delegation setup for ${eventType} on ${selector}`);
-  }
-
-  /**
-   * Inject CSS styles using Constructable Stylesheets
-   * STYLE-002: Use Constructable Stylesheets for shared styles
-   * @param {string} cssString - CSS string to inject
-   */
-  adoptStyles(cssString) {
-    try {
-      const sheet = new CSSStyleSheet();
-      sheet.replaceSync(cssString);
-
-      // Append to existing stylesheets
-      this.shadowRoot.adoptedStyleSheets = [
-        ...this.shadowRoot.adoptedStyleSheets,
-        sheet
-      ];
-
-      logger.debug(`[${this.constructor.name}] Styles adopted (${cssString.length} bytes)`);
-    } catch (error) {
-      logger.error(`[${this.constructor.name}] Failed to adopt styles:`, error);
-    }
-  }
-
-  /**
-   * Set multiple attributes at once
-   * @param {Object} attrs - Object with attribute key-value pairs
-   */
-  setAttributes(attrs) {
-    Object.entries(attrs).forEach(([key, value]) => {
-      if (value !== null && value !== undefined) {
-        this.setAttribute(key, value);
-      }
-    });
-  }
-
-  /**
-   * Get attribute with fallback value
-   * @param {string} name - Attribute name
-   * @param {*} defaultValue - Default value if attribute doesn't exist
-   * @returns {string|*} Attribute value or default
-   */
-  getAttr(name, defaultValue = null) {
-    return this.hasAttribute(name) ? this.getAttribute(name) : defaultValue;
-  }
-
-  /**
-   * Render method - MUST be implemented by subclasses
-   * Should set shadowRoot.innerHTML with component template
-   */
-  render() {
-    throw new Error(`${this.constructor.name} must implement render() method`);
-  }
-
-  /**
-   * Setup event listeners - should be implemented by subclasses
-   * Use this.bindEvent() or this.delegateEvents() for automatic cleanup
-   */
-  setupEventListeners() {
-    // Override in subclass if needed
-    logger.debug(`[${this.constructor.name}] setupEventListeners() not implemented (optional)`);
-  }
-
-  /**
-   * Trigger re-render (useful for state changes)
-   */
-  rerender() {
-    if (this._isConnected) {
-      // Abort existing listeners before re-render
-      this._abortController.abort();
-      this._abortController = new AbortController();
-
-      // Re-render and re-setup listeners
-      this.render();
-      this.setupEventListeners();
-
-      logger.debug(`[${this.constructor.name}] Component re-rendered`);
-    }
-  }
-
-  /**
-   * Helper: Query single element in shadow DOM
-   * @param {string} selector - CSS selector
-   * @returns {Element|null}
-   */
-  $(selector) {
-    return this.shadowRoot.querySelector(selector);
-  }
-
-  /**
-   * Helper: Query multiple elements in shadow DOM
-   * @param {string} selector - CSS selector
-   * @returns {NodeList}
-   */
-  $$(selector) {
-    return this.shadowRoot.querySelectorAll(selector);
-  }
-
-  /**
-   * Helper: Escape HTML to prevent XSS
-   * SECURITY-001: Sanitize user input
-   * @param {string} str - String to escape
-   * @returns {string} Escaped string
-   */
-  escapeHtml(str) {
-    const div = document.createElement('div');
-    div.textContent = str;
-    return div.innerHTML;
-  }
-
-  /**
-   * Helper: Dispatch custom event
-   * @param {string} eventName - Event name
-   * @param {*} detail - Event detail payload
-   * @param {Object} options - Event options
-   */
-  emit(eventName, detail = null, options = {}) {
-    const event = new CustomEvent(eventName, {
-      detail,
-      bubbles: true,
-      composed: true, // Cross shadow DOM boundary
-      ...options
-    });
-
-    this.dispatchEvent(event);
-    logger.debug(`[${this.constructor.name}] Event emitted: ${eventName}`, detail);
-  }
-}
diff --git a/admin-ui/js/components/ds-action-bar.js b/admin-ui/js/components/ds-action-bar.js
deleted file mode 100644
index 8830325..0000000
--- a/admin-ui/js/components/ds-action-bar.js
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * admin-ui/js/components/ds-action-bar.js
- * A simple web component to structure page-level actions.
- */
-class DsActionBar extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          gap: var(--space-4);
-          padding: var(--space-4) 0;
-          border-bottom: 1px solid var(--border);
-          margin-bottom: var(--space-6);
-        }
-        .secondary, .primary {
-          display: flex;
-          align-items: center;
-          gap: var(--space-2);
-        }
-      </style>
-      <div class="secondary">
-        <slot></slot>
-      </div>
-      <div class="primary">
-        <slot name="primary"></slot>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-action-bar', DsActionBar);
diff --git a/admin-ui/js/components/ds-badge.js b/admin-ui/js/components/ds-badge.js
deleted file mode 100644
index aeffe77..0000000
--- a/admin-ui/js/components/ds-badge.js
+++ /dev/null
@@ -1,80 +0,0 @@
-/**
- * DS Badge - Web Component
- *
- * Usage:
- *   <ds-badge>Default</ds-badge>
- *   <ds-badge variant="success">Active</ds-badge>
- *   <ds-badge variant="warning" dot>Pending</ds-badge>
- *
- * Attributes:
- *   - variant: default | secondary | outline | destructive | success | warning
- *   - dot: boolean (shows status dot)
- */
-
-class DsBadge extends HTMLElement {
-  static get observedAttributes() {
-    return ['variant', 'dot'];
-  }
-
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-    // This badge has no event listeners, but disconnectedCallback
-    // is present for future extensibility and pattern consistency
-  }
-
-  attributeChangedCallback() {
-    if (this.shadowRoot.innerHTML) {
-      this.render();
-    }
-  }
-
-  get variant() {
-    return this.getAttribute('variant') || 'default';
-  }
-
-  get dot() {
-    return this.hasAttribute('dot');
-  }
-
-  getVariantClass() {
-    const variants = {
-      default: 'ds-badge--default',
-      secondary: 'ds-badge--secondary',
-      outline: 'ds-badge--outline',
-      destructive: 'ds-badge--destructive',
-      success: 'ds-badge--success',
-      warning: 'ds-badge--warning'
-    };
-    return variants[this.variant] || variants.default;
-  }
-
-  render() {
-    const variantClass = this.getVariantClass();
-
-    this.shadowRoot.innerHTML = `
-      <style>
-
-        :host {
-          display: inline-block;
-        }
-      </style>
-      <span class="ds-badge ${variantClass}">
-        ${this.dot ? '<span class="ds-badge__dot"></span>' : ''}
-        <slot></slot>
-      </span>
-    `;
-  }
-}
-
-customElements.define('ds-badge', DsBadge);
-
-export default DsBadge;
diff --git a/admin-ui/js/components/ds-card.js b/admin-ui/js/components/ds-card.js
deleted file mode 100644
index 20be858..0000000
--- a/admin-ui/js/components/ds-card.js
+++ /dev/null
@@ -1,177 +0,0 @@
-/**
- * DS Card - Web Component
- *
- * Usage:
- *   <ds-card>
- *     <ds-card-header>
- *       <ds-card-title>Title</ds-card-title>
- *       <ds-card-description>Description</ds-card-description>
- *     </ds-card-header>
- *     <ds-card-content>Content here</ds-card-content>
- *     <ds-card-footer>Footer actions</ds-card-footer>
- *   </ds-card>
- *
- * Attributes:
- *   - interactive: boolean (adds hover effect)
- */
-
-class DsCard extends HTMLElement {
-  static get observedAttributes() {
-    return ['interactive'];
-  }
-
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-    // This card has no event listeners, but disconnectedCallback
-    // is present for future extensibility and pattern consistency
-  }
-
-  attributeChangedCallback() {
-    if (this.shadowRoot.innerHTML) {
-      this.render();
-    }
-  }
-
-  get interactive() {
-    return this.hasAttribute('interactive');
-  }
-
-  render() {
-    const interactiveClass = this.interactive ? 'ds-card--interactive' : '';
-
-    this.shadowRoot.innerHTML = `
-      <style>
-
-        :host {
-          display: block;
-        }
-      </style>
-      <div class="ds-card ${interactiveClass}">
-        <slot></slot>
-      </div>
-    `;
-  }
-}
-
-class DsCardHeader extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.shadowRoot.innerHTML = `
-      <style>
-      </style>
-      <div class="ds-card__header">
-        <slot></slot>
-      </div>
-    `;
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-  }
-}
-
-class DsCardTitle extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.shadowRoot.innerHTML = `
-      <style>
-      </style>
-      <h3 class="ds-card__title">
-        <slot></slot>
-      </h3>
-    `;
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-  }
-}
-
-class DsCardDescription extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.shadowRoot.innerHTML = `
-      <style>
-      </style>
-      <p class="ds-card__description">
-        <slot></slot>
-      </p>
-    `;
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-  }
-}
-
-class DsCardContent extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.shadowRoot.innerHTML = `
-      <style>
-      </style>
-      <div class="ds-card__content">
-        <slot></slot>
-      </div>
-    `;
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-  }
-}
-
-class DsCardFooter extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.shadowRoot.innerHTML = `
-      <style>
-      </style>
-      <div class="ds-card__footer">
-        <slot></slot>
-      </div>
-    `;
-  }
-
-  disconnectedCallback() {
-    // Cleanup for consistency with other components
-  }
-}
-
-customElements.define('ds-card', DsCard);
-customElements.define('ds-card-header', DsCardHeader);
-customElements.define('ds-card-title', DsCardTitle);
-customElements.define('ds-card-description', DsCardDescription);
-customElements.define('ds-card-content', DsCardContent);
-customElements.define('ds-card-footer', DsCardFooter);
-
-export { DsCard, DsCardHeader, DsCardTitle, DsCardDescription, DsCardContent, DsCardFooter };
diff --git a/admin-ui/js/components/ds-component-base.js b/admin-ui/js/components/ds-component-base.js
deleted file mode 100644
index 316016f..0000000
--- a/admin-ui/js/components/ds-component-base.js
+++ /dev/null
@@ -1,417 +0,0 @@
-/**
- * DsComponentBase - Base class for all design system components
- *
- * Provides standardized:
- * - Component lifecycle (connectedCallback, disconnectedCallback, attributeChangedCallback)
- * - Standard attributes (variant, size, disabled, loading, aria-* attributes)
- * - Standard methods (focus(), blur())
- * - Theme change handling
- * - Accessibility features (WCAG 2.1 AA)
- * - Event emission patterns (ds-* namespaced events)
- *
- * All Web Components should extend this class to ensure API consistency.
- *
- * Usage:
- *   class DsButton extends DsComponentBase {
- *     static get observedAttributes() {
- *       return [...super.observedAttributes(), 'type'];
- *     }
- *   }
- */
-
-import StylesheetManager from '../core/stylesheet-manager.js';
-
-export class DsComponentBase extends HTMLElement {
-  /**
-   * Standard observed attributes all components should support
-   * Subclasses should extend this list with component-specific attributes
-   */
-  static get observedAttributes() {
-    return [
-      // State management
-      'disabled',
-      'loading',
-      // Accessibility
-      'aria-label',
-      'aria-disabled',
-      'aria-expanded',
-      'aria-hidden',
-      'aria-pressed',
-      'aria-selected',
-      'aria-invalid',
-      'aria-describedby',
-      'aria-labelledby',
-      // Focus management
-      'tabindex'
-    ];
-  }
-
-  /**
-   * Initialize component
-   * Subclasses should call super.constructor()
-   */
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-
-    // Initialize standard properties
-    this._disabled = false;
-    this._loading = false;
-    this._initialized = false;
-    this._cleanup = [];
-    this._themeObserver = null;
-    this._resizeObserver = null;
-  }
-
-  /**
-   * Called when component is inserted into DOM
-   * Loads stylesheets, syncs attributes, and renders
-   */
-  async connectedCallback() {
-    try {
-      // Attach stylesheets
-      await StylesheetManager.attachStyles(this.shadowRoot);
-
-      // Sync HTML attributes to JavaScript properties
-      this._syncAttributesToProperties();
-
-      // Initialize theme observer for dark/light mode changes
-      this._initializeThemeObserver();
-
-      // Allow subclass to setup event listeners
-      this.setupEventListeners?.();
-
-      // Initial render
-      this._initialized = true;
-      this.render?.();
-
-      // Emit connected event for testing/debugging
-      this.emit('ds-component-connected', {
-        component: this.constructor.name
-      });
-    } catch (error) {
-      console.error(`[${this.constructor.name}] Error in connectedCallback:`, error);
-      this.emit('ds-component-error', { error: error.message });
-    }
-  }
-
-  /**
-   * Called when component is removed from DOM
-   * Cleanup event listeners and observers
-   */
-  disconnectedCallback() {
-    // Allow subclass to cleanup
-    this.cleanupEventListeners?.();
-
-    // Remove theme observer
-    if (this._themeObserver) {
-      window.removeEventListener('theme-changed', this._themeObserver);
-      this._themeObserver = null;
-    }
-
-    // Disconnect resize observer if present
-    if (this._resizeObserver) {
-      this._resizeObserver.disconnect();
-      this._resizeObserver = null;
-    }
-
-    // Cleanup all tracked listeners
-    this._cleanup.forEach(({ element, event, handler }) => {
-      element.removeEventListener(event, handler);
-    });
-    this._cleanup = [];
-  }
-
-  /**
-   * Called when observed attributes change
-   * Subclasses can override but should call super.attributeChangedCallback()
-   */
-  attributeChangedCallback(name, oldValue, newValue) {
-    if (!this._initialized || oldValue === newValue) return;
-
-    // Handle standard attributes
-    switch (name) {
-      case 'disabled':
-        this._disabled = newValue !== null;
-        this._updateAccessibility();
-        break;
-      case 'loading':
-        this._loading = newValue !== null;
-        break;
-      case 'aria-label':
-      case 'aria-disabled':
-      case 'aria-expanded':
-      case 'aria-hidden':
-      case 'aria-pressed':
-      case 'aria-selected':
-      case 'aria-invalid':
-        this._updateAccessibility();
-        break;
-      case 'tabindex':
-        // Update tabindex if changed
-        this.setAttribute('tabindex', newValue || '0');
-        break;
-    }
-
-    // Re-render component
-    this.render?.();
-  }
-
-  /**
-   * Sync HTML attributes to JavaScript properties
-   * @private
-   */
-  _syncAttributesToProperties() {
-    this._disabled = this.hasAttribute('disabled');
-    this._loading = this.hasAttribute('loading');
-
-    // Ensure accessible tabindex
-    if (!this.hasAttribute('tabindex')) {
-      this.setAttribute('tabindex', this._disabled ? '-1' : '0');
-    } else if (this._disabled && this.getAttribute('tabindex') !== '-1') {
-      this.setAttribute('tabindex', '-1');
-    }
-  }
-
-  /**
-   * Initialize theme observer to listen for dark/light mode changes
-   * @private
-   */
-  _initializeThemeObserver() {
-    this._themeObserver = () => {
-      // Re-render when theme changes
-      this.render?.();
-    };
-
-    window.addEventListener('theme-changed', this._themeObserver);
-  }
-
-  /**
-   * Update accessibility attributes based on component state
-   * @private
-   */
-  _updateAccessibility() {
-    // Update aria-disabled to match disabled state
-    this.setAttribute('aria-disabled', this._disabled);
-
-    // Ensure proper tab order when disabled
-    if (this._disabled) {
-      this.setAttribute('tabindex', '-1');
-    } else if (this.getAttribute('tabindex') === '-1') {
-      this.setAttribute('tabindex', '0');
-    }
-  }
-
-  /**
-   * Standard properties with getters/setters
-   */
-
-  get disabled() { return this._disabled; }
-  set disabled(value) {
-    this._disabled = !!value;
-    value ? this.setAttribute('disabled', '') : this.removeAttribute('disabled');
-  }
-
-  get loading() { return this._loading; }
-  set loading(value) {
-    this._loading = !!value;
-    value ? this.setAttribute('loading', '') : this.removeAttribute('loading');
-  }
-
-  get ariaLabel() { return this.getAttribute('aria-label'); }
-  set ariaLabel(value) {
-    value ? this.setAttribute('aria-label', value) : this.removeAttribute('aria-label');
-  }
-
-  get ariaDescribedBy() { return this.getAttribute('aria-describedby'); }
-  set ariaDescribedBy(value) {
-    value ? this.setAttribute('aria-describedby', value) : this.removeAttribute('aria-describedby');
-  }
-
-  /**
-   * Standard methods for focus management
-   */
-
-  focus(options) {
-    // Find first focusable element in shadow DOM
-    const focusable = this.shadowRoot.querySelector('button, input, [tabindex]');
-    if (focusable) {
-      focusable.focus(options);
-    }
-  }
-
-  blur() {
-    const focused = this.shadowRoot.activeElement;
-    if (focused && typeof focused.blur === 'function') {
-      focused.blur();
-    }
-  }
-
-  /**
-   * Emit custom event (ds-* namespaced)
-   * @param {string} eventName - Event name (without 'ds-' prefix)
-   * @param {object} detail - Event detail object
-   * @returns {boolean} Whether event was not prevented
-   */
-  emit(eventName, detail = {}) {
-    const event = new CustomEvent(`ds-${eventName}`, {
-      detail,
-      composed: true,        // Bubble out of shadow DOM
-      bubbles: true,         // Standard bubbling
-      cancelable: true       // Allow preventDefault()
-    });
-
-    return this.dispatchEvent(event);
-  }
-
-  /**
-   * Add event listener with automatic cleanup
-   * Listener is automatically removed in disconnectedCallback()
-   * @param {HTMLElement} element - Element to listen on
-   * @param {string} event - Event name
-   * @param {Function} handler - Event handler
-   * @param {object} [options] - Event listener options
-   */
-  addEventListener(element, event, handler, options = false) {
-    element.addEventListener(event, handler, options);
-    this._cleanup.push({ element, event, handler });
-  }
-
-  /**
-   * Render method stub - override in subclass
-   * Called on initialization and on attribute changes
-   */
-  render() {
-    // Override in subclass
-  }
-
-  /**
-   * Setup event listeners - override in subclass
-   * Called in connectedCallback after render
-   */
-  setupEventListeners() {
-    // Override in subclass
-  }
-
-  /**
-   * Cleanup event listeners - override in subclass
-   * Called in disconnectedCallback
-   */
-  cleanupEventListeners() {
-    // Override in subclass
-  }
-
-  /**
-   * Get computed CSS variable value
-   * @param {string} varName - CSS variable name (with or without --)
-   * @returns {string} CSS variable value
-   */
-  getCSSVariable(varName) {
-    const name = varName.startsWith('--') ? varName : `--${varName}`;
-    return getComputedStyle(document.documentElement).getPropertyValue(name).trim();
-  }
-
-  /**
-   * Check if component is in dark mode
-   * @returns {boolean}
-   */
-  isDarkMode() {
-    return document.documentElement.classList.contains('dark') ||
-           window.matchMedia('(prefers-color-scheme: dark)').matches;
-  }
-
-  /**
-   * Debounce function execution
-   * @param {Function} fn - Function to debounce
-   * @param {number} delay - Delay in milliseconds
-   * @returns {Function} Debounced function
-   */
-  debounce(fn, delay = 300) {
-    let timeoutId;
-    return (...args) => {
-      clearTimeout(timeoutId);
-      timeoutId = setTimeout(() => fn.apply(this, args), delay);
-    };
-  }
-
-  /**
-   * Throttle function execution
-   * @param {Function} fn - Function to throttle
-   * @param {number} limit - Time limit in milliseconds
-   * @returns {Function} Throttled function
-   */
-  throttle(fn, limit = 300) {
-    let inThrottle;
-    return (...args) => {
-      if (!inThrottle) {
-        fn.apply(this, args);
-        inThrottle = true;
-        setTimeout(() => (inThrottle = false), limit);
-      }
-    };
-  }
-
-  /**
-   * Wait for an event
-   * @param {string} eventName - Event name to wait for
-   * @param {number} [timeout] - Optional timeout in milliseconds
-   * @returns {Promise} Resolves with event detail
-   */
-  waitForEvent(eventName, timeout = null) {
-    return new Promise((resolve, reject) => {
-      const handler = (e) => {
-        this.removeEventListener(eventName, handler);
-        clearTimeout(timeoutId);
-        resolve(e.detail);
-      };
-
-      this.addEventListener(eventName, handler);
-
-      let timeoutId;
-      if (timeout) {
-        timeoutId = setTimeout(() => {
-          this.removeEventListener(eventName, handler);
-          reject(new Error(`Event '${eventName}' did not fire within ${timeout}ms`));
-        }, timeout);
-      }
-    });
-  }
-
-  /**
-   * Get HTML structure for rendering in shadow DOM
-   * Useful for preventing repeated string concatenation
-   * @param {string} html - HTML template
-   * @param {object} [data] - Data for template interpolation
-   * @returns {string} Rendered HTML
-   */
-  renderTemplate(html, data = {}) {
-    return html.replace(/\{\{(\w+)\}\}/g, (match, key) => data[key] ?? match);
-  }
-
-  /**
-   * Static helper to create component with attributes
-   * @param {object} attrs - Attributes to set
-   * @returns {HTMLElement} Component instance
-   */
-  static create(attrs = {}) {
-    const element = document.createElement(this.name.replace(/([A-Z])/g, '-$1').toLowerCase());
-    Object.entries(attrs).forEach(([key, value]) => {
-      if (value === true) {
-        element.setAttribute(key, '');
-      } else if (value !== false && value !== null && value !== undefined) {
-        element.setAttribute(key, value);
-      }
-    });
-    return element;
-  }
-}
-
-// Export for module systems
-if (typeof module !== 'undefined' && module.exports) {
-  module.exports = { DsComponentBase };
-}
-
-// Make available globally
-if (typeof window !== 'undefined') {
-  window.DsComponentBase = DsComponentBase;
-}
diff --git a/admin-ui/js/components/ds-input.js b/admin-ui/js/components/ds-input.js
deleted file mode 100644
index b0710a9..0000000
--- a/admin-ui/js/components/ds-input.js
+++ /dev/null
@@ -1,255 +0,0 @@
-/**
- * DS Input - Web Component
- *
- * Usage:
- *   <ds-input placeholder="Enter text..." value=""></ds-input>
- *   <ds-input type="password" label="Password"></ds-input>
- *   <ds-input error="This field is required"></ds-input>
- *
- * Attributes:
- *   - type: text | password | email | number | search | tel | url
- *   - placeholder: string
- *   - value: string
- *   - label: string
- *   - error: string
- *   - disabled: boolean
- *   - required: boolean
- *   - icon: string (SVG content or icon name)
- */
-
-class DsInput extends HTMLElement {
-  static get observedAttributes() {
-    return ['type', 'placeholder', 'value', 'label', 'error', 'disabled', 'required', 'icon', 'tabindex', 'aria-label', 'aria-invalid', 'aria-describedby'];
-  }
-
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  disconnectedCallback() {
-    this.cleanupEventListeners();
-  }
-
-  attributeChangedCallback(name, oldValue, newValue) {
-    if (this.shadowRoot.innerHTML && oldValue !== newValue) {
-      if (name === 'value') {
-        const input = this.shadowRoot.querySelector('input');
-        if (input && input.value !== newValue) {
-          input.value = newValue || '';
-        }
-      } else {
-        this.cleanupEventListeners();
-        this.render();
-        this.setupEventListeners();
-      }
-    }
-  }
-
-  get type() {
-    return this.getAttribute('type') || 'text';
-  }
-
-  get placeholder() {
-    return this.getAttribute('placeholder') || '';
-  }
-
-  get value() {
-    const input = this.shadowRoot?.querySelector('input');
-    return input ? input.value : (this.getAttribute('value') || '');
-  }
-
-  set value(val) {
-    this.setAttribute('value', val);
-    const input = this.shadowRoot?.querySelector('input');
-    if (input) input.value = val;
-  }
-
-  get label() {
-    return this.getAttribute('label');
-  }
-
-  get error() {
-    return this.getAttribute('error');
-  }
-
-  get disabled() {
-    return this.hasAttribute('disabled');
-  }
-
-  get required() {
-    return this.hasAttribute('required');
-  }
-
-  get icon() {
-    return this.getAttribute('icon');
-  }
-
-  setupEventListeners() {
-    const input = this.shadowRoot.querySelector('input');
-    if (!input) return;
-
-    // Store handler references for cleanup
-    this.inputHandler = (e) => {
-      this.dispatchEvent(new CustomEvent('ds-input', {
-        bubbles: true,
-        composed: true,
-        detail: { value: e.target.value }
-      }));
-    };
-
-    this.changeHandler = (e) => {
-      this.dispatchEvent(new CustomEvent('ds-change', {
-        bubbles: true,
-        composed: true,
-        detail: { value: e.target.value }
-      }));
-    };
-
-    this.focusHandler = () => {
-      this.dispatchEvent(new CustomEvent('ds-focus', {
-        bubbles: true,
-        composed: true
-      }));
-    };
-
-    this.blurHandler = () => {
-      this.dispatchEvent(new CustomEvent('ds-blur', {
-        bubbles: true,
-        composed: true
-      }));
-    };
-
-    input.addEventListener('input', this.inputHandler);
-    input.addEventListener('change', this.changeHandler);
-    input.addEventListener('focus', this.focusHandler);
-    input.addEventListener('blur', this.blurHandler);
-  }
-
-  cleanupEventListeners() {
-    const input = this.shadowRoot?.querySelector('input');
-    if (!input) return;
-
-    // Remove all event listeners
-    if (this.inputHandler) {
-      input.removeEventListener('input', this.inputHandler);
-      delete this.inputHandler;
-    }
-    if (this.changeHandler) {
-      input.removeEventListener('change', this.changeHandler);
-      delete this.changeHandler;
-    }
-    if (this.focusHandler) {
-      input.removeEventListener('focus', this.focusHandler);
-      delete this.focusHandler;
-    }
-    if (this.blurHandler) {
-      input.removeEventListener('blur', this.blurHandler);
-      delete this.blurHandler;
-    }
-  }
-
-  focus() {
-    this.shadowRoot.querySelector('input')?.focus();
-  }
-
-  blur() {
-    this.shadowRoot.querySelector('input')?.blur();
-  }
-
-  render() {
-    const hasIcon = !!this.icon;
-    const hasError = !!this.error;
-    const errorClass = hasError ? 'ds-input--error' : '';
-    const tabindex = this.disabled ? '-1' : (this.getAttribute('tabindex') || '0');
-    const errorId = hasError ? 'error-' + Math.random().toString(36).substr(2, 9) : '';
-
-    // ARIA attributes
-    const ariaLabel = this.getAttribute('aria-label') || this.label || '';
-    const ariaInvalid = hasError ? 'aria-invalid="true"' : '';
-    const ariaDescribedBy = hasError ? `aria-describedby="${errorId}"` : '';
-
-    this.shadowRoot.innerHTML = `
-      <link rel="stylesheet" href="/admin-ui/css/tokens.css">
-      <link rel="stylesheet" href="/admin-ui/css/components.css">
-      <style>
-        :host {
-          display: block;
-        }
-
-        .input-wrapper {
-          position: relative;
-        }
-
-        .input-wrapper.has-icon input {
-          padding-left: 2.5rem;
-        }
-
-        .icon {
-          position: absolute;
-          left: var(--space-3);
-          top: 50%;
-          transform: translateY(-50%);
-          color: var(--muted-foreground);
-          pointer-events: none;
-          width: 1rem;
-          height: 1rem;
-        }
-
-        input:focus-visible {
-          outline: 2px solid var(--primary);
-          outline-offset: 2px;
-        }
-
-        .error-text {
-          margin-top: var(--space-1);
-          font-size: var(--text-xs);
-          color: var(--destructive);
-        }
-      </style>
-
-      ${this.label ? `
-        <label class="ds-label ${this.required ? 'ds-label--required' : ''}">
-          ${this.label}
-        </label>
-      ` : ''}
-
-      <div class="input-wrapper ${hasIcon ? 'has-icon' : ''}">
-        ${hasIcon ? `<span class="icon" aria-hidden="true">${this.getIconSVG()}</span>` : ''}
-        <input
-          class="ds-input ${errorClass}"
-          type="${this.type}"
-          placeholder="${this.placeholder}"
-          value="${this.getAttribute('value') || ''}"
-          tabindex="${tabindex}"
-          aria-label="${ariaLabel}"
-          ${ariaInvalid}
-          ${ariaDescribedBy}
-          ${this.disabled ? 'disabled' : ''}
-          ${this.required ? 'required' : ''}
-        />
-      </div>
-
-      ${hasError ? `<p id="${errorId}" class="error-text" role="alert">${this.error}</p>` : ''}
-    `;
-  }
-
-  getIconSVG() {
-    const icons = {
-      search: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>`,
-      email: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg>`,
-      lock: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>`,
-      user: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><circle cx="12" cy="8" r="5"/><path d="M20 21a8 8 0 0 0-16 0"/></svg>`,
-    };
-    return icons[this.icon] || this.icon || '';
-  }
-}
-
-customElements.define('ds-input', DsInput);
-
-export default DsInput;
diff --git a/admin-ui/js/components/ds-notification-center.js b/admin-ui/js/components/ds-notification-center.js
deleted file mode 100644
index f39abd6..0000000
--- a/admin-ui/js/components/ds-notification-center.js
+++ /dev/null
@@ -1,402 +0,0 @@
-/**
- * @fileoverview A popover component to display user notifications.
- * Grouped by date (Today, Yesterday, Earlier) with mark as read support.
- */
-import notificationService from '../services/notification-service.js';
-
-class DsNotificationCenter extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-    this._isConnected = false;
-  }
-
-  connectedCallback() {
-    this._isConnected = true;
-    this.render();
-    this._updateNotifications = this._updateNotifications.bind(this);
-    notificationService.addEventListener('notifications-updated', this._updateNotifications);
-
-    // Initialize the service and get initial notifications
-    // Only update if component is still connected when promise resolves
-    notificationService.init().then(() => {
-      if (this._isConnected) {
-        this._updateNotifications({ detail: { notifications: notificationService.getAll() } });
-      }
-    }).catch((error) => {
-      console.error('[DsNotificationCenter] Failed to initialize notifications:', error);
-    });
-
-    this.shadowRoot.getElementById('mark-all-read').addEventListener('click', () => {
-      notificationService.markAllAsRead();
-    });
-
-    this.shadowRoot.getElementById('clear-all').addEventListener('click', () => {
-      notificationService.clearAll();
-    });
-
-    this.shadowRoot.getElementById('notification-list').addEventListener('click', this._handleNotificationClick.bind(this));
-  }
-
-  disconnectedCallback() {
-    this._isConnected = false;
-    notificationService.removeEventListener('notifications-updated', this._updateNotifications);
-  }
-
-  _handleNotificationClick(e) {
-    const notificationEl = e.target.closest('.notification');
-    if (!notificationEl) return;
-
-    const id = notificationEl.dataset.id;
-    if (!id) return;
-
-    // Mark as read if it was unread
-    if (notificationEl.classList.contains('unread')) {
-      notificationService.markAsRead(id);
-    }
-
-    // Handle action button clicks
-    const actionButton = e.target.closest('[data-event]');
-    if (actionButton) {
-      let payload = {};
-      try {
-        payload = JSON.parse(actionButton.dataset.payload || '{}');
-      } catch (e) {
-        console.error('Invalid action payload:', e);
-      }
-
-      this.dispatchEvent(new CustomEvent('notification-action', {
-        bubbles: true,
-        composed: true,
-        detail: {
-          event: actionButton.dataset.event,
-          payload
-        }
-      }));
-
-      // Close the notification center
-      this.removeAttribute('open');
-    }
-
-    // Handle delete button
-    const deleteButton = e.target.closest('.delete-btn');
-    if (deleteButton) {
-      e.stopPropagation();
-      notificationService.delete(id);
-    }
-  }
-
-  _updateNotifications({ detail }) {
-    const { notifications } = detail;
-    const listEl = this.shadowRoot?.getElementById('notification-list');
-
-    // Null safety check - component may be disconnecting
-    if (!listEl) {
-      console.warn('[DsNotificationCenter] Notification list element not found');
-      return;
-    }
-
-    if (!notifications || notifications.length === 0) {
-      listEl.innerHTML = `
-        <div class="empty-state">
-          <svg width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
-            <path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9"/>
-            <path d="M10.3 21a1.94 1.94 0 0 0 3.4 0"/>
-          </svg>
-          <p>No notifications yet</p>
-          <span>You're all caught up!</span>
-        </div>
-      `;
-      return;
-    }
-
-    const grouped = this._groupNotificationsByDate(notifications);
-
-    let html = '';
-    for (const [groupTitle, groupNotifications] of Object.entries(grouped)) {
-      html += `
-        <div class="group">
-          <div class="group__title">${groupTitle}</div>
-          ${groupNotifications.map(n => this._renderNotification(n)).join('')}
-        </div>
-      `;
-    }
-    listEl.innerHTML = html;
-  }
-
-  _groupNotificationsByDate(notifications) {
-    const groups = {};
-    const today = new Date();
-    const yesterday = new Date(today);
-    yesterday.setDate(yesterday.getDate() - 1);
-
-    const isSameDay = (d1, d2) =>
-      d1.getFullYear() === d2.getFullYear() &&
-      d1.getMonth() === d2.getMonth() &&
-      d1.getDate() === d2.getDate();
-
-    notifications.forEach(n => {
-      const date = new Date(n.timestamp);
-      let groupName;
-
-      if (isSameDay(date, today)) {
-        groupName = 'Today';
-      } else if (isSameDay(date, yesterday)) {
-        groupName = 'Yesterday';
-      } else {
-        groupName = 'Earlier';
-      }
-
-      if (!groups[groupName]) {
-        groups[groupName] = [];
-      }
-      groups[groupName].push(n);
-    });
-
-    return groups;
-  }
-
-  _renderNotification(n) {
-    const time = new Date(n.timestamp).toLocaleTimeString([], {
-      hour: '2-digit',
-      minute: '2-digit'
-    });
-
-    const actionsHtml = (n.actions || []).map(action =>
-      `<button class="action-btn" data-event="${action.event}" data-payload='${JSON.stringify(action.payload || {})}'>${action.label}</button>`
-    ).join('');
-
-    return `
-      <div class="notification ${n.read ? '' : 'unread'}" data-id="${n.id}">
-        <div class="icon-container">
-          <div class="dot ${n.type || 'info'}"></div>
-        </div>
-        <div class="notification-content">
-          <p class="title">${this._escapeHtml(n.title)}</p>
-          ${n.message ? `<p class="message">${this._escapeHtml(n.message)}</p>` : ''}
-          <div class="meta">
-            <span class="time">${time}</span>
-            ${n.source ? `<span class="source">${n.source}</span>` : ''}
-          </div>
-          ${actionsHtml ? `<div class="actions">${actionsHtml}</div>` : ''}
-        </div>
-        <button class="delete-btn" aria-label="Delete notification">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-            <line x1="18" y1="6" x2="6" y2="18"></line>
-            <line x1="6" y1="6" x2="18" y2="18"></line>
-          </svg>
-        </button>
-      </div>
-    `;
-  }
-
-  _escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: none;
-          position: absolute;
-          top: calc(100% + var(--space-2));
-          right: 0;
-          width: 380px;
-          z-index: 100;
-        }
-        :host([open]) {
-          display: block;
-        }
-        .panel {
-          background: var(--popover);
-          color: var(--popover-foreground);
-          border: 1px solid var(--border);
-          border-radius: var(--radius-lg);
-          box-shadow: var(--shadow-lg);
-          display: flex;
-          flex-direction: column;
-          max-height: 480px;
-          overflow: hidden;
-        }
-        .header {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          padding: var(--space-3) var(--space-4);
-          border-bottom: 1px solid var(--border);
-          flex-shrink: 0;
-        }
-        .header h3 {
-          margin: 0;
-          font-size: var(--text-base);
-          font-weight: var(--font-semibold);
-        }
-        .header-actions {
-          display: flex;
-          gap: var(--space-2);
-        }
-        .header-actions button {
-          font-size: var(--text-xs);
-          color: var(--primary);
-          cursor: pointer;
-          background: none;
-          border: none;
-          padding: 0;
-        }
-        .header-actions button:hover {
-          text-decoration: underline;
-        }
-        .content {
-          overflow-y: auto;
-          flex: 1;
-        }
-        .empty-state {
-          text-align: center;
-          padding: var(--space-8);
-          color: var(--muted-foreground);
-        }
-        .empty-state svg {
-          opacity: 0.5;
-          margin-bottom: var(--space-3);
-        }
-        .empty-state p {
-          margin: 0;
-          font-size: var(--text-sm);
-          font-weight: var(--font-medium);
-          color: var(--foreground);
-        }
-        .empty-state span {
-          font-size: var(--text-xs);
-        }
-        .group {
-          border-bottom: 1px solid var(--border);
-        }
-        .group:last-child {
-          border-bottom: none;
-        }
-        .group__title {
-          padding: var(--space-2) var(--space-4);
-          font-size: var(--text-xs);
-          font-weight: var(--font-medium);
-          color: var(--muted-foreground);
-          text-transform: uppercase;
-          letter-spacing: 0.05em;
-          background: var(--muted);
-        }
-        .notification {
-          display: flex;
-          gap: var(--space-3);
-          padding: var(--space-3) var(--space-4);
-          position: relative;
-          cursor: pointer;
-          transition: background 0.15s ease;
-        }
-        .notification.unread {
-          background-color: oklch(from var(--primary) l c h / 0.05);
-        }
-        .notification:hover {
-          background-color: var(--accent);
-        }
-        .icon-container {
-          flex-shrink: 0;
-          width: 10px;
-          padding-top: 4px;
-        }
-        .dot {
-          width: 8px;
-          height: 8px;
-          border-radius: 50%;
-        }
-        .dot.info { background-color: var(--primary); }
-        .dot.success { background-color: var(--success); }
-        .dot.warning { background-color: var(--warning); }
-        .dot.error { background-color: var(--destructive); }
-
-        .notification-content {
-          flex: 1;
-          min-width: 0;
-        }
-        .notification-content .title {
-          margin: 0;
-          font-size: var(--text-sm);
-          font-weight: var(--font-medium);
-          color: var(--foreground);
-          line-height: 1.3;
-        }
-        .notification-content .message {
-          margin: var(--space-1) 0 0;
-          font-size: var(--text-xs);
-          color: var(--muted-foreground);
-          line-height: 1.4;
-        }
-        .meta {
-          display: flex;
-          gap: var(--space-2);
-          font-size: var(--text-xs);
-          color: var(--muted-foreground);
-          margin-top: var(--space-1);
-        }
-        .source {
-          background: var(--muted);
-          padding: 0 var(--space-1);
-          border-radius: var(--radius-sm);
-        }
-        .actions {
-          margin-top: var(--space-2);
-          display: flex;
-          gap: var(--space-2);
-        }
-        .action-btn {
-          font-size: var(--text-xs);
-          padding: var(--space-1) var(--space-2);
-          background: var(--muted);
-          border: 1px solid var(--border);
-          color: var(--foreground);
-          border-radius: var(--radius-sm);
-          cursor: pointer;
-          transition: background 0.15s ease;
-        }
-        .action-btn:hover {
-          background: var(--accent);
-        }
-        .delete-btn {
-          position: absolute;
-          top: var(--space-2);
-          right: var(--space-2);
-          background: none;
-          border: none;
-          color: var(--muted-foreground);
-          cursor: pointer;
-          padding: var(--space-1);
-          border-radius: var(--radius);
-          opacity: 0;
-          transition: opacity 0.15s ease;
-        }
-        .notification:hover .delete-btn {
-          opacity: 1;
-        }
-        .delete-btn:hover {
-          background: var(--destructive);
-          color: white;
-        }
-      </style>
-      <div class="panel">
-        <div class="header">
-          <h3>Notifications</h3>
-          <div class="header-actions">
-            <button id="mark-all-read">Mark all read</button>
-            <button id="clear-all">Clear all</button>
-          </div>
-        </div>
-        <div class="content" id="notification-list">
-          <!-- Notifications will be rendered here -->
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-notification-center', DsNotificationCenter);
diff --git a/admin-ui/js/components/ds-toast-provider.js b/admin-ui/js/components/ds-toast-provider.js
deleted file mode 100644
index f57ea48..0000000
--- a/admin-ui/js/components/ds-toast-provider.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * admin-ui/js/components/ds-toast-provider.js
- * Manages a stack of ds-toast components.
- * Provides a global window.showToast() function.
- */
-class DsToastProvider extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-    // Expose global toast function
-    window.showToast = this.showToast.bind(this);
-  }
-
-  disconnectedCallback() {
-    delete window.showToast;
-  }
-
-  /**
-   * Show a toast notification
-   * @param {object} options - Toast options
-   * @param {string} options.message - The main message
-   * @param {string} [options.type='info'] - 'info', 'success', 'warning', 'error'
-   * @param {number} [options.duration=5000] - Duration in ms. 0 for persistent
-   * @param {boolean} [options.dismissible=true] - Show close button
-   * @returns {HTMLElement} The created toast element
-   */
-  showToast({ message, type = 'info', duration = 5000, dismissible = true }) {
-    const toast = document.createElement('ds-toast');
-    toast.setAttribute('type', type);
-    toast.setAttribute('duration', String(duration));
-    if (dismissible) {
-      toast.setAttribute('dismissible', '');
-    }
-    toast.innerHTML = message;
-
-    const stack = this.shadowRoot.querySelector('.stack');
-    stack.appendChild(toast);
-
-    // Limit visible toasts
-    const toasts = stack.querySelectorAll('ds-toast');
-    if (toasts.length > 5) {
-      toasts[0].dismiss();
-    }
-
-    return toast;
-  }
-
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        .stack {
-          position: fixed;
-          top: var(--space-4);
-          right: var(--space-4);
-          z-index: 9999;
-          display: flex;
-          flex-direction: column;
-          gap: var(--space-3);
-          max-width: 380px;
-          pointer-events: none;
-        }
-        .stack ::slotted(ds-toast),
-        .stack ds-toast {
-          pointer-events: auto;
-        }
-
-        @media (max-width: 480px) {
-          .stack {
-            left: var(--space-4);
-            right: var(--space-4);
-            max-width: none;
-          }
-        }
-      </style>
-      <div class="stack"></div>
-    `;
-  }
-}
-
-customElements.define('ds-toast-provider', DsToastProvider);
diff --git a/admin-ui/js/components/ds-toast.js b/admin-ui/js/components/ds-toast.js
deleted file mode 100644
index 03bf44e..0000000
--- a/admin-ui/js/components/ds-toast.js
+++ /dev/null
@@ -1,167 +0,0 @@
-/**
- * admin-ui/js/components/ds-toast.js
- * A single toast notification component with swipe-to-dismiss support.
- */
-class DsToast extends HTMLElement {
-  static get observedAttributes() {
-    return ['type', 'duration'];
-  }
-
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-    this._duration = 5000;
-    this._dismissTimer = null;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupAutoDismiss();
-    this.setupSwipeToDismiss();
-    this.shadowRoot.querySelector('.close-button')?.addEventListener('click', () => this.dismiss());
-  }
-
-  disconnectedCallback() {
-    if (this._dismissTimer) {
-      clearTimeout(this._dismissTimer);
-    }
-  }
-
-  attributeChangedCallback(name, oldValue, newValue) {
-    if (name === 'duration') {
-      this._duration = parseInt(newValue, 10);
-    }
-  }
-
-  setupAutoDismiss() {
-    if (this._duration > 0 && !this.hasAttribute('progress')) {
-      this._dismissTimer = setTimeout(() => this.dismiss(), this._duration);
-    }
-  }
-
-  dismiss() {
-    if (this._dismissTimer) {
-      clearTimeout(this._dismissTimer);
-    }
-    this.classList.add('dismissing');
-    this.addEventListener('animationend', () => {
-      this.dispatchEvent(new CustomEvent('dismiss', { bubbles: true, composed: true }));
-      this.remove();
-    }, { once: true });
-  }
-
-  setupSwipeToDismiss() {
-    let startX = 0;
-    let currentX = 0;
-    let isDragging = false;
-
-    this.addEventListener('pointerdown', (e) => {
-      isDragging = true;
-      startX = e.clientX;
-      currentX = startX;
-      this.style.transition = 'none';
-      this.setPointerCapture(e.pointerId);
-    });
-
-    this.addEventListener('pointermove', (e) => {
-      if (!isDragging) return;
-      currentX = e.clientX;
-      const diff = currentX - startX;
-      this.style.transform = `translateX(${diff}px)`;
-    });
-
-    const onPointerUp = (e) => {
-      if (!isDragging) return;
-      isDragging = false;
-      this.style.transition = 'transform 0.2s ease';
-      const diff = currentX - startX;
-      const threshold = this.offsetWidth * 0.3;
-
-      if (Math.abs(diff) > threshold) {
-        this.style.transform = `translateX(${diff > 0 ? '100%' : '-100%'})`;
-        this.dismiss();
-      } else {
-        this.style.transform = 'translateX(0)';
-      }
-    };
-
-    this.addEventListener('pointerup', onPointerUp);
-    this.addEventListener('pointercancel', onPointerUp);
-  }
-
-  render() {
-    const type = this.getAttribute('type') || 'info';
-    const dismissible = this.hasAttribute('dismissible');
-
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: flex;
-          align-items: center;
-          gap: var(--space-3);
-          background: var(--card);
-          color: var(--card-foreground);
-          border: 1px solid var(--border);
-          border-left: 4px solid var(--primary);
-          padding: var(--space-3) var(--space-4);
-          border-radius: var(--radius-lg);
-          box-shadow: var(--shadow-lg);
-          transform-origin: top center;
-          animation: slide-in 0.3s ease forwards;
-          will-change: transform, opacity;
-          cursor: grab;
-          touch-action: pan-y;
-        }
-        :host([type="success"]) { border-left-color: var(--success); }
-        :host([type="warning"]) { border-left-color: var(--warning); }
-        :host([type="error"]) { border-left-color: var(--destructive); }
-        :host(.dismissing) {
-          animation: slide-out 0.3s ease forwards;
-        }
-        .content {
-          flex: 1;
-          font-size: var(--text-sm);
-          line-height: 1.4;
-        }
-        .close-button {
-          background: none;
-          border: none;
-          color: var(--muted-foreground);
-          padding: var(--space-1);
-          cursor: pointer;
-          width: 1.5rem;
-          height: 1.5rem;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          border-radius: var(--radius);
-          transition: background 0.15s ease;
-        }
-        .close-button:hover {
-          background: var(--accent);
-          color: var(--foreground);
-        }
-        @keyframes slide-in {
-          from { opacity: 0; transform: translateY(-20px) scale(0.95); }
-          to { opacity: 1; transform: translateY(0) scale(1); }
-        }
-        @keyframes slide-out {
-          from { opacity: 1; transform: translateY(0) scale(1); }
-          to { opacity: 0; transform: translateY(-20px) scale(0.95); }
-        }
-      </style>
-      <div class="icon"><slot name="icon"></slot></div>
-      <div class="content">
-        <slot></slot>
-      </div>
-      ${dismissible ? `<button class="close-button" aria-label="Dismiss">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <line x1="18" y1="6" x2="6" y2="18"></line>
-          <line x1="6" y1="6" x2="18" y2="18"></line>
-        </svg>
-      </button>` : ''}
-    `;
-  }
-}
-
-customElements.define('ds-toast', DsToast);
diff --git a/admin-ui/js/components/ds-workflow.js b/admin-ui/js/components/ds-workflow.js
deleted file mode 100644
index da8d6ff..0000000
--- a/admin-ui/js/components/ds-workflow.js
+++ /dev/null
@@ -1,399 +0,0 @@
-/**
- * @fileoverview A reusable stepper component for guided workflows.
- * Supports step dependencies, persistence, and event-driven actions.
- */
-
-const ICONS = {
-  pending: '',
-  active: `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-    <circle cx="12" cy="12" r="10"/>
-    <path d="M12 6v6l4 2"/>
-  </svg>`,
-  completed: `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
-    <polyline points="20 6 9 17 4 12"/>
-  </svg>`,
-  error: `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-    <line x1="18" y1="6" x2="6" y2="18"/>
-    <line x1="6" y1="6" x2="18" y2="18"/>
-  </svg>`,
-  skipped: `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-    <line x1="5" y1="12" x2="19" y2="12"/>
-  </svg>`
-};
-
-class DsWorkflow extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-    this._steps = [];
-  }
-
-  static get observedAttributes() {
-    return ['workflow-id'];
-  }
-
-  get workflowId() {
-    return this.getAttribute('workflow-id');
-  }
-
-  set steps(stepsArray) {
-    this._steps = stepsArray.map(s => ({
-      status: 'pending',
-      optional: false,
-      dependsOn: [],
-      ...s
-    }));
-    this._loadState();
-    this._render();
-  }
-
-  get steps() {
-    return this._steps;
-  }
-
-  connectedCallback() {
-    this._renderBase();
-  }
-
-  _loadState() {
-    if (!this.workflowId) return;
-    try {
-      const savedState = JSON.parse(localStorage.getItem(`dss_workflow_${this.workflowId}`));
-      if (savedState) {
-        this._steps.forEach(step => {
-          if (savedState[step.id]) {
-            step.status = savedState[step.id].status;
-            if (savedState[step.id].message) {
-              step.message = savedState[step.id].message;
-            }
-          }
-        });
-      }
-    } catch (e) {
-      console.error('Failed to load workflow state:', e);
-    }
-  }
-
-  _saveState() {
-    if (!this.workflowId) return;
-    const stateToSave = this._steps.reduce((acc, step) => {
-      acc[step.id] = {
-        status: step.status,
-        message: step.message || null
-      };
-      return acc;
-    }, {});
-    localStorage.setItem(`dss_workflow_${this.workflowId}`, JSON.stringify(stateToSave));
-  }
-
-  /**
-   * Update a step's status
-   * @param {string} stepId - The step ID
-   * @param {string} status - 'pending', 'active', 'completed', 'error', 'skipped'
-   * @param {string} [message] - Optional message (for error states)
-   */
-  updateStepStatus(stepId, status, message = '') {
-    const step = this._steps.find(s => s.id === stepId);
-    if (step) {
-      step.status = status;
-      step.message = message;
-      this._saveState();
-      this._render();
-
-      this.dispatchEvent(new CustomEvent('workflow-step-change', {
-        bubbles: true,
-        composed: true,
-        detail: { ...step }
-      }));
-
-      // Check if workflow is complete
-      const requiredSteps = this._steps.filter(s => !s.optional);
-      const completedRequired = requiredSteps.filter(s => s.status === 'completed').length;
-
-      if (completedRequired === requiredSteps.length && requiredSteps.length > 0) {
-        this.dispatchEvent(new CustomEvent('workflow-complete', {
-          bubbles: true,
-          composed: true
-        }));
-      }
-    }
-  }
-
-  /**
-   * Reset the workflow to initial state
-   */
-  reset() {
-    this._steps.forEach(step => {
-      step.status = 'pending';
-      step.message = '';
-    });
-    this._saveState();
-    this._render();
-  }
-
-  /**
-   * Skip a step
-   * @param {string} stepId - The step ID to skip
-   */
-  skipStep(stepId) {
-    const step = this._steps.find(s => s.id === stepId);
-    if (step && step.optional) {
-      this.updateStepStatus(stepId, 'skipped');
-    }
-  }
-
-  _determineActiveStep() {
-    const completedIds = new Set(
-      this._steps
-        .filter(s => s.status === 'completed' || s.status === 'skipped')
-        .map(s => s.id)
-    );
-
-    let foundActive = false;
-
-    this._steps.forEach(step => {
-      if (step.status === 'pending' && !foundActive) {
-        const depsMet = (step.dependsOn || []).every(depId => completedIds.has(depId));
-        if (depsMet) {
-          step.status = 'active';
-          foundActive = true;
-        }
-      }
-    });
-  }
-
-  _getProgress() {
-    const total = this._steps.filter(s => !s.optional).length;
-    const completed = this._steps.filter(s =>
-      !s.optional && (s.status === 'completed' || s.status === 'skipped')
-    ).length;
-    return total > 0 ? (completed / total) * 100 : 0;
-  }
-
-  _renderBase() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: block;
-        }
-        .workflow-container {
-          display: flex;
-          flex-direction: column;
-        }
-        .progress-bar {
-          height: 4px;
-          background: var(--muted);
-          border-radius: 2px;
-          margin-bottom: var(--space-4);
-          overflow: hidden;
-        }
-        .progress-bar__indicator {
-          height: 100%;
-          background: var(--success);
-          width: 0%;
-          transition: width 0.3s ease;
-        }
-        .steps-wrapper {
-          display: flex;
-          flex-direction: column;
-        }
-        .step {
-          display: flex;
-          gap: var(--space-3);
-        }
-        .step__indicator {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-        }
-        .step__icon {
-          width: 28px;
-          height: 28px;
-          border-radius: 50%;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          border: 2px solid var(--border);
-          background: var(--card);
-          transition: all 0.2s ease;
-          flex-shrink: 0;
-        }
-        .step__icon svg {
-          color: white;
-        }
-        .step--pending .step__icon {
-          border-color: var(--muted-foreground);
-        }
-        .step--active .step__icon {
-          border-color: var(--primary);
-          background: var(--primary);
-        }
-        .step--completed .step__icon {
-          border-color: var(--success);
-          background: var(--success);
-        }
-        .step--error .step__icon {
-          border-color: var(--destructive);
-          background: var(--destructive);
-        }
-        .step--skipped .step__icon {
-          border-color: var(--muted-foreground);
-          background: var(--muted-foreground);
-        }
-        .step__line {
-          width: 2px;
-          flex-grow: 1;
-          min-height: var(--space-4);
-          background: var(--border);
-          margin: var(--space-1) 0;
-        }
-        .step:last-child .step__line {
-          display: none;
-        }
-        .step--completed .step__line,
-        .step--skipped .step__line {
-          background: var(--success);
-        }
-        .step__content {
-          flex: 1;
-          padding-bottom: var(--space-4);
-          min-width: 0;
-        }
-        .step__header {
-          display: flex;
-          align-items: flex-start;
-          justify-content: space-between;
-          gap: var(--space-2);
-        }
-        .step__title {
-          font-weight: var(--font-medium);
-          color: var(--foreground);
-          font-size: var(--text-sm);
-        }
-        .step--pending .step__title,
-        .step--pending .step__description {
-          color: var(--muted-foreground);
-        }
-        .step__optional {
-          font-size: var(--text-xs);
-          color: var(--muted-foreground);
-          background: var(--muted);
-          padding: 0 var(--space-1);
-          border-radius: var(--radius-sm);
-        }
-        .step__description {
-          font-size: var(--text-xs);
-          color: var(--muted-foreground);
-          margin-top: var(--space-1);
-          line-height: 1.4;
-        }
-        .step__actions {
-          margin-top: var(--space-3);
-          display: flex;
-          gap: var(--space-2);
-        }
-        .error-message {
-          color: var(--destructive);
-          font-size: var(--text-xs);
-          margin-top: var(--space-2);
-          padding: var(--space-2);
-          background: oklch(from var(--destructive) l c h / 0.1);
-          border-radius: var(--radius);
-        }
-      </style>
-      <div class="workflow-container">
-        <div class="progress-bar">
-          <div class="progress-bar__indicator"></div>
-        </div>
-        <div class="steps-wrapper" id="steps-wrapper"></div>
-      </div>
-    `;
-  }
-
-  _render() {
-    const wrapper = this.shadowRoot.getElementById('steps-wrapper');
-    if (!wrapper || !this._steps || this._steps.length === 0) {
-      return;
-    }
-
-    // Determine which step should be active
-    this._determineActiveStep();
-
-    // Render steps
-    wrapper.innerHTML = this._steps.map(step => this._renderStep(step)).join('');
-
-    // Update progress bar
-    const progress = this._getProgress();
-    const indicator = this.shadowRoot.querySelector('.progress-bar__indicator');
-    if (indicator) {
-      indicator.style.width = `${progress}%`;
-    }
-
-    // Add event listeners for action buttons
-    wrapper.querySelectorAll('[data-action-event]').forEach(button => {
-      button.addEventListener('click', () => {
-        this.dispatchEvent(new CustomEvent(button.dataset.actionEvent, {
-          bubbles: true,
-          composed: true,
-          detail: { stepId: button.dataset.stepId }
-        }));
-      });
-    });
-
-    // Add skip button listeners
-    wrapper.querySelectorAll('[data-skip]').forEach(button => {
-      button.addEventListener('click', () => {
-        this.skipStep(button.dataset.skip);
-      });
-    });
-  }
-
-  _renderStep(step) {
-    const isActionable = step.status === 'active' && step.action;
-    const canSkip = step.status === 'active' && step.optional;
-
-    return `
-      <div class="step step--${step.status}" data-step-id="${step.id}">
-        <div class="step__indicator">
-          <div class="step__icon">${ICONS[step.status] || ''}</div>
-          <div class="step__line"></div>
-        </div>
-        <div class="step__content">
-          <div class="step__header">
-            <div class="step__title">${this._escapeHtml(step.title)}</div>
-            ${step.optional ? '<span class="step__optional">Optional</span>' : ''}
-          </div>
-          ${step.description ? `<div class="step__description">${this._escapeHtml(step.description)}</div>` : ''}
-          ${step.status === 'error' && step.message ? `<div class="error-message">${this._escapeHtml(step.message)}</div>` : ''}
-          ${isActionable || canSkip ? `
-            <div class="step__actions">
-              ${isActionable ? `
-                <ds-button
-                  variant="primary"
-                  size="sm"
-                  data-step-id="${step.id}"
-                  data-action-event="${step.action.event}"
-                >${step.action.label}</ds-button>
-              ` : ''}
-              ${canSkip ? `
-                <ds-button
-                  variant="ghost"
-                  size="sm"
-                  data-skip="${step.id}"
-                >Skip</ds-button>
-              ` : ''}
-            </div>
-          ` : ''}
-        </div>
-      </div>
-    `;
-  }
-
-  _escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-}
-
-customElements.define('ds-workflow', DsWorkflow);
diff --git a/admin-ui/js/components/index.js b/admin-ui/js/components/index.js
deleted file mode 100644
index 6510315..0000000
--- a/admin-ui/js/components/index.js
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * Design System Server (DSS) - Component Registry
- *
- * Central export for all Web Components.
- * Import this file to register all components.
- */
-
-// Core Components
-export { default as DsButton } from './ds-button.js';
-export { DsCard, DsCardHeader, DsCardTitle, DsCardDescription, DsCardContent, DsCardFooter } from './ds-card.js';
-export { default as DsInput } from './ds-input.js';
-export { default as DsBadge } from './ds-badge.js';
-
-// Component list for documentation
-export const componentList = [
-  {
-    name: 'ds-button',
-    description: 'Interactive button with variants and sizes',
-    variants: ['primary', 'secondary', 'outline', 'ghost', 'destructive', 'success', 'link'],
-    sizes: ['sm', 'default', 'lg', 'icon', 'icon-sm', 'icon-lg']
-  },
-  {
-    name: 'ds-card',
-    description: 'Container for grouped content',
-    subcomponents: ['ds-card-header', 'ds-card-title', 'ds-card-description', 'ds-card-content', 'ds-card-footer']
-  },
-  {
-    name: 'ds-input',
-    description: 'Text input with label, icon, and error states',
-    types: ['text', 'password', 'email', 'number', 'search', 'tel', 'url']
-  },
-  {
-    name: 'ds-badge',
-    description: 'Status indicator badge',
-    variants: ['default', 'secondary', 'outline', 'destructive', 'success', 'warning']
-  }
-];
-
-console.log('[DSS] Components loaded:', componentList.map(c => c.name).join(', '));
diff --git a/admin-ui/js/components/layout/ds-activity-bar.js b/admin-ui/js/components/layout/ds-activity-bar.js
deleted file mode 100644
index 95adb91..0000000
--- a/admin-ui/js/components/layout/ds-activity-bar.js
+++ /dev/null
@@ -1,132 +0,0 @@
-/**
- * ds-activity-bar.js
- * Activity bar component - team/project switcher
- */
-
-class DSActivityBar extends HTMLElement {
-  constructor() {
-    super();
-    this.currentTeam = 'ui';
-    this.advancedMode = this.loadAdvancedMode();
-    this.teams = [
-      { id: 'ui', label: 'UI', icon: '🎨' },
-      { id: 'ux', label: 'UX', icon: '👁️' },
-      { id: 'qa', label: 'QA', icon: '🔍' },
-      { id: 'admin', label: 'Admin', icon: '🛡️' }
-    ];
-  }
-
-  loadAdvancedMode() {
-    try {
-      return localStorage.getItem('dss-advanced-mode') === 'true';
-    } catch (e) {
-      return false;
-    }
-  }
-
-  saveAdvancedMode() {
-    try {
-      localStorage.setItem('dss-advanced-mode', this.advancedMode.toString());
-    } catch (e) {
-      console.error('Failed to save advanced mode preference:', e);
-    }
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      ${this.teams.map(team => `
-        <div class="activity-item ${team.id === this.currentTeam ? 'active' : ''}"
-             data-team="${team.id}"
-             title="${team.label} Team">
-          <span style="font-size: 20px;">${team.icon}</span>
-        </div>
-      `).join('')}
-
-      <div style="flex: 1;"></div>
-
-      <div class="activity-item"
-           data-action="chat"
-           title="AI Chat">
-        <span style="font-size: 18px;">💬</span>
-      </div>
-
-      <div class="activity-item ${this.advancedMode ? 'active' : ''}"
-           data-action="advanced-mode"
-           title="Advanced Mode: ${this.advancedMode ? 'ON' : 'OFF'}">
-        <span style="font-size: 18px;">🔧</span>
-      </div>
-
-      <div class="activity-item"
-           data-action="settings"
-           title="Settings">
-        <span style="font-size: 18px;">⚙️</span>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    this.querySelectorAll('.activity-item[data-team]').forEach(item => {
-      item.addEventListener('click', (e) => {
-        const teamId = e.currentTarget.dataset.team;
-        this.switchTeam(teamId);
-      });
-    });
-
-    this.querySelector('.activity-item[data-action="chat"]')?.addEventListener('click', () => {
-      // Toggle chat sidebar visibility
-      const chatSidebar = document.querySelector('ds-ai-chat-sidebar');
-      if (chatSidebar && chatSidebar.toggleCollapse) {
-        chatSidebar.toggleCollapse();
-      }
-    });
-
-    this.querySelector('.activity-item[data-action="advanced-mode"]')?.addEventListener('click', () => {
-      this.toggleAdvancedMode();
-    });
-
-    this.querySelector('.activity-item[data-action="settings"]')?.addEventListener('click', () => {
-      // Dispatch settings-open event to parent shell
-      this.dispatchEvent(new CustomEvent('settings-open', {
-        bubbles: true,
-        detail: { action: 'open-settings' }
-      }));
-    });
-  }
-
-  toggleAdvancedMode() {
-    this.advancedMode = !this.advancedMode;
-    this.saveAdvancedMode();
-    this.render();
-    this.setupEventListeners();
-
-    // Dispatch advanced-mode-change event to parent shell
-    this.dispatchEvent(new CustomEvent('advanced-mode-change', {
-      bubbles: true,
-      detail: { advancedMode: this.advancedMode }
-    }));
-  }
-
-  switchTeam(teamId) {
-    if (teamId === this.currentTeam) return;
-
-    this.currentTeam = teamId;
-
-    // Update active state
-    this.querySelectorAll('.activity-item[data-team]').forEach(item => {
-      item.classList.toggle('active', item.dataset.team === teamId);
-    });
-
-    // Dispatch team-switch event to parent shell
-    this.dispatchEvent(new CustomEvent('team-switch', {
-      bubbles: true,
-      detail: { team: teamId }
-    }));
-  }
-}
-
-customElements.define('ds-activity-bar', DSActivityBar);
diff --git a/admin-ui/js/components/layout/ds-ai-chat-sidebar.js b/admin-ui/js/components/layout/ds-ai-chat-sidebar.js
deleted file mode 100644
index c2d4eba..0000000
--- a/admin-ui/js/components/layout/ds-ai-chat-sidebar.js
+++ /dev/null
@@ -1,269 +0,0 @@
-/**
- * ds-ai-chat-sidebar.js
- * AI Chat Sidebar wrapper component
- * Wraps ds-chat-panel with collapse/expand toggle and context binding
- * MVP2: Right sidebar integrated with 3-column layout
- */
-
-import contextStore from '../../stores/context-store.js';
-import { useUserStore } from '../../stores/user-store.js';
-
-class DSAiChatSidebar extends HTMLElement {
-  constructor() {
-    super();
-    this.userStore = useUserStore();
-    const preferences = this.userStore.getPreferences();
-    this.isCollapsed = preferences.chatCollapsedState !== false; // Default to collapsed
-    this.currentProject = null;
-    this.currentTeam = null;
-    this.currentPage = null;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    this.initializeContextSubscriptions();
-  }
-
-  initializeContextSubscriptions() {
-    // Subscribe to context changes to update chat panel context
-    this.unsubscribe = contextStore.subscribe(({ state }) => {
-      this.currentProject = state.project;
-      this.currentTeam = state.team;
-      this.currentPage = state.page;
-
-      // Update chat panel with current context
-      const chatPanel = this.querySelector('ds-chat-panel');
-      if (chatPanel && chatPanel.setContext) {
-        chatPanel.setContext({
-          project: this.currentProject,
-          team: this.currentTeam,
-          page: this.currentPage
-        });
-      }
-    });
-
-    // Get initial context
-    const context = contextStore.getState();
-    if (context) {
-      this.currentProject = context.currentProject || context.project || null;
-      this.currentTeam = context.teamId || context.team || null;
-      this.currentPage = context.page || null;
-    }
-  }
-
-  render() {
-    const buttonClass = this.isCollapsed ? 'rotating' : '';
-
-    this.innerHTML = `
-      <div class="ai-chat-container" style="
-        display: flex;
-        flex-direction: column;
-        height: 100%;
-        background: var(--vscode-sidebar-background);
-        border-left: 1px solid var(--vscode-border);
-      " role="complementary" aria-label="AI Assistant sidebar">
-        <!-- Header with animated collapse button (shown when expanded) -->
-        <div style="
-          padding: 12px;
-          border-bottom: 1px solid var(--vscode-border);
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          background: var(--vscode-bg);
-          ${this.isCollapsed ? 'display: none;' : ''}
-        ">
-          <div style="
-            font-weight: 500;
-            font-size: 13px;
-            color: var(--vscode-foreground);
-          ">💬 AI Assistant</div>
-          <button
-            id="toggle-collapse-btn"
-            class="ai-chat-toggle-btn ${buttonClass}"
-            aria-label="Toggle chat sidebar"
-            aria-expanded="${!this.isCollapsed}"
-            style="
-              background: transparent;
-              border: none;
-              color: var(--vscode-foreground);
-              cursor: pointer;
-              padding: 4px 8px;
-              font-size: 14px;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-            "
-            title="Toggle Chat Sidebar">
-            ◀
-          </button>
-        </div>
-
-        <!-- Chat content (collapsible) -->
-        <div class="chat-content" style="
-          flex: 1;
-          overflow: hidden;
-          display: flex;
-          flex-direction: column;
-          ${this.isCollapsed ? 'display: none;' : ''}
-        ">
-          <!-- Chat panel will be hydrated here via component registry -->
-          <div id="chat-panel-container" style="
-            flex: 1;
-            overflow: hidden;
-            display: flex;
-            flex-direction: column;
-          "></div>
-        </div>
-
-        <!-- Collapsed state indicator (shown when collapsed) -->
-        ${this.isCollapsed ? `
-          <button
-            id="toggle-collapse-btn-collapsed"
-            class="ai-chat-toggle-btn ${buttonClass}"
-            aria-label="Expand chat sidebar"
-            aria-expanded="false"
-            style="
-              background: transparent;
-              border: none;
-              color: var(--vscode-foreground);
-              cursor: pointer;
-              padding: 12px;
-              font-size: 16px;
-              text-align: center;
-              flex: 1;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-            "
-            title="Expand Chat Sidebar">
-            💬
-          </button>
-        ` : ''}
-      </div>
-    `;
-  }
-
-  async setupEventListeners() {
-    // Handle both expanded and collapsed toggle buttons
-    const toggleBtn = this.querySelector('#toggle-collapse-btn');
-    const toggleBtnCollapsed = this.querySelector('#toggle-collapse-btn-collapsed');
-
-    const attachToggleListener = (btn) => {
-      if (btn) {
-        btn.addEventListener('click', () => {
-          this.toggleCollapse();
-        });
-        btn.addEventListener('keydown', (e) => {
-          if (e.key === 'Enter' || e.key === ' ') {
-            e.preventDefault();
-            btn.click();
-          }
-        });
-      }
-    };
-
-    attachToggleListener(toggleBtn);
-    attachToggleListener(toggleBtnCollapsed);
-
-    // Hydrate chat panel on first connection
-    const chatContainer = this.querySelector('#chat-panel-container');
-    if (chatContainer && chatContainer.children.length === 0) {
-      try {
-        // Import component registry to load chat panel
-        const { hydrateComponent } = await import('../../config/component-registry.js');
-        await hydrateComponent('ds-chat-panel', chatContainer);
-        console.log('[DSAiChatSidebar] Chat panel loaded');
-
-        // Set initial context on chat panel
-        const chatPanel = chatContainer.querySelector('ds-chat-panel');
-        if (chatPanel && chatPanel.setContext) {
-          chatPanel.setContext({
-            project: this.currentProject,
-            team: this.currentTeam,
-            page: this.currentPage
-          });
-        }
-      } catch (error) {
-        console.error('[DSAiChatSidebar] Failed to load chat panel:', error);
-        chatContainer.innerHTML = `
-          <div style="padding: 12px; color: var(--vscode-error); font-size: 12px;">
-            Failed to load chat panel
-          </div>
-        `;
-      }
-    }
-  }
-
-  toggleCollapse() {
-    this.isCollapsed = !this.isCollapsed;
-
-    // Persist chat collapsed state to userStore
-    this.userStore.updatePreferences({ chatCollapsedState: this.isCollapsed });
-
-    // Update CSS class for smooth CSS transition (avoid re-render for better UX)
-    if (this.isCollapsed) {
-      this.classList.add('collapsed');
-    } else {
-      this.classList.remove('collapsed');
-    }
-
-    // Update button classes for rotation animation
-    const btns = this.querySelectorAll('.ai-chat-toggle-btn');
-    btns.forEach(btn => {
-      if (this.isCollapsed) {
-        btn.classList.add('rotating');
-      } else {
-        btn.classList.remove('rotating');
-      }
-      btn.setAttribute('aria-expanded', String(!this.isCollapsed));
-    });
-
-    // Update header and content visibility with inline styles
-    const header = this.querySelector('[style*="padding: 12px"]');
-    const content = this.querySelector('.chat-content');
-
-    if (header) {
-      if (this.isCollapsed) {
-        header.style.display = 'none';
-      } else {
-        header.style.display = 'flex';
-      }
-    }
-
-    if (content) {
-      if (this.isCollapsed) {
-        content.style.display = 'none';
-      } else {
-        content.style.display = 'flex';
-      }
-    }
-
-    // Toggle collapsed button visibility
-    let collapsedBtn = this.querySelector('#toggle-collapse-btn-collapsed');
-    if (!collapsedBtn && this.isCollapsed) {
-      // Create the collapsed button if needed
-      this.render();
-      this.setupEventListeners();
-    } else if (collapsedBtn && !this.isCollapsed) {
-      // Remove the collapsed button if needed
-      this.render();
-      this.setupEventListeners();
-    }
-
-    // Dispatch event for layout adjustment
-    this.dispatchEvent(new CustomEvent('chat-sidebar-toggled', {
-      detail: { isCollapsed: this.isCollapsed },
-      bubbles: true,
-      composed: true
-    }));
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) {
-      this.unsubscribe();
-    }
-  }
-}
-
-customElements.define('ds-ai-chat-sidebar', DSAiChatSidebar);
diff --git a/admin-ui/js/components/layout/ds-panel.js b/admin-ui/js/components/layout/ds-panel.js
deleted file mode 100644
index f1db48c..0000000
--- a/admin-ui/js/components/layout/ds-panel.js
+++ /dev/null
@@ -1,120 +0,0 @@
-/**
- * ds-panel.js
- * Bottom panel component - holds team-specific tabs
- */
-
-import { getPanelConfig } from '../../config/panel-config.js';
-
-class DSPanel extends HTMLElement {
-  constructor() {
-    super();
-    this.currentTab = null;
-    this.tabs = [];
-    this.advancedMode = false;
-  }
-
-  /**
-   * Configure panel with team-specific tabs
-   * @param {string} teamId - Team identifier (ui, ux, qa, admin)
-   * @param {boolean} advancedMode - Whether advanced mode is enabled
-   */
-  configure(teamId, advancedMode = false) {
-    this.advancedMode = advancedMode;
-    this.tabs = getPanelConfig(teamId, advancedMode);
-
-    // Set first tab as current if not already set
-    if (this.tabs.length > 0 && !this.currentTab) {
-      this.currentTab = this.tabs[0].id;
-    }
-
-    // Re-render with new configuration
-    this.render();
-    this.setupEventListeners();
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div class="panel-header">
-        ${this.tabs.map(tab => `
-          <div class="panel-tab ${tab.id === this.currentTab ? 'active' : ''}"
-               data-tab="${tab.id}">
-            ${tab.label}
-          </div>
-        `).join('')}
-      </div>
-      <div class="panel-content">
-        <div id="panel-tab-content">
-          ${this.renderTabContent(this.currentTab)}
-        </div>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    this.querySelectorAll('.panel-tab').forEach(tab => {
-      tab.addEventListener('click', (e) => {
-        const tabId = e.currentTarget.dataset.tab;
-        this.switchTab(tabId);
-      });
-    });
-  }
-
-  switchTab(tabId) {
-    if (tabId === this.currentTab) return;
-
-    this.currentTab = tabId;
-
-    // Update active state
-    this.querySelectorAll('.panel-tab').forEach(tab => {
-      tab.classList.toggle('active', tab.dataset.tab === tabId);
-    });
-
-    // Update content
-    const content = this.querySelector('#panel-tab-content');
-    if (content) {
-      content.innerHTML = this.renderTabContent(tabId);
-    }
-
-    // Dispatch tab-switch event
-    this.dispatchEvent(new CustomEvent('panel-tab-switch', {
-      bubbles: true,
-      detail: { tab: tabId }
-    }));
-  }
-
-  renderTabContent(tabId) {
-    // Find tab configuration
-    const tabConfig = this.tabs.find(tab => tab.id === tabId);
-    if (!tabConfig) {
-      return '<div style="padding: 16px; color: var(--vscode-text-dim);">Tab not found</div>';
-    }
-
-    // Dynamically create component based on configuration
-    const componentTag = tabConfig.component;
-    const propsString = Object.entries(tabConfig.props || {})
-      .map(([key, value]) => `${key}="${value}"`)
-      .join(' ');
-
-    return `<${componentTag} ${propsString}></${componentTag}>`;
-  }
-
-  // Public method for workdesks to update panel content
-  setTabContent(tabId, content) {
-    const tabContent = this.querySelector('#panel-tab-content');
-    if (this.currentTab === tabId && tabContent) {
-      if (typeof content === 'string') {
-        tabContent.innerHTML = content;
-      } else {
-        tabContent.innerHTML = '';
-        tabContent.appendChild(content);
-      }
-    }
-  }
-}
-
-customElements.define('ds-panel', DSPanel);
diff --git a/admin-ui/js/components/layout/ds-project-selector.js b/admin-ui/js/components/layout/ds-project-selector.js
deleted file mode 100644
index 6eede76..0000000
--- a/admin-ui/js/components/layout/ds-project-selector.js
+++ /dev/null
@@ -1,380 +0,0 @@
-/**
- * ds-project-selector.js
- * Project selector component for workdesk header
- * MVP1: Enforces project selection before tools can be used
- * FIXED: Now uses authenticated apiClient instead of direct fetch()
- */
-
-import contextStore from '../../stores/context-store.js';
-import apiClient from '../../services/api-client.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSProjectSelector extends HTMLElement {
-  constructor() {
-    super();
-    this.projects = [];
-    this.isLoading = false;
-    this.selectedProject = contextStore.get('projectId');
-  }
-
-  async connectedCallback() {
-    this.render();
-    await this.loadProjects();
-    this.setupEventListeners();
-
-    // Subscribe to context changes
-    this.unsubscribe = contextStore.subscribeToKey('projectId', (newValue) => {
-      this.selectedProject = newValue;
-      this.updateSelectedDisplay();
-    });
-
-    // Bind auth change handler to this component
-    this.handleAuthChange = async (event) => {
-      console.log('[DSProjectSelector] Auth state changed, reloading projects');
-      await this.reloadProjects();
-    };
-
-    // Listen for custom auth-change events (fires when tokens are refreshed)
-    document.addEventListener('auth-change', this.handleAuthChange);
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) {
-      this.unsubscribe();
-    }
-
-    // Clean up auth change listener
-    if (this.handleAuthChange) {
-      document.removeEventListener('auth-change', this.handleAuthChange);
-    }
-
-    // Clean up document click listener for closing dropdown
-    if (this.closeDropdownHandler) {
-      document.removeEventListener('click', this.closeDropdownHandler);
-    }
-  }
-
-  async loadProjects() {
-    this.isLoading = true;
-    this.updateLoadingState();
-
-    try {
-      // Fetch projects from authenticated API client
-      // This ensures Authorization header is sent with the request
-      this.projects = await apiClient.getProjects();
-
-      console.log(`[DSProjectSelector] Loaded ${this.projects.length} projects`);
-
-      // If no project selected but we have projects, show prompt
-      if (!this.selectedProject && this.projects.length > 0) {
-        this.showProjectModal();
-      }
-
-      this.renderDropdown();
-    } catch (error) {
-      console.error('[DSProjectSelector] Failed to load projects:', error);
-
-      // Fallback: Create mock admin-ui project for development
-      this.projects = [{
-        id: 'admin-ui',
-        name: 'Admin UI (Default)',
-        description: 'Design System Server Admin UI'
-      }];
-
-      // Auto-select if no project selected
-      if (!this.selectedProject) {
-        try {
-          contextStore.setProject('admin-ui');
-          this.selectedProject = 'admin-ui';
-        } catch (storeError) {
-          console.error('[DSProjectSelector] Error setting project:', storeError);
-          this.selectedProject = 'admin-ui';
-        }
-      }
-
-      this.renderDropdown();
-    } finally {
-      this.isLoading = false;
-      this.updateLoadingState();
-    }
-  }
-
-  /**
-   * Public method to reload projects - called when auth state changes
-   */
-  async reloadProjects() {
-    console.log('[DSProjectSelector] Reloading projects due to auth state change');
-    await this.loadProjects();
-  }
-
-  setupEventListeners() {
-    const button = this.querySelector('#project-selector-button');
-    const dropdown = this.querySelector('#project-dropdown');
-
-    if (button && dropdown) {
-      // Add click listener to button (delegation handles via event target check)
-      button.addEventListener('click', (e) => {
-        e.stopPropagation();
-        dropdown.style.display = dropdown.style.display === 'block' ? 'none' : 'block';
-      });
-    }
-
-    // Add click listeners to dropdown items
-    const projectOptions = this.querySelectorAll('.project-option');
-    projectOptions.forEach(option => {
-      option.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const projectId = option.dataset.projectId;
-        this.selectProject(projectId);
-      });
-    });
-
-    // Close dropdown when clicking outside - stored for cleanup
-    if (!this.closeDropdownHandler) {
-      this.closeDropdownHandler = (e) => {
-        if (!this.contains(e.target) && dropdown) {
-          dropdown.style.display = 'none';
-        }
-      };
-      document.addEventListener('click', this.closeDropdownHandler);
-    }
-  }
-
-  selectProject(projectId) {
-    const project = this.projects.find(p => p.id === projectId);
-    if (!project) {
-      console.error('[DSProjectSelector] Project not found:', projectId);
-      return;
-    }
-
-    try {
-      contextStore.setProject(projectId);
-      this.selectedProject = projectId;
-
-      // Close dropdown
-      const dropdown = this.querySelector('#project-dropdown');
-      if (dropdown) {
-        dropdown.style.display = 'none';
-      }
-
-      this.updateSelectedDisplay();
-
-      ComponentHelpers.showToast?.(`Switched to project: ${project.name}`, 'success');
-
-      // Notify other components of project change
-      this.dispatchEvent(new CustomEvent('project-changed', {
-        detail: { projectId },
-        bubbles: true,
-        composed: true
-      }));
-    } catch (error) {
-      console.error('[DSProjectSelector] Error selecting project:', error);
-      ComponentHelpers.showToast?.(`Failed to select project: ${error.message}`, 'error');
-    }
-  }
-
-  showProjectModal() {
-    const modal = document.createElement('div');
-    modal.id = 'project-selection-modal';
-    modal.style.cssText = `
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background: rgba(0, 0, 0, 0.8);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      z-index: 10000;
-    `;
-
-    const content = document.createElement('div');
-    content.style.cssText = `
-      background: var(--vscode-sidebar);
-      border: 1px solid var(--vscode-border);
-      border-radius: 4px;
-      padding: 24px;
-      max-width: 500px;
-      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
-    `;
-
-    // Use event delegation instead of attaching listeners to individual buttons
-    content.innerHTML = `
-      <h2 style="font-size: 16px; margin-bottom: 12px;">Select a Project</h2>
-      <p style="font-size: 12px; color: var(--vscode-text-dim); margin-bottom: 16px;">
-        Please select a project to start working. All tools require an active project.
-      </p>
-      <div style="display: flex; flex-direction: column; gap: 8px;" id="project-buttons-container">
-        ${this.projects.map(project => `
-          <button
-            class="project-modal-button"
-            data-project-id="${project.id}"
-            type="button"
-            style="padding: 12px; background: var(--vscode-bg); border: 1px solid var(--vscode-border); border-radius: 4px; cursor: pointer; text-align: left; font-family: inherit; font-size: inherit;"
-          >
-            <div style="font-size: 12px; font-weight: 600;">${ComponentHelpers.escapeHtml(project.name)}</div>
-            ${project.description ? `<div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">${ComponentHelpers.escapeHtml(project.description)}</div>` : ''}
-          </button>
-        `).join('')}
-      </div>
-    `;
-
-    modal.appendChild(content);
-
-    // Store reference to component for event handlers
-    const component = this;
-
-    // Use event delegation on content container
-    const buttonContainer = content.querySelector('#project-buttons-container');
-    if (buttonContainer) {
-      buttonContainer.addEventListener('click', (e) => {
-        const btn = e.target.closest('.project-modal-button');
-        if (btn) {
-          e.preventDefault();
-          e.stopPropagation();
-          const projectId = btn.dataset.projectId;
-          console.log('[DSProjectSelector] Modal button clicked:', projectId);
-          try {
-            component.selectProject(projectId);
-            console.log('[DSProjectSelector] Project selected successfully');
-          } catch (err) {
-            console.error('[DSProjectSelector] Error selecting project:', err);
-          } finally {
-            // Ensure modal is always removed
-            if (modal && modal.parentNode) {
-              modal.remove();
-            }
-          }
-        }
-      });
-    }
-
-    // Close modal when clicking outside the content area
-    modal.addEventListener('click', (e) => {
-      if (e.target === modal) {
-        console.log('[DSProjectSelector] Closing modal (clicked outside)');
-        modal.remove();
-      }
-    });
-
-    document.body.appendChild(modal);
-    console.log('[DSProjectSelector] Project selection modal shown');
-  }
-
-  updateSelectedDisplay() {
-    const button = this.querySelector('#project-selector-button');
-    if (!button) return;
-
-    const selectedProject = this.projects.find(p => p.id === this.selectedProject);
-    if (selectedProject) {
-      button.innerHTML = `
-        <span style="font-size: 11px; color: var(--vscode-text-dim);">Project:</span>
-        <span style="font-size: 12px; font-weight: 600; margin-left: 4px;">${ComponentHelpers.escapeHtml(selectedProject.name)}</span>
-        <span style="margin-left: 6px;">▼</span>
-      `;
-    } else {
-      button.innerHTML = `
-        <span style="font-size: 12px; color: var(--vscode-text-dim);">Select Project</span>
-        <span style="margin-left: 6px;">▼</span>
-      `;
-    }
-  }
-
-  updateLoadingState() {
-    const button = this.querySelector('#project-selector-button');
-    if (!button) return;
-
-    if (this.isLoading) {
-      button.disabled = true;
-      button.innerHTML = '<span style="font-size: 11px;">Loading projects...</span>';
-    } else {
-      button.disabled = false;
-      this.updateSelectedDisplay();
-    }
-  }
-
-  renderDropdown() {
-    const dropdown = this.querySelector('#project-dropdown');
-    if (!dropdown) return;
-
-    if (this.projects.length === 0) {
-      dropdown.innerHTML = `
-        <div style="padding: 12px; font-size: 11px; color: var(--vscode-text-dim);">
-          No projects available
-        </div>
-      `;
-      return;
-    }
-
-    dropdown.innerHTML = `
-      ${this.projects.map(project => `
-        <div
-          class="project-option"
-          data-project-id="${project.id}"
-          style="
-            padding: 8px 12px;
-            cursor: pointer;
-            border-bottom: 1px solid var(--vscode-border);
-            ${this.selectedProject === project.id ? 'background: var(--vscode-list-activeSelectionBackground);' : ''}
-          "
-        >
-          <div style="font-size: 12px; font-weight: 600;">
-            ${this.selectedProject === project.id ? '✓ ' : ''}${ComponentHelpers.escapeHtml(project.name)}
-          </div>
-          ${project.description ? `<div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 2px;">${ComponentHelpers.escapeHtml(project.description)}</div>` : ''}
-        </div>
-      `).join('')}
-    `;
-
-    // Re-attach event listeners to dropdown items
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="position: relative; display: inline-block;">
-        <button
-          id="project-selector-button"
-          style="
-            display: flex;
-            align-items: center;
-            padding: 6px 12px;
-            background: var(--vscode-sidebar);
-            border: 1px solid var(--vscode-border);
-            border-radius: 4px;
-            cursor: pointer;
-            color: var(--vscode-text);
-          "
-        >
-          <span style="font-size: 12px;">Loading...</span>
-        </button>
-
-        <div
-          id="project-dropdown"
-          style="
-            display: none;
-            position: absolute;
-            top: 100%;
-            left: 0;
-            margin-top: 4px;
-            min-width: 250px;
-            background: var(--vscode-sidebar);
-            border: 1px solid var(--vscode-border);
-            border-radius: 4px;
-            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
-            z-index: 1000;
-            max-height: 400px;
-            overflow-y: auto;
-          "
-        >
-          <!-- Projects will be populated here -->
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-project-selector', DSProjectSelector);
-
-export default DSProjectSelector;
diff --git a/admin-ui/js/components/layout/ds-shell.js b/admin-ui/js/components/layout/ds-shell.js
deleted file mode 100644
index 185654e..0000000
--- a/admin-ui/js/components/layout/ds-shell.js
+++ /dev/null
@@ -1,755 +0,0 @@
-/**
- * ds-shell.js
- * Main shell component - provides IDE-style grid layout
- * MVP2: Integrated with AdminStore and ProjectStore for settings and project management
- */
-
-import './ds-activity-bar.js';
-import './ds-panel.js';
-import './ds-project-selector.js';
-import './ds-ai-chat-sidebar.js';
-import '../admin/ds-user-settings.js'; // Import settings component for direct instantiation
-import '../ds-notification-center.js'; // Notification center component
-import router from '../../core/router.js'; // Import Router for new architecture
-import layoutManager from '../../core/layout-manager.js';
-import toolBridge from '../../services/tool-bridge.js';
-import contextStore from '../../stores/context-store.js';
-import notificationService from '../../services/notification-service.js';
-import { useAdminStore } from '../../stores/admin-store.js';
-import { useProjectStore } from '../../stores/project-store.js';
-import { useUserStore } from '../../stores/user-store.js';
-import '../../config/component-registry.js'; // Ensure all panel components are loaded
-import { authReady } from '../../utils/demo-auth-init.js'; // Auth initialization promise
-
-class DSShell extends HTMLElement {
-  constructor() {
-    super();
-    this.currentTeam = 'ui'; // Default team
-    this.currentWorkdesk = null;
-    this.browserInitialized = false;
-    this.currentView = 'workdesk'; // Can be 'workdesk' or 'settings'
-
-    // MVP2: Initialize stores
-    this.adminStore = useAdminStore();
-    this.projectStore = useProjectStore();
-    this.userStore = useUserStore();
-
-    // Bind event handlers to avoid memory leaks
-    this.handleHashChangeBound = this.handleHashChange.bind(this);
-  }
-
-  async connectedCallback() {
-    // Render UI immediately (non-blocking)
-    this.render();
-    this.setupEventListeners();
-
-    // Initialize layout manager
-    layoutManager.init(this);
-
-    // Initialize Router (NEW - Phase 1 Architecture)
-    router.init();
-
-    // Wait for authentication to complete before making API calls
-    console.log('[DSShell] Waiting for authentication...');
-    const authResult = await authReady;
-    console.log('[DSShell] Authentication complete:', authResult);
-
-    // MVP2: Initialize store subscriptions (now safe to make API calls)
-    this.initializeStoreSubscriptions();
-
-    // Initialize notification service
-    notificationService.init();
-
-    // Set initial active link
-    this.updateActiveLink();
-  }
-
-  /**
-   * Cleanup when component is removed from DOM (prevents memory leaks)
-   */
-  disconnectedCallback() {
-    // Remove event listener to prevent memory leak
-    window.removeEventListener('hashchange', this.handleHashChangeBound);
-  }
-
-  /**
-   * MVP2: Setup store subscriptions to keep context in sync
-   */
-  initializeStoreSubscriptions() {
-    // Subscribe to admin settings changes
-    this.adminStore.subscribe(() => {
-      const settings = this.adminStore.getState();
-      contextStore.updateAdminSettings({
-        hostname: settings.hostname,
-        port: settings.port,
-        isRemote: settings.isRemote,
-        dssSetupType: settings.dssSetupType
-      });
-      console.log('[DSShell] Admin settings updated:', settings);
-    });
-
-    // Subscribe to project changes
-    this.projectStore.subscribe(() => {
-      const currentProject = this.projectStore.getCurrentProject();
-      if (currentProject) {
-        contextStore.setCurrentProject(currentProject);
-        console.log('[DSShell] Project context updated:', currentProject);
-      }
-    });
-
-    // Set initial project context
-    const currentProject = this.projectStore.getCurrentProject();
-    if (currentProject) {
-      contextStore.setCurrentProject(currentProject);
-    }
-  }
-
-  /**
-   * Initialize browser automation (required for DevTools components)
-   */
-  async initializeBrowser() {
-    if (this.browserInitialized) {
-      console.log('[DSShell] Browser already initialized');
-      return true;
-    }
-
-    console.log('[DSShell] Browser init temporarily disabled - not critical for development');
-    this.browserInitialized = true; // Mark as initialized to skip
-    return true;
-
-    /* DISABLED - MCP browser tools not available yet
-    try {
-      await toolBridge.executeTool('browser_init', {
-        mode: 'remote',
-        url: window.location.origin
-      });
-
-      this.browserInitialized = true;
-      console.log('[DSShell] Browser automation initialized successfully');
-      return true;
-    } catch (error) {
-      console.error('[DSShell] Failed to initialize browser:', error);
-      this.browserInitialized = false;
-      return false;
-    }
-    */
-  }
-
-  render() {
-    this.innerHTML = `
-      <ds-sidebar>
-        <div class="sidebar-header" style="display: flex; flex-direction: column; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--vscode-border);">
-          <div style="display: flex; align-items: center; gap: 8px;">
-            <span style="font-size: 24px; font-weight: 700;">⬡</span>
-            <div>
-              <div style="font-size: 13px; font-weight: 700; color: var(--vscode-text);">DSS</div>
-              <div style="font-size: 10px; color: var(--vscode-text-dim); line-height: 1.2;">Design System Studio</div>
-            </div>
-          </div>
-        </div>
-
-        <!-- NEW: Feature Module Navigation -->
-        <div class="sidebar-content">
-          <nav class="module-nav" style="display: flex; flex-direction: column; gap: 4px; padding-top: 12px;">
-            <a href="#projects" class="nav-item" data-path="projects" style="display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: var(--vscode-text-dim); text-decoration: none; border-radius: 4px; transition: all 0.1s; font-size: 13px;">
-              <span style="font-size: 16px;">📁</span> Projects
-            </a>
-            <a href="#config" class="nav-item" data-path="config" style="display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: var(--vscode-text-dim); text-decoration: none; border-radius: 4px; transition: all 0.1s; font-size: 13px;">
-              <span style="font-size: 16px;">⚙️</span> Configuration
-            </a>
-            <a href="#components" class="nav-item" data-path="components" style="display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: var(--vscode-text-dim); text-decoration: none; border-radius: 4px; transition: all 0.1s; font-size: 13px;">
-              <span style="font-size: 16px;">🧩</span> Components
-            </a>
-            <a href="#translations" class="nav-item" data-path="translations" style="display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: var(--vscode-text-dim); text-decoration: none; border-radius: 4px; transition: all 0.1s; font-size: 13px;">
-              <span style="font-size: 16px;">🔄</span> Translations
-            </a>
-            <a href="#discovery" class="nav-item" data-path="discovery" style="display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: var(--vscode-text-dim); text-decoration: none; border-radius: 4px; transition: all 0.1s; font-size: 13px;">
-              <span style="font-size: 16px;">🔍</span> Discovery
-            </a>
-            <div style="height: 1px; background: var(--vscode-border); margin: 8px 0;"></div>
-            <a href="#admin" class="nav-item" data-path="admin" style="display: flex; align-items: center; gap: 10px; padding: 8px 12px; color: var(--vscode-text-dim); text-decoration: none; border-radius: 4px; transition: all 0.1s; font-size: 13px;">
-              <span style="font-size: 16px;">👤</span> Admin
-            </a>
-          </nav>
-        </div>
-      </ds-sidebar>
-
-      <ds-stage>
-        <div class="stage-header" style="display: flex; justify-content: space-between; align-items: center; padding: 0 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-bg); min-height: 44px;">
-          <div class="stage-header-left" style="display: flex; align-items: center; gap: 12px;">
-            <!-- Hamburger Menu (Mobile) -->
-            <button id="hamburger-menu" class="hamburger-menu" style="display: none; padding: 6px 8px; background: transparent; border: none; color: var(--vscode-text-dim); cursor: pointer; font-size: 20px;" aria-label="Toggle sidebar">☰</button>
-
-            <!-- NEW: Project Selector -->
-            <ds-project-selector></ds-project-selector>
-          </div>
-          <div class="stage-header-right" id="stage-actions" style="display: flex; align-items: center; gap: 8px;">
-            <!-- Action buttons will be populated here -->
-          </div>
-        </div>
-        <div class="stage-content">
-          <div id="stage-workdesk-content" style="height: 100%; overflow: auto;">
-            <!-- Dynamic Module Content via Router -->
-          </div>
-        </div>
-      </ds-stage>
-
-      <ds-ai-chat-sidebar></ds-ai-chat-sidebar>
-    `;
-  }
-
-  setupEventListeners() {
-    // Setup hamburger menu for mobile
-    this.setupMobileMenu();
-
-    // Setup navigation highlight for new module nav
-    this.setupNavigationHighlight();
-
-    // Populate stage-header-right with action buttons
-    const stageActions = this.querySelector('#stage-actions');
-    if (stageActions && stageActions.children.length === 0) {
-      stageActions.innerHTML = `
-        <button id="chat-toggle-btn" aria-label="Toggle AI Chat sidebar" aria-pressed="false" style="
-          background: transparent;
-          border: none;
-          color: var(--vscode-text-dim);
-          cursor: pointer;
-          padding: 6px 8px;
-          font-size: 16px;
-          border-radius: 4px;
-          transition: all 0.1s;
-        " title="Toggle Chat (💬)">💬</button>
-
-        <button id="advanced-mode-btn" aria-label="Toggle Advanced Mode" aria-pressed="false" style="
-          background: transparent;
-          border: none;
-          color: var(--vscode-text-dim);
-          cursor: pointer;
-          padding: 6px 8px;
-          font-size: 16px;
-          border-radius: 4px;
-          transition: all 0.1s;
-        " title="Advanced Mode (🔧)">🔧</button>
-
-        <div style="position: relative;">
-          <button id="notification-toggle-btn" aria-label="Notifications" style="
-            background: transparent;
-            border: none;
-            color: var(--vscode-text-dim);
-            cursor: pointer;
-            padding: 6px 8px;
-            font-size: 16px;
-            border-radius: 4px;
-            transition: all 0.1s;
-            position: relative;
-          " title="Notifications (🔔)">🔔
-            <span id="notification-indicator" style="
-              position: absolute;
-              top: 4px;
-              right: 4px;
-              width: 8px;
-              height: 8px;
-              background: var(--vscode-accent);
-              border-radius: 50%;
-              display: none;
-            "></span>
-          </button>
-          <ds-notification-center></ds-notification-center>
-        </div>
-
-        <button id="settings-btn" aria-label="Open Settings" style="
-          background: transparent;
-          border: none;
-          color: var(--vscode-text-dim);
-          cursor: pointer;
-          padding: 6px 8px;
-          font-size: 16px;
-          border-radius: 4px;
-          transition: all 0.1s;
-        " title="Settings (⚙️)">⚙️</button>
-      `;
-
-      // Add event listeners to stage-header action buttons
-      const chatToggleBtn = this.querySelector('#chat-toggle-btn');
-      if (chatToggleBtn) {
-        chatToggleBtn.addEventListener('click', () => {
-          const chatSidebar = this.querySelector('ds-ai-chat-sidebar');
-          if (chatSidebar && chatSidebar.toggleCollapse) {
-            chatSidebar.toggleCollapse();
-            const pressed = chatSidebar.isCollapsed ? 'false' : 'true';
-            chatToggleBtn.setAttribute('aria-pressed', pressed);
-          }
-        });
-        chatToggleBtn.addEventListener('keydown', (e) => {
-          if (e.key === 'Enter' || e.key === ' ') {
-            e.preventDefault();
-            chatToggleBtn.click();
-          } else if (e.key === 'Escape') {
-            const chatSidebar = this.querySelector('ds-ai-chat-sidebar');
-            if (chatSidebar && !chatSidebar.isCollapsed) {
-              chatToggleBtn.click();
-            }
-          }
-        });
-        chatToggleBtn.addEventListener('mouseenter', (e) => {
-          e.target.style.color = 'var(--vscode-text)';
-          e.target.style.background = 'var(--vscode-selection)';
-        });
-        chatToggleBtn.addEventListener('mouseleave', (e) => {
-          e.target.style.color = 'var(--vscode-text-dim)';
-          e.target.style.background = 'transparent';
-        });
-      }
-
-      const advancedModeBtn = this.querySelector('#advanced-mode-btn');
-      if (advancedModeBtn) {
-        advancedModeBtn.addEventListener('click', () => {
-          this.toggleAdvancedMode();
-        });
-        advancedModeBtn.addEventListener('keydown', (e) => {
-          if (e.key === 'Enter' || e.key === ' ') {
-            e.preventDefault();
-            advancedModeBtn.click();
-          }
-        });
-        advancedModeBtn.addEventListener('mouseenter', (e) => {
-          e.target.style.color = 'var(--vscode-text)';
-          e.target.style.background = 'var(--vscode-selection)';
-        });
-        advancedModeBtn.addEventListener('mouseleave', (e) => {
-          e.target.style.color = 'var(--vscode-text-dim)';
-          e.target.style.background = 'transparent';
-        });
-      }
-
-      const settingsBtn = this.querySelector('#settings-btn');
-      if (settingsBtn) {
-        settingsBtn.addEventListener('click', () => {
-          this.openSettings();
-        });
-        settingsBtn.addEventListener('keydown', (e) => {
-          if (e.key === 'Enter' || e.key === ' ') {
-            e.preventDefault();
-            settingsBtn.click();
-          }
-        });
-        settingsBtn.addEventListener('mouseenter', (e) => {
-          e.target.style.color = 'var(--vscode-text)';
-          e.target.style.background = 'var(--vscode-selection)';
-        });
-        settingsBtn.addEventListener('mouseleave', (e) => {
-          e.target.style.color = 'var(--vscode-text-dim)';
-          e.target.style.background = 'transparent';
-        });
-      }
-
-      // Notification Center integration
-      const notificationToggleBtn = this.querySelector('#notification-toggle-btn');
-      const notificationCenter = this.querySelector('ds-notification-center');
-      const notificationIndicator = this.querySelector('#notification-indicator');
-
-      if (notificationToggleBtn && notificationCenter) {
-        // Toggle notification panel
-        notificationToggleBtn.addEventListener('click', (e) => {
-          e.stopPropagation();
-          const isOpen = notificationCenter.hasAttribute('open');
-          if (isOpen) {
-            notificationCenter.removeAttribute('open');
-          } else {
-            notificationCenter.setAttribute('open', '');
-          }
-        });
-
-        // Close when clicking outside
-        document.addEventListener('click', (e) => {
-          if (!notificationCenter.contains(e.target) && !notificationToggleBtn.contains(e.target)) {
-            notificationCenter.removeAttribute('open');
-          }
-        });
-
-        // Update unread indicator
-        notificationService.addEventListener('unread-count-changed', (e) => {
-          const { count } = e.detail;
-          if (notificationIndicator) {
-            notificationIndicator.style.display = count > 0 ? 'block' : 'none';
-          }
-        });
-
-        // Handle notification actions (navigation)
-        notificationCenter.addEventListener('notification-action', (e) => {
-          const { event, payload } = e.detail;
-          console.log('[DSShell] Notification action:', event, payload);
-
-          // Handle navigation events
-          if (event.startsWith('navigate:')) {
-            const page = event.replace('navigate:', '');
-            // Route to the appropriate page
-            // This would integrate with your routing system
-            console.log('[DSShell] Navigate to:', page, payload);
-          }
-        });
-
-        // Hover effects
-        notificationToggleBtn.addEventListener('mouseenter', (e) => {
-          e.target.style.color = 'var(--vscode-text)';
-          e.target.style.background = 'var(--vscode-selection)';
-        });
-        notificationToggleBtn.addEventListener('mouseleave', (e) => {
-          e.target.style.color = 'var(--vscode-text-dim)';
-          e.target.style.background = 'transparent';
-        });
-      }
-    }
-
-    // Add team button event listeners
-    const teamBtns = this.querySelectorAll('.team-btn');
-    teamBtns.forEach((btn, index) => {
-      btn.addEventListener('click', (e) => {
-        const teamId = e.target.dataset.team;
-        this.switchTeam(teamId);
-      });
-
-      // Keyboard navigation (Arrow keys)
-      btn.addEventListener('keydown', (e) => {
-        let nextBtn = null;
-        if (e.key === 'ArrowRight') {
-          e.preventDefault();
-          nextBtn = teamBtns[(index + 1) % teamBtns.length];
-        } else if (e.key === 'ArrowLeft') {
-          e.preventDefault();
-          nextBtn = teamBtns[(index - 1 + teamBtns.length) % teamBtns.length];
-        }
-        if (nextBtn) {
-          nextBtn.focus();
-          nextBtn.click();
-        }
-      });
-
-      // Hover effects
-      btn.addEventListener('mouseenter', (e) => {
-        e.target.style.color = 'var(--vscode-text)';
-        e.target.style.background = 'var(--vscode-selection)';
-      });
-
-      btn.addEventListener('mouseleave', (e) => {
-        // Keep accent color if this is the active team
-        if (e.target.classList.contains('active')) {
-          e.target.style.color = 'var(--vscode-accent)';
-          e.target.style.background = 'var(--vscode-selection)';
-        } else {
-          e.target.style.color = 'var(--vscode-text-dim)';
-          e.target.style.background = 'transparent';
-        }
-      });
-    });
-
-    // Set initial active team button
-    this.updateTeamButtonStates();
-  }
-
-  updateTeamButtonStates() {
-    const teamBtns = this.querySelectorAll('.team-btn');
-    teamBtns.forEach(btn => {
-      if (btn.dataset.team === this.currentTeam) {
-        btn.classList.add('active');
-        btn.setAttribute('aria-selected', 'true');
-        btn.style.color = 'var(--vscode-accent)';
-        btn.style.background = 'var(--vscode-selection)';
-        btn.style.borderColor = 'var(--vscode-accent)';
-      } else {
-        btn.classList.remove('active');
-        btn.setAttribute('aria-selected', 'false');
-        btn.style.color = 'var(--vscode-text-dim)';
-        btn.style.background = 'transparent';
-        btn.style.borderColor = 'transparent';
-      }
-    });
-  }
-
-  setupMobileMenu() {
-    const hamburgerBtn = this.querySelector('#hamburger-menu');
-    const sidebar = this.querySelector('ds-sidebar');
-
-    if (hamburgerBtn) {
-      hamburgerBtn.addEventListener('click', () => {
-        if (sidebar) {
-          const isOpen = sidebar.classList.contains('mobile-open');
-          if (isOpen) {
-            sidebar.classList.remove('mobile-open');
-            hamburgerBtn.setAttribute('aria-expanded', 'false');
-          } else {
-            sidebar.classList.add('mobile-open');
-            hamburgerBtn.setAttribute('aria-expanded', 'true');
-          }
-        }
-      });
-
-      hamburgerBtn.addEventListener('keydown', (e) => {
-        if (e.key === 'Enter' || e.key === ' ') {
-          e.preventDefault();
-          hamburgerBtn.click();
-        }
-      });
-    }
-
-    // Close sidebar when clicking on a team button (mobile)
-    const teamBtns = this.querySelectorAll('.team-btn');
-    teamBtns.forEach(btn => {
-      btn.addEventListener('click', () => {
-        if (sidebar && window.innerWidth <= 768) {
-          sidebar.classList.remove('mobile-open');
-          if (hamburgerBtn) {
-            hamburgerBtn.setAttribute('aria-expanded', 'false');
-          }
-        }
-      });
-    });
-
-    // Show/hide hamburger menu based on screen size
-    const updateMenuVisibility = () => {
-      if (hamburgerBtn) {
-        if (window.innerWidth <= 768) {
-          hamburgerBtn.style.display = 'flex';
-        } else {
-          hamburgerBtn.style.display = 'none';
-          if (sidebar) {
-            sidebar.classList.remove('mobile-open');
-          }
-        }
-      }
-    };
-
-    updateMenuVisibility();
-    window.addEventListener('resize', updateMenuVisibility);
-  }
-
-  toggleAdvancedMode() {
-    // Get activity bar for advanced mode state (or create local tracking)
-    const activityBar = this.querySelector('ds-activity-bar');
-    let advancedMode = false;
-
-    if (activityBar && activityBar.advancedMode !== undefined) {
-      advancedMode = !activityBar.advancedMode;
-      activityBar.advancedMode = advancedMode;
-      activityBar.saveAdvancedMode();
-    } else {
-      // Fallback: use localStorage directly
-      advancedMode = localStorage.getItem('dss-advanced-mode') !== 'true';
-      localStorage.setItem('dss-advanced-mode', advancedMode.toString());
-    }
-
-    this.onAdvancedModeChange(advancedMode);
-
-    // Update button appearance and accessibility state
-    const advancedModeBtn = this.querySelector('#advanced-mode-btn');
-    if (advancedModeBtn) {
-      advancedModeBtn.setAttribute('aria-pressed', advancedMode.toString());
-      advancedModeBtn.style.color = advancedMode ? 'var(--vscode-accent)' : 'var(--vscode-text-dim)';
-    }
-  }
-
-  onAdvancedModeChange(advancedMode) {
-    console.log(`Advanced mode: ${advancedMode ? 'ON' : 'OFF'}`);
-
-    // Reconfigure panel with new advanced mode setting
-    const panel = this.querySelector('ds-panel');
-    if (panel) {
-      panel.configure(this.currentTeam, advancedMode);
-    }
-  }
-
-  async switchTeam(teamId) {
-    console.log(`Switching to team: ${teamId}`);
-    this.currentTeam = teamId;
-
-    // Persist team selection to userStore
-    this.userStore.updatePreferences({ lastTeam: teamId });
-
-    // Update team button states
-    this.updateTeamButtonStates();
-
-    // Update stage title
-    const stageTitle = this.querySelector('#stage-title');
-    if (stageTitle) {
-      stageTitle.textContent = `${teamId.toUpperCase()} Workdesk`;
-    }
-
-    // Apply admin-mode class for full-page layout
-    if (teamId === 'admin') {
-      this.classList.add('admin-mode');
-
-      // Initialize browser automation for admin team (needed for DevTools components)
-      this.initializeBrowser().catch(error => {
-        console.warn('[DSShell] Browser initialization failed (non-blocking):', error.message);
-      });
-    } else {
-      this.classList.remove('admin-mode');
-    }
-
-    // Configure panel for this team
-    const panel = this.querySelector('ds-panel');
-    const activityBar = this.querySelector('ds-activity-bar');
-    if (panel) {
-      // Get advancedMode from activity bar
-      const advancedMode = activityBar?.advancedMode || false;
-      panel.configure(teamId, advancedMode);
-    }
-
-    // Use layout manager to switch workdesk
-    try {
-      this.currentWorkdesk = await layoutManager.switchWorkdesk(teamId);
-    } catch (error) {
-      console.error(`Failed to load workdesk for team ${teamId}:`, error);
-
-      // Show error in stage
-      const stageContent = this.querySelector('#stage-workdesk-content');
-      if (stageContent) {
-        stageContent.innerHTML = `
-          <div style="text-align: center; padding: 48px; color: #f48771;">
-            <h2>Failed to load ${teamId.toUpperCase()} Workdesk</h2>
-            <p style="margin-top: 16px;">Error: ${error.message}</p>
-          </div>
-        `;
-      }
-    }
-  }
-
-  /**
-   * Open user settings view
-   */
-  async openSettings() {
-    this.currentView = 'settings';
-
-    const stageContent = this.querySelector('#stage-workdesk-content');
-    const stageTitle = this.querySelector('#stage-title');
-
-    if (stageTitle) {
-      stageTitle.textContent = '⚙️ Settings';
-    }
-
-    if (stageContent) {
-      // Clear existing content
-      stageContent.innerHTML = '';
-
-      // Create and append user settings component
-      const settingsComponent = document.createElement('ds-user-settings');
-      stageContent.appendChild(settingsComponent);
-    }
-
-    // Hide sidebar and minimize panel for full-width settings
-    const sidebar = this.querySelector('ds-sidebar');
-    const panel = this.querySelector('ds-panel');
-
-    if (sidebar) {
-      sidebar.classList.add('collapsed');
-    }
-    if (panel) {
-      panel.classList.add('collapsed');
-    }
-
-    console.log('[DSShell] Settings view opened');
-  }
-
-  /**
-   * Close settings view and return to workdesk
-   */
-  closeSettings() {
-    if (this.currentView === 'settings') {
-      this.currentView = 'workdesk';
-
-      // Restore sidebar and panel
-      const sidebar = this.querySelector('ds-sidebar');
-      const panel = this.querySelector('ds-panel');
-
-      if (sidebar) {
-        sidebar.classList.remove('collapsed');
-      }
-      if (panel) {
-        panel.classList.remove('collapsed');
-      }
-
-      // Reload current team's workdesk
-      this.switchTeam(this.currentTeam);
-    }
-  }
-
-  setupNavigationHighlight() {
-    // Use requestAnimationFrame to ensure DOM is ready (fixes race condition)
-    requestAnimationFrame(() => {
-      const navItems = this.querySelectorAll('.nav-item');
-
-      if (navItems.length === 0) {
-        console.warn('[DSShell] No nav items found for highlight setup');
-        return;
-      }
-
-      navItems.forEach(item => {
-        item.addEventListener('mouseenter', (e) => {
-          if (!e.target.classList.contains('active')) {
-            e.target.style.background = 'var(--vscode-list-hoverBackground, rgba(255,255,255,0.1))';
-            e.target.style.color = 'var(--vscode-text)';
-          }
-        });
-        item.addEventListener('mouseleave', (e) => {
-          if (!e.target.classList.contains('active')) {
-            e.target.style.background = 'transparent';
-            e.target.style.color = 'var(--vscode-text-dim)';
-          }
-        });
-      });
-
-      // Use bound handler to enable proper cleanup (fixes memory leak)
-      window.addEventListener('hashchange', this.handleHashChangeBound);
-    });
-  }
-
-  /**
-   * Handle hash change events (bound in constructor for proper cleanup)
-   */
-  handleHashChange() {
-    this.updateActiveLink();
-  }
-
-  updateActiveLink(path) {
-    const currentPath = path || (window.location.hash.replace('#', '') || 'projects');
-    const navItems = this.querySelectorAll('.nav-item');
-
-    navItems.forEach(item => {
-      const itemPath = item.dataset.path;
-      if (itemPath === currentPath) {
-        item.classList.add('active');
-        item.style.background = 'var(--vscode-list-activeSelectionBackground, var(--vscode-selection))';
-        item.style.color = 'var(--vscode-list-activeSelectionForeground, var(--vscode-accent))';
-        item.style.fontWeight = '500';
-      } else {
-        item.classList.remove('active');
-        item.style.background = 'transparent';
-        item.style.color = 'var(--vscode-text-dim)';
-        item.style.fontWeight = 'normal';
-      }
-    });
-  }
-
-  // Getters for workdesk components to access
-  get sidebarContent() {
-    return this.querySelector('#sidebar-workdesk-content');
-  }
-
-  get stageContent() {
-    return this.querySelector('#stage-workdesk-content');
-  }
-
-  get stageActions() {
-    return this.querySelector('#stage-actions');
-  }
-}
-
-// Define custom element
-customElements.define('ds-shell', DSShell);
-
-// Also define the sidebar and stage as custom elements for CSS targeting
-class DSSidebar extends HTMLElement {}
-class DSStage extends HTMLElement {}
-
-customElements.define('ds-sidebar', DSSidebar);
-customElements.define('ds-stage', DSStage);
diff --git a/admin-ui/js/components/listings/ds-component-list.js b/admin-ui/js/components/listings/ds-component-list.js
deleted file mode 100644
index 31b5c1b..0000000
--- a/admin-ui/js/components/listings/ds-component-list.js
+++ /dev/null
@@ -1,190 +0,0 @@
-/**
- * ds-component-list.js
- * Component listing and management interface
- * Shows all components with links to Storybook and adoption stats
- */
-
-import URLBuilder from '../../utils/url-builder.js';
-
-export default class ComponentList extends HTMLElement {
-  constructor() {
-    super();
-    this.components = [
-      { id: 'button', name: 'Button', category: 'Inputs', adoption: 95, variants: 12 },
-      { id: 'input', name: 'Input Field', category: 'Inputs', adoption: 88, variants: 8 },
-      { id: 'card', name: 'Card', category: 'Containers', adoption: 92, variants: 5 },
-      { id: 'modal', name: 'Modal', category: 'Containers', adoption: 78, variants: 3 },
-      { id: 'badge', name: 'Badge', category: 'Status', adoption: 85, variants: 6 },
-      { id: 'tooltip', name: 'Tooltip', category: 'Helpers', adoption: 72, variants: 4 },
-      { id: 'dropdown', name: 'Dropdown', category: 'Inputs', adoption: 81, variants: 4 },
-      { id: 'pagination', name: 'Pagination', category: 'Navigation', adoption: 65, variants: 2 },
-    ];
-    this.selectedCategory = 'All';
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <div style="margin-bottom: 24px;">
-          <h1 style="margin: 0 0 8px 0; font-size: 24px;">Design System Components</h1>
-          <p style="margin: 0; color: var(--vscode-text-dim);">
-            Browse, preview, and track component adoption
-          </p>
-        </div>
-
-        <!-- Filter Bar -->
-        <div style="margin-bottom: 24px; display: flex; gap: 8px; flex-wrap: wrap;">
-          <button class="filter-btn" data-category="All" style="
-            padding: 6px 12px;
-            background: var(--vscode-selection);
-            color: var(--vscode-foreground);
-            border: 1px solid var(--vscode-focusBorder);
-            border-radius: 4px;
-            cursor: pointer;
-            font-size: 12px;
-            font-weight: 500;
-          ">All</button>
-          ${['Inputs', 'Containers', 'Status', 'Helpers', 'Navigation'].map(cat => `
-            <button class="filter-btn" data-category="${cat}" style="
-              padding: 6px 12px;
-              background: var(--vscode-sidebar);
-              color: var(--vscode-foreground);
-              border: 1px solid var(--vscode-border);
-              border-radius: 4px;
-              cursor: pointer;
-              font-size: 12px;
-              font-weight: 500;
-            ">${cat}</button>
-          `).join('')}
-        </div>
-
-        <!-- Components Grid -->
-        <div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px;">
-          ${this.renderComponents()}
-        </div>
-      </div>
-    `;
-  }
-
-  renderComponents() {
-    const filtered = this.selectedCategory === 'All'
-      ? this.components
-      : this.components.filter(c => c.category === this.selectedCategory);
-
-    return filtered.map(component => `
-      <div style="
-        background: var(--vscode-sidebar);
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        overflow: hidden;
-      ">
-        <!-- Header -->
-        <div style="
-          background: var(--vscode-bg);
-          padding: 12px;
-          border-bottom: 1px solid var(--vscode-border);
-        ">
-          <div style="display: flex; justify-content: space-between; align-items: start; margin-bottom: 8px;">
-            <div>
-              <div style="font-weight: 600; font-size: 14px; margin-bottom: 2px;">
-                ${component.name}
-              </div>
-              <div style="font-size: 11px; color: var(--vscode-text-dim);">
-                ${component.category}
-              </div>
-            </div>
-            <span style="
-              background: #4caf50;
-              color: white;
-              padding: 2px 8px;
-              border-radius: 3px;
-              font-size: 10px;
-              font-weight: 600;
-            ">${component.adoption}%</span>
-          </div>
-        </div>
-
-        <!-- Content -->
-        <div style="padding: 12px;">
-          <div style="display: flex; justify-content: space-between; margin-bottom: 12px; font-size: 12px;">
-            <span>Variants: <strong>${component.variants}</strong></span>
-            <span>Adoption: <strong>${component.adoption}%</strong></span>
-          </div>
-
-          <!-- Progress Bar -->
-          <div style="width: 100%; height: 4px; background: var(--vscode-bg); border-radius: 2px; overflow: hidden; margin-bottom: 12px;">
-            <div style="width: ${component.adoption}%; height: 100%; background: #4caf50;"></div>
-          </div>
-
-          <!-- Actions -->
-          <div style="display: flex; gap: 8px;">
-            <button class="storybook-btn" data-component-id="${component.id}" style="
-              flex: 1;
-              padding: 6px;
-              background: var(--vscode-button-background);
-              color: var(--vscode-button-foreground);
-              border: none;
-              border-radius: 3px;
-              cursor: pointer;
-              font-size: 11px;
-              font-weight: 500;
-            ">📖 Storybook</button>
-            <button class="edit-btn" data-component-id="${component.id}" style="
-              flex: 1;
-              padding: 6px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 3px;
-              cursor: pointer;
-              font-size: 11px;
-              font-weight: 500;
-            ">✏️ Edit</button>
-          </div>
-        </div>
-      </div>
-    `).join('');
-  }
-
-  setupEventListeners() {
-    // Filter buttons
-    this.querySelectorAll('.filter-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        this.selectedCategory = btn.dataset.category;
-        this.render();
-        this.setupEventListeners();
-      });
-    });
-
-    // Storybook buttons
-    this.querySelectorAll('.storybook-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        const componentId = btn.dataset.componentId;
-        const component = this.components.find(c => c.id === componentId);
-        if (component) {
-          const url = URLBuilder.getComponentUrl(component);
-          window.open(url, '_blank');
-        }
-      });
-    });
-
-    // Edit buttons
-    this.querySelectorAll('.edit-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        const componentId = btn.dataset.componentId;
-        this.dispatchEvent(new CustomEvent('edit-component', {
-          detail: { componentId },
-          bubbles: true,
-          composed: true
-        }));
-      });
-    });
-  }
-}
-
-customElements.define('ds-component-list', ComponentList);
diff --git a/admin-ui/js/components/listings/ds-icon-list.js b/admin-ui/js/components/listings/ds-icon-list.js
deleted file mode 100644
index 36bf007..0000000
--- a/admin-ui/js/components/listings/ds-icon-list.js
+++ /dev/null
@@ -1,249 +0,0 @@
-/**
- * ds-icon-list.js
- * Icon gallery and management
- * Browse and export icons from the design system
- */
-
-export default class IconList extends HTMLElement {
-  constructor() {
-    super();
-    this.icons = [
-      { id: 'check', name: 'Check', category: 'Status', svg: '✓', tags: ['status', 'success', 'validation'] },
-      { id: 'x', name: 'Close', category: 'Status', svg: '✕', tags: ['status', 'error', 'dismiss'] },
-      { id: 'info', name: 'Info', category: 'Status', svg: 'ⓘ', tags: ['status', 'information', 'help'] },
-      { id: 'warning', name: 'Warning', category: 'Status', svg: '⚠', tags: ['status', 'warning', 'alert'] },
-      { id: 'arrow-right', name: 'Arrow Right', category: 'Navigation', svg: '→', tags: ['navigation', 'direction', 'next'] },
-      { id: 'arrow-left', name: 'Arrow Left', category: 'Navigation', svg: '←', tags: ['navigation', 'direction', 'back'] },
-      { id: 'arrow-up', name: 'Arrow Up', category: 'Navigation', svg: '↑', tags: ['navigation', 'direction', 'up'] },
-      { id: 'arrow-down', name: 'Arrow Down', category: 'Navigation', svg: '↓', tags: ['navigation', 'direction', 'down'] },
-      { id: 'search', name: 'Search', category: 'Actions', svg: '🔍', tags: ['action', 'search', 'find'] },
-      { id: 'settings', name: 'Settings', category: 'Actions', svg: '⚙', tags: ['action', 'settings', 'config'] },
-      { id: 'download', name: 'Download', category: 'Actions', svg: '⬇', tags: ['action', 'download', 'save'] },
-      { id: 'upload', name: 'Upload', category: 'Actions', svg: '⬆', tags: ['action', 'upload', 'import'] },
-    ];
-    this.selectedCategory = 'All';
-    this.searchTerm = '';
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <div style="margin-bottom: 24px;">
-          <h1 style="margin: 0 0 8px 0; font-size: 24px;">Icon Library</h1>
-          <p style="margin: 0; color: var(--vscode-text-dim);">
-            Browse and manage icon assets
-          </p>
-        </div>
-
-        <!-- Search and Filter -->
-        <div style="margin-bottom: 24px; display: flex; gap: 12px;">
-          <input
-            id="icon-search"
-            type="text"
-            placeholder="Search icons..."
-            style="
-              flex: 1;
-              padding: 8px 12px;
-              border: 1px solid var(--vscode-input-border);
-              background: var(--vscode-input-background);
-              color: var(--vscode-foreground);
-              border-radius: 4px;
-              font-size: 12px;
-            "
-          />
-          <select id="icon-filter" style="
-            padding: 8px 12px;
-            border: 1px solid var(--vscode-input-border);
-            background: var(--vscode-input-background);
-            color: var(--vscode-foreground);
-            border-radius: 4px;
-            font-size: 12px;
-          ">
-            <option value="All">All Categories</option>
-            <option value="Status">Status</option>
-            <option value="Navigation">Navigation</option>
-            <option value="Actions">Actions</option>
-          </select>
-        </div>
-
-        <!-- Icon Grid -->
-        <div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 12px; margin-bottom: 24px;">
-          ${this.renderIconCards()}
-        </div>
-
-        <!-- Export Section -->
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-          <h3 style="margin: 0 0 12px 0; font-size: 14px;">Export Options</h3>
-          <div style="display: flex; gap: 8px;">
-            <button id="export-svg-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-              font-size: 12px;
-            ">📦 Export as SVG</button>
-            <button id="export-font-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-              font-size: 12px;
-            ">🔤 Export as Font</button>
-            <button id="export-json-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-              font-size: 12px;
-            ">📄 Export as JSON</button>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  renderIconCards() {
-    let filtered = this.icons;
-
-    if (this.selectedCategory !== 'All') {
-      filtered = filtered.filter(i => i.category === this.selectedCategory);
-    }
-
-    if (this.searchTerm) {
-      const term = this.searchTerm.toLowerCase();
-      filtered = filtered.filter(i =>
-        i.name.toLowerCase().includes(term) ||
-        i.id.toLowerCase().includes(term) ||
-        i.tags.some(t => t.includes(term))
-      );
-    }
-
-    return filtered.map(icon => `
-      <div class="icon-card" data-icon-id="${icon.id}" style="
-        background: var(--vscode-sidebar);
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        padding: 12px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        cursor: pointer;
-        transition: all 0.2s;
-      ">
-        <div style="
-          font-size: 32px;
-          margin-bottom: 8px;
-          width: 48px;
-          height: 48px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          background: var(--vscode-bg);
-          border-radius: 3px;
-        ">${icon.svg}</div>
-        <div style="text-align: center; width: 100%;">
-          <div style="font-size: 11px; font-weight: 500; margin-bottom: 2px;">
-            ${icon.name}
-          </div>
-          <div style="font-size: 10px; color: var(--vscode-text-dim); font-family: monospace;">
-            ${icon.id}
-          </div>
-          <div style="font-size: 9px; color: var(--vscode-text-dim); margin-top: 4px;">
-            ${icon.category}
-          </div>
-        </div>
-      </div>
-    `).join('');
-  }
-
-  setupEventListeners() {
-    // Search input
-    const searchInput = this.querySelector('#icon-search');
-    if (searchInput) {
-      searchInput.addEventListener('input', (e) => {
-        this.searchTerm = e.target.value;
-        this.render();
-        this.setupEventListeners();
-      });
-    }
-
-    // Category filter
-    const filterSelect = this.querySelector('#icon-filter');
-    if (filterSelect) {
-      filterSelect.addEventListener('change', (e) => {
-        this.selectedCategory = e.target.value;
-        this.render();
-        this.setupEventListeners();
-      });
-    }
-
-    // Icon cards (copy on click)
-    this.querySelectorAll('.icon-card').forEach(card => {
-      card.addEventListener('click', () => {
-        const iconId = card.dataset.iconId;
-        navigator.clipboard.writeText(iconId).then(() => {
-          const originalBg = card.style.background;
-          card.style.background = 'var(--vscode-selection)';
-          setTimeout(() => {
-            card.style.background = originalBg;
-          }, 300);
-        });
-      });
-    });
-
-    // Export buttons
-    const exportSvgBtn = this.querySelector('#export-svg-btn');
-    if (exportSvgBtn) {
-      exportSvgBtn.addEventListener('click', () => {
-        this.downloadIcons('svg');
-      });
-    }
-
-    const exportJsonBtn = this.querySelector('#export-json-btn');
-    if (exportJsonBtn) {
-      exportJsonBtn.addEventListener('click', () => {
-        this.downloadIcons('json');
-      });
-    }
-  }
-
-  downloadIcons(format) {
-    const data = format === 'json'
-      ? JSON.stringify(this.icons, null, 2)
-      : this.generateSVGSheet();
-
-    const blob = new Blob([data], { type: format === 'json' ? 'application/json' : 'image/svg+xml' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = `icons.${format === 'json' ? 'json' : 'svg'}`;
-    a.click();
-    URL.revokeObjectURL(url);
-  }
-
-  generateSVGSheet() {
-    return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 800">
-      ${this.icons.map((icon, i) => `
-        <text x="${(i % 12) * 100 + 50}" y="${Math.floor(i / 12) * 100 + 50}" font-size="40" text-anchor="middle">
-          ${icon.svg}
-        </text>
-      `).join('')}
-    </svg>`;
-  }
-}
-
-customElements.define('ds-icon-list', IconList);
diff --git a/admin-ui/js/components/listings/ds-jira-issues.js b/admin-ui/js/components/listings/ds-jira-issues.js
deleted file mode 100644
index 07f17cc..0000000
--- a/admin-ui/js/components/listings/ds-jira-issues.js
+++ /dev/null
@@ -1,293 +0,0 @@
-/**
- * ds-jira-issues.js
- * Jira issue tracker integration
- * View project-specific Jira issues for design system work
- */
-
-import contextStore from '../../stores/context-store.js';
-
-export default class JiraIssues extends HTMLElement {
-  constructor() {
-    super();
-    this.state = {
-      projectId: null,
-      issues: [],
-      filterStatus: 'All',
-      isLoading: false
-    };
-
-    // Mock data for demo
-    this.mockIssues = [
-      { key: 'DSS-234', summary: 'Add Button component variants', status: 'In Progress', type: 'Task', priority: 'High', assignee: 'John Doe' },
-      { key: 'DSS-235', summary: 'Update color token naming convention', status: 'To Do', type: 'Story', priority: 'Medium', assignee: 'Unassigned' },
-      { key: 'DSS-236', summary: 'Fix Card component accessibility', status: 'In Review', type: 'Bug', priority: 'High', assignee: 'Jane Smith' },
-      { key: 'DSS-237', summary: 'Document Typography system', status: 'Done', type: 'Task', priority: 'Low', assignee: 'Mike Johnson' },
-      { key: 'DSS-238', summary: 'Create Icon font export', status: 'To Do', type: 'Task', priority: 'Medium', assignee: 'Sarah Wilson' },
-      { key: 'DSS-239', summary: 'Implement Figma sync automation', status: 'In Progress', type: 'Epic', priority: 'High', assignee: 'John Doe' },
-    ];
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-
-    // Subscribe to project context changes
-    this.unsubscribe = contextStore.subscribe(({ state }) => {
-      this.state.projectId = state.projectId;
-      this.loadIssues();
-    });
-
-    // Load initial issues
-    this.state.projectId = contextStore.get('projectId');
-    this.loadIssues();
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) this.unsubscribe();
-  }
-
-  async loadIssues() {
-    this.state.isLoading = true;
-    this.renderLoading();
-
-    // Simulate API call delay
-    await new Promise(resolve => setTimeout(resolve, 800));
-
-    // In real implementation, fetch from Jira API via backend
-    this.state.issues = this.mockIssues;
-    this.state.isLoading = false;
-    this.render();
-    this.setupEventListeners();
-  }
-
-  renderLoading() {
-    this.innerHTML = `
-      <div style="padding: 24px; display: flex; align-items: center; justify-content: center; height: 100%;">
-        <div style="text-align: center;">
-          <div style="font-size: 24px; margin-bottom: 12px;">⏳</div>
-          <div style="font-size: 12px; color: var(--vscode-text-dim);">Loading Jira issues...</div>
-        </div>
-      </div>
-    `;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <div style="margin-bottom: 24px; display: flex; justify-content: space-between; align-items: start;">
-          <div>
-            <h1 style="margin: 0 0 8px 0; font-size: 24px;">Jira Issues</h1>
-            <p style="margin: 0; color: var(--vscode-text-dim);">
-              ${this.state.projectId ? `Project: ${this.state.projectId}` : 'Select a project to view issues'}
-            </p>
-          </div>
-          <button id="create-issue-btn" style="
-            padding: 8px 16px;
-            background: var(--vscode-button-background);
-            color: var(--vscode-button-foreground);
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-weight: 500;
-            font-size: 12px;
-          ">+ New Issue</button>
-        </div>
-
-        <!-- Status Filter -->
-        <div style="margin-bottom: 24px; display: flex; gap: 8px;">
-          ${['All', 'To Do', 'In Progress', 'In Review', 'Done'].map(status => `
-            <button class="status-filter" data-status="${status}" style="
-              padding: 6px 12px;
-              background: ${this.state.filterStatus === status ? 'var(--vscode-selection)' : 'var(--vscode-sidebar)'};
-              color: var(--vscode-foreground);
-              border: 1px solid ${this.state.filterStatus === status ? 'var(--vscode-focusBorder)' : 'var(--vscode-border)'};
-              border-radius: 4px;
-              cursor: pointer;
-              font-size: 12px;
-              font-weight: 500;
-            ">${status}</button>
-          `).join('')}
-        </div>
-
-        <!-- Issues List -->
-        <div style="display: flex; flex-direction: column; gap: 12px;">
-          ${this.renderIssuesList()}
-        </div>
-      </div>
-    `;
-  }
-
-  renderIssuesList() {
-    const filtered = this.state.filterStatus === 'All'
-      ? this.state.issues
-      : this.state.issues.filter(i => i.status === this.state.filterStatus);
-
-    if (filtered.length === 0) {
-      return `
-        <div style="
-          background: var(--vscode-sidebar);
-          border: 1px solid var(--vscode-border);
-          border-radius: 4px;
-          padding: 24px;
-          text-align: center;
-          color: var(--vscode-text-dim);
-        ">
-          No issues found in this status
-        </div>
-      `;
-    }
-
-    return filtered.map(issue => `
-      <div class="jira-issue" data-issue-key="${issue.key}" style="
-        background: var(--vscode-sidebar);
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        padding: 16px;
-        cursor: pointer;
-        transition: all 0.2s;
-      ">
-        <div style="display: flex; justify-content: space-between; align-items: start; margin-bottom: 12px;">
-          <div style="display: flex; gap: 12px; align-items: start; flex: 1;">
-            <!-- Issue Type Badge -->
-            <div style="
-              padding: 4px 8px;
-              background: ${this.getTypeColor(issue.type)};
-              color: white;
-              border-radius: 3px;
-              font-size: 10px;
-              font-weight: 600;
-              min-width: 50px;
-              text-align: center;
-            ">${issue.type}</div>
-
-            <!-- Issue Content -->
-            <div style="flex: 1;">
-              <div style="display: flex; align-items: center; gap: 12px; margin-bottom: 6px;">
-                <span style="font-family: monospace; font-weight: 600; color: #0066CC;">
-                  ${issue.key}
-                </span>
-                <span style="font-weight: 500; font-size: 13px;">
-                  ${issue.summary}
-                </span>
-              </div>
-              <div style="display: flex; gap: 12px; font-size: 11px; color: var(--vscode-text-dim);">
-                <span>Assignee: ${issue.assignee}</span>
-                <span>Priority: ${issue.priority}</span>
-              </div>
-            </div>
-          </div>
-
-          <!-- Status Badge -->
-          <div style="
-            padding: 4px 12px;
-            background: var(--vscode-bg);
-            border: 1px solid var(--vscode-border);
-            border-radius: 3px;
-            font-size: 11px;
-            font-weight: 500;
-          ">${issue.status}</div>
-        </div>
-
-        <!-- Actions -->
-        <div style="display: flex; gap: 8px; padding-top: 12px; border-top: 1px solid var(--vscode-border);">
-          <button class="open-issue-btn" style="
-            padding: 4px 12px;
-            background: var(--vscode-button-secondaryBackground);
-            color: var(--vscode-button-secondaryForeground);
-            border: none;
-            border-radius: 3px;
-            cursor: pointer;
-            font-size: 11px;
-          ">Open in Jira</button>
-          <button class="link-pr-btn" style="
-            padding: 4px 12px;
-            background: var(--vscode-button-secondaryBackground);
-            color: var(--vscode-button-secondaryForeground);
-            border: none;
-            border-radius: 3px;
-            cursor: pointer;
-            font-size: 11px;
-          ">Link PR</button>
-          <button class="assign-btn" style="
-            padding: 4px 12px;
-            background: var(--vscode-button-secondaryBackground);
-            color: var(--vscode-button-secondaryForeground);
-            border: none;
-            border-radius: 3px;
-            cursor: pointer;
-            font-size: 11px;
-          ">Assign</button>
-        </div>
-      </div>
-    `).join('');
-  }
-
-  getTypeColor(type) {
-    const colors = {
-      'Bug': '#f44336',
-      'Task': '#2196f3',
-      'Story': '#4caf50',
-      'Epic': '#9c27b0',
-      'Subtask': '#ff9800'
-    };
-    return colors[type] || '#999';
-  }
-
-  setupEventListeners() {
-    // Status filters
-    this.querySelectorAll('.status-filter').forEach(btn => {
-      btn.addEventListener('click', () => {
-        this.state.filterStatus = btn.dataset.status;
-        this.render();
-        this.setupEventListeners();
-      });
-    });
-
-    // Create issue button
-    const createBtn = this.querySelector('#create-issue-btn');
-    if (createBtn) {
-      createBtn.addEventListener('click', () => {
-        this.dispatchEvent(new CustomEvent('create-issue', {
-          detail: { projectId: this.state.projectId },
-          bubbles: true,
-          composed: true
-        }));
-      });
-    }
-
-    // Issue actions
-    this.querySelectorAll('.open-issue-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const issueKey = e.target.closest('.jira-issue').dataset.issueKey;
-        window.open(`https://jira.atlassian.net/browse/${issueKey}`, '_blank');
-      });
-    });
-
-    this.querySelectorAll('.link-pr-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const issueKey = e.target.closest('.jira-issue').dataset.issueKey;
-        this.dispatchEvent(new CustomEvent('link-pr', {
-          detail: { issueKey },
-          bubbles: true,
-          composed: true
-        }));
-      });
-    });
-
-    this.querySelectorAll('.assign-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const issueKey = e.target.closest('.jira-issue').dataset.issueKey;
-        this.dispatchEvent(new CustomEvent('assign-issue', {
-          detail: { issueKey },
-          bubbles: true,
-          composed: true
-        }));
-      });
-    });
-  }
-}
-
-customElements.define('ds-jira-issues', JiraIssues);
diff --git a/admin-ui/js/components/listings/ds-token-list.js b/admin-ui/js/components/listings/ds-token-list.js
deleted file mode 100644
index 021d106..0000000
--- a/admin-ui/js/components/listings/ds-token-list.js
+++ /dev/null
@@ -1,197 +0,0 @@
-/**
- * ds-token-list.js
- * Design token listing and management
- * View, edit, and validate design tokens
- */
-
-import contextStore from '../../stores/context-store.js';
-
-export default class TokenList extends HTMLElement {
-  constructor() {
-    super();
-    this.tokens = [
-      { id: 'color-primary', name: 'Primary Color', category: 'Colors', value: '#0066CC', usage: 156 },
-      { id: 'color-success', name: 'Success Color', category: 'Colors', value: '#4caf50', usage: 89 },
-      { id: 'color-error', name: 'Error Color', category: 'Colors', value: '#f44336', usage: 76 },
-      { id: 'color-warning', name: 'Warning Color', category: 'Colors', value: '#ff9800', usage: 54 },
-      { id: 'spacing-xs', name: 'Extra Small Spacing', category: 'Spacing', value: '4px', usage: 234 },
-      { id: 'spacing-sm', name: 'Small Spacing', category: 'Spacing', value: '8px', usage: 312 },
-      { id: 'spacing-md', name: 'Medium Spacing', category: 'Spacing', value: '16px', usage: 445 },
-      { id: 'spacing-lg', name: 'Large Spacing', category: 'Spacing', value: '24px', usage: 198 },
-      { id: 'font-body', name: 'Body Font', category: 'Typography', value: 'Inter, sans-serif', usage: 678 },
-      { id: 'font-heading', name: 'Heading Font', category: 'Typography', value: 'Poppins, sans-serif', usage: 234 },
-    ];
-    this.selectedCategory = 'All';
-    this.editingTokenId = null;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <div style="margin-bottom: 24px; display: flex; justify-content: space-between; align-items: start;">
-          <div>
-            <h1 style="margin: 0 0 8px 0; font-size: 24px;">Design Tokens</h1>
-            <p style="margin: 0; color: var(--vscode-text-dim);">
-              Manage and track design token usage across the system
-            </p>
-          </div>
-          <button id="export-btn" style="
-            padding: 8px 16px;
-            background: var(--vscode-button-background);
-            color: var(--vscode-button-foreground);
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-weight: 500;
-            font-size: 12px;
-          ">⬇️ Export Tokens</button>
-        </div>
-
-        <!-- Category Filter -->
-        <div style="margin-bottom: 24px; display: flex; gap: 8px; flex-wrap: wrap;">
-          ${['All', 'Colors', 'Spacing', 'Typography', 'Shadows', 'Borders'].map(cat => `
-            <button class="filter-btn" data-category="${cat}" style="
-              padding: 6px 12px;
-              background: ${this.selectedCategory === cat ? 'var(--vscode-selection)' : 'var(--vscode-sidebar)'};
-              color: var(--vscode-foreground);
-              border: 1px solid ${this.selectedCategory === cat ? 'var(--vscode-focusBorder)' : 'var(--vscode-border)'};
-              border-radius: 4px;
-              cursor: pointer;
-              font-size: 12px;
-              font-weight: 500;
-            ">${cat}</button>
-          `).join('')}
-        </div>
-
-        <!-- Token Table -->
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; overflow: hidden;">
-          <div style="display: grid; grid-template-columns: 2fr 1fr 1fr 0.8fr 0.8fr; gap: 0; font-size: 11px; font-weight: 600; background: var(--vscode-bg); border-bottom: 1px solid var(--vscode-border); padding: 12px; color: var(--vscode-text-dim); text-transform: uppercase; letter-spacing: 0.5px;">
-            <div>Token Name</div>
-            <div>Category</div>
-            <div>Value</div>
-            <div>Usage</div>
-            <div>Actions</div>
-          </div>
-
-          <div id="tokens-container" style="max-height: 500px; overflow-y: auto;">
-            ${this.renderTokenRows()}
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  renderTokenRows() {
-    const filtered = this.selectedCategory === 'All'
-      ? this.tokens
-      : this.tokens.filter(t => t.category === this.selectedCategory);
-
-    return filtered.map(token => `
-      <div style="
-        display: grid;
-        grid-template-columns: 2fr 1fr 1fr 0.8fr 0.8fr;
-        gap: 0;
-        align-items: center;
-        padding: 12px;
-        border-bottom: 1px solid var(--vscode-border);
-        font-size: 12px;
-      ">
-        <div>
-          <div style="font-weight: 500; margin-bottom: 2px;">${token.name}</div>
-          <div style="font-size: 10px; color: var(--vscode-text-dim); font-family: monospace;">
-            ${token.id}
-          </div>
-        </div>
-        <div style="color: var(--vscode-text-dim); font-size: 11px;">
-          ${token.category}
-        </div>
-        <div style="font-family: monospace; background: var(--vscode-bg); padding: 4px 6px; border-radius: 2px;">
-          ${token.value}
-        </div>
-        <div style="text-align: center; color: var(--vscode-text-dim);">
-          ${token.usage}
-        </div>
-        <div style="display: flex; gap: 4px;">
-          <button class="edit-token-btn" data-token-id="${token.id}" style="
-            padding: 3px 8px;
-            background: var(--vscode-button-secondaryBackground);
-            color: var(--vscode-button-secondaryForeground);
-            border: none;
-            border-radius: 2px;
-            cursor: pointer;
-            font-size: 10px;
-          ">Edit</button>
-          <button class="copy-token-btn" data-token-value="${token.value}" style="
-            padding: 3px 8px;
-            background: var(--vscode-button-secondaryBackground);
-            color: var(--vscode-button-secondaryForeground);
-            border: none;
-            border-radius: 2px;
-            cursor: pointer;
-            font-size: 10px;
-          ">Copy</button>
-        </div>
-      </div>
-    `).join('');
-  }
-
-  setupEventListeners() {
-    // Filter buttons
-    this.querySelectorAll('.filter-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        this.selectedCategory = btn.dataset.category;
-        this.render();
-        this.setupEventListeners();
-      });
-    });
-
-    // Export button
-    const exportBtn = this.querySelector('#export-btn');
-    if (exportBtn) {
-      exportBtn.addEventListener('click', () => {
-        const tokenData = JSON.stringify(this.tokens, null, 2);
-        const blob = new Blob([tokenData], { type: 'application/json' });
-        const url = URL.createObjectURL(blob);
-        const a = document.createElement('a');
-        a.href = url;
-        a.download = 'design-tokens.json';
-        a.click();
-        URL.revokeObjectURL(url);
-      });
-    }
-
-    // Edit token buttons
-    this.querySelectorAll('.edit-token-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        const tokenId = btn.dataset.tokenId;
-        const token = this.tokens.find(t => t.id === tokenId);
-        this.dispatchEvent(new CustomEvent('edit-token', {
-          detail: { token },
-          bubbles: true,
-          composed: true
-        }));
-      });
-    });
-
-    // Copy token buttons
-    this.querySelectorAll('.copy-token-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        const value = btn.dataset.tokenValue;
-        navigator.clipboard.writeText(value).then(() => {
-          const originalText = btn.textContent;
-          btn.textContent = '✓ Copied';
-          setTimeout(() => {
-            btn.textContent = originalText;
-          }, 1500);
-        });
-      });
-    });
-  }
-}
-
-customElements.define('ds-token-list', TokenList);
diff --git a/admin-ui/js/components/metrics/ds-frontpage.js b/admin-ui/js/components/metrics/ds-frontpage.js
deleted file mode 100644
index 8f39c19..0000000
--- a/admin-ui/js/components/metrics/ds-frontpage.js
+++ /dev/null
@@ -1,203 +0,0 @@
-/**
- * ds-frontpage.js
- * Front page component for team workdesks
- * Refactored: Shadow DOM, extracted styles, uses ds-metric-card
- */
-
-import contextStore from '../../stores/context-store.js';
-import './ds-metric-card.js'; // Import the new reusable component
-
-export default class Frontpage extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' }); // Enable Shadow DOM
-    this.state = {
-      teamName: 'Team',
-      metrics: {}
-    };
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-
-    // Subscribe to context changes
-    this.unsubscribe = contextStore.subscribe(({ state }) => {
-      this.state.teamId = state.teamId;
-      const teamNames = {
-        'ui': 'UI Team',
-        'ux': 'UX Team',
-        'qa': 'QA Team',
-        'admin': 'Admin'
-      };
-      this.state.teamName = teamNames[state.teamId] || 'Team';
-      this.updateTeamName();
-    });
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) this.unsubscribe();
-  }
-
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: block;
-          height: 100%;
-          font-family: var(--vscode-font-family);
-          color: var(--vscode-foreground);
-        }
-        .container {
-          padding: 24px;
-          height: 100%;
-          overflow-y: auto;
-          box-sizing: border-box;
-        }
-        h1 {
-          margin: 0 0 8px 0;
-          font-size: 24px;
-          font-weight: 500;
-        }
-        .description {
-          margin: 0 0 32px 0;
-          color: var(--vscode-descriptionForeground);
-          font-size: 14px;
-        }
-        .metrics-grid {
-          display: grid;
-          grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-          gap: 16px;
-          margin-bottom: 32px;
-        }
-        .quick-actions {
-          background: var(--vscode-sidebar-background);
-          border: 1px solid var(--vscode-widget-border);
-          border-radius: 4px;
-          padding: 20px;
-        }
-        h2 {
-          margin: 0 0 16px 0;
-          font-size: 16px;
-          font-weight: 600;
-        }
-        .actions-grid {
-          display: grid;
-          grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
-          gap: 12px;
-        }
-        .action-btn {
-          padding: 12px;
-          background: var(--vscode-button-secondaryBackground);
-          color: var(--vscode-button-secondaryForeground);
-          border: 1px solid transparent;
-          border-radius: 4px;
-          cursor: pointer;
-          font-size: 12px;
-          font-weight: 500;
-          text-align: center;
-          transition: background-color 0.1s;
-        }
-        .action-btn:hover {
-          background: var(--vscode-button-secondaryHoverBackground);
-        }
-        .action-btn:focus-visible {
-          outline: 2px solid var(--vscode-focusBorder);
-          outline-offset: 2px;
-        }
-      </style>
-
-      <div class="container">
-        <div>
-          <h1 id="team-name">Team Dashboard</h1>
-          <p class="description">
-            Overview of design system adoption and metrics for your team
-          </p>
-        </div>
-
-        <!-- Metrics Cards using reusable component -->
-        <div class="metrics-grid">
-          <ds-metric-card
-            title="Adoption Rate"
-            value="68%"
-            subtitle="of team using DS"
-            color="#4caf50">
-          </ds-metric-card>
-
-          <ds-metric-card
-            title="Components"
-            value="45/65"
-            subtitle="in use"
-            color="#2196f3">
-          </ds-metric-card>
-
-          <ds-metric-card
-            title="Tokens"
-            value="187"
-            subtitle="managed"
-            color="#ff9800">
-          </ds-metric-card>
-
-          <ds-metric-card
-            title="Last Update"
-            value="2 hours"
-            subtitle="ago"
-            color="#9c27b0">
-          </ds-metric-card>
-        </div>
-
-        <!-- Quick Actions -->
-        <div class="quick-actions">
-          <h2>Quick Actions</h2>
-          <div class="actions-grid">
-            <button class="action-btn" data-action="components" type="button">
-              📦 View Components
-            </button>
-            <button class="action-btn" data-action="tokens" type="button">
-              🎨 Manage Tokens
-            </button>
-            <button class="action-btn" data-action="icons" type="button">
-              ✨ View Icons
-            </button>
-            <button class="action-btn" data-action="jira" type="button">
-              🐛 Jira Issues
-            </button>
-          </div>
-        </div>
-      </div>
-    `;
-
-    this.updateTeamName();
-  }
-
-  updateTeamName() {
-    // Select from Shadow DOM
-    const teamNameEl = this.shadowRoot.querySelector('#team-name');
-    if (teamNameEl) {
-      teamNameEl.textContent = `${this.state.teamName} Dashboard`;
-    }
-  }
-
-  setupEventListeners() {
-    // Listen within Shadow DOM
-    const buttons = this.shadowRoot.querySelectorAll('.action-btn');
-    buttons.forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        const action = btn.dataset.action;
-        this.handleQuickAction(action);
-      });
-    });
-  }
-
-  handleQuickAction(action) {
-    console.log(`Quick action triggered: ${action}`);
-    // Events bubble out of Shadow DOM if composed: true
-    this.dispatchEvent(new CustomEvent('quick-action', {
-      detail: { action },
-      bubbles: true,
-      composed: true
-    }));
-  }
-}
-
-customElements.define('ds-frontpage', Frontpage);
diff --git a/admin-ui/js/components/metrics/ds-metric-card.js b/admin-ui/js/components/metrics/ds-metric-card.js
deleted file mode 100644
index 5e6fe65..0000000
--- a/admin-ui/js/components/metrics/ds-metric-card.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * ds-metric-card.js
- * Reusable web component for displaying dashboard metrics
- * Encapsulates styling and layout for consistency across dashboards
- */
-
-export default class MetricCard extends HTMLElement {
-  static get observedAttributes() {
-    return ['title', 'value', 'subtitle', 'color', 'trend'];
-  }
-
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  attributeChangedCallback(name, oldValue, newValue) {
-    if (oldValue !== newValue) {
-      this.render();
-    }
-  }
-
-  render() {
-    const title = this.getAttribute('title') || '';
-    const value = this.getAttribute('value') || '0';
-    const subtitle = this.getAttribute('subtitle') || '';
-    const color = this.getAttribute('color') || 'var(--vscode-textLink-foreground)';
-
-    // Trend implementation (optional enhancement)
-    const trend = this.getAttribute('trend'); // e.g., "up", "down"
-
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: block;
-          height: 100%;
-        }
-        .card {
-          background: var(--vscode-sidebar-background);
-          border: 1px solid var(--vscode-widget-border);
-          border-radius: 4px;
-          padding: 16px;
-          height: 100%;
-          box-sizing: border-box;
-          border-top: 3px solid var(--card-color, ${color});
-          transition: transform 0.1s ease-in-out;
-        }
-        .card:hover {
-          background: var(--vscode-list-hoverBackground);
-        }
-        .header {
-          color: var(--vscode-descriptionForeground);
-          font-size: 11px;
-          margin-bottom: 8px;
-          text-transform: uppercase;
-          letter-spacing: 0.5px;
-          font-weight: 600;
-        }
-        .value {
-          font-size: 28px;
-          font-weight: 600;
-          margin-bottom: 4px;
-          color: var(--card-color, ${color});
-        }
-        .subtitle {
-          color: var(--vscode-descriptionForeground);
-          font-size: 11px;
-          line-height: 1.4;
-        }
-      </style>
-      <div class="card" style="--card-color: ${color}">
-        <div class="header">${title}</div>
-        <div class="value">${value}</div>
-        <div class="subtitle">${subtitle}</div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-metric-card', MetricCard);
diff --git a/admin-ui/js/components/metrics/ds-metrics-dashboard.js b/admin-ui/js/components/metrics/ds-metrics-dashboard.js
deleted file mode 100644
index bb1844a..0000000
--- a/admin-ui/js/components/metrics/ds-metrics-dashboard.js
+++ /dev/null
@@ -1,204 +0,0 @@
-/**
- * ds-metrics-dashboard.js
- * Metrics dashboard for design system adoption and health
- * Shows key metrics like component adoption rate, token usage, etc.
- */
-
-import store from '../../stores/app-store.js';
-
-export default class MetricsDashboard extends HTMLElement {
-  constructor() {
-    super();
-    this.isLoading = true;
-    this.error = null;
-    this.metrics = {
-      adoptionRate: 0,
-      componentsUsed: 0,
-      totalComponents: 0,
-      tokensCovered: 0,
-      teamsActive: 0,
-      averageUpdateFreq: 'N/A'
-    };
-  }
-
-  connectedCallback() {
-    this.render();
-    this.loadMetrics();
-  }
-
-  async loadMetrics() {
-    this.isLoading = true;
-    this.error = null;
-    this.render();
-
-    try {
-      const response = await fetch('/api/discovery/stats');
-
-      if (!response.ok) {
-        throw new Error(`API Error: ${response.status}`);
-      }
-
-      const json = await response.json();
-
-      if (json.status === 'success' && json.data) {
-        const stats = json.data;
-
-        // Map backend field names to component properties
-        this.metrics = {
-          adoptionRate: stats.adoption_percentage || 0,
-          componentsUsed: stats.components_in_use || 0,
-          totalComponents: stats.total_components || 0,
-          tokensCovered: stats.tokens_count || 0,
-          teamsActive: stats.active_projects || 0,
-          averageUpdateFreq: stats.avg_update_days
-            ? `${stats.avg_update_days} days`
-            : 'N/A'
-        };
-      } else {
-        throw new Error(json.message || 'Invalid response format');
-      }
-    } catch (error) {
-      console.error('Failed to load metrics:', error);
-      this.error = error.message;
-    } finally {
-      this.isLoading = false;
-      this.render();
-    }
-  }
-
-  render() {
-    if (this.isLoading) {
-      this.innerHTML = `
-        <div style="padding: 24px; height: 100%; display: flex; align-items: center; justify-content: center;">
-          <div style="text-align: center;">
-            <div style="font-size: 14px; color: var(--vscode-text-dim);">Loading metrics...</div>
-          </div>
-        </div>
-      `;
-      return;
-    }
-
-    if (this.error) {
-      this.innerHTML = `
-        <div style="padding: 24px; height: 100%; display: flex; align-items: center; justify-content: center;">
-          <div style="text-align: center;">
-            <div style="font-size: 14px; color: var(--vscode-error); margin-bottom: 12px;">
-              Failed to load metrics: ${this.error}
-            </div>
-            <button
-              onclick="document.querySelector('ds-metrics-dashboard').loadMetrics()"
-              style="
-                padding: 8px 16px;
-                background: var(--vscode-button);
-                color: var(--vscode-button-fg);
-                border: none;
-                border-radius: 4px;
-                cursor: pointer;
-              "
-            >
-              Retry
-            </button>
-          </div>
-        </div>
-      `;
-      return;
-    }
-
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <h1 style="margin-bottom: 8px; font-size: 24px;">Design System Metrics</h1>
-        <p style="color: var(--vscode-text-dim); margin-bottom: 32px;">
-          Track adoption, health, and usage of your design system
-        </p>
-
-        <!-- Metrics Grid -->
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; margin-bottom: 32px;">
-          ${this.renderMetricCard('Adoption Rate', `${this.metrics.adoptionRate}%`, '#4caf50', 'Percentage of team using DS')}
-          ${this.renderMetricCard('Components in Use', this.metrics.componentsUsed, '#2196f3', `of ${this.metrics.totalComponents} total`)}
-          ${this.renderMetricCard('Design Tokens', this.metrics.tokensCovered, '#ff9800', 'Total tokens managed')}
-          ${this.renderMetricCard('Active Projects', this.metrics.teamsActive, '#9c27b0', 'Projects in system')}
-        </div>
-
-        <!-- Activity Timeline -->
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 20px; margin-bottom: 24px;">
-          <h2 style="margin-top: 0; margin-bottom: 16px; font-size: 16px;">Recent Activity</h2>
-          <div style="font-size: 12px;">
-            <div style="padding: 8px 0; border-bottom: 1px solid var(--vscode-border);">
-              <div style="display: flex; justify-content: space-between; margin-bottom: 4px;">
-                <span style="font-weight: 500;">Component Library Updated</span>
-                <span style="color: var(--vscode-text-dim);">2 hours ago</span>
-              </div>
-              <div style="color: var(--vscode-text-dim); font-size: 11px;">Added 3 new components to Button family</div>
-            </div>
-            <div style="padding: 8px 0; border-bottom: 1px solid var(--vscode-border);">
-              <div style="display: flex; justify-content: space-between; margin-bottom: 4px;">
-                <span style="font-weight: 500;">Tokens Synchronized</span>
-                <span style="color: var(--vscode-text-dim);">6 hours ago</span>
-              </div>
-              <div style="color: var(--vscode-text-dim); font-size: 11px;">Synced 42 color tokens from Figma</div>
-            </div>
-            <div style="padding: 8px 0;">
-              <div style="display: flex; justify-content: space-between; margin-bottom: 4px;">
-                <span style="font-weight: 500;">Team Onboarded</span>
-                <span style="color: var(--vscode-text-dim);">1 day ago</span>
-              </div>
-              <div style="color: var(--vscode-text-dim); font-size: 11px;">Marketing team completed DS training</div>
-            </div>
-          </div>
-        </div>
-
-        <!-- Health Indicators -->
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 20px;">
-          <h2 style="margin-top: 0; margin-bottom: 16px; font-size: 16px;">System Health</h2>
-          <div style="font-size: 12px;">
-            <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-              <span>Component Coverage</span>
-              <div style="width: 150px; height: 6px; background: var(--vscode-bg); border-radius: 3px; overflow: hidden;">
-                <div style="width: 69%; height: 100%; background: #4caf50;"></div>
-              </div>
-              <span>69%</span>
-            </div>
-            <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-              <span>Token Coverage</span>
-              <div style="width: 150px; height: 6px; background: var(--vscode-bg); border-radius: 3px; overflow: hidden;">
-                <div style="width: 85%; height: 100%; background: #2196f3;"></div>
-              </div>
-              <span>85%</span>
-            </div>
-            <div style="display: flex; justify-content: space-between; align-items: center;">
-              <span>Documentation</span>
-              <div style="width: 150px; height: 6px; background: var(--vscode-bg); border-radius: 3px; overflow: hidden;">
-                <div style="width: 92%; height: 100%; background: #ff9800;"></div>
-              </div>
-              <span>92%</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  renderMetricCard(title, value, color, subtitle) {
-    return `
-      <div style="
-        background: var(--vscode-sidebar);
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        padding: 16px;
-        border-top: 3px solid ${color};
-      ">
-        <div style="color: var(--vscode-text-dim); font-size: 11px; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px;">
-          ${title}
-        </div>
-        <div style="font-size: 32px; font-weight: 600; margin-bottom: 4px; color: ${color};">
-          ${value}
-        </div>
-        <div style="color: var(--vscode-text-dim); font-size: 11px;">
-          ${subtitle}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-metrics-dashboard', MetricsDashboard);
diff --git a/admin-ui/js/components/tools/ds-accessibility-report.js b/admin-ui/js/components/tools/ds-accessibility-report.js
deleted file mode 100644
index 5e0398d..0000000
--- a/admin-ui/js/components/tools/ds-accessibility-report.js
+++ /dev/null
@@ -1,249 +0,0 @@
-/**
- * ds-accessibility-report.js
- * Accessibility audit report using axe-core via MCP browser tools
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSAccessibilityReport extends HTMLElement {
-  constructor() {
-    super();
-    this.auditResult = null;
-    this.selector = null;
-    this.isRunning = false;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  setupEventListeners() {
-    const runBtn = this.querySelector('#a11y-run-btn');
-    if (runBtn) {
-      runBtn.addEventListener('click', () => this.runAudit());
-    }
-
-    const selectorInput = this.querySelector('#a11y-selector');
-    if (selectorInput) {
-      selectorInput.addEventListener('change', (e) => {
-        this.selector = e.target.value.trim() || null;
-      });
-    }
-  }
-
-  async runAudit() {
-    if (this.isRunning) return;
-
-    this.isRunning = true;
-    const content = this.querySelector('#a11y-content');
-    const runBtn = this.querySelector('#a11y-run-btn');
-
-    if (!content) {
-      this.isRunning = false;
-      return;
-    }
-
-    if (runBtn) {
-      runBtn.disabled = true;
-      runBtn.textContent = 'Running Audit...';
-    }
-
-    content.innerHTML = ComponentHelpers.renderLoading('Running accessibility audit with axe-core...');
-
-    try {
-      const result = await toolBridge.runAccessibilityAudit(this.selector);
-
-      if (result) {
-        this.auditResult = result;
-        this.renderResults();
-      } else {
-        content.innerHTML = ComponentHelpers.renderEmpty('No audit results returned', '🔍');
-      }
-    } catch (error) {
-      console.error('Failed to run accessibility audit:', error);
-      content.innerHTML = ComponentHelpers.renderError('Failed to run accessibility audit', error);
-    } finally {
-      this.isRunning = false;
-      if (runBtn) {
-        runBtn.disabled = false;
-        runBtn.textContent = '▶ Run Audit';
-      }
-    }
-  }
-
-  getSeverityIcon(impact) {
-    const icons = {
-      critical: '🔴',
-      serious: '🟠',
-      moderate: '🟡',
-      minor: '🔵'
-    };
-    return icons[impact] || '⚪';
-  }
-
-  getSeverityBadge(impact) {
-    const types = {
-      critical: 'error',
-      serious: 'error',
-      moderate: 'warning',
-      minor: 'info'
-    };
-    return ComponentHelpers.createBadge(impact.toUpperCase(), types[impact] || 'info');
-  }
-
-  renderResults() {
-    const content = this.querySelector('#a11y-content');
-    if (!content || !this.auditResult) return;
-
-    const violations = this.auditResult.violations || [];
-    const passes = this.auditResult.passes || [];
-    const incomplete = this.auditResult.incomplete || [];
-    const inapplicable = this.auditResult.inapplicable || [];
-
-    const totalViolations = violations.length;
-    const totalPasses = passes.length;
-    const totalTests = totalViolations + totalPasses + incomplete.length + inapplicable.length;
-
-    if (totalViolations === 0) {
-      content.innerHTML = `
-        <div style="text-align: center; padding: 48px;">
-          <div style="font-size: 64px; margin-bottom: 16px;">✅</div>
-          <h3 style="font-size: 18px; margin-bottom: 8px; color: #89d185;">No Violations Found!</h3>
-          <p style="font-size: 12px; color: var(--vscode-text-dim);">
-            All ${totalPasses} accessibility tests passed.
-          </p>
-        </div>
-      `;
-      return;
-    }
-
-    const violationCards = violations.map((violation, index) => {
-      const impact = violation.impact || 'unknown';
-      const nodes = violation.nodes || [];
-      const nodeCount = nodes.length;
-
-      return `
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-left: 3px solid ${this.getImpactColor(impact)}; border-radius: 4px; padding: 16px; margin-bottom: 12px;">
-          <div style="display: flex; justify-content: space-between; align-items: start; margin-bottom: 12px;">
-            <div style="flex: 1;">
-              <div style="display: flex; align-items: center; gap: 8px; margin-bottom: 6px;">
-                <span style="font-size: 20px;">${this.getSeverityIcon(impact)}</span>
-                <h4 style="font-size: 13px; font-weight: 600;">${ComponentHelpers.escapeHtml(violation.description || violation.id)}</h4>
-              </div>
-              <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px;">
-                Rule: <span style="font-family: 'Courier New', monospace;">${ComponentHelpers.escapeHtml(violation.id)}</span>
-              </div>
-            </div>
-            ${this.getSeverityBadge(impact)}
-          </div>
-
-          <div style="font-size: 12px; margin-bottom: 12px; padding: 12px; background-color: var(--vscode-bg); border-radius: 2px;">
-            ${ComponentHelpers.escapeHtml(violation.help || 'No help text available')}
-          </div>
-
-          <div style="margin-bottom: 8px;">
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">
-              Affected elements: ${nodeCount}
-            </div>
-            ${nodes.slice(0, 3).map(node => `
-              <div style="margin-bottom: 6px; padding: 8px; background-color: var(--vscode-bg); border-radius: 2px; font-size: 11px;">
-                <div style="font-family: 'Courier New', monospace; color: var(--vscode-accent); margin-bottom: 4px;">
-                  ${ComponentHelpers.escapeHtml(ComponentHelpers.truncateText(node.target ? node.target.join(', ') : 'unknown', 80))}
-                </div>
-                ${node.failureSummary ? `
-                  <div style="color: var(--vscode-text-dim); font-size: 10px;">
-                    ${ComponentHelpers.escapeHtml(ComponentHelpers.truncateText(node.failureSummary, 150))}
-                  </div>
-                ` : ''}
-              </div>
-            `).join('')}
-            ${nodeCount > 3 ? `<div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 4px;">... and ${nodeCount - 3} more</div>` : ''}
-          </div>
-
-          ${violation.helpUrl ? `
-            <a href="${ComponentHelpers.escapeHtml(violation.helpUrl)}" target="_blank" style="font-size: 11px; color: var(--vscode-accent); text-decoration: none;">
-              Learn more →
-            </a>
-          ` : ''}
-        </div>
-      `;
-    }).join('');
-
-    content.innerHTML = `
-      <!-- Summary Card -->
-      <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-        <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 12px;">Audit Summary</h3>
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px;">
-          <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-            <div style="font-size: 24px; font-weight: 600; color: #f48771;">${totalViolations}</div>
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Violations</div>
-          </div>
-          <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-            <div style="font-size: 24px; font-weight: 600; color: #89d185;">${totalPasses}</div>
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Passes</div>
-          </div>
-          <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-accent);">${totalTests}</div>
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Total Tests</div>
-          </div>
-        </div>
-      </div>
-
-      <!-- Violations List -->
-      <div style="margin-bottom: 12px;">
-        <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 12px;">Violations (${totalViolations})</h3>
-        ${violationCards}
-      </div>
-
-      <!-- Timestamp -->
-      <div style="font-size: 11px; color: var(--vscode-text-dim); text-align: center; padding-top: 8px; border-top: 1px solid var(--vscode-border);">
-        Audit completed: ${ComponentHelpers.formatTimestamp(new Date())}
-        ${this.selector ? ` • Scoped to: ${ComponentHelpers.escapeHtml(this.selector)}` : ' • Full page scan'}
-      </div>
-    `;
-  }
-
-  getImpactColor(impact) {
-    const colors = {
-      critical: '#f48771',
-      serious: '#dbb765',
-      moderate: '#dbb765',
-      minor: '#75beff'
-    };
-    return colors[impact] || '#858585';
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 16px; height: 100%; display: flex; flex-direction: column;">
-        <div style="margin-bottom: 16px; display: flex; gap: 12px; align-items: center;">
-          <input
-            type="text"
-            id="a11y-selector"
-            placeholder="Optional: CSS selector to scope audit"
-            class="input"
-            style="flex: 1; min-width: 200px;"
-          />
-          <button id="a11y-run-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-            ▶ Run Audit
-          </button>
-        </div>
-        <div id="a11y-content" style="flex: 1; overflow-y: auto;">
-          <div style="text-align: center; padding: 48px; color: var(--vscode-text-dim);">
-            <div style="font-size: 48px; margin-bottom: 16px;">♿</div>
-            <h3 style="font-size: 14px; margin-bottom: 8px;">Accessibility Audit</h3>
-            <p style="font-size: 12px;">
-              Click "Run Audit" to scan for WCAG violations using axe-core.
-            </p>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-accessibility-report', DSAccessibilityReport);
-
-export default DSAccessibilityReport;
diff --git a/admin-ui/js/components/tools/ds-activity-log.js b/admin-ui/js/components/tools/ds-activity-log.js
deleted file mode 100644
index 69a6a9e..0000000
--- a/admin-ui/js/components/tools/ds-activity-log.js
+++ /dev/null
@@ -1,442 +0,0 @@
-/**
- * ds-activity-log.js
- * Activity log showing recent MCP tool executions and user actions
- *
- * REFACTORED: DSS-compliant version using DSBaseTool + table-template.js
- * - Extends DSBaseTool for Shadow DOM, AbortController, and standardized lifecycle
- * - Uses table-template.js for DSS-compliant table rendering (NO inline events/styles)
- * - Event delegation pattern for all interactions
- * - Logger utility instead of console.*
- *
- * Reference: .knowledge/dss-coding-standards.json
- */
-
-import DSBaseTool from '../base/ds-base-tool.js';
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import { logger } from '../../utils/logger.js';
-import { createTableView, setupTableEvents, createStatsCard } from '../../templates/table-template.js';
-
-class DSActivityLog extends DSBaseTool {
-  constructor() {
-    super();
-    this.activities = [];
-    this.maxActivities = 100;
-    this.autoRefresh = false;
-    this.refreshInterval = null;
-
-    // Listen for tool executions
-    this.originalExecuteTool = toolBridge.executeTool.bind(toolBridge);
-    this.setupToolInterceptor();
-  }
-
-  connectedCallback() {
-    super.connectedCallback();
-    this.loadActivities();
-  }
-
-  disconnectedCallback() {
-    if (this.refreshInterval) {
-      clearInterval(this.refreshInterval);
-    }
-    super.disconnectedCallback();
-  }
-
-  setupToolInterceptor() {
-    // Intercept tool executions to log them
-    toolBridge.executeTool = async (toolName, params) => {
-      const startTime = Date.now();
-      const activity = {
-        id: Date.now() + Math.random(),
-        type: 'tool_execution',
-        toolName,
-        params,
-        timestamp: new Date(),
-        status: 'running'
-      };
-
-      this.addActivity(activity);
-
-      try {
-        const result = await this.originalExecuteTool(toolName, params);
-        const duration = Date.now() - startTime;
-
-        activity.status = 'success';
-        activity.duration = duration;
-        activity.result = result;
-
-        this.updateActivity(activity);
-        return result;
-      } catch (error) {
-        const duration = Date.now() - startTime;
-
-        activity.status = 'error';
-        activity.duration = duration;
-        activity.error = error.message;
-
-        this.updateActivity(activity);
-        throw error;
-      }
-    };
-  }
-
-  addActivity(activity) {
-    this.activities.unshift(activity);
-    if (this.activities.length > this.maxActivities) {
-      this.activities.pop();
-    }
-    this.saveActivities();
-    this.renderActivities();
-  }
-
-  updateActivity(activity) {
-    const index = this.activities.findIndex(a => a.id === activity.id);
-    if (index !== -1) {
-      this.activities[index] = activity;
-      this.saveActivities();
-      this.renderActivities();
-    }
-  }
-
-  saveActivities() {
-    try {
-      localStorage.setItem('ds-activity-log', JSON.stringify(this.activities.slice(0, 50)));
-    } catch (e) {
-      logger.warn('[DSActivityLog] Failed to save activities to localStorage', e);
-    }
-  }
-
-  loadActivities() {
-    try {
-      const stored = localStorage.getItem('ds-activity-log');
-      if (stored) {
-        this.activities = JSON.parse(stored).map(a => ({
-          ...a,
-          timestamp: new Date(a.timestamp)
-        }));
-        this.renderActivities();
-        logger.debug('[DSActivityLog] Loaded activities from localStorage', { count: this.activities.length });
-      }
-    } catch (e) {
-      logger.warn('[DSActivityLog] Failed to load activities from localStorage', e);
-    }
-  }
-
-  clearActivities() {
-    this.activities = [];
-    this.saveActivities();
-    this.renderActivities();
-    logger.info('[DSActivityLog] Activities cleared');
-  }
-
-  /**
-   * Render the component (required by DSBaseTool)
-   */
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: block;
-          height: 100%;
-        }
-
-        .activity-log-container {
-          padding: 16px;
-          height: 100%;
-          display: flex;
-          flex-direction: column;
-        }
-
-        .log-controls {
-          margin-bottom: 16px;
-          display: flex;
-          gap: 12px;
-          align-items: center;
-          justify-content: flex-end;
-        }
-
-        .auto-refresh-label {
-          display: flex;
-          align-items: center;
-          gap: 6px;
-          font-size: 12px;
-          color: var(--vscode-foreground);
-          cursor: pointer;
-        }
-
-        .clear-btn {
-          padding: 6px 12px;
-          font-size: 11px;
-          background: var(--vscode-button-background);
-          color: var(--vscode-button-foreground);
-          border: none;
-          border-radius: 2px;
-          cursor: pointer;
-          transition: background 0.15s ease;
-        }
-
-        .clear-btn:hover {
-          background: var(--vscode-button-hoverBackground);
-        }
-
-        .content-wrapper {
-          flex: 1;
-          overflow: auto;
-        }
-
-        .loading {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          color: var(--vscode-descriptionForeground);
-        }
-
-        /* Badge styles */
-        .badge {
-          display: inline-block;
-          padding: 2px 6px;
-          border-radius: 3px;
-          font-size: 10px;
-          font-weight: 600;
-        }
-
-        .badge-info {
-          background: rgba(75, 181, 211, 0.2);
-          color: #4bb5d3;
-        }
-
-        .badge-running {
-          background: rgba(75, 181, 211, 0.2);
-          color: #4bb5d3;
-        }
-
-        .badge-success {
-          background: rgba(137, 209, 133, 0.2);
-          color: #89d185;
-        }
-
-        .badge-error {
-          background: rgba(244, 135, 113, 0.2);
-          color: #f48771;
-        }
-
-        .code {
-          font-family: 'Courier New', monospace;
-          word-break: break-all;
-        }
-
-        .icon-cell {
-          font-size: 16px;
-          text-align: center;
-        }
-
-        .tool-name {
-          font-family: 'Courier New', monospace;
-          color: var(--vscode-textLink-foreground);
-        }
-
-        .error-box {
-          background-color: rgba(244, 135, 113, 0.1);
-          padding: 8px;
-          border-radius: 2px;
-          color: #f48771;
-          font-size: 11px;
-        }
-
-        .hint {
-          margin-top: 12px;
-          padding: 8px;
-          background-color: var(--vscode-sideBar-background);
-          border-radius: 4px;
-          font-size: 10px;
-          color: var(--vscode-descriptionForeground);
-        }
-      </style>
-
-      <div class="activity-log-container">
-        <!-- Log Controls -->
-        <div class="log-controls">
-          <label class="auto-refresh-label">
-            <input type="checkbox" id="activity-auto-refresh" />
-            Live updates
-          </label>
-          <button
-            id="activity-clear-btn"
-            data-action="clear"
-            class="clear-btn"
-            type="button"
-            aria-label="Clear activity log">
-            🗑️ Clear Log
-          </button>
-        </div>
-
-        <!-- Content -->
-        <div class="content-wrapper" id="activity-content">
-          <div class="loading">Loading activities...</div>
-        </div>
-      </div>
-    `;
-  }
-
-  /**
-   * Setup event listeners (required by DSBaseTool)
-   */
-  setupEventListeners() {
-    // EVENT-002: Event delegation
-    this.delegateEvents('.activity-log-container', 'click', (action, e) => {
-      if (action === 'clear') {
-        this.clearActivities();
-      }
-    });
-
-    // Auto-refresh toggle
-    const autoRefreshToggle = this.$('#activity-auto-refresh');
-    if (autoRefreshToggle) {
-      this.bindEvent(autoRefreshToggle, 'change', (e) => {
-        this.autoRefresh = e.target.checked;
-        if (this.autoRefresh) {
-          this.refreshInterval = setInterval(() => this.renderActivities(), 1000);
-          logger.debug('[DSActivityLog] Auto-refresh enabled');
-        } else {
-          if (this.refreshInterval) {
-            clearInterval(this.refreshInterval);
-            this.refreshInterval = null;
-            logger.debug('[DSActivityLog] Auto-refresh disabled');
-          }
-        }
-      });
-    }
-  }
-
-  getActivityIcon(activity) {
-    if (activity.status === 'running') return '🔄';
-    if (activity.status === 'success') return '✅';
-    if (activity.status === 'error') return '❌';
-    return '⚪';
-  }
-
-  renderActivities() {
-    const content = this.$('#activity-content');
-    if (!content) return;
-
-    if (this.activities.length === 0) {
-      content.innerHTML = '<div class="table-empty"><div class="table-empty-icon">📋</div><div class="table-empty-text">No recent activity</div></div>';
-      return;
-    }
-
-    // Calculate stats
-    const stats = {
-      Total: this.activities.length,
-      Success: this.activities.filter(a => a.status === 'success').length,
-      Failed: this.activities.filter(a => a.status === 'error').length
-    };
-
-    const running = this.activities.filter(a => a.status === 'running').length;
-    if (running > 0) {
-      stats.Running = running;
-    }
-
-    // Render stats card
-    const statsHtml = createStatsCard(stats);
-
-    // Use table-template.js for DSS-compliant rendering
-    const { html: tableHtml, styles: tableStyles } = createTableView({
-      columns: [
-        { header: '', key: 'icon', width: '40px', align: 'center' },
-        { header: 'Status', key: 'status', width: '80px', align: 'left' },
-        { header: 'Tool', key: 'toolName', align: 'left' },
-        { header: 'Duration', key: 'duration', width: '100px', align: 'left' },
-        { header: 'Time', key: 'timestamp', width: '120px', align: 'left' }
-      ],
-      rows: this.activities,
-      renderCell: (col, row) => this.renderCell(col, row),
-      renderDetails: (row) => this.renderDetails(row),
-      emptyMessage: 'No recent activity',
-      emptyIcon: '📋'
-    });
-
-    // Adopt table styles
-    this.adoptStyles(tableStyles);
-
-    // Render table
-    content.innerHTML = statsHtml + tableHtml + '<div class="hint">💡 Click any row to view full activity details</div>';
-
-    // Setup table event handlers
-    setupTableEvents(this.shadowRoot);
-
-    logger.debug('[DSActivityLog] Rendered activities', { count: this.activities.length });
-  }
-
-  renderCell(col, row) {
-    const icon = this.getActivityIcon(row);
-    const toolName = row.toolName || 'Unknown';
-    const duration = row.duration ? ComponentHelpers.formatDuration(row.duration) : '-';
-    const timestamp = ComponentHelpers.formatRelativeTime(row.timestamp);
-
-    switch (col.key) {
-      case 'icon':
-        return `<span class="icon-cell">${icon}</span>`;
-
-      case 'status':
-        return `<span class="badge badge-${row.status}">${this.escapeHtml(row.status)}</span>`;
-
-      case 'toolName':
-        return `<span class="tool-name">${this.escapeHtml(toolName)}</span>`;
-
-      case 'duration':
-        return `<span style="color: var(--vscode-descriptionForeground);">${duration}</span>`;
-
-      case 'timestamp':
-        return `<span style="color: var(--vscode-descriptionForeground);">${timestamp}</span>`;
-
-      default:
-        return this.escapeHtml(String(row[col.key] || '-'));
-    }
-  }
-
-  renderDetails(row) {
-    const toolName = row.toolName || 'Unknown';
-    const duration = row.duration ? ComponentHelpers.formatDuration(row.duration) : '-';
-
-    return `
-      <div style="margin-bottom: 12px;">
-        <span class="detail-label">Tool:</span>
-        <span class="detail-value code">${this.escapeHtml(toolName)}</span>
-      </div>
-      <div style="margin-bottom: 12px;">
-        <span class="detail-label">Status:</span>
-        <span class="badge badge-${row.status}">${this.escapeHtml(row.status)}</span>
-      </div>
-      <div style="margin-bottom: 12px;">
-        <span class="detail-label">Timestamp:</span>
-        <span>${ComponentHelpers.formatTimestamp(row.timestamp)}</span>
-      </div>
-      ${row.duration ? `
-        <div style="margin-bottom: 12px;">
-          <span class="detail-label">Duration:</span>
-          <span>${duration}</span>
-        </div>
-      ` : ''}
-      ${row.params && Object.keys(row.params).length > 0 ? `
-        <div style="margin-bottom: 12px;">
-          <div class="detail-label" style="display: block; margin-bottom: 4px;">Parameters:</div>
-          <pre class="detail-code">${this.escapeHtml(JSON.stringify(row.params, null, 2))}</pre>
-        </div>
-      ` : ''}
-      ${row.error ? `
-        <div style="margin-bottom: 12px;">
-          <div class="detail-label" style="display: block; margin-bottom: 4px;">Error:</div>
-          <div class="error-box">
-            ${this.escapeHtml(row.error)}
-          </div>
-        </div>
-      ` : ''}
-    `;
-  }
-}
-
-customElements.define('ds-activity-log', DSActivityLog);
-
-export default DSActivityLog;
diff --git a/admin-ui/js/components/tools/ds-asset-list.js b/admin-ui/js/components/tools/ds-asset-list.js
deleted file mode 100644
index 2dbb3a4..0000000
--- a/admin-ui/js/components/tools/ds-asset-list.js
+++ /dev/null
@@ -1,100 +0,0 @@
-/**
- * ds-asset-list.js
- * List view of design assets (icons, images, etc.)
- * UX Team Tool #3
- */
-
-import { createGalleryView, setupGalleryHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-
-class DSAssetList extends HTMLElement {
-  constructor() {
-    super();
-    this.assets = [];
-    this.isLoading = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    await this.loadAssets();
-  }
-
-  async loadAssets() {
-    this.isLoading = true;
-    const container = this.querySelector('#asset-list-container');
-    if (container) {
-      container.innerHTML = ComponentHelpers.renderLoading('Loading design assets...');
-    }
-
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Call assets API
-      const response = await fetch(`/api/assets/list?projectId=${context.project_id}`);
-      if (!response.ok) {
-        throw new Error(`Failed to load assets: ${response.statusText}`);
-      }
-
-      const result = await response.json();
-      this.assets = result.assets || [];
-
-      this.renderAssetGallery();
-    } catch (error) {
-      console.error('[DSAssetList] Failed to load assets:', error);
-      if (container) {
-        container.innerHTML = ComponentHelpers.renderError('Failed to load assets', error);
-      }
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  renderAssetGallery() {
-    const container = this.querySelector('#asset-list-container');
-    if (!container) return;
-
-    const config = {
-      title: 'Design Assets',
-      items: this.assets.map(asset => ({
-        id: asset.id,
-        src: asset.url || asset.thumbnailUrl,
-        title: asset.name,
-        subtitle: `${asset.type} • ${asset.size || 'N/A'}`
-      })),
-      onItemClick: (item) => this.viewAsset(item),
-      onDelete: (item) => this.deleteAsset(item)
-    };
-
-    container.innerHTML = createGalleryView(config);
-    setupGalleryHandlers(container, config);
-  }
-
-  viewAsset(item) {
-    // Open asset in new tab or modal
-    if (item.src) {
-      window.open(item.src, '_blank');
-    }
-  }
-
-  deleteAsset(item) {
-    ComponentHelpers.showToast?.(`Deleted ${item.title}`, 'success');
-    this.assets = this.assets.filter(a => a.id !== item.id);
-    this.renderAssetGallery();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div id="asset-list-container" style="height: 100%; overflow: hidden;">
-        ${ComponentHelpers.renderLoading('Loading assets...')}
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-asset-list', DSAssetList);
-
-export default DSAssetList;
diff --git a/admin-ui/js/components/tools/ds-chat-panel.js b/admin-ui/js/components/tools/ds-chat-panel.js
deleted file mode 100644
index a81cb8d..0000000
--- a/admin-ui/js/components/tools/ds-chat-panel.js
+++ /dev/null
@@ -1,355 +0,0 @@
-/**
- * ds-chat-panel.js
- * AI chatbot panel with team+project context
- * MVP1: Integrates claude-service with ContextStore for team-aware assistance
- */
-
-import claudeService from '../../services/claude-service.js';
-import contextStore from '../../stores/context-store.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSChatPanel extends HTMLElement {
-  constructor() {
-    super();
-    this.messages = [];
-    this.isLoading = false;
-  }
-
-  async connectedCallback() {
-    // Sync claude-service with ContextStore
-    const context = contextStore.getMCPContext();
-    if (context.project_id) {
-      claudeService.setProject(context.project_id);
-    }
-
-    // Subscribe to project changes
-    this.unsubscribe = contextStore.subscribeToKey('projectId', (newProjectId) => {
-      if (newProjectId) {
-        claudeService.setProject(newProjectId);
-        this.showSystemMessage(`Switched to project: ${newProjectId}`);
-      }
-    });
-
-    // Initialize MCP tools in background
-    this.initializeMcpTools();
-
-    this.render();
-    this.setupEventListeners();
-    this.loadHistory();
-    this.showWelcomeMessage();
-  }
-
-  /**
-   * Initialize MCP tools to enable AI tool awareness
-   */
-  async initializeMcpTools() {
-    try {
-      console.log('[DSChatPanel] Initializing MCP tools...');
-      await claudeService.getMcpTools();
-      console.log('[DSChatPanel] MCP tools initialized successfully');
-    } catch (error) {
-      console.warn('[DSChatPanel] Failed to load MCP tools (non-blocking):', error.message);
-    }
-  }
-
-  /**
-   * Set context from parent component (ds-ai-chat-sidebar)
-   * @param {Object} context - Context object with project, team, page
-   */
-  setContext(context) {
-    if (!context) return;
-
-    // Handle project context (could be object with id or string id)
-    if (context.project) {
-      const projectId = typeof context.project === 'object'
-        ? context.project.id
-        : context.project;
-
-      if (projectId && projectId !== claudeService.currentProjectId) {
-        claudeService.setProject(projectId);
-        console.log('[DSChatPanel] Context updated via setContext:', { projectId });
-      }
-    }
-
-    // Store team and page context for reference
-    if (context.team) {
-      this.currentTeam = context.team;
-    }
-    if (context.page) {
-      this.currentPage = context.page;
-    }
-  }
-
-  disconnectedCallback() {
-    if (this.unsubscribe) {
-      this.unsubscribe();
-    }
-  }
-
-  setupEventListeners() {
-    const input = this.querySelector('#chat-input');
-    const sendBtn = this.querySelector('#chat-send-btn');
-    const clearBtn = this.querySelector('#chat-clear-btn');
-    const exportBtn = this.querySelector('#chat-export-btn');
-
-    if (sendBtn && input) {
-      sendBtn.addEventListener('click', () => this.sendMessage());
-      input.addEventListener('keypress', (e) => {
-        if (e.key === 'Enter' && !e.shiftKey) {
-          e.preventDefault();
-          this.sendMessage();
-        }
-      });
-    }
-
-    if (clearBtn) {
-      clearBtn.addEventListener('click', () => this.clearChat());
-    }
-
-    if (exportBtn) {
-      exportBtn.addEventListener('click', () => this.exportChat());
-    }
-  }
-
-  loadHistory() {
-    const history = claudeService.getHistory();
-    if (history && history.length > 0) {
-      this.messages = history;
-      this.renderMessages();
-    }
-  }
-
-  showWelcomeMessage() {
-    if (this.messages.length === 0) {
-      const context = contextStore.getMCPContext();
-      const teamId = context.team_id || 'ui';
-
-      const teamGreetings = {
-        ui: 'I can help with token extraction, component audits, Storybook comparisons, and quick wins analysis.',
-        ux: 'I can assist with Figma syncing, design tokens, asset management, and navigation flows.',
-        qa: 'I can help with visual regression testing, accessibility audits, and ESRE validation.',
-        admin: 'I can help manage projects, configure integrations, and oversee the design system.'
-      };
-
-      const greeting = teamGreetings[teamId] || teamGreetings.admin;
-
-      this.showSystemMessage(
-        `👋 Welcome to the ${teamId.toUpperCase()} team workspace!\n\n${greeting}\n\nI have access to all MCP tools for the active project.`
-      );
-    }
-  }
-
-  showSystemMessage(text) {
-    this.messages.push({
-      role: 'system',
-      content: text,
-      timestamp: new Date().toISOString()
-    });
-    this.renderMessages();
-  }
-
-  async sendMessage() {
-    const input = this.querySelector('#chat-input');
-    const message = input?.value.trim();
-
-    if (!message || this.isLoading) return;
-
-    // Check project context
-    const context = contextStore.getMCPContext();
-    if (!context.project_id) {
-      ComponentHelpers.showToast?.('Please select a project before chatting', 'error');
-      return;
-    }
-
-    // Add user message
-    this.messages.push({
-      role: 'user',
-      content: message,
-      timestamp: new Date().toISOString()
-    });
-
-    // Clear input
-    input.value = '';
-
-    // Render and scroll
-    this.renderMessages();
-    this.scrollToBottom();
-
-    // Show loading
-    this.isLoading = true;
-    this.updateLoadingState();
-
-    try {
-      // Add team context to the request
-      const teamContext = {
-        projectId: context.project_id,
-        teamId: context.team_id,
-        userId: context.user_id,
-        page: 'workdesk',
-        capabilities: context.capabilities
-      };
-
-      // Send to Claude with team+project context
-      const response = await claudeService.chat(message, teamContext);
-
-      // Add assistant response
-      this.messages.push({
-        role: 'assistant',
-        content: response,
-        timestamp: new Date().toISOString()
-      });
-
-      this.renderMessages();
-      this.scrollToBottom();
-    } catch (error) {
-      console.error('[DSChatPanel] Failed to send message:', error);
-      ComponentHelpers.showToast?.(`Chat error: ${error.message}`, 'error');
-
-      this.messages.push({
-        role: 'system',
-        content: `❌ Error: ${error.message}\n\nPlease try again or check your connection.`,
-        timestamp: new Date().toISOString()
-      });
-
-      this.renderMessages();
-    } finally {
-      this.isLoading = false;
-      this.updateLoadingState();
-    }
-  }
-
-  clearChat() {
-    if (!confirm('Clear all chat history?')) return;
-
-    claudeService.clearHistory();
-    this.messages = [];
-    this.renderMessages();
-    this.showWelcomeMessage();
-    ComponentHelpers.showToast?.('Chat history cleared', 'success');
-  }
-
-  exportChat() {
-    claudeService.exportConversation();
-    ComponentHelpers.showToast?.('Chat exported successfully', 'success');
-  }
-
-  updateLoadingState() {
-    const sendBtn = this.querySelector('#chat-send-btn');
-    const input = this.querySelector('#chat-input');
-
-    if (sendBtn) {
-      sendBtn.disabled = this.isLoading;
-      sendBtn.textContent = this.isLoading ? '⏳ Sending...' : '📤 Send';
-    }
-
-    if (input) {
-      input.disabled = this.isLoading;
-    }
-  }
-
-  scrollToBottom() {
-    const messagesContainer = this.querySelector('#chat-messages');
-    if (messagesContainer) {
-      setTimeout(() => {
-        messagesContainer.scrollTop = messagesContainer.scrollHeight;
-      }, 100);
-    }
-  }
-
-  renderMessages() {
-    const messagesContainer = this.querySelector('#chat-messages');
-    if (!messagesContainer) return;
-
-    if (this.messages.length === 0) {
-      messagesContainer.innerHTML = `
-        <div style="text-align: center; padding: 48px; color: var(--vscode-text-dim);">
-          <div style="font-size: 48px; margin-bottom: 16px;">💬</div>
-          <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">No messages yet</h3>
-          <p style="font-size: 12px;">Start a conversation to get help with your design system.</p>
-        </div>
-      `;
-      return;
-    }
-
-    messagesContainer.innerHTML = this.messages.map(msg => {
-      const isUser = msg.role === 'user';
-      const isSystem = msg.role === 'system';
-
-      const alignStyle = isUser ? 'flex-end' : 'flex-start';
-      const bgColor = isUser
-        ? 'var(--vscode-button-background)'
-        : isSystem
-          ? 'rgba(255, 191, 0, 0.1)'
-          : 'var(--vscode-sidebar)';
-      const textColor = isUser ? 'var(--vscode-button-foreground)' : 'var(--vscode-text)';
-      const maxWidth = isSystem ? '100%' : '80%';
-      const icon = isUser ? '👤' : isSystem ? 'ℹ️' : '🤖';
-
-      return `
-        <div style="display: flex; justify-content: ${alignStyle}; margin-bottom: 16px;">
-          <div style="max-width: ${maxWidth}; background: ${bgColor}; padding: 12px; border-radius: 8px; color: ${textColor};">
-            <div style="font-size: 10px; color: var(--vscode-text-dim); margin-bottom: 6px; display: flex; align-items: center; gap: 6px;">
-              <span>${icon}</span>
-              <span>${isUser ? 'You' : isSystem ? 'System' : 'AI Assistant'}</span>
-              <span>•</span>
-              <span>${ComponentHelpers.formatRelativeTime(new Date(msg.timestamp))}</span>
-            </div>
-            <div style="font-size: 12px; white-space: pre-wrap; word-wrap: break-word;">
-              ${ComponentHelpers.escapeHtml(msg.content)}
-            </div>
-          </div>
-        </div>
-      `;
-    }).join('');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="height: 100%; display: flex; flex-direction: column; background: var(--vscode-bg);">
-        <!-- Header -->
-        <div style="padding: 12px 16px; border-bottom: 1px solid var(--vscode-border); display: flex; justify-content: space-between; align-items: center;">
-          <div>
-            <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 4px;">AI Assistant</h3>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">Team-contextualized help with MCP tools</div>
-          </div>
-          <div style="display: flex; gap: 8px;">
-            <button id="chat-export-btn" class="button" style="padding: 4px 8px; font-size: 10px;">
-              📥 Export
-            </button>
-            <button id="chat-clear-btn" class="button" style="padding: 4px 8px; font-size: 10px;">
-              🗑️ Clear
-            </button>
-          </div>
-        </div>
-
-        <!-- Messages -->
-        <div id="chat-messages" style="flex: 1; overflow-y: auto; padding: 16px;">
-          ${ComponentHelpers.renderLoading('Loading chat...')}
-        </div>
-
-        <!-- Input -->
-        <div style="padding: 16px; border-top: 1px solid var(--vscode-border);">
-          <div style="display: flex; gap: 8px;">
-            <textarea
-              id="chat-input"
-              placeholder="Ask me anything about your design system..."
-              class="input"
-              style="flex: 1; min-height: 60px; resize: vertical; font-size: 12px;"
-              rows="2"
-            ></textarea>
-            <button id="chat-send-btn" class="button" style="padding: 8px 16px; font-size: 12px; height: 60px;">
-              📤 Send
-            </button>
-          </div>
-          <div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 8px;">
-            Press Enter to send • Shift+Enter for new line
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-chat-panel', DSChatPanel);
-
-export default DSChatPanel;
diff --git a/admin-ui/js/components/tools/ds-component-list.js b/admin-ui/js/components/tools/ds-component-list.js
deleted file mode 100644
index 25600fd..0000000
--- a/admin-ui/js/components/tools/ds-component-list.js
+++ /dev/null
@@ -1,170 +0,0 @@
-/**
- * ds-component-list.js
- * List view of all design system components
- * UX Team Tool #4
- */
-
-import { createListView, setupListHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSComponentList extends HTMLElement {
-  constructor() {
-    super();
-    this.components = [];
-    this.filteredComponents = [];
-    this.isLoading = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    await this.loadComponents();
-  }
-
-  async loadComponents() {
-    this.isLoading = true;
-    const container = this.querySelector('#component-list-container');
-    if (container) {
-      container.innerHTML = ComponentHelpers.renderLoading('Loading components...');
-    }
-
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Call component audit to get component list
-      const result = await toolBridge.executeTool('dss_audit_components', {
-        path: `/projects/${context.project_id}`
-      });
-
-      this.components = result.components || [];
-      this.filteredComponents = [...this.components];
-
-      this.renderComponentList();
-    } catch (error) {
-      console.error('[DSComponentList] Failed to load components:', error);
-      if (container) {
-        container.innerHTML = ComponentHelpers.renderError('Failed to load components', error);
-      }
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  renderComponentList() {
-    const container = this.querySelector('#component-list-container');
-    if (!container) return;
-
-    const config = {
-      title: 'Design System Components',
-      items: this.filteredComponents,
-      columns: [
-        {
-          key: 'name',
-          label: 'Component',
-          render: (comp) => `<span style="font-family: monospace; font-size: 11px; font-weight: 600;">${ComponentHelpers.escapeHtml(comp.name)}</span>`
-        },
-        {
-          key: 'path',
-          label: 'File Path',
-          render: (comp) => `<span style="font-family: monospace; font-size: 10px; color: var(--vscode-text-dim);">${ComponentHelpers.escapeHtml(comp.path)}</span>`
-        },
-        {
-          key: 'type',
-          label: 'Type',
-          render: (comp) => ComponentHelpers.createBadge(comp.type || 'react', 'info')
-        },
-        {
-          key: 'dsAdoption',
-          label: 'DS Adoption',
-          render: (comp) => {
-            const percentage = comp.dsAdoption || 0;
-            let color = '#f48771';
-            if (percentage >= 80) color = '#89d185';
-            else if (percentage >= 50) color = '#ffbf00';
-            return `
-              <div style="display: flex; align-items: center; gap: 8px;">
-                <div style="flex: 1; height: 6px; background: var(--vscode-bg); border-radius: 3px; overflow: hidden;">
-                  <div style="height: 100%; width: ${percentage}%; background: ${color};"></div>
-                </div>
-                <span style="font-size: 10px; font-weight: 600; min-width: 35px;">${percentage}%</span>
-              </div>
-            `;
-          }
-        }
-      ],
-      actions: [
-        {
-          label: 'Refresh',
-          icon: '🔄',
-          onClick: () => this.loadComponents()
-        },
-        {
-          label: 'Export Report',
-          icon: '📥',
-          onClick: () => this.exportReport()
-        }
-      ],
-      onSearch: (query) => this.handleSearch(query),
-      onFilter: (filterValue) => this.handleFilter(filterValue)
-    };
-
-    container.innerHTML = createListView(config);
-    setupListHandlers(container, config);
-
-    // Update filter dropdown
-    const filterSelect = container.querySelector('#filter-select');
-    if (filterSelect) {
-      const types = [...new Set(this.components.map(c => c.type || 'react'))];
-      filterSelect.innerHTML = `
-        <option value="">All Types</option>
-        ${types.map(type => `<option value="${type}">${type}</option>`).join('')}
-      `;
-    }
-  }
-
-  handleSearch(query) {
-    const lowerQuery = query.toLowerCase();
-    this.filteredComponents = this.components.filter(comp =>
-      comp.name.toLowerCase().includes(lowerQuery) ||
-      comp.path.toLowerCase().includes(lowerQuery)
-    );
-    this.renderComponentList();
-  }
-
-  handleFilter(filterValue) {
-    if (!filterValue) {
-      this.filteredComponents = [...this.components];
-    } else {
-      this.filteredComponents = this.components.filter(comp => (comp.type || 'react') === filterValue);
-    }
-    this.renderComponentList();
-  }
-
-  exportReport() {
-    const data = JSON.stringify(this.components, null, 2);
-    const blob = new Blob([data], { type: 'application/json' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = 'component-audit.json';
-    a.click();
-    URL.revokeObjectURL(url);
-    ComponentHelpers.showToast?.('Report exported', 'success');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div id="component-list-container" style="height: 100%; overflow: hidden;">
-        ${ComponentHelpers.renderLoading('Loading components...')}
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-component-list', DSComponentList);
-
-export default DSComponentList;
diff --git a/admin-ui/js/components/tools/ds-console-viewer.js b/admin-ui/js/components/tools/ds-console-viewer.js
deleted file mode 100644
index ca47da6..0000000
--- a/admin-ui/js/components/tools/ds-console-viewer.js
+++ /dev/null
@@ -1,249 +0,0 @@
-/**
- * ds-console-viewer.js
- * Console log viewer with real-time streaming and filtering
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSConsoleViewer extends HTMLElement {
-  constructor() {
-    super();
-    this.logs = [];
-    this.currentFilter = 'all';
-    this.autoScroll = true;
-    this.refreshInterval = null;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.startAutoRefresh();
-  }
-
-  disconnectedCallback() {
-    this.stopAutoRefresh();
-  }
-
-  render() {
-    const filteredLogs = this.currentFilter === 'all'
-      ? this.logs
-      : this.logs.filter(log => log.level === this.currentFilter);
-
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Header Controls -->
-        <div style="
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          padding: 8px 12px;
-          border-bottom: 1px solid var(--vscode-border);
-          background-color: var(--vscode-sidebar);
-        ">
-          <div style="display: flex; gap: 8px;">
-            <button class="filter-btn ${this.currentFilter === 'all' ? 'active' : ''}" data-filter="all" style="
-              padding: 4px 12px;
-              background-color: ${this.currentFilter === 'all' ? 'var(--vscode-accent)' : 'transparent'};
-              border: 1px solid var(--vscode-border);
-              color: var(--vscode-text);
-              border-radius: 2px;
-              cursor: pointer;
-              font-size: 11px;
-            ">All</button>
-            <button class="filter-btn ${this.currentFilter === 'log' ? 'active' : ''}" data-filter="log" style="
-              padding: 4px 12px;
-              background-color: ${this.currentFilter === 'log' ? 'var(--vscode-accent)' : 'transparent'};
-              border: 1px solid var(--vscode-border);
-              color: var(--vscode-text);
-              border-radius: 2px;
-              cursor: pointer;
-              font-size: 11px;
-            ">Log</button>
-            <button class="filter-btn ${this.currentFilter === 'warn' ? 'active' : ''}" data-filter="warn" style="
-              padding: 4px 12px;
-              background-color: ${this.currentFilter === 'warn' ? 'var(--vscode-accent)' : 'transparent'};
-              border: 1px solid var(--vscode-border);
-              color: var(--vscode-text);
-              border-radius: 2px;
-              cursor: pointer;
-              font-size: 11px;
-            ">Warn</button>
-            <button class="filter-btn ${this.currentFilter === 'error' ? 'active' : ''}" data-filter="error" style="
-              padding: 4px 12px;
-              background-color: ${this.currentFilter === 'error' ? 'var(--vscode-accent)' : 'transparent'};
-              border: 1px solid var(--vscode-border);
-              color: var(--vscode-text);
-              border-radius: 2px;
-              cursor: pointer;
-              font-size: 11px;
-            ">Error</button>
-          </div>
-          <div style="display: flex; gap: 8px; align-items: center;">
-            <label style="font-size: 11px; display: flex; align-items: center; gap: 4px; cursor: pointer;">
-              <input type="checkbox" id="auto-scroll-toggle" ${this.autoScroll ? 'checked' : ''}>
-              Auto-scroll
-            </label>
-            <button id="clear-logs-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-              Clear
-            </button>
-            <button id="refresh-logs-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-              Refresh
-            </button>
-          </div>
-        </div>
-
-        <!-- Console Output -->
-        <div id="console-output" style="
-          flex: 1;
-          overflow-y: auto;
-          padding: 8px;
-          font-family: 'Consolas', 'Monaco', monospace;
-          font-size: 12px;
-          background-color: var(--vscode-bg);
-        ">
-          ${filteredLogs.length === 0 ? `
-            <div style="padding: 16px; text-align: center; color: var(--vscode-text-dim);">
-              No console logs${this.currentFilter !== 'all' ? ` (${this.currentFilter})` : ''}
-            </div>
-          ` : filteredLogs.map(log => this.renderLogEntry(log)).join('')}
-        </div>
-      </div>
-    `;
-
-    this.setupEventListeners();
-
-    if (this.autoScroll) {
-      this.scrollToBottom();
-    }
-  }
-
-  renderLogEntry(log) {
-    const levelColors = {
-      log: 'var(--vscode-text)',
-      warn: '#ff9800',
-      error: '#f44336',
-      info: '#2196f3',
-      debug: 'var(--vscode-text-dim)'
-    };
-
-    const color = levelColors[log.level] || 'var(--vscode-text)';
-
-    return `
-      <div style="
-        padding: 4px 8px;
-        border-bottom: 1px solid var(--vscode-border);
-        display: flex;
-        gap: 12px;
-      ">
-        <span style="color: var(--vscode-text-dim); min-width: 80px; flex-shrink: 0;">
-          ${log.timestamp}
-        </span>
-        <span style="color: ${color}; font-weight: 600; min-width: 50px; flex-shrink: 0;">
-          [${log.level.toUpperCase()}]
-        </span>
-        <span style="color: var(--vscode-text); flex: 1; word-break: break-word;">
-          ${this.escapeHtml(log.message)}
-        </span>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    // Filter buttons
-    this.querySelectorAll('.filter-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        this.currentFilter = e.target.dataset.filter;
-        this.render();
-      });
-    });
-
-    // Auto-scroll toggle
-    const autoScrollToggle = this.querySelector('#auto-scroll-toggle');
-    if (autoScrollToggle) {
-      autoScrollToggle.addEventListener('change', (e) => {
-        this.autoScroll = e.target.checked;
-      });
-    }
-
-    // Clear button
-    const clearBtn = this.querySelector('#clear-logs-btn');
-    if (clearBtn) {
-      clearBtn.addEventListener('click', () => {
-        this.logs = [];
-        this.render();
-      });
-    }
-
-    // Refresh button
-    const refreshBtn = this.querySelector('#refresh-logs-btn');
-    if (refreshBtn) {
-      refreshBtn.addEventListener('click', () => {
-        this.fetchLogs();
-      });
-    }
-  }
-
-  async fetchLogs() {
-    try {
-      const result = await toolBridge.getBrowserLogs(this.currentFilter, 100);
-      if (result && result.logs) {
-        this.logs = result.logs.map(log => ({
-          timestamp: new Date(log.timestamp).toLocaleTimeString(),
-          level: log.level || 'log',
-          message: log.message || JSON.stringify(log)
-        }));
-        this.render();
-      }
-    } catch (error) {
-      console.error('Failed to fetch logs:', error);
-      this.addLog('error', `Failed to fetch logs: ${error.message}`);
-    }
-  }
-
-  addLog(level, message) {
-    const now = new Date();
-    this.logs.push({
-      timestamp: now.toLocaleTimeString(),
-      level,
-      message
-    });
-
-    // Keep only last 100 logs
-    if (this.logs.length > 100) {
-      this.logs = this.logs.slice(-100);
-    }
-
-    this.render();
-  }
-
-  startAutoRefresh() {
-    // Fetch logs every 2 seconds
-    this.fetchLogs();
-    this.refreshInterval = setInterval(() => {
-      this.fetchLogs();
-    }, 2000);
-  }
-
-  stopAutoRefresh() {
-    if (this.refreshInterval) {
-      clearInterval(this.refreshInterval);
-      this.refreshInterval = null;
-    }
-  }
-
-  scrollToBottom() {
-    const output = this.querySelector('#console-output');
-    if (output) {
-      output.scrollTop = output.scrollHeight;
-    }
-  }
-
-  escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-}
-
-customElements.define('ds-console-viewer', DSConsoleViewer);
-
-export default DSConsoleViewer;
diff --git a/admin-ui/js/components/tools/ds-esre-editor.js b/admin-ui/js/components/tools/ds-esre-editor.js
deleted file mode 100644
index 25da57d..0000000
--- a/admin-ui/js/components/tools/ds-esre-editor.js
+++ /dev/null
@@ -1,233 +0,0 @@
-/**
- * ds-esre-editor.js
- * Editor for ESRE (Explicit Style Requirements and Expectations)
- * QA Team Tool #2
- */
-
-import { createEditorView, setupEditorHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-
-class DSESREEditor extends HTMLElement {
-  constructor() {
-    super();
-    this.esreContent = '';
-    this.isSaving = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    await this.loadESRE();
-  }
-
-  async loadESRE() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Load ESRE from project configuration
-      const response = await fetch(`/api/projects/${context.project_id}/esre`);
-      if (response.ok) {
-        const result = await response.json();
-        this.esreContent = result.content || '';
-        this.renderEditor();
-      } else {
-        // No ESRE yet, start with template
-        this.esreContent = this.getESRETemplate();
-        this.renderEditor();
-      }
-    } catch (error) {
-      console.error('[DSESREEditor] Failed to load ESRE:', error);
-      this.esreContent = this.getESRETemplate();
-      this.renderEditor();
-    }
-  }
-
-  getESRETemplate() {
-    return `# Explicit Style Requirements and Expectations (ESRE)
-
-## Project: ${contextStore.get('projectId') || 'Design System'}
-
-### Color Requirements
-- Primary colors must match Figma specifications exactly
-- Accessibility: All text must meet WCAG 2.1 AA contrast ratios
-- Color tokens must be used instead of hardcoded hex values
-
-### Typography Requirements
-- Font families: [Specify approved fonts]
-- Font sizes must use design system scale
-- Line heights must maintain readability
-- Letter spacing should follow design specifications
-
-### Spacing Requirements
-- All spacing must use design system spacing scale
-- Margins and padding should be consistent across components
-- Grid system: [Specify grid specifications]
-
-### Component Requirements
-- All components must be built from design system primitives
-- Component variants must match Figma component variants
-- Props should follow naming conventions
-
-### Responsive Requirements
-- Breakpoints: [Specify breakpoints]
-- Mobile-first approach required
-- Touch targets must be at least 44x44px
-
-### Accessibility Requirements
-- All interactive elements must be keyboard accessible
-- ARIA labels required for icon-only buttons
-- Focus indicators must be visible
-- Screen reader testing required
-
-### Performance Requirements
-- Initial load time: [Specify target]
-- Time to Interactive: [Specify target]
-- Bundle size limits: [Specify limits]
-
-### Browser Support
-- Chrome: Latest 2 versions
-- Firefox: Latest 2 versions
-- Safari: Latest 2 versions
-- Edge: Latest 2 versions
-
----
-
-## Validation Checklist
-
-### Pre-Deployment
-- [ ] All colors match Figma specifications
-- [ ] Typography follows design system scale
-- [ ] Spacing uses design tokens
-- [ ] Components match design system library
-- [ ] Responsive behavior validated
-- [ ] Accessibility audit passed
-- [ ] Performance metrics met
-- [ ] Cross-browser testing completed
-
-### QA Testing
-- [ ] Visual comparison with Figma
-- [ ] Keyboard navigation tested
-- [ ] Screen reader compatibility verified
-- [ ] Mobile devices tested
-- [ ] Edge cases validated
-
----
-
-Last updated: ${new Date().toISOString().split('T')[0]}
-`;
-  }
-
-  renderEditor() {
-    const container = this.querySelector('#editor-container');
-    if (!container) return;
-
-    const config = {
-      title: 'ESRE Editor',
-      content: this.esreContent,
-      language: 'markdown',
-      onSave: (content) => this.saveESRE(content),
-      onExport: (content) => this.exportESRE(content)
-    };
-
-    container.innerHTML = createEditorView(config);
-    setupEditorHandlers(container, config);
-  }
-
-  async saveESRE(content) {
-    this.isSaving = true;
-    const saveBtn = document.querySelector('#editor-save-btn');
-    if (saveBtn) {
-      saveBtn.disabled = true;
-      saveBtn.textContent = '⏳ Saving...';
-    }
-
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Save ESRE via API
-      const response = await fetch('/api/esre/save', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          projectId: context.project_id,
-          content
-        })
-      });
-
-      if (!response.ok) {
-        throw new Error(`Save failed: ${response.statusText}`);
-      }
-
-      this.esreContent = content;
-      ComponentHelpers.showToast?.('ESRE saved successfully', 'success');
-    } catch (error) {
-      console.error('[DSESREEditor] Save failed:', error);
-      ComponentHelpers.showToast?.(`Save failed: ${error.message}`, 'error');
-    } finally {
-      this.isSaving = false;
-      if (saveBtn) {
-        saveBtn.disabled = false;
-        saveBtn.textContent = '💾 Save';
-      }
-    }
-  }
-
-  exportESRE(content) {
-    const blob = new Blob([content], { type: 'text/markdown' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    const projectId = contextStore.get('projectId') || 'project';
-    a.href = url;
-    a.download = `${projectId}-esre.md`;
-    a.click();
-    URL.revokeObjectURL(url);
-    ComponentHelpers.showToast?.('ESRE exported', 'success');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Info Banner -->
-        <div style="padding: 12px 16px; background: rgba(255, 191, 0, 0.1); border-bottom: 1px solid var(--vscode-border);">
-          <div style="display: flex; align-items: center; gap: 12px;">
-            <div style="font-size: 20px;">📋</div>
-            <div style="flex: 1;">
-              <div style="font-size: 11px; font-weight: 600; margin-bottom: 2px;">
-                ESRE: Explicit Style Requirements and Expectations
-              </div>
-              <div style="font-size: 10px; color: var(--vscode-text-dim);">
-                Define clear specifications for design implementation and QA validation
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <!-- Editor Container -->
-        <div id="editor-container" style="flex: 1; overflow: hidden;">
-          ${createEditorView({
-            title: 'ESRE Editor',
-            content: this.esreContent,
-            language: 'markdown',
-            onSave: (content) => this.saveESRE(content),
-            onExport: (content) => this.exportESRE(content)
-          })}
-        </div>
-
-        <!-- Help Footer -->
-        <div style="padding: 8px 16px; border-top: 1px solid var(--vscode-border); font-size: 10px; color: var(--vscode-text-dim);">
-          💡 Tip: Use Markdown formatting for clear documentation. Save changes before closing.
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-esre-editor', DSESREEditor);
-
-export default DSESREEditor;
diff --git a/admin-ui/js/components/tools/ds-figma-extract-quick.js b/admin-ui/js/components/tools/ds-figma-extract-quick.js
deleted file mode 100644
index 8a6dd55..0000000
--- a/admin-ui/js/components/tools/ds-figma-extract-quick.js
+++ /dev/null
@@ -1,303 +0,0 @@
-/**
- * ds-figma-extract-quick.js
- * One-click Figma token extraction tool
- * MVP2: Extract design tokens directly from Figma file
- */
-
-import contextStore from '../../stores/context-store.js';
-
-export default class FigmaExtractQuick extends HTMLElement {
-  constructor() {
-    super();
-    this.figmaUrl = '';
-    this.extractionProgress = 0;
-    this.extractedTokens = [];
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <div style="margin-bottom: 24px;">
-          <h1 style="margin: 0 0 8px 0; font-size: 24px;">Figma Token Extraction</h1>
-          <p style="margin: 0; color: var(--vscode-text-dim);">
-            Extract design tokens directly from your Figma file
-          </p>
-        </div>
-
-        <!-- Input Section -->
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 24px;">
-          <div style="margin-bottom: 12px;">
-            <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 8px;">
-              Figma File URL or Key
-            </label>
-            <input
-              id="figma-url-input"
-              type="text"
-              placeholder="https://figma.com/file/xxx/Design-Tokens or file-key"
-              style="
-                width: 100%;
-                padding: 8px 12px;
-                border: 1px solid var(--vscode-input-border);
-                background: var(--vscode-input-background);
-                color: var(--vscode-foreground);
-                border-radius: 4px;
-                font-size: 12px;
-                box-sizing: border-box;
-              "
-            />
-          </div>
-
-          <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 8px;">
-            <button id="extract-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-background);
-              color: var(--vscode-button-foreground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-              font-size: 12px;
-            ">🚀 Extract Tokens</button>
-
-            <button id="export-btn" style="
-              padding: 8px 16px;
-              background: var(--vscode-button-secondaryBackground);
-              color: var(--vscode-button-secondaryForeground);
-              border: none;
-              border-radius: 4px;
-              cursor: pointer;
-              font-weight: 500;
-              font-size: 12px;
-            ">📥 Import to Project</button>
-          </div>
-        </div>
-
-        <!-- Progress Section -->
-        <div id="progress-container" style="display: none; margin-bottom: 24px;">
-          <div style="margin-bottom: 8px; font-size: 12px; color: var(--vscode-text-dim);">
-            Extracting tokens... <span id="progress-percent">0%</span>
-          </div>
-          <div style="
-            width: 100%;
-            height: 6px;
-            background: var(--vscode-bg);
-            border-radius: 3px;
-            overflow: hidden;
-          ">
-            <div id="progress-bar" style="
-              width: 0%;
-              height: 100%;
-              background: #0066CC;
-              transition: width 0.3s ease;
-            "></div>
-          </div>
-        </div>
-
-        <!-- Results Section -->
-        <div id="results-container" style="display: none; background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-          <h3 style="margin: 0 0 12px 0; font-size: 14px;">✓ Extraction Complete</h3>
-          <div id="token-summary" style="
-            display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
-            gap: 12px;
-            margin-bottom: 16px;
-          ">
-            <!-- Summary cards will be inserted here -->
-          </div>
-
-          <div style="margin-bottom: 16px; padding-top: 12px; border-top: 1px solid var(--vscode-border);">
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px;">
-              Extracted Tokens:
-            </div>
-            <pre id="token-preview" style="
-              background: var(--vscode-bg);
-              padding: 12px;
-              border-radius: 3px;
-              font-size: 10px;
-              overflow: auto;
-              max-height: 300px;
-              margin: 0;
-              color: #CE9178;
-            ">{}</pre>
-          </div>
-
-          <button id="copy-tokens-btn" style="
-            width: 100%;
-            padding: 8px;
-            background: var(--vscode-button-background);
-            color: var(--vscode-button-foreground);
-            border: none;
-            border-radius: 3px;
-            cursor: pointer;
-            font-size: 11px;
-            font-weight: 500;
-          ">📋 Copy JSON</button>
-        </div>
-
-        <!-- Instructions Section -->
-        <div style="background: var(--vscode-notificationsErrorIcon); opacity: 0.1; border: 1px solid var(--vscode-border); border-radius: 4px; padding: 12px;">
-          <div style="font-size: 12px; color: var(--vscode-text-dim);">
-            <strong>How to extract:</strong>
-            <ol style="margin: 8px 0 0 20px; padding: 0;">
-              <li>Open your Figma Design Tokens file</li>
-              <li>Copy the file URL or key from browser</li>
-              <li>Paste it above and click "Extract Tokens"</li>
-              <li>Review and import to your project</li>
-            </ol>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    const extractBtn = this.querySelector('#extract-btn');
-    const exportBtn = this.querySelector('#export-btn');
-    const copyBtn = this.querySelector('#copy-tokens-btn');
-    const input = this.querySelector('#figma-url-input');
-
-    if (extractBtn) {
-      extractBtn.addEventListener('click', () => this.extractTokens());
-    }
-
-    if (exportBtn) {
-      exportBtn.addEventListener('click', () => this.importTokens());
-    }
-
-    if (copyBtn) {
-      copyBtn.addEventListener('click', () => this.copyTokensToClipboard());
-    }
-
-    if (input) {
-      input.addEventListener('change', (e) => {
-        this.figmaUrl = e.target.value;
-      });
-    }
-  }
-
-  async extractTokens() {
-    const url = this.figmaUrl.trim();
-
-    if (!url) {
-      alert('Please enter a Figma file URL or key');
-      return;
-    }
-
-    // Validate Figma URL or key format
-    const isFigmaUrl = url.includes('figma.com');
-    const isFigmaKey = /^[a-zA-Z0-9]{20,}$/.test(url);
-
-    if (!isFigmaUrl && !isFigmaKey) {
-      alert('Invalid Figma URL or key format. Please provide a valid Figma file URL or file key.');
-      return;
-    }
-
-    const progressContainer = this.querySelector('#progress-container');
-    const resultsContainer = this.querySelector('#results-container');
-
-    progressContainer.style.display = 'block';
-    resultsContainer.style.display = 'none';
-
-    // Simulate token extraction process
-    this.extractedTokens = this.generateMockTokens();
-
-    for (let i = 0; i <= 100; i += 10) {
-      this.extractionProgress = i;
-      this.querySelector('#progress-percent').textContent = i + '%';
-      this.querySelector('#progress-bar').style.width = i + '%';
-      await new Promise(resolve => setTimeout(resolve, 100));
-    }
-
-    this.showResults();
-  }
-
-  generateMockTokens() {
-    return {
-      colors: {
-        primary: { value: '#0066CC', description: 'Primary brand color' },
-        secondary: { value: '#4CAF50', description: 'Secondary brand color' },
-        error: { value: '#F44336', description: 'Error/danger color' },
-        warning: { value: '#FF9800', description: 'Warning color' },
-        success: { value: '#4CAF50', description: 'Success color' }
-      },
-      spacing: {
-        xs: { value: '4px', description: 'Extra small spacing' },
-        sm: { value: '8px', description: 'Small spacing' },
-        md: { value: '16px', description: 'Medium spacing' },
-        lg: { value: '24px', description: 'Large spacing' },
-        xl: { value: '32px', description: 'Extra large spacing' }
-      },
-      typography: {
-        heading: { value: 'Poppins, sans-serif', description: 'Heading font' },
-        body: { value: 'Inter, sans-serif', description: 'Body font' },
-        mono: { value: 'Courier New, monospace', description: 'Monospace font' }
-      }
-    };
-  }
-
-  showResults() {
-    const progressContainer = this.querySelector('#progress-container');
-    const resultsContainer = this.querySelector('#results-container');
-    progressContainer.style.display = 'none';
-    resultsContainer.style.display = 'block';
-
-    // Create summary cards
-    const summary = this.querySelector('#token-summary');
-    const categories = Object.keys(this.extractedTokens);
-    summary.innerHTML = categories.map(cat => `
-      <div style="
-        background: var(--vscode-bg);
-        padding: 12px;
-        border-radius: 3px;
-        text-align: center;
-      ">
-        <div style="font-size: 18px; font-weight: 600; color: #0066CC;">
-          ${Object.keys(this.extractedTokens[cat]).length}
-        </div>
-        <div style="font-size: 11px; color: var(--vscode-text-dim); text-transform: capitalize;">
-          ${cat}
-        </div>
-      </div>
-    `).join('');
-
-    // Show preview
-    this.querySelector('#token-preview').textContent = JSON.stringify(this.extractedTokens, null, 2);
-  }
-
-  copyTokensToClipboard() {
-    const json = JSON.stringify(this.extractedTokens, null, 2);
-    navigator.clipboard.writeText(json).then(() => {
-      const btn = this.querySelector('#copy-tokens-btn');
-      const original = btn.textContent;
-      btn.textContent = '✓ Copied to clipboard';
-      setTimeout(() => {
-        btn.textContent = original;
-      }, 2000);
-    });
-  }
-
-  importTokens() {
-    const json = JSON.stringify(this.extractedTokens, null, 2);
-    const blob = new Blob([json], { type: 'application/json' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = 'figma-tokens.json';
-    a.click();
-    URL.revokeObjectURL(url);
-
-    // Also dispatch event for integration with project
-    this.dispatchEvent(new CustomEvent('tokens-extracted', {
-      detail: { tokens: this.extractedTokens },
-      bubbles: true,
-      composed: true
-    }));
-  }
-}
-
-customElements.define('ds-figma-extract-quick', FigmaExtractQuick);
diff --git a/admin-ui/js/components/tools/ds-figma-extraction.js b/admin-ui/js/components/tools/ds-figma-extraction.js
deleted file mode 100644
index ee9eb20..0000000
--- a/admin-ui/js/components/tools/ds-figma-extraction.js
+++ /dev/null
@@ -1,297 +0,0 @@
-/**
- * ds-figma-extraction.js
- * Interface for extracting design tokens from Figma files
- * UI Team Tool #3
- */
-
-import { createFormView, setupFormHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import toolBridge from '../../services/tool-bridge.js';
-import apiClient from '../../services/api-client.js';
-
-class DSFigmaExtraction extends HTMLElement {
-  constructor() {
-    super();
-    this.figmaFileKey = '';
-    this.figmaToken = '';
-    this.extractionResults = null;
-    this.isExtracting = false;
-  }
-
-  async connectedCallback() {
-    await this.loadProjectConfig();
-    this.render();
-    this.setupEventListeners();
-  }
-
-  async loadProjectConfig() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) return;
-
-      const project = await apiClient.getProject(context.project_id);
-      const figmaUrl = project.figma_ui_file || '';
-
-      // Extract file key from Figma URL
-      const match = figmaUrl.match(/file\/([^/]+)/);
-      if (match) {
-        this.figmaFileKey = match[1];
-      }
-
-      // Check for stored Figma token
-      this.figmaToken = localStorage.getItem('figma_token') || '';
-    } catch (error) {
-      console.error('[DSFigmaExtraction] Failed to load project config:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const fileKeyInput = this.querySelector('#figma-file-key');
-    const tokenInput = this.querySelector('#figma-token');
-    const extractBtn = this.querySelector('#extract-btn');
-    const saveTokenCheckbox = this.querySelector('#save-token');
-
-    if (fileKeyInput) {
-      fileKeyInput.value = this.figmaFileKey;
-    }
-
-    if (tokenInput) {
-      tokenInput.value = this.figmaToken;
-    }
-
-    if (extractBtn) {
-      extractBtn.addEventListener('click', () => this.extractTokens());
-    }
-
-    if (saveTokenCheckbox && tokenInput) {
-      tokenInput.addEventListener('change', () => {
-        if (saveTokenCheckbox.checked) {
-          localStorage.setItem('figma_token', tokenInput.value);
-        }
-      });
-    }
-  }
-
-  async extractTokens() {
-    const fileKeyInput = this.querySelector('#figma-file-key');
-    const tokenInput = this.querySelector('#figma-token');
-
-    this.figmaFileKey = fileKeyInput?.value.trim() || '';
-    this.figmaToken = tokenInput?.value.trim() || '';
-
-    if (!this.figmaFileKey) {
-      ComponentHelpers.showToast?.('Please enter a Figma file key', 'error');
-      return;
-    }
-
-    if (!this.figmaToken) {
-      ComponentHelpers.showToast?.('Please enter a Figma API token', 'error');
-      return;
-    }
-
-    this.isExtracting = true;
-    this.updateLoadingState();
-
-    try {
-      // Set Figma token as environment variable for MCP tool
-      // In real implementation, this would be securely stored
-      process.env.FIGMA_TOKEN = this.figmaToken;
-
-      // Call dss_sync_figma MCP tool
-      const result = await toolBridge.executeTool('dss_sync_figma', {
-        file_key: this.figmaFileKey
-      });
-
-      this.extractionResults = result;
-      this.renderResults();
-
-      ComponentHelpers.showToast?.('Tokens extracted successfully', 'success');
-    } catch (error) {
-      console.error('[DSFigmaExtraction] Extraction failed:', error);
-      ComponentHelpers.showToast?.(`Extraction failed: ${error.message}`, 'error');
-
-      const resultsContainer = this.querySelector('#results-container');
-      if (resultsContainer) {
-        resultsContainer.innerHTML = ComponentHelpers.renderError('Token extraction failed', error);
-      }
-    } finally {
-      this.isExtracting = false;
-      this.updateLoadingState();
-    }
-  }
-
-  updateLoadingState() {
-    const extractBtn = this.querySelector('#extract-btn');
-    if (!extractBtn) return;
-
-    if (this.isExtracting) {
-      extractBtn.disabled = true;
-      extractBtn.textContent = '⏳ Extracting...';
-    } else {
-      extractBtn.disabled = false;
-      extractBtn.textContent = '🎨 Extract Tokens';
-    }
-  }
-
-  renderResults() {
-    const resultsContainer = this.querySelector('#results-container');
-    if (!resultsContainer || !this.extractionResults) return;
-
-    const tokenCount = Object.keys(this.extractionResults.tokens || {}).length;
-
-    resultsContainer.innerHTML = `
-      <div style="padding: 16px;">
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-          <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Extraction Summary</h4>
-
-          <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 16px; font-size: 11px;">
-            <div style="text-align: center;">
-              <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${tokenCount}</div>
-              <div style="color: var(--vscode-text-dim); margin-top: 4px;">Tokens Found</div>
-            </div>
-            <div style="text-align: center;">
-              <div style="font-size: 24px; font-weight: 600; color: #89d185;">✓</div>
-              <div style="color: var(--vscode-text-dim); margin-top: 4px;">Success</div>
-            </div>
-          </div>
-        </div>
-
-        <div style="display: flex; gap: 12px;">
-          <button id="export-json-btn" class="button" style="font-size: 11px;">
-            📥 Export JSON
-          </button>
-          <button id="export-css-btn" class="button" style="font-size: 11px;">
-            📥 Export CSS
-          </button>
-          <button id="view-tokens-btn" class="button" style="font-size: 11px;">
-            👁️ View Tokens
-          </button>
-        </div>
-      </div>
-    `;
-
-    // Setup export handlers
-    const exportJsonBtn = resultsContainer.querySelector('#export-json-btn');
-    const exportCssBtn = resultsContainer.querySelector('#export-css-btn');
-    const viewTokensBtn = resultsContainer.querySelector('#view-tokens-btn');
-
-    if (exportJsonBtn) {
-      exportJsonBtn.addEventListener('click', () => this.exportTokens('json'));
-    }
-
-    if (exportCssBtn) {
-      exportCssBtn.addEventListener('click', () => this.exportTokens('css'));
-    }
-
-    if (viewTokensBtn) {
-      viewTokensBtn.addEventListener('click', () => {
-        // Switch to Token Inspector panel
-        const panel = document.querySelector('ds-panel');
-        if (panel) {
-          panel.switchTab('tokens');
-        }
-      });
-    }
-  }
-
-  exportTokens(format) {
-    if (!this.extractionResults) return;
-
-    const filename = `figma-tokens-${this.figmaFileKey}.${format}`;
-    let content = '';
-
-    if (format === 'json') {
-      content = JSON.stringify(this.extractionResults.tokens, null, 2);
-    } else if (format === 'css') {
-      // Convert tokens to CSS custom properties
-      const tokens = this.extractionResults.tokens;
-      content = ':root {\n';
-      for (const [key, value] of Object.entries(tokens)) {
-        content += `  --${key}: ${value};\n`;
-      }
-      content += '}\n';
-    }
-
-    // Create download
-    const blob = new Blob([content], { type: 'text/plain' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = filename;
-    a.click();
-    URL.revokeObjectURL(url);
-
-    ComponentHelpers.showToast?.(`Exported as ${filename}`, 'success');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Configuration Panel -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Figma Token Extraction</h3>
-
-          <div style="display: grid; grid-template-columns: 2fr 3fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Figma File Key
-              </label>
-              <input
-                type="text"
-                id="figma-file-key"
-                placeholder="abc123def456..."
-                class="input"
-                style="width: 100%; font-size: 11px; font-family: monospace;"
-              />
-            </div>
-
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Figma API Token
-              </label>
-              <input
-                type="password"
-                id="figma-token"
-                placeholder="figd_..."
-                class="input"
-                style="width: 100%; font-size: 11px; font-family: monospace;"
-              />
-            </div>
-
-            <button id="extract-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              🎨 Extract Tokens
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; display: flex; justify-content: space-between; align-items: center;">
-            <label style="font-size: 10px; color: var(--vscode-text-dim); display: flex; align-items: center; gap: 6px;">
-              <input type="checkbox" id="save-token" />
-              Remember Figma token (stored locally)
-            </label>
-            <a href="https://www.figma.com/developers/api#authentication" target="_blank" style="font-size: 10px; color: var(--vscode-link);">
-              Get API Token →
-            </a>
-          </div>
-        </div>
-
-        <!-- Results Container -->
-        <div id="results-container" style="flex: 1; overflow: auto;">
-          <div style="display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 48px;">
-            <div>
-              <div style="font-size: 48px; margin-bottom: 16px;">🎨</div>
-              <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">Ready to Extract Tokens</h3>
-              <p style="font-size: 12px; color: var(--vscode-text-dim);">
-                Enter your Figma file key and API token above to extract design tokens
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-figma-extraction', DSFigmaExtraction);
-
-export default DSFigmaExtraction;
diff --git a/admin-ui/js/components/tools/ds-figma-live-compare.js b/admin-ui/js/components/tools/ds-figma-live-compare.js
deleted file mode 100644
index a834745..0000000
--- a/admin-ui/js/components/tools/ds-figma-live-compare.js
+++ /dev/null
@@ -1,201 +0,0 @@
-/**
- * ds-figma-live-compare.js
- * Side-by-side Figma and Live Application comparison for QA validation
- * QA Team Tool #1
- */
-
-import { createComparisonView, setupComparisonHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import apiClient from '../../services/api-client.js';
-
-class DSFigmaLiveCompare extends HTMLElement {
-  constructor() {
-    super();
-    this.figmaUrl = '';
-    this.liveUrl = '';
-  }
-
-  async connectedCallback() {
-    await this.loadProjectConfig();
-    this.render();
-    this.setupEventListeners();
-  }
-
-  async loadProjectConfig() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      const project = await apiClient.getProject(context.project_id);
-      this.figmaUrl = project.figma_qa_file || project.figma_ui_file || '';
-      this.liveUrl = project.live_url || window.location.origin;
-    } catch (error) {
-      console.error('[DSFigmaLiveCompare] Failed to load project config:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const figmaInput = this.querySelector('#figma-url-input');
-    const liveInput = this.querySelector('#live-url-input');
-    const loadBtn = this.querySelector('#load-comparison-btn');
-    const screenshotBtn = this.querySelector('#take-screenshot-btn');
-
-    if (figmaInput) {
-      figmaInput.value = this.figmaUrl;
-    }
-
-    if (liveInput) {
-      liveInput.value = this.liveUrl;
-    }
-
-    if (loadBtn) {
-      loadBtn.addEventListener('click', () => this.loadComparison());
-    }
-
-    if (screenshotBtn) {
-      screenshotBtn.addEventListener('click', () => this.takeScreenshots());
-    }
-
-    const comparisonContainer = this.querySelector('#comparison-container');
-    if (comparisonContainer) {
-      setupComparisonHandlers(comparisonContainer, {});
-    }
-  }
-
-  loadComparison() {
-    const figmaInput = this.querySelector('#figma-url-input');
-    const liveInput = this.querySelector('#live-url-input');
-
-    this.figmaUrl = figmaInput?.value || '';
-    this.liveUrl = liveInput?.value || '';
-
-    if (!this.figmaUrl || !this.liveUrl) {
-      ComponentHelpers.showToast?.('Please enter both Figma and Live URLs', 'error');
-      return;
-    }
-
-    try {
-      new URL(this.figmaUrl);
-      new URL(this.liveUrl);
-    } catch (error) {
-      ComponentHelpers.showToast?.('Invalid URL format', 'error');
-      return;
-    }
-
-    const comparisonContainer = this.querySelector('#comparison-container');
-    if (comparisonContainer) {
-      comparisonContainer.innerHTML = createComparisonView({
-        leftTitle: 'Figma Design',
-        rightTitle: 'Live Application',
-        leftSrc: this.figmaUrl,
-        rightSrc: this.liveUrl
-      });
-
-      setupComparisonHandlers(comparisonContainer, {});
-      ComponentHelpers.showToast?.('Comparison loaded', 'success');
-    }
-  }
-
-  async takeScreenshots() {
-    ComponentHelpers.showToast?.('Taking screenshots...', 'info');
-
-    try {
-      // Take screenshot of live application via MCP (using authenticated API client)
-      const context = contextStore.getMCPContext();
-      await apiClient.request('POST', '/qa/screenshot-compare', {
-        projectId: context.project_id,
-        figmaUrl: this.figmaUrl,
-        liveUrl: this.liveUrl
-      });
-
-      ComponentHelpers.showToast?.('Screenshots saved to gallery', 'success');
-
-      // Switch to screenshot gallery
-      const panel = document.querySelector('ds-panel');
-      if (panel) {
-        panel.switchTab('screenshots');
-      }
-    } catch (error) {
-      console.error('[DSFigmaLiveCompare] Screenshot failed:', error);
-      ComponentHelpers.showToast?.(`Screenshot failed: ${error.message}`, 'error');
-    }
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Configuration Panel -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Figma vs Live QA Comparison</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr 1fr auto auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Figma Design URL
-              </label>
-              <input
-                type="url"
-                id="figma-url-input"
-                placeholder="https://figma.com/file/..."
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Live Component URL
-              </label>
-              <input
-                type="url"
-                id="live-url-input"
-                placeholder="https://app.example.com/..."
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <button id="load-comparison-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              🔍 Load
-            </button>
-
-            <button id="take-screenshot-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              📸 Screenshot
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; font-size: 10px; color: var(--vscode-text-dim);">
-            💡 Compare design specifications with live implementation for QA validation
-          </div>
-        </div>
-
-        <!-- Comparison View -->
-        <div id="comparison-container" style="flex: 1; overflow: hidden;">
-          ${this.figmaUrl && this.liveUrl ? createComparisonView({
-            leftTitle: 'Figma Design',
-            rightTitle: 'Live Application',
-            leftSrc: this.figmaUrl,
-            rightSrc: this.liveUrl
-          }) : `
-            <div style="display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 48px;">
-              <div>
-                <div style="font-size: 48px; margin-bottom: 16px;">✅</div>
-                <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">QA Comparison Tool</h3>
-                <p style="font-size: 12px; color: var(--vscode-text-dim);">
-                  Enter Figma design and live application URLs to validate implementation against specifications
-                </p>
-              </div>
-            </div>
-          `}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-figma-live-compare', DSFigmaLiveCompare);
-
-export default DSFigmaLiveCompare;
diff --git a/admin-ui/js/components/tools/ds-figma-plugin.js b/admin-ui/js/components/tools/ds-figma-plugin.js
deleted file mode 100644
index f099b83..0000000
--- a/admin-ui/js/components/tools/ds-figma-plugin.js
+++ /dev/null
@@ -1,266 +0,0 @@
-/**
- * ds-figma-plugin.js
- * Interface for Figma plugin export and token management
- * UX Team Tool #1
- */
-
-import { createFormView, setupFormHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSFigmaPlugin extends HTMLElement {
-  constructor() {
-    super();
-    this.exportHistory = [];
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.loadExportHistory();
-  }
-
-  async loadExportHistory() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) return;
-
-      const cached = localStorage.getItem(`figma_exports_${context.project_id}`);
-      if (cached) {
-        this.exportHistory = JSON.parse(cached);
-        this.renderHistory();
-      }
-    } catch (error) {
-      console.error('[DSFigmaPlugin] Failed to load history:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const exportBtn = this.querySelector('#export-figma-btn');
-    const fileKeyInput = this.querySelector('#figma-file-key');
-    const exportTypeSelect = this.querySelector('#export-type-select');
-
-    if (exportBtn) {
-      exportBtn.addEventListener('click', () => this.exportFromFigma());
-    }
-  }
-
-  async exportFromFigma() {
-    const fileKeyInput = this.querySelector('#figma-file-key');
-    const exportTypeSelect = this.querySelector('#export-type-select');
-    const formatSelect = this.querySelector('#export-format-select');
-
-    const fileKey = fileKeyInput?.value.trim() || '';
-    const exportType = exportTypeSelect?.value || 'tokens';
-    const format = formatSelect?.value || 'json';
-
-    if (!fileKey) {
-      ComponentHelpers.showToast?.('Please enter a Figma file key', 'error');
-      return;
-    }
-
-    const exportBtn = this.querySelector('#export-figma-btn');
-    if (exportBtn) {
-      exportBtn.disabled = true;
-      exportBtn.textContent = '⏳ Exporting...';
-    }
-
-    try {
-      let result;
-
-      if (exportType === 'tokens') {
-        // Export design tokens
-        result = await toolBridge.executeTool('dss_sync_figma', {
-          file_key: fileKey
-        });
-      } else if (exportType === 'assets') {
-        // Export assets (icons, images)
-        const response = await fetch('/api/figma/export-assets', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({
-            projectId: contextStore.get('projectId'),
-            fileKey,
-            format
-          })
-        });
-
-        if (!response.ok) {
-          throw new Error(`Asset export failed: ${response.statusText}`);
-        }
-
-        result = await response.json();
-      } else if (exportType === 'components') {
-        // Export component definitions
-        const response = await fetch('/api/figma/export-components', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({
-            projectId: contextStore.get('projectId'),
-            fileKey,
-            format
-          })
-        });
-
-        if (!response.ok) {
-          throw new Error(`Component export failed: ${response.statusText}`);
-        }
-
-        result = await response.json();
-      }
-
-      // Add to history
-      const exportEntry = {
-        timestamp: new Date().toISOString(),
-        fileKey,
-        type: exportType,
-        format,
-        itemCount: result.count || Object.keys(result.tokens || result.assets || result.components || {}).length
-      };
-
-      this.exportHistory.unshift(exportEntry);
-      this.exportHistory = this.exportHistory.slice(0, 10); // Keep last 10
-
-      // Cache history
-      const context = contextStore.getMCPContext();
-      if (context.project_id) {
-        localStorage.setItem(`figma_exports_${context.project_id}`, JSON.stringify(this.exportHistory));
-      }
-
-      this.renderHistory();
-      ComponentHelpers.showToast?.(`Exported ${exportEntry.itemCount} ${exportType}`, 'success');
-    } catch (error) {
-      console.error('[DSFigmaPlugin] Export failed:', error);
-      ComponentHelpers.showToast?.(`Export failed: ${error.message}`, 'error');
-    } finally {
-      if (exportBtn) {
-        exportBtn.disabled = false;
-        exportBtn.textContent = '📤 Export from Figma';
-      }
-    }
-  }
-
-  renderHistory() {
-    const historyContainer = this.querySelector('#export-history');
-    if (!historyContainer) return;
-
-    if (this.exportHistory.length === 0) {
-      historyContainer.innerHTML = ComponentHelpers.renderEmpty('No export history', '📋');
-      return;
-    }
-
-    historyContainer.innerHTML = `
-      <div style="display: flex; flex-direction: column; gap: 8px;">
-        ${this.exportHistory.map((entry, idx) => `
-          <div style="background: var(--vscode-bg); border: 1px solid var(--vscode-border); border-radius: 2px; padding: 12px;">
-            <div style="display: flex; justify-content: space-between; align-items: start; margin-bottom: 6px;">
-              <div style="flex: 1;">
-                <div style="font-size: 11px; font-weight: 600; margin-bottom: 4px;">
-                  ${ComponentHelpers.escapeHtml(entry.type)} Export
-                </div>
-                <div style="font-size: 10px; color: var(--vscode-text-dim); font-family: monospace;">
-                  ${ComponentHelpers.escapeHtml(entry.fileKey)}
-                </div>
-              </div>
-              <div style="text-align: right;">
-                <div style="font-size: 10px; color: var(--vscode-text-dim);">
-                  ${ComponentHelpers.formatRelativeTime(new Date(entry.timestamp))}
-                </div>
-                <div style="font-size: 11px; font-weight: 600; margin-top: 2px;">
-                  ${entry.itemCount} items
-                </div>
-              </div>
-            </div>
-            <div style="display: flex; gap: 6px;">
-              <span style="padding: 2px 6px; background: var(--vscode-sidebar); border-radius: 2px; font-size: 9px;">
-                ${entry.format.toUpperCase()}
-              </span>
-            </div>
-          </div>
-        `).join('')}
-      </div>
-    `;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 16px; height: 100%;">
-        <!-- Export Panel -->
-        <div style="display: flex; flex-direction: column; height: 100%; border-right: 1px solid var(--vscode-border);">
-          <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-            <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 4px;">Figma Export</h3>
-            <p style="font-size: 10px; color: var(--vscode-text-dim);">
-              Export tokens, assets, or components from Figma files
-            </p>
-          </div>
-
-          <div style="flex: 1; overflow: auto; padding: 16px;">
-            <div style="display: flex; flex-direction: column; gap: 16px;">
-              <div>
-                <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 6px;">
-                  Figma File Key
-                </label>
-                <input
-                  type="text"
-                  id="figma-file-key"
-                  placeholder="abc123def456..."
-                  class="input"
-                  style="width: 100%; font-size: 11px; font-family: monospace;"
-                />
-                <div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 4px;">
-                  Find this in your Figma file URL
-                </div>
-              </div>
-
-              <div>
-                <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 6px;">
-                  Export Type
-                </label>
-                <select id="export-type-select" class="input" style="width: 100%; font-size: 11px;">
-                  <option value="tokens">Design Tokens</option>
-                  <option value="assets">Assets (Icons, Images)</option>
-                  <option value="components">Component Definitions</option>
-                </select>
-              </div>
-
-              <div>
-                <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 6px;">
-                  Export Format
-                </label>
-                <select id="export-format-select" class="input" style="width: 100%; font-size: 11px;">
-                  <option value="json">JSON</option>
-                  <option value="css">CSS</option>
-                  <option value="scss">SCSS</option>
-                  <option value="js">JavaScript</option>
-                </select>
-              </div>
-
-              <button id="export-figma-btn" class="button" style="font-size: 12px; padding: 8px;">
-                📤 Export from Figma
-              </button>
-            </div>
-          </div>
-        </div>
-
-        <!-- History Panel -->
-        <div style="display: flex; flex-direction: column; height: 100%;">
-          <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-            <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 4px;">Export History</h3>
-            <p style="font-size: 10px; color: var(--vscode-text-dim);">
-              Recent Figma exports for this project
-            </p>
-          </div>
-
-          <div id="export-history" style="flex: 1; overflow: auto; padding: 16px;">
-            ${ComponentHelpers.renderLoading('Loading history...')}
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-figma-plugin', DSFigmaPlugin);
-
-export default DSFigmaPlugin;
diff --git a/admin-ui/js/components/tools/ds-figma-status.js b/admin-ui/js/components/tools/ds-figma-status.js
deleted file mode 100644
index 97e1a3a..0000000
--- a/admin-ui/js/components/tools/ds-figma-status.js
+++ /dev/null
@@ -1,411 +0,0 @@
-/**
- * ds-figma-status.js
- * Figma integration status and sync controls
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSFigmaStatus extends HTMLElement {
-  constructor() {
-    super();
-    this.figmaToken = null;
-    this.figmaFileKey = null;
-    this.connectionStatus = 'unknown';
-    this.lastSync = null;
-    this.isConfiguring = false;
-    this.isSyncing = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.checkConfiguration();
-  }
-
-  /**
-   * Check if Figma is configured and test connection
-   */
-  async checkConfiguration() {
-    const statusContent = this.querySelector('#figma-status-content');
-    if (!statusContent) return;
-
-    try {
-      // Check for stored file key in localStorage (not token - that's server-side)
-      this.figmaFileKey = localStorage.getItem('figma_file_key');
-
-      if (!this.figmaFileKey) {
-        this.connectionStatus = 'not_configured';
-        this.renderStatus();
-        return;
-      }
-
-      // Test connection by calling sync with dry-run check
-      // Note: Backend checks for FIGMA_TOKEN env variable
-      statusContent.innerHTML = ComponentHelpers.renderLoading('Checking Figma connection...');
-
-      try {
-        // Try to get Figma file info (will fail if token not configured)
-        const result = await toolBridge.syncFigma(this.figmaFileKey);
-
-        if (result && result.tokens) {
-          this.connectionStatus = 'connected';
-          this.lastSync = new Date();
-        } else {
-          this.connectionStatus = 'error';
-        }
-      } catch (error) {
-        // Token not configured on backend
-        if (error.message.includes('FIGMA_TOKEN')) {
-          this.connectionStatus = 'token_missing';
-        } else {
-          this.connectionStatus = 'error';
-        }
-        console.error('Figma connection check failed:', error);
-      }
-
-      this.renderStatus();
-    } catch (error) {
-      console.error('Failed to check Figma configuration:', error);
-      statusContent.innerHTML = ComponentHelpers.renderError('Failed to check configuration', error);
-    }
-  }
-
-  setupEventListeners() {
-    // Configure button
-    const configureBtn = this.querySelector('#figma-configure-btn');
-    if (configureBtn) {
-      configureBtn.addEventListener('click', () => this.showConfiguration());
-    }
-
-    // Sync button
-    const syncBtn = this.querySelector('#figma-sync-btn');
-    if (syncBtn) {
-      syncBtn.addEventListener('click', () => this.syncFromFigma());
-    }
-  }
-
-  showConfiguration() {
-    this.isConfiguring = true;
-    this.renderStatus();
-
-    // Setup save handler
-    const saveBtn = this.querySelector('#figma-save-config-btn');
-    const cancelBtn = this.querySelector('#figma-cancel-config-btn');
-
-    if (saveBtn) {
-      saveBtn.addEventListener('click', () => this.saveConfiguration());
-    }
-
-    if (cancelBtn) {
-      cancelBtn.addEventListener('click', () => {
-        this.isConfiguring = false;
-        this.renderStatus();
-      });
-    }
-  }
-
-  async saveConfiguration() {
-    const fileKeyInput = this.querySelector('#figma-file-key-input');
-    const tokenInput = this.querySelector('#figma-token-input');
-
-    if (!fileKeyInput || !tokenInput) return;
-
-    const fileKey = fileKeyInput.value.trim();
-    const token = tokenInput.value.trim();
-
-    if (!fileKey) {
-      ComponentHelpers.showToast?.('Please enter a Figma file key', 'error');
-      return;
-    }
-
-    if (!token) {
-      ComponentHelpers.showToast?.('Please enter a Figma access token', 'error');
-      return;
-    }
-
-    try {
-      // Store file key in localStorage (client-side)
-      localStorage.setItem('figma_file_key', fileKey);
-      this.figmaFileKey = fileKey;
-
-      // Display warning about backend token configuration
-      ComponentHelpers.showToast?.('File key saved. Please configure FIGMA_TOKEN environment variable on the backend.', 'info');
-
-      this.isConfiguring = false;
-      this.connectionStatus = 'token_missing';
-      this.renderStatus();
-    } catch (error) {
-      console.error('Failed to save Figma configuration:', error);
-      ComponentHelpers.showToast?.(`Failed to save configuration: ${error.message}`, 'error');
-    }
-  }
-
-  async syncFromFigma() {
-    if (this.isSyncing || !this.figmaFileKey) return;
-
-    this.isSyncing = true;
-    const syncBtn = this.querySelector('#figma-sync-btn');
-
-    if (syncBtn) {
-      syncBtn.disabled = true;
-      syncBtn.textContent = '🔄 Syncing...';
-    }
-
-    try {
-      const result = await toolBridge.syncFigma(this.figmaFileKey);
-
-      if (result && result.tokens) {
-        this.lastSync = new Date();
-        this.connectionStatus = 'connected';
-
-        ComponentHelpers.showToast?.(
-          `Synced ${Object.keys(result.tokens).length} tokens from Figma`,
-          'success'
-        );
-
-        this.renderStatus();
-      } else {
-        throw new Error('No tokens returned from Figma');
-      }
-    } catch (error) {
-      console.error('Failed to sync from Figma:', error);
-      ComponentHelpers.showToast?.(`Sync failed: ${error.message}`, 'error');
-      this.connectionStatus = 'error';
-      this.renderStatus();
-    } finally {
-      this.isSyncing = false;
-      if (syncBtn) {
-        syncBtn.disabled = false;
-        syncBtn.textContent = '🔄 Sync Now';
-      }
-    }
-  }
-
-  getStatusBadge() {
-    const badges = {
-      connected: ComponentHelpers.createBadge('Connected', 'success'),
-      not_configured: ComponentHelpers.createBadge('Not Configured', 'info'),
-      token_missing: ComponentHelpers.createBadge('Token Required', 'warning'),
-      error: ComponentHelpers.createBadge('Error', 'error'),
-      unknown: ComponentHelpers.createBadge('Unknown', 'info')
-    };
-
-    return badges[this.connectionStatus] || badges.unknown;
-  }
-
-  renderStatus() {
-    const statusContent = this.querySelector('#figma-status-content');
-    if (!statusContent) return;
-
-    // Configuration form
-    if (this.isConfiguring) {
-      statusContent.innerHTML = `
-        <div style="padding: 16px; background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px;">
-          <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Configure Figma Integration</h4>
-
-          <div style="margin-bottom: 12px;">
-            <label style="display: block; font-size: 11px; margin-bottom: 4px; color: var(--vscode-text-dim);">
-              Figma File Key
-            </label>
-            <input
-              type="text"
-              id="figma-file-key-input"
-              class="input"
-              placeholder="e.g., abc123xyz456"
-              value="${ComponentHelpers.escapeHtml(this.figmaFileKey || '')}"
-              style="width: 100%; font-size: 11px; font-family: 'Courier New', monospace;"
-            />
-            <div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 4px;">
-              Find this in your Figma file URL: figma.com/file/<strong>FILE_KEY</strong>/...
-            </div>
-          </div>
-
-          <div style="margin-bottom: 16px;">
-            <label style="display: block; font-size: 11px; margin-bottom: 4px; color: var(--vscode-text-dim);">
-              Figma Access Token
-            </label>
-            <input
-              type="password"
-              id="figma-token-input"
-              class="input"
-              placeholder="figd_..."
-              style="width: 100%; font-size: 11px; font-family: 'Courier New', monospace;"
-            />
-            <div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 4px;">
-              Generate at: <a href="https://www.figma.com/developers/api#access-tokens" target="_blank" style="color: var(--vscode-accent);">figma.com/developers/api</a>
-            </div>
-          </div>
-
-          <div style="padding: 12px; background-color: rgba(255, 191, 0, 0.1); border-radius: 4px; margin-bottom: 16px;">
-            <div style="font-size: 11px; color: #ffbf00;">
-              ⚠️ <strong>Security Note:</strong> The Figma token must be configured as the <code>FIGMA_TOKEN</code> environment variable on the backend server. This UI only stores the file key locally.
-            </div>
-          </div>
-
-          <div style="display: flex; gap: 8px; justify-content: flex-end;">
-            <button id="figma-cancel-config-btn" class="button" style="padding: 6px 12px; font-size: 11px;">
-              Cancel
-            </button>
-            <button id="figma-save-config-btn" class="button" style="padding: 6px 12px; font-size: 11px;">
-              Save Configuration
-            </button>
-          </div>
-        </div>
-      `;
-      return;
-    }
-
-    // Not configured state
-    if (this.connectionStatus === 'not_configured') {
-      statusContent.innerHTML = `
-        <div style="text-align: center; padding: 32px;">
-          <div style="font-size: 48px; margin-bottom: 16px;">🎨</div>
-          <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">Figma Not Configured</h3>
-          <p style="font-size: 12px; color: var(--vscode-text-dim); margin-bottom: 16px;">
-            Connect your Figma file to sync design tokens automatically.
-          </p>
-          <button id="figma-configure-btn" class="button" style="padding: 8px 16px; font-size: 12px;">
-            Configure Figma
-          </button>
-        </div>
-      `;
-
-      const configureBtn = statusContent.querySelector('#figma-configure-btn');
-      if (configureBtn) {
-        configureBtn.addEventListener('click', () => this.showConfiguration());
-      }
-      return;
-    }
-
-    // Token missing state
-    if (this.connectionStatus === 'token_missing') {
-      statusContent.innerHTML = `
-        <div style="padding: 16px; background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px;">
-          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-            <h4 style="font-size: 12px; font-weight: 600;">Figma Configuration</h4>
-            ${this.getStatusBadge()}
-          </div>
-
-          <div style="padding: 12px; background-color: rgba(255, 191, 0, 0.1); border: 1px solid #ffbf00; border-radius: 4px; margin-bottom: 12px;">
-            <div style="font-size: 11px; color: #ffbf00;">
-              ⚠️ <strong>Backend Configuration Required</strong><br/>
-              Please set the <code>FIGMA_TOKEN</code> environment variable on the backend server and restart.
-            </div>
-          </div>
-
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px;">
-            <strong>File Key:</strong> <code style="background-color: var(--vscode-bg); padding: 2px 6px; border-radius: 2px;">${ComponentHelpers.escapeHtml(this.figmaFileKey || 'N/A')}</code>
-          </div>
-
-          <div style="display: flex; gap: 8px; margin-top: 12px;">
-            <button id="figma-configure-btn" class="button" style="padding: 4px 12px; font-size: 11px; flex: 1;">
-              Reconfigure
-            </button>
-          </div>
-        </div>
-      `;
-
-      const configureBtn = statusContent.querySelector('#figma-configure-btn');
-      if (configureBtn) {
-        configureBtn.addEventListener('click', () => this.showConfiguration());
-      }
-      return;
-    }
-
-    // Connected state
-    if (this.connectionStatus === 'connected') {
-      statusContent.innerHTML = `
-        <div style="padding: 16px; background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px;">
-          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-            <h4 style="font-size: 12px; font-weight: 600;">Figma Sync</h4>
-            ${this.getStatusBadge()}
-          </div>
-
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px;">
-            <strong>File Key:</strong> <code style="background-color: var(--vscode-bg); padding: 2px 6px; border-radius: 2px;">${ComponentHelpers.escapeHtml(this.figmaFileKey || 'N/A')}</code>
-          </div>
-
-          ${this.lastSync ? `
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 12px;">
-              <strong>Last Sync:</strong> ${ComponentHelpers.formatRelativeTime(this.lastSync)}
-            </div>
-          ` : ''}
-
-          <div style="display: flex; gap: 8px; margin-top: 12px;">
-            <button id="figma-sync-btn" class="button" style="padding: 4px 12px; font-size: 11px; flex: 1;">
-              🔄 Sync Now
-            </button>
-            <button id="figma-configure-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-              ⚙️
-            </button>
-          </div>
-        </div>
-      `;
-
-      const syncBtn = statusContent.querySelector('#figma-sync-btn');
-      const configureBtn = statusContent.querySelector('#figma-configure-btn');
-
-      if (syncBtn) {
-        syncBtn.addEventListener('click', () => this.syncFromFigma());
-      }
-
-      if (configureBtn) {
-        configureBtn.addEventListener('click', () => this.showConfiguration());
-      }
-      return;
-    }
-
-    // Error state
-    if (this.connectionStatus === 'error') {
-      statusContent.innerHTML = `
-        <div style="padding: 16px; background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px;">
-          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-            <h4 style="font-size: 12px; font-weight: 600;">Figma Sync</h4>
-            ${this.getStatusBadge()}
-          </div>
-
-          <div style="padding: 12px; background-color: rgba(244, 135, 113, 0.1); border: 1px solid #f48771; border-radius: 4px; margin-bottom: 12px;">
-            <div style="font-size: 11px; color: #f48771;">
-              ❌ Failed to connect to Figma. Please check your configuration.
-            </div>
-          </div>
-
-          <div style="display: flex; gap: 8px;">
-            <button id="figma-configure-btn" class="button" style="padding: 4px 12px; font-size: 11px; flex: 1;">
-              Reconfigure
-            </button>
-            <button id="figma-sync-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-              Retry
-            </button>
-          </div>
-        </div>
-      `;
-
-      const configureBtn = statusContent.querySelector('#figma-configure-btn');
-      const syncBtn = statusContent.querySelector('#figma-sync-btn');
-
-      if (configureBtn) {
-        configureBtn.addEventListener('click', () => this.showConfiguration());
-      }
-
-      if (syncBtn) {
-        syncBtn.addEventListener('click', () => this.checkConfiguration());
-      }
-    }
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 16px; height: 100%; display: flex; flex-direction: column;">
-        <div id="figma-status-content" style="flex: 1;">
-          ${ComponentHelpers.renderLoading('Checking Figma configuration...')}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-figma-status', DSFigmaStatus);
-
-export default DSFigmaStatus;
diff --git a/admin-ui/js/components/tools/ds-metrics-panel.js b/admin-ui/js/components/tools/ds-metrics-panel.js
deleted file mode 100644
index cb2e556..0000000
--- a/admin-ui/js/components/tools/ds-metrics-panel.js
+++ /dev/null
@@ -1,178 +0,0 @@
-/**
- * ds-metrics-panel.js
- * Universal metrics panel showing tool execution stats and activity
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSMetricsPanel extends HTMLElement {
-  constructor() {
-    super();
-    this.metrics = {
-      totalExecutions: 0,
-      successCount: 0,
-      errorCount: 0,
-      recentActivity: []
-    };
-    this.refreshInterval = null;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.startAutoRefresh();
-  }
-
-  disconnectedCallback() {
-    this.stopAutoRefresh();
-  }
-
-  render() {
-    const successRate = this.metrics.totalExecutions > 0
-      ? Math.round((this.metrics.successCount / this.metrics.totalExecutions) * 100)
-      : 0;
-
-    this.innerHTML = `
-      <div style="padding: 16px;">
-        <div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px;">
-          <!-- Total Executions Card -->
-          <div style="
-            background-color: var(--vscode-sidebar);
-            border: 1px solid var(--vscode-border);
-            border-radius: 4px;
-            padding: 12px;
-          ">
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">
-              TOTAL EXECUTIONS
-            </div>
-            <div style="font-size: 24px; font-weight: 600;">
-              ${this.metrics.totalExecutions}
-            </div>
-          </div>
-
-          <!-- Success Rate Card -->
-          <div style="
-            background-color: var(--vscode-sidebar);
-            border: 1px solid var(--vscode-border);
-            border-radius: 4px;
-            padding: 12px;
-          ">
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">
-              SUCCESS RATE
-            </div>
-            <div style="font-size: 24px; font-weight: 600; color: ${successRate >= 80 ? '#4caf50' : successRate >= 50 ? '#ff9800' : '#f44336'};">
-              ${successRate}%
-            </div>
-          </div>
-
-          <!-- Error Count Card -->
-          <div style="
-            background-color: var(--vscode-sidebar);
-            border: 1px solid var(--vscode-border);
-            border-radius: 4px;
-            padding: 12px;
-          ">
-            <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">
-              ERRORS
-            </div>
-            <div style="font-size: 24px; font-weight: 600; color: ${this.metrics.errorCount > 0 ? '#f44336' : 'inherit'};">
-              ${this.metrics.errorCount}
-            </div>
-          </div>
-        </div>
-
-        <!-- Recent Activity -->
-        <div>
-          <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px;">
-            Recent Activity
-          </div>
-          <div style="
-            background-color: var(--vscode-bg);
-            border: 1px solid var(--vscode-border);
-            border-radius: 4px;
-            max-height: 200px;
-            overflow-y: auto;
-          ">
-            ${this.metrics.recentActivity.length === 0 ? `
-              <div style="padding: 16px; text-align: center; color: var(--vscode-text-dim); font-size: 12px;">
-                No recent activity
-              </div>
-            ` : this.metrics.recentActivity.map(activity => `
-              <div style="
-                padding: 8px 12px;
-                border-bottom: 1px solid var(--vscode-border);
-                font-size: 12px;
-                display: flex;
-                justify-content: space-between;
-                align-items: center;
-              ">
-                <div>
-                  <span style="color: ${activity.success ? '#4caf50' : '#f44336'};">
-                    ${activity.success ? '✓' : '✗'}
-                  </span>
-                  <span style="margin-left: 8px;">${activity.toolName}</span>
-                </div>
-                <span style="color: var(--vscode-text-dim); font-size: 11px;">
-                  ${activity.timestamp}
-                </span>
-              </div>
-            `).join('')}
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  recordExecution(toolName, success = true) {
-    this.metrics.totalExecutions++;
-    if (success) {
-      this.metrics.successCount++;
-    } else {
-      this.metrics.errorCount++;
-    }
-
-    // Add to recent activity
-    const now = new Date();
-    const timestamp = now.toLocaleTimeString();
-
-    this.metrics.recentActivity.unshift({
-      toolName,
-      success,
-      timestamp
-    });
-
-    // Keep only last 10 activities
-    if (this.metrics.recentActivity.length > 10) {
-      this.metrics.recentActivity = this.metrics.recentActivity.slice(0, 10);
-    }
-
-    this.render();
-  }
-
-  startAutoRefresh() {
-    // Refresh metrics every 5 seconds
-    this.refreshInterval = setInterval(() => {
-      this.render();
-    }, 5000);
-  }
-
-  stopAutoRefresh() {
-    if (this.refreshInterval) {
-      clearInterval(this.refreshInterval);
-      this.refreshInterval = null;
-    }
-  }
-
-  reset() {
-    this.metrics = {
-      totalExecutions: 0,
-      successCount: 0,
-      errorCount: 0,
-      recentActivity: []
-    };
-    this.render();
-  }
-}
-
-customElements.define('ds-metrics-panel', DSMetricsPanel);
-
-export default DSMetricsPanel;
diff --git a/admin-ui/js/components/tools/ds-navigation-demos.js b/admin-ui/js/components/tools/ds-navigation-demos.js
deleted file mode 100644
index 1fb4fae..0000000
--- a/admin-ui/js/components/tools/ds-navigation-demos.js
+++ /dev/null
@@ -1,213 +0,0 @@
-/**
- * ds-navigation-demos.js
- * Gallery of generated HTML navigation flow demos
- * UX Team Tool #5
- */
-
-import { createGalleryView, setupGalleryHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-
-class DSNavigationDemos extends HTMLElement {
-  constructor() {
-    super();
-    this.demos = [];
-    this.isLoading = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.loadDemos();
-  }
-
-  setupEventListeners() {
-    const generateBtn = this.querySelector('#generate-demo-btn');
-    if (generateBtn) {
-      generateBtn.addEventListener('click', () => this.generateDemo());
-    }
-  }
-
-  async loadDemos() {
-    this.isLoading = true;
-    const container = this.querySelector('#demos-container');
-    if (container) {
-      container.innerHTML = ComponentHelpers.renderLoading('Loading navigation demos...');
-    }
-
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Load cached demos
-      const cached = localStorage.getItem(`nav_demos_${context.project_id}`);
-      if (cached) {
-        this.demos = JSON.parse(cached);
-      } else {
-        this.demos = [];
-      }
-
-      this.renderDemoGallery();
-    } catch (error) {
-      console.error('[DSNavigationDemos] Failed to load demos:', error);
-      if (container) {
-        container.innerHTML = ComponentHelpers.renderError('Failed to load demos', error);
-      }
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  async generateDemo() {
-    const flowNameInput = this.querySelector('#flow-name-input');
-    const flowName = flowNameInput?.value.trim() || '';
-
-    if (!flowName) {
-      ComponentHelpers.showToast?.('Please enter a flow name', 'error');
-      return;
-    }
-
-    const generateBtn = this.querySelector('#generate-demo-btn');
-    if (generateBtn) {
-      generateBtn.disabled = true;
-      generateBtn.textContent = '⏳ Generating...';
-    }
-
-    try {
-      const context = contextStore.getMCPContext();
-
-      // Call navigation generation API
-      const response = await fetch('/api/navigation/generate', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          projectId: context.project_id,
-          flowName
-        })
-      });
-
-      if (!response.ok) {
-        throw new Error(`Generation failed: ${response.statusText}`);
-      }
-
-      const result = await response.json();
-
-      // Add to demos
-      const demo = {
-        id: Date.now().toString(),
-        name: flowName,
-        url: result.url,
-        thumbnailUrl: result.thumbnailUrl,
-        timestamp: new Date().toISOString()
-      };
-
-      this.demos.unshift(demo);
-
-      // Cache demos
-      if (context.project_id) {
-        localStorage.setItem(`nav_demos_${context.project_id}`, JSON.stringify(this.demos));
-      }
-
-      this.renderDemoGallery();
-      ComponentHelpers.showToast?.(`Demo generated: ${flowName}`, 'success');
-
-      // Clear input
-      if (flowNameInput) {
-        flowNameInput.value = '';
-      }
-    } catch (error) {
-      console.error('[DSNavigationDemos] Generation failed:', error);
-      ComponentHelpers.showToast?.(`Generation failed: ${error.message}`, 'error');
-    } finally {
-      if (generateBtn) {
-        generateBtn.disabled = false;
-        generateBtn.textContent = '✨ Generate Demo';
-      }
-    }
-  }
-
-  renderDemoGallery() {
-    const container = this.querySelector('#demos-container');
-    if (!container) return;
-
-    const config = {
-      title: 'Navigation Flow Demos',
-      items: this.demos.map(demo => ({
-        id: demo.id,
-        src: demo.thumbnailUrl,
-        title: demo.name,
-        subtitle: ComponentHelpers.formatRelativeTime(new Date(demo.timestamp))
-      })),
-      onItemClick: (item) => this.viewDemo(item),
-      onDelete: (item) => this.deleteDemo(item)
-    };
-
-    container.innerHTML = createGalleryView(config);
-    setupGalleryHandlers(container, config);
-  }
-
-  viewDemo(item) {
-    const demo = this.demos.find(d => d.id === item.id);
-    if (demo && demo.url) {
-      window.open(demo.url, '_blank');
-    }
-  }
-
-  deleteDemo(item) {
-    this.demos = this.demos.filter(d => d.id !== item.id);
-
-    // Update cache
-    const context = contextStore.getMCPContext();
-    if (context.project_id) {
-      localStorage.setItem(`nav_demos_${context.project_id}`, JSON.stringify(this.demos));
-    }
-
-    this.renderDemoGallery();
-    ComponentHelpers.showToast?.(`Deleted ${item.title}`, 'success');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Generator Panel -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Generate Navigation Demo</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px;">
-                Flow Name
-              </label>
-              <input
-                type="text"
-                id="flow-name-input"
-                placeholder="e.g., User Onboarding, Checkout Process"
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <button id="generate-demo-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              ✨ Generate Demo
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; font-size: 10px; color: var(--vscode-text-dim);">
-            💡 Generates interactive HTML demos of navigation flows
-          </div>
-        </div>
-
-        <!-- Demos Gallery -->
-        <div id="demos-container" style="flex: 1; overflow: hidden;">
-          ${ComponentHelpers.renderLoading('Loading demos...')}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-navigation-demos', DSNavigationDemos);
-
-export default DSNavigationDemos;
diff --git a/admin-ui/js/components/tools/ds-network-monitor.js b/admin-ui/js/components/tools/ds-network-monitor.js
deleted file mode 100644
index 333dbf2..0000000
--- a/admin-ui/js/components/tools/ds-network-monitor.js
+++ /dev/null
@@ -1,472 +0,0 @@
-/**
- * ds-network-monitor.js
- * Network request monitoring and debugging
- *
- * REFACTORED: DSS-compliant version using DSBaseTool + table-template.js
- * - Extends DSBaseTool for Shadow DOM, AbortController, and standardized lifecycle
- * - Uses table-template.js for DSS-compliant table rendering (NO inline events/styles)
- * - Event delegation pattern for all interactions
- * - Logger utility instead of console.*
- *
- * Reference: .knowledge/dss-coding-standards.json
- */
-
-import DSBaseTool from '../base/ds-base-tool.js';
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import { logger } from '../../utils/logger.js';
-import { createTableView, setupTableEvents, createStatsCard } from '../../templates/table-template.js';
-
-class DSNetworkMonitor extends DSBaseTool {
-  constructor() {
-    super();
-    this.requests = [];
-    this.filteredRequests = [];
-    this.filterUrl = '';
-    this.filterType = 'all';
-    this.autoRefresh = false;
-    this.refreshInterval = null;
-  }
-
-  connectedCallback() {
-    super.connectedCallback();
-    this.loadRequests();
-  }
-
-  disconnectedCallback() {
-    if (this.refreshInterval) {
-      clearInterval(this.refreshInterval);
-    }
-    super.disconnectedCallback();
-  }
-
-  /**
-   * Render the component (required by DSBaseTool)
-   */
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: block;
-          height: 100%;
-        }
-
-        .network-monitor-container {
-          padding: 16px;
-          height: 100%;
-          display: flex;
-          flex-direction: column;
-        }
-
-        .filter-controls {
-          margin-bottom: 16px;
-          display: flex;
-          gap: 12px;
-          align-items: center;
-          flex-wrap: wrap;
-        }
-
-        .filter-input {
-          flex: 1;
-          min-width: 200px;
-          padding: 6px 8px;
-          font-size: 12px;
-          background: var(--vscode-input-background);
-          color: var(--vscode-input-foreground);
-          border: 1px solid var(--vscode-input-border);
-          border-radius: 2px;
-        }
-
-        .filter-input:focus {
-          outline: 1px solid var(--vscode-focusBorder);
-        }
-
-        .filter-select {
-          width: 150px;
-          padding: 6px 8px;
-          font-size: 12px;
-          background: var(--vscode-input-background);
-          color: var(--vscode-input-foreground);
-          border: 1px solid var(--vscode-input-border);
-          border-radius: 2px;
-        }
-
-        .auto-refresh-label {
-          display: flex;
-          align-items: center;
-          gap: 6px;
-          font-size: 12px;
-          color: var(--vscode-foreground);
-          cursor: pointer;
-        }
-
-        .refresh-btn {
-          padding: 6px 12px;
-          font-size: 11px;
-          background: var(--vscode-button-background);
-          color: var(--vscode-button-foreground);
-          border: none;
-          border-radius: 2px;
-          cursor: pointer;
-          transition: background 0.15s ease;
-        }
-
-        .refresh-btn:hover {
-          background: var(--vscode-button-hoverBackground);
-        }
-
-        .content-wrapper {
-          flex: 1;
-          overflow: auto;
-        }
-
-        .loading {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          color: var(--vscode-descriptionForeground);
-        }
-
-        .loading-spinner {
-          font-size: 32px;
-          margin-bottom: 12px;
-          animation: spin 1s linear infinite;
-        }
-
-        @keyframes spin {
-          from { transform: rotate(0deg); }
-          to { transform: rotate(360deg); }
-        }
-
-        /* Badge styles */
-        .badge {
-          display: inline-block;
-          padding: 2px 6px;
-          border-radius: 3px;
-          font-size: 10px;
-          font-weight: 600;
-        }
-
-        .badge-info {
-          background: rgba(75, 181, 211, 0.2);
-          color: #4bb5d3;
-        }
-
-        .badge-success {
-          background: rgba(137, 209, 133, 0.2);
-          color: #89d185;
-        }
-
-        .badge-warning {
-          background: rgba(206, 145, 120, 0.2);
-          color: #ce9178;
-        }
-
-        .badge-error {
-          background: rgba(244, 135, 113, 0.2);
-          color: #f48771;
-        }
-
-        .code {
-          font-family: 'Courier New', monospace;
-          word-break: break-all;
-        }
-
-        .hint {
-          margin-top: 12px;
-          padding: 8px;
-          background-color: var(--vscode-sideBar-background);
-          border-radius: 4px;
-          font-size: 10px;
-          color: var(--vscode-descriptionForeground);
-        }
-
-        .info-count {
-          margin-bottom: 12px;
-          padding: 12px;
-          background-color: var(--vscode-sideBar-background);
-          border-radius: 4px;
-          font-size: 11px;
-          color: var(--vscode-descriptionForeground);
-        }
-      </style>
-
-      <div class="network-monitor-container">
-        <!-- Filter Controls -->
-        <div class="filter-controls">
-          <input
-            type="text"
-            id="network-filter"
-            placeholder="Filter by URL or method..."
-            class="filter-input"
-          />
-          <select id="network-type-filter" class="filter-select">
-            <option value="all">All Types</option>
-          </select>
-          <label class="auto-refresh-label">
-            <input type="checkbox" id="auto-refresh-toggle" />
-            Auto-refresh
-          </label>
-          <button
-            id="network-refresh-btn"
-            data-action="refresh"
-            class="refresh-btn"
-            type="button"
-            aria-label="Refresh network requests">
-            🔄 Refresh
-          </button>
-        </div>
-
-        <!-- Content -->
-        <div class="content-wrapper" id="network-content">
-          <div class="loading">
-            <div class="loading-spinner">⏳</div>
-            <div>Initializing...</div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  /**
-   * Setup event listeners (required by DSBaseTool)
-   */
-  setupEventListeners() {
-    // EVENT-002: Event delegation
-    this.delegateEvents('.network-monitor-container', 'click', (action, e) => {
-      if (action === 'refresh') {
-        this.loadRequests();
-      }
-    });
-
-    // Filter input with debounce
-    const filterInput = this.$('#network-filter');
-    if (filterInput) {
-      const debouncedFilter = ComponentHelpers.debounce((term) => {
-        this.filterUrl = term.toLowerCase();
-        this.applyFilters();
-      }, 300);
-
-      this.bindEvent(filterInput, 'input', (e) => debouncedFilter(e.target.value));
-    }
-
-    // Type filter
-    const typeFilter = this.$('#network-type-filter');
-    if (typeFilter) {
-      this.bindEvent(typeFilter, 'change', (e) => {
-        this.filterType = e.target.value;
-        this.applyFilters();
-      });
-    }
-
-    // Auto-refresh toggle
-    const autoRefreshToggle = this.$('#auto-refresh-toggle');
-    if (autoRefreshToggle) {
-      this.bindEvent(autoRefreshToggle, 'change', (e) => {
-        this.autoRefresh = e.target.checked;
-        if (this.autoRefresh) {
-          this.refreshInterval = setInterval(() => this.loadRequests(), 2000);
-          logger.debug('[DSNetworkMonitor] Auto-refresh enabled');
-        } else {
-          if (this.refreshInterval) {
-            clearInterval(this.refreshInterval);
-            this.refreshInterval = null;
-            logger.debug('[DSNetworkMonitor] Auto-refresh disabled');
-          }
-        }
-      });
-    }
-  }
-
-  async loadRequests() {
-    const content = this.$('#network-content');
-    if (!content) return;
-
-    // Only show loading on first load
-    if (this.requests.length === 0) {
-      content.innerHTML = '<div class="loading"><div class="loading-spinner">⏳</div><div>Loading network requests...</div></div>';
-    }
-
-    try {
-      const result = await toolBridge.getNetworkRequests(null, 100);
-
-      if (result && result.requests) {
-        this.requests = result.requests;
-        this.updateTypeFilter();
-        this.applyFilters();
-        logger.debug('[DSNetworkMonitor] Loaded requests', { count: this.requests.length });
-      } else {
-        this.requests = [];
-        content.innerHTML = '<div class="table-empty"><div class="table-empty-icon">🌐</div><div class="table-empty-text">No network requests captured</div></div>';
-      }
-    } catch (error) {
-      logger.error('[DSNetworkMonitor] Failed to load network requests', error);
-      content.innerHTML = ComponentHelpers.renderError('Failed to load network requests', error);
-    }
-  }
-
-  updateTypeFilter() {
-    const typeFilter = this.$('#network-type-filter');
-    if (!typeFilter) return;
-
-    const types = this.getResourceTypes();
-    const currentValue = typeFilter.value;
-
-    typeFilter.innerHTML = `
-      <option value="all">All Types</option>
-      ${types.map(type => `<option value="${type}" ${type === currentValue ? 'selected' : ''}>${type}</option>`).join('')}
-    `;
-  }
-
-  applyFilters() {
-    let filtered = [...this.requests];
-
-    // Filter by URL
-    if (this.filterUrl) {
-      filtered = filtered.filter(req =>
-        req.url.toLowerCase().includes(this.filterUrl) ||
-        req.method.toLowerCase().includes(this.filterUrl)
-      );
-    }
-
-    // Filter by type
-    if (this.filterType !== 'all') {
-      filtered = filtered.filter(req => req.resourceType === this.filterType);
-    }
-
-    this.filteredRequests = filtered;
-    this.renderRequests();
-  }
-
-  getResourceTypes() {
-    if (!this.requests) return [];
-    const types = new Set(this.requests.map(r => r.resourceType).filter(Boolean));
-    return Array.from(types).sort();
-  }
-
-  getStatusColor(status) {
-    if (status >= 200 && status < 300) return 'success';
-    if (status >= 300 && status < 400) return 'info';
-    if (status >= 400 && status < 500) return 'warning';
-    if (status >= 500) return 'error';
-    return 'info';
-  }
-
-  renderRequests() {
-    const content = this.$('#network-content');
-    if (!content) return;
-
-    if (!this.filteredRequests || this.filteredRequests.length === 0) {
-      content.innerHTML = `
-        <div class="table-empty">
-          <div class="table-empty-icon">🔍</div>
-          <div class="table-empty-text">${this.filterUrl ? 'No requests match your filter' : 'No network requests captured yet'}</div>
-        </div>
-      `;
-      return;
-    }
-
-    // Render info count
-    const infoHtml = `
-      <div class="info-count">
-        Showing ${this.filteredRequests.length} of ${this.requests.length} requests
-        ${this.autoRefresh ? '• Auto-refreshing every 2s' : ''}
-      </div>
-    `;
-
-    // Use table-template.js for DSS-compliant rendering
-    const { html: tableHtml, styles: tableStyles } = createTableView({
-      columns: [
-        { header: 'Method', key: 'method', width: '80px', align: 'left' },
-        { header: 'Status', key: 'status', width: '80px', align: 'left' },
-        { header: 'URL', key: 'url', align: 'left' },
-        { header: 'Type', key: 'resourceType', width: '100px', align: 'left' },
-        { header: 'Time', key: 'timing', width: '80px', align: 'left' }
-      ],
-      rows: this.filteredRequests,
-      renderCell: (col, row) => this.renderCell(col, row),
-      renderDetails: (row) => this.renderDetails(row),
-      emptyMessage: 'No network requests',
-      emptyIcon: '🌐'
-    });
-
-    // Adopt table styles
-    this.adoptStyles(tableStyles);
-
-    // Render table
-    content.innerHTML = infoHtml + tableHtml + '<div class="hint">💡 Click any row to view full request details</div>';
-
-    // Setup table event handlers
-    setupTableEvents(this.shadowRoot);
-
-    logger.debug('[DSNetworkMonitor] Rendered requests', { count: this.filteredRequests.length });
-  }
-
-  renderCell(col, row) {
-    const method = row.method || 'GET';
-    const status = row.status || '-';
-    const statusColor = this.getStatusColor(status);
-    const resourceType = row.resourceType || 'other';
-    const url = row.url || 'Unknown URL';
-    const timing = row.timing ? `${Math.round(row.timing)}ms` : '-';
-
-    switch (col.key) {
-      case 'method':
-        const methodColor = method === 'GET' ? 'info' : method === 'POST' ? 'success' : 'warning';
-        return `<span class="badge badge-${methodColor}">${this.escapeHtml(method)}</span>`;
-
-      case 'status':
-        return `<span class="badge badge-${statusColor}">${this.escapeHtml(String(status))}</span>`;
-
-      case 'url':
-        return `<span class="code" style="max-width: 400px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block;">${this.escapeHtml(url)}</span>`;
-
-      case 'resourceType':
-        return `<span class="badge badge-info">${this.escapeHtml(resourceType)}</span>`;
-
-      case 'timing':
-        return `<span style="color: var(--vscode-descriptionForeground);">${timing}</span>`;
-
-      default:
-        return this.escapeHtml(String(row[col.key] || '-'));
-    }
-  }
-
-  renderDetails(row) {
-    const method = row.method || 'GET';
-    const status = row.status || '-';
-    const url = row.url || 'Unknown URL';
-    const resourceType = row.resourceType || 'other';
-
-    return `
-      <div style="margin-bottom: 8px;">
-        <span class="detail-label">URL:</span>
-        <span class="detail-value code">${this.escapeHtml(url)}</span>
-      </div>
-      <div style="margin-bottom: 8px;">
-        <span class="detail-label">Method:</span>
-        <span class="detail-value code">${this.escapeHtml(method)}</span>
-      </div>
-      <div style="margin-bottom: 8px;">
-        <span class="detail-label">Status:</span>
-        <span class="detail-value code">${this.escapeHtml(String(status))}</span>
-      </div>
-      <div style="margin-bottom: 8px;">
-        <span class="detail-label">Type:</span>
-        <span class="detail-value code">${this.escapeHtml(resourceType)}</span>
-      </div>
-      ${row.headers ? `
-        <div style="margin-top: 12px;">
-          <div class="detail-label" style="display: block; margin-bottom: 4px;">Headers:</div>
-          <pre class="detail-code">${this.escapeHtml(JSON.stringify(row.headers, null, 2))}</pre>
-        </div>
-      ` : ''}
-    `;
-  }
-}
-
-customElements.define('ds-network-monitor', DSNetworkMonitor);
-
-export default DSNetworkMonitor;
diff --git a/admin-ui/js/components/tools/ds-project-analysis.js b/admin-ui/js/components/tools/ds-project-analysis.js
deleted file mode 100644
index 7ca5f2b..0000000
--- a/admin-ui/js/components/tools/ds-project-analysis.js
+++ /dev/null
@@ -1,268 +0,0 @@
-/**
- * ds-project-analysis.js
- * Project analysis results viewer showing token usage, component adoption, etc.
- * UI Team Tool #4
- */
-
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSProjectAnalysis extends HTMLElement {
-  constructor() {
-    super();
-    this.analysisResults = null;
-    this.isAnalyzing = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.loadCachedResults();
-  }
-
-  async loadCachedResults() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) return;
-
-      const cached = localStorage.getItem(`analysis_${context.project_id}`);
-      if (cached) {
-        this.analysisResults = JSON.parse(cached);
-        this.renderResults();
-      }
-    } catch (error) {
-      console.error('[DSProjectAnalysis] Failed to load cached results:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const analyzeBtn = this.querySelector('#analyze-project-btn');
-    const pathInput = this.querySelector('#project-path-input');
-
-    if (analyzeBtn) {
-      analyzeBtn.addEventListener('click', () => this.analyzeProject());
-    }
-
-    if (pathInput) {
-      pathInput.addEventListener('keypress', (e) => {
-        if (e.key === 'Enter') {
-          this.analyzeProject();
-        }
-      });
-    }
-  }
-
-  async analyzeProject() {
-    const pathInput = this.querySelector('#project-path-input');
-    const projectPath = pathInput?.value.trim() || '';
-
-    if (!projectPath) {
-      ComponentHelpers.showToast?.('Please enter a project path', 'error');
-      return;
-    }
-
-    this.isAnalyzing = true;
-    this.updateLoadingState();
-
-    try {
-      // Call dss_analyze_project MCP tool
-      const result = await toolBridge.executeTool('dss_analyze_project', {
-        path: projectPath
-      });
-
-      this.analysisResults = result;
-
-      // Cache results
-      const context = contextStore.getMCPContext();
-      if (context.project_id) {
-        localStorage.setItem(`analysis_${context.project_id}`, JSON.stringify(result));
-      }
-
-      this.renderResults();
-      ComponentHelpers.showToast?.('Project analysis complete', 'success');
-    } catch (error) {
-      console.error('[DSProjectAnalysis] Analysis failed:', error);
-      ComponentHelpers.showToast?.(`Analysis failed: ${error.message}`, 'error');
-
-      const resultsContainer = this.querySelector('#results-container');
-      if (resultsContainer) {
-        resultsContainer.innerHTML = ComponentHelpers.renderError('Project analysis failed', error);
-      }
-    } finally {
-      this.isAnalyzing = false;
-      this.updateLoadingState();
-    }
-  }
-
-  updateLoadingState() {
-    const analyzeBtn = this.querySelector('#analyze-project-btn');
-    const resultsContainer = this.querySelector('#results-container');
-
-    if (!analyzeBtn || !resultsContainer) return;
-
-    if (this.isAnalyzing) {
-      analyzeBtn.disabled = true;
-      analyzeBtn.textContent = '⏳ Analyzing...';
-      resultsContainer.innerHTML = ComponentHelpers.renderLoading('Analyzing project structure and token usage...');
-    } else {
-      analyzeBtn.disabled = false;
-      analyzeBtn.textContent = '🔍 Analyze Project';
-    }
-  }
-
-  renderResults() {
-    const resultsContainer = this.querySelector('#results-container');
-    if (!resultsContainer || !this.analysisResults) return;
-
-    const { patterns, components, tokens, dependencies } = this.analysisResults;
-
-    resultsContainer.innerHTML = `
-      <div style="padding: 16px; overflow: auto; height: 100%;">
-        <!-- Summary Cards -->
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 24px;">
-          ${this.createStatCard('Components Found', components?.length || 0, '🧩')}
-          ${this.createStatCard('Patterns Detected', patterns?.length || 0, '🎨')}
-          ${this.createStatCard('Tokens Used', Object.keys(tokens || {}).length, '🎯')}
-          ${this.createStatCard('Dependencies', dependencies?.length || 0, '📦')}
-        </div>
-
-        <!-- Patterns Section -->
-        ${patterns && patterns.length > 0 ? `
-          <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-            <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Design Patterns</h4>
-            <div style="display: flex; flex-direction: column; gap: 8px;">
-              ${patterns.map(pattern => `
-                <div style="padding: 8px; background: var(--vscode-bg); border-radius: 2px; font-size: 11px;">
-                  <div style="font-weight: 600; margin-bottom: 4px;">${ComponentHelpers.escapeHtml(pattern.name)}</div>
-                  <div style="color: var(--vscode-text-dim);">
-                    ${ComponentHelpers.escapeHtml(pattern.description)} • Used ${pattern.count} times
-                  </div>
-                </div>
-              `).join('')}
-            </div>
-          </div>
-        ` : ''}
-
-        <!-- Components Section -->
-        ${components && components.length > 0 ? `
-          <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-            <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">React Components</h4>
-            <div style="max-height: 300px; overflow-y: auto;">
-              <table style="width: 100%; font-size: 11px; border-collapse: collapse;">
-                <thead style="position: sticky; top: 0; background: var(--vscode-sidebar);">
-                  <tr>
-                    <th style="text-align: left; padding: 6px; border-bottom: 1px solid var(--vscode-border);">Component</th>
-                    <th style="text-align: left; padding: 6px; border-bottom: 1px solid var(--vscode-border);">Path</th>
-                    <th style="text-align: right; padding: 6px; border-bottom: 1px solid var(--vscode-border);">DS Adoption</th>
-                  </tr>
-                </thead>
-                <tbody>
-                  ${components.slice(0, 20).map(comp => `
-                    <tr style="border-bottom: 1px solid var(--vscode-border);">
-                      <td style="padding: 6px; font-family: monospace;">${ComponentHelpers.escapeHtml(comp.name)}</td>
-                      <td style="padding: 6px; color: var(--vscode-text-dim);">${ComponentHelpers.escapeHtml(comp.path)}</td>
-                      <td style="padding: 6px; text-align: right;">
-                        ${this.renderAdoptionBadge(comp.dsAdoption || 0)}
-                      </td>
-                    </tr>
-                  `).join('')}
-                </tbody>
-              </table>
-            </div>
-          </div>
-        ` : ''}
-
-        <!-- Token Usage Section -->
-        ${tokens && Object.keys(tokens).length > 0 ? `
-          <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-            <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Token Usage</h4>
-            <div style="display: flex; flex-wrap: wrap; gap: 8px;">
-              ${Object.entries(tokens).slice(0, 30).map(([key, count]) => `
-                <div style="padding: 4px 8px; background: var(--vscode-bg); border-radius: 2px; font-size: 10px; font-family: monospace;">
-                  ${ComponentHelpers.escapeHtml(key)} <span style="color: var(--vscode-text-dim);">(${count})</span>
-                </div>
-              `).join('')}
-            </div>
-          </div>
-        ` : ''}
-      </div>
-    `;
-  }
-
-  createStatCard(label, value, icon) {
-    return `
-      <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; text-align: center;">
-        <div style="font-size: 32px; margin-bottom: 8px;">${icon}</div>
-        <div style="font-size: 24px; font-weight: 600; margin-bottom: 4px;">${value}</div>
-        <div style="font-size: 11px; color: var(--vscode-text-dim);">${label}</div>
-      </div>
-    `;
-  }
-
-  renderAdoptionBadge(percentage) {
-    let color = '#f48771';
-    let label = 'Low';
-
-    if (percentage >= 80) {
-      color = '#89d185';
-      label = 'High';
-    } else if (percentage >= 50) {
-      color = '#ffbf00';
-      label = 'Medium';
-    }
-
-    return `<span style="padding: 2px 6px; background: ${color}; border-radius: 2px; font-size: 10px; font-weight: 600;">${label}</span>`;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Header -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Project Analysis</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Project Path
-              </label>
-              <input
-                type="text"
-                id="project-path-input"
-                placeholder="/path/to/your/project"
-                class="input"
-                style="width: 100%; font-size: 11px; font-family: monospace;"
-              />
-            </div>
-
-            <button id="analyze-project-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              🔍 Analyze Project
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; font-size: 10px; color: var(--vscode-text-dim);">
-            💡 Analyzes components, patterns, token usage, and design system adoption
-          </div>
-        </div>
-
-        <!-- Results Container -->
-        <div id="results-container" style="flex: 1; overflow: hidden;">
-          <div style="display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 48px;">
-            <div>
-              <div style="font-size: 48px; margin-bottom: 16px;">🔍</div>
-              <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">Ready to Analyze</h3>
-              <p style="font-size: 12px; color: var(--vscode-text-dim);">
-                Enter your project path above to analyze component usage and design system adoption
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-project-analysis', DSProjectAnalysis);
-
-export default DSProjectAnalysis;
diff --git a/admin-ui/js/components/tools/ds-quick-wins-script.js b/admin-ui/js/components/tools/ds-quick-wins-script.js
deleted file mode 100644
index 3445c65..0000000
--- a/admin-ui/js/components/tools/ds-quick-wins-script.js
+++ /dev/null
@@ -1,278 +0,0 @@
-/**
- * ds-quick-wins-script.js
- * Quick Wins analyzer - finds low-effort, high-impact design system improvements
- * MVP2: Identifies inconsistencies and suggests standardization opportunities
- */
-
-export default class QuickWinsScript extends HTMLElement {
-  constructor() {
-    super();
-    this.analysisResults = null;
-    this.isAnalyzing = false;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <div style="margin-bottom: 24px;">
-          <h1 style="margin: 0 0 8px 0; font-size: 24px;">Design System Quick Wins</h1>
-          <p style="margin: 0; color: var(--vscode-text-dim);">
-            Identify low-effort, high-impact improvements to your design system
-          </p>
-        </div>
-
-        <!-- Analysis Controls -->
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 24px;">
-          <div style="margin-bottom: 12px;">
-            <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 8px;">
-              What to analyze
-            </label>
-            <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 8px;">
-              <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-                <input type="checkbox" id="check-tokens" checked />
-                Design Tokens
-              </label>
-              <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-                <input type="checkbox" id="check-colors" checked />
-                Color Usage
-              </label>
-              <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-                <input type="checkbox" id="check-spacing" checked />
-                Spacing Values
-              </label>
-              <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-                <input type="checkbox" id="check-typography" checked />
-                Typography
-              </label>
-            </div>
-          </div>
-
-          <button id="analyze-btn" aria-label="Analyze design system for improvement opportunities" style="
-            width: 100%;
-            padding: 8px 16px;
-            background: var(--vscode-button-background);
-            color: var(--vscode-button-foreground);
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-weight: 500;
-            font-size: 12px;
-          ">Analyze Design System</button>
-        </div>
-
-        <!-- Loading State -->
-        <div id="loading-container" style="display: none; text-align: center; padding: 48px; background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px;">
-          <div style="font-size: 24px; margin-bottom: 12px;">⏳</div>
-          <div style="font-size: 12px; color: var(--vscode-text-dim);">
-            Analyzing design system...
-          </div>
-        </div>
-
-        <!-- Results Container -->
-        <div id="results-container" style="display: none;">
-          <!-- Results will be inserted here -->
-        </div>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    const analyzeBtn = this.querySelector('#analyze-btn');
-    if (analyzeBtn) {
-      analyzeBtn.addEventListener('click', () => this.analyzeDesignSystem());
-    }
-  }
-
-  async analyzeDesignSystem() {
-    this.isAnalyzing = true;
-    const loadingContainer = this.querySelector('#loading-container');
-    const resultsContainer = this.querySelector('#results-container');
-
-    loadingContainer.style.display = 'block';
-    resultsContainer.style.display = 'none';
-
-    // Simulate analysis
-    await new Promise(resolve => setTimeout(resolve, 1500));
-
-    this.analysisResults = this.generateAnalysisResults();
-    this.renderResults();
-
-    loadingContainer.style.display = 'none';
-    resultsContainer.style.display = 'block';
-    this.isAnalyzing = false;
-  }
-
-  generateAnalysisResults() {
-    return [
-      {
-        title: 'Consolidate Color Palette',
-        impact: 'high',
-        effort: 'low',
-        description: 'Found 23 unique colors in codebase, but only 8 are documented tokens. Consolidate to reduce cognitive load.',
-        recommendation: 'Extract 15 undocumented colors and add to token library',
-        estimate: '2 hours',
-        files_affected: 34
-      },
-      {
-        title: 'Standardize Spacing Scale',
-        impact: 'high',
-        effort: 'low',
-        description: 'Spacing values are inconsistent (4px, 6px, 8px, 12px, 16px, 20px, 24px, 32px). Reduce to 6-8 standard values.',
-        recommendation: 'Use 4px, 8px, 12px, 16px, 24px, 32px as standard spacing scale',
-        estimate: '3 hours',
-        files_affected: 67
-      },
-      {
-        title: 'Create Typography System',
-        impact: 'high',
-        effort: 'medium',
-        description: 'Typography scales vary across components. Establish consistent type hierarchy.',
-        recommendation: 'Define 5 font sizes (12px, 14px, 16px, 18px, 24px) with line-height ratios',
-        estimate: '4 hours',
-        files_affected: 45
-      },
-      {
-        title: 'Document Component Variants',
-        impact: 'medium',
-        effort: 'low',
-        description: 'Button component has 7 undocumented variants in use. Update documentation.',
-        recommendation: 'Add variant definitions and usage guidelines to Storybook',
-        estimate: '1 hour',
-        files_affected: 12
-      },
-      {
-        title: 'Establish Naming Convention',
-        impact: 'medium',
-        effort: 'low',
-        description: 'Token names are inconsistent (color-primary vs primaryColor vs primary-color).',
-        recommendation: 'Adopt kebab-case convention: color-primary, spacing-sm, font-body',
-        estimate: '2 hours',
-        files_affected: 89
-      },
-      {
-        title: 'Create Shadow System',
-        impact: 'medium',
-        effort: 'medium',
-        description: 'Shadow values are hardcoded throughout. Create reusable shadow tokens.',
-        recommendation: 'Define 3-4 elevation levels: shadow-sm, shadow-md, shadow-lg, shadow-xl',
-        estimate: '2 hours',
-        files_affected: 23
-      }
-    ];
-  }
-
-  renderResults() {
-    const container = this.querySelector('#results-container');
-
-    const results = this.analysisResults;
-    const highImpact = results.filter(r => r.impact === 'high');
-    const mediumImpact = results.filter(r => r.impact === 'medium');
-    const totalFiles = results.reduce((sum, r) => sum + r.files_affected, 0);
-
-    // Build stats efficiently
-    const statsHtml = this.buildStatsCards(results.length, highImpact.length, totalFiles);
-
-    // Build cards with memoization
-    const highImpactHtml = highImpact.map(win => this.renderWinCard(win)).join('');
-    const mediumImpactHtml = mediumImpact.map(win => this.renderWinCard(win)).join('');
-
-    let html = `
-      <div style="margin-bottom: 24px;">
-        ${statsHtml}
-      </div>
-
-      <div style="margin-bottom: 24px;">
-        <h2 style="margin: 0 0 12px 0; font-size: 14px; color: #FF9800;">High Impact Opportunities</h2>
-        ${highImpactHtml}
-      </div>
-
-      <div>
-        <h2 style="margin: 0 0 12px 0; font-size: 14px; color: #0066CC;">Medium Impact Opportunities</h2>
-        ${mediumImpactHtml}
-      </div>
-    `;
-
-    container.innerHTML = html;
-  }
-
-  buildStatsCards(total, highCount, fileCount) {
-    return `
-      <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 24px;">
-        <div style="background: var(--vscode-sidebar); padding: 12px; border-radius: 4px; text-align: center;">
-          <div style="font-size: 24px; font-weight: 600; color: #4CAF50;">${total}</div>
-          <div style="font-size: 11px; color: var(--vscode-text-dim);">Total Opportunities</div>
-        </div>
-        <div style="background: var(--vscode-sidebar); padding: 12px; border-radius: 4px; text-align: center;">
-          <div style="font-size: 24px; font-weight: 600; color: #FF9800;">${highCount}</div>
-          <div style="font-size: 11px; color: var(--vscode-text-dim);">High Impact</div>
-        </div>
-        <div style="background: var(--vscode-sidebar); padding: 12px; border-radius: 4px; text-align: center;">
-          <div style="font-size: 24px; font-weight: 600; color: #0066CC;">${fileCount}</div>
-          <div style="font-size: 11px; color: var(--vscode-text-dim);">Files Affected</div>
-        </div>
-      </div>
-    `;
-  }
-
-  renderWinCard(win) {
-    const impactColor = win.impact === 'high' ? '#FF9800' : '#0066CC';
-    const effortColor = win.effort === 'low' ? '#4CAF50' : win.effort === 'medium' ? '#FF9800' : '#F44336';
-
-    return `
-      <div style="
-        background: var(--vscode-sidebar);
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        padding: 12px;
-        margin-bottom: 12px;
-      ">
-        <div style="display: flex; justify-content: space-between; align-items: start; margin-bottom: 8px;">
-          <div style="font-weight: 500; font-size: 13px;">${win.title}</div>
-          <div style="display: flex; gap: 6px;">
-            <span style="
-              padding: 2px 8px;
-              border-radius: 2px;
-              font-size: 10px;
-              background: ${impactColor};
-              color: white;
-            ">${win.impact} impact</span>
-            <span style="
-              padding: 2px 8px;
-              border-radius: 2px;
-              font-size: 10px;
-              background: ${effortColor};
-              color: white;
-            ">${win.effort} effort</span>
-          </div>
-        </div>
-
-        <p style="margin: 0 0 8px 0; font-size: 12px; color: var(--vscode-text-dim);">
-          ${win.description}
-        </p>
-
-        <div style="
-          background: var(--vscode-bg);
-          padding: 8px;
-          border-radius: 3px;
-          margin-bottom: 8px;
-          font-size: 11px;
-          color: #CE9178;
-        ">
-          <strong>Recommendation:</strong> ${win.recommendation}
-        </div>
-
-        <div style="display: flex; justify-content: space-between; font-size: 10px; color: var(--vscode-text-dim);">
-          <span>⏱️ ${win.estimate}</span>
-          <span>📁 ${win.files_affected} files</span>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-quick-wins-script', QuickWinsScript);
diff --git a/admin-ui/js/components/tools/ds-quick-wins.js b/admin-ui/js/components/tools/ds-quick-wins.js
deleted file mode 100644
index ecc6c53..0000000
--- a/admin-ui/js/components/tools/ds-quick-wins.js
+++ /dev/null
@@ -1,305 +0,0 @@
-/**
- * ds-quick-wins.js
- * Identifies low-effort, high-impact opportunities for design system adoption
- * UI Team Tool #5
- */
-
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSQuickWins extends HTMLElement {
-  constructor() {
-    super();
-    this.quickWins = null;
-    this.isAnalyzing = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.loadCachedResults();
-  }
-
-  async loadCachedResults() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) return;
-
-      const cached = localStorage.getItem(`quickwins_${context.project_id}`);
-      if (cached) {
-        this.quickWins = JSON.parse(cached);
-        this.renderResults();
-      }
-    } catch (error) {
-      console.error('[DSQuickWins] Failed to load cached results:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const analyzeBtn = this.querySelector('#analyze-quick-wins-btn');
-    const pathInput = this.querySelector('#project-path-input');
-
-    if (analyzeBtn) {
-      analyzeBtn.addEventListener('click', () => this.analyzeQuickWins());
-    }
-
-    if (pathInput) {
-      pathInput.addEventListener('keypress', (e) => {
-        if (e.key === 'Enter') {
-          this.analyzeQuickWins();
-        }
-      });
-    }
-  }
-
-  async analyzeQuickWins() {
-    const pathInput = this.querySelector('#project-path-input');
-    const projectPath = pathInput?.value.trim() || '';
-
-    if (!projectPath) {
-      ComponentHelpers.showToast?.('Please enter a project path', 'error');
-      return;
-    }
-
-    this.isAnalyzing = true;
-    this.updateLoadingState();
-
-    try {
-      // Call dss_find_quick_wins MCP tool
-      const result = await toolBridge.executeTool('dss_find_quick_wins', {
-        path: projectPath
-      });
-
-      this.quickWins = result;
-
-      // Cache results
-      const context = contextStore.getMCPContext();
-      if (context.project_id) {
-        localStorage.setItem(`quickwins_${context.project_id}`, JSON.stringify(result));
-      }
-
-      this.renderResults();
-      ComponentHelpers.showToast?.('Quick wins analysis complete', 'success');
-    } catch (error) {
-      console.error('[DSQuickWins] Analysis failed:', error);
-      ComponentHelpers.showToast?.(`Analysis failed: ${error.message}`, 'error');
-
-      const resultsContainer = this.querySelector('#results-container');
-      if (resultsContainer) {
-        resultsContainer.innerHTML = ComponentHelpers.renderError('Quick wins analysis failed', error);
-      }
-    } finally {
-      this.isAnalyzing = false;
-      this.updateLoadingState();
-    }
-  }
-
-  updateLoadingState() {
-    const analyzeBtn = this.querySelector('#analyze-quick-wins-btn');
-    const resultsContainer = this.querySelector('#results-container');
-
-    if (!analyzeBtn || !resultsContainer) return;
-
-    if (this.isAnalyzing) {
-      analyzeBtn.disabled = true;
-      analyzeBtn.textContent = '⏳ Analyzing...';
-      resultsContainer.innerHTML = ComponentHelpers.renderLoading('Identifying quick win opportunities...');
-    } else {
-      analyzeBtn.disabled = false;
-      analyzeBtn.textContent = '⚡ Find Quick Wins';
-    }
-  }
-
-  renderResults() {
-    const resultsContainer = this.querySelector('#results-container');
-    if (!resultsContainer || !this.quickWins) return;
-
-    const opportunities = this.quickWins.opportunities || [];
-    const totalImpact = opportunities.reduce((sum, opp) => sum + (opp.impact || 0), 0);
-    const avgEffort = opportunities.length > 0
-      ? (opportunities.reduce((sum, opp) => sum + (opp.effort || 0), 0) / opportunities.length).toFixed(1)
-      : 0;
-
-    resultsContainer.innerHTML = `
-      <div style="padding: 16px; overflow: auto; height: 100%;">
-        <!-- Summary -->
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; margin-bottom: 24px;">
-          ${this.createStatCard('Opportunities', opportunities.length, '⚡')}
-          ${this.createStatCard('Total Impact', `${totalImpact}%`, '📈')}
-          ${this.createStatCard('Avg Effort', `${avgEffort}h`, '⏱️')}
-        </div>
-
-        <!-- Opportunities List -->
-        ${opportunities.length === 0 ? ComponentHelpers.renderEmpty('No quick wins found', '✨') : `
-          <div style="display: flex; flex-direction: column; gap: 12px;">
-            ${opportunities.sort((a, b) => (b.impact || 0) - (a.impact || 0)).map((opp, idx) => `
-              <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-                <div style="display: flex; justify-content: space-between; align-items: start; margin-bottom: 12px;">
-                  <div style="flex: 1;">
-                    <div style="display: flex; align-items: center; gap: 8px; margin-bottom: 6px;">
-                      <h4 style="font-size: 12px; font-weight: 600;">${ComponentHelpers.escapeHtml(opp.title)}</h4>
-                      ${this.renderPriorityBadge(opp.priority || 'medium')}
-                    </div>
-                    <p style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 8px;">
-                      ${ComponentHelpers.escapeHtml(opp.description)}
-                    </p>
-                  </div>
-                  <div style="text-align: right; margin-left: 16px;">
-                    <div style="font-size: 10px; color: var(--vscode-text-dim); margin-bottom: 4px;">Impact</div>
-                    <div style="font-size: 20px; font-weight: 600; color: #89d185;">${opp.impact || 0}%</div>
-                  </div>
-                </div>
-
-                <!-- Metrics -->
-                <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px; font-size: 11px; margin-bottom: 12px;">
-                  <div>
-                    <div style="color: var(--vscode-text-dim); margin-bottom: 2px;">Effort</div>
-                    <div style="font-weight: 600;">${opp.effort || 0} hours</div>
-                  </div>
-                  <div>
-                    <div style="color: var(--vscode-text-dim); margin-bottom: 2px;">Files Affected</div>
-                    <div style="font-weight: 600;">${opp.filesAffected || 0}</div>
-                  </div>
-                  <div>
-                    <div style="color: var(--vscode-text-dim); margin-bottom: 2px;">Type</div>
-                    <div style="font-weight: 600;">${ComponentHelpers.escapeHtml(opp.type || 'refactor')}</div>
-                  </div>
-                </div>
-
-                <!-- Actions -->
-                <div style="display: flex; gap: 8px;">
-                  <button class="button apply-quick-win-btn" data-idx="${idx}" style="font-size: 10px; padding: 4px 12px;">
-                    ✨ Apply Fix
-                  </button>
-                  <button class="button view-files-btn" data-idx="${idx}" style="font-size: 10px; padding: 4px 12px;">
-                    📁 View Files
-                  </button>
-                </div>
-
-                ${opp.files && opp.files.length > 0 ? `
-                  <details style="margin-top: 12px;">
-                    <summary style="font-size: 10px; color: var(--vscode-text-dim); cursor: pointer;">
-                      Affected Files (${opp.files.length})
-                    </summary>
-                    <div style="margin-top: 8px; padding: 8px; background: var(--vscode-bg); border-radius: 2px; font-family: monospace; font-size: 10px;">
-                      ${opp.files.slice(0, 10).map(file => `<div style="padding: 2px 0;">${ComponentHelpers.escapeHtml(file)}</div>`).join('')}
-                      ${opp.files.length > 10 ? `<div style="padding: 2px 0; color: var(--vscode-text-dim);">...and ${opp.files.length - 10} more</div>` : ''}
-                    </div>
-                  </details>
-                ` : ''}
-              </div>
-            `).join('')}
-          </div>
-        `}
-      </div>
-    `;
-
-    // Setup button handlers
-    const applyBtns = resultsContainer.querySelectorAll('.apply-quick-win-btn');
-    const viewBtns = resultsContainer.querySelectorAll('.view-files-btn');
-
-    applyBtns.forEach(btn => {
-      btn.addEventListener('click', () => {
-        const idx = parseInt(btn.dataset.idx);
-        this.applyQuickWin(opportunities[idx]);
-      });
-    });
-
-    viewBtns.forEach(btn => {
-      btn.addEventListener('click', () => {
-        const idx = parseInt(btn.dataset.idx);
-        this.viewFiles(opportunities[idx]);
-      });
-    });
-  }
-
-  createStatCard(label, value, icon) {
-    return `
-      <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; text-align: center;">
-        <div style="font-size: 32px; margin-bottom: 8px;">${icon}</div>
-        <div style="font-size: 20px; font-weight: 600; margin-bottom: 4px;">${value}</div>
-        <div style="font-size: 11px; color: var(--vscode-text-dim);">${label}</div>
-      </div>
-    `;
-  }
-
-  renderPriorityBadge(priority) {
-    const config = {
-      high: { color: '#f48771', label: 'High Priority' },
-      medium: { color: '#ffbf00', label: 'Medium Priority' },
-      low: { color: '#89d185', label: 'Low Priority' }
-    };
-
-    const { color, label } = config[priority] || config.medium;
-
-    return `<span style="padding: 2px 8px; background: ${color}; border-radius: 2px; font-size: 10px; font-weight: 600;">${label}</span>`;
-  }
-
-  applyQuickWin(opportunity) {
-    ComponentHelpers.showToast?.(`Applying: ${opportunity.title}`, 'info');
-    // In real implementation, this would trigger automated refactoring
-    console.log('Apply quick win:', opportunity);
-  }
-
-  viewFiles(opportunity) {
-    if (!opportunity.files || opportunity.files.length === 0) {
-      ComponentHelpers.showToast?.('No files associated with this opportunity', 'info');
-      return;
-    }
-
-    console.log('View files:', opportunity.files);
-    ComponentHelpers.showToast?.(`${opportunity.files.length} files affected`, 'info');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Header -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Quick Wins Identification</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Project Path
-              </label>
-              <input
-                type="text"
-                id="project-path-input"
-                placeholder="/path/to/your/project"
-                class="input"
-                style="width: 100%; font-size: 11px; font-family: monospace;"
-              />
-            </div>
-
-            <button id="analyze-quick-wins-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              ⚡ Find Quick Wins
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; font-size: 10px; color: var(--vscode-text-dim);">
-            💡 Identifies low-effort, high-impact opportunities for design system adoption
-          </div>
-        </div>
-
-        <!-- Results Container -->
-        <div id="results-container" style="flex: 1; overflow: hidden;">
-          <div style="display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 48px;">
-            <div>
-              <div style="font-size: 48px; margin-bottom: 16px;">⚡</div>
-              <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">Ready to Find Quick Wins</h3>
-              <p style="font-size: 12px; color: var(--vscode-text-dim);">
-                Enter your project path above to identify low-effort, high-impact improvements
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-quick-wins', DSQuickWins);
-
-export default DSQuickWins;
diff --git a/admin-ui/js/components/tools/ds-regression-testing.js b/admin-ui/js/components/tools/ds-regression-testing.js
deleted file mode 100644
index 6f10676..0000000
--- a/admin-ui/js/components/tools/ds-regression-testing.js
+++ /dev/null
@@ -1,115 +0,0 @@
-export default class RegressionTesting extends HTMLElement {
-  constructor() {
-    super();
-    this.regressions = [];
-    this.isRunning = false;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 24px; height: 100%; overflow-y: auto;">
-        <h1 style="margin: 0 0 8px 0; font-size: 24px;">Visual Regression Testing</h1>
-        <p style="margin: 0 0 24px 0; color: var(--vscode-text-dim);">Detect visual changes in design system components</p>
-
-        <div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 24px;">
-          <label style="display: block; font-size: 12px; font-weight: 500; margin-bottom: 8px;">Components to Test</label>
-          <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px;">
-            <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-              <input type="checkbox" checked /> Buttons
-            </label>
-            <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-              <input type="checkbox" checked /> Inputs
-            </label>
-            <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-              <input type="checkbox" checked /> Cards
-            </label>
-            <label style="display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px;">
-              <input type="checkbox" checked /> Modals
-            </label>
-          </div>
-          <button id="run-tests-btn" style="width: 100%; padding: 8px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 4px; cursor: pointer; font-weight: 500; font-size: 12px;">Run Tests</button>
-        </div>
-
-        <div id="progress-container" style="display: none; margin-bottom: 24px;">
-          <div style="margin-bottom: 8px; font-size: 12px; color: var(--vscode-text-dim);">Testing... <span id="progress-count">0/4</span></div>
-          <div style="width: 100%; height: 6px; background: var(--vscode-bg); border-radius: 3px; overflow: hidden;">
-            <div id="progress-bar" style="width: 0%; height: 100%; background: #0066CC; transition: width 0.3s;"></div>
-          </div>
-        </div>
-
-        <div id="results-container" style="display: none;"></div>
-      </div>
-    `;
-  }
-
-  setupEventListeners() {
-    this.querySelector('#run-tests-btn').addEventListener('click', () => this.runTests());
-  }
-
-  async runTests() {
-    this.isRunning = true;
-    this.querySelector('#progress-container').style.display = 'block';
-    this.querySelector('#results-container').style.display = 'none';
-
-    const components = ['Buttons', 'Inputs', 'Cards', 'Modals'];
-    this.regressions = [];
-
-    for (let i = 0; i < components.length; i++) {
-      this.querySelector('#progress-count').textContent = (i + 1) + '/4';
-      this.querySelector('#progress-bar').style.width = ((i + 1) / 4 * 100) + '%';
-      await new Promise(resolve => setTimeout(resolve, 600));
-
-      if (Math.random() > 0.7) {
-        this.regressions.push({
-          component: components[i],
-          severity: Math.random() > 0.5 ? 'critical' : 'minor'
-        });
-      }
-    }
-
-    this.renderResults();
-    this.querySelector('#progress-container').style.display = 'none';
-    this.querySelector('#results-container').style.display = 'block';
-  }
-
-  renderResults() {
-    const container = this.querySelector('#results-container');
-    const passed = 4 - this.regressions.length;
-
-    let html = `<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 24px;">
-      <div style="background: var(--vscode-sidebar); padding: 12px; border-radius: 4px; text-align: center; border: 2px solid #4CAF50;">
-        <div style="font-size: 24px; font-weight: 600; color: #4CAF50;">${passed}</div>
-        <div style="font-size: 11px; color: var(--vscode-text-dim);">Passed</div>
-      </div>
-      <div style="background: var(--vscode-sidebar); padding: 12px; border-radius: 4px; text-align: center; border: 2px solid ${this.regressions.length > 0 ? '#F44336' : '#4CAF50'};">
-        <div style="font-size: 24px; font-weight: 600; color: ${this.regressions.length > 0 ? '#F44336' : '#4CAF50'};">${this.regressions.length}</div>
-        <div style="font-size: 11px; color: var(--vscode-text-dim);">Regressions</div>
-      </div>
-    </div>`;
-
-    if (this.regressions.length === 0) {
-      html += `<div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 24px; text-align: center;"><div style="font-size: 20px; margin-bottom: 8px;">All Tests Passed</div></div>`;
-    } else {
-      html += `<h2 style="margin: 0 0 12px 0; font-size: 14px;">Regressions Found</h2>`;
-      for (let reg of this.regressions) {
-        const color = reg.severity === 'critical' ? '#F44336' : '#FF9800';
-        html += `<div style="background: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 12px; margin-bottom: 12px;">
-          <div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
-            <div style="font-weight: 500;">${reg.component}</div>
-            <span style="padding: 2px 8px; background: ${color}; color: white; border-radius: 2px; font-size: 10px;">${reg.severity}</span>
-          </div>
-          <button style="width: 100%; padding: 6px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 3px; cursor: pointer; font-size: 10px;">Approve as Baseline</button>
-        </div>`;
-      }
-    }
-
-    container.innerHTML = html;
-  }
-}
-
-customElements.define('ds-regression-testing', RegressionTesting);
diff --git a/admin-ui/js/components/tools/ds-screenshot-gallery.js b/admin-ui/js/components/tools/ds-screenshot-gallery.js
deleted file mode 100644
index 18ac6d3..0000000
--- a/admin-ui/js/components/tools/ds-screenshot-gallery.js
+++ /dev/null
@@ -1,552 +0,0 @@
-/**
- * ds-screenshot-gallery.js
- * Screenshot gallery with IndexedDB storage and artifact-based images
- *
- * REFACTORED: DSS-compliant version using DSBaseTool + gallery-template.js
- * - Extends DSBaseTool for Shadow DOM, AbortController, and standardized lifecycle
- * - Uses gallery-template.js for DSS-compliant templating (NO inline events/styles)
- * - Event delegation pattern for all interactions
- * - Logger utility instead of console.*
- *
- * Reference: .knowledge/dss-coding-standards.json
- */
-
-import DSBaseTool from '../base/ds-base-tool.js';
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import { logger } from '../../utils/logger.js';
-
-class DSScreenshotGallery extends DSBaseTool {
-  constructor() {
-    super();
-    this.screenshots = [];
-    this.selectedScreenshot = null;
-    this.isCapturing = false;
-    this.db = null;
-  }
-
-  async connectedCallback() {
-    // Initialize IndexedDB first
-    await this.initDB();
-
-    // Call parent connectedCallback (renders + setupEventListeners)
-    super.connectedCallback();
-
-    // Load screenshots after render
-    await this.loadScreenshots();
-  }
-
-  /**
-   * Initialize IndexedDB for metadata storage
-   */
-  async initDB() {
-    return new Promise((resolve, reject) => {
-      const request = indexedDB.open('ds-screenshots', 1);
-
-      request.onerror = () => {
-        logger.error('[DSScreenshotGallery] Failed to open IndexedDB', request.error);
-        reject(request.error);
-      };
-
-      request.onsuccess = () => {
-        this.db = request.result;
-        logger.debug('[DSScreenshotGallery] IndexedDB initialized');
-        resolve();
-      };
-
-      request.onupgradeneeded = (event) => {
-        const db = event.target.result;
-        if (!db.objectStoreNames.contains('screenshots')) {
-          const store = db.createObjectStore('screenshots', { keyPath: 'id' });
-          store.createIndex('timestamp', 'timestamp', { unique: false });
-          store.createIndex('tags', 'tags', { unique: false, multiEntry: true });
-          logger.info('[DSScreenshotGallery] IndexedDB schema created');
-        }
-      };
-    });
-  }
-
-  /**
-   * Render the component (required by DSBaseTool)
-   */
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        :host {
-          display: block;
-          height: 100%;
-        }
-
-        .screenshot-gallery-container {
-          padding: 16px;
-          height: 100%;
-          display: flex;
-          flex-direction: column;
-        }
-
-        .capture-controls {
-          margin-bottom: 16px;
-          display: flex;
-          gap: 12px;
-          align-items: center;
-          flex-wrap: wrap;
-        }
-
-        .capture-input {
-          flex: 1;
-          min-width: 200px;
-          padding: 6px 8px;
-          font-size: 12px;
-          background: var(--vscode-input-background);
-          color: var(--vscode-input-foreground);
-          border: 1px solid var(--vscode-input-border);
-          border-radius: 2px;
-        }
-
-        .capture-input:focus {
-          outline: 1px solid var(--vscode-focusBorder);
-        }
-
-        .fullpage-label {
-          display: flex;
-          align-items: center;
-          gap: 6px;
-          font-size: 12px;
-          color: var(--vscode-foreground);
-          cursor: pointer;
-        }
-
-        .capture-btn {
-          padding: 6px 12px;
-          font-size: 11px;
-          background: var(--vscode-button-background);
-          color: var(--vscode-button-foreground);
-          border: none;
-          border-radius: 2px;
-          cursor: pointer;
-          transition: background 0.15s ease;
-        }
-
-        .capture-btn:hover {
-          background: var(--vscode-button-hoverBackground);
-        }
-
-        .capture-btn:disabled {
-          opacity: 0.5;
-          cursor: not-allowed;
-        }
-
-        .gallery-wrapper {
-          flex: 1;
-          overflow-y: auto;
-        }
-
-        .loading {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          color: var(--vscode-descriptionForeground);
-        }
-
-        .loading-spinner {
-          font-size: 32px;
-          margin-bottom: 12px;
-          animation: spin 1s linear infinite;
-        }
-
-        @keyframes spin {
-          from { transform: rotate(0deg); }
-          to { transform: rotate(360deg); }
-        }
-
-        /* Modal styles */
-        .modal-overlay {
-          position: fixed;
-          top: 0;
-          left: 0;
-          right: 0;
-          bottom: 0;
-          background: rgba(0, 0, 0, 0.9);
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          z-index: 10000;
-          padding: 24px;
-        }
-
-        .modal-content {
-          max-width: 90%;
-          max-height: 90%;
-          background: var(--vscode-sideBar-background);
-          border-radius: 4px;
-          overflow: hidden;
-          display: flex;
-          flex-direction: column;
-        }
-
-        .modal-header {
-          padding: 16px;
-          border-bottom: 1px solid var(--vscode-panel-border);
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-        }
-
-        .modal-title {
-          font-size: 14px;
-          margin: 0 0 4px 0;
-        }
-
-        .modal-subtitle {
-          font-size: 11px;
-          color: var(--vscode-descriptionForeground);
-        }
-
-        .modal-close-btn {
-          background: none;
-          border: none;
-          font-size: 24px;
-          cursor: pointer;
-          color: var(--vscode-foreground);
-          padding: 0;
-          width: 32px;
-          height: 32px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-        }
-
-        .modal-close-btn:hover {
-          background: var(--vscode-toolbar-hoverBackground);
-          border-radius: 2px;
-        }
-
-        .modal-body {
-          flex: 1;
-          overflow: auto;
-          padding: 16px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-        }
-
-        .modal-image {
-          max-width: 100%;
-          max-height: 100%;
-          object-fit: contain;
-        }
-      </style>
-
-      <div class="screenshot-gallery-container">
-        <!-- Capture Controls -->
-        <div class="capture-controls">
-          <input
-            type="text"
-            id="screenshot-selector"
-            placeholder="Optional: CSS selector to capture"
-            class="capture-input"
-          />
-          <label class="fullpage-label">
-            <input type="checkbox" id="screenshot-fullpage" />
-            Full page
-          </label>
-          <button
-            id="capture-screenshot-btn"
-            data-action="capture"
-            class="capture-btn"
-            type="button"
-            aria-label="Capture screenshot">
-            📸 Capture
-          </button>
-        </div>
-
-        <!-- Gallery Content -->
-        <div class="gallery-wrapper" id="gallery-content">
-          <div class="loading">
-            <div class="loading-spinner">⏳</div>
-            <div>Initializing gallery...</div>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-
-  /**
-   * Setup event listeners (required by DSBaseTool)
-   * Uses event delegation pattern with data-action attributes
-   */
-  setupEventListeners() {
-    // EVENT-002: Event delegation on container
-    this.delegateEvents('.screenshot-gallery-container', 'click', (action, e) => {
-      switch (action) {
-        case 'capture':
-          this.captureScreenshot();
-          break;
-        case 'item-click':
-          const idx = parseInt(e.target.closest('[data-item-idx]')?.dataset.itemIdx, 10);
-          if (!isNaN(idx) && this.screenshots[idx]) {
-            this.viewScreenshot(this.screenshots[idx]);
-          }
-          break;
-        case 'item-delete':
-          const deleteIdx = parseInt(e.target.closest('[data-item-idx]')?.dataset.itemIdx, 10);
-          if (!isNaN(deleteIdx) && this.screenshots[deleteIdx]) {
-            this.handleDelete(this.screenshots[deleteIdx].id);
-          }
-          break;
-      }
-    });
-  }
-
-  async captureScreenshot() {
-    if (this.isCapturing) return;
-
-    this.isCapturing = true;
-    const captureBtn = this.$('#capture-screenshot-btn');
-
-    if (captureBtn) {
-      captureBtn.disabled = true;
-      captureBtn.textContent = '📸 Capturing...';
-    }
-
-    try {
-      const selectorInput = this.$('#screenshot-selector');
-      const fullPageToggle = this.$('#screenshot-fullpage');
-
-      const selector = selectorInput?.value.trim() || null;
-      const fullPage = fullPageToggle?.checked || false;
-
-      logger.info('[DSScreenshotGallery] Capturing screenshot', { selector, fullPage });
-
-      // Call MCP tool to capture screenshot
-      const result = await toolBridge.takeScreenshot(fullPage, selector);
-
-      if (result && result.screenshot) {
-        // Save metadata to IndexedDB
-        const screenshot = {
-          id: Date.now(),
-          timestamp: new Date(),
-          selector: selector || 'Full Page',
-          fullPage,
-          imageData: result.screenshot, // Base64 image data
-          tags: selector ? [selector] : ['fullpage']
-        };
-
-        await this.saveScreenshot(screenshot);
-        await this.loadScreenshots();
-
-        ComponentHelpers.showToast?.('Screenshot captured successfully', 'success');
-        logger.info('[DSScreenshotGallery] Screenshot saved', { id: screenshot.id });
-      } else {
-        throw new Error('No screenshot data returned');
-      }
-    } catch (error) {
-      logger.error('[DSScreenshotGallery] Failed to capture screenshot', error);
-      ComponentHelpers.showToast?.(`Failed to capture screenshot: ${error.message}`, 'error');
-    } finally {
-      this.isCapturing = false;
-      if (captureBtn) {
-        captureBtn.disabled = false;
-        captureBtn.textContent = '📸 Capture';
-      }
-    }
-  }
-
-  async saveScreenshot(screenshot) {
-    return new Promise((resolve, reject) => {
-      const transaction = this.db.transaction(['screenshots'], 'readwrite');
-      const store = transaction.objectStore('screenshots');
-      const request = store.add(screenshot);
-
-      request.onsuccess = () => resolve();
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async loadScreenshots() {
-    const content = this.$('#gallery-content');
-    if (!content) return;
-
-    try {
-      this.screenshots = await this.getAllScreenshots();
-      logger.debug('[DSScreenshotGallery] Loaded screenshots', { count: this.screenshots.length });
-      this.renderGallery();
-    } catch (error) {
-      logger.error('[DSScreenshotGallery] Failed to load screenshots', error);
-      content.innerHTML = ComponentHelpers.renderError('Failed to load screenshots', error);
-    }
-  }
-
-  async getAllScreenshots() {
-    return new Promise((resolve, reject) => {
-      const transaction = this.db.transaction(['screenshots'], 'readonly');
-      const store = transaction.objectStore('screenshots');
-      const request = store.getAll();
-
-      request.onsuccess = () => resolve(request.result.reverse()); // Most recent first
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async deleteScreenshot(id) {
-    return new Promise((resolve, reject) => {
-      const transaction = this.db.transaction(['screenshots'], 'readwrite');
-      const store = transaction.objectStore('screenshots');
-      const request = store.delete(id);
-
-      request.onsuccess = () => resolve();
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async handleDelete(id) {
-    if (!confirm('Delete this screenshot?')) return;
-
-    try {
-      await this.deleteScreenshot(id);
-      await this.loadScreenshots();
-      ComponentHelpers.showToast?.('Screenshot deleted', 'success');
-      logger.info('[DSScreenshotGallery] Screenshot deleted', { id });
-    } catch (error) {
-      logger.error('[DSScreenshotGallery] Failed to delete screenshot', error);
-      ComponentHelpers.showToast?.(`Failed to delete: ${error.message}`, 'error');
-    }
-  }
-
-  viewScreenshot(screenshot) {
-    this.selectedScreenshot = screenshot;
-    this.renderModal();
-  }
-
-  renderModal() {
-    if (!this.selectedScreenshot) return;
-
-    // Create modal in Shadow DOM
-    const modal = document.createElement('div');
-    modal.className = 'modal-overlay';
-    modal.innerHTML = `
-      <div class="modal-content">
-        <div class="modal-header">
-          <div>
-            <h3 class="modal-title">${this.escapeHtml(this.selectedScreenshot.selector)}</h3>
-            <div class="modal-subtitle">
-              ${ComponentHelpers.formatTimestamp(new Date(this.selectedScreenshot.timestamp))}
-            </div>
-          </div>
-          <button
-            class="modal-close-btn"
-            data-action="close-modal"
-            type="button"
-            aria-label="Close modal">
-            ×
-          </button>
-        </div>
-        <div class="modal-body">
-          <img
-            src="${this.selectedScreenshot.imageData}"
-            class="modal-image"
-            alt="${this.escapeHtml(this.selectedScreenshot.selector)}" />
-        </div>
-      </div>
-    `;
-
-    // Add click handlers for modal
-    this.bindEvent(modal, 'click', (e) => {
-      const closeBtn = e.target.closest('[data-action="close-modal"]');
-      if (closeBtn || e.target === modal) {
-        modal.remove();
-        this.selectedScreenshot = null;
-        logger.debug('[DSScreenshotGallery] Modal closed');
-      }
-    });
-
-    this.shadowRoot.appendChild(modal);
-    logger.debug('[DSScreenshotGallery] Modal opened', { id: this.selectedScreenshot.id });
-  }
-
-  renderGallery() {
-    const content = this.$('#gallery-content');
-    if (!content) return;
-
-    if (this.screenshots.length === 0) {
-      content.innerHTML = `
-        <div style="display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px; color: var(--vscode-descriptionForeground);">
-          <div style="font-size: 48px; margin-bottom: 12px; opacity: 0.5;">📸</div>
-          <div style="font-size: 13px;">No screenshots captured yet</div>
-        </div>
-      `;
-      return;
-    }
-
-    // Transform screenshots to gallery items format
-    const galleryItems = this.screenshots.map(screenshot => ({
-      src: screenshot.imageData,
-      title: screenshot.selector,
-      subtitle: ComponentHelpers.formatRelativeTime(new Date(screenshot.timestamp))
-    }));
-
-    // Use DSS-compliant gallery template (NO inline styles/events)
-    // Note: We're using a simplified inline version here since we're in Shadow DOM
-    // For full modular approach, we'd import createGalleryView from gallery-template.js
-    content.innerHTML = `
-      <div style="margin-bottom: 12px; padding: 12px; background-color: var(--vscode-sideBar-background); border-radius: 4px;">
-        <div style="font-size: 11px; color: var(--vscode-descriptionForeground);">
-          ${this.screenshots.length} screenshot${this.screenshots.length !== 1 ? 's' : ''} stored
-        </div>
-      </div>
-      <div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px;">
-        ${galleryItems.map((item, idx) => `
-          <div class="gallery-item" data-action="item-click" data-item-idx="${idx}" style="
-            background: var(--vscode-sideBar-background);
-            border: 1px solid var(--vscode-panel-border);
-            border-radius: 4px;
-            overflow: hidden;
-            cursor: pointer;
-            transition: transform 0.2s ease;
-          ">
-            <div style="aspect-ratio: 16/9; overflow: hidden; background: var(--vscode-editor-background);">
-              <img src="${item.src}"
-                   style="width: 100%; height: 100%; object-fit: cover;"
-                   alt="${this.escapeHtml(item.title)}" />
-            </div>
-            <div style="padding: 12px;">
-              <div style="font-size: 12px; font-weight: 600; margin-bottom: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
-                ${this.escapeHtml(item.title)}
-              </div>
-              <div style="font-size: 11px; color: var(--vscode-descriptionForeground); margin-bottom: 8px;">
-                ${item.subtitle}
-              </div>
-              <button
-                data-action="item-delete"
-                data-item-idx="${idx}"
-                type="button"
-                aria-label="Delete ${this.escapeHtml(item.title)}"
-                style="padding: 4px 8px; font-size: 10px; background: rgba(244, 135, 113, 0.1); color: #f48771; border: 1px solid #f48771; border-radius: 2px; cursor: pointer;">
-                🗑️ Delete
-              </button>
-            </div>
-          </div>
-        `).join('')}
-      </div>
-    `;
-
-    // Add hover styles via adoptedStyleSheets
-    this.adoptStyles(`
-      .gallery-item:hover {
-        transform: scale(1.02);
-      }
-
-      .gallery-item button:hover {
-        background: rgba(244, 135, 113, 0.2);
-      }
-    `);
-
-    logger.debug('[DSScreenshotGallery] Gallery rendered', { count: this.screenshots.length });
-  }
-}
-
-customElements.define('ds-screenshot-gallery', DSScreenshotGallery);
-
-export default DSScreenshotGallery;
diff --git a/admin-ui/js/components/tools/ds-storybook-figma-compare.js b/admin-ui/js/components/tools/ds-storybook-figma-compare.js
deleted file mode 100644
index 6e4e454..0000000
--- a/admin-ui/js/components/tools/ds-storybook-figma-compare.js
+++ /dev/null
@@ -1,174 +0,0 @@
-/**
- * ds-storybook-figma-compare.js
- * Side-by-side Storybook and Figma component comparison
- * UI Team Tool #1
- */
-
-import { createComparisonView, setupComparisonHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import apiClient from '../../services/api-client.js';
-
-class DSStorybookFigmaCompare extends HTMLElement {
-  constructor() {
-    super();
-    this.storybookUrl = '';
-    this.figmaUrl = '';
-    this.selectedComponent = null;
-  }
-
-  async connectedCallback() {
-    await this.loadProjectConfig();
-    this.render();
-    this.setupEventListeners();
-  }
-
-  async loadProjectConfig() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Fetch project configuration to get Storybook URL and Figma file
-      const project = await apiClient.getProject(context.project_id);
-      this.storybookUrl = project.storybook_url || '';
-      this.figmaUrl = project.figma_ui_file || '';
-    } catch (error) {
-      console.error('[DSStorybookFigmaCompare] Failed to load project config:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const storybookInput = this.querySelector('#storybook-url-input');
-    const figmaInput = this.querySelector('#figma-url-input');
-    const loadBtn = this.querySelector('#load-comparison-btn');
-
-    if (storybookInput) {
-      storybookInput.value = this.storybookUrl;
-    }
-
-    if (figmaInput) {
-      figmaInput.value = this.figmaUrl;
-    }
-
-    if (loadBtn) {
-      loadBtn.addEventListener('click', () => this.loadComparison());
-    }
-
-    // Setup comparison handlers (sync scroll, zoom, etc.)
-    const comparisonContainer = this.querySelector('#comparison-container');
-    if (comparisonContainer) {
-      setupComparisonHandlers(comparisonContainer, {});
-    }
-  }
-
-  loadComparison() {
-    const storybookInput = this.querySelector('#storybook-url-input');
-    const figmaInput = this.querySelector('#figma-url-input');
-
-    this.storybookUrl = storybookInput?.value || '';
-    this.figmaUrl = figmaInput?.value || '';
-
-    if (!this.storybookUrl || !this.figmaUrl) {
-      ComponentHelpers.showToast?.('Please enter both Storybook and Figma URLs', 'error');
-      return;
-    }
-
-    // Validate URLs
-    try {
-      new URL(this.storybookUrl);
-      new URL(this.figmaUrl);
-    } catch (error) {
-      ComponentHelpers.showToast?.('Invalid URL format', 'error');
-      return;
-    }
-
-    // Update comparison view
-    const comparisonContainer = this.querySelector('#comparison-container');
-    if (comparisonContainer) {
-      comparisonContainer.innerHTML = createComparisonView({
-        leftTitle: 'Storybook',
-        rightTitle: 'Figma',
-        leftSrc: this.storybookUrl,
-        rightSrc: this.figmaUrl
-      });
-
-      // Re-setup handlers after re-render
-      setupComparisonHandlers(comparisonContainer, {});
-
-      ComponentHelpers.showToast?.('Comparison loaded', 'success');
-    }
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Configuration Panel -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Component Comparison Configuration</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Storybook URL
-              </label>
-              <input
-                type="url"
-                id="storybook-url-input"
-                placeholder="https://storybook.example.com/..."
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Figma URL
-              </label>
-              <input
-                type="url"
-                id="figma-url-input"
-                placeholder="https://figma.com/file/..."
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <button id="load-comparison-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              🔍 Load Comparison
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; font-size: 10px; color: var(--vscode-text-dim);">
-            💡 Tip: Navigate to the same component in both Storybook and Figma for accurate comparison
-          </div>
-        </div>
-
-        <!-- Comparison View -->
-        <div id="comparison-container" style="flex: 1; overflow: hidden;">
-          ${this.storybookUrl && this.figmaUrl ? createComparisonView({
-            leftTitle: 'Storybook',
-            rightTitle: 'Figma',
-            leftSrc: this.storybookUrl,
-            rightSrc: this.figmaUrl
-          }) : `
-            <div style="display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 48px;">
-              <div>
-                <div style="font-size: 48px; margin-bottom: 16px;">🔍</div>
-                <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">No Comparison Loaded</h3>
-                <p style="font-size: 12px; color: var(--vscode-text-dim);">
-                  Enter Storybook and Figma URLs above to start comparing components
-                </p>
-              </div>
-            </div>
-          `}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-storybook-figma-compare', DSStorybookFigmaCompare);
-
-export default DSStorybookFigmaCompare;
diff --git a/admin-ui/js/components/tools/ds-storybook-live-compare.js b/admin-ui/js/components/tools/ds-storybook-live-compare.js
deleted file mode 100644
index 4bb2973..0000000
--- a/admin-ui/js/components/tools/ds-storybook-live-compare.js
+++ /dev/null
@@ -1,167 +0,0 @@
-/**
- * ds-storybook-live-compare.js
- * Side-by-side Storybook and Live Application comparison
- * UI Team Tool #2
- */
-
-import { createComparisonView, setupComparisonHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import apiClient from '../../services/api-client.js';
-
-class DSStorybookLiveCompare extends HTMLElement {
-  constructor() {
-    super();
-    this.storybookUrl = '';
-    this.liveUrl = '';
-  }
-
-  async connectedCallback() {
-    await this.loadProjectConfig();
-    this.render();
-    this.setupEventListeners();
-  }
-
-  async loadProjectConfig() {
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      const project = await apiClient.getProject(context.project_id);
-      this.storybookUrl = project.storybook_url || '';
-      this.liveUrl = project.live_url || window.location.origin;
-    } catch (error) {
-      console.error('[DSStorybookLiveCompare] Failed to load project config:', error);
-    }
-  }
-
-  setupEventListeners() {
-    const storybookInput = this.querySelector('#storybook-url-input');
-    const liveInput = this.querySelector('#live-url-input');
-    const loadBtn = this.querySelector('#load-comparison-btn');
-
-    if (storybookInput) {
-      storybookInput.value = this.storybookUrl;
-    }
-
-    if (liveInput) {
-      liveInput.value = this.liveUrl;
-    }
-
-    if (loadBtn) {
-      loadBtn.addEventListener('click', () => this.loadComparison());
-    }
-
-    const comparisonContainer = this.querySelector('#comparison-container');
-    if (comparisonContainer) {
-      setupComparisonHandlers(comparisonContainer, {});
-    }
-  }
-
-  loadComparison() {
-    const storybookInput = this.querySelector('#storybook-url-input');
-    const liveInput = this.querySelector('#live-url-input');
-
-    this.storybookUrl = storybookInput?.value || '';
-    this.liveUrl = liveInput?.value || '';
-
-    if (!this.storybookUrl || !this.liveUrl) {
-      ComponentHelpers.showToast?.('Please enter both Storybook and Live application URLs', 'error');
-      return;
-    }
-
-    try {
-      new URL(this.storybookUrl);
-      new URL(this.liveUrl);
-    } catch (error) {
-      ComponentHelpers.showToast?.('Invalid URL format', 'error');
-      return;
-    }
-
-    const comparisonContainer = this.querySelector('#comparison-container');
-    if (comparisonContainer) {
-      comparisonContainer.innerHTML = createComparisonView({
-        leftTitle: 'Storybook (Design System)',
-        rightTitle: 'Live Application',
-        leftSrc: this.storybookUrl,
-        rightSrc: this.liveUrl
-      });
-
-      setupComparisonHandlers(comparisonContainer, {});
-      ComponentHelpers.showToast?.('Comparison loaded', 'success');
-    }
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="display: flex; flex-direction: column; height: 100%;">
-        <!-- Configuration Panel -->
-        <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border); background: var(--vscode-sidebar);">
-          <h3 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Storybook vs Live Comparison</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Storybook Component URL
-              </label>
-              <input
-                type="url"
-                id="storybook-url-input"
-                placeholder="https://storybook.example.com/?path=/story/..."
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <div>
-              <label style="display: block; font-size: 11px; font-weight: 600; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Live Application URL
-              </label>
-              <input
-                type="url"
-                id="live-url-input"
-                placeholder="https://app.example.com/..."
-                class="input"
-                style="width: 100%; font-size: 11px;"
-              />
-            </div>
-
-            <button id="load-comparison-btn" class="button" style="font-size: 11px; padding: 6px 16px;">
-              🔍 Load Comparison
-            </button>
-          </div>
-
-          <div style="margin-top: 8px; font-size: 10px; color: var(--vscode-text-dim);">
-            💡 Tip: Compare the same component in design system vs production to identify drift
-          </div>
-        </div>
-
-        <!-- Comparison View -->
-        <div id="comparison-container" style="flex: 1; overflow: hidden;">
-          ${this.storybookUrl && this.liveUrl ? createComparisonView({
-            leftTitle: 'Storybook (Design System)',
-            rightTitle: 'Live Application',
-            leftSrc: this.storybookUrl,
-            rightSrc: this.liveUrl
-          }) : `
-            <div style="display: flex; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 48px;">
-              <div>
-                <div style="font-size: 48px; margin-bottom: 16px;">⚖️</div>
-                <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">No Comparison Loaded</h3>
-                <p style="font-size: 12px; color: var(--vscode-text-dim);">
-                  Enter Storybook and Live application URLs to compare design system vs implementation
-                </p>
-              </div>
-            </div>
-          `}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-storybook-live-compare', DSStorybookLiveCompare);
-
-export default DSStorybookLiveCompare;
diff --git a/admin-ui/js/components/tools/ds-system-log.js b/admin-ui/js/components/tools/ds-system-log.js
deleted file mode 100644
index 4db1b3d..0000000
--- a/admin-ui/js/components/tools/ds-system-log.js
+++ /dev/null
@@ -1,219 +0,0 @@
-/**
- * ds-system-log.js
- * System health dashboard with DSS status, MCP health, and compiler metrics
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSSystemLog extends HTMLElement {
-  constructor() {
-    super();
-    this.status = null;
-    this.autoRefresh = false;
-    this.refreshInterval = null;
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    this.loadStatus();
-  }
-
-  disconnectedCallback() {
-    if (this.refreshInterval) {
-      clearInterval(this.refreshInterval);
-    }
-  }
-
-  setupEventListeners() {
-    const refreshBtn = this.querySelector('#system-refresh-btn');
-    if (refreshBtn) {
-      refreshBtn.addEventListener('click', () => this.loadStatus());
-    }
-
-    const autoRefreshToggle = this.querySelector('#system-auto-refresh');
-    if (autoRefreshToggle) {
-      autoRefreshToggle.addEventListener('change', (e) => {
-        this.autoRefresh = e.target.checked;
-        if (this.autoRefresh) {
-          this.refreshInterval = setInterval(() => this.loadStatus(), 5000);
-        } else {
-          if (this.refreshInterval) {
-            clearInterval(this.refreshInterval);
-            this.refreshInterval = null;
-          }
-        }
-      });
-    }
-  }
-
-  async loadStatus() {
-    const content = this.querySelector('#system-content');
-    if (!content) return;
-
-    // Only show loading on first load
-    if (!this.status) {
-      content.innerHTML = ComponentHelpers.renderLoading('Loading system status...');
-    }
-
-    try {
-      const result = await toolBridge.getDSSStatus('json');
-
-      if (result) {
-        this.status = result;
-        this.renderStatus();
-      } else {
-        content.innerHTML = ComponentHelpers.renderEmpty('No status data available', '📊');
-      }
-    } catch (error) {
-      console.error('Failed to load system status:', error);
-      content.innerHTML = ComponentHelpers.renderError('Failed to load system status', error);
-    }
-  }
-
-  getHealthBadge(isHealthy) {
-    return isHealthy
-      ? ComponentHelpers.createBadge('Healthy', 'success')
-      : ComponentHelpers.createBadge('Degraded', 'error');
-  }
-
-  renderStatus() {
-    const content = this.querySelector('#system-content');
-    if (!content || !this.status) return;
-
-    const health = this.status.health || {};
-    const config = this.status.configuration || {};
-    const metrics = this.status.metrics || {};
-    const recommendations = this.status.recommendations || [];
-
-    content.innerHTML = `
-      <div style="display: grid; gap: 16px;">
-        <!-- Overall Health Card -->
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-            <h3 style="font-size: 14px; font-weight: 600;">System Health</h3>
-            ${this.getHealthBadge(health.overall)}
-          </div>
-          <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px;">
-            <div>
-              <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">MCP Server</div>
-              <div style="font-size: 12px;">${this.getHealthBadge(health.mcp_server)}</div>
-            </div>
-            <div>
-              <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">Context Compiler</div>
-              <div style="font-size: 12px;">${this.getHealthBadge(health.context_compiler)}</div>
-            </div>
-            <div>
-              <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">Browser Connection</div>
-              <div style="font-size: 12px;">${this.getHealthBadge(health.browser_connection)}</div>
-            </div>
-            <div>
-              <div style="font-size: 11px; color: var(--vscode-text-dim); margin-bottom: 4px;">Dependencies</div>
-              <div style="font-size: 12px;">${this.getHealthBadge(health.dependencies)}</div>
-            </div>
-          </div>
-        </div>
-
-        <!-- Configuration Card -->
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-          <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 12px;">Configuration</h3>
-          <div style="display: grid; gap: 8px; font-size: 12px;">
-            <div style="display: flex; justify-content: space-between;">
-              <span style="color: var(--vscode-text-dim);">Base Theme:</span>
-              <span style="font-family: 'Courier New', monospace;">${ComponentHelpers.escapeHtml(config.base_theme || 'N/A')}</span>
-            </div>
-            <div style="display: flex; justify-content: space-between;">
-              <span style="color: var(--vscode-text-dim);">Active Skin:</span>
-              <span style="font-family: 'Courier New', monospace;">${ComponentHelpers.escapeHtml(config.skin || 'None')}</span>
-            </div>
-            <div style="display: flex; justify-content: space-between;">
-              <span style="color: var(--vscode-text-dim);">Project Name:</span>
-              <span style="font-family: 'Courier New', monospace;">${ComponentHelpers.escapeHtml(config.project_name || 'N/A')}</span>
-            </div>
-            <div style="display: flex; justify-content: space-between;">
-              <span style="color: var(--vscode-text-dim);">Cache Enabled:</span>
-              <span>${config.cache_enabled ? '✓ Yes' : '✗ No'}</span>
-            </div>
-          </div>
-        </div>
-
-        <!-- Metrics Card -->
-        ${metrics.token_count !== undefined ? `
-          <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-            <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 12px;">Metrics</h3>
-            <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px;">
-              <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-                <div style="font-size: 24px; font-weight: 600; color: var(--vscode-accent);">${metrics.token_count || 0}</div>
-                <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Design Tokens</div>
-              </div>
-              <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-                <div style="font-size: 24px; font-weight: 600; color: var(--vscode-accent);">${metrics.component_count || 0}</div>
-                <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Components</div>
-              </div>
-              <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-                <div style="font-size: 24px; font-weight: 600; color: var(--vscode-accent);">${metrics.theme_count || 0}</div>
-                <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Themes</div>
-              </div>
-              ${metrics.compilation_time ? `
-                <div style="text-align: center; padding: 12px; background-color: var(--vscode-bg); border-radius: 4px;">
-                  <div style="font-size: 24px; font-weight: 600; color: var(--vscode-accent);">${Math.round(metrics.compilation_time)}ms</div>
-                  <div style="font-size: 11px; color: var(--vscode-text-dim); margin-top: 4px;">Compilation Time</div>
-                </div>
-              ` : ''}
-            </div>
-          </div>
-        ` : ''}
-
-        <!-- Recommendations Card -->
-        ${recommendations.length > 0 ? `
-          <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-            <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 12px;">Recommendations</h3>
-            <div style="display: flex; flex-direction: column; gap: 8px;">
-              ${recommendations.map(rec => `
-                <div style="display: flex; align-items: start; gap: 8px; padding: 8px; background-color: var(--vscode-bg); border-radius: 2px;">
-                  <span style="font-size: 16px;">💡</span>
-                  <div style="flex: 1;">
-                    <div style="font-size: 12px; margin-bottom: 2px;">${ComponentHelpers.escapeHtml(rec.title || rec)}</div>
-                    ${rec.description ? `
-                      <div style="font-size: 11px; color: var(--vscode-text-dim);">${ComponentHelpers.escapeHtml(rec.description)}</div>
-                    ` : ''}
-                  </div>
-                </div>
-              `).join('')}
-            </div>
-          </div>
-        ` : ''}
-
-        <!-- Last Updated -->
-        <div style="font-size: 11px; color: var(--vscode-text-dim); text-align: center; padding-top: 8px;">
-          Last updated: ${ComponentHelpers.formatTimestamp(new Date())}
-          ${this.autoRefresh ? '• Auto-refreshing every 5s' : ''}
-        </div>
-      </div>
-    `;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 16px; height: 100%; display: flex; flex-direction: column;">
-        <div style="margin-bottom: 16px; display: flex; gap: 12px; align-items: center; justify-content: flex-end;">
-          <label style="display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--vscode-text);">
-            <input type="checkbox" id="system-auto-refresh" />
-            Auto-refresh
-          </label>
-          <button id="system-refresh-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-            🔄 Refresh
-          </button>
-        </div>
-        <div id="system-content" style="flex: 1; overflow-y: auto;">
-          ${ComponentHelpers.renderLoading('Initializing...')}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-system-log', DSSystemLog);
-
-export default DSSystemLog;
diff --git a/admin-ui/js/components/tools/ds-test-results.js b/admin-ui/js/components/tools/ds-test-results.js
deleted file mode 100644
index b5ab6ca..0000000
--- a/admin-ui/js/components/tools/ds-test-results.js
+++ /dev/null
@@ -1,352 +0,0 @@
-/**
- * ds-test-results.js
- * Test results viewer with polling for Jest/test runner output
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSTestResults extends HTMLElement {
-  constructor() {
-    super();
-    this.testResults = null;
-    this.isRunning = false;
-    this.pollInterval = null;
-    this.autoRefresh = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.loadTestResults();
-  }
-
-  disconnectedCallback() {
-    if (this.pollInterval) {
-      clearInterval(this.pollInterval);
-    }
-  }
-
-  setupEventListeners() {
-    const runBtn = this.querySelector('#run-tests-btn');
-    if (runBtn) {
-      runBtn.addEventListener('click', () => this.runTests());
-    }
-
-    const refreshBtn = this.querySelector('#refresh-tests-btn');
-    if (refreshBtn) {
-      refreshBtn.addEventListener('click', () => this.loadTestResults());
-    }
-
-    const autoRefreshToggle = this.querySelector('#auto-refresh-tests');
-    if (autoRefreshToggle) {
-      autoRefreshToggle.addEventListener('change', (e) => {
-        this.autoRefresh = e.target.checked;
-        if (this.autoRefresh) {
-          this.pollInterval = setInterval(() => this.loadTestResults(), 3000);
-        } else {
-          if (this.pollInterval) {
-            clearInterval(this.pollInterval);
-            this.pollInterval = null;
-          }
-        }
-      });
-    }
-  }
-
-  /**
-   * Load test results from localStorage or file system
-   * In a real implementation, this would call an MCP tool to read test output files
-   */
-  async loadTestResults() {
-    const content = this.querySelector('#test-results-content');
-    if (!content) return;
-
-    try {
-      // Try to load from localStorage (mock data for now)
-      const stored = localStorage.getItem('ds-test-results');
-      if (stored) {
-        this.testResults = JSON.parse(stored);
-        this.renderResults();
-      } else {
-        // No results yet
-        content.innerHTML = ComponentHelpers.renderEmpty(
-          'No test results available. Run tests to see results.',
-          '🧪'
-        );
-      }
-    } catch (error) {
-      console.error('Failed to load test results:', error);
-      content.innerHTML = ComponentHelpers.renderError('Failed to load test results', error);
-    }
-  }
-
-  /**
-   * Run tests (would call npm test or similar via MCP)
-   */
-  async runTests() {
-    if (this.isRunning) return;
-
-    this.isRunning = true;
-    const runBtn = this.querySelector('#run-tests-btn');
-
-    if (runBtn) {
-      runBtn.disabled = true;
-      runBtn.textContent = '🧪 Running Tests...';
-    }
-
-    const content = this.querySelector('#test-results-content');
-    if (content) {
-      content.innerHTML = ComponentHelpers.renderLoading('Running tests...');
-    }
-
-    try {
-      // MVP1: Execute real npm test command via MCP
-      // Note: This requires project configuration with test scripts
-      const context = toolBridge.getContext();
-
-      // Call backend API to run tests
-      // The backend will execute `npm test` and return parsed results
-      const response = await fetch('/api/test/run', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json'
-        },
-        body: JSON.stringify({
-          projectId: context.projectId,
-          testCommand: 'npm test'
-        })
-      });
-
-      if (!response.ok) {
-        throw new Error(`Test execution failed: ${response.statusText}`);
-      }
-
-      const testResults = await response.json();
-
-      // Validate results structure
-      if (!testResults || !testResults.summary) {
-        throw new Error('Invalid test results format');
-      }
-
-      this.testResults = {
-        ...testResults,
-        timestamp: new Date().toISOString()
-      };
-
-      // Save to localStorage for offline viewing
-      localStorage.setItem('ds-test-results', JSON.stringify(this.testResults));
-
-      this.renderResults();
-
-      ComponentHelpers.showToast?.(
-        `Tests completed: ${this.testResults.summary.passed}/${this.testResults.summary.total} passed`,
-        this.testResults.summary.failed > 0 ? 'error' : 'success'
-      );
-    } catch (error) {
-      console.error('Failed to run tests:', error);
-      ComponentHelpers.showToast?.(`Test execution failed: ${error.message}`, 'error');
-
-      if (content) {
-        content.innerHTML = ComponentHelpers.renderError('Test execution failed', error);
-      }
-    } finally {
-      this.isRunning = false;
-      if (runBtn) {
-        runBtn.disabled = false;
-        runBtn.textContent = '🧪 Run Tests';
-      }
-    }
-  }
-
-  getStatusIcon(status) {
-    const icons = {
-      passed: '✅',
-      failed: '❌',
-      skipped: '⏭️'
-    };
-    return icons[status] || '⚪';
-  }
-
-  getStatusBadge(status) {
-    const types = {
-      passed: 'success',
-      failed: 'error',
-      skipped: 'warning'
-    };
-    return ComponentHelpers.createBadge(status, types[status] || 'info');
-  }
-
-  renderResults() {
-    const content = this.querySelector('#test-results-content');
-    if (!content || !this.testResults) return;
-
-    const { summary, suites, coverage, timestamp } = this.testResults;
-
-    // Calculate pass rate
-    const passRate = ((summary.passed / summary.total) * 100).toFixed(1);
-
-    content.innerHTML = `
-      <!-- Summary Stats -->
-      <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-          <h4 style="font-size: 12px; font-weight: 600;">Test Summary</h4>
-          ${summary.failed === 0 ? ComponentHelpers.createBadge('All Tests Passed', 'success') : ComponentHelpers.createBadge(`${summary.failed} Failed`, 'error')}
-        </div>
-
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 16px; font-size: 11px; margin-bottom: 12px;">
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${summary.total}</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Total Tests</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: #89d185;">${summary.passed}</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Passed</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: #f48771;">${summary.failed}</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Failed</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: #ffbf00;">${summary.skipped}</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Skipped</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${passRate}%</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Pass Rate</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${summary.duration}s</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Duration</div>
-          </div>
-        </div>
-
-        <div style="font-size: 10px; color: var(--vscode-text-dim);">
-          Last run: ${ComponentHelpers.formatRelativeTime(new Date(timestamp))}
-        </div>
-      </div>
-
-      ${coverage ? `
-        <!-- Coverage Stats -->
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-          <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Code Coverage</h4>
-
-          <div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;">
-            ${this.renderCoverageBar('Lines', coverage.lines)}
-            ${this.renderCoverageBar('Functions', coverage.functions)}
-            ${this.renderCoverageBar('Branches', coverage.branches)}
-            ${this.renderCoverageBar('Statements', coverage.statements)}
-          </div>
-        </div>
-      ` : ''}
-
-      <!-- Test Suites -->
-      <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-        <h4 style="font-size: 12px; font-weight: 600; margin-bottom: 12px;">Test Suites</h4>
-
-        ${suites.map(suite => this.renderSuite(suite)).join('')}
-      </div>
-    `;
-  }
-
-  renderCoverageBar(label, percentage) {
-    let color = '#f48771'; // Red
-    if (percentage >= 80) color = '#89d185'; // Green
-    else if (percentage >= 60) color = '#ffbf00'; // Yellow
-
-    return `
-      <div>
-        <div style="display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 11px;">
-          <span>${label}</span>
-          <span style="font-weight: 600;">${percentage}%</span>
-        </div>
-        <div style="height: 8px; background-color: var(--vscode-bg); border-radius: 4px; overflow: hidden;">
-          <div style="height: 100%; width: ${percentage}%; background-color: ${color}; transition: width 0.3s;"></div>
-        </div>
-      </div>
-    `;
-  }
-
-  renderSuite(suite) {
-    const suiteId = `suite-${suite.name.replace(/\s+/g, '-').toLowerCase()}`;
-    const passedCount = suite.tests.filter(t => t.status === 'passed').length;
-    const failedCount = suite.tests.filter(t => t.status === 'failed').length;
-
-    return `
-      <div style="margin-bottom: 16px; border: 1px solid var(--vscode-border); border-radius: 4px; overflow: hidden;">
-        <div
-          style="padding: 12px; background-color: var(--vscode-bg); cursor: pointer; display: flex; justify-content: space-between; align-items: center;"
-          onclick="document.getElementById('${suiteId}').style.display = document.getElementById('${suiteId}').style.display === 'none' ? 'block' : 'none'"
-        >
-          <div>
-            <div style="font-size: 12px; font-weight: 600; margin-bottom: 4px;">${ComponentHelpers.escapeHtml(suite.name)}</div>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">
-              ${passedCount} passed, ${failedCount} failed of ${suite.tests.length} tests
-            </div>
-          </div>
-          <div style="font-size: 18px;">▼</div>
-        </div>
-
-        <div id="${suiteId}" style="display: none;">
-          ${suite.tests.map(test => this.renderTest(test)).join('')}
-        </div>
-      </div>
-    `;
-  }
-
-  renderTest(test) {
-    const icon = this.getStatusIcon(test.status);
-    const badge = this.getStatusBadge(test.status);
-
-    return `
-      <div style="padding: 12px; border-top: 1px solid var(--vscode-border); display: flex; justify-content: space-between; align-items: start;">
-        <div style="flex: 1;">
-          <div style="display: flex; align-items: center; gap: 8px; margin-bottom: 4px;">
-            <span style="font-size: 14px;">${icon}</span>
-            <span style="font-size: 11px; font-family: 'Courier New', monospace;">${ComponentHelpers.escapeHtml(test.name)}</span>
-            ${badge}
-          </div>
-
-          ${test.error ? `
-            <div style="margin-top: 8px; padding: 8px; background-color: rgba(244, 135, 113, 0.1); border-left: 3px solid #f48771; border-radius: 2px;">
-              <div style="font-size: 10px; font-family: 'Courier New', monospace; color: #f48771;">
-                ${ComponentHelpers.escapeHtml(test.error)}
-              </div>
-            </div>
-          ` : ''}
-        </div>
-
-        <div style="font-size: 10px; color: var(--vscode-text-dim); white-space: nowrap; margin-left: 12px;">
-          ${test.duration}s
-        </div>
-      </div>
-    `;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 16px; height: 100%; display: flex; flex-direction: column;">
-        <div style="margin-bottom: 16px; display: flex; gap: 12px; align-items: center; justify-content: flex-end;">
-          <label style="display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--vscode-text);">
-            <input type="checkbox" id="auto-refresh-tests" />
-            Auto-refresh
-          </label>
-          <button id="refresh-tests-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-            🔄 Refresh
-          </button>
-          <button id="run-tests-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-            🧪 Run Tests
-          </button>
-        </div>
-
-        <div id="test-results-content" style="flex: 1; overflow-y: auto;">
-          ${ComponentHelpers.renderLoading('Loading test results...')}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-test-results', DSTestResults);
-
-export default DSTestResults;
diff --git a/admin-ui/js/components/tools/ds-token-inspector.js b/admin-ui/js/components/tools/ds-token-inspector.js
deleted file mode 100644
index 48cc631..0000000
--- a/admin-ui/js/components/tools/ds-token-inspector.js
+++ /dev/null
@@ -1,249 +0,0 @@
-/**
- * ds-token-inspector.js
- * Token inspector for viewing and searching design tokens
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-class DSTokenInspector extends HTMLElement {
-  constructor() {
-    super();
-    this.tokens = null;
-    this.filteredTokens = null;
-    this.searchTerm = '';
-    this.currentCategory = 'all';
-    this.manifestPath = '/home/overbits/dss/admin-ui/ds.config.json';
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    this.loadTokens();
-  }
-
-  setupEventListeners() {
-    const refreshBtn = this.querySelector('#token-refresh-btn');
-    if (refreshBtn) {
-      refreshBtn.addEventListener('click', () => this.loadTokens(true));
-    }
-
-    const searchInput = this.querySelector('#token-search');
-    if (searchInput) {
-      const debouncedSearch = ComponentHelpers.debounce((term) => {
-        this.searchTerm = term.toLowerCase();
-        this.filterTokens();
-      }, 300);
-
-      searchInput.addEventListener('input', (e) => debouncedSearch(e.target.value));
-    }
-
-    const categoryFilter = this.querySelector('#token-category');
-    if (categoryFilter) {
-      categoryFilter.addEventListener('change', (e) => {
-        this.currentCategory = e.target.value;
-        this.filterTokens();
-      });
-    }
-  }
-
-  async loadTokens(forceRefresh = false) {
-    const content = this.querySelector('#token-content');
-    if (!content) return;
-
-    content.innerHTML = ComponentHelpers.renderLoading('Loading tokens from Context Compiler...');
-
-    try {
-      const result = await toolBridge.getTokens(this.manifestPath);
-
-      if (result && result.tokens) {
-        this.tokens = this.flattenTokens(result.tokens);
-        this.filterTokens();
-      } else {
-        content.innerHTML = ComponentHelpers.renderEmpty('No tokens found', '🎨');
-      }
-    } catch (error) {
-      console.error('Failed to load tokens:', error);
-      content.innerHTML = ComponentHelpers.renderError('Failed to load tokens', error);
-    }
-  }
-
-  flattenTokens(tokens, prefix = '') {
-    const flattened = [];
-
-    for (const [key, value] of Object.entries(tokens)) {
-      const path = prefix ? `${prefix}.${key}` : key;
-
-      if (value && typeof value === 'object' && !value.$value) {
-        // Nested object - recurse
-        flattened.push(...this.flattenTokens(value, path));
-      } else {
-        // Token leaf node
-        flattened.push({
-          path,
-          value: value.$value || value,
-          type: value.$type || this.inferType(value.$value || value),
-          description: value.$description || '',
-          category: this.extractCategory(path)
-        });
-      }
-    }
-
-    return flattened;
-  }
-
-  extractCategory(path) {
-    const parts = path.split('.');
-    return parts[0] || 'other';
-  }
-
-  inferType(value) {
-    if (typeof value === 'string') {
-      if (value.startsWith('#') || value.startsWith('rgb')) return 'color';
-      if (value.endsWith('px') || value.endsWith('rem') || value.endsWith('em')) return 'dimension';
-      return 'string';
-    }
-    if (typeof value === 'number') return 'number';
-    return 'unknown';
-  }
-
-  filterTokens() {
-    if (!this.tokens) return;
-
-    let filtered = [...this.tokens];
-
-    // Filter by category
-    if (this.currentCategory !== 'all') {
-      filtered = filtered.filter(token => token.category === this.currentCategory);
-    }
-
-    // Filter by search term
-    if (this.searchTerm) {
-      filtered = filtered.filter(token =>
-        token.path.toLowerCase().includes(this.searchTerm) ||
-        String(token.value).toLowerCase().includes(this.searchTerm) ||
-        token.description.toLowerCase().includes(this.searchTerm)
-      );
-    }
-
-    this.filteredTokens = filtered;
-    this.renderTokens();
-  }
-
-  getCategories() {
-    if (!this.tokens) return [];
-    const categories = new Set(this.tokens.map(t => t.category));
-    return Array.from(categories).sort();
-  }
-
-  renderTokens() {
-    const content = this.querySelector('#token-content');
-    if (!content) return;
-
-    if (!this.filteredTokens || this.filteredTokens.length === 0) {
-      content.innerHTML = ComponentHelpers.renderEmpty(
-        this.searchTerm ? 'No tokens match your search' : 'No tokens available',
-        '🔍'
-      );
-      return;
-    }
-
-    const tokenRows = this.filteredTokens.map(token => {
-      const colorPreview = token.type === 'color' ? `
-        <div style="
-          width: 20px;
-          height: 20px;
-          background-color: ${token.value};
-          border: 1px solid var(--vscode-border);
-          border-radius: 2px;
-          margin-right: 8px;
-        "></div>
-      ` : '';
-
-      return `
-        <tr style="border-bottom: 1px solid var(--vscode-border);">
-          <td style="padding: 12px 16px; font-family: 'Courier New', monospace; font-size: 11px; color: var(--vscode-accent);">
-            ${ComponentHelpers.escapeHtml(token.path)}
-          </td>
-          <td style="padding: 12px 16px;">
-            <div style="display: flex; align-items: center;">
-              ${colorPreview}
-              <span style="font-size: 12px; font-family: 'Courier New', monospace;">
-                ${ComponentHelpers.escapeHtml(String(token.value))}
-              </span>
-            </div>
-          </td>
-          <td style="padding: 12px 16px;">
-            ${ComponentHelpers.createBadge(token.type, 'info')}
-          </td>
-          <td style="padding: 12px 16px; font-size: 11px; color: var(--vscode-text-dim);">
-            ${ComponentHelpers.escapeHtml(token.description || '-')}
-          </td>
-        </tr>
-      `;
-    }).join('');
-
-    content.innerHTML = `
-      <div style="margin-bottom: 12px; padding: 12px; background-color: var(--vscode-sidebar); border-radius: 4px;">
-        <div style="font-size: 11px; color: var(--vscode-text-dim);">
-          Showing ${this.filteredTokens.length} of ${this.tokens.length} tokens
-        </div>
-      </div>
-      <div style="overflow-x: auto;">
-        <table style="width: 100%; border-collapse: collapse; background-color: var(--vscode-sidebar);">
-          <thead>
-            <tr style="border-bottom: 2px solid var(--vscode-border);">
-              <th style="padding: 12px 16px; text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-text-dim);">
-                Token Path
-              </th>
-              <th style="padding: 12px 16px; text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-text-dim);">
-                Value
-              </th>
-              <th style="padding: 12px 16px; text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-text-dim);">
-                Type
-              </th>
-              <th style="padding: 12px 16px; text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-text-dim);">
-                Description
-              </th>
-            </tr>
-          </thead>
-          <tbody>
-            ${tokenRows}
-          </tbody>
-        </table>
-      </div>
-    `;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 16px; height: 100%; display: flex; flex-direction: column;">
-        <div style="margin-bottom: 16px; display: flex; gap: 12px; align-items: center;">
-          <input
-            type="text"
-            id="token-search"
-            placeholder="Search tokens..."
-            class="input"
-            style="flex: 1; min-width: 200px;"
-          />
-          <select id="token-category" class="input" style="width: 150px;">
-            <option value="all">All Categories</option>
-            ${this.getCategories().map(cat =>
-              `<option value="${cat}">${cat}</option>`
-            ).join('')}
-          </select>
-          <button id="token-refresh-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-            🔄 Refresh
-          </button>
-        </div>
-        <div id="token-content" style="flex: 1; overflow-y: auto;">
-          ${ComponentHelpers.renderLoading('Initializing...')}
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-token-inspector', DSTokenInspector);
-
-export default DSTokenInspector;
diff --git a/admin-ui/js/components/tools/ds-token-list.js b/admin-ui/js/components/tools/ds-token-list.js
deleted file mode 100644
index 2a6a050..0000000
--- a/admin-ui/js/components/tools/ds-token-list.js
+++ /dev/null
@@ -1,201 +0,0 @@
-/**
- * ds-token-list.js
- * List view of all design tokens in the project
- * UX Team Tool #2
- */
-
-import { createListView, setupListHandlers } from '../../utils/tool-templates.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-import contextStore from '../../stores/context-store.js';
-import toolBridge from '../../services/tool-bridge.js';
-
-class DSTokenList extends HTMLElement {
-  constructor() {
-    super();
-    this.tokens = [];
-    this.filteredTokens = [];
-    this.isLoading = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    await this.loadTokens();
-  }
-
-  async loadTokens() {
-    this.isLoading = true;
-    const container = this.querySelector('#token-list-container');
-    if (container) {
-      container.innerHTML = ComponentHelpers.renderLoading('Loading design tokens...');
-    }
-
-    try {
-      const context = contextStore.getMCPContext();
-      if (!context.project_id) {
-        throw new Error('No project selected');
-      }
-
-      // Try to get resolved context which includes all tokens
-      const result = await toolBridge.executeTool('dss_get_resolved_context', {
-        manifest_path: `/projects/${context.project_id}/ds.config.json`
-      });
-
-      // Extract tokens from result
-      this.tokens = this.extractTokensFromContext(result);
-      this.filteredTokens = [...this.tokens];
-
-      this.renderTokenList();
-    } catch (error) {
-      console.error('[DSTokenList] Failed to load tokens:', error);
-      if (container) {
-        container.innerHTML = ComponentHelpers.renderError('Failed to load tokens', error);
-      }
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  extractTokensFromContext(context) {
-    const tokens = [];
-
-    // Extract from colors, typography, spacing, etc.
-    const categories = ['colors', 'typography', 'spacing', 'shadows', 'borders', 'radii'];
-
-    for (const category of categories) {
-      if (context[category]) {
-        for (const [key, value] of Object.entries(context[category])) {
-          tokens.push({
-            category,
-            name: key,
-            value: typeof value === 'object' ? JSON.stringify(value) : String(value),
-            type: this.inferTokenType(category, key, value)
-          });
-        }
-      }
-    }
-
-    return tokens;
-  }
-
-  inferTokenType(category, key, value) {
-    if (category === 'colors') return 'color';
-    if (category === 'typography') return 'font';
-    if (category === 'spacing') return 'size';
-    if (category === 'shadows') return 'shadow';
-    if (category === 'borders') return 'border';
-    if (category === 'radii') return 'radius';
-    return 'other';
-  }
-
-  renderTokenList() {
-    const container = this.querySelector('#token-list-container');
-    if (!container) return;
-
-    const config = {
-      title: 'Design Tokens',
-      items: this.filteredTokens,
-      columns: [
-        {
-          key: 'name',
-          label: 'Token Name',
-          render: (token) => `<span style="font-family: monospace; font-size: 11px;">${ComponentHelpers.escapeHtml(token.name)}</span>`
-        },
-        {
-          key: 'category',
-          label: 'Category',
-          render: (token) => ComponentHelpers.createBadge(token.category, 'info')
-        },
-        {
-          key: 'value',
-          label: 'Value',
-          render: (token) => {
-            if (token.type === 'color') {
-              return `
-                <div style="display: flex; align-items: center; gap: 8px;">
-                  <div style="width: 20px; height: 20px; background: ${ComponentHelpers.escapeHtml(token.value)}; border: 1px solid var(--vscode-border); border-radius: 2px;"></div>
-                  <span style="font-family: monospace; font-size: 10px;">${ComponentHelpers.escapeHtml(token.value)}</span>
-                </div>
-              `;
-            }
-            return `<span style="font-family: monospace; font-size: 10px;">${ComponentHelpers.escapeHtml(token.value)}</span>`;
-          }
-        },
-        {
-          key: 'type',
-          label: 'Type',
-          render: (token) => `<span style="font-size: 10px; color: var(--vscode-text-dim);">${ComponentHelpers.escapeHtml(token.type)}</span>`
-        }
-      ],
-      actions: [
-        {
-          label: 'Export All',
-          icon: '📥',
-          onClick: () => this.exportTokens()
-        },
-        {
-          label: 'Refresh',
-          icon: '🔄',
-          onClick: () => this.loadTokens()
-        }
-      ],
-      onSearch: (query) => this.handleSearch(query),
-      onFilter: (filterValue) => this.handleFilter(filterValue)
-    };
-
-    container.innerHTML = createListView(config);
-    setupListHandlers(container, config);
-
-    // Update filter dropdown with categories
-    const filterSelect = container.querySelector('#filter-select');
-    if (filterSelect) {
-      const categories = [...new Set(this.tokens.map(t => t.category))];
-      filterSelect.innerHTML = `
-        <option value="">All Categories</option>
-        ${categories.map(cat => `<option value="${cat}">${cat}</option>`).join('')}
-      `;
-    }
-  }
-
-  handleSearch(query) {
-    const lowerQuery = query.toLowerCase();
-    this.filteredTokens = this.tokens.filter(token =>
-      token.name.toLowerCase().includes(lowerQuery) ||
-      token.value.toLowerCase().includes(lowerQuery) ||
-      token.category.toLowerCase().includes(lowerQuery)
-    );
-    this.renderTokenList();
-  }
-
-  handleFilter(filterValue) {
-    if (!filterValue) {
-      this.filteredTokens = [...this.tokens];
-    } else {
-      this.filteredTokens = this.tokens.filter(token => token.category === filterValue);
-    }
-    this.renderTokenList();
-  }
-
-  exportTokens() {
-    const data = JSON.stringify(this.tokens, null, 2);
-    const blob = new Blob([data], { type: 'application/json' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = 'design-tokens.json';
-    a.click();
-    URL.revokeObjectURL(url);
-    ComponentHelpers.showToast?.('Tokens exported', 'success');
-  }
-
-  render() {
-    this.innerHTML = `
-      <div id="token-list-container" style="height: 100%; overflow: hidden;">
-        ${ComponentHelpers.renderLoading('Loading tokens...')}
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-token-list', DSTokenList);
-
-export default DSTokenList;
diff --git a/admin-ui/js/components/tools/ds-visual-diff.js b/admin-ui/js/components/tools/ds-visual-diff.js
deleted file mode 100644
index 4b7d3aa..0000000
--- a/admin-ui/js/components/tools/ds-visual-diff.js
+++ /dev/null
@@ -1,382 +0,0 @@
-/**
- * ds-visual-diff.js
- * Visual diff tool for comparing design changes using Pixelmatch
- */
-
-import toolBridge from '../../services/tool-bridge.js';
-import { ComponentHelpers } from '../../utils/component-helpers.js';
-
-// Load Pixelmatch from CDN
-let pixelmatch = null;
-
-class DSVisualDiff extends HTMLElement {
-  constructor() {
-    super();
-    this.screenshots = [];
-    this.beforeImage = null;
-    this.afterImage = null;
-    this.diffResult = null;
-    this.isComparing = false;
-    this.pixelmatchLoaded = false;
-  }
-
-  async connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-    await this.loadPixelmatch();
-    await this.loadScreenshots();
-  }
-
-  /**
-   * Load Pixelmatch library from CDN
-   */
-  async loadPixelmatch() {
-    if (this.pixelmatchLoaded) return;
-
-    try {
-      // Import pixelmatch from esm.sh CDN
-      const module = await import('https://esm.sh/pixelmatch@5.3.0');
-      pixelmatch = module.default;
-      this.pixelmatchLoaded = true;
-      console.log('[DSVisualDiff] Pixelmatch loaded successfully');
-    } catch (error) {
-      console.error('[DSVisualDiff] Failed to load Pixelmatch:', error);
-      ComponentHelpers.showToast?.('Failed to load visual diff library', 'error');
-    }
-  }
-
-  /**
-   * Load screenshots from IndexedDB (shared with ds-screenshot-gallery)
-   */
-  async loadScreenshots() {
-    try {
-      const db = await this.openDB();
-      this.screenshots = await this.getAllScreenshots(db);
-      this.renderSelectors();
-    } catch (error) {
-      console.error('Failed to load screenshots:', error);
-    }
-  }
-
-  async openDB() {
-    return new Promise((resolve, reject) => {
-      const request = indexedDB.open('ds-screenshots', 1);
-      request.onerror = () => reject(request.error);
-      request.onsuccess = () => resolve(request.result);
-    });
-  }
-
-  async getAllScreenshots(db) {
-    return new Promise((resolve, reject) => {
-      const transaction = db.transaction(['screenshots'], 'readonly');
-      const store = transaction.objectStore('screenshots');
-      const request = store.getAll();
-
-      request.onsuccess = () => resolve(request.result.reverse());
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  setupEventListeners() {
-    const compareBtn = this.querySelector('#visual-diff-compare-btn');
-    if (compareBtn) {
-      compareBtn.addEventListener('click', () => this.compareImages());
-    }
-  }
-
-  /**
-   * Load image data and decode to ImageData
-   */
-  async loadImageData(imageDataUrl) {
-    return new Promise((resolve, reject) => {
-      const img = new Image();
-      img.crossOrigin = 'anonymous';
-
-      img.onload = () => {
-        const canvas = document.createElement('canvas');
-        canvas.width = img.width;
-        canvas.height = img.height;
-
-        const ctx = canvas.getContext('2d');
-        ctx.drawImage(img, 0, 0);
-
-        const imageData = ctx.getImageData(0, 0, img.width, img.height);
-        resolve(imageData);
-      };
-
-      img.onerror = () => reject(new Error('Failed to load image'));
-      img.src = imageDataUrl;
-    });
-  }
-
-  /**
-   * Compare two images using Pixelmatch
-   */
-  async compareImages() {
-    if (this.isComparing || !this.pixelmatchLoaded) return;
-
-    const beforeSelect = this.querySelector('#before-image-select');
-    const afterSelect = this.querySelector('#after-image-select');
-
-    if (!beforeSelect || !afterSelect) return;
-
-    const beforeId = parseInt(beforeSelect.value);
-    const afterId = parseInt(afterSelect.value);
-
-    if (!beforeId || !afterId) {
-      ComponentHelpers.showToast?.('Please select both before and after images', 'error');
-      return;
-    }
-
-    if (beforeId === afterId) {
-      ComponentHelpers.showToast?.('Please select different images to compare', 'error');
-      return;
-    }
-
-    this.isComparing = true;
-    const compareBtn = this.querySelector('#visual-diff-compare-btn');
-
-    if (compareBtn) {
-      compareBtn.disabled = true;
-      compareBtn.textContent = '🔍 Comparing...';
-    }
-
-    try {
-      // Get screenshot objects
-      this.beforeImage = this.screenshots.find(s => s.id === beforeId);
-      this.afterImage = this.screenshots.find(s => s.id === afterId);
-
-      if (!this.beforeImage || !this.afterImage) {
-        throw new Error('Screenshots not found');
-      }
-
-      // Load image data
-      const beforeData = await this.loadImageData(this.beforeImage.imageData);
-      const afterData = await this.loadImageData(this.afterImage.imageData);
-
-      // Ensure images are same size
-      if (beforeData.width !== afterData.width || beforeData.height !== afterData.height) {
-        throw new Error(`Image dimensions don't match: ${beforeData.width}x${beforeData.height} vs ${afterData.width}x${afterData.height}`);
-      }
-
-      // Create diff canvas
-      const diffCanvas = document.createElement('canvas');
-      diffCanvas.width = beforeData.width;
-      diffCanvas.height = beforeData.height;
-      const diffCtx = diffCanvas.getContext('2d');
-      const diffImageData = diffCtx.createImageData(beforeData.width, beforeData.height);
-
-      // Run pixelmatch comparison
-      const numDiffPixels = pixelmatch(
-        beforeData.data,
-        afterData.data,
-        diffImageData.data,
-        beforeData.width,
-        beforeData.height,
-        {
-          threshold: 0.1,
-          includeAA: false,
-          alpha: 0.1,
-          diffColor: [255, 0, 0]
-        }
-      );
-
-      // Put diff data on canvas
-      diffCtx.putImageData(diffImageData, 0, 0);
-
-      // Calculate difference percentage
-      const totalPixels = beforeData.width * beforeData.height;
-      const diffPercentage = ((numDiffPixels / totalPixels) * 100).toFixed(2);
-
-      this.diffResult = {
-        beforeImage: this.beforeImage,
-        afterImage: this.afterImage,
-        diffImageData: diffCanvas.toDataURL(),
-        numDiffPixels,
-        totalPixels,
-        diffPercentage,
-        timestamp: new Date()
-      };
-
-      this.renderDiffResult();
-
-      ComponentHelpers.showToast?.(
-        `Comparison complete: ${diffPercentage}% difference`,
-        diffPercentage < 1 ? 'success' : diffPercentage < 10 ? 'warning' : 'error'
-      );
-    } catch (error) {
-      console.error('Failed to compare images:', error);
-      ComponentHelpers.showToast?.(`Comparison failed: ${error.message}`, 'error');
-
-      const diffContent = this.querySelector('#diff-result-content');
-      if (diffContent) {
-        diffContent.innerHTML = ComponentHelpers.renderError('Comparison failed', error);
-      }
-    } finally {
-      this.isComparing = false;
-      if (compareBtn) {
-        compareBtn.disabled = false;
-        compareBtn.textContent = '🔍 Compare';
-      }
-    }
-  }
-
-  renderSelectors() {
-    const beforeSelect = this.querySelector('#before-image-select');
-    const afterSelect = this.querySelector('#after-image-select');
-
-    if (!beforeSelect || !afterSelect) return;
-
-    const options = this.screenshots.map(screenshot => {
-      const timestamp = ComponentHelpers.formatTimestamp(new Date(screenshot.timestamp));
-      return `<option value="${screenshot.id}">${ComponentHelpers.escapeHtml(screenshot.selector)} - ${timestamp}</option>`;
-    }).join('');
-
-    const emptyOption = '<option value="">-- Select Screenshot --</option>';
-
-    beforeSelect.innerHTML = emptyOption + options;
-    afterSelect.innerHTML = emptyOption + options;
-  }
-
-  renderDiffResult() {
-    const diffContent = this.querySelector('#diff-result-content');
-    if (!diffContent || !this.diffResult) return;
-
-    const { diffPercentage, numDiffPixels, totalPixels } = this.diffResult;
-
-    // Determine status badge
-    let statusBadge;
-    if (diffPercentage < 1) {
-      statusBadge = ComponentHelpers.createBadge('Identical', 'success');
-    } else if (diffPercentage < 10) {
-      statusBadge = ComponentHelpers.createBadge('Minor Changes', 'warning');
-    } else {
-      statusBadge = ComponentHelpers.createBadge('Significant Changes', 'error');
-    }
-
-    diffContent.innerHTML = `
-      <!-- Stats Card -->
-      <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px; margin-bottom: 16px;">
-        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-          <h4 style="font-size: 12px; font-weight: 600;">Comparison Result</h4>
-          ${statusBadge}
-        </div>
-
-        <div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; font-size: 11px;">
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${diffPercentage}%</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Difference</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${numDiffPixels.toLocaleString()}</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Pixels Changed</div>
-          </div>
-          <div style="text-align: center;">
-            <div style="font-size: 24px; font-weight: 600; color: var(--vscode-text);">${totalPixels.toLocaleString()}</div>
-            <div style="color: var(--vscode-text-dim); margin-top: 4px;">Total Pixels</div>
-          </div>
-        </div>
-      </div>
-
-      <!-- Image Comparison Grid -->
-      <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px;">
-        <!-- Before Image -->
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; overflow: hidden;">
-          <div style="padding: 12px; border-bottom: 1px solid var(--vscode-border);">
-            <div style="font-size: 11px; font-weight: 600; margin-bottom: 4px;">Before</div>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">${ComponentHelpers.escapeHtml(this.diffResult.beforeImage.selector)}</div>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">${ComponentHelpers.formatRelativeTime(new Date(this.diffResult.beforeImage.timestamp))}</div>
-          </div>
-          <div style="aspect-ratio: 16/9; overflow: hidden; background: var(--vscode-bg);">
-            <img src="${this.diffResult.beforeImage.imageData}" style="width: 100%; height: 100%; object-fit: contain;" alt="Before" />
-          </div>
-        </div>
-
-        <!-- After Image -->
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; overflow: hidden;">
-          <div style="padding: 12px; border-bottom: 1px solid var(--vscode-border);">
-            <div style="font-size: 11px; font-weight: 600; margin-bottom: 4px;">After</div>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">${ComponentHelpers.escapeHtml(this.diffResult.afterImage.selector)}</div>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">${ComponentHelpers.formatRelativeTime(new Date(this.diffResult.afterImage.timestamp))}</div>
-          </div>
-          <div style="aspect-ratio: 16/9; overflow: hidden; background: var(--vscode-bg);">
-            <img src="${this.diffResult.afterImage.imageData}" style="width: 100%; height: 100%; object-fit: contain;" alt="After" />
-          </div>
-        </div>
-
-        <!-- Diff Image -->
-        <div style="background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; overflow: hidden; grid-column: span 2;">
-          <div style="padding: 12px; border-bottom: 1px solid var(--vscode-border);">
-            <div style="font-size: 11px; font-weight: 600; margin-bottom: 4px;">Visual Diff</div>
-            <div style="font-size: 10px; color: var(--vscode-text-dim);">Red pixels indicate changes</div>
-          </div>
-          <div style="aspect-ratio: 16/9; overflow: hidden; background: var(--vscode-bg);">
-            <img src="${this.diffResult.diffImageData}" style="width: 100%; height: 100%; object-fit: contain;" alt="Diff" />
-          </div>
-        </div>
-      </div>
-
-      <div style="margin-top: 12px; padding: 8px; background-color: var(--vscode-sidebar); border-radius: 4px; font-size: 10px; color: var(--vscode-text-dim);">
-        💡 Red pixels show where the images differ. Lower percentages indicate more similarity.
-      </div>
-    `;
-  }
-
-  render() {
-    this.innerHTML = `
-      <div style="padding: 16px; height: 100%; display: flex; flex-direction: column;">
-        <!-- Selector Controls -->
-        <div style="margin-bottom: 16px; background-color: var(--vscode-sidebar); border: 1px solid var(--vscode-border); border-radius: 4px; padding: 16px;">
-          <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 12px;">Visual Diff Comparison</h3>
-
-          <div style="display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end;">
-            <div>
-              <label style="display: block; font-size: 11px; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                Before Image
-              </label>
-              <select id="before-image-select" class="input" style="width: 100%; font-size: 11px;">
-                <option value="">-- Select Screenshot --</option>
-              </select>
-            </div>
-
-            <div>
-              <label style="display: block; font-size: 11px; margin-bottom: 4px; color: var(--vscode-text-dim);">
-                After Image
-              </label>
-              <select id="after-image-select" class="input" style="width: 100%; font-size: 11px;">
-                <option value="">-- Select Screenshot --</option>
-              </select>
-            </div>
-
-            <button id="visual-diff-compare-btn" class="button" style="padding: 4px 12px; font-size: 11px;">
-              🔍 Compare
-            </button>
-          </div>
-
-          ${this.screenshots.length === 0 ? `
-            <div style="margin-top: 12px; padding: 12px; background-color: rgba(255, 191, 0, 0.1); border-radius: 4px;">
-              <div style="font-size: 11px; color: #ffbf00;">
-                ⚠️ No screenshots available. Capture screenshots using the Screenshot Gallery tool first.
-              </div>
-            </div>
-          ` : ''}
-        </div>
-
-        <!-- Diff Result -->
-        <div id="diff-result-content" style="flex: 1; overflow-y: auto;">
-          <div style="text-align: center; padding: 48px; color: var(--vscode-text-dim);">
-            <div style="font-size: 48px; margin-bottom: 16px;">🔍</div>
-            <h3 style="font-size: 14px; font-weight: 600; margin-bottom: 8px;">Ready to Compare</h3>
-            <p style="font-size: 12px;">
-              Select two screenshots above and click "Compare" to see the visual differences.
-            </p>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-visual-diff', DSVisualDiff);
-
-export default DSVisualDiff;
diff --git a/admin-ui/js/config/component-registry.js b/admin-ui/js/config/component-registry.js
deleted file mode 100644
index e42fcb6..0000000
--- a/admin-ui/js/config/component-registry.js
+++ /dev/null
@@ -1,196 +0,0 @@
-/**
- * component-registry.js
- * MVP1: Lazy-loading registry for panel components
- * Components are loaded on-demand to improve performance
- */
-
-/**
- * Component registry maps tag names to dynamic import paths
- * Format: { 'tag-name': () => import('path/to/component.js') }
- */
-export const COMPONENT_REGISTRY = {
-  // Tools components
-  'ds-metrics-panel': () => import('../components/tools/ds-metrics-panel.js'),
-  'ds-console-viewer': () => import('../components/tools/ds-console-viewer.js'),
-  'ds-token-inspector': () => import('../components/tools/ds-token-inspector.js'),
-  'ds-figma-status': () => import('../components/tools/ds-figma-status.js'),
-  'ds-activity-log': () => import('../components/tools/ds-activity-log.js'),
-  'ds-visual-diff': () => import('../components/tools/ds-visual-diff.js'),
-  'ds-accessibility-report': () => import('../components/tools/ds-accessibility-report.js'),
-  'ds-screenshot-gallery': () => import('../components/tools/ds-screenshot-gallery.js'),
-  'ds-network-monitor': () => import('../components/tools/ds-network-monitor.js'),
-  'ds-test-results': () => import('../components/tools/ds-test-results.js'),
-  'ds-system-log': () => import('../components/tools/ds-system-log.js'),
-
-  // Phase 6 Special Tools (MVP2)
-  'ds-figma-extract-quick': () => import('../components/tools/ds-figma-extract-quick.js'),
-  'ds-quick-wins-script': () => import('../components/tools/ds-quick-wins-script.js'),
-  'ds-regression-testing': () => import('../components/tools/ds-regression-testing.js'),
-
-  // Other team-specific tools
-  // UI Team Tools
-  'ds-storybook-figma-compare': () => import('../components/tools/ds-storybook-figma-compare.js'),
-  'ds-storybook-live-compare': () => import('../components/tools/ds-storybook-live-compare.js'),
-  'ds-figma-extraction': () => import('../components/tools/ds-figma-extraction.js'),
-  'ds-project-analysis': () => import('../components/tools/ds-project-analysis.js'),
-
-  // UX Team Tools
-  'ds-figma-plugin': () => import('../components/tools/ds-figma-plugin.js'),
-  'ds-token-list': () => import('../components/tools/ds-token-list.js'),
-  'ds-asset-list': () => import('../components/tools/ds-asset-list.js'),
-  'ds-component-list': () => import('../components/tools/ds-component-list.js'),
-  'ds-navigation-demos': () => import('../components/tools/ds-navigation-demos.js'),
-
-  // QA Team Tools
-  'ds-figma-live-compare': () => import('../components/tools/ds-figma-live-compare.js'),
-  'ds-esre-editor': () => import('../components/tools/ds-esre-editor.js'),
-
-  // Chat components
-  'ds-chat-panel': () => import('../components/tools/ds-chat-panel.js'),
-
-  // Metrics components
-  'ds-frontpage': () => import('../components/metrics/ds-frontpage.js'),
-
-  // Admin components
-  'ds-user-settings': () => import('../components/admin/ds-user-settings.js'),
-
-  // Additional UI & Layout Components
-  'ds-action-bar': () => import('../components/ds-action-bar.js'),
-  'ds-activity-bar': () => import('../components/layout/ds-activity-bar.js'),
-  'ds-admin-settings': () => import('../components/admin/ds-admin-settings.js'),
-  'ds-ai-chat-sidebar': () => import('../components/layout/ds-ai-chat-sidebar.js'),
-  'ds-badge': () => import('../components/ds-badge.js'),
-  'ds-base-tool': () => import('../components/base/ds-base-tool.js'),
-  'ds-button': () => import('../components/ds-button.js'),
-  'ds-card': () => import('../components/ds-card.js'),
-  'ds-component-base': () => import('../components/ds-component-base.js'),
-  'ds-input': () => import('../components/ds-input.js'),
-  'ds-metric-card': () => import('../components/metrics/ds-metric-card.js'),
-  'ds-metrics-dashboard': () => import('../components/metrics/ds-metrics-dashboard.js'),
-  'ds-notification-center': () => import('../components/ds-notification-center.js'),
-  'ds-panel': () => import('../components/layout/ds-panel.js'),
-  'ds-project-list': () => import('../components/admin/ds-project-list.js'),
-  'ds-project-selector': () => import('../components/layout/ds-project-selector.js'),
-  'ds-quick-wins': () => import('../components/tools/ds-quick-wins.js'),
-  'ds-shell': () => import('../components/layout/ds-shell.js'),
-  'ds-toast': () => import('../components/ds-toast.js'),
-  'ds-toast-provider': () => import('../components/ds-toast-provider.js'),
-  'ds-workflow': () => import('../components/ds-workflow.js'),
-
-  // Listing Components
-  'ds-icon-list': () => import('../components/listings/ds-icon-list.js'),
-  'ds-jira-issues': () => import('../components/listings/ds-jira-issues.js'),
-};
-
-// Track loaded components
-const loadedComponents = new Set();
-
-/**
- * MVP1: Lazy-load and hydrate a component
- * @param {string} tagName - Component tag name (e.g., 'ds-metrics-panel')
- * @param {HTMLElement} container - Container to append component to
- * @returns {Promise<HTMLElement>} The created component element
- */
-export async function hydrateComponent(tagName, container) {
-  if (!COMPONENT_REGISTRY[tagName]) {
-    console.warn(`[ComponentRegistry] Unknown component: ${tagName}`);
-    throw new Error(`Component not found in registry: ${tagName}`);
-  }
-
-  try {
-    // Load component if not already loaded
-    if (!loadedComponents.has(tagName)) {
-      console.log(`[ComponentRegistry] Loading component: ${tagName}`);
-      await COMPONENT_REGISTRY[tagName]();
-      loadedComponents.add(tagName);
-    }
-
-    // Verify component was registered as custom element
-    if (!customElements.get(tagName)) {
-      throw new Error(`Component ${tagName} loaded but not defined as custom element`);
-    }
-
-    // Create and append element
-    const element = document.createElement(tagName);
-    if (container) {
-      container.appendChild(element);
-    }
-
-    return element;
-  } catch (error) {
-    console.error(`[ComponentRegistry] Failed to hydrate ${tagName}:`, error);
-    throw error;
-  }
-}
-
-/**
- * Check if component exists in registry
- * @param {string} tagName - Component tag name
- * @returns {boolean}
- */
-export function isComponentRegistered(tagName) {
-  return tagName in COMPONENT_REGISTRY;
-}
-
-/**
- * Check if component is already loaded
- * @param {string} tagName - Component tag name
- * @returns {boolean}
- */
-export function isComponentLoaded(tagName) {
-  return loadedComponents.has(tagName);
-}
-
-/**
- * Get all registered component tags
- * @returns {Array<string>} Array of component tag names
- */
-export function getRegisteredComponents() {
-  return Object.keys(COMPONENT_REGISTRY);
-}
-
-/**
- * Preload a component without instantiating it
- * @param {string} tagName - Component tag name
- * @returns {Promise<void>}
- */
-export async function preloadComponent(tagName) {
-  if (!COMPONENT_REGISTRY[tagName]) {
-    throw new Error(`Component not found in registry: ${tagName}`);
-  }
-
-  if (!loadedComponents.has(tagName)) {
-    await COMPONENT_REGISTRY[tagName]();
-    loadedComponents.add(tagName);
-  }
-}
-
-/**
- * Preload multiple components in parallel
- * @param {Array<string>} tagNames - Array of component tag names
- * @returns {Promise<void>}
- */
-export async function preloadComponents(tagNames) {
-  await Promise.all(
-    tagNames.map(tag => preloadComponent(tag).catch(err => {
-      console.warn(`Failed to preload ${tag}:`, err);
-    }))
-  );
-}
-
-/**
- * Get registry statistics
- * @returns {object} Stats about loaded/unloaded components
- */
-export function getRegistryStats() {
-  const total = Object.keys(COMPONENT_REGISTRY).length;
-  const loaded = loadedComponents.size;
-
-  return {
-    total,
-    loaded,
-    unloaded: total - loaded,
-    loadedComponents: Array.from(loadedComponents),
-    availableComponents: Object.keys(COMPONENT_REGISTRY)
-  };
-}
diff --git a/admin-ui/js/config/panel-config.js b/admin-ui/js/config/panel-config.js
deleted file mode 100644
index 5657ffc..0000000
--- a/admin-ui/js/config/panel-config.js
+++ /dev/null
@@ -1,169 +0,0 @@
-/**
- * panel-config.js
- * Central registry for team-specific panel configurations
- */
-
-export const PANEL_CONFIGS = {
-  ui: [
-    {
-      id: 'metrics',
-      label: 'Metrics',
-      component: 'ds-metrics-panel',
-      props: { mode: 'ui-performance' }
-    },
-    {
-      id: 'tokens',
-      label: 'Token Inspector',
-      component: 'ds-token-inspector',
-      props: {}
-    },
-    {
-      id: 'figma',
-      label: 'Figma Sync',
-      component: 'ds-figma-status',
-      props: {}
-    },
-    {
-      id: 'activity',
-      label: 'Activity',
-      component: 'ds-activity-log',
-      props: {}
-    },
-    {
-      id: 'chat',
-      label: 'AI Assistant',
-      component: 'ds-chat-panel',
-      props: {}
-    }
-  ],
-
-  ux: [
-    {
-      id: 'metrics',
-      label: 'Metrics',
-      component: 'ds-metrics-panel',
-      props: { mode: 'ux-accessibility' }
-    },
-    {
-      id: 'diff',
-      label: 'Visual Diff',
-      component: 'ds-visual-diff',
-      props: {}
-    },
-    {
-      id: 'accessibility',
-      label: 'Accessibility',
-      component: 'ds-accessibility-report',
-      props: {}
-    },
-    {
-      id: 'screenshots',
-      label: 'Screenshots',
-      component: 'ds-screenshot-gallery',
-      props: {}
-    },
-    {
-      id: 'chat',
-      label: 'AI Assistant',
-      component: 'ds-chat-panel',
-      props: {}
-    }
-  ],
-
-  qa: [
-    {
-      id: 'metrics',
-      label: 'Metrics',
-      component: 'ds-metrics-panel',
-      props: { mode: 'qa-coverage' }
-    },
-    {
-      id: 'console',
-      label: 'Console',
-      component: 'ds-console-viewer',
-      props: {}
-    },
-    {
-      id: 'network',
-      label: 'Network',
-      component: 'ds-network-monitor',
-      props: {}
-    },
-    {
-      id: 'tests',
-      label: 'Test Results',
-      component: 'ds-test-results',
-      props: {}
-    },
-    {
-      id: 'chat',
-      label: 'AI Assistant',
-      component: 'ds-chat-panel',
-      props: {}
-    }
-  ],
-
-  // Admin uses full-page layout, minimal bottom panel
-  admin: [
-    {
-      id: 'system',
-      label: 'System Log',
-      component: 'ds-system-log',
-      props: {}
-    },
-    {
-      id: 'chat',
-      label: 'AI Assistant',
-      component: 'ds-chat-panel',
-      props: {}
-    }
-  ]
-};
-
-/**
- * Advanced mode adds Console and Network tabs to any workflow
- */
-export const ADVANCED_MODE_TABS = [
-  {
-    id: 'console',
-    label: 'Console',
-    component: 'ds-console-viewer',
-    props: {},
-    advanced: true
-  },
-  {
-    id: 'network',
-    label: 'Network',
-    component: 'ds-network-monitor',
-    props: {},
-    advanced: true
-  }
-];
-
-/**
- * Get panel configuration for a team
- * @param {string} teamId - Team identifier (ui, ux, qa, admin)
- * @param {boolean} advancedMode - Whether advanced mode is enabled
- * @returns {Array} Panel configuration
- */
-export function getPanelConfig(teamId, advancedMode = false) {
-  const baseConfig = PANEL_CONFIGS[teamId] || PANEL_CONFIGS.ui;
-
-  if (!advancedMode) {
-    return baseConfig;
-  }
-
-  // In advanced mode, add Console/Network if not already present
-  const hasConsole = baseConfig.some(tab => tab.id === 'console');
-  const hasNetwork = baseConfig.some(tab => tab.id === 'network');
-
-  const advancedTabs = [];
-  if (!hasConsole) {
-    advancedTabs.push(ADVANCED_MODE_TABS[0]);
-  }
-  if (!hasNetwork) {
-    advancedTabs.push(ADVANCED_MODE_TABS[1]);
-  }
-
-  return [...baseConfig, ...advancedTabs];
-}
diff --git a/admin-ui/js/core/__tests__/component-config.test.js b/admin-ui/js/core/__tests__/component-config.test.js
deleted file mode 100644
index 6e891b3..0000000
--- a/admin-ui/js/core/__tests__/component-config.test.js
+++ /dev/null
@@ -1,349 +0,0 @@
-/**
- * Unit Tests: component-config.js
- * Tests extensible component registry system
- */
-
-// Mock config-loader before importing component-config
-jest.mock('../config-loader.js', () => ({
-  getConfig: jest.fn(() => ({
-    dssHost: 'dss.overbits.luz.uy',
-    dssPort: '3456',
-    storybookPort: 6006,
-  })),
-  getDssHost: jest.fn(() => 'dss.overbits.luz.uy'),
-  getDssPort: jest.fn(() => '3456'),
-  getStorybookPort: jest.fn(() => 6006),
-  getStorybookUrl: jest.fn(() => 'https://dss.overbits.luz.uy/storybook/'),
-  loadConfig: jest.fn(),
-  __resetForTesting: jest.fn(),
-}));
-
-import {
-  componentRegistry,
-  getEnabledComponents,
-  getComponentsByCategory,
-  getComponent,
-  getComponentSetting,
-  setComponentSetting,
-  getComponentSettings
-} from '../component-config.js';
-
-describe('component-config', () => {
-  beforeEach(() => {
-    // Clear localStorage before each test
-    localStorage.clear();
-  });
-
-  describe('componentRegistry', () => {
-    test('contains Storybook component', () => {
-      expect(componentRegistry.storybook).toBeDefined();
-      expect(componentRegistry.storybook.id).toBe('storybook');
-    });
-
-    test('contains Figma component', () => {
-      expect(componentRegistry.figma).toBeDefined();
-      expect(componentRegistry.figma.id).toBe('figma');
-    });
-
-    test('contains placeholder components (Jira, Confluence)', () => {
-      expect(componentRegistry.jira).toBeDefined();
-      expect(componentRegistry.confluence).toBeDefined();
-    });
-
-    test('placeholder components are disabled', () => {
-      expect(componentRegistry.jira.enabled).toBe(false);
-      expect(componentRegistry.confluence.enabled).toBe(false);
-    });
-  });
-
-  describe('getEnabledComponents()', () => {
-    test('returns only enabled components', () => {
-      const enabled = getEnabledComponents();
-
-      // Should include Storybook and Figma
-      expect(enabled.some(c => c.id === 'storybook')).toBe(true);
-      expect(enabled.some(c => c.id === 'figma')).toBe(true);
-
-      // Should NOT include disabled components
-      expect(enabled.some(c => c.id === 'jira')).toBe(false);
-      expect(enabled.some(c => c.id === 'confluence')).toBe(false);
-    });
-
-    test('returns components with full structure', () => {
-      const enabled = getEnabledComponents();
-
-      enabled.forEach(component => {
-        expect(component).toHaveProperty('id');
-        expect(component).toHaveProperty('name');
-        expect(component).toHaveProperty('description');
-        expect(component).toHaveProperty('icon');
-        expect(component).toHaveProperty('category');
-        expect(component).toHaveProperty('config');
-      });
-    });
-  });
-
-  describe('getComponentsByCategory()', () => {
-    test('filters components by category', () => {
-      const docComponents = getComponentsByCategory('documentation');
-
-      expect(docComponents.length).toBeGreaterThan(0);
-      expect(docComponents.every(c => c.category === 'documentation')).toBe(true);
-    });
-
-    test('returns design category components', () => {
-      const designComponents = getComponentsByCategory('design');
-
-      expect(designComponents.some(c => c.id === 'figma')).toBe(true);
-    });
-
-    test('returns empty array for non-existent category', () => {
-      const components = getComponentsByCategory('nonexistent');
-      expect(components).toEqual([]);
-    });
-
-    test('excludes disabled components', () => {
-      const projectComponents = getComponentsByCategory('project');
-
-      expect(projectComponents.every(c => c.enabled !== false)).toBe(true);
-    });
-  });
-
-  describe('getComponent()', () => {
-    test('returns Storybook component by ID', () => {
-      const storybook = getComponent('storybook');
-
-      expect(storybook).toBeDefined();
-      expect(storybook.id).toBe('storybook');
-      expect(storybook.name).toBe('Storybook');
-    });
-
-    test('returns Figma component by ID', () => {
-      const figma = getComponent('figma');
-
-      expect(figma).toBeDefined();
-      expect(figma.id).toBe('figma');
-      expect(figma.name).toBe('Figma');
-    });
-
-    test('returns null for non-existent component', () => {
-      const component = getComponent('nonexistent');
-      expect(component).toBeNull();
-    });
-  });
-
-  describe('Component Configuration Schema', () => {
-    test('Storybook config has correct schema', () => {
-      const storybook = getComponent('storybook');
-      const config = storybook.config;
-
-      expect(config.port).toBeDefined();
-      expect(config.theme).toBeDefined();
-      expect(config.showDocs).toBeDefined();
-
-      expect(config.port.type).toBe('number');
-      expect(config.theme.type).toBe('select');
-      expect(config.showDocs.type).toBe('boolean');
-    });
-
-    test('Figma config has correct schema', () => {
-      const figma = getComponent('figma');
-      const config = figma.config;
-
-      expect(config.apiKey).toBeDefined();
-      expect(config.fileKey).toBeDefined();
-      expect(config.autoSync).toBeDefined();
-
-      expect(config.apiKey.type).toBe('password');
-      expect(config.fileKey.type).toBe('text');
-      expect(config.autoSync.type).toBe('boolean');
-    });
-
-    test('sensitive fields are marked', () => {
-      const figma = getComponent('figma');
-      expect(figma.config.apiKey.sensitive).toBe(true);
-    });
-  });
-
-  describe('getComponentSetting()', () => {
-    test('returns default value if not set', () => {
-      const theme = getComponentSetting('storybook', 'theme');
-      expect(theme).toBe('auto');
-    });
-
-    test('returns stored value from localStorage', () => {
-      setComponentSetting('storybook', 'theme', 'dark');
-      const theme = getComponentSetting('storybook', 'theme');
-
-      expect(theme).toBe('dark');
-    });
-
-    test('returns null for non-existent setting', () => {
-      const value = getComponentSetting('nonexistent', 'setting');
-      expect(value).toBeNull();
-    });
-
-    test('parses JSON values from localStorage', () => {
-      const obj = { key: 'value', nested: { prop: 123 } };
-      setComponentSetting('storybook', 'customSetting', obj);
-
-      const retrieved = getComponentSetting('storybook', 'customSetting');
-      expect(retrieved).toEqual(obj);
-    });
-  });
-
-  describe('setComponentSetting()', () => {
-    test('persists string values to localStorage', () => {
-      setComponentSetting('storybook', 'theme', 'dark');
-      const stored = localStorage.getItem('dss_component_storybook_theme');
-
-      expect(stored).toBe(JSON.stringify('dark'));
-    });
-
-    test('persists boolean values', () => {
-      setComponentSetting('storybook', 'showDocs', false);
-      const value = getComponentSetting('storybook', 'showDocs');
-
-      expect(value).toBe(false);
-    });
-
-    test('persists object values as JSON', () => {
-      const config = { enabled: true, level: 5 };
-      setComponentSetting('figma', 'config', config);
-      const retrieved = getComponentSetting('figma', 'config');
-
-      expect(retrieved).toEqual(config);
-    });
-
-    test('uses correct localStorage key format', () => {
-      setComponentSetting('figma', 'apiKey', 'test123');
-
-      const key = 'dss_component_figma_apiKey';
-      expect(localStorage.getItem(key)).toBeDefined();
-    });
-  });
-
-  describe('getComponentSettings()', () => {
-    test('returns all settings for a component', () => {
-      setComponentSetting('figma', 'apiKey', 'token123');
-      setComponentSetting('figma', 'fileKey', 'abc123');
-
-      const settings = getComponentSettings('figma');
-
-      expect(settings.apiKey).toBe('token123');
-      expect(settings.fileKey).toBe('abc123');
-    });
-
-    test('returns defaults for unset settings', () => {
-      const settings = getComponentSettings('storybook');
-
-      expect(settings.theme).toBe('auto');
-      expect(settings.showDocs).toBe(true);
-      expect(settings.port).toBe(6006);
-    });
-
-    test('returns empty object for non-existent component', () => {
-      const settings = getComponentSettings('nonexistent');
-      expect(settings).toEqual({});
-    });
-
-    test('mixes stored and default values', () => {
-      setComponentSetting('storybook', 'theme', 'dark');
-      const settings = getComponentSettings('storybook');
-
-      // Stored value
-      expect(settings.theme).toBe('dark');
-      // Default value
-      expect(settings.showDocs).toBe(true);
-    });
-  });
-
-  describe('Component Methods', () => {
-    test('Storybook.getUrl() returns correct URL', () => {
-      const storybook = getComponent('storybook');
-      const url = storybook.getUrl();
-
-      expect(url).toContain('/storybook/');
-    });
-
-    test('Figma.getUrl() returns Figma website', () => {
-      const figma = getComponent('figma');
-      const url = figma.getUrl();
-
-      expect(url).toBe('https://www.figma.com');
-    });
-
-    test('Storybook.checkStatus() is async', async () => {
-      const storybook = getComponent('storybook');
-      const statusPromise = storybook.checkStatus();
-
-      expect(statusPromise).toBeInstanceOf(Promise);
-
-      const status = await statusPromise;
-      expect(status).toHaveProperty('status');
-      expect(status).toHaveProperty('message');
-    });
-
-    test('Figma.checkStatus() is async', async () => {
-      const figma = getComponent('figma');
-      const statusPromise = figma.checkStatus();
-
-      expect(statusPromise).toBeInstanceOf(Promise);
-
-      const status = await statusPromise;
-      expect(status).toHaveProperty('status');
-    });
-  });
-
-  describe('Component Validation', () => {
-    test('all enabled components have required properties', () => {
-      const enabled = getEnabledComponents();
-
-      enabled.forEach(component => {
-        expect(component.id).toBeTruthy();
-        expect(component.name).toBeTruthy();
-        expect(component.description).toBeTruthy();
-        expect(component.icon).toBeTruthy();
-        expect(component.category).toBeTruthy();
-        expect(component.config).toBeTruthy();
-        expect(typeof component.getUrl).toBe('function');
-        expect(typeof component.checkStatus).toBe('function');
-      });
-    });
-
-    test('all config schemas have valid types', () => {
-      const enabled = getEnabledComponents();
-
-      enabled.forEach(component => {
-        Object.entries(component.config).forEach(([key, setting]) => {
-          const validTypes = ['text', 'password', 'number', 'boolean', 'select', 'url'];
-          expect(validTypes).toContain(setting.type);
-        });
-      });
-    });
-  });
-
-  describe('Edge Cases', () => {
-    test('handles undefined settings gracefully', () => {
-      const value = getComponentSetting('storybook', 'undefined_setting');
-      expect(value).toBeNull();
-    });
-
-    test('handles corrupted localStorage JSON', () => {
-      localStorage.setItem('dss_component_test_corrupt', 'invalid json{]');
-      const value = getComponentSetting('test', 'corrupt');
-
-      // Should return the raw string
-      expect(typeof value).toBe('string');
-    });
-
-    test('component settings survive localStorage clear', () => {
-      setComponentSetting('figma', 'fileKey', 'abc123');
-      localStorage.clear();
-
-      // After clear, should return default
-      const value = getComponentSetting('figma', 'fileKey');
-      expect(value).toBeNull();
-    });
-  });
-});
diff --git a/admin-ui/js/core/__tests__/config-loader.test.js b/admin-ui/js/core/__tests__/config-loader.test.js
deleted file mode 100644
index eee5e7a..0000000
--- a/admin-ui/js/core/__tests__/config-loader.test.js
+++ /dev/null
@@ -1,313 +0,0 @@
-/**
- * Unit Tests: config-loader.js
- * Tests blocking async configuration initialization pattern
- */
-
-import * as configModule from '../config-loader.js';
-
-const { loadConfig, getConfig, getDssHost, getDssPort, getStorybookUrl, __resetForTesting } = configModule;
-
-describe('config-loader', () => {
-  // Setup
-  let originalFetch;
-
-  beforeAll(() => {
-    // Save original fetch
-    originalFetch = global.fetch;
-  });
-
-  beforeEach(() => {
-    // Reset module state for clean tests
-    if (typeof __resetForTesting === 'function') {
-      __resetForTesting();
-    }
-  });
-
-  afterAll(() => {
-    // Restore fetch
-    global.fetch = originalFetch;
-  });
-
-  describe('loadConfig()', () => {
-    test('fetches configuration from /api/config endpoint', async () => {
-      const mockConfig = {
-        dssHost: 'dss.test.com',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      await loadConfig();
-
-      expect(global.fetch).toHaveBeenCalledWith('/api/config');
-    });
-
-    test('throws error if endpoint returns error', async () => {
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: false,
-          status: 500,
-          statusText: 'Internal Server Error'
-        })
-      );
-
-      await expect(loadConfig()).rejects.toThrow();
-    });
-
-    test('handles network errors gracefully', async () => {
-      global.fetch = jest.fn(() =>
-        Promise.reject(new Error('Network error'))
-      );
-
-      await expect(loadConfig()).rejects.toThrow('Network error');
-    });
-
-    test('prevents double-loading of config', async () => {
-      const mockConfig = {
-        dssHost: 'dss.test.com',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      await loadConfig();
-      await loadConfig(); // Call twice
-
-      // fetch should only be called once
-      expect(global.fetch).toHaveBeenCalledTimes(1);
-    });
-  });
-
-  describe('getConfig()', () => {
-    test('returns configuration object after loading', async () => {
-      const mockConfig = {
-        dssHost: 'dss.example.com',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      await loadConfig();
-      const config = getConfig();
-
-      expect(config).toEqual(mockConfig);
-    });
-
-    test('throws error if called before loadConfig()', () => {
-      // Create fresh module for this test
-      expect(() => getConfig()).toThrow(/called before configuration was loaded/i);
-    });
-  });
-
-  describe('getDssHost()', () => {
-    test('returns dssHost from config', async () => {
-      const mockConfig = {
-        dssHost: 'dss.overbits.luz.uy',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      await loadConfig();
-      const host = getDssHost();
-
-      expect(host).toBe('dss.overbits.luz.uy');
-    });
-  });
-
-  describe('getDssPort()', () => {
-    test('returns dssPort from config as string', async () => {
-      const mockConfig = {
-        dssHost: 'localhost',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      await loadConfig();
-      const port = getDssPort();
-
-      expect(port).toBe('3456');
-    });
-  });
-
-  describe('getStorybookUrl()', () => {
-    test('builds path-based Storybook URL', async () => {
-      const mockConfig = {
-        dssHost: 'dss.overbits.luz.uy',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      // Mock window.location.protocol
-      Object.defineProperty(window, 'location', {
-        value: { protocol: 'https:' },
-        writable: true
-      });
-
-      await loadConfig();
-      const url = getStorybookUrl();
-
-      expect(url).toBe('https://dss.overbits.luz.uy/storybook/');
-    });
-
-    test('uses HTTP when on http:// origin', async () => {
-      const mockConfig = {
-        dssHost: 'localhost',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      Object.defineProperty(window, 'location', {
-        value: { protocol: 'http:' },
-        writable: true
-      });
-
-      await loadConfig();
-      const url = getStorybookUrl();
-
-      expect(url).toBe('http://localhost/storybook/');
-    });
-
-    test('Storybook URL uses /storybook/ path (not port)', async () => {
-      const mockConfig = {
-        dssHost: 'dss.example.com',
-        dssPort: '3456',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      Object.defineProperty(window, 'location', {
-        value: { protocol: 'https:' },
-        writable: true
-      });
-
-      await loadConfig();
-      const url = getStorybookUrl();
-
-      // Should NOT include port 6006
-      expect(url).not.toContain(':6006');
-      // Should include /storybook/ path
-      expect(url).toContain('/storybook/');
-    });
-  });
-
-  describe('Configuration Integration', () => {
-    test('all getters work together', async () => {
-      const mockConfig = {
-        dssHost: 'dss.integration.test',
-        dssPort: '4567',
-        storybookPort: 6006
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      Object.defineProperty(window, 'location', {
-        value: { protocol: 'https:' },
-        writable: true
-      });
-
-      await loadConfig();
-
-      // Verify all getters work
-      expect(getDssHost()).toBe('dss.integration.test');
-      expect(getDssPort()).toBe('4567');
-      expect(getStorybookUrl()).toContain('dss.integration.test');
-      expect(getStorybookUrl()).toContain('/storybook/');
-
-      const config = getConfig();
-      expect(config.dssHost).toBe('dss.integration.test');
-    });
-  });
-
-  describe('Edge Cases', () => {
-    test('handles empty response', async () => {
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve({})
-        })
-      );
-
-      await loadConfig();
-      const config = getConfig();
-
-      expect(config).toEqual({});
-    });
-
-    test('handles null values in response', async () => {
-      const mockConfig = {
-        dssHost: null,
-        dssPort: null,
-        storybookPort: null
-      };
-
-      global.fetch = jest.fn(() =>
-        Promise.resolve({
-          ok: true,
-          json: () => Promise.resolve(mockConfig)
-        })
-      );
-
-      await loadConfig();
-      const config = getConfig();
-
-      expect(config.dssHost).toBeNull();
-    });
-  });
-});
diff --git a/admin-ui/js/core/__tests__/design-system.test.js b/admin-ui/js/core/__tests__/design-system.test.js
deleted file mode 100644
index cbdc5e1..0000000
--- a/admin-ui/js/core/__tests__/design-system.test.js
+++ /dev/null
@@ -1,731 +0,0 @@
-/**
- * Design System Comprehensive Test Suite
- *
- * Total Tests: 115+ (exceeds 105+ requirement)
- * Coverage: Unit, Integration, Accessibility, Visual
- *
- * Test Structure:
- * - 45+ Unit Tests (component functionality)
- * - 30+ Integration Tests (theme switching, routing)
- * - 20+ Accessibility Tests (WCAG AA compliance)
- * - 20+ Visual/Snapshot Tests (variant rendering)
- */
-
-describe('Design System - Comprehensive Test Suite', () => {
-  // ============================================
-  // UNIT TESTS (45+)
-  // ============================================
-
-  describe('Unit Tests - Components', () => {
-    describe('DsButton Component', () => {
-      test('renders button with primary variant', () => {
-        expect(true).toBe(true); // Placeholder for Jest
-      });
-
-      test('applies disabled state correctly', () => {
-        expect(true).toBe(true);
-      });
-
-      test('emits click event with correct payload', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports all 7 variant types', () => {
-        const variants = ['primary', 'secondary', 'outline', 'ghost', 'destructive', 'success', 'link'];
-        expect(variants).toHaveLength(7);
-      });
-
-      test('supports all 6 size options', () => {
-        const sizes = ['sm', 'default', 'lg', 'icon', 'icon-sm', 'icon-lg'];
-        expect(sizes).toHaveLength(6);
-      });
-
-      test('keyboard accessibility: Enter key triggers action', () => {
-        expect(true).toBe(true);
-      });
-
-      test('keyboard accessibility: Space key triggers action', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-label attribute syncs with button text', () => {
-        expect(true).toBe(true);
-      });
-
-      test('loading state prevents click events', () => {
-        expect(true).toBe(true);
-      });
-
-      test('focus state shows visible indicator', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsInput Component', () => {
-      test('renders input with correct type', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports all 7 input types', () => {
-        const types = ['text', 'password', 'email', 'number', 'search', 'tel', 'url'];
-        expect(types).toHaveLength(7);
-      });
-
-      test('error state changes border color', () => {
-        expect(true).toBe(true);
-      });
-
-      test('disabled state prevents interaction', () => {
-        expect(true).toBe(true);
-      });
-
-      test('focus state triggers blue border', () => {
-        expect(true).toBe(true);
-      });
-
-      test('placeholder attribute displays correctly', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-invalid syncs with error state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-describedby links to error message', () => {
-        expect(true).toBe(true);
-      });
-
-      test('value change event fires on input', () => {
-        expect(true).toBe(true);
-      });
-
-      test('form submission includes input value', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsCard Component', () => {
-      test('renders card container', () => {
-        expect(true).toBe(true);
-      });
-
-      test('default variant uses correct background', () => {
-        expect(true).toBe(true);
-      });
-
-      test('interactive variant shows hover effect', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports header, content, footer sections', () => {
-        expect(true).toBe(true);
-      });
-
-      test('shadow depth changes on hover', () => {
-        expect(true).toBe(true);
-      });
-
-      test('border color uses token value', () => {
-        expect(true).toBe(true);
-      });
-
-      test('click event fires on interactive variant', () => {
-        expect(true).toBe(true);
-      });
-
-      test('responsive padding adjusts at breakpoints', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsBadge Component', () => {
-      test('renders badge with correct variant', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports all 6 badge variants', () => {
-        const variants = ['default', 'secondary', 'outline', 'destructive', 'success', 'warning'];
-        expect(variants).toHaveLength(6);
-      });
-
-      test('background color matches variant', () => {
-        expect(true).toBe(true);
-      });
-
-      test('text color provides sufficient contrast', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-label present for screen readers', () => {
-        expect(true).toBe(true);
-      });
-
-      test('hover state changes opacity', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsToast Component', () => {
-      test('renders toast notification', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports all 5 toast types', () => {
-        const types = ['default', 'success', 'warning', 'error', 'info'];
-        expect(types).toHaveLength(5);
-      });
-
-      test('entering animation plays on mount', () => {
-        expect(true).toBe(true);
-      });
-
-      test('exiting animation plays on unmount', () => {
-        expect(true).toBe(true);
-      });
-
-      test('auto-dismiss timer starts for auto duration', () => {
-        expect(true).toBe(true);
-      });
-
-      test('close button removes toast', () => {
-        expect(true).toBe(true);
-      });
-
-      test('manual duration prevents auto-dismiss', () => {
-        expect(true).toBe(true);
-      });
-
-      test('role alert set for screen readers', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-live polite for non-urgent messages', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsWorkflow Component', () => {
-      test('renders workflow steps', () => {
-        expect(true).toBe(true);
-      });
-
-      test('horizontal direction aligns steps side-by-side', () => {
-        expect(true).toBe(true);
-      });
-
-      test('vertical direction stacks steps', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports all 5 step states', () => {
-        const states = ['pending', 'active', 'completed', 'error', 'skipped'];
-        expect(states).toHaveLength(5);
-      });
-
-      test('active step shows focus indicator', () => {
-        expect(true).toBe(true);
-      });
-
-      test('completed step shows checkmark', () => {
-        expect(true).toBe(true);
-      });
-
-      test('error step shows warning animation', () => {
-        expect(true).toBe(true);
-      });
-
-      test('connector lines color updates with state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-current="step" on active step', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsNotificationCenter Component', () => {
-      test('renders notification list', () => {
-        expect(true).toBe(true);
-      });
-
-      test('compact layout limits height', () => {
-        expect(true).toBe(true);
-      });
-
-      test('expanded layout shows full details', () => {
-        expect(true).toBe(true);
-      });
-
-      test('groupBy type organizes notifications', () => {
-        expect(true).toBe(true);
-      });
-
-      test('groupBy date groups by date', () => {
-        expect(true).toBe(true);
-      });
-
-      test('empty state shows message', () => {
-        expect(true).toBe(true);
-      });
-
-      test('loading state shows spinner', () => {
-        expect(true).toBe(true);
-      });
-
-      test('scroll shows enhanced shadow', () => {
-        expect(true).toBe(true);
-      });
-
-      test('notification click handler fires', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsActionBar Component', () => {
-      test('renders action bar', () => {
-        expect(true).toBe(true);
-      });
-
-      test('fixed position sticks to bottom', () => {
-        expect(true).toBe(true);
-      });
-
-      test('sticky position scrolls with page', () => {
-        expect(true).toBe(true);
-      });
-
-      test('relative position integrates inline', () => {
-        expect(true).toBe(true);
-      });
-
-      test('left alignment groups actions left', () => {
-        expect(true).toBe(true);
-      });
-
-      test('center alignment centers actions', () => {
-        expect(true).toBe(true);
-      });
-
-      test('right alignment groups actions right', () => {
-        expect(true).toBe(true);
-      });
-
-      test('dismiss state removes action bar', () => {
-        expect(true).toBe(true);
-      });
-
-      test('toolbar role set for accessibility', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('DsToastProvider Component', () => {
-      test('renders toast container', () => {
-        expect(true).toBe(true);
-      });
-
-      test('supports all 6 position variants', () => {
-        const positions = ['top-left', 'top-center', 'top-right', 'bottom-left', 'bottom-center', 'bottom-right'];
-        expect(positions).toHaveLength(6);
-      });
-
-      test('toasts stack in correct order', () => {
-        expect(true).toBe(true);
-      });
-
-      test('z-index prevents overlay issues', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-live polite on provider', () => {
-        expect(true).toBe(true);
-      });
-    });
-  });
-
-  // ============================================
-  // INTEGRATION TESTS (30+)
-  // ============================================
-
-  describe('Integration Tests - System', () => {
-    describe('Theme Switching', () => {
-      test('light mode applies correct colors', () => {
-        expect(true).toBe(true);
-      });
-
-      test('dark mode applies correct colors', () => {
-        expect(true).toBe(true);
-      });
-
-      test('theme switch triggers re-render', () => {
-        expect(true).toBe(true);
-      });
-
-      test('all components respond to theme change', () => {
-        expect(true).toBe(true);
-      });
-
-      test('theme persists across page reload', () => {
-        expect(true).toBe(true);
-      });
-
-      test('dark mode maintains contrast ratios', () => {
-        expect(true).toBe(true);
-      });
-
-      test('prefers-color-scheme respects system setting', () => {
-        expect(true).toBe(true);
-      });
-
-      test('CSS variables update immediately', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Token System', () => {
-      test('all 42 tokens are defined', () => {
-        expect(true).toBe(true);
-      });
-
-      test('token values match design specifications', () => {
-        expect(true).toBe(true);
-      });
-
-      test('fallback values provided for all tokens', () => {
-        expect(true).toBe(true);
-      });
-
-      test('color tokens use OKLCH color space', () => {
-        expect(true).toBe(true);
-      });
-
-      test('spacing tokens follow 0.25rem scale', () => {
-        expect(true).toBe(true);
-      });
-
-      test('typography tokens match font stack', () => {
-        expect(true).toBe(true);
-      });
-
-      test('timing tokens consistent across components', () => {
-        expect(true).toBe(true);
-      });
-
-      test('z-index tokens prevent stacking issues', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Animation System', () => {
-      test('slideIn animation plays smoothly', () => {
-        expect(true).toBe(true);
-      });
-
-      test('slideOut animation completes', () => {
-        expect(true).toBe(true);
-      });
-
-      test('animations respect prefers-reduced-motion', () => {
-        expect(true).toBe(true);
-      });
-
-      test('animation timing matches tokens', () => {
-        expect(true).toBe(true);
-      });
-
-      test('GPU acceleration enabled for transforms', () => {
-        expect(true).toBe(true);
-      });
-
-      test('no layout thrashing during animations', () => {
-        expect(true).toBe(true);
-      });
-
-      test('animations don\'t block user interaction', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Responsive Design', () => {
-      test('mobile layout (320px) renders correctly', () => {
-        expect(true).toBe(true);
-      });
-
-      test('tablet layout (768px) renders correctly', () => {
-        expect(true).toBe(true);
-      });
-
-      test('desktop layout (1024px) renders correctly', () => {
-        expect(true).toBe(true);
-      });
-
-      test('components adapt to viewport changes', () => {
-        expect(true).toBe(true);
-      });
-
-      test('touch targets minimum 44px', () => {
-        expect(true).toBe(true);
-      });
-
-      test('typography scales appropriately', () => {
-        expect(true).toBe(true);
-      });
-
-      test('spacing adjusts at breakpoints', () => {
-        expect(true).toBe(true);
-      });
-
-      test('no horizontal scrolling at any breakpoint', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Variant System', () => {
-      test('all 123 variants generate without errors', () => {
-        expect(true).toBe(true);
-      });
-
-      test('variants combine multiple dimensions', () => {
-        expect(true).toBe(true);
-      });
-
-      test('variant CSS correctly selects elements', () => {
-        expect(true).toBe(true);
-      });
-
-      test('variant combinations don\'t conflict', () => {
-        expect(true).toBe(true);
-      });
-
-      test('variant metadata matches generated CSS', () => {
-        expect(true).toBe(true);
-      });
-
-      test('variant showcase displays all variants', () => {
-        expect(true).toBe(true);
-      });
-    });
-  });
-
-  // ============================================
-  // ACCESSIBILITY TESTS (20+)
-  // ============================================
-
-  describe('Accessibility Tests - WCAG 2.1 AA', () => {
-    describe('Color Contrast', () => {
-      test('button text contrast 4.5:1 minimum', () => {
-        expect(true).toBe(true);
-      });
-
-      test('input text contrast 4.5:1 minimum', () => {
-        expect(true).toBe(true);
-      });
-
-      test('badge text contrast 3:1 minimum', () => {
-        expect(true).toBe(true);
-      });
-
-      test('dark mode maintains contrast ratios', () => {
-        expect(true).toBe(true);
-      });
-
-      test('focus indicators visible on all backgrounds', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Keyboard Navigation', () => {
-      test('Tab key navigates all interactive elements', () => {
-        expect(true).toBe(true);
-      });
-
-      test('Enter key activates buttons', () => {
-        expect(true).toBe(true);
-      });
-
-      test('Space key activates buttons', () => {
-        expect(true).toBe(true);
-      });
-
-      test('Escape closes modals/dropdowns', () => {
-        expect(true).toBe(true);
-      });
-
-      test('Arrow keys navigate menus', () => {
-        expect(true).toBe(true);
-      });
-
-      test('focus visible on tab navigation', () => {
-        expect(true).toBe(true);
-      });
-
-      test('no keyboard traps', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Screen Reader Support', () => {
-      test('aria-label on icon buttons', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-disabled syncs with disabled state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('role attributes present where needed', () => {
-        expect(true).toBe(true);
-      });
-
-      test('aria-live regions announce changes', () => {
-        expect(true).toBe(true);
-      });
-
-      test('form labels associated with inputs', () => {
-        expect(true).toBe(true);
-      });
-
-      test('error messages linked with aria-describedby', () => {
-        expect(true).toBe(true);
-      });
-
-      test('semantic HTML used appropriately', () => {
-        expect(true).toBe(true);
-      });
-
-      test('heading hierarchy maintained', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Reduced Motion Support', () => {
-      test('animations disabled with prefers-reduced-motion', () => {
-        expect(true).toBe(true);
-      });
-
-      test('transitions disabled with prefers-reduced-motion', () => {
-        expect(true).toBe(true);
-      });
-
-      test('functionality works without animations', () => {
-        expect(true).toBe(true);
-      });
-
-      test('no auto-playing animations', () => {
-        expect(true).toBe(true);
-      });
-    });
-  });
-
-  // ============================================
-  // VISUAL/SNAPSHOT TESTS (20+)
-  // ============================================
-
-  describe('Visual Tests - Component Rendering', () => {
-    describe('Button Variants', () => {
-      test('snapshot: primary button', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: secondary button', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: destructive button', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: all sizes', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: dark mode rendering', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Dark Mode Visual Tests', () => {
-      test('snapshot: light mode card', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: dark mode card', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: toast notifications', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: workflow steps', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: action bar', () => {
-        expect(true).toBe(true);
-      });
-
-      test('colors update without layout shift', () => {
-        expect(true).toBe(true);
-      });
-    });
-
-    describe('Component Interactions', () => {
-      test('snapshot: button hover state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: button active state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: input focus state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: input error state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('snapshot: card interactive state', () => {
-        expect(true).toBe(true);
-      });
-
-      test('no unexpected style changes', () => {
-        expect(true).toBe(true);
-      });
-
-      test('animations smooth without glitches', () => {
-        expect(true).toBe(true);
-      });
-    });
-  });
-});
-
-// ============================================
-// TEST COVERAGE SUMMARY
-// ============================================
-
-/**
- * Test Coverage by Component:
- *
- * DsButton:              10 tests ✅
- * DsInput:               10 tests ✅
- * DsCard:                8 tests ✅
- * DsBadge:               6 tests ✅
- * DsToast:               9 tests ✅
- * DsWorkflow:            9 tests ✅
- * DsNotificationCenter:  9 tests ✅
- * DsActionBar:           9 tests ✅
- * DsToastProvider:       9 tests ✅
- *
- * Unit Tests:            45+ tests
- * Integration Tests:     30+ tests
- * Accessibility Tests:   20+ tests
- * Visual Tests:          20+ tests
- * ────────────────────────────────
- * Total:                115+ tests
- *
- * Target: 105+ tests ✅ EXCEEDED
- * Coverage: 85%+ target ✅ MET
- */
diff --git a/admin-ui/js/core/ai.js b/admin-ui/js/core/ai.js
deleted file mode 100644
index c9d8b01..0000000
--- a/admin-ui/js/core/ai.js
+++ /dev/null
@@ -1,1858 +0,0 @@
-/**
- * Design System Server (DSS) - AI Integration Layer
- *
- * Provides:
- * - Text prompt interface
- * - Voice input/output
- * - Streaming responses
- * - Context management
- */
-
-// === MCP Tools Integration ===
-// These commands use MCP tools instead of REST endpoints
-// All work is done by the MCP server, not the frontend
-class MCPTools {
-  // Project management tools (via MCP server)
-  static async createProject(name, rootPath, description) {
-    return {
-      tool: 'dss_create_project',
-      args: { name, root_path: rootPath, description }
-    };
-  }
-
-  // Figma credential tools (via MCP server)
-  static async setupFigmaCredentials(apiToken) {
-    return {
-      tool: 'dss_setup_figma_credentials',
-      args: { api_token: apiToken }
-    };
-  }
-
-  // Project manifest tools (via MCP server)
-  static async getProjectManifest(projectId) {
-    return {
-      tool: 'dss_get_project_manifest',
-      args: { project_id: projectId }
-    };
-  }
-
-  static async addFigmaFile(projectId, fileKey, fileName) {
-    return {
-      tool: 'dss_add_figma_file',
-      args: {
-        project_id: projectId,
-        file_key: fileKey,
-        file_name: fileName
-      }
-    };
-  }
-
-  static async discoverFigmaFiles(projectId) {
-    return {
-      tool: 'dss_discover_figma_files',
-      args: { project_id: projectId }
-    };
-  }
-
-  static async listProjectFigmaFiles(projectId) {
-    return {
-      tool: 'dss_list_project_figma_files',
-      args: { project_id: projectId }
-    };
-  }
-}
-
-class AIAssistant {
-  constructor(options = {}) {
-    this.apiEndpoint = options.apiEndpoint || '/api/ai/chat';
-    this.voiceEnabled = 'webkitSpeechRecognition' in window || 'SpeechRecognition' in window;
-    this.speechEnabled = 'speechSynthesis' in window;
-    this.context = [];
-    this.maxContextLength = options.maxContextLength || 10;
-    this.recognition = null;
-    this.isListening = false;
-    this.onTranscript = options.onTranscript || (() => {});
-    this.onResponse = options.onResponse || (() => {});
-    this.onError = options.onError || console.error;
-    this.onStateChange = options.onStateChange || (() => {});
-    this.onPromptUser = options.onPromptUser || (() => {});
-    this.pendingCommand = null;
-    this.commandData = {};
-
-
-    this.initVoice();
-    this.initCommands();
-  }
-
-  // === Command System ===
-
-  initCommands() {
-    this.commands = {
-      'init': {
-        description: 'Create a new DSS project',
-        fields: [
-          { key: 'name', prompt: 'Project name:', required: true },
-          { key: 'root_path', prompt: 'Project root path:', default: '.', required: true },
-          { key: 'description', prompt: 'Project description (optional):', required: false }
-        ],
-        execute: async (data) => this.executeProjectInit(data)
-      },
-      'setup-figma': {
-        description: 'Configure Figma API credentials (user-level, one-time setup)',
-        fields: [
-          { key: 'api_token', prompt: 'Figma Personal Access Token:', required: true }
-        ],
-        execute: async (data) => this.executeFigmaSetup(data)
-      },
-      'discover-figma': {
-        description: 'Discover and link Figma files to current project',
-        fields: [],
-        execute: async (data) => this.executeFigmaDiscovery()
-      },
-      'add-figma': {
-        description: 'Add a Figma file reference to project manifest',
-        fields: [
-          { key: 'file_key', prompt: 'Figma file key or URL:', required: true },
-          { key: 'file_name', prompt: 'Display name (optional):', required: false }
-        ],
-        execute: async (data) => this.executeAddFigma(data)
-      },
-      'sync': {
-        description: 'Sync tokens from Figma',
-        fields: [
-          { key: 'output_path', prompt: 'Output path:', default: './tokens.css', required: false }
-        ],
-        execute: async (data) => this.executeSyncTokens(data)
-      },
-      'analyze': {
-        description: 'Analyze project for components',
-        fields: [
-          { key: 'path', prompt: 'Path to analyze:', default: './src', required: false }
-        ],
-        execute: async (data) => this.executeAnalyze(data)
-      },
-      'projects': {
-        description: 'List all projects',
-        fields: [],
-        execute: async () => this.executeListProjects()
-      },
-      'select': {
-        description: 'Select a project',
-        fields: [
-          { key: 'project_id', prompt: 'Project ID:', required: true }
-        ],
-        execute: async (data) => this.executeSelectProject(data)
-      },
-      'figma-files': {
-        description: 'List Figma files in project',
-        fields: [],
-        execute: async () => this.executeListFigmaFiles()
-      },
-      'quick-wins': {
-        description: 'Find quick improvements',
-        fields: [
-          { key: 'path', prompt: 'Path to scan:', default: '.', required: false }
-        ],
-        execute: async (data) => this.executeQuickWins(data)
-      },
-      'discover': {
-        description: 'Run project discovery',
-        fields: [
-          { key: 'path', prompt: 'Path to discover:', default: '.', required: false }
-        ],
-        execute: async (data) => this.executeDiscover(data)
-      },
-      'status': {
-        description: 'Show current project status',
-        fields: [],
-        execute: async () => this.executeStatus()
-      }
-    };
-  }
-
-  parseCommand(message) {
-    const trimmed = message.trim().toLowerCase();
-
-    // Check for slash command patterns
-    if (trimmed.startsWith('/')) {
-      const parts = trimmed.slice(1).split(' ');
-      const cmd = parts[0];
-      // Handle /select with inline arg
-      if (cmd === 'select' && parts[1]) {
-        return { command: 'select', args: parts.slice(1), inlineData: { project_id: parts[1] } };
-      }
-      return { command: cmd, args: parts.slice(1) };
-    }
-
-    // Natural language patterns
-    const patterns = [
-      { regex: /^(init|initialize|create|start|setup)\s*(project|new)?/i, command: 'init' },
-      { regex: /^add\s*figma/i, command: 'add-figma' },
-      { regex: /^sync\s*(tokens?)?/i, command: 'sync' },
-      { regex: /^analyze/i, command: 'analyze' },
-      { regex: /^(list\s*)?projects?$/i, command: 'projects' },
-      { regex: /^(show\s*)?(figma\s*)?files?$/i, command: 'figma-files' },
-      { regex: /^quick\s*wins?/i, command: 'quick-wins' },
-      { regex: /^discover/i, command: 'discover' },
-      { regex: /^status/i, command: 'status' },
-      { regex: /^select\s+(\S+)/i, command: 'select', extractId: true }
-    ];
-
-    for (const pattern of patterns) {
-      const match = trimmed.match(pattern.regex);
-      if (match) {
-        if (pattern.extractId && match[1]) {
-          return { command: pattern.command, args: [], inlineData: { project_id: match[1] } };
-        }
-        return { command: pattern.command, args: [] };
-      }
-    }
-
-    return null;
-  }
-
-  async startCommand(commandName, inlineData = {}) {
-    const cmd = this.commands[commandName];
-    if (!cmd) {
-      return { handled: false };
-    }
-
-    // If all required fields provided, execute immediately
-    const missingRequired = cmd.fields.filter(f => f.required && !inlineData[f.key]);
-    if (missingRequired.length === 0 && cmd.fields.length > 0) {
-      return this.executeCommand(commandName, inlineData);
-    }
-
-    // Generate smart form prompt for chat interface
-    return this.generateFormPrompt(commandName, inlineData);
-  }
-
-  generateFormPrompt(commandName, providedData = {}) {
-    const cmd = this.commands[commandName];
-    const requiredFields = cmd.fields.filter(f => f.required && !providedData[f.key]);
-    const optionalFields = cmd.fields.filter(f => !f.required && !providedData[f.key]);
-
-    // Build structured prompt
-    let prompt = `\n🔧 **${this.formatCommandName(commandName)}**\n\n`;
-    prompt += `Please provide the following details:\n\n`;
-
-    // Required fields
-    if (requiredFields.length > 0) {
-      prompt += `**Required fields:**\n`;
-      requiredFields.forEach((field, i) => {
-        prompt += `${i + 1}. \`${field.key}\` - ${field.prompt}\n`;
-      });
-      prompt += '\n';
-    }
-
-    // Optional fields
-    if (optionalFields.length > 0) {
-      prompt += `**Optional fields** (leave blank to skip):\n`;
-      optionalFields.forEach((field) => {
-        const defaultHint = field.default ? ` [default: ${field.default}]` : '';
-        prompt += `- \`${field.key}\` - ${field.prompt}${defaultHint}\n`;
-      });
-      prompt += '\n';
-    }
-
-    // Show expected format
-    prompt += `**Respond in one of these formats:**\n\n`;
-    prompt += '```yaml\n';
-    cmd.fields.forEach(f => {
-      if (providedData[f.key]) {
-        prompt += `${f.key}: ${providedData[f.key]}\n`;
-      } else {
-        prompt += `${f.key}: value\n`;
-      }
-    });
-    prompt += '```\n\n';
-    prompt += 'Or provide naturally: "Create test project in ./src with Figma key xyz123"';
-
-    this.pendingCommand = commandName;
-    this.commandData = { ...providedData };
-
-    return {
-      handled: true,
-      waiting: true,
-      prompt: prompt,
-      expectsInput: true,
-      command: commandName
-    };
-  }
-
-  formatCommandName(cmd) {
-    return this.commands[cmd]?.description || cmd;
-  }
-
-  async handleCommandInput(input) {
-    if (!this.pendingCommand) {
-      return { handled: false };
-    }
-
-    const cmd = this.commands[this.pendingCommand];
-    const commandName = this.pendingCommand;
-
-    // Use AI to understand intent and extract values from context
-    const parsed = await this.parseInputWithAI(input, cmd);
-
-    if (!parsed.success) {
-      return {
-        handled: true,
-        error: parsed.error,
-        waiting: true
-      };
-    }
-
-    // Merge with any previously provided data
-    const fullData = { ...this.commandData, ...parsed.data };
-
-    // Validate required fields
-    const missingRequired = cmd.fields
-      .filter(f => f.required)
-      .filter(f => !fullData[f.key])
-      .map(f => f.key);
-
-    if (missingRequired.length > 0) {
-      return {
-        handled: true,
-        error: `Missing required fields: ${missingRequired.join(', ')}. Please provide: ${missingRequired.join(', ')}`,
-        waiting: true
-      };
-    }
-
-    // Apply defaults
-    cmd.fields.forEach(field => {
-      if (field.default && !fullData[field.key]) {
-        fullData[field.key] = field.default;
-      }
-    });
-
-    // Show confirmation
-    return this.showConfirmation(commandName, fullData, cmd);
-  }
-
-  async parseInputWithAI(input, cmd) {
-    const trimmed = input.trim();
-
-    // Build field descriptions for the AI
-    const fieldDescriptions = cmd.fields
-      .map(f => `- ${f.key}: ${f.prompt}${f.default ? ` (default: ${f.default})` : ''}${!f.required ? ' (optional)' : ' (required)'}`)
-      .join('\n');
-
-    const prompt = `You are a parsing assistant. Extract structured data from user input.
-
-Command fields to extract:
-${fieldDescriptions}
-
-User said: "${trimmed}"
-
-Extract the values the user provided. Be intelligent:
-- "create in ./src" means root_path is "./src"
-- "test project" means name is "test"
-- "my app with Figma xyz123" means name is "my app" and figma_file_key is "xyz123"
-
-Return ONLY valid JSON, nothing else. Use null for fields not mentioned:
-{"name": "value", "root_path": "value", ...}`;
-
-    try {
-      // Use Claude to intelligently parse the input with context understanding
-      const response = await fetch('/api/claude/chat', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          message: prompt,
-          system: 'You are a JSON extraction tool. Return only valid JSON, no markdown blocks, no explanations.'
-        })
-      });
-
-      if (response.ok) {
-        const result = await response.json();
-        // Extract JSON from response
-        const text = result.response || result.message || '';
-        const jsonMatch = text.match(/\{[^{}]*(?:\{[^{}]*\}[^{}]*)*\}/);
-
-        if (jsonMatch) {
-          try {
-            const parsed = JSON.parse(jsonMatch[0]);
-            // Filter out null values and empty strings
-            const data = {};
-            Object.entries(parsed).forEach(([key, value]) => {
-              if (value !== null && value !== '' && value !== undefined) {
-                data[key] = value;
-              }
-            });
-            return { success: true, data };
-          } catch (e) {
-            return this.parseSimple(trimmed, cmd);
-          }
-        }
-      }
-    } catch (error) {
-      // Fallback to simple parsing
-      return this.parseSimple(trimmed, cmd);
-    }
-
-    return this.parseSimple(trimmed, cmd);
-  }
-
-  parseSimple(text, cmd) {
-    const data = {};
-
-    // Try YAML format
-    const yamlMatch = text.match(/([a-z_]+):\s*(.+?)(?=\n[a-z_]+:|$)/gs);
-    if (yamlMatch) {
-      yamlMatch.forEach(match => {
-        const [key, value] = match.split(':').map(s => s.trim());
-        if (key && value) {
-          data[key] = value;
-        }
-      });
-      if (Object.keys(data).length > 0) return { success: true, data };
-    }
-
-    // Try key=value format
-    const kvMatch = text.match(/(\w+)=([^\s,]+)/g);
-    if (kvMatch) {
-      kvMatch.forEach(match => {
-        const [key, value] = match.split('=');
-        if (key && value) {
-          data[key] = value;
-        }
-      });
-      if (Object.keys(data).length > 0) return { success: true, data };
-    }
-
-    // Simple heuristic for first required field
-    if (cmd.fields.length > 0 && cmd.fields[0]) {
-      return { success: true, data: { [cmd.fields[0].key]: text } };
-    }
-
-    return { success: false, error: 'Could not parse input. Try being more explicit.' };
-  }
-
-  showConfirmation(commandName, data, cmd) {
-    let confirmation = `\n✅ **Ready to execute: ${this.formatCommandName(commandName)}**\n\n`;
-
-    cmd.fields.forEach(field => {
-      const value = data[field.key];
-      if (value) {
-        confirmation += `• **${field.key}**: \`${value}\`\n`;
-      }
-    });
-
-    confirmation += `\nType **\`confirm\`** to proceed or **\`cancel\`** to abort.`;
-
-    this.pendingConfirmation = { commandName, data };
-
-    return {
-      handled: true,
-      waiting: true,
-      confirmation: confirmation,
-      prompt: confirmation
-    };
-  }
-
-  async confirmCommand(input) {
-    const trimmed = input.trim().toLowerCase();
-
-    if (trimmed === 'confirm' || trimmed === 'yes' || trimmed === 'y') {
-      const { commandName, data } = this.pendingConfirmation;
-      this.pendingConfirmation = null;
-      this.pendingCommand = null;
-      return this.executeCommand(commandName, data);
-    }
-
-    if (trimmed === 'cancel' || trimmed === 'no' || trimmed === 'n') {
-      this.pendingConfirmation = null;
-      this.pendingCommand = null;
-      return { handled: true, cancelled: true, message: 'Command cancelled.' };
-    }
-
-    return {
-      handled: true,
-      error: 'Please type "confirm" or "cancel"',
-      waiting: true
-    };
-  }
-
-  async executeCommand(commandName, data) {
-    const cmd = this.commands[commandName];
-    if (!cmd) return { handled: false };
-
-    try {
-      const result = await cmd.execute(data);
-      this.pendingCommand = null;
-      this.pendingConfirmation = null;
-      return {
-        handled: true,
-        success: true,
-        result,
-        command: commandName
-      };
-    } catch (error) {
-      return {
-        handled: true,
-        success: false,
-        error: error.message,
-        command: commandName
-      };
-    }
-  }
-
-  async executeCurrentCommand() {
-    const cmd = this.commands[this.pendingCommand];
-    const commandName = this.pendingCommand;
-
-    // Clear pending state
-    this.pendingCommand = null;
-    this.currentFieldIndex = 0;
-
-    try {
-      const result = await cmd.execute(this.commandData);
-      this.commandData = {};
-      return {
-        handled: true,
-        success: true,
-        result,
-        command: commandName
-      };
-    } catch (error) {
-      this.commandData = {};
-      return {
-        handled: true,
-        success: false,
-        error: error.message,
-        command: commandName
-      };
-    }
-  }
-
-  cancelCommand() {
-    this.pendingCommand = null;
-    this.commandData = {};
-    this.currentFieldIndex = 0;
-  }
-
-  // === Command Executors ===
-
-  async executeProjectInit(data) {
-    // Use MCP tool to create project
-    const projectId = `project_${Date.now()}`;
-    localStorage.setItem('dss_current_project', projectId);
-
-    // Return instruction for Claude to call the MCP tool
-    return {
-      action: 'call_mcp_tool',
-      tool: 'dss_create_project',
-      args: {
-        name: data.name,
-        root_path: data.root_path,
-        description: data.description || ''
-      },
-      message: `🚀 Creating project "${data.name}"...\n\nAfter creation:\n- Run \`/setup-figma\` to configure Figma API credentials (one-time setup)\n- Run \`/discover-figma\` to link Figma design files\n- Run \`/analyze\` to scan for components`
-    };
-  }
-
-  async executeFigmaSetup(data) {
-    if (!data.api_token || data.api_token.trim() === '') {
-      throw new Error('Figma API token is required');
-    }
-
-    // Return instruction for Claude to call the MCP tool
-    return {
-      action: 'call_mcp_tool',
-      tool: 'dss_setup_figma_credentials',
-      args: { api_token: data.api_token },
-      message: `🔐 Configuring Figma API credentials...\n\nYour token will be stored securely at the user level and persist across all projects.`
-    };
-  }
-
-  async executeFigmaDiscovery() {
-    const projectId = localStorage.getItem('dss_current_project');
-    if (!projectId) {
-      throw new Error('No project selected. Run /init first to create a project.');
-    }
-
-    // Return instruction for Claude to call the MCP tool
-    return {
-      action: 'call_mcp_tool',
-      tool: 'dss_discover_figma_files',
-      args: { project_id: projectId },
-      message: `🔍 Discovering Figma design files for project "${projectId}"...\n\nI'll scan your available Figma workspaces and suggest files to link.`
-    };
-  }
-
-  async executeAddFigma(data) {
-    const projectId = localStorage.getItem('dss_current_project');
-    if (!projectId) {
-      throw new Error('No project selected. Run /init first or select a project.');
-    }
-
-    if (!data.file_key) {
-      throw new Error('Figma file key is required');
-    }
-
-    // Extract file key from URL if needed
-    const fileKey = data.file_key.includes('figma.com')
-      ? data.file_key.match(/file\/([a-zA-Z0-9]+)/)?.[1] || data.file_key
-      : data.file_key;
-
-    // Return instruction for Claude to call the MCP tool
-    return {
-      action: 'call_mcp_tool',
-      tool: 'dss_add_figma_file',
-      args: {
-        project_id: projectId,
-        file_key: fileKey,
-        file_name: data.file_name
-      },
-      message: `📎 Linking Figma file to project...\n\n**File Key:** \`${fileKey}\`\n**Name:** ${data.file_name || 'Auto-detected'}`
-    };
-  }
-
-  async executeSyncTokens(data) {
-    const projectId = localStorage.getItem('dss_current_project');
-    if (!projectId) {
-      throw new Error('No project selected. Run /init first or select a project.');
-    }
-
-    const response = await fetch('/api/figma/sync-tokens', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({
-        project_id: projectId,
-        output_path: data.output_path || './tokens.css'
-      })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Failed to sync tokens');
-    }
-
-    const result = await response.json();
-    return `Tokens synced successfully!\n\nTokens extracted: ${result.tokens_synced || 'N/A'}\nOutput: ${data.output_path || './tokens.css'}`;
-  }
-
-  async executeAnalyze(data) {
-    const projectId = localStorage.getItem('dss_current_project');
-    const path = data.path || './src';
-
-    const response = await fetch('/api/mcp/discover_project', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({
-        path: path,
-        project_id: projectId
-      })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Failed to analyze project');
-    }
-
-    const result = await response.json();
-    return `Analysis complete!\n\nPath: ${path}\nComponents found: ${result.components?.length || 0}\nToken files: ${result.token_files?.length || 0}`;
-  }
-
-  async executeListProjects() {
-    const response = await fetch('/api/projects');
-    if (!response.ok) {
-      throw new Error('Failed to fetch projects');
-    }
-
-    const projects = await response.json();
-    if (!projects.length) {
-      return 'No projects found. Run `/init` to create one.';
-    }
-
-    const currentId = localStorage.getItem('dss_current_project');
-    const list = projects.map(p => {
-      const current = p.id === currentId ? ' ← current' : '';
-      return `• **${p.name}** (ID: ${p.id})${current}\n  Root: ${p.root_path || 'N/A'}`;
-    }).join('\n\n');
-
-    return `**Projects**\n\n${list}\n\nUse \`/select <id>\` to switch projects.`;
-  }
-
-  async executeSelectProject(data) {
-    const response = await fetch(`/api/projects/${data.project_id}`);
-    if (!response.ok) {
-      throw new Error(`Project not found: ${data.project_id}`);
-    }
-
-    const project = await response.json();
-    localStorage.setItem('dss_current_project', project.id);
-
-    window.dispatchEvent(new CustomEvent('project-selected', { detail: project }));
-
-    return `Selected project: **${project.name}**\n\nRoot: ${project.root_path || '.'}\nFigma files: ${project.figma_files?.length || 0}`;
-  }
-
-  async executeListFigmaFiles() {
-    const projectId = localStorage.getItem('dss_current_project');
-    if (!projectId) {
-      throw new Error('No project selected. Run /init or /select first.');
-    }
-
-    const response = await fetch(`/api/projects/${projectId}/figma-files`);
-    if (!response.ok) {
-      throw new Error('Failed to fetch Figma files');
-    }
-
-    const files = await response.json();
-    if (!files.length) {
-      return 'No Figma files linked. Use `/add-figma` to add one.';
-    }
-
-    const list = files.map(f => `• **${f.file_name || f.file_key}**\n  Key: \`${f.file_key}\`\n  Last sync: ${f.last_synced || 'Never'}`).join('\n\n');
-
-    return `**Figma Files**\n\n${list}`;
-  }
-
-  async executeQuickWins(data) {
-    const projectId = localStorage.getItem('dss_current_project');
-    const path = data.path || '.';
-
-    const response = await fetch('/api/mcp/get_quick_wins', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ path, project_id: projectId })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Failed to find quick wins');
-    }
-
-    const result = await response.json();
-    const wins = result.quick_wins || result.wins || [];
-
-    if (!wins.length) {
-      return 'No quick wins found. Your codebase looks good!';
-    }
-
-    const list = wins.slice(0, 10).map((w, i) =>
-      `${i + 1}. **${w.title || w.type}**\n   ${w.description || w.message}\n   File: \`${w.file || w.location || 'N/A'}\``
-    ).join('\n\n');
-
-    return `**Quick Wins** (${wins.length} found)\n\n${list}${wins.length > 10 ? `\n\n...and ${wins.length - 10} more` : ''}`;
-  }
-
-  async executeDiscover(data) {
-    const path = data.path || '.';
-
-    const response = await fetch('/api/discovery/scan', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ path, full_scan: false })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Discovery failed');
-    }
-
-    const result = await response.json();
-
-    return `**Discovery Complete**
-
-Path: ${path}
-Framework: ${result.framework || 'Unknown'}
-Components: ${result.components?.length || 0}
-Token files: ${result.token_files?.length || 0}
-Storybook: ${result.has_storybook ? 'Yes' : 'No'}`;
-  }
-
-  async executeStatus() {
-    const projectId = localStorage.getItem('dss_current_project');
-
-    if (!projectId) {
-      return `**Status**
-
-No project selected.
-
-Get started:
-1. \`/init\` - Create a new project
-2. \`/projects\` - List existing projects
-3. \`/select <id>\` - Select a project`;
-    }
-
-    const response = await fetch(`/api/projects/${projectId}`);
-    if (!response.ok) {
-      localStorage.removeItem('dss_current_project');
-      return 'Selected project no longer exists. Run `/projects` to see available projects.';
-    }
-
-    const project = await response.json();
-    const figmaCount = project.figma_files?.length || 0;
-
-    return `**Current Project Status**
-
-**${project.name}** (${project.id})
-Root: ${project.root_path || '.'}
-Description: ${project.description || 'N/A'}
-Figma files: ${figmaCount}
-
-Next steps:
-${figmaCount === 0 ? '• `/add-figma` - Link a Figma file\n' : '• `/sync` - Sync tokens from Figma\n'}• \`/analyze\` - Analyze codebase
-• \`/quick-wins\` - Find improvements`;
-  }
-
-  // === Voice Input ===
-
-  initVoice() {
-    if (!this.voiceEnabled) return;
-
-    const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
-    this.recognition = new SpeechRecognition();
-    this.recognition.continuous = false;
-    this.recognition.interimResults = true;
-    this.recognition.lang = 'en-US';
-
-    this.recognition.onresult = (event) => {
-      const transcript = Array.from(event.results)
-        .map(result => result[0].transcript)
-        .join('');
-
-      const isFinal = event.results[event.results.length - 1].isFinal;
-      this.onTranscript(transcript, isFinal);
-    };
-
-    this.recognition.onerror = (event) => {
-      this.onError(`Voice recognition error: ${event.error}`);
-      this.isListening = false;
-      this.onStateChange({ listening: false, error: event.error });
-    };
-
-    this.recognition.onend = () => {
-      this.isListening = false;
-      this.onStateChange({ listening: false });
-    };
-  }
-
-  startListening() {
-    if (!this.voiceEnabled) {
-      this.onError('Voice recognition not supported in this browser');
-      return false;
-    }
-
-    try {
-      this.recognition.start();
-      this.isListening = true;
-      this.onStateChange({ listening: true });
-      return true;
-    } catch (error) {
-      this.onError(`Failed to start listening: ${error.message}`);
-      return false;
-    }
-  }
-
-  stopListening() {
-    if (this.recognition && this.isListening) {
-      this.recognition.stop();
-      this.isListening = false;
-      this.onStateChange({ listening: false });
-    }
-  }
-
-  // === Voice Output ===
-
-  speak(text, options = {}) {
-    if (!this.speechEnabled) {
-      this.onError('Speech synthesis not supported');
-      return;
-    }
-
-    // Cancel any ongoing speech
-    speechSynthesis.cancel();
-
-    const utterance = new SpeechSynthesisUtterance(text);
-    utterance.rate = options.rate || 1;
-    utterance.pitch = options.pitch || 1;
-    utterance.volume = options.volume || 1;
-
-    // Use a natural voice if available
-    const voices = speechSynthesis.getVoices();
-    const preferredVoice = voices.find(v =>
-      v.name.includes('Google') || v.name.includes('Natural') || v.name.includes('Samantha')
-    );
-    if (preferredVoice) {
-      utterance.voice = preferredVoice;
-    }
-
-    utterance.onstart = () => this.onStateChange({ speaking: true });
-    utterance.onend = () => this.onStateChange({ speaking: false });
-    utterance.onerror = (e) => {
-      this.onError(`Speech error: ${e.error}`);
-      this.onStateChange({ speaking: false });
-    };
-
-    speechSynthesis.speak(utterance);
-  }
-
-  stopSpeaking() {
-    if (this.speechEnabled) {
-      speechSynthesis.cancel();
-      this.onStateChange({ speaking: false });
-    }
-  }
-
-  // === Text Chat ===
-
-  async sendMessage(message, options = {}) {
-    // Add to context
-    this.context.push({ role: 'user', content: message });
-    if (this.context.length > this.maxContextLength * 2) {
-      this.context = this.context.slice(-this.maxContextLength * 2);
-    }
-
-    try {
-      this.onStateChange({ thinking: true });
-
-      // Call real Claude API
-      const response = await this.callClaudeAPI(message, options);
-
-      // Add response to context
-      this.context.push({ role: 'assistant', content: response });
-
-      this.onResponse(response);
-      this.onStateChange({ thinking: false });
-
-      // Optionally speak the response
-      if (options.speakResponse) {
-        this.speak(response);
-      }
-
-      return response;
-    } catch (error) {
-      this.onError(`AI request failed: ${error.message}`);
-      this.onStateChange({ thinking: false, error: error.message });
-      throw error;
-    }
-  }
-
-  // Call real Claude API endpoint with MCP tool integration
-  async callClaudeAPI(message, options = {}) {
-    try {
-      // Get current project from localStorage or options
-      const currentProject = options.projectId || localStorage.getItem('dss_current_project');
-      const userId = options.userId || 1;
-
-      const response = await fetch('/api/claude/chat', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-          message: message,
-          context: options.context || {},
-          history: this.context.slice(0, -1), // All context except the current message
-          project_id: currentProject,
-          user_id: userId,
-          enable_tools: options.enableTools !== false // Default to true
-        })
-      });
-
-      if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.response || 'Failed to get response from Claude');
-      }
-
-      const data = await response.json();
-
-      if (!data.success) {
-        throw new Error(data.response || 'Claude API returned an error');
-      }
-
-      // Store tool usage info for display
-      this.lastToolsUsed = data.tools_used || [];
-
-      return data.response;
-    } catch (error) {
-      // If API fails, provide helpful error message
-      throw new Error(`Claude API error: ${error.message}. Make sure ANTHROPIC_API_KEY is configured in your .env file.`);
-    }
-  }
-
-  // Get last tools used by Claude
-  getLastToolsUsed() {
-    return this.lastToolsUsed || [];
-  }
-
-  // Set current project context
-  setProject(projectId) {
-    localStorage.setItem('dss_current_project', projectId);
-  }
-
-  // Get current project
-  getProject() {
-    return localStorage.getItem('dss_current_project');
-  }
-
-  // === Context Management ===
-
-  setSystemPrompt(prompt) {
-    this.systemPrompt = prompt;
-  }
-
-  clearContext() {
-    this.context = [];
-  }
-
-  getContext() {
-    return [...this.context];
-  }
-
-  // === Design System Specific Commands ===
-
-  async extractTokens(fileKey) {
-    return this.sendMessage(`Extract design tokens from Figma file ${fileKey}`);
-  }
-
-  async syncComponents(fileKey) {
-    return this.sendMessage(`Sync components from Figma file ${fileKey}`);
-  }
-
-  async runVisualDiff(baseline, current) {
-    return this.sendMessage(`Run visual diff between ${baseline} and ${current}`);
-  }
-}
-
-// === AI Chat Web Component ===
-
-class DsAiChat extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-    this.ai = null;
-    this.messages = [];
-  }
-
-  connectedCallback() {
-    this.projects = [];
-    this.render();
-    this.setupAI();
-    this.setupEventListeners();
-    this.restoreTeamContext();
-    this.loadProjects();
-
-    // Subscribe to global project changes (component awareness)
-    if (window.app?.store) {
-      // Read current state immediately (prevent race condition)
-      const currentProject = window.app.store.get('currentProject');
-      if (currentProject) {
-        const projects = window.app.store.get('projects');
-        const project = projects.find(p => p.id === currentProject);
-        if (project) {
-          this.updateProjectContext(project);
-        }
-      }
-
-      // Subscribe to future changes
-      this.unsubscribeProject = window.app.store.subscribe('currentProject', (projectId) => {
-        const projects = window.app.store.get('projects');
-        const project = projects.find(p => p.id === projectId);
-        if (project) {
-          this.updateProjectContext(project);
-        }
-      });
-    }
-  }
-
-  disconnectedCallback() {
-    // Unsubscribe from project changes (prevent memory leaks)
-    if (this.unsubscribeProject) {
-      this.unsubscribeProject();
-      this.unsubscribeProject = null;
-    }
-  }
-
-  restoreTeamContext() {
-    // Restore last selected team from localStorage
-    const savedTeam = localStorage.getItem('dss_team_context') || 'all';
-    const teamSelect = this.shadowRoot.querySelector('.team-select');
-    if (teamSelect) {
-      teamSelect.value = savedTeam;
-      this.updateChatContext(savedTeam);
-    }
-  }
-
-  setupAI() {
-    this.ai = new AIAssistant({
-      onTranscript: (text, isFinal) => {
-        this.updateInput(text);
-        if (isFinal) {
-          this.handleSend();
-        }
-      },
-      onResponse: (response) => {
-        this.addMessage('assistant', response);
-      },
-      onError: (error) => {
-        this.addMessage('error', error);
-      },
-      onStateChange: (state) => {
-        this.updateState(state);
-      },
-      onPromptUser: (promptInfo) => {
-        this.addMessage('prompt', promptInfo.prompt);
-      }
-    });
-  }
-
-  setupEventListeners() {
-    const input = this.shadowRoot.querySelector('.chat-input');
-    const sendBtn = this.shadowRoot.querySelector('.send-btn');
-    const voiceBtn = this.shadowRoot.querySelector('.voice-btn');
-
-    input.addEventListener('keypress', (e) => {
-      if (e.key === 'Enter' && !e.shiftKey) {
-        e.preventDefault();
-        this.handleSend();
-      }
-    });
-
-    sendBtn.addEventListener('click', () => this.handleSend());
-
-    voiceBtn?.addEventListener('click', () => {
-      if (this.ai.isListening) {
-        this.ai.stopListening();
-      } else {
-        this.ai.startListening();
-      }
-    });
-
-    // Listen for team context change from header
-    window.addEventListener('team-context-changed', (e) => {
-      this.updateChatContext(e.detail.team);
-    });
-  }
-
-  handleTeamChange(teamContext) {
-    // Store team context
-    localStorage.setItem('dss_team_context', teamContext);
-
-    // Dispatch event for dashboard to update
-    window.dispatchEvent(new CustomEvent('team-context-changed', {
-      detail: { team: teamContext }
-    }));
-
-    // Update chat system prompt
-    this.updateChatContext(teamContext);
-
-    // Add system message
-    const teamNames = {
-      'all': 'All Tools',
-      'ui': 'UI Team',
-      'ux': 'UX Team',
-      'qa': 'QA Team'
-    };
-    this.addMessage('system', `Switched to ${teamNames[teamContext]} view. Dashboard and tools updated.`);
-  }
-
-  updateChatContext(teamContext) {
-    const contextPrompts = {
-      'all': 'You are a DSS assistant. Help with all design system operations.',
-      'ui': `You are a DSS assistant for the UI Team. Focus on:
-• Extracting tokens and components from Figma
-• Generating component code
-• Syncing design updates
-• Component library maintenance
-
-Available commands: extract_tokens, extract_components, generate_component_code, sync_tokens_to_file`,
-      'ux': `You are a DSS assistant for the UX Team. Focus on:
-• Design consistency and token validation
-• Style pattern analysis
-• Naming conventions
-• Brand guideline compliance
-
-Available commands: analyze_style_values, check_naming_consistency, find_style_patterns, validate_tokens`,
-      'qa': `You are a DSS assistant for the QA Team. Focus on:
-• Finding quick wins and issues
-• Component validation
-• Unused style detection
-• Test coverage analysis
-
-Available commands: get_quick_wins, validate_tokens, find_unused_styles, analyze_react_components`
-    };
-
-    this.ai.setSystemPrompt(contextPrompts[teamContext] || contextPrompts['all']);
-  }
-
-  updateInput(text) {
-    const input = this.shadowRoot.querySelector('.chat-input');
-    input.value = text;
-  }
-
-  async handleSend() {
-    const input = this.shadowRoot.querySelector('.chat-input');
-    const message = input.value.trim();
-    if (!message) return;
-
-    this.addMessage('user', message);
-    input.value = '';
-
-    // Check for /help command
-    if (message === '/help' || message === 'help') {
-      this.showHelp();
-      return;
-    }
-
-    // Check for /cancel
-    if (message === '/cancel' || message === 'cancel') {
-      if (this.ai.pendingCommand || this.ai.pendingConfirmation) {
-        this.ai.pendingCommand = null;
-        this.ai.pendingConfirmation = null;
-        this.addMessage('system', 'Command cancelled.');
-      }
-      return;
-    }
-
-    // Check if we're waiting for confirmation
-    if (this.ai.pendingConfirmation) {
-      const result = await this.ai.confirmCommand(message);
-      if (result.error) {
-        this.addMessage('error', result.error);
-      } else if (result.cancelled) {
-        this.addMessage('system', result.message);
-      } else if (result.success) {
-        this.addMessage('assistant', result.result);
-      } else if (!result.success && result.error) {
-        this.addMessage('error', `Command failed: ${result.error}`);
-      }
-      return;
-    }
-
-    // Check if we're in a command flow (collecting parameters)
-    if (this.ai.pendingCommand) {
-      const result = await this.ai.handleCommandInput(message);
-      if (result.error) {
-        this.addMessage('error', result.error);
-      } else if (result.waiting) {
-        // Show confirmation prompt if generated
-        if (result.confirmation) {
-          this.addMessage('prompt', result.confirmation);
-        }
-      } else if (result.success) {
-        this.addMessage('assistant', result.result);
-      } else if (!result.success && result.command) {
-        this.addMessage('error', `Command failed: ${result.error}`);
-      }
-      return;
-    }
-
-    // Check for slash commands
-    const parsed = this.ai.parseCommand(message);
-    if (parsed) {
-      const result = await this.ai.startCommand(parsed.command, parsed.inlineData || {});
-      if (!result.handled) {
-        this.addMessage('error', `Unknown command: ${parsed.command}. Type /help for available commands.`);
-      } else if (result.waiting) {
-        // Show form prompt
-        this.addMessage('prompt', result.prompt);
-      } else if (result.success) {
-        this.addMessage('assistant', result.result);
-      } else if (result.error) {
-        this.addMessage('error', result.error);
-      }
-      return;
-    }
-
-    // Regular message - send to AI
-    await this.ai.sendMessage(message);
-
-    // Show tools used if any
-    const toolsUsed = this.ai.getLastToolsUsed();
-    if (toolsUsed && toolsUsed.length > 0) {
-      const toolNames = toolsUsed.map(t => t.tool).join(', ');
-      this.addMessage('tool-info', `Tools used: ${toolNames}`);
-    }
-  }
-
-  showHelp() {
-    const commands = this.ai.commands;
-    const helpText = `**Available Commands**
-
-**Project Management**
-\`/init\` - Create a new DSS project
-\`/projects\` - List all projects
-\`/select <id>\` - Select a project
-
-**Figma Integration**
-\`/add-figma\` - Add Figma file to current project
-\`/figma-files\` - List Figma files in project
-\`/sync\` - Sync tokens from Figma
-
-**Analysis**
-\`/analyze\` - Analyze project for components
-\`/quick-wins\` - Find quick improvements
-\`/discover\` - Run project discovery
-
-**Utilities**
-\`/help\` - Show this help
-\`/cancel\` - Cancel current command
-\`/status\` - Show current project status
-
-**Tips**
-- Commands also work in natural language
-- "init project" = \`/init\`
-- "sync tokens" = \`/sync\`
-- Press Enter to use defaults for optional fields`;
-
-    this.addMessage('assistant', helpText);
-  }
-
-  addMessage(role, content) {
-    this.messages.push({ role, content, timestamp: new Date() });
-    this.renderMessages();
-  }
-
-  async loadProjects() {
-    try {
-      const response = await fetch('/api/projects');
-      if (response.ok) {
-        this.projects = await response.json();
-        this.renderProjectSelector();
-      }
-    } catch (e) {
-      console.error('Failed to load projects:', e);
-    }
-  }
-
-  renderProjectSelector() {
-    const selector = this.shadowRoot.querySelector('.project-select');
-    if (!selector || !this.projects) return;
-
-    const currentProject = this.ai.getProject();
-    selector.innerHTML = `
-      <option value="">No project (basic chat)</option>
-      ${this.projects.map(p => `
-        <option value="${p.id}" ${p.id === currentProject ? 'selected' : ''}>
-          ${p.name}
-        </option>
-      `).join('')}
-    `;
-  }
-
-  updateProjectContext(project) {
-    const projectId = project?.id || project;
-    this.ai.setProject(projectId);
-
-    if (projectId && project) {
-      const projectName = project.name || projectId;
-
-      // Load full project context from API (MVP1 feature)
-      this.loadProjectContext(project).then(context => {
-        if (context) {
-          const rootPath = context.project?.root_path || 'not configured';
-          this.addMessage('system', `Project context set to: ${projectName}\nWorking directory: ${rootPath}`);
-        } else {
-          this.addMessage('system', `Project context set to: ${projectName}. Claude can now access project data and tools.`);
-        }
-      });
-    } else {
-      this.addMessage('system', 'Project context cleared. Using basic chat mode.');
-    }
-  }
-
-  async loadProjectContext(project) {
-    /**
-     * Load full project context including file tree for AI injection.
-     * MVP1 Configuration Architecture feature.
-     */
-    try {
-      const response = await fetch(`/api/projects/${project.id}/context`);
-      if (!response.ok) {
-        console.warn('Failed to load project context:', response.status);
-        return null;
-      }
-
-      const context = await response.json();
-
-      // Update AI with project context
-      if (this.ai && this.ai.setContext) {
-        this.ai.setContext({
-          projectId: project.id,
-          projectName: project.name,
-          rootPath: context.project?.root_path,
-          fileTree: context.file_tree,
-          config: context.config,
-          contextFiles: context.context_files
-        });
-      }
-
-      // Store context for later use
-      this.projectContext = context;
-
-      return context;
-    } catch (error) {
-      console.error('Failed to load project context:', error);
-      return null;
-    }
-  }
-
-  updateState(state) {
-    const voiceBtn = this.shadowRoot.querySelector('.voice-btn');
-    const statusIndicator = this.shadowRoot.querySelector('.status-indicator');
-
-    if (voiceBtn) {
-      voiceBtn.classList.toggle('listening', state.listening);
-    }
-
-    if (statusIndicator) {
-      if (state.thinking) {
-        statusIndicator.textContent = 'Thinking...';
-        statusIndicator.className = 'status-indicator thinking';
-      } else if (state.listening) {
-        statusIndicator.textContent = 'Listening...';
-        statusIndicator.className = 'status-indicator listening';
-      } else if (state.speaking) {
-        statusIndicator.textContent = 'Speaking...';
-        statusIndicator.className = 'status-indicator speaking';
-      } else {
-        statusIndicator.textContent = '';
-        statusIndicator.className = 'status-indicator';
-      }
-    }
-  }
-
-  renderMessages() {
-    const container = this.shadowRoot.querySelector('.messages');
-    container.innerHTML = this.messages.map(msg => `
-      <div class="message message--${msg.role}">
-        <div class="message__content">${this.formatMessage(msg.content)}</div>
-      </div>
-    `).join('');
-    container.scrollTop = container.scrollHeight;
-  }
-
-  formatMessage(content) {
-    // Use marked.js for full markdown parsing
-    if (typeof marked !== 'undefined' && marked.parse) {
-      try {
-        // Configure marked renderer for code blocks
-        const renderer = new marked.Renderer();
-        renderer.code = function(code, language) {
-          const lang = language || 'plaintext';
-          if (typeof hljs !== 'undefined') {
-            try {
-              const highlighted = hljs.highlightAuto(code).value;
-              return `<pre><code class="hljs">${highlighted}</code></pre>`;
-            } catch (e) { /* fallback below */ }
-          }
-          const escaped = code.replace(/</g, '&lt;').replace(/>/g, '&gt;');
-          return `<pre><code>${escaped}</code></pre>`;
-        };
-
-        const rawHtml = marked.parse(content, {
-          renderer: renderer,
-          breaks: true,
-          gfm: true
-        });
-
-        // Sanitize HTML
-        if (typeof DOMPurify !== 'undefined') {
-          return DOMPurify.sanitize(rawHtml, {
-            ADD_TAGS: ['code', 'pre', 'span'],
-            ADD_ATTR: ['class']
-          });
-        }
-        return rawHtml;
-      } catch (e) {
-        console.warn('Markdown parsing error:', e);
-      }
-    }
-
-    // Fallback to basic formatting
-    return content
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
-      .replace(/\*(.*?)\*/g, '<em>$1</em>')
-      .replace(/`(.*?)`/g, '<code>$1</code>')
-      .replace(/\n/g, '<br>')
-      .replace(/• /g, '&bull; ');
-  }
-
-  render() {
-    this.shadowRoot.innerHTML = `
-      <style>
-        @import '/admin-ui/css/tokens.css';
-        @import '/admin-ui/css/components.css';
-
-        /* Highlight.js github-dark theme (inline for Shadow DOM) */
-        .hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}
-
-        :host {
-          display: flex;
-          flex-direction: column;
-          width: 100%;
-          height: 100%;
-          background: var(--card);
-          border: 1px solid var(--border);
-          border-radius: var(--radius-xl);
-          overflow: hidden;
-          box-sizing: border-box;
-        }
-
-        .header {
-          display: flex;
-          align-items: center;
-          gap: var(--space-3);
-          padding: var(--space-4);
-          border-bottom: 1px solid var(--border);
-        }
-
-        .header__title {
-          font-weight: var(--font-semibold);
-          flex: 1;
-        }
-
-        .status-indicator {
-          font-size: var(--text-xs);
-          color: var(--muted-foreground);
-        }
-
-        .status-indicator.thinking { color: var(--primary); }
-        .status-indicator.listening { color: var(--success); }
-        .status-indicator.speaking { color: var(--warning); }
-
-        .messages {
-          flex: 1;
-          overflow-y: auto;
-          padding: var(--space-4);
-          display: flex;
-          flex-direction: column;
-          gap: var(--space-3);
-          min-height: 0;
-        }
-
-        .message {
-          max-width: 85%;
-          padding: var(--space-3) var(--space-4);
-          border-radius: var(--radius-lg);
-          font-size: var(--text-sm);
-          line-height: var(--leading-relaxed);
-        }
-
-        .message--user {
-          align-self: flex-end;
-          background: var(--primary);
-          color: var(--primary-foreground);
-        }
-
-        .message--assistant {
-          align-self: flex-start;
-          background: var(--muted);
-          color: var(--foreground);
-        }
-
-        .message--error {
-          align-self: center;
-          background: var(--destructive);
-          color: var(--destructive-foreground);
-          font-size: var(--text-xs);
-        }
-
-        .message--system {
-          align-self: center;
-          background: var(--accent);
-          color: var(--accent-foreground);
-          font-size: var(--text-xs);
-          font-style: italic;
-        }
-
-        .message--prompt {
-          align-self: flex-start;
-          background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
-          color: var(--foreground);
-          font-size: var(--text-sm);
-          border-left: 3px solid var(--primary);
-          font-family: var(--font-mono);
-        }
-
-        .message--tool-info {
-          align-self: center;
-          background: rgba(59, 130, 246, 0.1);
-          color: var(--primary);
-          font-size: var(--text-xs);
-          padding: var(--space-2) var(--space-3);
-          border-radius: var(--radius);
-          border: 1px dashed var(--primary);
-        }
-
-        /* Inline code */
-        .message__content code {
-          background: rgba(0,0,0,0.2);
-          padding: 0.2em 0.4em;
-          border-radius: var(--radius-sm);
-          font-family: var(--font-mono);
-          font-size: 0.9em;
-        }
-
-        /* Code blocks */
-        .message__content pre {
-          background: #1e1e1e;
-          border-radius: var(--radius);
-          padding: var(--space-3);
-          overflow-x: auto;
-          margin: var(--space-2) 0;
-        }
-
-        .message__content pre code {
-          background: transparent;
-          padding: 0;
-          font-size: 0.85em;
-          line-height: 1.5;
-          color: #d4d4d4;
-        }
-
-        /* Headers */
-        .message__content h1,
-        .message__content h2,
-        .message__content h3,
-        .message__content h4 {
-          margin: var(--space-3) 0 var(--space-2) 0;
-          font-weight: var(--font-semibold);
-          line-height: 1.3;
-        }
-
-        .message__content h1 { font-size: 1.3em; }
-        .message__content h2 { font-size: 1.2em; }
-        .message__content h3 { font-size: 1.1em; }
-        .message__content h4 { font-size: 1em; }
-
-        /* Lists */
-        .message__content ul,
-        .message__content ol {
-          margin: var(--space-2) 0;
-          padding-left: var(--space-4);
-        }
-
-        .message__content li {
-          margin: var(--space-1) 0;
-        }
-
-        /* Blockquotes */
-        .message__content blockquote {
-          border-left: 3px solid var(--primary);
-          margin: var(--space-2) 0;
-          padding-left: var(--space-3);
-          color: var(--muted-foreground);
-          font-style: italic;
-        }
-
-        /* Links */
-        .message__content a {
-          color: var(--primary);
-          text-decoration: underline;
-        }
-
-        /* Tables */
-        .message__content table {
-          border-collapse: collapse;
-          width: 100%;
-          margin: var(--space-2) 0;
-          font-size: 0.9em;
-        }
-
-        .message__content th,
-        .message__content td {
-          border: 1px solid var(--border);
-          padding: var(--space-2);
-          text-align: left;
-        }
-
-        .message__content th {
-          background: rgba(0,0,0,0.1);
-          font-weight: var(--font-semibold);
-        }
-
-        /* Paragraphs */
-        .message__content p {
-          margin: var(--space-2) 0;
-        }
-
-        .message__content p:first-child {
-          margin-top: 0;
-        }
-
-        .message__content p:last-child {
-          margin-bottom: 0;
-        }
-
-        /* Horizontal rule */
-        .message__content hr {
-          border: none;
-          border-top: 1px solid var(--border);
-          margin: var(--space-3) 0;
-        }
-
-        /* Strong/Bold */
-        .message__content strong {
-          font-weight: var(--font-semibold);
-        }
-
-        .input-area {
-          display: flex;
-          align-items: flex-end;
-          gap: var(--space-2);
-          padding: var(--space-4);
-          border-top: 1px solid var(--border);
-          position: sticky;
-          bottom: 0;
-          background: var(--card);
-          z-index: 10;
-          flex-shrink: 0;
-          width: 100%;
-          box-sizing: border-box;
-        }
-
-        .chat-input {
-          flex: 1;
-          min-width: 0;
-          max-width: 100%;
-          padding: var(--space-3);
-          background: var(--input);
-          border: 1px solid var(--border);
-          border-radius: var(--radius);
-          color: var(--foreground);
-          font-family: var(--font-sans);
-          font-size: var(--text-sm);
-          line-height: 1.5;
-          resize: none;
-          appearance: none;
-        }
-
-        .chat-input::placeholder {
-          color: var(--muted-foreground);
-          opacity: 1;
-        }
-
-        .chat-input:focus {
-          outline: none;
-          border-color: var(--ring);
-          background: var(--card);
-          box-shadow: 0 0 0 2px color-mix(in oklch, var(--ring) 25%, transparent);
-        }
-
-        .btn {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          width: 2.5rem;
-          height: 2.5rem;
-          min-width: 2.5rem;
-          flex-shrink: 0;
-          border-radius: var(--radius);
-          border: none;
-          cursor: pointer;
-          transition: background var(--duration-fast);
-        }
-
-        .send-btn {
-          background: var(--primary);
-          color: var(--primary-foreground);
-        }
-
-        .send-btn:hover {
-          opacity: 0.9;
-        }
-
-        .voice-btn {
-          background: var(--secondary);
-          color: var(--secondary-foreground);
-        }
-
-        .voice-btn:hover {
-          background: var(--accent);
-        }
-
-        .voice-btn.listening {
-          background: var(--success);
-          color: var(--success-foreground);
-          animation: pulse 1s infinite;
-        }
-
-        @keyframes pulse {
-          0%, 100% { opacity: 1; }
-          50% { opacity: 0.7; }
-        }
-
-        .icon {
-          width: 1.25rem;
-          height: 1.25rem;
-        }
-
-        .team-selector {
-          padding: var(--space-3) var(--space-4);
-          border-bottom: 1px solid var(--border);
-          background: var(--muted);
-        }
-
-        .team-selector__label {
-          display: block;
-          font-size: var(--text-xs);
-          font-weight: var(--font-medium);
-          color: var(--muted-foreground);
-          margin-bottom: var(--space-2);
-        }
-
-        .team-select {
-          width: 100%;
-          padding: var(--space-2) var(--space-3);
-          background: var(--background);
-          border: 1px solid var(--border);
-          border-radius: var(--radius);
-          color: var(--foreground);
-          font-size: var(--text-sm);
-          cursor: pointer;
-        }
-
-        .team-select:focus {
-          outline: none;
-          border-color: var(--ring);
-        }
-
-        .team-select option {
-          background: var(--background);
-          color: var(--foreground);
-        }
-
-      </style>
-
-      <div class="header">
-        <span class="header__title">AI Assistant</span>
-        <span class="status-indicator"></span>
-      </div>
-
-      <div class="messages"></div>
-
-      <div class="input-area">
-        <textarea class="chat-input" placeholder="Ask about your design system..." rows="1"></textarea>
-        ${this.ai?.voiceEnabled ? `
-          <button class="btn voice-btn" title="Voice input">
-            <svg class="icon" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
-              <path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z"/>
-              <path d="M19 10v2a7 7 0 0 1-14 0v-2"/>
-              <line x1="12" x2="12" y1="19" y2="22"/>
-            </svg>
-          </button>
-        ` : ''}
-        <button class="btn send-btn" title="Send message">
-          <svg class="icon" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
-            <path d="m22 2-7 20-4-9-9-4Z"/>
-            <path d="M22 2 11 13"/>
-          </svg>
-        </button>
-      </div>
-    `;
-  }
-}
-
-customElements.define('ds-ai-chat', DsAiChat);
-
-export { AIAssistant, DsAiChat };
-export default AIAssistant;
diff --git a/admin-ui/js/core/api.js b/admin-ui/js/core/api.js
deleted file mode 100644
index 703ac21..0000000
--- a/admin-ui/js/core/api.js
+++ /dev/null
@@ -1,187 +0,0 @@
-/**
- * Design System Server (DSS) - API Client
- *
- * Centralized API communication layer.
- * No mocks - requires backend connection.
- */
-
-const API_BASE = '/api';
-
-class ApiClient {
-  constructor(baseUrl = API_BASE) {
-    this.baseUrl = baseUrl;
-    this.defaultHeaders = {
-      'Content-Type': 'application/json'
-    };
-    this.connected = null;
-  }
-
-  setAuthToken(token) {
-    if (token) {
-      this.defaultHeaders['Authorization'] = `Bearer ${token}`;
-    } else {
-      delete this.defaultHeaders['Authorization'];
-    }
-  }
-
-  async request(endpoint, options = {}) {
-    const url = `${this.baseUrl}${endpoint}`;
-    const config = {
-      ...options,
-      headers: {
-        ...this.defaultHeaders,
-        ...options.headers
-      }
-    };
-
-    const response = await fetch(url, config);
-
-    if (!response.ok) {
-      const error = await response.json().catch(() => ({ message: response.statusText }));
-      throw new ApiError(error.detail || error.message || 'Request failed', response.status, error);
-    }
-
-    const text = await response.text();
-    return text ? JSON.parse(text) : null;
-  }
-
-  get(endpoint, options = {}) {
-    return this.request(endpoint, { ...options, method: 'GET' });
-  }
-
-  post(endpoint, data, options = {}) {
-    return this.request(endpoint, {
-      ...options,
-      method: 'POST',
-      body: JSON.stringify(data)
-    });
-  }
-
-  put(endpoint, data, options = {}) {
-    return this.request(endpoint, {
-      ...options,
-      method: 'PUT',
-      body: JSON.stringify(data)
-    });
-  }
-
-  delete(endpoint, options = {}) {
-    return this.request(endpoint, { ...options, method: 'DELETE' });
-  }
-
-  // === Domain Methods ===
-
-  async getHealth() {
-    return this.get('/health');
-  }
-
-  async getProjects() {
-    return this.get('/projects');
-  }
-
-  async getProject(id) {
-    return this.get(`/projects/${id}`);
-  }
-
-  async createProject(data) {
-    return this.post('/projects', data);
-  }
-
-  async updateProject(id, data) {
-    return this.put(`/projects/${id}`, data);
-  }
-
-  async deleteProject(id) {
-    return this.delete(`/projects/${id}`);
-  }
-
-  async ingestFigma(fileKey, options = {}) {
-    return this.post('/ingest/figma', { file_key: fileKey, ...options });
-  }
-
-  async visualDiff(baseline, current) {
-    return this.post('/visual-diff', { baseline, current });
-  }
-
-  async getFigmaTasks() {
-    return this.get('/figma-bridge/tasks');
-  }
-
-  async sendFigmaTask(task) {
-    return this.post('/figma-bridge/tasks', task);
-  }
-
-  async getConfig() {
-    return this.get('/config');
-  }
-
-  async updateConfig(config) {
-    return this.put('/config', config);
-  }
-
-  async getFigmaConfig() {
-    return this.get('/config/figma');
-  }
-
-  async setFigmaToken(token) {
-    return this.put('/config', { figma_token: token });
-  }
-
-  async testFigmaConnection() {
-    return this.post('/config/figma/test', {});
-  }
-
-  async getServices() {
-    return this.get('/services');
-  }
-
-  async configureService(serviceName, config) {
-    return this.put(`/services/${serviceName}`, config);
-  }
-
-  async getStorybookStatus() {
-    return this.get('/services/storybook');
-  }
-
-  async getMode() {
-    return this.get('/mode');
-  }
-
-  async setMode(mode) {
-    return this.put('/mode', { mode });
-  }
-
-  async getStats() {
-    return this.get('/stats');
-  }
-
-  async getActivity(limit = 50) {
-    return this.get(`/activity?limit=${limit}`);
-  }
-
-  async executeMCPTool(toolName, params = {}) {
-    return this.post(`/mcp/${toolName}`, params);
-  }
-
-  async getQuickWins(path = '.') {
-    return this.post('/mcp/get_quick_wins', { path });
-  }
-
-  async analyzeProject(path = '.') {
-    return this.post('/mcp/discover_project', { path });
-  }
-}
-
-class ApiError extends Error {
-  constructor(message, status, data) {
-    super(message);
-    this.name = 'ApiError';
-    this.status = status;
-    this.data = data;
-  }
-}
-
-const api = new ApiClient();
-
-export { api, ApiClient, ApiError };
-export default api;
diff --git a/admin-ui/js/core/app.js b/admin-ui/js/core/app.js
deleted file mode 100644
index 6a2389f..0000000
--- a/admin-ui/js/core/app.js
+++ /dev/null
@@ -1,4350 +0,0 @@
-/**
- * Design System Server (DSS) - App Shell
- *
- * Main application controller.
- * Handles routing, state, and integration with services.
- */
-
-import store from '../stores/app-store.js';
-import figmaService from '../services/figma-service.js';
-import discoveryService from '../services/discovery-service.js';
-import teamService from '../services/team-service.js';
-import toolsService from '../services/tools-service.js';
-import claudeService from '../services/claude-service.js';
-import DashboardService from '../services/dashboard-service.js';
-import pluginService from '../services/plugin-service.js';
-import { initializePlugins } from '../plugins/index.js';
-import logger from './logger.js';
-import themeManager from './theme.js';
-import { UITeamDashboard, UXTeamDashboard, QATeamDashboard } from './team-dashboards.js';
-
-// Enterprise Architecture Modules
-import router from './router.js';
-import { subscribe as subscribeToNotifications, notifySuccess, notifyError, notifyInfo, ErrorCode } from './messaging.js';
-import { createProjectWorkflow } from './workflows.js';
-import { handleError } from './error-handler.js';
-import { loadConfig, getStorybookUrl, getDssHost } from './config-loader.js';
-import { getEnabledComponents, getComponentSetting, setComponentSetting } from './component-config.js';
-import { sanitizeHtml, setSafeHtml, sanitizeText, escapeHtml } from './sanitizer.js';
-import LandingPage from './landing-page.js';
-import themeLoader from './theme-loader.js';
-
-class App {
-  constructor() {
-    this.store = store;
-    this.services = {
-      figma: figmaService,
-      discovery: discoveryService,
-      team: teamService
-    };
-    // Track listener setup to prevent duplicates
-    this.listeners = {
-      teamContextChanged: null,
-      hasTeamContextListener: false
-    };
-  }
-
-  // === Initialization ===
-
-  async init() {
-    logger.info('App', 'Initializing application...');
-
-    // FIRST: Load server configuration (blocking operation)
-    // This must complete before any component uses the config
-    try {
-      await loadConfig();
-      this.store.set({ isConfigLoading: false });
-      logger.info('App', 'Server configuration loaded');
-    } catch (error) {
-      this.store.set({
-        isConfigLoading: false,
-        configError: error.message
-      });
-      logger.error('App', 'Failed to load server configuration', { error: error.message });
-      notifyError('Failed to load server configuration. Some features may not work correctly.', ErrorCode.SYSTEM_STARTUP_FAILED);
-    }
-
-    // Initialize DSS Theme Loader (validates CSS layers)
-    try {
-      await themeLoader.init();
-      this.themeLoader = themeLoader;
-      logger.info('App', 'DSS Theme Loader initialized');
-    } catch (error) {
-      logger.warn('App', 'Theme loader initialization failed, using fallback styles', { error: error.message });
-    }
-
-    // Initialize plugins
-    initializePlugins();
-    logger.info('App', 'Plugins initialized');
-
-    // Initialize enterprise messaging system
-    this.initializeMessaging();
-
-    // Initialize router with route definitions
-    this.initializeRouter();
-
-    // Subscribe to state changes
-    this.store.subscribe('currentPage', () => this.render());
-    this.store.subscribe('notifications', (notifs) => this.renderNotifications(notifs));
-    this.store.subscribe('currentProject', (projectId) => {
-      if (projectId) {
-        this.loadDashboardData(projectId);
-      }
-    });
-
-    // Listen for team context changes from chat sidebar (only add listener once)
-    if (!this.listeners.hasTeamContextListener) {
-      this.listeners.teamContextChanged = (e) => {
-        logger.info('App', 'Team context changed', { team: e.detail.team });
-        this.store.set({ teamContext: e.detail.team });
-        this.render();
-      };
-      window.addEventListener('team-context-changed', this.listeners.teamContextChanged);
-      this.listeners.hasTeamContextListener = true;
-    }
-
-    // Load initial data
-    await this.loadInitialData();
-
-    // Update Storybook link with configured URL
-    this.updateStorybookLink();
-
-    // Initialize landing page with dashboard cards
-    const appElement = document.getElementById('app');
-    if (appElement) {
-      this.landingPage = new LandingPage(appElement);
-      logger.info('App', 'Landing page initialized');
-    }
-
-    // Render the app
-    this.render();
-
-    // Set up polling
-    setInterval(() => this.refreshHealth(), 30000);
-
-    logger.info('App', 'Application initialized successfully');
-  }
-
-  /**
-   * Initialize enterprise messaging system
-   */
-  initializeMessaging() {
-    // Subscribe to notification events
-    subscribeToNotifications((notification) => {
-      // Use the existing store notification system for UI display
-      const duration = notification.duration || 5000;
-      this.store.notify(notification.message, notification.type, duration);
-
-      // Log to console for debugging
-      logger.info('Notification', notification.message, {
-        code: notification.code,
-        correlationId: notification.correlationId,
-      });
-    });
-
-    logger.info('App', 'Messaging system initialized');
-  }
-
-  /**
-   * Initialize router with route definitions
-   */
-  initializeRouter() {
-    // Register all application routes
-    router.registerAll([
-      {
-        path: 'dashboard',
-        name: 'dashboard',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'dashboard' });
-          this.render();
-        },
-      },
-      {
-        path: 'projects',
-        name: 'projects',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'projects' });
-          this.render();
-        },
-      },
-      {
-        path: 'tokens',
-        name: 'tokens',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'tokens' });
-          this.render();
-        },
-      },
-      {
-        path: 'components',
-        name: 'components',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'components' });
-          this.render();
-        },
-      },
-      {
-        path: 'figma',
-        name: 'figma',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'figma' });
-          this.render();
-        },
-      },
-      {
-        path: 'docs',
-        name: 'docs',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'docs' });
-          this.render();
-        },
-      },
-      {
-        path: 'teams',
-        name: 'teams',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'teams' });
-          this.render();
-        },
-      },
-      {
-        path: 'audit',
-        name: 'audit',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'audit' });
-          this.render();
-        },
-      },
-      {
-        path: 'settings',
-        name: 'settings',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'settings' });
-          this.render();
-        },
-      },
-      {
-        path: 'services',
-        name: 'services',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'services' });
-          this.render();
-        },
-      },
-      {
-        path: 'quick-wins',
-        name: 'quick-wins',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'quick-wins' });
-          this.render();
-        },
-      },
-      {
-        path: 'chat',
-        name: 'chat',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'chat' });
-          this.render();
-        },
-      },
-      {
-        path: 'plugins',
-        name: 'plugins',
-        handler: ({ router }) => {
-          this.store.set({ currentPage: 'plugins' });
-          this.render();
-        },
-      },
-      {
-        path: 'workdesk',
-        name: 'workdesk',
-        handler: async ({ router }) => {
-          logger.info('App', 'Mounting workdesk UI');
-
-          // Get app container
-          const appRoot = document.getElementById('app');
-          if (!appRoot) {
-            logger.error('App', 'Cannot mount workdesk: #app element not found');
-            return;
-          }
-
-          // Full page takeover - clear legacy layout
-          appRoot.innerHTML = '';
-
-          // Dynamically import and mount ds-shell
-          try {
-            await import('../components/layout/ds-shell.js');
-
-            const shell = document.createElement('ds-shell');
-            shell.setAttribute('mode', 'production');
-            appRoot.appendChild(shell);
-
-            logger.info('App', 'Workdesk mounted successfully');
-          } catch (error) {
-            logger.error('App', 'Failed to mount workdesk', { error: error.message });
-            appRoot.innerHTML = `
-              <div style="padding: 48px; text-align: center; color: #f48771;">
-                <h2>Failed to Load Workdesk</h2>
-                <p style="margin-top: 16px;">Error: ${error.message}</p>
-                <button onclick="window.location.hash='dashboard'" style="margin-top: 24px; padding: 8px 16px;">
-                  Return to Dashboard
-                </button>
-              </div>
-            `;
-          }
-        },
-      },
-    ]);
-
-    // Set default route
-    router.setDefaultRoute('dashboard');
-
-    // Initialize router
-    router.init();
-
-    logger.info('App', 'Router initialized with 13 routes');
-  }
-
-  async loadInitialData() {
-    this.store.setLoading('init', true);
-
-    try {
-      // Check API connection first
-      const health = await this.services.discovery.getHealth();
-      this.store.setHealth(health);
-      this.store.set({ apiConnected: true });
-
-      // Load runtime configuration and services
-      await this.loadConfig();
-
-      // Load discovery data
-      const discovery = await this.services.discovery.discover('.', false);
-      this.store.setDiscovery(discovery);
-
-      // Load stats
-      const stats = await this.services.discovery.getProjectStats();
-      this.store.setStats(stats);
-
-      // Load recent activity
-      const activity = await this.services.discovery.getRecentActivity();
-      this.store.setActivity(activity.items || []);
-
-      // Load projects
-      await this.loadProjects();
-
-      // Set user from session or default
-      this.store.setUser(
-        { id: '1', name: 'User', email: 'user@local' },
-        'team-1',
-        'TEAM_LEAD'
-      );
-
-    } catch (error) {
-      logger.error('App', 'Failed to load initial data', error);
-      this.store.set({ apiConnected: false });
-      this.store.setError('init', 'Cannot connect to DSS server. Run: python tools/api/server.py');
-      this.store.notify('Server offline. Start DSS API first.', 'error', 0);
-    }
-
-    this.store.setLoading('init', false);
-  }
-
-  async refreshHealth() {
-    try {
-      const health = await this.services.discovery.getHealth();
-      this.store.setHealth(health);
-    } catch (error) {
-      logger.error('App', 'Health check failed', error);
-    }
-  }
-
-  // === Navigation ===
-
-  navigate(page) {
-    window.location.hash = page;
-  }
-
-  // === Figma Actions ===
-
-  async extractTokens() {
-    const fileKey = this.store.get('figmaFileKey') || 'demo';
-    this.store.setLoading('extractTokens', true);
-
-    try {
-      const result = await this.services.figma.extractVariables(fileKey, 'css');
-      this.store.setTokens(result.tokens);
-      notifySuccess('Tokens extracted successfully!', ErrorCode.SUCCESS_OPERATION, {
-        fileKey,
-        tokenCount: result.tokens?.length || 0,
-      });
-      return result;
-    } catch (error) {
-      // Use enterprise error handler for user-friendly messages
-      handleError(error, {
-        operation: 'extract tokens',
-        service: 'figma',
-        fileKey,
-      });
-      throw error;
-    } finally {
-      this.store.setLoading('extractTokens', false);
-    }
-  }
-
-  async extractComponents() {
-    const fileKey = this.store.get('figmaFileKey') || 'demo';
-    this.store.setLoading('extractComponents', true);
-
-    try {
-      const result = await this.services.figma.extractComponents(fileKey);
-      this.store.setComponents(result.components);
-      this.store.notify('Components extracted successfully', 'success');
-      return result;
-    } catch (error) {
-      this.store.notify(`Failed to extract components: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('extractComponents', false);
-    }
-  }
-
-  async syncTokens() {
-    const fileKey = this.store.get('figmaFileKey') || 'demo';
-    this.store.setLoading('syncTokens', true);
-
-    try {
-      const result = await this.services.figma.syncTokens(fileKey, './admin-ui/css/tokens.css');
-      this.store.setLastSync(new Date().toISOString());
-      const count = result?.tokens_synced ?? 0;
-      this.store.notify(count > 0 ? `Synced ${count} tokens` : 'Sync complete', 'success');
-      return result;
-    } catch (error) {
-      this.store.notify(`Sync failed: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('syncTokens', false);
-    }
-  }
-
-  async runVisualDiff() {
-    const fileKey = this.store.get('figmaFileKey') || 'demo';
-    this.store.setLoading('visualDiff', true);
-
-    try {
-      const result = await this.services.figma.visualDiff(fileKey);
-      if (result.changes_detected) {
-        this.store.notify(`Visual diff: ${result.summary.changed} changes detected`, 'warning');
-      } else {
-        this.store.notify('No visual changes detected', 'success');
-      }
-      return result;
-    } catch (error) {
-      this.store.notify(`Visual diff failed: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('visualDiff', false);
-    }
-  }
-
-  async validateComponents() {
-    const fileKey = this.store.get('figmaFileKey') || 'demo';
-    this.store.setLoading('validate', true);
-
-    try {
-      const result = await this.services.figma.validateComponents(fileKey);
-      const { errors, warnings } = result.summary;
-      if (errors > 0) {
-        this.store.notify(`Validation: ${errors} errors, ${warnings} warnings`, 'error');
-      } else if (warnings > 0) {
-        this.store.notify(`Validation passed with ${warnings} warnings`, 'warning');
-      } else {
-        this.store.notify('All components valid', 'success');
-      }
-      return result;
-    } catch (error) {
-      this.store.notify(`Validation failed: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('validate', false);
-    }
-  }
-
-  async generateCode(componentName, framework = null) {
-    const fileKey = this.store.get('figmaFileKey') || 'demo';
-    const targetFramework = framework || this.store.get('componentFramework') || 'react';
-    this.store.setLoading('generateCode', true);
-
-    try {
-      const result = await this.services.figma.generateCode(fileKey, componentName, targetFramework);
-      this.store.set({
-        generatedCode: {
-          component: componentName,
-          framework: targetFramework,
-          code: result.code || result.generated_code || '// Code generation in progress...'
-        }
-      });
-      this.store.notify(`Generated ${componentName} for ${targetFramework}`, 'success');
-      this.render();
-      return result;
-    } catch (error) {
-      this.store.notify(`Code generation failed: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('generateCode', false);
-    }
-  }
-
-  // === Discovery Actions ===
-
-  getProjectRoot() {
-    const project = this.store.get('selectedProject');
-    return project?.root_path || project?.path || '.';
-  }
-
-  async runDiscovery(fullScan = false) {
-    this.store.setLoading('discovery', true);
-    const projectRoot = this.getProjectRoot();
-
-    try {
-      const result = await this.services.discovery.discover(projectRoot, fullScan);
-      this.store.setDiscovery(result);
-      const pathInfo = projectRoot !== '.' ? ` (${projectRoot})` : '';
-      this.store.notify(`Discovery complete${pathInfo}`, 'success');
-      return result;
-    } catch (error) {
-      this.store.notify(`Discovery failed: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('discovery', false);
-    }
-  }
-
-  // === Rendering ===
-
-  render() {
-    const contentArea = document.getElementById('page-content');
-    if (!contentArea) return;
-
-    const page = this.store.get('currentPage');
-    setSafeHtml(contentArea, this.getPageContent(page));
-
-    // Update active nav item
-    document.querySelectorAll('.nav-item[data-page]').forEach(item => {
-      item.classList.toggle('active', item.dataset.page === page);
-    });
-
-    // Attach event handlers
-    this.attachEventHandlers();
-  }
-
-  getPageContent(page) {
-    switch (page) {
-      case 'dashboard': return this.renderDashboard();
-      case 'services': return this.renderServices();
-      case 'quick-wins': return this.renderQuickWins();
-      case 'chat': return this.renderChat();
-      case 'projects': return this.renderProjects();
-      case 'tokens': return this.renderTokens();
-      case 'components': return this.renderComponents();
-      case 'figma': return this.renderFigma();
-      case 'docs': return this.renderDocs();
-      case 'teams': return this.renderTeams();
-      case 'plugins': return this.renderPlugins();
-      case 'audit': return this.renderAuditLog();
-      case 'settings': return this.renderSettings();
-      default: return this.renderDashboard();
-    }
-  }
-
-  renderDashboard() {
-    const teamContext = this.store.get('teamContext') || localStorage.getItem('dss_team_context') || 'all';
-    const health = this.store.get('health') || {};
-    const stats = this.store.get('stats') || {};
-    const discovery = this.store.get('discovery') || {};
-    const activity = this.store.get('activity') || [];
-    const dashboardData = this.store.get('dashboardData') || {
-      ux: { figma_files_count: 0, figma_files: [] },
-      ui: { token_drift: { total: 0, by_severity: {} }, code_metrics: {} },
-      qa: { esre_count: 0, test_summary: {} }
-    };
-
-    const healthScore = discovery.health?.score || 0;
-    const healthGrade = discovery.health?.grade || '-';
-
-    const teamNames = {
-      'all': 'All Teams',
-      'ui': 'UI Team',
-      'ux': 'UX Team',
-      'qa': 'QA Team'
-    };
-
-    // Get current project
-    const currentProjectId = this.store.get('currentProject');
-    const projects = this.store.get('projects') || [];
-    const currentProject = projects.find(p => p.id === currentProjectId);
-    const projectName = currentProject?.name || 'No Project Selected';
-
-    // Render team-specific dashboard
-    switch(teamContext) {
-      case 'ui':
-        return UITeamDashboard(health, stats, discovery, activity, projectName, dashboardData, currentProjectId, this);
-      case 'ux':
-        return UXTeamDashboard(health, stats, discovery, activity, projectName, dashboardData, currentProjectId, this);
-      case 'qa':
-        return QATeamDashboard(health, stats, discovery, activity, projectName, dashboardData, currentProjectId, this);
-      default:
-        return this.renderAllTeamsDashboard(health, stats, discovery, activity, healthScore, healthGrade);
-    }
-  }
-
-  renderAllTeamsDashboard(health, stats, discovery, activity, healthScore, healthGrade) {
-    return `
-      <div class="page-header">
-        <h1>Dashboard</h1>
-        <p class="text-muted">Design System Orchestrator Overview · <span class="text-primary">Select a team in chat panel →</span></p>
-      </div>
-
-      <!-- Stats Grid -->
-      <div class="grid grid-cols-4 gap-4 mt-6">
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Health Score</div>
-              <div class="stat__value flex items-center gap-2">
-                <span class="status-dot ${healthScore >= 80 ? 'status-dot--success' : healthScore >= 60 ? 'status-dot--warning' : 'status-dot--error'}"></span>
-                ${healthScore}% (${healthGrade})
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Design Tokens</div>
-              <div class="stat__value">${stats.tokens?.total || 0}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Components</div>
-              <div class="stat__value">${stats.components?.total || discovery.files?.components || 0}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Syncs Today</div>
-              <div class="stat__value">${stats.syncs?.today || 0}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <!-- Design System Ingestion -->
-      <ds-card class="mt-6">
-        <ds-card-header>
-          <ds-card-title>Ingest Design System</ds-card-title>
-          <ds-card-description>Add a design system using natural language</ds-card-description>
-        </ds-card-header>
-        <ds-card-content>
-          <div class="flex gap-3">
-            <input
-              type="text"
-              id="ingest-prompt"
-              class="input flex-1"
-              placeholder='Try: "add heroui", "ingest material ui", "use shadcn"...'
-              style="font-size: 0.95rem; padding: 0.75rem 1rem;"
-            />
-            <ds-button data-variant="primary" data-action="parseIngestion" ${this.store.isLoading('ingestion') ? 'loading' : ''}>
-              Ingest
-            </ds-button>
-            <ds-button data-variant="outline" data-action="browseDesignSystems">
-              Browse
-            </ds-button>
-          </div>
-          ${this.renderIngestionResult()}
-        </ds-card-content>
-      </ds-card>
-
-      <!-- Main Content -->
-      <div class="grid grid-cols-2 gap-6 mt-6">
-        <!-- Quick Actions -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Quick Actions</ds-card-title>
-            <ds-card-description>Common operations</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-wrap gap-3">
-              <ds-button data-variant="primary" data-action="extractTokens" ${this.store.isLoading('extractTokens') ? 'loading' : ''}>
-                Extract Tokens
-              </ds-button>
-              <ds-button data-variant="outline" data-action="syncTokens" ${this.store.isLoading('syncTokens') ? 'loading' : ''}>
-                Sync Tokens
-              </ds-button>
-              <ds-button data-variant="outline" data-action="validateComponents" ${this.store.isLoading('validate') ? 'loading' : ''}>
-                Validate
-              </ds-button>
-              <ds-button data-variant="outline" data-action="runVisualDiff" ${this.store.isLoading('visualDiff') ? 'loading' : ''}>
-                Visual Diff
-              </ds-button>
-              <ds-button data-variant="ghost" data-action="runDiscovery">
-                Re-scan Project
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Project Info -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Project Info</ds-card-title>
-            <ds-card-description>Discovered configuration</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-2 text-sm">
-              <div class="flex justify-between">
-                <span class="text-muted">Project Types:</span>
-                <span>${(discovery.project?.types || []).join(', ') || 'Unknown'}</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Frameworks:</span>
-                <span>${(discovery.project?.frameworks || []).join(', ') || 'None detected'}</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Total Files:</span>
-                <span>${discovery.files?.total || 0}</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">CSS Files:</span>
-                <span>${discovery.files?.css || 0}</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Git Branch:</span>
-                <span>${discovery.git?.branch || 'N/A'}</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Uncommitted:</span>
-                <span>${discovery.git?.uncommitted_changes || 0} changes</span>
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <!-- Recent Activity & Health Checks -->
-      <div class="grid grid-cols-2 gap-6 mt-6">
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Recent Activity</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            ${activity.length > 0 ? `
-              <div class="flex flex-col gap-3">
-                ${activity.slice(0, 5).map(item => `
-                  <div class="flex items-center gap-3 text-sm">
-                    <span class="status-dot ${item.status === 'success' ? 'status-dot--success' : item.status === 'warning' ? 'status-dot--warning' : 'status-dot--error'}"></span>
-                    <span class="flex-1">${item.message}</span>
-                    <span class="text-muted text-xs">${this.formatTime(item.timestamp)}</span>
-                  </div>
-                `).join('')}
-              </div>
-            ` : '<p class="text-muted text-sm">No recent activity</p>'}
-          </ds-card-content>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>System Health</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            ${health.checks ? `
-              <div class="flex flex-col gap-3">
-                ${health.checks.map(check => `
-                  <div class="flex items-center gap-3 text-sm">
-                    <span class="status-dot ${check.status === 'ok' ? 'status-dot--success' : check.status === 'warning' ? 'status-dot--warning' : 'status-dot--error'}"></span>
-                    <span class="flex-1">${check.name}</span>
-                    <span class="text-muted text-xs">${check.message || (check.latency ? `${check.latency}ms` : 'OK')}</span>
-                  </div>
-                `).join('')}
-              </div>
-            ` : '<p class="text-muted text-sm">Loading health status...</p>'}
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <!-- Health Issues -->
-      ${discovery.health?.issues?.length > 0 ? `
-        <ds-card class="mt-6">
-          <ds-card-header>
-            <ds-card-title>Improvement Suggestions</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-2">
-              ${discovery.health.issues.map(issue => `
-                <div class="flex items-center gap-3 text-sm">
-                  <ds-badge data-variant="warning">Suggestion</ds-badge>
-                  <span>${issue}</span>
-                </div>
-              `).join('')}
-            </div>
-          </ds-card-content>
-        </ds-card>
-      ` : ''}
-    `;
-  }
-
-  renderTokens() {
-    const tokens = this.store.get('tokens') || [];
-    const selectedProject = this.store.get('selectedProject');
-    const exportFormat = this.store.get('tokenExportFormat') || 'css';
-
-    const byCategory = tokens.reduce((acc, t) => {
-      const cat = t.category || 'other';
-      if (!acc[cat]) acc[cat] = [];
-      acc[cat].push(t);
-      return acc;
-    }, {});
-
-    const categoryOrder = ['color', 'spacing', 'sizing', 'typography', 'radius', 'shadow', 'other'];
-    const sortedCategories = Object.keys(byCategory).sort((a, b) => {
-      return categoryOrder.indexOf(a) - categoryOrder.indexOf(b);
-    });
-
-    const stats = {
-      total: tokens.length,
-      colors: byCategory.color?.length || 0,
-      spacing: byCategory.spacing?.length || 0,
-      typography: byCategory.typography?.length || 0
-    };
-
-    return `
-      <div class="page-header">
-        <h1>Design Tokens</h1>
-        <p class="text-muted">
-          ${selectedProject ? `Tokens from ${selectedProject.name}` : 'Extract and manage design tokens from Figma'}
-        </p>
-      </div>
-
-      <!-- Stats Row -->
-      <div class="grid grid-cols-4 gap-4 mt-6">
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Total Tokens</div>
-              <div class="stat__value">${stats.total}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Colors</div>
-              <div class="stat__value">${stats.colors}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Spacing</div>
-              <div class="stat__value">${stats.spacing}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Typography</div>
-              <div class="stat__value">${stats.typography}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <!-- Actions -->
-      <div class="flex justify-between items-center mt-6 mb-4">
-        <div class="flex gap-3">
-          <ds-button data-variant="primary" data-action="extractTokens" ${this.store.isLoading('extractTokens') ? 'loading' : ''}>
-            Extract from Figma
-          </ds-button>
-          <ds-button data-variant="outline" data-action="syncTokens" ${this.store.isLoading('syncTokens') ? 'loading' : ''}>
-            Sync to Files
-          </ds-button>
-        </div>
-        <div class="flex gap-2 items-center">
-          <span class="text-sm text-muted">Export as:</span>
-          <ds-button data-variant="${exportFormat === 'css' ? 'primary' : 'ghost'}" data-size="sm" data-action="setExportFormat" data-format="css">CSS</ds-button>
-          <ds-button data-variant="${exportFormat === 'scss' ? 'primary' : 'ghost'}" data-size="sm" data-action="setExportFormat" data-format="scss">SCSS</ds-button>
-          <ds-button data-variant="${exportFormat === 'json' ? 'primary' : 'ghost'}" data-size="sm" data-action="setExportFormat" data-format="json">JSON</ds-button>
-          <ds-button data-variant="${exportFormat === 'ts' ? 'primary' : 'ghost'}" data-size="sm" data-action="setExportFormat" data-format="ts">TypeScript</ds-button>
-        </div>
-      </div>
-
-      ${tokens.length > 0 ? sortedCategories.map(category => {
-        const categoryTokens = byCategory[category];
-        const categoryName = category.charAt(0).toUpperCase() + category.slice(1);
-        const isColor = category === 'color';
-
-        return `
-        <ds-card class="mt-4">
-          <ds-card-header>
-            <ds-card-title>${categoryName}</ds-card-title>
-            <ds-badge data-variant="outline">${categoryTokens.length} tokens</ds-badge>
-          </ds-card-header>
-          <ds-card-content>
-            ${isColor ? `
-              <div class="grid grid-cols-6 gap-3">
-                ${categoryTokens.map(token => `
-                  <div class="token-swatch" title="${token.name}: ${token.value}">
-                    <div class="token-swatch__color" style="background: ${token.value}; height: 48px; border-radius: var(--radius) var(--radius) 0 0; border: 1px solid var(--border);"></div>
-                    <div class="token-swatch__info p-2 rounded-b text-center" style="background: var(--muted); border: 1px solid var(--border); border-top: 0;">
-                      <div class="text-xs font-medium truncate">--${token.name}</div>
-                      <div class="text-xs text-muted font-mono">${token.value}</div>
-                    </div>
-                  </div>
-                `).join('')}
-              </div>
-            ` : `
-              <div class="grid grid-cols-4 gap-3">
-                ${categoryTokens.map(token => `
-                  <div class="flex items-center gap-3 p-3 rounded" style="background: var(--muted)">
-                    ${category === 'spacing' || category === 'sizing' ? `
-                      <div style="width: ${Math.min(parseInt(token.value) || 16, 48)}px; height: 16px; background: var(--primary); border-radius: 2px; flex-shrink: 0;"></div>
-                    ` : category === 'radius' ? `
-                      <div style="width: 24px; height: 24px; background: var(--primary); border-radius: ${token.value}; flex-shrink: 0;"></div>
-                    ` : category === 'shadow' ? `
-                      <div style="width: 24px; height: 24px; background: var(--card); box-shadow: ${token.value}; border-radius: var(--radius-sm); flex-shrink: 0;"></div>
-                    ` : ''}
-                    <div class="flex flex-col min-w-0">
-                      <span class="text-sm font-medium truncate">--${token.name}</span>
-                      <span class="text-xs text-muted font-mono truncate">${token.value}</span>
-                    </div>
-                  </div>
-                `).join('')}
-              </div>
-            `}
-          </ds-card-content>
-        </ds-card>
-      `}).join('') : `
-        <ds-card class="mt-4">
-          <ds-card-content>
-            <div class="text-center p-8">
-              <svg class="mx-auto mb-4 opacity-50" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
-                <circle cx="12" cy="12" r="10"/>
-                <circle cx="12" cy="12" r="4"/>
-              </svg>
-              <p class="text-muted mb-4">No tokens extracted yet.</p>
-              <p class="text-sm text-muted mb-4">Connect to Figma and extract design tokens to see them here.</p>
-              <ds-button data-variant="primary" data-action="extractTokens">
-                Extract Tokens from Figma
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      `}
-    `;
-  }
-
-  renderComponents() {
-    const components = this.store.get('components') || [];
-    const selectedFramework = this.store.get('componentFramework') || 'react';
-    const generatedCode = this.store.get('generatedCode');
-
-    const frameworks = [
-      { id: 'react', name: 'React', icon: 'R' },
-      { id: 'vue', name: 'Vue', icon: 'V' },
-      { id: 'webcomponent', name: 'Web Component', icon: 'W' },
-      { id: 'svelte', name: 'Svelte', icon: 'S' }
-    ];
-
-    return `
-      <div class="page-header">
-        <h1>Components</h1>
-        <p class="text-muted">View extracted components and generate code</p>
-      </div>
-
-      <!-- Stats -->
-      <div class="grid grid-cols-4 gap-4 mt-6">
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Total Components</div>
-              <div class="stat__value">${components.length}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">With Variants</div>
-              <div class="stat__value">${components.filter(c => c.variants?.length > 0).length}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">With Properties</div>
-              <div class="stat__value">${components.filter(c => c.properties?.length > 0).length}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-        <ds-card>
-          <ds-card-content>
-            <div class="stat">
-              <div class="stat__label">Target Framework</div>
-              <div class="stat__value text-lg">${frameworks.find(f => f.id === selectedFramework)?.name || 'React'}</div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <!-- Actions -->
-      <div class="flex justify-between items-center mt-6 mb-4">
-        <div class="flex gap-3">
-          <ds-button data-variant="primary" data-action="extractComponents" ${this.store.isLoading('extractComponents') ? 'loading' : ''}>
-            Extract from Figma
-          </ds-button>
-          <ds-button data-variant="outline" data-action="validateComponents" ${this.store.isLoading('validate') ? 'loading' : ''}>
-            Validate All
-          </ds-button>
-        </div>
-        <div class="flex gap-2 items-center">
-          <span class="text-sm text-muted">Generate for:</span>
-          ${frameworks.map(fw => `
-            <ds-button
-              data-variant="${selectedFramework === fw.id ? 'primary' : 'ghost'}"
-              data-size="sm"
-              data-action="setFramework"
-              data-framework="${fw.id}"
-              title="${fw.name}"
-            >${fw.icon}</ds-button>
-          `).join('')}
-        </div>
-      </div>
-
-      ${generatedCode ? `
-        <ds-card class="mb-4">
-          <ds-card-header>
-            <ds-card-title>Generated Code: ${generatedCode.component}</ds-card-title>
-            <ds-button data-variant="ghost" data-size="sm" data-action="closeGeneratedCode">Close</ds-button>
-          </ds-card-header>
-          <ds-card-content>
-            <pre class="p-4 rounded overflow-x-auto text-sm" style="background: var(--muted); font-family: monospace; max-height: 400px;"><code>${this.escapeHtml(generatedCode.code)}</code></pre>
-          </ds-card-content>
-          <ds-card-footer>
-            <ds-button data-variant="outline" data-size="sm" data-action="copyCode">Copy to Clipboard</ds-button>
-          </ds-card-footer>
-        </ds-card>
-      ` : ''}
-
-      ${components.length > 0 ? `
-        <div class="grid grid-cols-3 gap-4">
-          ${components.map(comp => `
-            <ds-card class="component-card">
-              <ds-card-header>
-                <div class="flex items-center gap-2">
-                  <div class="w-8 h-8 rounded flex items-center justify-center text-sm font-bold" style="background: var(--primary); color: var(--primary-foreground);">
-                    ${comp.name.charAt(0).toUpperCase()}
-                  </div>
-                  <ds-card-title>${comp.name}</ds-card-title>
-                </div>
-              </ds-card-header>
-              <ds-card-content>
-                <p class="text-sm text-muted mb-3">${comp.description || 'Component from Figma'}</p>
-
-                ${comp.variants?.length > 0 ? `
-                  <div class="mb-3">
-                    <div class="text-xs text-muted mb-1">Variants:</div>
-                    <div class="flex flex-wrap gap-1">
-                      ${comp.variants.slice(0, 5).map(v => `<ds-badge data-variant="secondary" data-size="sm">${v}</ds-badge>`).join('')}
-                      ${comp.variants.length > 5 ? `<ds-badge data-variant="outline" data-size="sm">+${comp.variants.length - 5}</ds-badge>` : ''}
-                    </div>
-                  </div>
-                ` : ''}
-
-                ${comp.properties?.length > 0 ? `
-                  <div class="mb-3">
-                    <div class="text-xs text-muted mb-1">Properties:</div>
-                    <div class="flex flex-wrap gap-1">
-                      ${comp.properties.slice(0, 4).map(p => `<ds-badge data-variant="outline" data-size="sm">${p.name}: ${p.type}</ds-badge>`).join('')}
-                      ${comp.properties.length > 4 ? `<ds-badge data-variant="outline" data-size="sm">+${comp.properties.length - 4}</ds-badge>` : ''}
-                    </div>
-                  </div>
-                ` : ''}
-
-                <div class="flex justify-between text-xs text-muted">
-                  <span>Key: ${comp.key?.slice(0, 8) || 'N/A'}...</span>
-                </div>
-              </ds-card-content>
-              <ds-card-footer>
-                <div class="flex gap-2">
-                  <ds-button data-variant="primary" data-size="sm" data-action="generateCode" data-component="${comp.name}" ${this.store.isLoading('generateCode') ? 'loading' : ''}>
-                    Generate ${frameworks.find(f => f.id === selectedFramework)?.name || 'Code'}
-                  </ds-button>
-                  <ds-button data-variant="ghost" data-size="sm" data-action="viewComponent" data-component="${comp.name}">
-                    Details
-                  </ds-button>
-                </div>
-              </ds-card-footer>
-            </ds-card>
-          `).join('')}
-        </div>
-      ` : `
-        <ds-card>
-          <ds-card-content>
-            <div class="text-center p-8">
-              <svg class="mx-auto mb-4 opacity-50" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
-                <rect x="3" y="3" width="18" height="18" rx="2"/>
-                <path d="M3 9h18"/>
-                <path d="M9 21V9"/>
-              </svg>
-              <p class="text-muted mb-4">No components extracted yet.</p>
-              <p class="text-sm text-muted mb-4">Extract components from your Figma file to generate code.</p>
-              <ds-button data-variant="primary" data-action="extractComponents">
-                Extract Components from Figma
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      `}
-    `;
-  }
-
-  escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-
-  renderFigma() {
-    const figmaFileKey = this.store.get('figmaFileKey') || '';
-    const selectedProject = this.store.get('selectedProject');
-    const projectDescription = selectedProject?.description || '';
-    const lastSync = this.store.get('lastSync');
-
-    return `
-      <div class="page-header">
-        <h1>Project Settings</h1>
-        <p class="text-muted">Configure your project and Figma integration</p>
-      </div>
-
-      <div class="grid grid-cols-2 gap-6 mt-6">
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Project Details</ds-card-title>
-            <ds-card-description>Describe your design system project</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <ds-input
-              id="project-description"
-              label="Project Description"
-              placeholder="Brief description of this design system"
-              value="${this.escapeHtml(projectDescription)}"
-            ></ds-input>
-          </ds-card-content>
-          <ds-card-footer>
-            <ds-button data-variant="primary" data-action="saveProjectDescription">
-              Save Description
-            </ds-button>
-          </ds-card-footer>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Figma Connection</ds-card-title>
-            <ds-card-description>Configure your Figma file</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <ds-input
-              id="figma-file-key"
-              label="Figma File Key"
-              placeholder="Enter your Figma file key"
-              value="${figmaFileKey}"
-            ></ds-input>
-            <p class="text-xs text-muted mt-2">Find this in your Figma URL: figma.com/file/<strong>[FILE_KEY]</strong>/...</p>
-          </ds-card-content>
-          <ds-card-footer>
-            <ds-button data-variant="primary" data-action="saveFigmaKey">
-              Save & Connect
-            </ds-button>
-          </ds-card-footer>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Sync Status</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-3">
-              <div class="flex justify-between items-center">
-                <span>Connection:</span>
-                <ds-badge data-variant="${figmaFileKey ? 'success' : 'secondary'}" dot>
-                  ${figmaFileKey ? 'Connected' : 'Not configured'}
-                </ds-badge>
-              </div>
-              <div class="flex justify-between items-center">
-                <span>Last Sync:</span>
-                <span class="text-muted">${lastSync ? this.formatTime(lastSync) : 'Never'}</span>
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <ds-card class="mt-6">
-        <ds-card-header>
-          <ds-card-title>Available Tools</ds-card-title>
-          <ds-card-description>Figma integration capabilities</ds-card-description>
-        </ds-card-header>
-        <ds-card-content>
-          <div class="grid grid-cols-2 gap-4">
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Extract Variables</h4>
-              <p class="text-sm text-muted">Pull design tokens from Figma variables</p>
-            </div>
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Extract Components</h4>
-              <p class="text-sm text-muted">Get component definitions and variants</p>
-            </div>
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Extract Styles</h4>
-              <p class="text-sm text-muted">Pull text, color, and effect styles</p>
-            </div>
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Sync Tokens</h4>
-              <p class="text-sm text-muted">Sync tokens to CSS/SCSS/JSON files</p>
-            </div>
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Visual Diff</h4>
-              <p class="text-sm text-muted">Compare visual changes between versions</p>
-            </div>
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Validate Components</h4>
-              <p class="text-sm text-muted">Check components against naming rules</p>
-            </div>
-            <div class="p-4 rounded" style="background: var(--muted)">
-              <h4 class="font-medium mb-1">Generate Code</h4>
-              <p class="text-sm text-muted">Create component code from designs</p>
-            </div>
-          </div>
-        </ds-card-content>
-      </ds-card>
-    `;
-  }
-
-  renderTeams() {
-    const user = this.store.get('user');
-    const role = this.store.get('role');
-
-    return `
-      <div class="page-header">
-        <h1>Team Management</h1>
-        <p class="text-muted">Manage teams and permissions</p>
-      </div>
-
-      <div class="flex gap-3 mt-6 mb-4">
-        ${this.store.hasPermission('manage_team_members') ? `
-          <ds-button data-variant="primary" data-action="createTeam">
-            Create Team
-          </ds-button>
-        ` : ''}
-      </div>
-
-      <div class="grid grid-cols-3 gap-4 mt-4">
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Design System Core</ds-card-title>
-            <ds-badge data-variant="success" dot>Active</ds-badge>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-2 text-sm">
-              <div class="flex justify-between">
-                <span class="text-muted">Members:</span>
-                <span>5</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Projects:</span>
-                <span>3</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Your Role:</span>
-                <ds-badge data-variant="outline">${role}</ds-badge>
-              </div>
-            </div>
-          </ds-card-content>
-          <ds-card-footer>
-            <ds-button data-variant="ghost" data-size="sm">View Details</ds-button>
-          </ds-card-footer>
-        </ds-card>
-
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Product Team A</ds-card-title>
-            <ds-badge data-variant="secondary">Member</ds-badge>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-2 text-sm">
-              <div class="flex justify-between">
-                <span class="text-muted">Members:</span>
-                <span>8</span>
-              </div>
-              <div class="flex justify-between">
-                <span class="text-muted">Projects:</span>
-                <span>2</span>
-              </div>
-            </div>
-          </ds-card-content>
-          <ds-card-footer>
-            <ds-button data-variant="ghost" data-size="sm">View Details</ds-button>
-          </ds-card-footer>
-        </ds-card>
-      </div>
-
-      <ds-card class="mt-6">
-        <ds-card-header>
-          <ds-card-title>Role Permissions</ds-card-title>
-        </ds-card-header>
-        <ds-card-content>
-          <div class="grid grid-cols-4 gap-4 text-sm">
-            <div>
-              <h4 class="font-medium mb-2">Super Admin</h4>
-              <p class="text-muted">Full system access</p>
-            </div>
-            <div>
-              <h4 class="font-medium mb-2">Team Lead</h4>
-              <p class="text-muted">Manage team, sync, generate</p>
-            </div>
-            <div>
-              <h4 class="font-medium mb-2">Developer</h4>
-              <p class="text-muted">Read, write, sync</p>
-            </div>
-            <div>
-              <h4 class="font-medium mb-2">Viewer</h4>
-              <p class="text-muted">Read-only access</p>
-            </div>
-          </div>
-        </ds-card-content>
-      </ds-card>
-    `;
-  }
-
-  renderProjects() {
-    const projects = this.store.get('projects') || [];
-    const showCreateForm = this.store.get('showCreateProjectForm');
-
-    return `
-      <div class="page-header">
-        <h1>Projects</h1>
-        <p class="text-muted">Manage your design system projects</p>
-      </div>
-
-      <div class="flex justify-between items-center mt-6 mb-4">
-        <ds-input icon="search" placeholder="Search projects..." id="project-search"></ds-input>
-        <ds-button data-variant="primary" data-action="toggleCreateProject" ${this.store.isLoading('createProject') ? 'loading' : ''}>
-          ${showCreateForm ? 'Cancel' : 'New Project'}
-        </ds-button>
-      </div>
-
-      ${showCreateForm ? `
-        <ds-card class="mb-6">
-          <ds-card-header>
-            <ds-card-title>Create New Project</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            <ds-input
-              id="new-project-name"
-              label="Project Name"
-              placeholder="My Design System"
-              required
-            ></ds-input>
-          </ds-card-content>
-          <ds-card-footer>
-            <ds-button data-variant="primary" data-action="submitCreateProject" ${this.store.isLoading('createProject') ? 'loading' : ''}>
-              Create Project
-            </ds-button>
-          </ds-card-footer>
-        </ds-card>
-      ` : ''}
-
-      ${projects.length > 0 ? `
-        <div class="grid grid-cols-2 gap-4">
-          ${projects.map(p => `
-            <ds-card class="project-card" data-project-id="${p.id}">
-              <ds-card-header>
-                <ds-card-title>${p.name}</ds-card-title>
-                <ds-badge data-variant="${p.status === 'active' ? 'success' : 'secondary'}" dot>
-                  ${p.status || 'active'}
-                </ds-badge>
-              </ds-card-header>
-              <ds-card-content>
-                <p class="text-sm mb-3">${p.description || 'No description'}</p>
-                <div class="flex flex-col gap-2 text-sm">
-                  <div class="flex justify-between">
-                    <span class="text-muted">Figma Key:</span>
-                    <span class="font-mono text-xs">${p.figma_file_key || 'Not configured'}</span>
-                  </div>
-                  <div class="flex justify-between">
-                    <span class="text-muted">Last Sync:</span>
-                    <span>${p.last_sync ? this.formatTime(p.last_sync) : 'Never'}</span>
-                  </div>
-                  <div class="flex justify-between">
-                    <span class="text-muted">Created:</span>
-                    <span>${p.created_at ? this.formatTime(p.created_at) : 'Unknown'}</span>
-                  </div>
-                </div>
-              </ds-card-content>
-              <ds-card-footer>
-                <div class="flex gap-2">
-                  <ds-button data-variant="primary" data-size="sm" data-action="selectProject" data-project-id="${p.id}">
-                    Open
-                  </ds-button>
-                  <ds-button data-variant="outline" data-size="sm" data-action="syncProject" data-project-id="${p.id}" data-figma-key="${p.figma_file_key || ''}">
-                    Sync Tokens
-                  </ds-button>
-                  <ds-button data-variant="ghost" data-size="sm" data-action="deleteProject" data-project-id="${p.id}">
-                    Delete
-                  </ds-button>
-                </div>
-              </ds-card-footer>
-            </ds-card>
-          `).join('')}
-        </div>
-      ` : `
-        <ds-card>
-          <ds-card-content>
-            <div class="text-center p-8">
-              <svg class="mx-auto mb-4 opacity-50" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
-                <path d="M3 3h18v18H3z"/>
-                <path d="M21 9H3"/>
-                <path d="M9 21V9"/>
-              </svg>
-              <p class="text-muted mb-4">No projects yet. Create your first project to get started.</p>
-              <ds-button data-variant="primary" data-action="toggleCreateProject">
-                Create Your First Project
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      `}
-    `;
-  }
-
-  renderSettings() {
-    const config = this.store.get('runtimeConfig') || {};
-    const services = this.store.get('services') || {};
-    const figmaConfig = this.store.get('figmaConfig') || {};
-    const mode = config.mode || 'local';
-
-    return `
-      <div class="page-header">
-        <h1>Settings</h1>
-        <p class="text-muted">Configure your design system server</p>
-      </div>
-
-      <div class="mt-6 flex flex-col gap-6">
-        <!-- DSS Mode -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Server Mode</ds-card-title>
-            <ds-card-description>Choose how DSS operates</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex gap-4">
-              <div class="flex-1 p-4 rounded cursor-pointer ${mode === 'local' ? 'ring-2 ring-primary' : ''}"
-                   style="background: var(--muted)" data-action="setMode" data-mode="local">
-                <h4 class="font-medium mb-1">Local Dev Companion</h4>
-                <p class="text-sm text-muted">Run alongside your project, provides UI dev assistance, component preview, and local services.</p>
-              </div>
-              <div class="flex-1 p-4 rounded cursor-pointer ${mode === 'server' ? 'ring-2 ring-primary' : ''}"
-                   style="background: var(--muted)" data-action="setMode" data-mode="server">
-                <h4 class="font-medium mb-1">Remote Server</h4>
-                <p class="text-sm text-muted">Deployed centrally, serves design systems to teams, multi-project management.</p>
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Figma Configuration -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Figma Integration</ds-card-title>
-            <ds-card-description>Connect to Figma API</ds-card-description>
-            <ds-badge data-variant="${figmaConfig.configured ? 'success' : 'secondary'}" dot>
-              ${figmaConfig.configured ? 'Connected' : 'Not configured'}
-            </ds-badge>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-4">
-              <ds-input
-                id="figma-token-input"
-                label="Figma Personal Access Token"
-                type="password"
-                placeholder="figd_xxxxxxxxxx"
-                value="${figmaConfig.configured ? '••••••••••••' : ''}"
-              ></ds-input>
-              <p class="text-xs text-muted">
-                Get your token from <a href="https://www.figma.com/developers/api#access-tokens" target="_blank" class="text-primary">Figma Settings → Personal Access Tokens</a>
-              </p>
-              <div class="flex gap-2">
-                <ds-button data-variant="primary" data-action="saveFigmaToken" ${this.store.isLoading('saveFigmaToken') ? 'loading' : ''}>
-                  Save Token
-                </ds-button>
-                <ds-button data-variant="outline" data-action="testFigmaConnection" ${this.store.isLoading('testFigma') ? 'loading' : ''}>
-                  Test Connection
-                </ds-button>
-              </div>
-              ${this.store.get('figmaTestResult') ? `
-                <div class="text-sm ${this.store.get('figmaTestResult').success ? 'text-success' : 'text-destructive'}">
-                  ${this.store.get('figmaTestResult').success ?
-                    `Connected as ${this.store.get('figmaTestResult').user}` :
-                    `Error: ${this.store.get('figmaTestResult').error}`}
-                </div>
-              ` : ''}
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Component Settings (Dynamic from Registry) -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>External Tools & Integrations</ds-card-title>
-            <ds-card-description>Configure connected tools and services</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-4">
-              ${this.renderComponentSettings()}
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Services Discovery -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Companion Services</ds-card-title>
-            <ds-card-description>Discovered and configured services</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="grid grid-cols-3 gap-4">
-              ${this.renderServiceCard('storybook', 'Storybook', services)}
-              ${this.renderServiceCard('vite', 'Vite Dev Server', services)}
-              ${this.renderServiceCard('nextjs', 'Next.js', services)}
-            </div>
-            <div class="mt-4">
-              <ds-button data-variant="ghost" data-action="refreshServices">
-                Refresh Services
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Feature Toggles -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Features</ds-card-title>
-            <ds-card-description>Enable or disable DSS features</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-3">
-              ${this.renderFeatureToggle('visual_qa', 'Visual QA', 'Compare Figma designs with implementation', config.features)}
-              ${this.renderFeatureToggle('token_sync', 'Token Sync', 'Sync design tokens to code', config.features)}
-              ${this.renderFeatureToggle('code_gen', 'Code Generation', 'Generate component code from Figma', config.features)}
-              ${this.renderFeatureToggle('ai_advisor', 'AI Advisor', 'Get AI suggestions for design system improvements', config.features)}
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Appearance -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Appearance</ds-card-title>
-            <ds-card-description>Customize the interface</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex items-center justify-between">
-              <span>Dark Mode</span>
-              <ds-button data-variant="outline" data-size="sm" data-action="toggle-theme">
-                Toggle Theme
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Output Configuration -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Output Configuration</ds-card-title>
-            <ds-card-description>Token and component generation settings</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="grid grid-cols-2 gap-4">
-              <ds-input label="Token Output Path" value="./admin-ui/css/tokens.css"></ds-input>
-              <ds-input label="Component Output Path" value="./admin-ui/js/components"></ds-input>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- Danger Zone -->
-        <ds-card style="border-color: var(--destructive);">
-          <ds-card-header>
-            <ds-card-title style="color: var(--destructive);">⚠️ Danger Zone</ds-card-title>
-            <ds-card-description>Irreversible operations - use with caution</ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-4">
-              <div>
-                <h4 class="font-medium mb-2">Reset DSS to Fresh State</h4>
-                <p class="text-sm text-muted mb-3">
-                  This will delete all user-created themes, cached data, and project databases.
-                  The DSS structure and default themes will be preserved.
-                </p>
-                <ds-button data-variant="destructive" data-action="resetDSS" ${this.store.isLoading('resetDSS') ? 'loading' : ''}>
-                  Reset DSS
-                </ds-button>
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-
-        <!-- API Status -->
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>API Status</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="flex flex-col gap-2 text-sm">
-              <div class="flex justify-between">
-                <span>API Mode:</span>
-                <ds-badge data-variant="${this.store.get('useMock') ? 'warning' : 'success'}" dot>
-                  ${this.store.get('useMock') ? 'Mock (Backend unavailable)' : 'Live'}
-                </ds-badge>
-              </div>
-              <div class="flex justify-between">
-                <span>Base URL:</span>
-                <span class="text-muted">${window.location.hostname === 'localhost' ? 'http://localhost:3456/api' : '/api'}</span>
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-    `;
-  }
-
-  renderPlugins() {
-    const plugins = pluginService.getAll();
-    const enabledCount = plugins.filter(p => p.enabled).length;
-
-    return `
-      <div class="page-header">
-        <h1>Plugins</h1>
-        <p class="text-muted">${enabledCount} of ${plugins.length} plugins enabled</p>
-      </div>
-
-      <div class="plugins-grid">
-        ${plugins.map(plugin => this.renderPluginCard(plugin)).join('')}
-      </div>
-
-      <style>
-        .plugins-grid {
-          display: grid;
-          grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
-          gap: 16px;
-          margin-top: 24px;
-        }
-        .plugin-card {
-          background: var(--card);
-          border: 1px solid var(--border);
-          border-radius: 8px;
-          padding: 16px;
-          transition: border-color 0.2s;
-        }
-        .plugin-card:hover {
-          border-color: var(--primary);
-        }
-        .plugin-card.enabled {
-          border-left: 3px solid var(--success);
-        }
-        .plugin-card__header {
-          display: flex;
-          align-items: center;
-          gap: 12px;
-          margin-bottom: 12px;
-        }
-        .plugin-card__icon {
-          font-size: 24px;
-          width: 40px;
-          height: 40px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          background: var(--muted);
-          border-radius: 8px;
-        }
-        .plugin-card__title {
-          flex: 1;
-        }
-        .plugin-card__name {
-          font-weight: 600;
-          font-size: 15px;
-        }
-        .plugin-card__version {
-          font-size: 11px;
-          color: var(--text-muted);
-        }
-        .plugin-card__desc {
-          font-size: 13px;
-          color: var(--text-secondary);
-          margin-bottom: 12px;
-          line-height: 1.4;
-        }
-        .plugin-card__meta {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          padding-top: 12px;
-          border-top: 1px solid var(--border);
-        }
-        .plugin-card__author {
-          font-size: 11px;
-          color: var(--text-muted);
-        }
-        .plugin-toggle {
-          position: relative;
-          width: 40px;
-          height: 22px;
-          background: var(--muted);
-          border-radius: 11px;
-          cursor: pointer;
-          transition: background 0.2s;
-        }
-        .plugin-toggle.enabled {
-          background: var(--success);
-        }
-        .plugin-toggle::after {
-          content: '';
-          position: absolute;
-          top: 2px;
-          left: 2px;
-          width: 18px;
-          height: 18px;
-          background: white;
-          border-radius: 50%;
-          transition: transform 0.2s;
-        }
-        .plugin-toggle.enabled::after {
-          transform: translateX(18px);
-        }
-        .plugin-card__settings {
-          margin-top: 12px;
-          padding-top: 12px;
-          border-top: 1px solid var(--border);
-        }
-        .plugin-setting {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          padding: 8px 0;
-        }
-        .plugin-setting__label {
-          font-size: 13px;
-        }
-        .plugin-setting select {
-          padding: 4px 8px;
-          border: 1px solid var(--border);
-          border-radius: 4px;
-          background: var(--background);
-          font-size: 12px;
-        }
-      </style>
-    `;
-  }
-
-  renderPluginCard(plugin) {
-    const settings = pluginService.getPluginSettings(plugin.id);
-
-    return `
-      <div class="plugin-card ${plugin.enabled ? 'enabled' : ''}" data-plugin-id="${plugin.id}">
-        <div class="plugin-card__header">
-          <div class="plugin-card__icon">${plugin.icon}</div>
-          <div class="plugin-card__title">
-            <div class="plugin-card__name">${plugin.name}</div>
-            <div class="plugin-card__version">v${plugin.version}</div>
-          </div>
-          <div class="plugin-toggle ${plugin.enabled ? 'enabled' : ''}"
-               data-action="togglePlugin"
-               data-plugin="${plugin.id}"
-               title="${plugin.enabled ? 'Disable' : 'Enable'} plugin">
-          </div>
-        </div>
-        <div class="plugin-card__desc">${plugin.description}</div>
-        ${plugin.enabled && plugin.settings.length > 0 ? `
-          <div class="plugin-card__settings">
-            ${plugin.settings.map(setting => this.renderPluginSetting(plugin.id, setting, settings)).join('')}
-          </div>
-        ` : ''}
-        <div class="plugin-card__meta">
-          <span class="plugin-card__author">by ${plugin.author}</span>
-          <ds-badge data-variant="${plugin.enabled ? 'success' : 'secondary'}" data-size="sm">
-            ${plugin.enabled ? 'Enabled' : 'Disabled'}
-          </ds-badge>
-        </div>
-      </div>
-    `;
-  }
-
-  renderPluginSetting(pluginId, setting, currentSettings) {
-    const value = currentSettings[setting.key] ?? setting.default;
-
-    if (setting.type === 'select') {
-      return `
-        <div class="plugin-setting">
-          <span class="plugin-setting__label">${setting.label}</span>
-          <select data-action="setPluginSetting" data-plugin="${pluginId}" data-key="${setting.key}">
-            ${setting.options.map(opt => `
-              <option value="${opt.value}" ${value === opt.value ? 'selected' : ''}>${opt.label}</option>
-            `).join('')}
-          </select>
-        </div>
-      `;
-    }
-
-    if (setting.type === 'boolean') {
-      return `
-        <div class="plugin-setting">
-          <span class="plugin-setting__label">${setting.label}</span>
-          <div class="plugin-toggle ${value ? 'enabled' : ''}"
-               data-action="setPluginSetting"
-               data-plugin="${pluginId}"
-               data-key="${setting.key}"
-               data-type="boolean">
-          </div>
-        </div>
-      `;
-    }
-
-    return '';
-  }
-
-  renderDocs() {
-    return `
-      <div class="page-header">
-        <h1>Documentation</h1>
-        <p class="text-muted">DSS usage guides for all teams</p>
-      </div>
-
-      <div class="docs-layout mt-6">
-        <nav class="docs-nav">
-          <div class="docs-nav__section">
-            <div class="docs-nav__title">Getting Started</div>
-            <a class="docs-nav__link active" data-doc="overview">Overview</a>
-            <a class="docs-nav__link" data-doc="quickstart">Quick Start</a>
-            <a class="docs-nav__link" data-doc="concepts">Key Concepts</a>
-          </div>
-          <div class="docs-nav__section">
-            <div class="docs-nav__title">Team Guides</div>
-            <a class="docs-nav__link" data-doc="ui-team">UI Team</a>
-            <a class="docs-nav__link" data-doc="ux-team">UX Team</a>
-            <a class="docs-nav__link" data-doc="qa-team">QA Team</a>
-          </div>
-          <div class="docs-nav__section">
-            <div class="docs-nav__title">Features</div>
-            <a class="docs-nav__link" data-doc="tokens">Design Tokens</a>
-            <a class="docs-nav__link" data-doc="figma">Figma Integration</a>
-            <a class="docs-nav__link" data-doc="components">Components</a>
-            <a class="docs-nav__link" data-doc="ai-chat">AI Chat</a>
-          </div>
-          <div class="docs-nav__section">
-            <div class="docs-nav__title">Reference</div>
-            <a class="docs-nav__link" href="/api/docs" target="_blank">API Docs ↗</a>
-            <a class="docs-nav__link" data-doc="cli">CLI Commands</a>
-            <a class="docs-nav__link" data-doc="troubleshooting">Troubleshooting</a>
-          </div>
-        </nav>
-
-        <div class="docs-content" id="docs-content">
-          ${this.getDocContent('overview')}
-        </div>
-      </div>
-    `;
-  }
-
-  getDocContent(docId) {
-    const docs = {
-      overview: `
-        <h2>What is DSS?</h2>
-        <p>Design System Server (DSS) is a platform that helps teams manage, sync, and evolve their design systems by connecting Figma designs to code.</p>
-
-        <h3>Core Features</h3>
-        <ul>
-          <li><strong>Token Extraction</strong> — Pull design tokens from Figma variables</li>
-          <li><strong>Token Sync</strong> — Generate CSS/JSON from Figma tokens</li>
-          <li><strong>Component Analysis</strong> — Scan your codebase for components</li>
-          <li><strong>Visual Diff</strong> — Detect changes between Figma versions</li>
-          <li><strong>AI Assistant</strong> — Get help via the built-in chat</li>
-        </ul>
-
-        <h3>Architecture</h3>
-        <ul>
-          <li><strong>REST API</strong> — Port 3456 (python tools/api/server.py)</li>
-          <li><strong>MCP Server</strong> — Port 3457 for AI tools</li>
-          <li><strong>Admin UI</strong> — This dashboard</li>
-          <li><strong>CLI</strong> — Command-line interface</li>
-        </ul>
-      `,
-
-      quickstart: `
-        <h2>Quick Start</h2>
-
-        <h3>1. Start the Server</h3>
-        <pre><code>cd apps/dss
-python tools/api/server.py</code></pre>
-
-        <h3>2. Create a Project</h3>
-        <p>Go to <a href="#projects">Projects</a> → Create Project</p>
-
-        <h3>3. Add Figma File</h3>
-        <p>In your project settings, paste your Figma file key:</p>
-        <pre><code>https://www.figma.com/file/<strong>FILE_KEY</strong>/...</code></pre>
-
-        <h3>4. Extract Tokens</h3>
-        <p>Use the dashboard or CLI:</p>
-        <pre><code>dss ingest figma YOUR_FILE_KEY</code></pre>
-
-        <h3>5. Sync to Code</h3>
-        <p>Click "Sync Tokens" or:</p>
-        <pre><code>dss sync tokens --output ./tokens.css</code></pre>
-      `,
-
-      concepts: `
-        <h2>Key Concepts</h2>
-
-        <h3>Design Tokens</h3>
-        <p>Tokens are the atomic values of your design system: colors, spacing, typography. DSS extracts these from Figma variables and converts them to CSS custom properties or JSON.</p>
-
-        <h3>Translation Dictionaries</h3>
-        <p>DSS uses a canonical internal structure. When importing from external sources, translation dictionaries map external names to DSS standard names.</p>
-
-        <h3>Token Drift</h3>
-        <p>When code diverges from Figma designs, that's "drift". The UI Team dashboard tracks drift issues and helps resolve them.</p>
-
-        <h3>ESRE (Expected State, Real State, Evidence)</h3>
-        <p>QA team uses ESRE to define test cases: what should happen, what actually happens, and proof.</p>
-      `,
-
-      'ui-team': `
-        <h2>UI Team Guide</h2>
-        <p>As a UI developer, you'll use DSS to keep code in sync with designs.</p>
-
-        <h3>Daily Workflow</h3>
-        <ol>
-          <li>Check the <a href="#dashboard">Dashboard</a> for token drift alerts</li>
-          <li>Run token sync when Figma updates</li>
-          <li>Generate component code from new Figma components</li>
-          <li>Review and resolve drift issues</li>
-        </ol>
-
-        <h3>Key Tools</h3>
-        <ul>
-          <li><strong>Extract Tokens</strong> — Pull latest from Figma</li>
-          <li><strong>Sync Tokens</strong> — Update CSS variables</li>
-          <li><strong>Generate Code</strong> — Create React/Web Components</li>
-          <li><strong>Token Drift</strong> — Track code/design mismatches</li>
-        </ul>
-
-        <h3>CLI Commands</h3>
-        <pre><code>dss ingest figma FILE_KEY
-dss sync tokens -o ./tokens.css
-dss analyze ./src</code></pre>
-      `,
-
-      'ux-team': `
-        <h2>UX Team Guide</h2>
-        <p>As a UX designer, DSS helps you maintain design consistency and validate implementations.</p>
-
-        <h3>Daily Workflow</h3>
-        <ol>
-          <li>Add Figma files to projects</li>
-          <li>Run visual diff after design changes</li>
-          <li>Review token consistency reports</li>
-          <li>Validate component implementations</li>
-        </ol>
-
-        <h3>Key Tools</h3>
-        <ul>
-          <li><strong>Figma Files</strong> — Manage connected design files</li>
-          <li><strong>Visual Diff</strong> — Compare Figma versions</li>
-          <li><strong>Token Validation</strong> — Ensure token consistency</li>
-          <li><strong>Component Validation</strong> — Check naming conventions</li>
-        </ul>
-
-        <h3>Best Practices</h3>
-        <ul>
-          <li>Use Figma variables for all tokens</li>
-          <li>Follow component naming conventions</li>
-          <li>Document component variants</li>
-          <li>Run visual diff before handoff</li>
-        </ul>
-      `,
-
-      'qa-team': `
-        <h2>QA Team Guide</h2>
-        <p>DSS helps QA teams validate design system implementations.</p>
-
-        <h3>Daily Workflow</h3>
-        <ol>
-          <li>Review visual regression reports</li>
-          <li>Define ESRE test cases for components</li>
-          <li>Run component validation</li>
-          <li>Export audit logs for compliance</li>
-        </ol>
-
-        <h3>ESRE Testing</h3>
-        <p>Define expected behaviors:</p>
-        <ul>
-          <li><strong>Expected State</strong> — What should happen</li>
-          <li><strong>Real State</strong> — What actually happens</li>
-          <li><strong>Evidence</strong> — Screenshots, logs, recordings</li>
-        </ul>
-
-        <h3>Key Tools</h3>
-        <ul>
-          <li><strong>Component Validation</strong> — Automated checks</li>
-          <li><strong>Visual Diff</strong> — Regression detection</li>
-          <li><strong>Audit Log</strong> — Track all changes</li>
-          <li><strong>ESRE Definitions</strong> — Test case management</li>
-        </ul>
-      `,
-
-      tokens: `
-        <h2>Design Tokens</h2>
-
-        <h3>Token Categories</h3>
-        <ul>
-          <li><strong>Colors</strong> — Primary, secondary, semantic colors</li>
-          <li><strong>Spacing</strong> — Margin, padding scales</li>
-          <li><strong>Typography</strong> — Font sizes, weights, line heights</li>
-          <li><strong>Radius</strong> — Border radius values</li>
-          <li><strong>Shadows</strong> — Box shadow definitions</li>
-        </ul>
-
-        <h3>Export Formats</h3>
-        <ul>
-          <li><strong>CSS</strong> — Custom properties (:root { --color-primary: ... })</li>
-          <li><strong>JSON</strong> — Structured token data</li>
-          <li><strong>SCSS</strong> — Sass variables</li>
-        </ul>
-
-        <h3>Token Naming</h3>
-        <pre><code>--{category}-{name}[-{variant}]
-
-Examples:
---color-primary
---space-4
---text-lg
---radius-md</code></pre>
-      `,
-
-      figma: `
-        <h2>Figma Integration</h2>
-
-        <h3>Setup</h3>
-        <ol>
-          <li>Get a Personal Access Token from <a href="https://www.figma.com/developers/api#access-tokens" target="_blank">Figma Settings</a></li>
-          <li>Go to <a href="#settings">Settings</a> → Figma Integration</li>
-          <li>Paste and save your token</li>
-          <li>Test the connection</li>
-        </ol>
-
-        <h3>File Key</h3>
-        <p>Extract from your Figma URL:</p>
-        <pre><code>https://www.figma.com/file/<strong>ABC123</strong>/My-Design
-                              ↑ This is your file key</code></pre>
-
-        <h3>What Gets Extracted</h3>
-        <ul>
-          <li><strong>Variables</strong> → Design tokens</li>
-          <li><strong>Components</strong> → Component metadata</li>
-          <li><strong>Styles</strong> → Text and color styles</li>
-        </ul>
-      `,
-
-      components: `
-        <h2>Components</h2>
-
-        <h3>Component Analysis</h3>
-        <p>DSS scans your codebase to find React and Web Components:</p>
-        <pre><code>dss analyze ./src</code></pre>
-
-        <h3>Code Generation</h3>
-        <p>Generate component code from Figma:</p>
-        <ul>
-          <li><strong>React</strong> — Functional components with CSS modules</li>
-          <li><strong>Web Components</strong> — Custom elements with Shadow DOM</li>
-        </ul>
-
-        <h3>Storybook Integration</h3>
-        <p>Generate stories for your components:</p>
-        <pre><code>dss storybook generate ./src/components</code></pre>
-      `,
-
-      'ai-chat': `
-        <h2>AI Chat</h2>
-        <p>The AI assistant helps with design system tasks.</p>
-
-        <h3>What It Can Do</h3>
-        <ul>
-          <li>Answer questions about your design system</li>
-          <li>Suggest improvements</li>
-          <li>Help debug issues</li>
-          <li>Execute DSS tools</li>
-        </ul>
-
-        <h3>Example Prompts</h3>
-        <ul>
-          <li>"Extract tokens from my Figma file"</li>
-          <li>"Show me quick wins for my codebase"</li>
-          <li>"What's the status of my project?"</li>
-          <li>"Help me fix token drift issues"</li>
-        </ul>
-
-        <h3>Tool Execution</h3>
-        <p>The AI can run DSS tools directly. Look for tool suggestions in responses and click to execute.</p>
-      `,
-
-      cli: `
-        <h2>CLI Commands</h2>
-
-        <h3>Installation</h3>
-        <pre><code># Add to PATH
-export PATH="$PATH:/path/to/dss/bin"
-
-# Or use directly
-./bin/dss --help</code></pre>
-
-        <h3>Commands</h3>
-        <pre><code><strong>dss init</strong>
-  Initialize DSS in current directory
-
-<strong>dss ingest figma FILE_KEY</strong>
-  Extract tokens from Figma file
-
-<strong>dss sync tokens -o PATH</strong>
-  Sync tokens to CSS file
-
-<strong>dss analyze PATH</strong>
-  Analyze codebase for components
-
-<strong>dss storybook generate PATH</strong>
-  Generate Storybook stories
-
-<strong>dss start</strong>
-  Start DSS server</code></pre>
-      `,
-
-      troubleshooting: `
-        <h2>Troubleshooting</h2>
-
-        <h3>Server Won't Start</h3>
-        <pre><code># Check Python version (need 3.10+)
-python --version
-
-# Install dependencies
-pip install -r requirements.txt
-
-# Check port availability
-lsof -i :3456</code></pre>
-
-        <h3>Figma Connection Failed</h3>
-        <ul>
-          <li>Verify token hasn't expired</li>
-          <li>Check token has read access to the file</li>
-          <li>Ensure file key is correct (not the full URL)</li>
-        </ul>
-
-        <h3>Tokens Not Syncing</h3>
-        <ul>
-          <li>Confirm Figma file has variables defined</li>
-          <li>Check output path is writable</li>
-          <li>Look for errors in browser console</li>
-        </ul>
-
-        <h3>API Errors</h3>
-        <ul>
-          <li>Check server is running: <code>curl http://localhost:3456/health</code></li>
-          <li>Review server logs for details</li>
-          <li>Verify CORS settings for remote access</li>
-        </ul>
-
-        <h3>Getting Help</h3>
-        <ul>
-          <li>Use the AI Chat for guidance</li>
-          <li>Check logs: Settings → Debug Console</li>
-          <li>Export logs for support</li>
-        </ul>
-      `
-    };
-
-    return docs[docId] || docs.overview;
-  }
-
-  renderServiceCard(serviceId, serviceName, services) {
-    const discovered = services.discovered?.[serviceId] || {};
-    const configured = services.configured?.[serviceId] || {};
-    const running = discovered.running || false;
-
-    return `
-      <div class="p-4 rounded" style="background: var(--muted)">
-        <div class="flex items-center justify-between mb-2">
-          <h4 class="font-medium">${serviceName}</h4>
-          <span class="status-dot ${running ? 'status-dot--success' : ''}"></span>
-        </div>
-        <p class="text-sm text-muted mb-2">
-          ${running ? `Running on :${discovered.port}` : 'Not detected'}
-        </p>
-        ${running ? `
-          <ds-button data-variant="ghost" data-size="sm" onclick="window.open('${discovered.url}', '_blank')">
-            Open
-          </ds-button>
-        ` : ''}
-      </div>
-    `;
-  }
-
-  /**
-   * Render component settings from the registry
-   * Generates dynamic UI for all enabled components
-   */
-  renderComponentSettings() {
-    let dssHost = 'localhost';
-    try {
-      dssHost = getDssHost();
-    } catch {
-      // Config not loaded yet
-    }
-
-    const components = getEnabledComponents();
-
-    return components.map(component => `
-      <div class="p-4 rounded border" style="background: var(--muted); border-color: var(--border)">
-        <div class="flex items-center justify-between mb-3">
-          <div class="flex items-center gap-2">
-            <span class="font-medium">${component.name}</span>
-            <ds-badge data-variant="secondary" data-size="sm">${component.category}</ds-badge>
-          </div>
-          ${component.getUrl() ? `
-            <ds-button data-variant="ghost" data-size="sm" onclick="window.open('${component.getUrl()}', '_blank')">
-              Open
-            </ds-button>
-          ` : ''}
-        </div>
-        <p class="text-sm text-muted mb-3">${component.description}</p>
-        ${component.id === 'storybook' ? `
-          <div class="text-xs text-muted mb-3">
-            URL: <code>${component.getUrl() || 'Not configured'}</code>
-            <br>Host from server config: <code>${dssHost}</code>
-          </div>
-          <div class="flex gap-2">
-            <ds-button data-variant="primary" data-size="sm" data-action="initStorybook">
-              Initialize Storybook
-            </ds-button>
-            <ds-button data-variant="outline" data-size="sm" data-action="clearStorybook">
-              Clear Stories
-            </ds-button>
-          </div>
-        ` : ''}
-        ${component.id === 'figma' ? `
-          <div class="text-xs text-muted">
-            Token status: Check connection above
-          </div>
-        ` : ''}
-      </div>
-    `).join('');
-  }
-
-  renderFeatureToggle(featureId, name, description, features = {}) {
-    const enabled = features?.[featureId] !== false;
-    return `
-      <div class="flex items-center justify-between p-3 rounded" style="background: var(--muted)">
-        <div>
-          <div class="font-medium">${name}</div>
-          <div class="text-sm text-muted">${description}</div>
-        </div>
-        <ds-button
-          data-variant="${enabled ? 'primary' : 'outline'}"
-          data-size="sm"
-          data-action="toggleFeature"
-          data-feature="${featureId}"
-        >
-          ${enabled ? 'Enabled' : 'Disabled'}
-        </ds-button>
-      </div>
-    `;
-  }
-
-  /**
-   * Render ingestion result panel (after parsing a prompt)
-   */
-  renderIngestionResult() {
-    const result = this.store.get('ingestionResult');
-    const browsing = this.store.get('browsingDesignSystems');
-    const systems = this.store.get('designSystems') || [];
-
-    // If browsing design systems
-    if (browsing) {
-      return `
-        <div class="mt-4 p-4 rounded border" style="background: var(--muted); border-color: var(--border)">
-          <div class="flex items-center justify-between mb-3">
-            <h4 class="font-medium">Available Design Systems</h4>
-            <ds-button data-variant="ghost" data-size="sm" data-action="closeBrowse">Close</ds-button>
-          </div>
-          <div class="grid grid-cols-3 gap-3" style="max-height: 300px; overflow-y: auto;">
-            ${systems.map(sys => `
-              <div class="p-3 rounded border cursor-pointer hover:border-primary"
-                   style="background: var(--background); border-color: var(--border)"
-                   data-action="selectDesignSystem" data-system-id="${sys.id}">
-                <div class="font-medium text-sm">${sys.name}</div>
-                <div class="text-xs text-muted mt-1">${sys.description?.slice(0, 60) || ''}...</div>
-                <div class="flex gap-1 mt-2">
-                  <ds-badge data-variant="secondary" data-size="sm">${sys.category || 'library'}</ds-badge>
-                  ${sys.framework ? `<ds-badge data-variant="outline" data-size="sm">${sys.framework}</ds-badge>` : ''}
-                </div>
-              </div>
-            `).join('')}
-          </div>
-        </div>
-      `;
-    }
-
-    if (!result) return '';
-
-    const { intent, sources, next_steps, suggestions } = result;
-
-    // Found a design system to ingest
-    if (sources?.length > 0 && sources[0].matched_system) {
-      const system = sources[0].matched_system;
-      return `
-        <div class="mt-4 p-4 rounded border" style="background: var(--muted); border-color: var(--border)">
-          <div class="flex items-center justify-between mb-3">
-            <div>
-              <h4 class="font-medium">${system.name}</h4>
-              <p class="text-sm text-muted">${system.description}</p>
-            </div>
-            <ds-badge data-variant="primary">${system.category || 'library'}</ds-badge>
-          </div>
-
-          <div class="grid grid-cols-2 gap-4 mb-4">
-            <div>
-              <div class="text-xs text-muted mb-1">npm packages</div>
-              <code class="text-sm">${(system.npm_packages || []).join(', ') || 'N/A'}</code>
-            </div>
-            <div>
-              <div class="text-xs text-muted mb-1">Primary method</div>
-              <span class="text-sm">${system.primary_ingestion || 'npm'}</span>
-            </div>
-          </div>
-
-          ${system.figma_community_url ? `
-            <div class="text-xs mb-3">
-              <a href="${system.figma_community_url}" target="_blank" class="text-primary">View Figma Community Kit</a>
-            </div>
-          ` : ''}
-
-          <div class="flex gap-2">
-            <ds-button data-variant="primary" data-size="sm" data-action="confirmIngestion" data-system-id="${system.id}">
-              Ingest ${system.name}
-            </ds-button>
-            <ds-button data-variant="outline" data-size="sm" data-action="showAlternatives" data-system-id="${system.id}">
-              Other Methods
-            </ds-button>
-            <ds-button data-variant="ghost" data-size="sm" data-action="clearIngestion">
-              Cancel
-            </ds-button>
-          </div>
-        </div>
-      `;
-    }
-
-    // Show next steps or suggestions
-    if (next_steps?.length > 0) {
-      const step = next_steps[0];
-      if (step.action === 'request_source') {
-        return `
-          <div class="mt-4 p-4 rounded border" style="background: var(--muted); border-color: var(--border)">
-            <h4 class="font-medium mb-2">${step.message}</h4>
-            <div class="grid grid-cols-2 gap-3">
-              ${(step.alternatives || []).map(alt => `
-                <div class="p-3 rounded border cursor-pointer hover:border-primary"
-                     style="background: var(--background); border-color: var(--border)"
-                     data-action="selectIngestionMethod" data-method="${alt.requires}">
-                  <div class="font-medium text-sm">${alt.name}</div>
-                  <div class="text-xs text-muted mt-1">${alt.description}</div>
-                </div>
-              `).join('')}
-            </div>
-            <ds-button data-variant="ghost" data-size="sm" class="mt-3" data-action="clearIngestion">
-              Cancel
-            </ds-button>
-          </div>
-        `;
-      }
-
-      if (step.action === 'search_npm') {
-        return `
-          <div class="mt-4 p-4 rounded border" style="background: var(--muted); border-color: var(--border)">
-            <div class="flex items-center gap-2 mb-2">
-              <span class="status-dot status-dot--warning"></span>
-              <span class="font-medium">Not found in registry</span>
-            </div>
-            <p class="text-sm text-muted mb-3">${step.message}</p>
-            <ds-button data-variant="primary" data-size="sm" data-action="searchNpm" data-query="${step.query || step.package}">
-              Search npm
-            </ds-button>
-            <ds-button data-variant="ghost" data-size="sm" data-action="clearIngestion">
-              Cancel
-            </ds-button>
-          </div>
-        `;
-      }
-    }
-
-    // Show suggestions
-    if (suggestions?.length > 0) {
-      return `
-        <div class="mt-4 p-3 rounded" style="background: var(--muted)">
-          <ul class="text-sm text-muted">
-            ${suggestions.map(s => `<li class="mb-1">${s}</li>`).join('')}
-          </ul>
-        </div>
-      `;
-    }
-
-    return '';
-  }
-
-  // === Event Handlers ===
-
-  attachEventHandlers() {
-    // Use event delegation for all [data-action] buttons
-    // Only attach the listener once to prevent accumulation
-    if (!this.listeners.hasActionListener) {
-      document.addEventListener('click', (e) => {
-        const btn = e.target.closest('[data-action]');
-        if (!btn) return;
-
-        e.preventDefault();
-        e.stopPropagation();
-
-        const action = btn.dataset.action;
-        const component = btn.dataset.component;
-
-        switch (action) {
-          case 'extractTokens': this.extractTokens(); break;
-          case 'extractComponents': this.extractComponents(); break;
-          case 'syncTokens': this.syncTokens(); break;
-          case 'runVisualDiff': this.runVisualDiff(); break;
-          case 'validateComponents': this.validateComponents(); break;
-          case 'runDiscovery': this.runDiscovery(true); break;
-          case 'generateCode':
-            if (component) this.generateCode(component);
-            break;
-          case 'saveFigmaKey':
-            const input = document.getElementById('figma-file-key');
-            if (input) {
-              this.store.set({ figmaFileKey: input.value });
-              this.store.notify('Figma connection saved', 'success');
-            }
-            break;
-          case 'saveProjectDescription':
-            const descInput = document.getElementById('project-description');
-            const selectedProject = this.store.get('selectedProject');
-            if (descInput && selectedProject) {
-              this.updateProjectDescription(selectedProject.id, descInput.value);
-            }
-            break;
-          // Settings actions
-          case 'saveFigmaToken':
-            this.saveFigmaToken();
-            break;
-          case 'testFigmaConnection':
-            this.testFigmaConnection();
-            break;
-          case 'saveDssHost':
-            this.saveDssHost();
-            break;
-          case 'setMode':
-            const mode = btn.dataset.mode;
-            if (mode) this.setServerMode(mode);
-            break;
-          case 'toggleFeature':
-            const feature = btn.dataset.feature;
-            if (feature) this.toggleFeature(feature);
-            break;
-          case 'refreshServices':
-            this.loadServices();
-            break;
-          case 'initStorybook':
-            this.initStorybook();
-            break;
-          case 'clearStorybook':
-            this.clearStorybook();
-            break;
-          case 'resetDSS':
-            this.resetDSS();
-            break;
-          // Ingestion actions
-          case 'parseIngestion':
-            this.parseIngestionPrompt();
-            break;
-          case 'browseDesignSystems':
-            this.browseDesignSystems();
-            break;
-          case 'closeBrowse':
-            this.store.set({ browsingDesignSystems: false });
-            this.render();
-            break;
-          case 'selectDesignSystem':
-            const systemId = btn.dataset.systemId;
-            if (systemId) this.selectDesignSystem(systemId);
-            break;
-          case 'confirmIngestion':
-            const confirmSystemId = btn.dataset.systemId;
-            if (confirmSystemId) this.confirmIngestion(confirmSystemId);
-            break;
-          case 'showAlternatives':
-            const altSystemId = btn.dataset.systemId;
-            if (altSystemId) this.showIngestionAlternatives(altSystemId);
-            break;
-          case 'clearIngestion':
-            this.store.set({ ingestionResult: null, browsingDesignSystems: false });
-            this.render();
-            break;
-          case 'navigate-quick-wins':
-            window.location.hash = 'quick-wins';
-            break;
-          case 'searchNpm':
-            const npmQuery = btn.dataset.query;
-            if (npmQuery) this.searchNpmPackages(npmQuery);
-            break;
-          case 'selectIngestionMethod':
-            const methodType = btn.dataset.method;
-            if (methodType) this.selectIngestionMethod(methodType);
-            break;
-          // Project actions
-          case 'toggleCreateProject':
-            this.store.set({ showCreateProjectForm: !this.store.get('showCreateProjectForm') });
-            this.render();
-            break;
-          case 'submitCreateProject':
-            const nameInput = document.getElementById('new-project-name');
-            if (nameInput && nameInput.value) {
-              this.createProject(
-                nameInput.value,
-                '', // description
-                ''  // figma key
-              );
-            } else {
-              this.store.notify('Please enter a project name', 'warning');
-            }
-            break;
-          case 'selectProject':
-            const selectProjectId = btn.dataset.projectId;
-            if (selectProjectId) this.selectProject(selectProjectId);
-            break;
-          case 'syncProject':
-            const syncProjectId = btn.dataset.projectId;
-            const syncFigmaKey = btn.dataset.figmaKey;
-            if (syncProjectId) this.syncProjectTokens(syncProjectId, syncFigmaKey);
-            break;
-          case 'deleteProject':
-            const deleteProjectId = btn.dataset.projectId;
-            if (deleteProjectId) this.deleteProject(deleteProjectId);
-            break;
-          // Token export format
-          case 'setExportFormat':
-            const format = btn.dataset.format;
-            if (format) {
-              this.store.set({ tokenExportFormat: format });
-              this.render();
-            }
-            break;
-          // Component actions
-          case 'viewComponentCode':
-            const compName = btn.dataset.component;
-            const compFramework = btn.dataset.framework || 'react';
-            if (compName) this.showComponentCode(compName, compFramework);
-            break;
-          case 'setFramework':
-            const fw = btn.dataset.framework;
-            if (fw) {
-              this.store.set({ componentFramework: fw });
-              this.render();
-            }
-            break;
-          case 'closeGeneratedCode':
-            this.store.set({ generatedCode: null });
-            this.render();
-            break;
-          case 'copyCode':
-            const code = this.store.get('generatedCode')?.code;
-            if (code) {
-              navigator.clipboard.writeText(code);
-              this.store.notify('Code copied to clipboard', 'success');
-            }
-            break;
-          // New services and quick wins actions
-          case 'executeTool':
-            const toolName = btn.dataset.tool;
-            if (toolName) this.executeToolWithParams(toolName);
-            break;
-          case 'loadQuickWins':
-            this.loadQuickWins();
-            break;
-          case 'investigateWin':
-            const winId = btn.dataset.winId;
-            if (winId) this.investigateWin(winId);
-            break;
-          case 'markDone':
-            const doneWinId = btn.dataset.winId;
-            if (doneWinId) this.markWinDone(doneWinId);
-            break;
-          // Chat actions
-          case 'sendChatMessage':
-            this.sendChatMessage({ target: btn });
-            break;
-          case 'clearChat':
-            claudeService.clearHistory();
-            this.render();
-            break;
-          case 'exportChat':
-            claudeService.exportConversation();
-            break;
-          // Team Dashboard actions
-          case 'sync-figma-file':
-            const fileId = btn.dataset.fileId;
-            if (fileId) this.syncFigmaFile(fileId);
-            break;
-          case 'delete-figma-file':
-            const deleteFileId = btn.dataset.fileId;
-            if (deleteFileId && confirm('Delete this Figma file?')) {
-              this.deleteFigmaFile(deleteFileId);
-            }
-            break;
-          // Plugin actions
-          case 'togglePlugin':
-            const pluginId = btn.dataset.plugin;
-            if (pluginId) this.togglePlugin(pluginId);
-            break;
-          case 'setPluginSetting':
-            const settingPluginId = btn.dataset.plugin;
-            const settingKey = btn.dataset.key;
-            const settingType = btn.dataset.type;
-            if (settingPluginId && settingKey) {
-              let settingValue;
-              if (settingType === 'boolean') {
-                const current = pluginService.getPluginSettings(settingPluginId)[settingKey];
-                settingValue = !current;
-              } else if (btn.tagName === 'SELECT') {
-                settingValue = btn.value;
-              }
-              this.setPluginSetting(settingPluginId, settingKey, settingValue);
-            }
-            break;
-          // Theme actions
-          case 'toggle-theme':
-            themeManager.toggle();
-            this.render();
-            break;
-          // Audit actions
-          case 'load-audit':
-            this.loadAuditLog();
-            break;
-          case 'clear-audit-filters':
-            this.clearAuditFilters();
-            break;
-          case 'export-audit':
-            const exportFormat = btn.dataset.format || 'json';
-            this.exportAuditLog(exportFormat);
-            break;
-          case 'prev-audit-page':
-            this.prevAuditPage();
-            break;
-          case 'next-audit-page':
-            this.nextAuditPage();
-            break;
-          case 'show-audit-details':
-            const auditId = btn.dataset.auditId;
-            if (auditId) this.showAuditDetails(parseInt(auditId));
-            break;
-        }
-      });
-
-      this.listeners.hasActionListener = true;
-    }
-
-    // Chat form submission
-    const chatForm = document.getElementById('chatForm');
-    if (chatForm) {
-      chatForm.addEventListener('submit', (e) => {
-        e.preventDefault();
-        this.sendChatMessage(e);
-      });
-    }
-
-    // Team Dashboard form submissions
-    const addFigmaFileForm = document.getElementById('add-figma-file-form');
-    if (addFigmaFileForm) {
-      addFigmaFileForm.addEventListener('submit', (e) => {
-        e.preventDefault();
-        const formData = new FormData(e.target);
-        this.addFigmaFile({
-          file_name: formData.get('file_name'),
-          figma_url: formData.get('figma_url'),
-          file_key: formData.get('file_key')
-        });
-      });
-    }
-
-    const addESREForm = document.getElementById('add-esre-form');
-    if (addESREForm) {
-      addESREForm.addEventListener('submit', (e) => {
-        e.preventDefault();
-        const formData = new FormData(e.target);
-        this.addESREDefinition({
-          name: formData.get('name'),
-          definition_text: formData.get('definition_text'),
-          component_name: formData.get('component_name') || null,
-          expected_value: formData.get('expected_value') || null
-        });
-      });
-    }
-
-    // Search and filter handlers for services page
-    const toolSearch = document.getElementById('toolSearch');
-    if (toolSearch) {
-      toolSearch.addEventListener('input', (e) => {
-        this.filterTools(e.target.value, document.getElementById('categoryFilter')?.value || '');
-      });
-    }
-
-    const categoryFilter = document.getElementById('categoryFilter');
-    if (categoryFilter) {
-      categoryFilter.addEventListener('change', (e) => {
-        this.filterTools(document.getElementById('toolSearch')?.value || '', e.target.value);
-      });
-    }
-
-    // Docs navigation
-    document.querySelectorAll('.docs-nav__link[data-doc]').forEach(link => {
-      link.addEventListener('click', (e) => {
-        e.preventDefault();
-        const docId = e.currentTarget.dataset.doc;
-        const content = document.getElementById('docs-content');
-        if (content && docId) {
-          setSafeHtml(content, this.getDocContent(docId));
-          document.querySelectorAll('.docs-nav__link').forEach(l => l.classList.remove('active'));
-          e.currentTarget.classList.add('active');
-        }
-      });
-    });
-
-    // Setup keyboard shortcuts
-    this.setupKeyboardHandlers();
-  }
-
-  setupKeyboardHandlers() {
-    // Handle global keyboard shortcuts
-    if (!this.listeners.hasKeyboardListener) {
-      this.listeners.keyboardHandler = (e) => {
-        // Escape key: Close sidebars and modals
-        if (e.key === 'Escape') {
-          // Close AI sidebar if visible
-          const aiSidebar = document.getElementById('ai-sidebar');
-          const toggleBtn = document.getElementById('sidebar-toggle');
-          if (aiSidebar && !aiSidebar.classList.contains('hidden')) {
-            if (toggleBtn) {
-              toggleBtn.click();
-              // Update ARIA state
-              setTimeout(() => {
-                const isExpanded = !aiSidebar.classList.contains('hidden');
-                toggleBtn.setAttribute('aria-expanded', isExpanded);
-              }, 0);
-            }
-          }
-
-          // Close any open details/summary elements
-          document.querySelectorAll('details[open]').forEach(details => {
-            details.open = false;
-          });
-        }
-
-        // Alt+N: Navigate to next page
-        if (e.altKey && e.key === 'n') {
-          e.preventDefault();
-          const navItems = Array.from(document.querySelectorAll('.nav-item'));
-          const currentPage = this.store.get('currentPage');
-          const currentIndex = navItems.findIndex(item => item.dataset.page === currentPage);
-          if (currentIndex >= 0 && currentIndex < navItems.length - 1) {
-            navItems[currentIndex + 1].focus();
-            navItems[currentIndex + 1].click();
-          }
-        }
-
-        // Alt+P: Navigate to previous page
-        if (e.altKey && e.key === 'p') {
-          e.preventDefault();
-          const navItems = Array.from(document.querySelectorAll('.nav-item'));
-          const currentPage = this.store.get('currentPage');
-          const currentIndex = navItems.findIndex(item => item.dataset.page === currentPage);
-          if (currentIndex > 0) {
-            navItems[currentIndex - 1].focus();
-            navItems[currentIndex - 1].click();
-          }
-        }
-      };
-
-      document.addEventListener('keydown', this.listeners.keyboardHandler);
-      this.listeners.hasKeyboardListener = true;
-    }
-  }
-
-  // === Settings Actions ===
-
-  async saveFigmaToken() {
-    const input = document.getElementById('figma-token-input');
-    if (!input || !input.value || input.value.includes('••••')) {
-      this.store.notify('Please enter a valid Figma token', 'warning');
-      return;
-    }
-
-    this.store.setLoading('saveFigmaToken', true);
-    try {
-      const api = (await import('./api.js')).default;
-      await api.setFigmaToken(input.value);
-      this.store.set({ figmaConfig: { configured: true } });
-      this.store.notify('Figma token saved', 'success');
-      this.render();
-    } catch (error) {
-      this.store.notify(`Failed to save token: ${error.message}`, 'error');
-    } finally {
-      this.store.setLoading('saveFigmaToken', false);
-    }
-  }
-
-  async testFigmaConnection() {
-    this.store.setLoading('testFigma', true);
-    try {
-      const api = (await import('./api.js')).default;
-      const result = await api.testFigmaConnection();
-      this.store.set({ figmaTestResult: result });
-      if (result.success) {
-        this.store.notify('Figma connection successful!', 'success');
-      } else {
-        this.store.notify(`Connection failed: ${result.error}`, 'error');
-      }
-      this.render();
-    } catch (error) {
-      this.store.set({ figmaTestResult: { success: false, error: error.message } });
-      this.store.notify(`Test failed: ${error.message}`, 'error');
-      this.render();
-    } finally {
-      this.store.setLoading('testFigma', false);
-    }
-  }
-
-  async saveDssHost() {
-    const input = document.getElementById('dss-host-input');
-    if (!input) {
-      notifyError('DSS host input not found', ErrorCode.SYSTEM_UNEXPECTED);
-      return;
-    }
-
-    const newHost = input.value.trim() || 'localhost';
-
-    this.store.setLoading('saveDssHost', true);
-    try {
-      // Validate hostname format (alphanumeric, dots, hyphens)
-      if (!/^[a-zA-Z0-9.-]+$/.test(newHost)) {
-        notifyError('Invalid hostname format', ErrorCode.VALIDATION_INVALID_FORMAT, {
-          host: newHost
-        });
-        this.store.setLoading('saveDssHost', false);
-        return;
-      }
-
-      // Save to store (will auto-persist via subscription)
-      this.store.set({ dssHost: newHost });
-
-      // Update the link immediately
-      this.updateStorybookLink();
-
-      // Notify success
-      notifySuccess('Host configuration saved successfully!', ErrorCode.SUCCESS_UPDATED, {
-        host: newHost,
-        storybookUrl: `${window.location.protocol}//${newHost}:6006`
-      });
-
-      this.render();
-    } catch (error) {
-      handleError(error, {
-        operation: 'save DSS host',
-        host: newHost
-      });
-    } finally {
-      this.store.setLoading('saveDssHost', false);
-    }
-  }
-
-  async resetDSS() {
-    // Confirm with user
-    const confirmed = window.confirm(
-      '⚠️ WARNING: This will delete all user-created themes, projects, cached data, and databases.\n\n' +
-      'The DSS structure and default themes will be preserved.\n\n' +
-      'Type "RESET" in the next prompt to confirm.'
-    );
-
-    if (!confirmed) {
-      return;
-    }
-
-    const confirmText = window.prompt('Type RESET (all caps) to confirm:');
-    if (confirmText !== 'RESET') {
-      this.store.notify('Reset cancelled', 'info');
-      return;
-    }
-
-    this.store.setLoading('resetDSS', true);
-    try {
-      this.store.notify('Resetting DSS... This may take a moment.', 'info');
-
-      // Call Python reset command via shell
-      const response = await fetch('/api/system/reset', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ confirm: 'RESET' })
-      });
-
-      if (!response.ok) {
-        throw new Error('Reset command failed');
-      }
-
-      const result = await response.json();
-
-      this.store.notify('✅ DSS has been reset to fresh state!', 'success');
-
-      // Reload after a short delay
-      setTimeout(() => {
-        window.location.reload();
-      }, 2000);
-
-    } catch (error) {
-      this.store.notify(`Reset failed: ${error.message}`, 'error');
-    } finally {
-      this.store.setLoading('resetDSS', false);
-    }
-  }
-
-  async setServerMode(mode) {
-    try {
-      const api = (await import('./api.js')).default;
-      await api.setMode(mode);
-      const config = this.store.get('runtimeConfig') || {};
-      config.mode = mode;
-      this.store.set({ runtimeConfig: config });
-      this.store.notify(`Server mode set to ${mode}`, 'success');
-      this.render();
-    } catch (error) {
-      this.store.notify(`Failed to set mode: ${error.message}`, 'error');
-    }
-  }
-
-  async toggleFeature(featureId) {
-    const config = this.store.get('runtimeConfig') || {};
-    const features = config.features || {};
-    const newValue = features[featureId] === false;
-
-    try {
-      const api = (await import('./api.js')).default;
-      await api.updateConfig({ features: { [featureId]: newValue } });
-      features[featureId] = newValue;
-      config.features = features;
-      this.store.set({ runtimeConfig: config });
-      this.store.notify(`${featureId} ${newValue ? 'enabled' : 'disabled'}`, 'success');
-      this.render();
-    } catch (error) {
-      this.store.notify(`Failed to toggle feature: ${error.message}`, 'error');
-    }
-  }
-
-  async togglePlugin(pluginId) {
-    try {
-      await pluginService.toggle(pluginId);
-      const plugin = pluginService.get(pluginId);
-      this.store.notify(`${plugin.name} ${plugin.enabled ? 'enabled' : 'disabled'}`, 'success');
-      this.render();
-    } catch (error) {
-      this.store.notify(`Failed to toggle plugin: ${error.message}`, 'error');
-    }
-  }
-
-  setPluginSetting(pluginId, key, value) {
-    pluginService.setPluginSetting(pluginId, key, value);
-    this.store.notify('Setting updated', 'success');
-    this.render();
-  }
-
-  async loadServices() {
-    try {
-      const api = (await import('./api.js')).default;
-      const services = await api.getServices();
-      this.store.set({ services });
-      this.render();
-    } catch (error) {
-      console.error('Failed to load services:', error);
-    }
-  }
-
-  async initStorybook() {
-    try {
-      this.store.notify('Initializing Storybook...', 'info');
-      const api = (await import('./api.js')).default;
-      const result = await api.post('/storybook/init', {});
-      if (result.success) {
-        this.store.notify(result.message || 'Storybook initialized', 'success');
-      } else {
-        this.store.notify('Failed to initialize Storybook', 'error');
-      }
-    } catch (error) {
-      console.error('Failed to initialize Storybook:', error);
-      this.store.notify(`Failed to initialize Storybook: ${error.message}`, 'error');
-    }
-  }
-
-  async clearStorybook() {
-    try {
-      this.store.notify('Clearing Storybook stories...', 'info');
-      const api = (await import('./api.js')).default;
-      const result = await api.delete('/storybook/stories');
-      if (result.success) {
-        this.store.notify(result.message || 'Stories cleared', 'success');
-      } else {
-        this.store.notify('Failed to clear stories', 'error');
-      }
-    } catch (error) {
-      console.error('Failed to clear Storybook:', error);
-      this.store.notify(`Failed to clear stories: ${error.message}`, 'error');
-    }
-  }
-
-  // === Design System Ingestion ===
-
-  async parseIngestionPrompt() {
-    const input = document.getElementById('ingest-prompt');
-    if (!input || !input.value.trim()) {
-      this.store.notify('Please enter a design system name or prompt', 'warning');
-      return;
-    }
-
-    try {
-      this.store.setLoading('ingestion', true);
-      this.store.notify('Parsing ingestion prompt...', 'info');
-
-      const api = (await import('./api.js')).default;
-      const result = await api.post('/ingest/parse', {
-        prompt: input.value.trim(),
-        project_id: this.store.get('currentProject')
-      });
-
-      this.store.set({ ingestionResult: result });
-      this.render();
-
-      // Show helpful message
-      if (result.sources?.length > 0 && result.sources[0].matched_system) {
-        this.store.notify(`Found: ${result.sources[0].matched_system.name}`, 'success');
-      } else if (result.next_steps?.length > 0) {
-        this.store.notify(result.next_steps[0].message || 'Processing...', 'info');
-      }
-    } catch (error) {
-      console.error('Ingestion parse failed:', error);
-      this.store.notify(`Failed to parse: ${error.message}`, 'error');
-    } finally {
-      this.store.setLoading('ingestion', false);
-    }
-  }
-
-  async browseDesignSystems() {
-    try {
-      this.store.notify('Loading design systems...', 'info');
-
-      const api = (await import('./api.js')).default;
-      const result = await api.get('/ingest/systems');
-
-      this.store.set({
-        designSystems: result.systems || [],
-        browsingDesignSystems: true,
-        ingestionResult: null
-      });
-      this.render();
-    } catch (error) {
-      console.error('Failed to load design systems:', error);
-      this.store.notify(`Failed to load: ${error.message}`, 'error');
-    }
-  }
-
-  async selectDesignSystem(systemId) {
-    try {
-      const api = (await import('./api.js')).default;
-      const result = await api.get(`/ingest/systems/${systemId}`);
-
-      this.store.set({
-        ingestionResult: {
-          sources: [{ matched_system: result.system }],
-          alternatives: result.alternatives
-        },
-        browsingDesignSystems: false
-      });
-      this.render();
-    } catch (error) {
-      console.error('Failed to select design system:', error);
-      this.store.notify(`Failed: ${error.message}`, 'error');
-    }
-  }
-
-  async confirmIngestion(systemId) {
-    try {
-      this.store.setLoading('ingestion', true);
-      this.store.notify('Starting ingestion...', 'info');
-
-      const api = (await import('./api.js')).default;
-      const result = await api.post('/ingest/confirm', {
-        system_id: systemId,
-        method: 'npm' // Default to npm
-      });
-
-      if (result.success) {
-        this.store.notify(`Queued: ${result.message}`, 'success');
-
-        // Show next steps
-        if (result.next_steps?.length > 0) {
-          setTimeout(() => {
-            this.store.notify(`Next: ${result.next_steps.join(' → ')}`, 'info');
-          }, 1500);
-        }
-
-        // Clear ingestion UI
-        this.store.set({ ingestionResult: null });
-        this.render();
-      } else {
-        this.store.notify('Ingestion failed', 'error');
-      }
-    } catch (error) {
-      console.error('Ingestion failed:', error);
-      this.store.notify(`Failed: ${error.message}`, 'error');
-    } finally {
-      this.store.setLoading('ingestion', false);
-    }
-  }
-
-  async showIngestionAlternatives(systemId) {
-    try {
-      const api = (await import('./api.js')).default;
-      const result = await api.get(`/ingest/alternatives?system_id=${systemId}`);
-
-      // Update the ingestion result to show alternatives
-      const currentResult = this.store.get('ingestionResult') || {};
-      this.store.set({
-        ingestionResult: {
-          ...currentResult,
-          next_steps: [{
-            action: 'request_source',
-            message: 'Choose an ingestion method:',
-            alternatives: result.alternatives || []
-          }]
-        }
-      });
-      this.render();
-    } catch (error) {
-      console.error('Failed to get alternatives:', error);
-      this.store.notify(`Failed: ${error.message}`, 'error');
-    }
-  }
-
-  async searchNpmPackages(query) {
-    try {
-      this.store.notify(`Searching npm for "${query}"...`, 'info');
-
-      const api = (await import('./api.js')).default;
-      const result = await api.get(`/ingest/npm/search?query=${encodeURIComponent(query)}`);
-
-      if (result.packages?.length > 0) {
-        // Show npm results as design systems to choose from
-        this.store.set({
-          designSystems: result.packages.map(pkg => ({
-            id: pkg.name,
-            name: pkg.name,
-            description: pkg.description,
-            npm_packages: [pkg.name],
-            category: pkg.is_design_system ? 'npm-design-system' : 'npm-package',
-            homepage: pkg.homepage
-          })),
-          browsingDesignSystems: true,
-          ingestionResult: null
-        });
-        this.store.notify(`Found ${result.packages.length} packages`, 'success');
-      } else {
-        this.store.notify('No packages found on npm', 'warning');
-      }
-      this.render();
-    } catch (error) {
-      console.error('npm search failed:', error);
-      this.store.notify(`Search failed: ${error.message}`, 'error');
-    }
-  }
-
-  selectIngestionMethod(methodType) {
-    // Show appropriate UI for the selected method
-    const prompts = {
-      figma_url: 'Enter Figma file URL:',
-      css_url: 'Enter CSS file URL:',
-      github_url: 'Enter GitHub repository URL:',
-      image_url: 'Upload or enter image URL:',
-      text_description: 'Describe your design tokens:'
-    };
-
-    const prompt = prompts[methodType] || 'Enter source:';
-    const value = window.prompt(prompt);
-
-    if (value) {
-      // Store the method and source for later use
-      this.store.set({
-        ingestionMethod: methodType,
-        ingestionSource: value
-      });
-      this.store.notify(`Source saved. Click "Ingest" to proceed.`, 'success');
-    }
-  }
-
-  async loadConfig() {
-    try {
-      const api = (await import('./api.js')).default;
-      const [configData, figmaConfig, services] = await Promise.all([
-        api.getConfig(),
-        api.getFigmaConfig(),
-        api.getServices()
-      ]);
-      this.store.set({
-        runtimeConfig: configData.config || {},
-        figmaConfig: figmaConfig || {},
-        services: services || {}
-      });
-    } catch (error) {
-      console.error('Failed to load config:', error);
-    }
-  }
-
-  // === Project Management ===
-
-  async loadProjects() {
-    try {
-      const api = (await import('./api.js')).default;
-      const projects = await api.getProjects();
-      this.store.setProjects(Array.isArray(projects) ? projects : []);
-      // Render project selector after projects are loaded
-      this.renderProjectSelector();
-    } catch (error) {
-      console.error('Failed to load projects:', error);
-      this.store.setProjects([]);
-      this.renderProjectSelector();
-    }
-  }
-
-  async loadDashboardData(projectId) {
-    if (!projectId) return;
-
-    try {
-      logger.info('App', 'Loading dashboard data', { projectId });
-      const dashboardData = await DashboardService.getDashboardSummary(projectId);
-      this.store.set({ dashboardData });
-      this.render(); // Re-render to show updated data
-    } catch (error) {
-      logger.error('App', 'Failed to load dashboard data', error);
-      // Set empty dashboard data on error
-      this.store.set({
-        dashboardData: {
-          ux: { figma_files_count: 0, figma_files: [] },
-          ui: { token_drift: { total: 0, by_severity: {} }, code_metrics: {} },
-          qa: { esre_count: 0, test_summary: {} }
-        }
-      });
-    }
-  }
-
-  renderProjectSelector() {
-    const container = document.getElementById('project-selector-container');
-    if (!container) return;
-
-    const projects = this.store.get('projects') || [];
-    const currentProject = this.store.get('currentProject') || (projects.length > 0 ? projects[0].id : null);
-
-    // Restore from localStorage if available
-    const savedProject = localStorage.getItem('dss_current_project');
-    if (savedProject && projects.find(p => p.id === savedProject)) {
-      this.store.set({ currentProject: savedProject });
-    } else if (currentProject) {
-      this.store.set({ currentProject });
-    }
-
-    const html = `
-      <div class="project-selector">
-        <svg class="project-selector__icon" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
-          <path d="M3 3h18v18H3z"/>
-          <path d="M21 9H3"/>
-          <path d="M9 21V9"/>
-        </svg>
-        <span class="project-selector__label">Project:</span>
-        <select class="project-selector__select" id="project-select">
-          ${projects.length === 0
-            ? '<option value="">No projects</option>'
-            : projects.map(p => `
-              <option value="${escapeHtml(p.id)}" ${p.id === (currentProject || savedProject) ? 'selected' : ''}>
-                ${escapeHtml(p.name)}
-              </option>
-            `).join('')}
-        </select>
-      </div>
-    `;
-
-    setSafeHtml(container, html);
-
-    // Attach event listener
-    const select = document.getElementById('project-select');
-    if (select) {
-      select.addEventListener('change', (e) => {
-        const projectId = e.target.value;
-        this.handleProjectChange(projectId);
-      });
-    }
-  }
-
-  handleProjectChange(projectId) {
-    logger.info('App', 'Project context changed', { projectId });
-
-    // Save to store and localStorage
-    this.store.set({ currentProject: projectId });
-    localStorage.setItem('dss_current_project', projectId);
-
-    // Get project details
-    const projects = this.store.get('projects') || [];
-    const project = projects.find(p => p.id === projectId);
-
-    // Trigger refresh
-    this.render();
-
-    logger.info('App', 'Project context set', { project: project?.name });
-  }
-
-  // === Audit Log ===
-
-  renderAuditLog() {
-    // Load audit log data after render
-    setTimeout(() => this.loadAuditLog(), 100);
-
-    return `
-      <div class="page-header">
-        <h1>Audit Log</h1>
-        <p class="text-muted">History of all user actions and system events</p>
-      </div>
-
-      <!-- Filters -->
-      <div class="mt-6">
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Filters</ds-card-title>
-          </ds-card-header>
-          <ds-card-content>
-            <div class="grid grid-cols-4 gap-4">
-              <div>
-                <label class="text-sm font-medium">Category</label>
-                <select id="audit-category-filter" class="w-full mt-2 p-2 rounded border">
-                  <option value="">All Categories</option>
-                  <option value="design_system">Design System</option>
-                  <option value="code">Code</option>
-                  <option value="configuration">Configuration</option>
-                  <option value="project">Project</option>
-                  <option value="team">Team</option>
-                  <option value="storybook">Storybook</option>
-                </select>
-              </div>
-
-              <div>
-                <label class="text-sm font-medium">Severity</label>
-                <select id="audit-severity-filter" class="w-full mt-2 p-2 rounded border">
-                  <option value="">All Severities</option>
-                  <option value="info">Info</option>
-                  <option value="warning">Warning</option>
-                  <option value="critical">Critical</option>
-                </select>
-              </div>
-
-              <div>
-                <label class="text-sm font-medium">Start Date</label>
-                <input type="date" id="audit-start-date" class="w-full mt-2 p-2 rounded border">
-              </div>
-
-              <div>
-                <label class="text-sm font-medium">End Date</label>
-                <input type="date" id="audit-end-date" class="w-full mt-2 p-2 rounded border">
-              </div>
-            </div>
-
-            <div class="flex gap-3 mt-4">
-              <ds-button data-variant="primary" data-action="load-audit">
-                Apply Filters
-              </ds-button>
-              <ds-button data-variant="outline" data-action="clear-audit-filters">
-                Clear Filters
-              </ds-button>
-              <ds-button data-variant="outline" data-action="export-audit" data-format="json">
-                📥 Export JSON
-              </ds-button>
-              <ds-button data-variant="outline" data-action="export-audit" data-format="csv">
-                📥 Export CSV
-              </ds-button>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-
-      <!-- Audit Log Table -->
-      <div class="mt-6">
-        <ds-card>
-          <ds-card-header>
-            <ds-card-title>Activity History</ds-card-title>
-            <ds-card-description>
-              <span id="audit-total-count">Loading...</span>
-            </ds-card-description>
-          </ds-card-header>
-          <ds-card-content>
-            <div id="audit-log-content">
-              <div class="text-center py-8 text-muted">
-                Loading audit log...
-              </div>
-            </div>
-
-            <!-- Pagination -->
-            <div class="flex justify-between items-center mt-6" id="audit-pagination" style="display: none;">
-              <div class="text-sm text-muted">
-                Showing <span id="audit-showing"></span> of <span id="audit-total"></span> entries
-              </div>
-              <div class="flex gap-2">
-                <ds-button data-variant="outline" data-size="sm" id="audit-prev-btn" data-action="prev-audit-page">
-                  Previous
-                </ds-button>
-                <ds-button data-variant="outline" data-size="sm" id="audit-next-btn" data-action="next-audit-page">
-                  Next
-                </ds-button>
-              </div>
-            </div>
-          </ds-card-content>
-        </ds-card>
-      </div>
-    `;
-  }
-
-  async loadAuditLog() {
-    const auditService = (await import('../services/audit-service.js')).default;
-    const content = document.getElementById('audit-log-content');
-    if (!content) return;
-
-    // Get filter values
-    const filters = {
-      category: document.getElementById('audit-category-filter')?.value || '',
-      severity: document.getElementById('audit-severity-filter')?.value || '',
-      start_date: document.getElementById('audit-start-date')?.value || '',
-      end_date: document.getElementById('audit-end-date')?.value || '',
-      limit: 50,
-      offset: this.auditLogOffset || 0
-    };
-
-    // Add current project filter if set
-    const currentProject = this.store.get('currentProject');
-    if (currentProject) {
-      filters.project_id = currentProject;
-    }
-
-    try {
-      const result = await auditService.getAuditLog(filters);
-
-      // Update total count
-      const totalCount = document.getElementById('audit-total-count');
-      if (totalCount) {
-        totalCount.textContent = `${result.total} total events`;
-      }
-
-      // Render table
-      if (result.activities && result.activities.length > 0) {
-        const html = `
-          <table class="w-full">
-            <thead>
-              <tr class="border-b">
-                <th class="text-left p-3 text-sm font-medium">Time</th>
-                <th class="text-left p-3 text-sm font-medium">User</th>
-                <th class="text-left p-3 text-sm font-medium">Action</th>
-                <th class="text-left p-3 text-sm font-medium">Category</th>
-                <th class="text-left p-3 text-sm font-medium">Description</th>
-                <th class="text-left p-3 text-sm font-medium">Severity</th>
-              </tr>
-            </thead>
-            <tbody>
-              ${result.activities.map(activity => `
-                <tr class="border-b hover:bg-muted/50 cursor-pointer" data-action="show-audit-details" data-audit-id="${activity.id}">
-                  <td class="p-3 text-sm text-muted">
-                    ${escapeHtml(auditService.formatTimestamp(activity.created_at))}
-                  </td>
-                  <td class="p-3 text-sm">
-                    ${escapeHtml(activity.user_name || activity.user_id || 'System')}
-                  </td>
-                  <td class="p-3 text-sm font-mono text-xs">
-                    ${escapeHtml(activity.action)}
-                  </td>
-                  <td class="p-3 text-sm">
-                    ${auditService.getCategoryIcon(activity.category)} ${escapeHtml(activity.category || 'other')}
-                  </td>
-                  <td class="p-3 text-sm">
-                    ${escapeHtml(activity.description || '-')}
-                  </td>
-                  <td class="p-3">
-                    <ds-badge data-variant="${escapeHtml(auditService.getSeverityClass(activity.severity))}">
-                      ${escapeHtml(activity.severity)}
-                    </ds-badge>
-                  </td>
-                </tr>
-              `).join('')}
-            </tbody>
-          </table>
-        `;
-        setSafeHtml(content, html);
-      } else {
-        content.innerHTML = `
-          <div class="text-center py-8 text-muted">
-            No audit entries found
-          </div>
-        `;
-      }
-
-      // Update pagination
-      const pagination = document.getElementById('audit-pagination');
-      if (pagination && result.total > 0) {
-        pagination.style.display = 'flex';
-
-        const showing = document.getElementById('audit-showing');
-        const total = document.getElementById('audit-total');
-        const prevBtn = document.getElementById('audit-prev-btn');
-        const nextBtn = document.getElementById('audit-next-btn');
-
-        const start = filters.offset + 1;
-        const end = Math.min(filters.offset + result.activities.length, result.total);
-
-        if (showing) showing.textContent = `${start}-${end}`;
-        if (total) total.textContent = result.total;
-
-        if (prevBtn) {
-          if (filters.offset === 0) {
-            prevBtn.setAttribute('disabled', '');
-          } else {
-            prevBtn.removeAttribute('disabled');
-          }
-        }
-        if (nextBtn) {
-          if (!result.has_more) {
-            nextBtn.setAttribute('disabled', '');
-          } else {
-            nextBtn.removeAttribute('disabled');
-          }
-        }
-
-        this.auditLogData = result;
-      }
-
-    } catch (error) {
-      content.innerHTML = `
-        <div class="text-center py-8 text-destructive">
-          Failed to load audit log: ${error.message}
-        </div>
-      `;
-    }
-  }
-
-  clearAuditFilters() {
-    document.getElementById('audit-category-filter').value = '';
-    document.getElementById('audit-severity-filter').value = '';
-    document.getElementById('audit-start-date').value = '';
-    document.getElementById('audit-end-date').value = '';
-    this.auditLogOffset = 0;
-    this.loadAuditLog();
-  }
-
-  nextAuditPage() {
-    const limit = 50;
-    this.auditLogOffset = (this.auditLogOffset || 0) + limit;
-    this.loadAuditLog();
-  }
-
-  prevAuditPage() {
-    const limit = 50;
-    this.auditLogOffset = Math.max(0, (this.auditLogOffset || 0) - limit);
-    this.loadAuditLog();
-  }
-
-  async exportAuditLog(format = 'json') {
-    const auditService = (await import('../services/audit-service.js')).default;
-
-    const filters = {
-      category: document.getElementById('audit-category-filter')?.value || '',
-      start_date: document.getElementById('audit-start-date')?.value || '',
-      end_date: document.getElementById('audit-end-date')?.value || ''
-    };
-
-    // Add current project filter
-    const currentProject = this.store.get('currentProject');
-    if (currentProject) {
-      filters.project_id = currentProject;
-    }
-
-    await auditService.export(filters, format);
-    this.store.notify(`Audit log export started (${format})`, 'success');
-  }
-
-  showAuditDetails(id) {
-    // TODO: Show modal with full audit entry details
-    console.log('Show audit details for:', id);
-  }
-
-  async createProject(name, description, figmaFileKey) {
-    this.store.setLoading('createProject', true);
-    try {
-      const api = (await import('./api.js')).default;
-      const project = await api.createProject({
-        name,
-        description,
-        figma_file_key: figmaFileKey
-      });
-      this.store.addProject(project);
-      this.store.set({ showCreateProjectForm: false });
-      this.store.notify(`Project "${name}" created successfully`, 'success');
-      this.render();
-      return project;
-    } catch (error) {
-      this.store.notify(`Failed to create project: ${error.message}`, 'error');
-      throw error;
-    } finally {
-      this.store.setLoading('createProject', false);
-    }
-  }
-
-  async updateProjectDescription(projectId, description) {
-    this.store.setLoading('updateProject', true);
-    try {
-      const api = (await import('./api.js')).default;
-      await api.updateProject(projectId, { description });
-
-      // Update project in store
-      const projects = this.store.get('projects').map(p =>
-        p.id === projectId ? { ...p, description } : p
-      );
-      this.store.setProjects(projects);
-
-      // Update selected project
-      const selectedProject = this.store.get('selectedProject');
-      if (selectedProject && selectedProject.id === projectId) {
-        this.store.set({ selectedProject: { ...selectedProject, description } });
-      }
-
-      this.store.notify('Project description updated', 'success');
-      this.render();
-    } catch (error) {
-      this.store.notify(`Failed to update description: ${error.message}`, 'error');
-    } finally {
-      this.store.setLoading('updateProject', false);
-    }
-  }
-
-  async deleteProject(projectId) {
-    if (!confirm('Are you sure you want to delete this project? This cannot be undone.')) {
-      return;
-    }
-
-    this.store.setLoading('deleteProject', true);
-    try {
-      const api = (await import('./api.js')).default;
-      await api.deleteProject(projectId);
-      const projects = this.store.get('projects').filter(p => p.id !== projectId);
-      this.store.setProjects(projects);
-      this.store.notify('Project deleted', 'success');
-      this.render();
-    } catch (error) {
-      this.store.notify(`Failed to delete project: ${error.message}`, 'error');
-    } finally {
-      this.store.setLoading('deleteProject', false);
-    }
-  }
-
-  selectProject(projectId) {
-    const project = this.store.get('projects').find(p => p.id === projectId);
-    if (project) {
-      this.store.set({
-        selectedProject: project,
-        figmaFileKey: project.figma_file_key
-      });
-      this.store.notify(`Selected project: ${project.name}`, 'info');
-      // Navigate to dashboard with project context
-      this.navigate('dashboard');
-    }
-  }
-
-  async syncProjectTokens(projectId, figmaKey) {
-    if (!figmaKey) {
-      this.store.notify('No Figma file key configured for this project', 'warning');
-      return;
-    }
-
-    this.store.set({ figmaFileKey: figmaKey });
-    await this.extractTokens();
-    await this.loadProjects(); // Refresh to get updated last_sync
-  }
-
-  // === Notifications ===
-
-  renderNotifications(notifications) {
-    let container = document.getElementById('notifications');
-    if (!container) {
-      container = document.createElement('div');
-      container.id = 'notifications';
-      container.className = 'notification-container';  // Use CSS class instead of inline styles
-      document.body.appendChild(container);
-    }
-
-    const html = notifications.map(n => {
-      const notificationType = escapeHtml(n.type);
-      const notificationMessage = escapeHtml(n.message);
-      return `
-        <div class="notification notification--${notificationType}">
-          ${notificationMessage}
-        </div>
-      `;
-    }).join('');
-
-    setSafeHtml(container, html);
-  }
-
-  // === Services Page ===
-
-  renderServices() {
-    const teamContext = this.store.get('teamContext') || localStorage.getItem('dss_team_context') || 'all';
-    const tools = toolsService.getToolsByTeam(teamContext);
-    const categories = toolsService.getCategories();
-
-    const teamNames = {
-      'all': 'All Tools',
-      'ui': 'UI Team',
-      'ux': 'UX Team',
-      'qa': 'QA Team'
-    };
-
-    // Group tools by category
-    const toolsByCategory = {};
-    tools.forEach(tool => {
-      if (!toolsByCategory[tool.category]) {
-        toolsByCategory[tool.category] = [];
-      }
-      toolsByCategory[tool.category].push(tool);
-    });
-
-    // Category icons
-    const categoryIcons = {
-      'Projects': '<svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></svg>',
-      'Figma': '<svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z"/><path d="M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z"/><path d="M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z"/><path d="M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z"/><path d="M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z"/></svg>',
-      'Ingestion': '<svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>',
-      'Analysis': '<svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M21 21l-6-6m2-5a7 7 0 1 1-14 0 7 7 0 0 1 14 0z"/></svg>',
-      'Storybook': '<svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></svg>',
-      'Activity': '<svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>'
-    };
-
-    logger.info('UI', 'Rendering services page', { toolCount: tools.length, teamContext, categories });
-
-    return `
-      <div class="page-header">
-        <div class="flex items-center justify-between">
-          <div>
-            <h1>Services</h1>
-            <p class="text-muted">${tools.length} tools available</p>
-          </div>
-          <input type="text" id="toolSearch" placeholder="Search..." class="input" style="width: 200px;" />
-        </div>
-      </div>
-
-      <div id="toolsContainer" class="tools-container">
-        ${categories.map(category => {
-          const categoryTools = toolsByCategory[category] || [];
-          if (categoryTools.length === 0) return '';
-
-          return `
-            <div class="tools-category" data-category="${category}">
-              <div class="tools-category__header">
-                <span class="tools-category__icon">${categoryIcons[category] || '📦'}</span>
-                <span class="tools-category__name">${category}</span>
-                <span class="tools-category__count">${categoryTools.length}</span>
-              </div>
-              <div class="tools-category__list">
-                ${categoryTools.map(tool => this.renderToolCard(tool)).join('')}
-              </div>
-            </div>
-          `;
-        }).join('')}
-      </div>
-
-      <style>
-        .tools-container { display: flex; flex-direction: column; gap: var(--space-4); }
-        .tools-category { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
-        .tools-category__header { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); background: var(--muted); border-bottom: 1px solid var(--border); }
-        .tools-category__icon { color: var(--primary); display: flex; }
-        .tools-category__name { font-weight: var(--font-semibold); flex: 1; }
-        .tools-category__count { font-size: var(--text-xs); color: var(--muted-foreground); background: var(--background); padding: 2px 8px; border-radius: var(--radius-full); }
-        .tools-category__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
-        .tool-item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.15s; }
-        .tool-item:last-child { border-bottom: none; }
-        .tool-item:hover { background: var(--accent); }
-        .tool-item__icon { font-size: 1.25rem; width: 28px; text-align: center; }
-        .tool-item__info { flex: 1; min-width: 0; }
-        .tool-item__name { font-size: var(--text-sm); font-weight: var(--font-medium); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-        .tool-item__desc { font-size: var(--text-xs); color: var(--muted-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-        .tool-item__action { opacity: 0; transition: opacity 0.15s; }
-        .tool-item:hover .tool-item__action { opacity: 1; }
-        .tool-item__params { font-size: 10px; color: var(--muted-foreground); }
-      </style>
-    `;
-  }
-
-  renderToolCard(tool) {
-    return `
-      <div class="tool-item" data-tool="${tool.name}" data-category="${tool.category}" data-action="executeTool" title="${tool.description}">
-        <span class="tool-item__icon">${tool.icon}</span>
-        <div class="tool-item__info">
-          <div class="tool-item__name">${tool.name.replace(/_/g, ' ')}</div>
-          <div class="tool-item__desc">${tool.description}</div>
-        </div>
-        ${tool.parameters.length > 0 ? `<span class="tool-item__params">${tool.parameters.length}p</span>` : ''}
-        <svg class="tool-item__action" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
-      </div>
-    `;
-  }
-
-  // === Quick Wins Page ===
-
-  renderQuickWins() {
-    logger.info('UI', 'Rendering quick wins page');
-
-    return `
-      <div class="page-header">
-        <h1>⚡ Quick Wins</h1>
-        <p class="text-muted">Actionable improvements to empower your team</p>
-      </div>
-
-      <div class="card p-4 mb-6">
-        <div class="flex gap-4">
-          <input
-            type="text"
-            id="projectPath"
-            placeholder="Project path (default: .)"
-            value="."
-            class="input flex-1"
-          />
-          <button
-            class="btn btn-primary"
-            data-action="loadQuickWins"
-          >
-            🔍 Analyze Project
-          </button>
-        </div>
-      </div>
-
-      <div id="quickWinsContainer">
-        <div class="text-center text-muted py-8">
-          <p>Click "Analyze Project" to discover quick wins</p>
-        </div>
-      </div>
-    `;
-  }
-
-  async loadQuickWins() {
-    const path = document.getElementById('projectPath')?.value || '.';
-    const container = document.getElementById('quickWinsContainer');
-
-    if (!container) return;
-
-    logger.info('QuickWins', 'Loading quick wins', { path });
-
-    container.innerHTML = '<div class="text-center py-8">Analyzing project...</div>';
-
-    try {
-      const result = await toolsService.executeTool('get_quick_wins', { path });
-      const data = typeof result === 'string' ? JSON.parse(result) : result;
-
-      logger.info('QuickWins', 'Quick wins loaded', data);
-
-      container.innerHTML = this.renderQuickWinsResults(data);
-    } catch (error) {
-      logger.error('QuickWins', 'Failed to load quick wins', error);
-      container.innerHTML = `
-        <div class="card p-4 bg-destructive/10">
-          <p class="text-destructive">Failed to load quick wins: ${error.message}</p>
-        </div>
-      `;
-    }
-  }
-
-  renderQuickWinsResults(data) {
-    const wins = data.wins || data.quick_wins || [];
-
-    if (wins.length === 0) {
-      return '<div class="card p-4"><p class="text-muted">No quick wins found. Great job!</p></div>';
-    }
-
-    const byPriority = {
-      CRITICAL: wins.filter(w => w.priority === 'CRITICAL'),
-      HIGH: wins.filter(w => w.priority === 'HIGH'),
-      MEDIUM: wins.filter(w => w.priority === 'MEDIUM'),
-      LOW: wins.filter(w => w.priority === 'LOW')
-    };
-
-    return `
-      <div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
-        <div class="card p-4">
-          <div class="stat">
-            <div class="stat__label">Critical</div>
-            <div class="stat__value text-destructive">${byPriority.CRITICAL.length}</div>
-          </div>
-        </div>
-        <div class="card p-4">
-          <div class="stat">
-            <div class="stat__label">High</div>
-            <div class="stat__value text-warning">${byPriority.HIGH.length}</div>
-          </div>
-        </div>
-        <div class="card p-4">
-          <div class="stat">
-            <div class="stat__label">Medium</div>
-            <div class="stat__value">${byPriority.MEDIUM.length}</div>
-          </div>
-        </div>
-        <div class="card p-4">
-          <div class="stat">
-            <div class="stat__label">Low</div>
-            <div class="stat__value text-muted">${byPriority.LOW.length}</div>
-          </div>
-        </div>
-      </div>
-
-      <div class="space-y-4">
-        ${wins.map(win => this.renderQuickWinCard(win)).join('')}
-      </div>
-    `;
-  }
-
-  renderQuickWinCard(win) {
-    const priorityColors = {
-      CRITICAL: 'destructive',
-      HIGH: 'warning',
-      MEDIUM: 'primary',
-      LOW: 'muted'
-    };
-
-    const color = priorityColors[win.priority] || 'muted';
-
-    return `
-      <div class="card p-4">
-        <div class="flex items-start justify-between mb-3">
-          <div>
-            <span class="badge badge-${color}">${win.priority}</span>
-            <span class="badge badge-outline ml-2">${win.type}</span>
-          </div>
-          ${win.effort ? `<span class="text-sm text-muted">Effort: ${win.effort}</span>` : ''}
-        </div>
-
-        <h3 class="text-lg font-semibold mb-2">${win.title}</h3>
-        <p class="text-muted mb-3">${win.description}</p>
-
-        ${win.file ? `
-          <div class="text-sm text-muted mb-3">
-            📄 ${win.file}
-          </div>
-        ` : ''}
-
-        ${win.impact ? `
-          <div class="text-sm mb-3">
-            <span class="text-muted">Impact:</span> ${win.impact}
-          </div>
-        ` : ''}
-
-        <div class="flex gap-2">
-          <button class="btn btn-sm btn-primary" data-action="investigateWin" data-win-id="${win.id || Math.random()}">
-            🔍 Investigate
-          </button>
-          <button class="btn btn-sm btn-outline" data-action="markDone" data-win-id="${win.id || Math.random()}">
-            ✓ Mark Done
-          </button>
-        </div>
-      </div>
-    `;
-  }
-
-  // === Claude Chat Page ===
-
-  renderChat() {
-    const history = claudeService.getHistory();
-    const selectedModel = this.store.get('selectedAIModel') || 'claude';
-
-    logger.info('UI', 'Rendering chat page', { historyLength: history.length, model: selectedModel });
-
-    return `
-      <div class="page-header">
-        <div class="flex items-center justify-between">
-          <div>
-            <h1>💬 AI Assistant</h1>
-            <p class="text-muted">Ask questions about your design system</p>
-          </div>
-          <div class="flex gap-2">
-            <select
-              id="aiModelSelect"
-              class="select select-sm"
-              data-action="changeAIModel"
-              style="padding: 4px 8px; border: 1px solid var(--border); border-radius: 4px; background: var(--background);"
-            >
-              <option value="claude" ${selectedModel === 'claude' ? 'selected' : ''}>🤖 Claude</option>
-              <option value="gemini" ${selectedModel === 'gemini' ? 'selected' : ''}>✨ Gemini</option>
-            </select>
-            <button
-              class="btn btn-outline btn-sm"
-              data-action="exportChat"
-            >
-              📥 Export
-            </button>
-            <button
-              class="btn btn-outline btn-sm"
-              data-action="clearChat"
-            >
-              🗑️ Clear
-            </button>
-          </div>
-        </div>
-      </div>
-
-      <div class="card flex flex-col" style="height: calc(100vh - 200px);">
-        <!-- Chat messages -->
-        <div id="chatMessages" class="flex-1 overflow-y-auto p-4 space-y-4">
-          ${history.length === 0 ? `
-            <div class="text-center text-muted py-12">
-              <p class="text-lg mb-2">👋 Hi! I'm Claude</p>
-              <p>Ask me anything about your design system, tokens, or code</p>
-            </div>
-          ` : history.map(msg => this.renderChatMessage(msg)).join('')}
-        </div>
-
-        <!-- Input form -->
-        <div class="border-t p-4">
-          <form id="chatForm" class="flex gap-2">
-            <input
-              type="text"
-              id="chatInput"
-              placeholder="Ask Claude something..."
-              class="input flex-1"
-              autocomplete="off"
-            />
-            <button
-              type="submit"
-              class="btn btn-primary"
-              data-action="sendChatMessage"
-            >
-              Send
-            </button>
-          </form>
-        </div>
-      </div>
-    `;
-  }
-
-  renderChatMessage(msg) {
-    const isUser = msg.role === 'user';
-    const bgColor = isUser ? 'bg-primary/10' : 'bg-card';
-    const align = isUser ? 'ml-auto' : '';
-    const icon = isUser ? '👤' : '🤖';
-
-    return `
-      <div class="flex ${isUser ? 'justify-end' : 'justify-start'}">
-        <div class="${bgColor} rounded-lg p-4 max-w-[80%] ${align}">
-          <div class="flex items-center gap-2 mb-2">
-            <span>${icon}</span>
-            <span class="text-sm font-medium">${isUser ? 'You' : 'Claude'}</span>
-            <span class="text-xs text-muted">${this.formatTime(msg.timestamp)}</span>
-          </div>
-          <div class="text-sm whitespace-pre-wrap">${this.escapeHtml(msg.content)}</div>
-        </div>
-      </div>
-    `;
-  }
-
-  async sendChatMessage(e) {
-    if (e) e.preventDefault();
-
-    const input = document.getElementById('chatInput');
-    const message = input?.value.trim();
-
-    if (!message) return;
-
-    logger.info('Chat', 'Sending message', { message });
-
-    // Clear input
-    input.value = '';
-
-    // Add user message to UI immediately
-    const messagesContainer = document.getElementById('chatMessages');
-    if (messagesContainer) {
-      messagesContainer.innerHTML += this.renderChatMessage({
-        role: 'user',
-        content: message,
-        timestamp: new Date().toISOString()
-      });
-
-      // Add loading indicator
-      messagesContainer.innerHTML += `
-        <div id="chatLoading" class="flex justify-start">
-          <div class="bg-card rounded-lg p-4">
-            <div class="flex items-center gap-2">
-              <span>🤖</span>
-              <span class="text-sm">Claude is typing...</span>
-            </div>
-          </div>
-        </div>
-      `;
-
-      // Scroll to bottom
-      messagesContainer.scrollTop = messagesContainer.scrollHeight;
-    }
-
-    try {
-      const response = await claudeService.chat(message, {
-        project: this.store.get('currentProject'),
-        page: 'chat'
-      });
-
-      // Remove loading indicator
-      document.getElementById('chatLoading')?.remove();
-
-      // Add Claude's response
-      if (messagesContainer) {
-        messagesContainer.innerHTML += this.renderChatMessage({
-          role: 'assistant',
-          content: response,
-          timestamp: new Date().toISOString()
-        });
-
-        messagesContainer.scrollTop = messagesContainer.scrollHeight;
-      }
-    } catch (error) {
-      logger.error('Chat', 'Failed to send message', error);
-
-      document.getElementById('chatLoading')?.remove();
-
-      if (messagesContainer) {
-        messagesContainer.innerHTML += `
-          <div class="flex justify-start">
-            <div class="bg-destructive/10 rounded-lg p-4">
-              <div class="text-destructive text-sm">
-                ❌ Failed to get response: ${error.message}
-              </div>
-            </div>
-          </div>
-        `;
-      }
-
-      this.store.notify(`Chat error: ${error.message}`, 'error');
-    }
-  }
-
-  // === Tool Execution Actions ===
-
-  async executeToolWithParams(toolName) {
-    logger.info('ToolExecution', `Preparing to execute ${toolName}`);
-
-    const tool = toolsService.toolsMetadata[toolName];
-    if (!tool) {
-      logger.error('ToolExecution', `Tool not found: ${toolName}`);
-      return;
-    }
-
-    // For simple tools with no required params, execute directly
-    if (tool.parameters.length === 0) {
-      try {
-        this.store.notify(`Executing ${toolName}...`, 'info');
-        const result = await toolsService.executeTool(toolName, {});
-        logger.info('ToolExecution', `Tool ${toolName} completed`, result);
-        this.store.notify(`${toolName} completed successfully`, 'success');
-        this.render();
-      } catch (error) {
-        logger.error('ToolExecution', `Tool ${toolName} failed`, error);
-        this.store.notify(`${toolName} failed: ${error.message}`, 'error');
-      }
-      return;
-    }
-
-    // TODO: For tools with parameters, show a modal to collect params
-    this.store.notify(`${toolName} requires parameters. Parameter input UI coming soon.`, 'info');
-  }
-
-  filterTools(searchTerm, category) {
-    const cards = document.querySelectorAll('.tool-card');
-    const search = searchTerm.toLowerCase();
-
-    cards.forEach(card => {
-      const toolName = card.dataset.tool?.toLowerCase() || '';
-      const toolCategory = card.dataset.category || '';
-
-      const matchesSearch = !search || toolName.includes(search);
-      const matchesCategory = !category || toolCategory === category;
-
-      card.style.display = (matchesSearch && matchesCategory) ? 'block' : 'none';
-    });
-  }
-
-  investigateWin(winId) {
-    logger.info('QuickWins', `Investigating win: ${winId}`);
-    this.store.notify('Investigation feature coming soon', 'info');
-  }
-
-  markWinDone(winId) {
-    logger.info('QuickWins', `Marking win as done: ${winId}`);
-    this.store.notify('Win marked as done', 'success');
-    // TODO: Persist to backend
-  }
-
-  // === Team Dashboard Actions ===
-
-  async addFigmaFile(figmaData) {
-    const projectId = this.store.get('currentProject');
-    if (!projectId) {
-      this.store.notify('Please select a project first', 'warning');
-      return;
-    }
-
-    try {
-      const result = await DashboardService.addFigmaFile(projectId, figmaData);
-      this.store.notify('Figma file added successfully', 'success');
-      await this.loadDashboardData(projectId);
-    } catch (error) {
-      this.store.notify(`Failed to add Figma file: ${error.message}`, 'error');
-    }
-  }
-
-  async deleteFigmaFile(fileId) {
-    const projectId = this.store.get('currentProject');
-    if (!projectId) return;
-
-    try {
-      await DashboardService.deleteFigmaFile(projectId, fileId);
-      this.store.notify('Figma file deleted', 'success');
-      await this.loadDashboardData(projectId);
-    } catch (error) {
-      this.store.notify(`Failed to delete Figma file: ${error.message}`, 'error');
-    }
-  }
-
-  async syncFigmaFile(fileId) {
-    const projectId = this.store.get('currentProject');
-    if (!projectId) return;
-
-    try {
-      await DashboardService.updateFigmaFileSync(projectId, fileId, 'syncing');
-      this.store.notify('Syncing Figma file...', 'info');
-      // TODO: Implement actual sync logic
-      setTimeout(async () => {
-        await DashboardService.updateFigmaFileSync(projectId, fileId, 'success');
-        this.store.notify('Figma file synced successfully', 'success');
-        await this.loadDashboardData(projectId);
-      }, 2000);
-    } catch (error) {
-      this.store.notify(`Failed to sync Figma file: ${error.message}`, 'error');
-    }
-  }
-
-  async addESREDefinition(esreData) {
-    const projectId = this.store.get('currentProject');
-    if (!projectId) {
-      this.store.notify('Please select a project first', 'warning');
-      return;
-    }
-
-    try {
-      const result = await DashboardService.createESREDefinition(projectId, esreData);
-      this.store.notify('ESRE definition added successfully', 'success');
-      await this.loadDashboardData(projectId);
-    } catch (error) {
-      this.store.notify(`Failed to add ESRE definition: ${error.message}`, 'error');
-    }
-  }
-
-  // === Utilities ===
-
-  escapeHtml(text) {
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-
-  formatTime(timestamp) {
-    const date = new Date(timestamp);
-    const now = new Date();
-    const diff = now - date;
-
-    if (diff < 60000) return 'Just now';
-    if (diff < 3600000) return `${Math.floor(diff / 60000)}m ago`;
-    if (diff < 86400000) return `${Math.floor(diff / 3600000)}h ago`;
-    return date.toLocaleDateString();
-  }
-
-  /**
-   * Update Storybook link with configured URL
-   * Called on init and when settings are saved
-   */
-  updateStorybookLink() {
-    const link = document.getElementById('storybook-link');
-    if (!link) return;
-
-    try {
-      // Get Storybook URL from server config (loaded from /api/config)
-      const storybookUrl = getStorybookUrl();
-
-      link.href = storybookUrl;
-      link.style.pointerEvents = 'auto';
-      link.style.opacity = '1';
-      link.title = `Open Storybook at ${storybookUrl}`;
-    } catch (error) {
-      // Config not loaded yet or error occurred
-      link.style.pointerEvents = 'none';
-      link.style.opacity = '0.5';
-      link.removeAttribute('href');
-      link.title = 'Storybook URL not available';
-      logger.warn('App', 'Could not update Storybook link', { error: error.message });
-    }
-  }
-}
-
-// Global instance
-const app = new App();
-
-export default app;
diff --git a/admin-ui/js/core/audit-logger.js b/admin-ui/js/core/audit-logger.js
deleted file mode 100644
index 473900d..0000000
--- a/admin-ui/js/core/audit-logger.js
+++ /dev/null
@@ -1,272 +0,0 @@
-/**
- * Audit Logger - Phase 8 Enterprise Pattern
- *
- * Tracks all state changes, user actions, and workflow transitions
- * for compliance, debugging, and analytics.
- */
-
-class AuditLogger {
-  constructor() {
-    this.logs = [];
-    this.maxLogs = 1000;
-    this.storageKey = 'dss-audit-logs';
-    this.sessionId = this.generateSessionId();
-    this.logLevel = 'info'; // 'debug', 'info', 'warn', 'error'
-    this.loadFromStorage();
-  }
-
-  /**
-   * Generate unique session ID
-   */
-  generateSessionId() {
-    return `session-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-  }
-
-  /**
-   * Create audit log entry
-   */
-  createLogEntry(action, category, details = {}, level = 'info') {
-    return {
-      id: `log-${Date.now()}-${Math.random().toString(36).substr(2, 5)}`,
-      timestamp: new Date().toISOString(),
-      sessionId: this.sessionId,
-      action,
-      category,
-      level,
-      details,
-      userAgent: navigator.userAgent,
-    };
-  }
-
-  /**
-   * Log user action
-   */
-  logAction(action, details = {}) {
-    const entry = this.createLogEntry(action, 'user_action', details, 'info');
-    this.addLog(entry);
-    return entry.id;
-  }
-
-  /**
-   * Log state change
-   */
-  logStateChange(key, oldValue, newValue, details = {}) {
-    const entry = this.createLogEntry(
-      `state_change`,
-      'state',
-      {
-        key,
-        oldValue: this.sanitize(oldValue),
-        newValue: this.sanitize(newValue),
-        ...details
-      },
-      'info'
-    );
-    this.addLog(entry);
-    return entry.id;
-  }
-
-  /**
-   * Log API call
-   */
-  logApiCall(method, endpoint, status, responseTime = 0, details = {}) {
-    const entry = this.createLogEntry(
-      `api_${method.toLowerCase()}`,
-      'api',
-      {
-        endpoint,
-        method,
-        status,
-        responseTime,
-        ...details
-      },
-      status >= 400 ? 'warn' : 'info'
-    );
-    this.addLog(entry);
-    return entry.id;
-  }
-
-  /**
-   * Log error
-   */
-  logError(error, context = '') {
-    const entry = this.createLogEntry(
-      'error',
-      'error',
-      {
-        message: error.message,
-        stack: error.stack,
-        context
-      },
-      'error'
-    );
-    this.addLog(entry);
-    console.error('[AuditLogger]', error);
-    return entry.id;
-  }
-
-  /**
-   * Log warning
-   */
-  logWarning(message, details = {}) {
-    const entry = this.createLogEntry(
-      'warning',
-      'warning',
-      { message, ...details },
-      'warn'
-    );
-    this.addLog(entry);
-    return entry.id;
-  }
-
-  /**
-   * Log permission check
-   */
-  logPermissionCheck(action, allowed, user, reason = '') {
-    const entry = this.createLogEntry(
-      'permission_check',
-      'security',
-      {
-        action,
-        allowed,
-        user,
-        reason
-      },
-      allowed ? 'info' : 'warn'
-    );
-    this.addLog(entry);
-    return entry.id;
-  }
-
-  /**
-   * Add log entry to collection
-   */
-  addLog(entry) {
-    this.logs.unshift(entry);
-    if (this.logs.length > this.maxLogs) {
-      this.logs.pop();
-    }
-    this.saveToStorage();
-  }
-
-  /**
-   * Sanitize sensitive data before logging
-   */
-  sanitize(value) {
-    if (typeof value !== 'object') return value;
-
-    const sanitized = { ...value };
-    const sensitiveKeys = ['password', 'token', 'apiKey', 'secret', 'key'];
-
-    for (const key of Object.keys(sanitized)) {
-      if (sensitiveKeys.some(sk => key.toLowerCase().includes(sk))) {
-        sanitized[key] = '***REDACTED***';
-      }
-    }
-
-    return sanitized;
-  }
-
-  /**
-   * Get logs filtered by criteria
-   */
-  getLogs(filters = {}) {
-    let result = [...this.logs];
-
-    if (filters.action) {
-      result = result.filter(l => l.action === filters.action);
-    }
-    if (filters.category) {
-      result = result.filter(l => l.category === filters.category);
-    }
-    if (filters.level) {
-      result = result.filter(l => l.level === filters.level);
-    }
-    if (filters.startTime) {
-      result = result.filter(l => new Date(l.timestamp) >= new Date(filters.startTime));
-    }
-    if (filters.endTime) {
-      result = result.filter(l => new Date(l.timestamp) <= new Date(filters.endTime));
-    }
-    if (filters.sessionId) {
-      result = result.filter(l => l.sessionId === filters.sessionId);
-    }
-    if (filters.limit) {
-      result = result.slice(0, filters.limit);
-    }
-
-    return result;
-  }
-
-  /**
-   * Get statistics
-   */
-  getStats() {
-    return {
-      totalLogs: this.logs.length,
-      sessionId: this.sessionId,
-      byCategory: this.logs.reduce((acc, log) => {
-        acc[log.category] = (acc[log.category] || 0) + 1;
-        return acc;
-      }, {}),
-      byLevel: this.logs.reduce((acc, log) => {
-        acc[log.level] = (acc[log.level] || 0) + 1;
-        return acc;
-      }, {}),
-      oldestLog: this.logs[this.logs.length - 1]?.timestamp,
-      newestLog: this.logs[0]?.timestamp,
-    };
-  }
-
-  /**
-   * Export logs as JSON
-   */
-  exportLogs(filters = {}) {
-    const logs = this.getLogs(filters);
-    return JSON.stringify({
-      exportDate: new Date().toISOString(),
-      sessionId: this.sessionId,
-      count: logs.length,
-      logs
-    }, null, 2);
-  }
-
-  /**
-   * Clear all logs
-   */
-  clearLogs() {
-    this.logs = [];
-    this.saveToStorage();
-  }
-
-  /**
-   * Save logs to localStorage
-   */
-  saveToStorage() {
-    try {
-      localStorage.setItem(this.storageKey, JSON.stringify(this.logs));
-    } catch (e) {
-      console.warn('[AuditLogger] Failed to save to storage:', e);
-    }
-  }
-
-  /**
-   * Load logs from localStorage
-   */
-  loadFromStorage() {
-    try {
-      const stored = localStorage.getItem(this.storageKey);
-      if (stored) {
-        this.logs = JSON.parse(stored);
-      }
-    } catch (e) {
-      console.warn('[AuditLogger] Failed to load from storage:', e);
-    }
-  }
-}
-
-// Create and export singleton
-const auditLogger = new AuditLogger();
-
-export { AuditLogger };
-export default auditLogger;
diff --git a/admin-ui/js/core/browser-logger.js b/admin-ui/js/core/browser-logger.js
deleted file mode 100644
index e37b2b8..0000000
--- a/admin-ui/js/core/browser-logger.js
+++ /dev/null
@@ -1,756 +0,0 @@
-/**
- * Browser Logger - Captures all browser-side activity
- *
- * Records:
- * - Console logs (log, warn, error, info, debug)
- * - Uncaught errors and exceptions
- * - Network requests (via fetch/XMLHttpRequest)
- * - Performance metrics
- * - Memory usage
- * - User interactions
- *
- * Can be exported to server or retrieved from sessionStorage
- */
-
-class BrowserLogger {
-  constructor(maxEntries = 1000) {
-    this.maxEntries = maxEntries;
-    this.entries = [];
-    this.startTime = Date.now();
-    this.sessionId = this.generateSessionId();
-    this.lastSyncedIndex = 0; // Track which logs have been sent to server
-    this.autoSyncInterval = 30000; // 30 seconds
-    this.apiEndpoint = '/api/browser-logs';
-    this.lastUrl = window.location.href; // Track URL for navigation detection
-
-    // Storage key for persistence across page reloads
-    this.storageKey = `dss-browser-logs-${this.sessionId}`;
-
-    // Core Web Vitals tracking
-    this.lcp = null;  // Largest Contentful Paint
-    this.cls = 0;     // Cumulative Layout Shift
-    this.axeLoadingPromise = null;  // Promise for axe-core script loading
-
-    // Try to load existing logs
-    this.loadFromStorage();
-
-    // Start capturing
-    this.captureConsole();
-    this.captureErrors();
-    this.captureNetworkActivity();
-    this.capturePerformance();
-    this.captureMemory();
-    this.captureWebVitals();
-
-    // Initialize Shadow State capture
-    this.setupSnapshotCapture();
-
-    // Start auto-sync to server
-    this.startAutoSync();
-  }
-
-  /**
-   * Generate unique session ID
-   */
-  generateSessionId() {
-    return `session-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-  }
-
-  /**
-   * Add log entry
-   */
-  log(level, category, message, data = {}) {
-    const entry = {
-      timestamp: Date.now(),
-      relativeTime: Date.now() - this.startTime,
-      level,
-      category,
-      message,
-      data,
-      url: window.location.href,
-      userAgent: navigator.userAgent,
-    };
-
-    this.entries.push(entry);
-
-    // Keep size manageable
-    if (this.entries.length > this.maxEntries) {
-      this.entries.shift();
-    }
-
-    // Persist to storage
-    this.saveToStorage();
-
-    return entry;
-  }
-
-  /**
-   * Capture console methods
-   */
-  captureConsole() {
-    const originalLog = console.log;
-    const originalError = console.error;
-    const originalWarn = console.warn;
-    const originalInfo = console.info;
-    const originalDebug = console.debug;
-
-    console.log = (...args) => {
-      this.log('log', 'console', args.join(' '), { args });
-      originalLog.apply(console, args);
-    };
-
-    console.error = (...args) => {
-      this.log('error', 'console', args.join(' '), { args });
-      originalError.apply(console, args);
-    };
-
-    console.warn = (...args) => {
-      this.log('warn', 'console', args.join(' '), { args });
-      originalWarn.apply(console, args);
-    };
-
-    console.info = (...args) => {
-      this.log('info', 'console', args.join(' '), { args });
-      originalInfo.apply(console, args);
-    };
-
-    console.debug = (...args) => {
-      this.log('debug', 'console', args.join(' '), { args });
-      originalDebug.apply(console, args);
-    };
-  }
-
-  /**
-   * Capture uncaught errors
-   */
-  captureErrors() {
-    // Unhandled promise rejections
-    window.addEventListener('unhandledrejection', (event) => {
-      this.log('error', 'unhandledRejection', event.reason?.message || String(event.reason), {
-        reason: event.reason,
-        stack: event.reason?.stack,
-      });
-    });
-
-    // Global error handler
-    window.addEventListener('error', (event) => {
-      this.log('error', 'uncaughtError', event.message, {
-        filename: event.filename,
-        lineno: event.lineno,
-        colno: event.colno,
-        stack: event.error?.stack,
-      });
-    });
-  }
-
-  /**
-   * Capture network activity using PerformanceObserver
-   * This is non-invasive and doesn't monkey-patch fetch or XMLHttpRequest
-   */
-  captureNetworkActivity() {
-    // Use PerformanceObserver to monitor network requests (modern approach)
-    if ('PerformanceObserver' in window) {
-      try {
-        const observer = new PerformanceObserver((list) => {
-          for (const entry of list.getEntries()) {
-            // resource entries are generated automatically for fetch/xhr
-            if (entry.initiatorType === 'fetch' || entry.initiatorType === 'xmlhttprequest') {
-              const method = entry.name.split('?')[0]; // Extract method from name if available
-
-              this.log('network', entry.initiatorType, `${entry.initiatorType.toUpperCase()} ${entry.name}`, {
-                url: entry.name,
-                initiatorType: entry.initiatorType,
-                duration: entry.duration,
-                transferSize: entry.transferSize,
-                encodedBodySize: entry.encodedBodySize,
-                decodedBodySize: entry.decodedBodySize,
-              });
-            }
-          }
-        });
-
-        // Observe resource entries (includes fetch/xhr)
-        observer.observe({ entryTypes: ['resource'] });
-      } catch (e) {
-        // PerformanceObserver might not support resource entries in some browsers
-        // Gracefully degrade - network logging simply won't work
-      }
-    }
-  }
-
-  /**
-   * Capture performance metrics
-   */
-  capturePerformance() {
-    // Wait for page load
-    window.addEventListener('load', () => {
-      setTimeout(() => {
-        try {
-          const perfData = window.performance.getEntriesByType('navigation')[0];
-          if (perfData) {
-            this.log('metric', 'performance', 'Page load completed', {
-              domContentLoaded: perfData.domContentLoadedEventEnd - perfData.domContentLoadedEventStart,
-              loadComplete: perfData.loadEventEnd - perfData.loadEventStart,
-              totalTime: perfData.loadEventEnd - perfData.fetchStart,
-              dnsLookup: perfData.domainLookupEnd - perfData.domainLookupStart,
-              tcpConnection: perfData.connectEnd - perfData.connectStart,
-              requestTime: perfData.responseStart - perfData.requestStart,
-              responseTime: perfData.responseEnd - perfData.responseStart,
-              renderTime: perfData.domInteractive - perfData.domLoading,
-            });
-          }
-        } catch (e) {
-          // Performance API might not be available
-        }
-      }, 0);
-    });
-
-    // Monitor long tasks
-    if ('PerformanceObserver' in window) {
-      try {
-        const observer = new PerformanceObserver((list) => {
-          for (const entry of list.getEntries()) {
-            if (entry.duration > 50) {
-              // Log tasks that take >50ms
-              this.log('metric', 'longTask', 'Long task detected', {
-                name: entry.name,
-                duration: entry.duration,
-                startTime: entry.startTime,
-              });
-            }
-          }
-        });
-        observer.observe({ entryTypes: ['longtask'] });
-      } catch (e) {
-        // Long task API might not be available
-      }
-    }
-  }
-
-  /**
-   * Capture memory usage
-   */
-  captureMemory() {
-    if ('memory' in performance) {
-      // Check memory every 10 seconds
-      setInterval(() => {
-        const memory = performance.memory;
-        const usagePercent = (memory.usedJSHeapSize / memory.jsHeapSizeLimit) * 100;
-
-        if (usagePercent > 80) {
-          this.log('warn', 'memory', 'High memory usage detected', {
-            usedJSHeapSize: memory.usedJSHeapSize,
-            jsHeapSizeLimit: memory.jsHeapSizeLimit,
-            usagePercent: usagePercent.toFixed(2),
-          });
-        }
-      }, 10000);
-    }
-  }
-
-  /**
-   * Capture Core Web Vitals (LCP, CLS) using PerformanceObserver
-   * These observers run in the background to collect metrics as they occur.
-   */
-  captureWebVitals() {
-    try {
-      // Capture Largest Contentful Paint (LCP)
-      const lcpObserver = new PerformanceObserver((entryList) => {
-        const entries = entryList.getEntries();
-        if (entries.length > 0) {
-          // The last entry is the most recent LCP candidate
-          this.lcp = entries[entries.length - 1].startTime;
-        }
-      });
-      lcpObserver.observe({ type: 'largest-contentful-paint', buffered: true });
-
-      // Capture Cumulative Layout Shift (CLS)
-      const clsObserver = new PerformanceObserver((entryList) => {
-        for (const entry of entryList.getEntries()) {
-          // Only count shifts that were not caused by recent user input.
-          if (!entry.hadRecentInput) {
-            this.cls += entry.value;
-          }
-        }
-      });
-      clsObserver.observe({ type: 'layout-shift', buffered: true });
-    } catch (e) {
-      this.log('warn', 'performance', 'Could not initialize Web Vitals observers.', { error: e.message });
-    }
-  }
-
-  /**
-   * Get Core Web Vitals and other key performance metrics.
-   * Retrieves metrics collected by observers or from the Performance API.
-   * @returns {object} An object containing the collected metrics.
-   */
-  getCoreWebVitals() {
-    try {
-      const navEntry = window.performance.getEntriesByType('navigation')[0];
-      const paintEntries = window.performance.getEntriesByType('paint');
-
-      const fcpEntry = paintEntries.find(e => e.name === 'first-contentful-paint');
-      const ttfb = navEntry ? navEntry.responseStart - navEntry.requestStart : null;
-
-      return {
-        ttfb: ttfb,
-        fcp: fcpEntry ? fcpEntry.startTime : null,
-        lcp: this.lcp,
-        cls: this.cls,
-      };
-    } catch (e) {
-      return { error: 'Failed to retrieve Web Vitals.' };
-    }
-  }
-
-  /**
-   * Dynamically injects and runs an axe-core accessibility audit.
-   * @returns {Promise<object|null>} A promise that resolves with the axe audit results.
-   */
-  async runAxeAudit() {
-    // Check if axe is already available
-    if (typeof window.axe === 'undefined') {
-      // If not, and we are not already loading it, inject it
-      if (!this.axeLoadingPromise) {
-        this.axeLoadingPromise = new Promise((resolve, reject) => {
-          const script = document.createElement('script');
-          script.src = 'https://cdnjs.cloudflare.com/ajax/libs/axe-core/4.8.4/axe.min.js';
-          script.onload = () => {
-            this.log('info', 'accessibility', 'axe-core loaded successfully.');
-            resolve();
-          };
-          script.onerror = () => {
-            this.log('error', 'accessibility', 'Failed to load axe-core script.');
-            this.axeLoadingPromise = null; // Allow retry
-            reject(new Error('Failed to load axe-core.'));
-          };
-          document.head.appendChild(script);
-        });
-      }
-      await this.axeLoadingPromise;
-    }
-
-    try {
-      // Configure axe to run on the entire document
-      const results = await window.axe.run(document.body);
-      this.log('metric', 'accessibility', 'Accessibility audit completed.', {
-        violations: results.violations.length,
-        passes: results.passes.length,
-        incomplete: results.incomplete.length,
-        results, // Store full results
-      });
-      return results;
-    } catch (error) {
-      this.log('error', 'accessibility', 'Error running axe audit.', { error: error.message });
-      return null;
-    }
-  }
-
-  /**
-   * Captures a comprehensive snapshot including DOM, accessibility, and performance data.
-   * @returns {Promise<void>}
-   */
-  async captureAccessibilitySnapshot() {
-    const domSnapshot = await this.captureDOMSnapshot();
-    const accessibility = await this.runAxeAudit();
-    const performance = this.getCoreWebVitals();
-
-    this.log('metric', 'accessibilitySnapshot', 'Full accessibility snapshot captured.', {
-      snapshot: domSnapshot,
-      accessibility,
-      performance,
-    });
-
-    return { snapshot: domSnapshot, accessibility, performance };
-  }
-
-  /**
-   * Save logs to sessionStorage
-   */
-  saveToStorage() {
-    try {
-      const data = {
-        sessionId: this.sessionId,
-        entries: this.entries,
-        savedAt: Date.now(),
-      };
-      sessionStorage.setItem(this.storageKey, JSON.stringify(data));
-    } catch (e) {
-      // Storage might be full or unavailable
-    }
-  }
-
-  /**
-   * Load logs from sessionStorage
-   */
-  loadFromStorage() {
-    try {
-      const data = sessionStorage.getItem(this.storageKey);
-      if (data) {
-        const parsed = JSON.parse(data);
-        this.entries = parsed.entries || [];
-      }
-    } catch (e) {
-      // Storage might be unavailable
-    }
-  }
-
-  /**
-   * Get all logs
-   */
-  getLogs(options = {}) {
-    let entries = [...this.entries];
-
-    // Filter by level
-    if (options.level) {
-      entries = entries.filter(e => e.level === options.level);
-    }
-
-    // Filter by category
-    if (options.category) {
-      entries = entries.filter(e => e.category === options.category);
-    }
-
-    // Filter by time range
-    if (options.minTime) {
-      entries = entries.filter(e => e.timestamp >= options.minTime);
-    }
-
-    if (options.maxTime) {
-      entries = entries.filter(e => e.timestamp <= options.maxTime);
-    }
-
-    // Search in message
-    if (options.search) {
-      const searchLower = options.search.toLowerCase();
-      entries = entries.filter(e =>
-        e.message.toLowerCase().includes(searchLower) ||
-        JSON.stringify(e.data).toLowerCase().includes(searchLower)
-      );
-    }
-
-    // Limit results
-    const limit = options.limit || 100;
-    if (options.reverse) {
-      entries.reverse();
-    }
-
-    return entries.slice(-limit);
-  }
-
-  /**
-   * Get errors only
-   */
-  getErrors() {
-    return this.getLogs({ level: 'error', limit: 50, reverse: true });
-  }
-
-  /**
-   * Get network requests
-   */
-  getNetworkRequests() {
-    return this.getLogs({ category: 'fetch', limit: 100, reverse: true });
-  }
-
-  /**
-   * Get metrics
-   */
-  getMetrics() {
-    return this.getLogs({ category: 'metric', limit: 100, reverse: true });
-  }
-
-  /**
-   * Get diagnostic summary
-   */
-  getDiagnostic() {
-    return {
-      sessionId: this.sessionId,
-      uptime: Date.now() - this.startTime,
-      totalLogs: this.entries.length,
-      errorCount: this.entries.filter(e => e.level === 'error').length,
-      warnCount: this.entries.filter(e => e.level === 'warn').length,
-      networkRequests: this.entries.filter(e => e.category === 'fetch').length,
-      memory: performance.memory ? {
-        usedJSHeapSize: performance.memory.usedJSHeapSize,
-        jsHeapSizeLimit: performance.memory.jsHeapSizeLimit,
-        usagePercent: ((performance.memory.usedJSHeapSize / performance.memory.jsHeapSizeLimit) * 100).toFixed(2),
-      } : null,
-      url: window.location.href,
-      userAgent: navigator.userAgent,
-      recentErrors: this.getErrors().slice(0, 5),
-      recentNetworkRequests: this.getNetworkRequests().slice(0, 5),
-    };
-  }
-
-  /**
-   * Export logs as JSON
-   */
-  exportJSON() {
-    return {
-      sessionId: this.sessionId,
-      exportedAt: new Date().toISOString(),
-      logs: this.entries,
-      diagnostic: this.getDiagnostic(),
-    };
-  }
-
-  /**
-   * Print formatted logs to console
-   */
-  printFormatted(options = {}) {
-    const logs = this.getLogs(options);
-
-    console.group(`📋 Browser Logs (${logs.length} entries)`);
-    console.table(logs.map(e => ({
-      Time: new Date(e.timestamp).toLocaleTimeString(),
-      Level: e.level.toUpperCase(),
-      Category: e.category,
-      Message: e.message,
-    })));
-    console.groupEnd();
-  }
-
-  /**
-   * Clear logs
-   */
-  clear() {
-    this.entries = [];
-    this.lastSyncedIndex = 0;
-    this.saveToStorage();
-  }
-
-  /**
-   * Start auto-sync to server
-   */
-  startAutoSync() {
-    // Sync immediately on startup (after a delay to let the page load)
-    setTimeout(() => this.syncToServer(), 5000);
-
-    // Then sync every 30 seconds
-    this.syncTimer = setInterval(() => this.syncToServer(), this.autoSyncInterval);
-
-    // Sync before page unload
-    window.addEventListener('beforeunload', () => this.syncToServer());
-  }
-
-  /**
-   * Sync logs to server
-   */
-  async syncToServer() {
-    // Only sync if there are new logs
-    if (this.lastSyncedIndex >= this.entries.length) {
-      return;
-    }
-
-    try {
-      const data = this.exportJSON();
-      const response = await fetch(this.apiEndpoint, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(data),
-      });
-
-      if (response.ok) {
-        this.lastSyncedIndex = this.entries.length;
-        console.debug(`[BrowserLogger] Synced ${this.entries.length} logs to server`);
-      } else {
-        console.warn(`[BrowserLogger] Failed to sync logs: ${response.statusText}`);
-      }
-    } catch (error) {
-      console.warn('[BrowserLogger] Failed to sync logs:', error.message);
-    }
-  }
-
-  /**
-   * Stop auto-sync
-   */
-  stopAutoSync() {
-    if (this.syncTimer) {
-      clearInterval(this.syncTimer);
-      this.syncTimer = null;
-    }
-  }
-
-  /**
-   * Capture DOM Snapshot (Shadow State)
-   * Returns the current state of the DOM and viewport for remote debugging.
-   * Can optionally include accessibility and performance data.
-   * @param {object} [options={}] - Options for the snapshot.
-   * @param {boolean} [options.includeAccessibility=false] - Whether to run an axe audit.
-   * @param {boolean} [options.includePerformance=false] - Whether to include Core Web Vitals.
-   * @returns {Promise<object>} A promise that resolves with the snapshot data.
-   */
-  async captureDOMSnapshot(options = {}) {
-    const snapshot = {
-      timestamp: Date.now(),
-      url: window.location.href,
-      html: document.documentElement.outerHTML,
-      viewport: {
-        width: window.innerWidth,
-        height: window.innerHeight,
-        devicePixelRatio: window.devicePixelRatio,
-      },
-      title: document.title,
-    };
-
-    if (options.includeAccessibility) {
-      snapshot.accessibility = await this.runAxeAudit();
-    }
-
-    if (options.includePerformance) {
-      snapshot.performance = this.getCoreWebVitals();
-    }
-
-    return snapshot;
-  }
-
-  /**
-   * Setup Shadow State Capture
-   * Monitors navigation and errors to create state checkpoints.
-   */
-  setupSnapshotCapture() {
-    // Helper to capture state and log it.
-    const handleSnapshot = async (trigger, details) => {
-      try {
-        const snapshot = await this.captureDOMSnapshot();
-        this.log(details.level || 'info', 'snapshot', `State Capture (${trigger})`, {
-          trigger,
-          details,
-          snapshot,
-        });
-
-        // If it was a critical error, attempt to flush logs immediately.
-        if (details.level === 'error') {
-          this.flushViaBeacon();
-        }
-      } catch (e) {
-        this.log('error', 'snapshot', 'Failed to capture snapshot.', { error: e.message });
-      }
-    };
-
-    // 1. Capture on Navigation (Periodic check for SPA support)
-    setInterval(async () => {
-      const currentUrl = window.location.href;
-      if (currentUrl !== this.lastUrl) {
-        const previousUrl = this.lastUrl;
-        this.lastUrl = currentUrl;
-        await handleSnapshot('navigation', { from: previousUrl, to: currentUrl });
-      }
-    }, 1000);
-
-    // 2. Capture on Critical Errors
-    window.addEventListener('error', (event) => {
-      handleSnapshot('uncaughtError', {
-        level: 'error',
-        error: {
-          message: event.message,
-          filename: event.filename,
-          lineno: event.lineno,
-        },
-      });
-    });
-
-    window.addEventListener('unhandledrejection', (event) => {
-      handleSnapshot('unhandledRejection', {
-        level: 'error',
-        error: {
-          reason: event.reason?.message || String(event.reason),
-        },
-      });
-    });
-  }
-
-  /**
-   * Flush logs via Beacon API
-   * Used for critical events where fetch might be cancelled (e.g. page unload/crash)
-   */
-  flushViaBeacon() {
-    if (!navigator.sendBeacon) return;
-
-    // Save current state first
-    this.saveToStorage();
-
-    // Prepare payload
-    const data = this.exportJSON();
-
-    // Create Blob for proper Content-Type
-    const blob = new Blob([JSON.stringify(data)], { type: 'application/json' });
-
-    // Send beacon
-    const success = navigator.sendBeacon(this.apiEndpoint, blob);
-
-    if (success) {
-      this.lastSyncedIndex = this.entries.length;
-      console.debug('[BrowserLogger] Critical logs flushed via Beacon');
-    }
-  }
-}
-
-// Create global instance
-const dssLogger = new BrowserLogger();
-
-// Expose to window ONLY in development mode
-// This is for debugging purposes only. Production should not expose this.
-if (typeof window !== 'undefined' && (
-  (typeof process !== 'undefined' && process.env && process.env.NODE_ENV === 'development') ||
-  window.location.hostname === 'localhost' ||
-  window.location.hostname === '127.0.0.1'
-)) {
-  // Only expose debugging interface with warning
-  window.__DSS_BROWSER_LOGS = {
-    all: () => dssLogger.getLogs({ limit: 1000 }),
-    errors: () => dssLogger.getErrors(),
-    network: () => dssLogger.getNetworkRequests(),
-    metrics: () => dssLogger.getMetrics(),
-    diagnostic: () => dssLogger.getDiagnostic(),
-    export: () => dssLogger.exportJSON(),
-    print: (options) => dssLogger.printFormatted(options),
-    clear: () => dssLogger.clear(),
-
-    // Accessibility and performance auditing
-    audit: () => dssLogger.captureAccessibilitySnapshot(),
-    vitals: () => dssLogger.getCoreWebVitals(),
-    axe: () => dssLogger.runAxeAudit(),
-
-    // Auto-sync controls
-    sync: () => dssLogger.syncToServer(),
-    stopSync: () => dssLogger.stopAutoSync(),
-    startSync: () => dssLogger.startAutoSync(),
-
-    // Quick helpers
-    help: () => {
-      console.log('%c📋 DSS Browser Logger Commands', 'font-weight: bold; font-size: 14px; color: #4CAF50');
-      console.log('%c  __DSS_BROWSER_LOGS.errors()', 'color: #FF5252', '- Show all errors');
-      console.log('%c  __DSS_BROWSER_LOGS.diagnostic()', 'color: #2196F3', '- System diagnostic');
-      console.log('%c  __DSS_BROWSER_LOGS.all()', 'color: #666', '- All captured logs');
-      console.log('%c  __DSS_BROWSER_LOGS.network()', 'color: #9C27B0', '- Network requests');
-      console.log('%c  __DSS_BROWSER_LOGS.print()', 'color: #FF9800', '- Print formatted table');
-      console.log('%c  __DSS_BROWSER_LOGS.audit()', 'color: #673AB7', '- Run full accessibility audit');
-      console.log('%c  __DSS_BROWSER_LOGS.vitals()', 'color: #009688', '- Get Core Web Vitals (LCP, CLS, FCP, TTFB)');
-      console.log('%c  __DSS_BROWSER_LOGS.axe()', 'color: #E91E63', '- Run axe-core accessibility scan');
-      console.log('%c  __DSS_BROWSER_LOGS.export()', 'color: #00BCD4', '- Export all data (copy this!)');
-      console.log('%c  __DSS_BROWSER_LOGS.clear()', 'color: #F44336', '- Clear all logs');
-      console.log('%c  __DSS_BROWSER_LOGS.share()', 'color: #4CAF50', '- Generate shareable JSON');
-      console.log('%c  __DSS_BROWSER_LOGS.sync()', 'color: #2196F3', '- Sync logs to server now');
-      console.log('%c  __DSS_BROWSER_LOGS.stopSync()', 'color: #FF9800', '- Stop auto-sync');
-      console.log('%c  __DSS_BROWSER_LOGS.startSync()', 'color: #4CAF50', '- Start auto-sync (30s)');
-    },
-
-    // Generate shareable JSON for debugging with Claude
-    share: () => {
-      const data = dssLogger.exportJSON();
-      const json = JSON.stringify(data, null, 2);
-      console.log('%c📤 Copy this and share with Claude:', 'font-weight: bold; color: #4CAF50');
-      console.log(json);
-      return data;
-    }
-  };
-
-  console.info('%c🔍 DSS Browser Logger Active', 'color: #4CAF50; font-weight: bold;');
-  console.info('%c📡 Auto-sync enabled - logs sent to server every 30s', 'color: #2196F3; font-style: italic;');
-  console.info('%cType: %c__DSS_BROWSER_LOGS.help()%c for commands', 'color: #666', 'color: #2196F3; font-family: monospace', 'color: #666');
-}
-
-export default dssLogger;
diff --git a/admin-ui/js/core/component-audit.js b/admin-ui/js/core/component-audit.js
deleted file mode 100644
index e42d5a8..0000000
--- a/admin-ui/js/core/component-audit.js
+++ /dev/null
@@ -1,568 +0,0 @@
-/**
- * Component Audit System
- *
- * Comprehensive audit of all 9 design system components against:
- * 1. Token compliance (no hardcoded values)
- * 2. Variant coverage (all variants implemented)
- * 3. State coverage (all states styled)
- * 4. Dark mode support (proper color overrides)
- * 5. Accessibility compliance (WCAG 2.1 AA)
- * 6. Responsive design (all breakpoints)
- * 7. Animation consistency (proper timing)
- * 8. Documentation quality (complete and accurate)
- * 9. Test coverage (sufficient test cases)
- * 10. API consistency (uses DsComponentBase)
- * 11. Performance (no layout thrashing)
- * 12. Backwards compatibility (no breaking changes)
- */
-
-import { componentDefinitions } from './component-definitions.js';
-
-export class ComponentAudit {
-  constructor() {
-    this.components = componentDefinitions.components;
-    this.results = {
-      timestamp: new Date().toISOString(),
-      totalComponents: Object.keys(this.components).length,
-      passedComponents: 0,
-      failedComponents: 0,
-      warningComponents: 0,
-      auditItems: {},
-    };
-    this.criteria = {
-      tokenCompliance: { weight: 15, description: 'All colors/spacing use tokens' },
-      variantCoverage: { weight: 15, description: 'All defined variants implemented' },
-      stateCoverage: { weight: 10, description: 'All defined states styled' },
-      darkModeSupport: { weight: 10, description: 'Proper color overrides in dark mode' },
-      a11yCompliance: { weight: 15, description: 'WCAG 2.1 Level AA compliance' },
-      responsiveDesign: { weight: 10, description: 'All breakpoints working' },
-      animationTiming: { weight: 5, description: 'Consistent with design tokens' },
-      documentation: { weight: 5, description: 'Complete and accurate' },
-      testCoverage: { weight: 10, description: 'Sufficient test cases defined' },
-      apiConsistency: { weight: 3, description: 'Uses DsComponentBase methods' },
-      performance: { weight: 2, description: 'No layout recalculations' },
-      backwardsCompat: { weight: 0, description: 'No breaking changes' },
-    };
-  }
-
-  /**
-   * Run complete audit for all components
-   */
-  runFullAudit() {
-    Object.entries(this.components).forEach(([key, def]) => {
-      const componentResult = this.auditComponent(key, def);
-      this.results.auditItems[key] = componentResult;
-
-      if (componentResult.score === 100) {
-        this.results.passedComponents++;
-      } else if (componentResult.score >= 80) {
-        this.results.warningComponents++;
-      } else {
-        this.results.failedComponents++;
-      }
-    });
-
-    this.results.overallScore = this.calculateOverallScore();
-    this.results.summary = this.generateSummary();
-
-    return this.results;
-  }
-
-  /**
-   * Audit a single component
-   */
-  auditComponent(componentKey, def) {
-    const result = {
-      name: def.name,
-      group: def.group,
-      checks: {},
-      passed: 0,
-      failed: 0,
-      warnings: 0,
-      score: 0,
-      details: [],
-    };
-
-    // 1. Token Compliance
-    const tokenCheck = this.checkTokenCompliance(componentKey, def);
-    result.checks.tokenCompliance = tokenCheck;
-    if (tokenCheck.pass) result.passed++; else result.failed++;
-
-    // 2. Variant Coverage
-    const variantCheck = this.checkVariantCoverage(componentKey, def);
-    result.checks.variantCoverage = variantCheck;
-    if (variantCheck.pass) result.passed++; else result.failed++;
-
-    // 3. State Coverage
-    const stateCheck = this.checkStateCoverage(componentKey, def);
-    result.checks.stateCoverage = stateCheck;
-    if (stateCheck.pass) result.passed++; else result.failed++;
-
-    // 4. Dark Mode Support
-    const darkModeCheck = this.checkDarkModeSupport(componentKey, def);
-    result.checks.darkModeSupport = darkModeCheck;
-    if (darkModeCheck.pass) result.passed++; else result.failed++;
-
-    // 5. Accessibility Compliance
-    const a11yCheck = this.checkA11yCompliance(componentKey, def);
-    result.checks.a11yCompliance = a11yCheck;
-    if (a11yCheck.pass) result.passed++; else result.failed++;
-
-    // 6. Responsive Design
-    const responsiveCheck = this.checkResponsiveDesign(componentKey, def);
-    result.checks.responsiveDesign = responsiveCheck;
-    if (responsiveCheck.pass) result.passed++; else result.failed++;
-
-    // 7. Animation Timing
-    const animationCheck = this.checkAnimationTiming(componentKey, def);
-    result.checks.animationTiming = animationCheck;
-    if (animationCheck.pass) result.passed++; else result.failed++;
-
-    // 8. Documentation Quality
-    const docCheck = this.checkDocumentation(componentKey, def);
-    result.checks.documentation = docCheck;
-    if (docCheck.pass) result.passed++; else result.failed++;
-
-    // 9. Test Coverage
-    const testCheck = this.checkTestCoverage(componentKey, def);
-    result.checks.testCoverage = testCheck;
-    if (testCheck.pass) result.passed++; else result.failed++;
-
-    // 10. API Consistency
-    const apiCheck = this.checkAPIConsistency(componentKey, def);
-    result.checks.apiConsistency = apiCheck;
-    if (apiCheck.pass) result.passed++; else result.failed++;
-
-    // 11. Performance
-    const perfCheck = this.checkPerformance(componentKey, def);
-    result.checks.performance = perfCheck;
-    if (perfCheck.pass) result.passed++; else result.failed++;
-
-    // 12. Backwards Compatibility
-    const compatCheck = this.checkBackwardsCompatibility(componentKey, def);
-    result.checks.backwardsCompat = compatCheck;
-    if (compatCheck.pass) result.passed++; else result.failed++;
-
-    // Calculate score
-    result.score = Math.round((result.passed / 12) * 100);
-
-    return result;
-  }
-
-  /**
-   * Check token compliance
-   */
-  checkTokenCompliance(componentKey, def) {
-    const check = {
-      criteria: this.criteria.tokenCompliance.description,
-      pass: true,
-      details: [],
-    };
-
-    if (!def.tokens) {
-      check.pass = false;
-      check.details.push('Missing tokens definition');
-      return check;
-    }
-
-    const tokenCount = Object.values(def.tokens).reduce((acc, arr) => acc + arr.length, 0);
-    if (tokenCount === 0) {
-      check.pass = false;
-      check.details.push('No tokens defined for component');
-      return check;
-    }
-
-    // Verify all tokens are valid
-    const allTokens = componentDefinitions.tokenDependencies;
-    Object.values(def.tokens).forEach(tokens => {
-      tokens.forEach(token => {
-        if (!allTokens[token]) {
-          check.pass = false;
-          check.details.push(`Invalid token reference: ${token}`);
-        }
-      });
-    });
-
-    if (check.pass) {
-      check.details.push(`✅ All ${tokenCount} token references are valid`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check variant coverage
-   */
-  checkVariantCoverage(componentKey, def) {
-    const check = {
-      criteria: this.criteria.variantCoverage.description,
-      pass: true,
-      details: [],
-    };
-
-    if (!def.variants) {
-      check.details.push('No variants defined');
-      return check;
-    }
-
-    const variantCount = Object.values(def.variants).reduce((acc, arr) => acc * arr.length, 1);
-
-    if (variantCount !== def.variantCombinations) {
-      check.pass = false;
-      check.details.push(`Variant mismatch: ${variantCount} computed vs ${def.variantCombinations} defined`);
-    } else {
-      check.details.push(`✅ ${variantCount} variant combinations verified`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check state coverage
-   */
-  checkStateCoverage(componentKey, def) {
-    const check = {
-      criteria: this.criteria.stateCoverage.description,
-      pass: true,
-      details: [],
-    };
-
-    if (!def.states || def.states.length === 0) {
-      check.pass = false;
-      check.details.push('No states defined');
-      return check;
-    }
-
-    const stateCount = def.states.length;
-    if (stateCount !== def.stateCount) {
-      check.pass = false;
-      check.details.push(`State mismatch: ${stateCount} defined vs ${def.stateCount} expected`);
-    } else {
-      check.details.push(`✅ ${stateCount} states defined (${def.states.join(', ')})`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check dark mode support
-   */
-  checkDarkModeSupport(componentKey, def) {
-    const check = {
-      criteria: this.criteria.darkModeSupport.description,
-      pass: true,
-      details: [],
-    };
-
-    if (!def.darkMode) {
-      check.pass = false;
-      check.details.push('No dark mode configuration');
-      return check;
-    }
-
-    if (!def.darkMode.support) {
-      check.pass = false;
-      check.details.push('Dark mode not enabled');
-      return check;
-    }
-
-    if (!def.darkMode.colorOverrides || def.darkMode.colorOverrides.length === 0) {
-      check.pass = false;
-      check.details.push('No color overrides defined for dark mode');
-      return check;
-    }
-
-    check.details.push(`✅ Dark mode supported with ${def.darkMode.colorOverrides.length} color overrides`);
-    return check;
-  }
-
-  /**
-   * Check accessibility compliance
-   */
-  checkA11yCompliance(componentKey, def) {
-    const check = {
-      criteria: this.criteria.a11yCompliance.description,
-      pass: true,
-      details: [],
-    };
-
-    const a11yReq = componentDefinitions.a11yRequirements[componentKey];
-
-    if (!a11yReq) {
-      check.pass = false;
-      check.details.push('No accessibility requirements defined');
-      return check;
-    }
-
-    if (a11yReq.wcagLevel !== 'AA') {
-      check.pass = false;
-      check.details.push(`WCAG level is ${a11yReq.wcagLevel}, expected AA`);
-    }
-
-    if (a11yReq.contrastRatio < 4.5 && a11yReq.contrastRatio !== 3) {
-      check.pass = false;
-      check.details.push(`Contrast ratio ${a11yReq.contrastRatio}:1 below AA minimum`);
-    }
-
-    if (!a11yReq.screenReaderSupport) {
-      check.pass = false;
-      check.details.push('Screen reader support not enabled');
-    }
-
-    if (check.pass) {
-      check.details.push(`✅ WCAG ${a11yReq.wcagLevel} compliant (contrast: ${a11yReq.contrastRatio}:1)`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check responsive design
-   */
-  checkResponsiveDesign(componentKey, def) {
-    const check = {
-      criteria: this.criteria.responsiveDesign.description,
-      pass: true,
-      details: [],
-    };
-
-    // Check if component has responsive variants or rules
-    const hasResponsiveSupport = def.group && ['layout', 'notification', 'stepper'].includes(def.group);
-
-    if (hasResponsiveSupport) {
-      check.details.push(`✅ Component designed for responsive layouts`);
-    } else {
-      check.details.push(`ℹ️  Component inherits responsive behavior from parent`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check animation timing
-   */
-  checkAnimationTiming(componentKey, def) {
-    const check = {
-      criteria: this.criteria.animationTiming.description,
-      pass: true,
-      details: [],
-    };
-
-    // Check if any states have transitions/animations
-    const hasAnimations = def.states && (
-      def.states.includes('entering') ||
-      def.states.includes('exiting') ||
-      def.states.includes('loading')
-    );
-
-    if (hasAnimations) {
-      check.details.push(`✅ Component has animation states`);
-    } else {
-      check.details.push(`ℹ️  Component uses CSS transitions`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check documentation quality
-   */
-  checkDocumentation(componentKey, def) {
-    const check = {
-      criteria: this.criteria.documentation.description,
-      pass: true,
-      details: [],
-    };
-
-    if (!def.description) {
-      check.pass = false;
-      check.details.push('Missing component description');
-    } else {
-      check.details.push(`✅ Description: "${def.description}"`);
-    }
-
-    if (!def.a11y) {
-      check.pass = false;
-      check.details.push('Missing accessibility documentation');
-    }
-
-    return check;
-  }
-
-  /**
-   * Check test coverage
-   */
-  checkTestCoverage(componentKey, def) {
-    const check = {
-      criteria: this.criteria.testCoverage.description,
-      pass: true,
-      details: [],
-    };
-
-    const minTests = (def.variantCombinations || 1) * 2; // Minimum 2 tests per variant
-
-    if (!def.testCases) {
-      check.pass = false;
-      check.details.push(`No test cases defined`);
-      return check;
-    }
-
-    if (def.testCases < minTests) {
-      check.pass = false;
-      const deficit = minTests - def.testCases;
-      check.details.push(`${def.testCases}/${minTests} tests (${deficit} deficit)`);
-    } else {
-      check.details.push(`✅ ${def.testCases} test cases (${minTests} minimum)`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check API consistency
-   */
-  checkAPIConsistency(componentKey, def) {
-    const check = {
-      criteria: this.criteria.apiConsistency.description,
-      pass: true,
-      details: [],
-    };
-
-    // All components should follow standard patterns
-    check.details.push(`✅ Component follows DsComponentBase patterns`);
-
-    return check;
-  }
-
-  /**
-   * Check performance
-   */
-  checkPerformance(componentKey, def) {
-    const check = {
-      criteria: this.criteria.performance.description,
-      pass: true,
-      details: [],
-    };
-
-    // Check for excessive state combinations that could cause performance issues
-    const totalStates = def.totalStates || 1;
-    if (totalStates > 500) {
-      check.pass = false;
-      check.details.push(`Excessive states (${totalStates}), may impact performance`);
-    } else {
-      check.details.push(`✅ Performance acceptable (${totalStates} states)`);
-    }
-
-    return check;
-  }
-
-  /**
-   * Check backwards compatibility
-   */
-  checkBackwardsCompatibility(componentKey, def) {
-    const check = {
-      criteria: this.criteria.backwardsCompat.description,
-      pass: true,
-      details: [],
-    };
-
-    check.details.push(`✅ No breaking changes identified`);
-
-    return check;
-  }
-
-  /**
-   * Calculate overall score
-   */
-  calculateOverallScore() {
-    let totalScore = 0;
-    let totalWeight = 0;
-
-    Object.entries(this.results.auditItems).forEach(([key, item]) => {
-      const weight = Object.values(this.criteria).reduce((acc, c) => acc + c.weight, 0);
-      totalScore += item.score;
-      totalWeight += 1;
-    });
-
-    return Math.round(totalScore / totalWeight);
-  }
-
-  /**
-   * Generate audit summary
-   */
-  generateSummary() {
-    const passed = this.results.passedComponents;
-    const failed = this.results.failedComponents;
-    const warnings = this.results.warningComponents;
-    const total = this.results.totalComponents;
-
-    return {
-      passed: `${passed}/${total} components passed`,
-      warnings: `${warnings}/${total} components with warnings`,
-      failed: `${failed}/${total} components failed`,
-      overallGrade: this.results.overallScore >= 95 ? 'A' : this.results.overallScore >= 80 ? 'B' : this.results.overallScore >= 70 ? 'C' : 'F',
-      readyForProduction: failed === 0 && warnings <= 1,
-    };
-  }
-
-  /**
-   * Export as formatted text report
-   */
-  exportTextReport() {
-    const lines = [];
-
-    lines.push('╔════════════════════════════════════════════════════════════════╗');
-    lines.push('║         DESIGN SYSTEM COMPONENT AUDIT REPORT                   ║');
-    lines.push('╚════════════════════════════════════════════════════════════════╝');
-    lines.push('');
-    lines.push(`📅 Date: ${this.results.timestamp}`);
-    lines.push(`🎯 Overall Score: ${this.results.overallScore}/100 (Grade: ${this.results.summary.overallGrade})`);
-    lines.push('');
-
-    lines.push('📊 Summary');
-    lines.push('─'.repeat(60));
-    lines.push(`  ${this.results.summary.passed}`);
-    lines.push(`  ${this.results.summary.warnings}`);
-    lines.push(`  ${this.results.summary.failed}`);
-    lines.push('');
-
-    lines.push('🔍 Component Audit Results');
-    lines.push('─'.repeat(60));
-
-    Object.entries(this.results.auditItems).forEach(([key, item]) => {
-      const status = item.score === 100 ? '✅' : item.score >= 80 ? '⚠️' : '❌';
-      lines.push(`${status} ${item.name} (${item.group}): ${item.score}/100`);
-
-      Object.entries(item.checks).forEach(([checkKey, checkResult]) => {
-        const checkStatus = checkResult.pass ? '✓' : '✗';
-        lines.push(`   ${checkStatus} ${checkKey}`);
-        checkResult.details.forEach(detail => {
-          lines.push(`      ${detail}`);
-        });
-      });
-      lines.push('');
-    });
-
-    lines.push('🎉 Recommendation');
-    lines.push('─'.repeat(60));
-    if (this.results.summary.readyForProduction) {
-      lines.push('✅ READY FOR PRODUCTION - All components pass audit');
-    } else {
-      lines.push('⚠️  REVIEW REQUIRED - Address warnings before production');
-    }
-
-    lines.push('');
-    lines.push('╚════════════════════════════════════════════════════════════════╝');
-
-    return lines.join('\n');
-  }
-
-  /**
-   * Export as JSON
-   */
-  exportJSON() {
-    return JSON.stringify(this.results, null, 2);
-  }
-}
-
-export default ComponentAudit;
diff --git a/admin-ui/js/core/component-config.js b/admin-ui/js/core/component-config.js
deleted file mode 100644
index 0f95d8a..0000000
--- a/admin-ui/js/core/component-config.js
+++ /dev/null
@@ -1,272 +0,0 @@
-/**
- * Component Configuration Registry
- *
- * Extensible registry for external tools and components.
- * Each component defines its config schema, making it easy to:
- * - Add new tools without code changes
- * - Generate settings UI dynamically
- * - Validate configurations
- * - Store and retrieve settings consistently
- */
-
-import { getConfig, getDssHost, getStorybookPort } from './config-loader.js';
-
-/**
- * Component Registry
- * Add new components here to extend the settings system.
- */
-export const componentRegistry = {
-  storybook: {
-    id: 'storybook',
-    name: 'Storybook',
-    description: 'Component documentation and playground',
-    icon: 'book',
-    category: 'documentation',
-
-    // Config schema - defines available settings
-    config: {
-      port: {
-        type: 'number',
-        label: 'Port',
-        default: 6006,
-        readonly: true, // Derived from server config
-        description: 'Storybook runs on this port',
-      },
-      theme: {
-        type: 'select',
-        label: 'Theme',
-        options: [
-          { value: 'light', label: 'Light' },
-          { value: 'dark', label: 'Dark' },
-          { value: 'auto', label: 'Auto (System)' },
-        ],
-        default: 'auto',
-        description: 'Storybook UI theme preference',
-      },
-      showDocs: {
-        type: 'boolean',
-        label: 'Show Docs Tab',
-        default: true,
-        description: 'Display the documentation tab in stories',
-      },
-    },
-
-    // Dynamic URL builder (uses nginx path-based routing)
-    getUrl() {
-      try {
-        const host = getDssHost();
-        const protocol = window.location.protocol;
-        // Admin configured path-based routing at /storybook/
-        return `${protocol}//${host}/storybook/`;
-      } catch {
-        return null;
-      }
-    },
-
-    // Status check
-    async checkStatus() {
-      const url = this.getUrl();
-      if (!url) return { status: 'unknown', message: 'Configuration not loaded' };
-
-      try {
-        const response = await fetch(url, { mode: 'no-cors', cache: 'no-cache' });
-        return { status: 'available', message: 'Storybook is running' };
-      } catch {
-        return { status: 'unavailable', message: 'Storybook is not responding' };
-      }
-    },
-  },
-
-  figma: {
-    id: 'figma',
-    name: 'Figma',
-    description: 'Design file integration and token extraction',
-    icon: 'figma',
-    category: 'design',
-
-    config: {
-      apiKey: {
-        type: 'password',
-        label: 'API Token',
-        placeholder: 'figd_xxxxxxxxxx',
-        description: 'Your Figma Personal Access Token',
-        sensitive: true, // Never display actual value
-      },
-      fileKey: {
-        type: 'text',
-        label: 'Default File Key',
-        placeholder: 'Enter Figma file key',
-        description: 'Default Figma file to use for token extraction',
-      },
-      autoSync: {
-        type: 'boolean',
-        label: 'Auto-sync Tokens',
-        default: false,
-        description: 'Automatically sync tokens when file changes detected',
-      },
-    },
-
-    getUrl() {
-      return 'https://www.figma.com';
-    },
-
-    async checkStatus() {
-      // Check if API key is configured via backend
-      try {
-        const response = await fetch('/api/figma/health');
-        const data = await response.json();
-        if (data.configured) {
-          return { status: 'connected', message: `Connected as ${data.user || 'user'}` };
-        }
-        return { status: 'not_configured', message: 'API token not set' };
-      } catch {
-        return { status: 'error', message: 'Failed to check Figma status' };
-      }
-    },
-  },
-
-  // Future components can be added here
-  jira: {
-    id: 'jira',
-    name: 'Jira',
-    description: 'Issue tracking integration',
-    icon: 'clipboard',
-    category: 'project',
-    enabled: false, // Not yet implemented
-
-    config: {
-      baseUrl: {
-        type: 'url',
-        label: 'Jira URL',
-        placeholder: 'https://your-org.atlassian.net',
-        description: 'Your Jira instance URL',
-      },
-      projectKey: {
-        type: 'text',
-        label: 'Project Key',
-        placeholder: 'DS',
-        description: 'Default Jira project key',
-      },
-    },
-
-    getUrl() {
-      return localStorage.getItem('jira_base_url') || null;
-    },
-
-    async checkStatus() {
-      return { status: 'not_implemented', message: 'Coming soon' };
-    },
-  },
-
-  confluence: {
-    id: 'confluence',
-    name: 'Confluence',
-    description: 'Documentation wiki integration',
-    icon: 'file-text',
-    category: 'documentation',
-    enabled: false, // Not yet implemented
-
-    config: {
-      baseUrl: {
-        type: 'url',
-        label: 'Confluence URL',
-        placeholder: 'https://your-org.atlassian.net/wiki',
-        description: 'Your Confluence instance URL',
-      },
-      spaceKey: {
-        type: 'text',
-        label: 'Space Key',
-        placeholder: 'DS',
-        description: 'Default Confluence space key',
-      },
-    },
-
-    getUrl() {
-      return localStorage.getItem('confluence_base_url') || null;
-    },
-
-    async checkStatus() {
-      return { status: 'not_implemented', message: 'Coming soon' };
-    },
-  },
-};
-
-/**
- * Get all enabled components
- */
-export function getEnabledComponents() {
-  return Object.values(componentRegistry).filter(c => c.enabled !== false);
-}
-
-/**
- * Get components by category
- */
-export function getComponentsByCategory(category) {
-  return Object.values(componentRegistry).filter(c => c.category === category && c.enabled !== false);
-}
-
-/**
- * Get component by ID
- */
-export function getComponent(id) {
-  return componentRegistry[id] || null;
-}
-
-/**
- * Get component setting value
- */
-export function getComponentSetting(componentId, settingKey) {
-  const storageKey = `dss_component_${componentId}_${settingKey}`;
-  const stored = localStorage.getItem(storageKey);
-
-  if (stored !== null) {
-    try {
-      return JSON.parse(stored);
-    } catch {
-      return stored;
-    }
-  }
-
-  // Return default value from schema
-  const component = getComponent(componentId);
-  if (component && component.config[settingKey]) {
-    const defaultValue = component.config[settingKey].default;
-    if (defaultValue !== undefined) {
-      return defaultValue;
-    }
-  }
-
-  return null;
-}
-
-/**
- * Set component setting value
- */
-export function setComponentSetting(componentId, settingKey, value) {
-  const storageKey = `dss_component_${componentId}_${settingKey}`;
-  localStorage.setItem(storageKey, JSON.stringify(value));
-}
-
-/**
- * Get all settings for a component
- */
-export function getComponentSettings(componentId) {
-  const component = getComponent(componentId);
-  if (!component) return {};
-
-  const settings = {};
-  for (const key of Object.keys(component.config)) {
-    settings[key] = getComponentSetting(componentId, key);
-  }
-  return settings;
-}
-
-export default {
-  componentRegistry,
-  getEnabledComponents,
-  getComponentsByCategory,
-  getComponent,
-  getComponentSetting,
-  setComponentSetting,
-  getComponentSettings,
-};
diff --git a/admin-ui/js/core/component-definitions.js b/admin-ui/js/core/component-definitions.js
deleted file mode 100644
index b8bd0a3..0000000
--- a/admin-ui/js/core/component-definitions.js
+++ /dev/null
@@ -1,472 +0,0 @@
-/**
- * Component Definitions - Metadata for all design system components
- *
- * This file defines the complete metadata for each component including:
- * - State combinations and variants
- * - Token dependencies
- * - Accessibility requirements
- * - Test case counts
- *
- * Used by VariantGenerator to auto-generate CSS and validate 123 component states
- */
-
-export const componentDefinitions = {
-  components: {
-    'ds-button': {
-      name: 'Button',
-      group: 'interactive',
-      cssClass: '.ds-btn',
-      description: 'Primary interactive button component',
-      states: ['default', 'hover', 'active', 'disabled', 'loading', 'focus'],
-      variants: {
-        variant: ['primary', 'secondary', 'outline', 'ghost', 'destructive', 'success', 'link'],
-        size: ['sm', 'default', 'lg', 'icon', 'icon-sm', 'icon-lg']
-      },
-      variantCombinations: 42, // 7 variants × 6 sizes
-      stateCount: 6,
-      totalStates: 252, // 42 × 6
-      tokens: {
-        color: ['--primary', '--secondary', '--destructive', '--success', '--foreground'],
-        spacing: ['--space-3', '--space-4', '--space-6'],
-        typography: ['--text-xs', '--text-sm', '--text-base'],
-        radius: ['--radius'],
-        transitions: ['--duration-fast', '--ease-default'],
-        shadow: ['--shadow-sm']
-      },
-      a11y: {
-        ariaAttributes: ['aria-label', 'aria-disabled', 'aria-pressed'],
-        focusManagement: true,
-        contrastRatio: 'WCAG AA (4.5:1)',
-        keyboardInteraction: 'Enter, Space',
-        semantics: '<button> element'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--primary', '--secondary', '--destructive', '--success']
-      },
-      testCases: 45 // unit tests
-    },
-
-    'ds-input': {
-      name: 'Input',
-      group: 'form',
-      cssClass: '.ds-input',
-      description: 'Text input with label, icon, and error states',
-      states: ['default', 'focus', 'hover', 'disabled', 'error', 'disabled-error'],
-      variants: {
-        type: ['text', 'password', 'email', 'number', 'search', 'tel', 'url'],
-        size: ['default']
-      },
-      variantCombinations: 7,
-      stateCount: 6,
-      totalStates: 42,
-      tokens: {
-        color: ['--foreground', '--muted-foreground', '--border', '--destructive'],
-        spacing: ['--space-3', '--space-4'],
-        typography: ['--text-sm', '--text-base'],
-        radius: ['--radius-md'],
-        transitions: ['--duration-normal'],
-        shadow: ['--shadow-sm']
-      },
-      a11y: {
-        ariaAttributes: ['aria-label', 'aria-invalid', 'aria-describedby'],
-        focusManagement: true,
-        contrastRatio: 'WCAG AA (4.5:1)',
-        keyboardInteraction: 'Tab, Arrow keys',
-        semantics: '<input> with associated <label>'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--input', '--border', '--muted-foreground']
-      },
-      testCases: 38
-    },
-
-    'ds-card': {
-      name: 'Card',
-      group: 'container',
-      cssClass: '.ds-card',
-      description: 'Container with header, content, footer sections',
-      states: ['default', 'hover', 'interactive'],
-      variants: {
-        style: ['default', 'interactive']
-      },
-      variantCombinations: 2,
-      stateCount: 3,
-      totalStates: 6,
-      tokens: {
-        color: ['--card', '--card-foreground', '--border'],
-        spacing: ['--space-4', '--space-6'],
-        radius: ['--radius-lg'],
-        shadow: ['--shadow-md']
-      },
-      a11y: {
-        ariaAttributes: [],
-        focusManagement: false,
-        contrastRatio: 'WCAG AA (4.5:1)',
-        semantics: 'Article or Section'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--card', '--card-foreground']
-      },
-      testCases: 28
-    },
-
-    'ds-badge': {
-      name: 'Badge',
-      group: 'indicator',
-      cssClass: '.ds-badge',
-      description: 'Status indicator badge',
-      states: ['default', 'hover'],
-      variants: {
-        variant: ['default', 'secondary', 'outline', 'destructive', 'success', 'warning'],
-        size: ['default']
-      },
-      variantCombinations: 6,
-      stateCount: 2,
-      totalStates: 12,
-      tokens: {
-        color: ['--primary', '--secondary', '--destructive', '--success', '--warning'],
-        spacing: ['--space-1', '--space-3'],
-        typography: ['--text-xs'],
-        radius: ['--radius-full']
-      },
-      a11y: {
-        ariaAttributes: ['aria-label'],
-        focusManagement: false,
-        semantics: 'span with role'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--primary', '--secondary', '--destructive', '--success']
-      },
-      testCases: 22
-    },
-
-    'ds-toast': {
-      name: 'Toast',
-      group: 'notification',
-      cssClass: '.ds-toast',
-      description: 'Auto-dismiss notification toast',
-      states: ['entering', 'visible', 'exiting', 'swiped'],
-      variants: {
-        type: ['default', 'success', 'warning', 'error', 'info'],
-        duration: ['auto', 'manual']
-      },
-      variantCombinations: 10,
-      stateCount: 4,
-      totalStates: 40,
-      tokens: {
-        color: ['--success', '--warning', '--destructive', '--info', '--foreground'],
-        spacing: ['--space-4'],
-        shadow: ['--shadow-lg'],
-        transitions: ['--duration-slow'],
-        zIndex: ['--z-toast']
-      },
-      a11y: {
-        ariaAttributes: ['role="alert"', 'aria-live="polite"'],
-        focusManagement: false,
-        semantics: 'div with alert role'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--success', '--warning', '--destructive']
-      },
-      testCases: 35
-    },
-
-    'ds-workflow': {
-      name: 'Workflow',
-      group: 'stepper',
-      cssClass: '.ds-workflow',
-      description: 'Multi-step workflow indicator',
-      states: ['pending', 'active', 'completed', 'error', 'skipped'],
-      variants: {
-        direction: ['vertical', 'horizontal']
-      },
-      variantCombinations: 2,
-      stateCount: 5,
-      totalStates: 10, // per step; multiply by step count
-      stepsPerWorkflow: 4,
-      tokens: {
-        color: ['--primary', '--success', '--destructive', '--muted'],
-        spacing: ['--space-4', '--space-6'],
-        transitions: ['--duration-normal']
-      },
-      a11y: {
-        ariaAttributes: ['aria-current="step"'],
-        focusManagement: true,
-        semantics: 'ol with li steps'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--primary', '--success', '--destructive']
-      },
-      testCases: 37
-    },
-
-    'ds-notification-center': {
-      name: 'NotificationCenter',
-      group: 'notification',
-      cssClass: '.ds-notification-center',
-      description: 'Notification list with grouping and filtering',
-      states: ['empty', 'loading', 'open', 'closed', 'scrolling'],
-      variants: {
-        layout: ['compact', 'expanded'],
-        groupBy: ['type', 'date', 'none']
-      },
-      variantCombinations: 6,
-      stateCount: 5,
-      totalStates: 30,
-      tokens: {
-        color: ['--card', '--card-foreground', '--border', '--primary'],
-        spacing: ['--space-3', '--space-4'],
-        shadow: ['--shadow-md'],
-        zIndex: ['--z-popover']
-      },
-      a11y: {
-        ariaAttributes: ['role="region"', 'aria-label="Notifications"'],
-        focusManagement: true,
-        semantics: 'ul with li items'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--card', '--card-foreground', '--border']
-      },
-      testCases: 40
-    },
-
-    'ds-action-bar': {
-      name: 'ActionBar',
-      group: 'layout',
-      cssClass: '.ds-action-bar',
-      description: 'Fixed or sticky action button bar',
-      states: ['default', 'expanded', 'collapsed', 'dismissing'],
-      variants: {
-        position: ['fixed', 'relative', 'sticky'],
-        alignment: ['left', 'center', 'right']
-      },
-      variantCombinations: 9,
-      stateCount: 4,
-      totalStates: 36,
-      tokens: {
-        color: ['--card', '--card-foreground', '--border'],
-        spacing: ['--space-4'],
-        shadow: ['--shadow-lg'],
-        transitions: ['--duration-normal']
-      },
-      a11y: {
-        ariaAttributes: ['role="toolbar"'],
-        focusManagement: true,
-        semantics: 'nav with button children'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: ['--card', '--card-foreground']
-      },
-      testCases: 31
-    },
-
-    'ds-toast-provider': {
-      name: 'ToastProvider',
-      group: 'provider',
-      cssClass: '.ds-toast-provider',
-      description: 'Global toast notification container and manager',
-      states: ['empty', 'toasts-visible', 'dismissing-all'],
-      variants: {
-        position: ['top-left', 'top-center', 'top-right', 'bottom-left', 'bottom-center', 'bottom-right']
-      },
-      variantCombinations: 6,
-      stateCount: 3,
-      totalStates: 18,
-      tokens: {
-        spacing: ['--space-4'],
-        zIndex: ['--z-toast']
-      },
-      a11y: {
-        ariaAttributes: ['aria-live="polite"'],
-        focusManagement: false,
-        semantics: 'div container'
-      },
-      darkMode: {
-        support: true,
-        colorOverrides: []
-      },
-      testCases: 23
-    }
-  },
-
-  /**
-   * Summary statistics
-   */
-  summary: {
-    totalComponents: 9,
-    totalVariants: 123,
-    totalTestCases: 315,
-    averageTestsPerComponent: 35,
-    a11yComponentsSupported: 9,
-    darkModeComponentsSupported: 9,
-    totalTokensUsed: 42,
-    colorTokens: 20,
-    spacingTokens: 8,
-    typographyTokens: 6,
-    radiusTokens: 4,
-    transitionTokens: 2,
-    shadowTokens: 2
-  },
-
-  /**
-   * Token dependency map - which tokens are used where
-   */
-  tokenDependencies: {
-    '--primary': ['ds-button', 'ds-input', 'ds-badge', 'ds-workflow', 'ds-notification-center', 'ds-action-bar'],
-    '--secondary': ['ds-button', 'ds-badge'],
-    '--destructive': ['ds-button', 'ds-badge', 'ds-input', 'ds-toast', 'ds-workflow'],
-    '--success': ['ds-button', 'ds-badge', 'ds-toast', 'ds-workflow'],
-    '--warning': ['ds-badge', 'ds-toast'],
-    '--foreground': ['ds-button', 'ds-input', 'ds-card', 'ds-badge', 'ds-toast', 'ds-notification-center', 'ds-action-bar'],
-    '--card': ['ds-card', 'ds-notification-center', 'ds-action-bar'],
-    '--border': ['ds-input', 'ds-card', 'ds-notification-center', 'ds-action-bar'],
-    '--space-1': ['ds-badge'],
-    '--space-2': ['ds-input'],
-    '--space-3': ['ds-button', 'ds-input', 'ds-notification-center', 'ds-action-bar'],
-    '--space-4': ['ds-button', 'ds-input', 'ds-card', 'ds-toast', 'ds-workflow', 'ds-action-bar', 'ds-toast-provider'],
-    '--space-6': ['ds-button', 'ds-card', 'ds-workflow'],
-    '--text-xs': ['ds-badge', 'ds-button'],
-    '--text-sm': ['ds-button', 'ds-input'],
-    '--text-base': ['ds-input'],
-    '--radius': ['ds-button'],
-    '--radius-md': ['ds-input', 'ds-action-bar'],
-    '--radius-lg': ['ds-card'],
-    '--radius-full': ['ds-badge'],
-    '--duration-fast': ['ds-button'],
-    '--duration-normal': ['ds-input', 'ds-workflow', 'ds-action-bar'],
-    '--duration-slow': ['ds-toast'],
-    '--shadow-sm': ['ds-button', 'ds-input'],
-    '--shadow-md': ['ds-card', 'ds-notification-center'],
-    '--shadow-lg': ['ds-toast', 'ds-action-bar'],
-    '--z-popover': ['ds-notification-center'],
-    '--z-toast': ['ds-toast', 'ds-toast-provider'],
-    '--ease-default': ['ds-button', 'ds-workflow'],
-    '--muted-foreground': ['ds-input', 'ds-workflow'],
-    '--input': ['ds-input']
-  },
-
-  /**
-   * Accessibility requirements matrix
-   */
-  a11yRequirements: {
-    'ds-button': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: ['Enter', 'Space'],
-      ariaRoles: ['button (implicit)'],
-      screenReaderSupport: true
-    },
-    'ds-input': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: ['Tab', 'Arrow keys'],
-      ariaRoles: ['textbox (implicit)'],
-      screenReaderSupport: true
-    },
-    'ds-card': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: [],
-      ariaRoles: ['article', 'section'],
-      screenReaderSupport: true
-    },
-    'ds-badge': {
-      wcagLevel: 'AA',
-      contrastRatio: 3,
-      keyboardSupport: [],
-      ariaRoles: ['status (implicit)'],
-      screenReaderSupport: true
-    },
-    'ds-toast': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: ['Escape'],
-      ariaRoles: ['alert'],
-      screenReaderSupport: true
-    },
-    'ds-workflow': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: ['Tab', 'Arrow keys'],
-      ariaRoles: [],
-      screenReaderSupport: true
-    },
-    'ds-notification-center': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: ['Tab', 'Arrow keys', 'Enter'],
-      ariaRoles: ['region'],
-      screenReaderSupport: true
-    },
-    'ds-action-bar': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: ['Tab', 'Space/Enter'],
-      ariaRoles: ['toolbar'],
-      screenReaderSupport: true
-    },
-    'ds-toast-provider': {
-      wcagLevel: 'AA',
-      contrastRatio: 4.5,
-      keyboardSupport: [],
-      ariaRoles: [],
-      screenReaderSupport: true
-    }
-  }
-};
-
-/**
- * Export utility functions for working with definitions
- */
-
-export function getComponentDefinition(componentName) {
-  return componentDefinitions.components[componentName];
-}
-
-export function getComponentVariantCount(componentName) {
-  const def = getComponentDefinition(componentName);
-  return def ? def.variantCombinations : 0;
-}
-
-export function getTotalVariants() {
-  return componentDefinitions.summary.totalVariants;
-}
-
-export function getTokensForComponent(componentName) {
-  const def = getComponentDefinition(componentName);
-  return def ? def.tokens : {};
-}
-
-export function getComponentsUsingToken(tokenName) {
-  return componentDefinitions.tokenDependencies[tokenName] || [];
-}
-
-export function validateComponentDefinition(componentName) {
-  const def = getComponentDefinition(componentName);
-  if (!def) return { valid: false, errors: ['Component not found'] };
-
-  const errors = [];
-
-  if (!def.name) errors.push('Missing name');
-  if (!def.variants) errors.push('Missing variants');
-  if (!def.tokens) errors.push('Missing tokens');
-  if (!def.a11y) errors.push('Missing a11y info');
-  if (def.darkMode && !Array.isArray(def.darkMode.colorOverrides)) {
-    errors.push('Invalid darkMode.colorOverrides');
-  }
-
-  return {
-    valid: errors.length === 0,
-    errors
-  };
-}
-
-export default componentDefinitions;
diff --git a/admin-ui/js/core/config-loader.js b/admin-ui/js/core/config-loader.js
deleted file mode 100644
index e12f4a4..0000000
--- a/admin-ui/js/core/config-loader.js
+++ /dev/null
@@ -1,128 +0,0 @@
-/**
- * Configuration Loader - Secure Configuration Loading Pattern
- *
- * This implements the expert-recommended blocking initialization pattern:
- * 1. loadConfig() fetches from /api/config and stores it
- * 2. getConfig() returns config or throws if not loaded
- * 3. Application only initializes after loadConfig() completes
- *
- * This prevents race conditions where components try to access config
- * before it's been fetched from the server.
- */
-
-/**
- * Module-scoped variable to hold the fetched server configuration.
- * @type {Object|null}
- */
-let serverConfig = null;
-
-/**
- * Fetches configuration from the server and stores it.
- * This MUST be called before the application initializes any components
- * that depend on the configuration.
- *
- * @async
- * @returns {Promise<void>}
- * @throws {Error} If the config endpoint is unreachable or returns an error
- */
-export async function loadConfig() {
-  // Prevent double-loading
-  if (serverConfig) {
-    console.warn('[ConfigLoader] Configuration already loaded.');
-    return;
-  }
-
-  try {
-    const response = await fetch('/api/config');
-
-    if (!response.ok) {
-      throw new Error(`Server returned status ${response.status}: ${response.statusText}`);
-    }
-
-    serverConfig = await response.json();
-
-    console.log('[ConfigLoader] Configuration loaded successfully', {
-      dssHost: serverConfig.dssHost,
-      dssPort: serverConfig.dssPort,
-      storybookPort: serverConfig.storybookPort,
-    });
-
-  } catch (error) {
-    console.error('[ConfigLoader] Failed to load configuration:', error);
-    // Re-throw to be caught by the bootstrap function
-    throw new Error(`Failed to load server configuration: ${error.message}`);
-  }
-}
-
-/**
- * Returns the entire configuration object.
- * MUST ONLY be called after loadConfig() has completed successfully.
- *
- * @returns {Object} The server configuration
- * @throws {Error} If called before loadConfig() has completed
- */
-export function getConfig() {
-  if (!serverConfig) {
-    throw new Error('[ConfigLoader] getConfig() called before configuration was loaded. Did you forget to await loadConfig()?');
-  }
-  return serverConfig;
-}
-
-/**
- * Convenience getter for just the DSS host.
- * @returns {string} The DSS host
- */
-export function getDssHost() {
-  const config = getConfig();
-  return config.dssHost;
-}
-
-/**
- * Convenience getter for DSS port.
- * @returns {string} The DSS port
- */
-export function getDssPort() {
-  const config = getConfig();
-  return config.dssPort;
-}
-
-/**
- * Convenience getter for Storybook port.
- * @returns {number} The Storybook port (always 6006)
- */
-export function getStorybookPort() {
-  const config = getConfig();
-  return config.storybookPort;
-}
-
-/**
- * Builds the full Storybook URL from config.
- * Points to Storybook running on port 6006 on the current host.
- *
- * @returns {string} The full Storybook URL (e.g., "http://dss.overbits.luz.uy:6006")
- */
-export function getStorybookUrl() {
-  const dssHost = getDssHost();
-  const protocol = window.location.protocol; // "http:" or "https:"
-  // Point to Storybook on port 6006
-  return `${protocol}//${dssHost}:6006`;
-}
-
-/**
- * TESTING ONLY: Reset the configuration state
- * This allows tests to load different configurations
- * @internal
- */
-export function __resetForTesting() {
-  serverConfig = null;
-}
-
-export default {
-  loadConfig,
-  getConfig,
-  getDssHost,
-  getDssPort,
-  getStorybookPort,
-  getStorybookUrl,
-  __resetForTesting,
-};
diff --git a/admin-ui/js/core/debug-inspector.js b/admin-ui/js/core/debug-inspector.js
deleted file mode 100644
index e40cae4..0000000
--- a/admin-ui/js/core/debug-inspector.js
+++ /dev/null
@@ -1,320 +0,0 @@
-/**
- * DSS Debug Inspector
- * 
- * Exposes DSS internal debugging tools to browser console.
- * Allows self-inspection and troubleshooting without external tools.
- * 
- * Usage in browser console:
- * - window.__DSS_DEBUG.auditLogger.getLogs()
- * - window.__DSS_DEBUG.workflowPersistence.getSnapshots()
- * - window.__DSS_DEBUG.errorRecovery.getCrashReport()
- * 
- * Access keyboard shortcut (when implemented):
- * - Ctrl+Alt+D to open Debug Inspector UI
- */
-
-class DebugInspector {
-  constructor() {
-    this.auditLogger = null;
-    this.workflowPersistence = null;
-    this.errorRecovery = null;
-    this.routeGuards = null;
-    this.initialized = false;
-  }
-
-  /**
-   * Initialize debug inspector with system modules
-   * Call this after all modules are loaded
-   */
-  initialize(auditLogger, workflowPersistence, errorRecovery, routeGuards) {
-    this.auditLogger = auditLogger;
-    this.workflowPersistence = workflowPersistence;
-    this.errorRecovery = errorRecovery;
-    this.routeGuards = routeGuards;
-    this.initialized = true;
-
-    console.log(
-      '%c[DSS Debug Inspector] Initialized',
-      'color: #0066FF; font-weight: bold;'
-    );
-    console.log(
-      '%cAccess debugging tools: window.__DSS_DEBUG',
-      'color: #666; font-style: italic;'
-    );
-
-    return this;
-  }
-
-  /**
-   * Quick diagnostic report
-   */
-  quickDiagnosis() {
-    if (!this.initialized) {
-      return { error: 'Debug inspector not initialized' };
-    }
-
-    const recentLogs = this.auditLogger.getLogs().slice(-20);
-    const snapshots = this.workflowPersistence.getSnapshots();
-    const crashReport = this.errorRecovery.getCrashReport();
-    const stats = this.auditLogger.getStats();
-
-    return {
-      timestamp: new Date().toISOString(),
-      url: window.location.href,
-      
-      // Current state
-      currentSnapshot: snapshots.length > 0 ? snapshots[snapshots.length - 1] : null,
-      
-      // Recent activity
-      recentActions: recentLogs.slice(-10).map(log => ({
-        action: log.action,
-        level: log.level,
-        category: log.category,
-        timestamp: new Date(log.timestamp).toLocaleTimeString()
-      })),
-      
-      // Error status
-      hasCrash: crashReport.crashDetected,
-      lastError: crashReport.crashDetected ? {
-        category: crashReport.errorCategory,
-        message: crashReport.error?.message
-      } : null,
-      
-      // Stats
-      totalLogsRecorded: stats.total,
-      logsByCategory: stats.byCategory,
-      logsByLevel: stats.byLevel,
-      
-      // Recovery
-      availableRecoveryPoints: crashReport.recoveryPoints?.length || 0,
-      savedSnapshots: snapshots.length
-    };
-  }
-
-  /**
-   * Get formatted console output
-   */
-  printDiagnosis() {
-    const diagnosis = this.quickDiagnosis();
-
-    if (diagnosis.error) {
-      console.error(`%c❌ ${diagnosis.error}`, 'color: #FF0000; font-weight: bold;');
-      return;
-    }
-
-    console.group('%c📊 DSS Diagnostic Report', 'color: #0066FF; font-weight: bold; font-size: 14px;');
-
-    // Current state
-    console.group('%cCurrent State', 'color: #FF6B00; font-weight: bold;');
-    console.log('User:', diagnosis.currentSnapshot?.state?.user);
-    console.log('Team:', diagnosis.currentSnapshot?.state?.team);
-    console.log('Current Page:', diagnosis.currentSnapshot?.state?.currentPage);
-    console.log('Figma Connected:', diagnosis.currentSnapshot?.state?.figmaConnected);
-    console.groupEnd();
-
-    // Recent activity
-    console.group('%cRecent Activity (Last 10)', 'color: #00B600; font-weight: bold;');
-    console.table(diagnosis.recentActions);
-    console.groupEnd();
-
-    // Error status
-    if (diagnosis.hasCrash) {
-      console.group('%c⚠️ Crash Detected', 'color: #FF0000; font-weight: bold;');
-      console.log('Category:', diagnosis.lastError.category);
-      console.log('Message:', diagnosis.lastError.message);
-      console.log('Recovery Points Available:', diagnosis.availableRecoveryPoints);
-      console.groupEnd();
-    } else {
-      console.log('%c✅ No crashes detected', 'color: #00B600;');
-    }
-
-    // Stats
-    console.group('%cStatistics', 'color: #666; font-weight: bold;');
-    console.log('Total Logs:', diagnosis.totalLogsRecorded);
-    console.table(diagnosis.logsByCategory);
-    console.groupEnd();
-
-    console.groupEnd();
-
-    return diagnosis;
-  }
-
-  /**
-   * Search audit logs with flexible filtering
-   */
-  findLogs(pattern) {
-    if (!this.auditLogger) {
-      console.error('Audit logger not initialized');
-      return [];
-    }
-
-    const allLogs = this.auditLogger.getLogs();
-
-    if (typeof pattern === 'string') {
-      // Search by action or message content
-      return allLogs.filter(log =>
-        log.action.includes(pattern) ||
-        JSON.stringify(log.details).toLowerCase().includes(pattern.toLowerCase())
-      );
-    } else if (typeof pattern === 'object') {
-      // Filter by object criteria
-      return allLogs.filter(log => {
-        for (const [key, value] of Object.entries(pattern)) {
-          if (key === 'timeRange') {
-            if (log.timestamp < value.start || log.timestamp > value.end) {
-              return false;
-            }
-          } else if (log[key] !== value && log.details[key] !== value) {
-            return false;
-          }
-        }
-        return true;
-      });
-    }
-
-    return [];
-  }
-
-  /**
-   * Get performance metrics from audit logs
-   */
-  getPerformanceMetrics() {
-    if (!this.auditLogger) {
-      return { error: 'Audit logger not initialized' };
-    }
-
-    const apiCalls = this.auditLogger.getLogs({
-      action: 'api_call'
-    });
-
-    const slowCalls = apiCalls.filter(log => log.details.duration > 1000);
-    const failedCalls = apiCalls.filter(log => log.details.status >= 400);
-
-    return {
-      totalApiCalls: apiCalls.length,
-      averageResponseTime: apiCalls.reduce((sum, log) => sum + (log.details.duration || 0), 0) / apiCalls.length || 0,
-      slowCalls: slowCalls.length,
-      failedCalls: failedCalls.length,
-      slowCallDetails: slowCalls.map(log => ({
-        endpoint: log.details.endpoint,
-        method: log.details.method,
-        duration: log.details.duration,
-        status: log.details.status
-      })),
-      failedCallDetails: failedCalls.map(log => ({
-        endpoint: log.details.endpoint,
-        method: log.details.method,
-        status: log.details.status,
-        error: log.details.error
-      }))
-    };
-  }
-
-  /**
-   * Export all debugging data
-   */
-  exportDebugData() {
-    if (!this.initialized) {
-      console.error('Debug inspector not initialized');
-      return null;
-    }
-
-    const data = {
-      timestamp: new Date().toISOString(),
-      url: window.location.href,
-      browser: navigator.userAgent,
-      
-      auditLogs: this.auditLogger.getLogs(),
-      auditStats: this.auditLogger.getStats(),
-      
-      snapshots: this.workflowPersistence.getSnapshots(),
-      
-      crashReport: this.errorRecovery.getCrashReport(),
-      
-      performance: this.getPerformanceMetrics(),
-      
-      diagnosis: this.quickDiagnosis()
-    };
-
-    // Copy to clipboard
-    const json = JSON.stringify(data, null, 2);
-    if (navigator.clipboard) {
-      navigator.clipboard.writeText(json).then(() => {
-        console.log('%c✅ Debug data copied to clipboard', 'color: #00B600; font-weight: bold;');
-      });
-    }
-
-    return data;
-  }
-
-  /**
-   * Print helpful guide
-   */
-  help() {
-    console.log(`
-%c╔════════════════════════════════════════════╗
-║    DSS Debug Inspector - Quick Reference    ║
-╚════════════════════════════════════════════╝
-
-%c📊 DIAGNOSTICS
-%c  __DSS_DEBUG.printDiagnosis()
-%c  Shows quick overview of system state, recent activity, errors
-
-%c🔍 SEARCH & FILTER
-%c  __DSS_DEBUG.findLogs('action-name')
-%c  __DSS_DEBUG.findLogs({ action: 'api_call', level: 'error' })
-%c  Find logs by string pattern or filter object
-
-%c💾 SNAPSHOTS
-%c  __DSS_DEBUG.workflowPersistence.getSnapshots()
-%c  __DSS_DEBUG.workflowPersistence.restoreSnapshot('id')
-%c  View and restore application state
-
-%c⚠️ ERRORS & RECOVERY
-%c  __DSS_DEBUG.errorRecovery.getCrashReport()
-%c  __DSS_DEBUG.errorRecovery.recover('recovery-point-id')
-%c  Analyze crashes and recover to known good state
-
-%c⚡ PERFORMANCE
-%c  __DSS_DEBUG.getPerformanceMetrics()
-%c  Get API response times, slow calls, failures
-
-%c📥 EXPORT
-%c  __DSS_DEBUG.exportDebugData()
-%c  Export everything for offline analysis (copies to clipboard)
-
-%cFor detailed documentation, see:
-%c  .dss/DSS_SELF_DEBUG_METHODOLOGY.md
-    `,
-      'color: #0066FF; font-weight: bold; font-size: 12px;',
-      'color: #FF6B00; font-weight: bold;',
-      'color: #666;',
-      'color: #0066FF; font-weight: bold;',
-      'color: #FF6B00; font-weight: bold;',
-      'color: #666;',
-      'color: #0066FF; font-weight: bold;',
-      'color: #FF6B00; font-weight: bold;',
-      'color: #666;',
-      'color: #0066FF; font-weight: bold;',
-      'color: #FF6B00; font-weight: bold;',
-      'color: #666;',
-      'color: #0066FF; font-weight: bold;',
-      'color: #FF6B00; font-weight: bold;',
-      'color: #666;',
-      'color: #0066FF; font-weight: bold;',
-      'color: #FF6B00; font-weight: bold;',
-      'color: #666;',
-      'color: #666; font-style: italic;'
-    );
-  }
-}
-
-// Export singleton instance
-export const debugInspector = new DebugInspector();
-
-// Make available globally
-if (typeof window !== 'undefined') {
-  window.__DSS_DEBUG = debugInspector;
-}
-
-export default debugInspector;
diff --git a/admin-ui/js/core/error-handler.js b/admin-ui/js/core/error-handler.js
deleted file mode 100644
index 2c8224f..0000000
--- a/admin-ui/js/core/error-handler.js
+++ /dev/null
@@ -1,301 +0,0 @@
-/**
- * DSS Error Handler
- *
- * Converts technical errors into user-friendly, actionable messages.
- * Integrates with the messaging system for structured error reporting.
- *
- * @module error-handler
- */
-
-import { notifyError, ErrorCode } from './messaging.js';
-
-/**
- * Error message templates with user-friendly descriptions
- */
-const errorMessages = {
-  // Figma API Errors
-  figma_403: {
-    title: 'Access Denied',
-    message: 'Cannot access the Figma file. Your access credentials lack permission.',
-    actions: [
-      'Verify your Figma authentication token in Settings',
-      'Confirm you have access to this file in Figma',
-      'Check if the file still exists',
-    ],
-    code: ErrorCode.FIGMA_API_ERROR,
-  },
-  figma_404: {
-    title: 'File Not Found',
-    message: 'The Figma file doesn\'t exist or is inaccessible.',
-    actions: [
-      'Double-check your Figma file key in Settings',
-      'Verify the file hasn\'t been deleted in Figma',
-      'Confirm you have access to the file in Figma',
-    ],
-    code: ErrorCode.FIGMA_API_ERROR,
-  },
-  figma_401: {
-    title: 'Authentication Failed',
-    message: 'Figma authentication failed. Your access token is invalid or expired.',
-    actions: [
-      'Refresh your Figma authentication token in Settings',
-      'Get a fresh token from figma.com/settings (Account -> Personal Access Tokens)',
-      'Ensure you copied the full token without truncation',
-    ],
-    code: ErrorCode.FIGMA_CONNECTION_FAILED,
-  },
-  figma_429: {
-    title: 'Rate Limit Exceeded',
-    message: 'Too many requests. Figma\'s rate limits have been triggered.',
-    actions: [
-      'Wait 1-2 minutes before trying again',
-      'Reduce how frequently you extract data',
-    ],
-    code: ErrorCode.FIGMA_API_ERROR,
-  },
-  figma_500: {
-    title: 'Figma Server Error',
-    message: 'Figma\'s servers are experiencing issues. This is external to DSS.',
-    actions: [
-      'Wait and try again later',
-      'Check Figma status: status.figma.com',
-    ],
-    code: ErrorCode.FIGMA_API_ERROR,
-  },
-  figma_demo: {
-    title: 'Invalid Configuration',
-    message: 'The Figma file key is configured to "demo" which doesn\'t exist in Figma.',
-    actions: [
-      'Update Settings with your real Figma file key',
-      'Find your file key in the Figma URL: figma.com/file/[FILE_KEY]/...',
-      'Use the Figma file selector in Settings',
-    ],
-    code: ErrorCode.FIGMA_INVALID_KEY,
-  },
-
-  // API Connection Errors
-  api_network: {
-    title: 'Server Not Responding',
-    message: 'Cannot connect to the DSS server.',
-    actions: [
-      'Verify the server is running: curl http://localhost:3456/health',
-      'Restart the server: ./scripts/dss start',
-      'Check your network connection',
-    ],
-    code: ErrorCode.SYSTEM_NETWORK,
-  },
-  api_timeout: {
-    title: 'Request Timeout',
-    message: 'The server took too long to respond.',
-    actions: [
-      'Try again in a few moments',
-      'Check the server logs: ./scripts/dss logs',
-      'Try processing smaller batches',
-    ],
-    code: ErrorCode.API_TIMEOUT,
-  },
-  api_500: {
-    title: 'Server Error',
-    message: 'The server encountered an error while processing your request.',
-    actions: [
-      'Check the server logs: ./scripts/dss logs',
-      'Retry the operation',
-      'Report the issue if it persists',
-    ],
-    code: ErrorCode.API_SERVER_ERROR,
-  },
-
-  // Validation Errors
-  validation_missing_field: {
-    title: 'Missing Required Field',
-    message: 'The configuration is missing required information.',
-    actions: [
-      'Fill in all fields marked as required',
-      'Ensure each input field contains valid information',
-    ],
-    code: ErrorCode.VALIDATION_MISSING_FIELD,
-  },
-  validation_invalid_format: {
-    title: 'Invalid Format',
-    message: 'One or more configuration values have an invalid format.',
-    actions: [
-      'Verify URLs start with http:// or https://',
-      'Check email addresses follow standard format',
-      'Ensure file keys contain only letters, numbers, and hyphens',
-    ],
-    code: ErrorCode.VALIDATION_INVALID_FORMAT,
-  },
-
-  // Generic fallback
-  unknown: {
-    title: 'Unexpected Error',
-    message: 'An unexpected problem occurred.',
-    actions: [
-      'Try the operation again',
-      'Refresh the page if the issue persists',
-      'Check browser console for details',
-    ],
-    code: ErrorCode.SYSTEM_UNEXPECTED,
-  },
-};
-
-/**
- * Parse error and return user-friendly message
- * @param {Error} error - The error to parse
- * @param {Object} context - Additional context (operation, endpoint, etc.)
- * @returns {Object} Parsed error with user-friendly message
- */
-export function parseError(error, context = {}) {
-  const errorStr = error.message || String(error);
-
-  // Figma API Errors
-  if (context.service === 'figma' || errorStr.includes('figma.com')) {
-    // Demo file key
-    if (context.fileKey === 'demo' || errorStr.includes('/demo/')) {
-      return errorMessages.figma_demo;
-    }
-
-    // HTTP status codes
-    if (errorStr.includes('403')) {
-      return errorMessages.figma_403;
-    }
-    if (errorStr.includes('404')) {
-      return errorMessages.figma_404;
-    }
-    if (errorStr.includes('401')) {
-      return errorMessages.figma_401;
-    }
-    if (errorStr.includes('429')) {
-      return errorMessages.figma_429;
-    }
-    if (errorStr.includes('500') || errorStr.includes('502') || errorStr.includes('503')) {
-      return errorMessages.figma_500;
-    }
-  }
-
-  // Network Errors
-  if (errorStr.includes('NetworkError') || errorStr.includes('Failed to fetch')) {
-    return errorMessages.api_network;
-  }
-
-  // Timeout Errors
-  if (errorStr.includes('timeout') || errorStr.includes('Timeout')) {
-    return errorMessages.api_timeout;
-  }
-
-  // API Server Errors
-  if (errorStr.includes('500') || errorStr.includes('Internal Server Error')) {
-    return errorMessages.api_500;
-  }
-
-  // Validation Errors
-  if (errorStr.includes('required') || errorStr.includes('missing')) {
-    return errorMessages.validation_missing_field;
-  }
-  if (errorStr.includes('invalid') || errorStr.includes('format')) {
-    return errorMessages.validation_invalid_format;
-  }
-
-  // Fallback
-  return errorMessages.unknown;
-}
-
-/**
- * Format user-friendly error message
- * @param {Object} parsedError - Parsed error from parseError()
- * @returns {string} Formatted message
- */
-export function formatErrorMessage(parsedError) {
-  let message = `${parsedError.title}\n\n${parsedError.message}`;
-
-  if (parsedError.actions && parsedError.actions.length > 0) {
-    message += '\n\nWhat to do:\n';
-    parsedError.actions.forEach((action, index) => {
-      message += `${index + 1}. ${action}\n`;
-    });
-  }
-
-  return message.trim();
-}
-
-/**
- * Handle error and notify user with friendly message
- * @param {Error} error - The error to handle
- * @param {Object} context - Additional context
- * @param {string} context.operation - What operation failed (e.g., "extract tokens")
- * @param {string} context.service - Which service (e.g., "figma")
- * @param {string} context.fileKey - Figma file key if applicable
- */
-export function handleError(error, context = {}) {
-  const parsed = parseError(error, context);
-
-  // Create user-friendly message
-  let userMessage = parsed.title;
-
-  if (parsed.actions && parsed.actions.length > 0) {
-    userMessage += '. ' + parsed.actions[0]; // Show first action in notification
-  }
-
-  // Notify user with structured error
-  notifyError(userMessage, parsed.code, {
-    operation: context.operation,
-    service: context.service,
-    originalError: error.message,
-    actions: parsed.actions,
-  });
-
-  // Log full details to console for debugging
-  console.group(`[ERROR] ${parsed.title}`);
-  console.log('Message:', parsed.message);
-  if (parsed.actions) {
-    console.log('Actions:', parsed.actions);
-  }
-  console.log('Context:', context);
-  console.log('Original Error:', error);
-  console.groupEnd();
-
-  return parsed;
-}
-
-/**
- * Try-catch wrapper with automatic error handling
- * @param {Function} fn - Async function to execute
- * @param {Object} context - Error context
- * @returns {Promise<*>} Result of function or null on error
- */
-export async function tryWithErrorHandling(fn, context = {}) {
-  try {
-    return await fn();
-  } catch (error) {
-    handleError(error, context);
-    return null;
-  }
-}
-
-/**
- * Get user-friendly HTTP status message
- * @param {number} status - HTTP status code
- * @returns {string} User-friendly message
- */
-export function getStatusMessage(status) {
-  const messages = {
-    400: 'Bad Request - invalid input data',
-    401: 'Authentication Failed - invalid credentials',
-    403: 'Access Forbidden - permission denied',
-    404: 'Not Found - resource doesn\'t exist',
-    429: 'Rate Limited - too many requests',
-    500: 'Server Error - internal processing failure',
-    502: 'Bad Gateway - server not responding',
-    503: 'Service Unavailable - temporarily unable to handle requests',
-  };
-
-  return messages[status] || `Unknown Error - HTTP ${status}`;
-}
-
-export default {
-  parseError,
-  formatErrorMessage,
-  handleError,
-  tryWithErrorHandling,
-  getStatusMessage,
-};
diff --git a/admin-ui/js/core/error-recovery.js b/admin-ui/js/core/error-recovery.js
deleted file mode 100644
index 89bd33c..0000000
--- a/admin-ui/js/core/error-recovery.js
+++ /dev/null
@@ -1,266 +0,0 @@
-/**
- * Error Recovery - Phase 8 Enterprise Pattern
- *
- * Handles crashes, recovers lost state, and provides
- * resilience against errors and edge cases.
- */
-
-import store from '../stores/app-store.js';
-import auditLogger from './audit-logger.js';
-import persistence from './workflow-persistence.js';
-
-class ErrorRecovery {
-  constructor() {
-    this.errorHandlers = new Map();
-    this.recoveryPoints = [];
-    this.maxRecoveryPoints = 5;
-    this.setupGlobalErrorHandlers();
-  }
-
-  /**
-   * Setup global error handlers
-   */
-  setupGlobalErrorHandlers() {
-    // Unhandled promise rejections
-    window.addEventListener('unhandledrejection', (event) => {
-      this.handleError(event.reason, 'unhandled_promise');
-      // Prevent default error handling
-      event.preventDefault();
-    });
-
-    // Global errors
-    window.addEventListener('error', (event) => {
-      this.handleError(event.error, 'global_error');
-    });
-
-    // Log before unload (potential crash)
-    window.addEventListener('beforeunload', () => {
-      persistence.saveSnapshot();
-      auditLogger.logAction('session_end', {
-        cleanShutdown: true
-      });
-    });
-  }
-
-  /**
-   * Register error handler for specific error type
-   */
-  registerHandler(errorType, handler) {
-    this.handlers.set(errorType, handler);
-  }
-
-  /**
-   * Create recovery point
-   */
-  createRecoveryPoint(label = '') {
-    const point = {
-      id: `recovery-${Date.now()}`,
-      label,
-      timestamp: new Date().toISOString(),
-      snapshot: persistence.snapshot(),
-      logs: auditLogger.getLogs({ limit: 50 }),
-      state: store.get()
-    };
-
-    this.recoveryPoints.unshift(point);
-    if (this.recoveryPoints.length > this.maxRecoveryPoints) {
-      this.recoveryPoints.pop();
-    }
-
-    auditLogger.logAction('recovery_point_created', { label });
-    return point.id;
-  }
-
-  /**
-   * Get recovery points
-   */
-  getRecoveryPoints() {
-    return this.recoveryPoints;
-  }
-
-  /**
-   * Recover from recovery point
-   */
-  recover(pointId) {
-    const point = this.recoveryPoints.find(p => p.id === pointId);
-    if (!point) {
-      auditLogger.logWarning('Recovery point not found', { pointId });
-      return false;
-    }
-
-    try {
-      // Restore workflow state
-      persistence.restoreSnapshot(point.snapshot.id);
-      auditLogger.logAction('recovered_from_point', {
-        pointId,
-        label: point.label
-      });
-      return true;
-    } catch (e) {
-      this.handleError(e, 'recovery_failed');
-      return false;
-    }
-  }
-
-  /**
-   * Check if app is in crashed state
-   */
-  detectCrash() {
-    const lastSnapshot = persistence.getLatestSnapshot();
-    if (!lastSnapshot) return false;
-
-    const lastActivityTime = new Date(lastSnapshot.timestamp);
-    const now = new Date();
-    const timeSinceLastActivity = now - lastActivityTime;
-
-    // If no activity in last 5 minutes and session started, likely crashed
-    return timeSinceLastActivity > 5 * 60 * 1000;
-  }
-
-  /**
-   * Main error handler
-   */
-  handleError(error, context = 'unknown') {
-    const errorId = auditLogger.logError(error, context);
-
-    // Create recovery point before handling
-    const recoveryId = this.createRecoveryPoint(`Error recovery: ${context}`);
-
-    // Categorize error
-    const category = this.categorizeError(error);
-
-    // Apply recovery strategy
-    const recovery = this.getRecoveryStrategy(category);
-    if (recovery) {
-      recovery.execute(error, store, auditLogger);
-    }
-
-    // Notify user
-    this.notifyUser(error, category, errorId);
-
-    return { errorId, recoveryId, category };
-  }
-
-  /**
-   * Categorize error
-   */
-  categorizeError(error) {
-    if (error.message.includes('Network')) return 'network';
-    if (error.message.includes('timeout')) return 'timeout';
-    if (error.message.includes('Permission')) return 'permission';
-    if (error.message.includes('Authentication')) return 'auth';
-    if (error.message.includes('not found')) return 'notfound';
-    return 'unknown';
-  }
-
-  /**
-   * Get recovery strategy for error category
-   */
-  getRecoveryStrategy(category) {
-    const strategies = {
-      network: {
-        execute: (error, store, logger) => {
-          store.notify('Network error - retrying...', 'warning');
-          logger.logWarning('Network error detected', { retrying: true });
-        },
-        retryable: true
-      },
-      timeout: {
-        execute: (error, store, logger) => {
-          store.notify('Request timeout - please try again', 'warning');
-          logger.logWarning('Request timeout', { timeout: true });
-        },
-        retryable: true
-      },
-      auth: {
-        execute: (error, store, logger) => {
-          store.notify('Authentication required - redirecting to login', 'error');
-          window.location.hash = '#/login';
-        },
-        retryable: false
-      },
-      permission: {
-        execute: (error, store, logger) => {
-          store.notify('Access denied', 'error');
-          logger.logWarning('Permission denied', { error: error.message });
-        },
-        retryable: false
-      },
-      notfound: {
-        execute: (error, store, logger) => {
-          store.notify('Resource not found', 'warning');
-        },
-        retryable: false
-      }
-    };
-
-    return strategies[category] || strategies.unknown;
-  }
-
-  /**
-   * Notify user of error
-   */
-  notifyUser(error, category, errorId) {
-    const messages = {
-      network: 'Network connection error. Please check your internet.',
-      timeout: 'Request took too long. Please try again.',
-      permission: 'You do not have permission to perform this action.',
-      auth: 'Your session has expired. Please log in again.',
-      notfound: 'The resource you requested could not be found.',
-      unknown: 'An unexpected error occurred. Please try again.'
-    };
-
-    const message = messages[category] || messages.unknown;
-    store.notify(`${message} (Error: ${errorId})`, 'error', 5000);
-  }
-
-  /**
-   * Retry operation with exponential backoff
-   */
-  async retry(operation, maxRetries = 3, initialDelay = 1000) {
-    for (let i = 0; i < maxRetries; i++) {
-      try {
-        return await operation();
-      } catch (e) {
-        if (i === maxRetries - 1) {
-          throw e;
-        }
-        const delay = initialDelay * Math.pow(2, i);
-        await new Promise(resolve => setTimeout(resolve, delay));
-        auditLogger.logWarning('Retrying operation', { attempt: i + 1, maxRetries });
-      }
-    }
-  }
-
-  /**
-   * Get crash report
-   */
-  getCrashReport() {
-    const logs = auditLogger.getLogs();
-    const errorLogs = logs.filter(l => l.level === 'error');
-
-    return {
-      timestamp: new Date().toISOString(),
-      sessionId: auditLogger.sessionId,
-      totalErrors: errorLogs.length,
-      errors: errorLogs.slice(0, 10),
-      recoveryPoints: this.recoveryPoints,
-      lastSnapshot: persistence.getLatestSnapshot(),
-      statistics: auditLogger.getStats()
-    };
-  }
-
-  /**
-   * Export crash report
-   */
-  exportCrashReport() {
-    const report = this.getCrashReport();
-    return JSON.stringify(report, null, 2);
-  }
-}
-
-// Create and export singleton
-const errorRecovery = new ErrorRecovery();
-
-export { ErrorRecovery };
-export default errorRecovery;
diff --git a/admin-ui/js/core/generate-variants.js b/admin-ui/js/core/generate-variants.js
deleted file mode 100644
index 9f71e62..0000000
--- a/admin-ui/js/core/generate-variants.js
+++ /dev/null
@@ -1,322 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Variant Generation Script
- * Generates variants.css from component definitions
- */
-
-// Since we can't easily use ES6 imports in Node, we'll inline the generation logic
-const fs = require('fs');
-const path = require('path');
-
-// Load component definitions
-const defsPath = path.join(__dirname, 'component-definitions.js');
-const defsContent = fs.readFileSync(defsPath, 'utf8');
-
-// Extract just the object definition, removing exports and functions
-let cleanedContent = defsContent
-  .replace(/^export const componentDefinitions = /m, 'const componentDefinitions = ')
-  .replace(/export function .+?\n\}/gs, '') // Remove export functions
-  .replace(/^export default.+$/m, ''); // Remove default export
-
-// Parse and eval (in real production code, use proper parsing)
-let componentDefinitions;
-eval(cleanedContent);
-
-// Generate CSS header
-function generateHeader() {
-  const timestamp = new Date().toISOString();
-  const totalVariants = componentDefinitions.summary.totalVariants;
-  const totalComponents = Object.keys(componentDefinitions.components).length;
-  const totalTestCases = componentDefinitions.summary.totalTestCases;
-
-  return `/**
- * Auto-Generated Component Variants CSS
- *
- * Generated: ${timestamp}
- * Source: /admin-ui/js/core/component-definitions.js
- * Generator: /admin-ui/js/core/generate-variants.js
- *
- * This file contains CSS for:
- * - ${totalVariants} total component variant combinations
- * - ${totalComponents} components
- * - ${totalTestCases} test cases worth of coverage
- * - Full dark mode support
- * - WCAG 2.1 AA accessibility compliance
- *
- * DO NOT EDIT MANUALLY - Regenerate using: node admin-ui/js/core/generate-variants.js
- */
-`;
-}
-
-// Generate token fallbacks
-function generateTokenFallbacks() {
-  const css = [];
-  css.push(`/* Design Token Fallback System */`);
-  css.push(`/* Ensures components work even if tokens aren't loaded */\n`);
-
-  css.push(`:root {`);
-
-  // Color tokens
-  css.push(`  /* Color Tokens */`);
-  css.push(`  --primary: #3b82f6;`);
-  css.push(`  --secondary: #6b7280;`);
-  css.push(`  --destructive: #dc2626;`);
-  css.push(`  --success: #10b981;`);
-  css.push(`  --warning: #f59e0b;`);
-  css.push(`  --info: #0ea5e9;`);
-  css.push(`  --foreground: #1a1a1a;`);
-  css.push(`  --muted-foreground: #6b7280;`);
-  css.push(`  --card: white;`);
-  css.push(`  --input: white;`);
-  css.push(`  --border: #e5e7eb;`);
-  css.push(`  --muted: #f3f4f6;`);
-  css.push(`  --ring: #3b82f6;`);
-
-  // Spacing tokens
-  css.push(`\n  /* Spacing Tokens */`);
-  for (let i = 0; i <= 24; i++) {
-    const value = `${i * 0.25}rem`;
-    css.push(`  --space-${i}: ${value};`);
-  }
-
-  // Typography tokens
-  css.push(`\n  /* Typography Tokens */`);
-  css.push(`  --text-xs: 0.75rem;`);
-  css.push(`  --text-sm: 0.875rem;`);
-  css.push(`  --text-base: 1rem;`);
-  css.push(`  --text-lg: 1.125rem;`);
-  css.push(`  --text-xl: 1.25rem;`);
-  css.push(`  --text-2xl: 1.75rem;`);
-  css.push(`  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;`);
-  css.push(`  --font-mono: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;`);
-  css.push(`  --font-light: 300;`);
-  css.push(`  --font-normal: 400;`);
-  css.push(`  --font-medium: 500;`);
-  css.push(`  --font-semibold: 600;`);
-  css.push(`  --font-bold: 700;`);
-
-  // Radius tokens
-  css.push(`\n  /* Radius Tokens */`);
-  css.push(`  --radius-sm: 4px;`);
-  css.push(`  --radius-md: 8px;`);
-  css.push(`  --radius-lg: 12px;`);
-  css.push(`  --radius-full: 9999px;`);
-
-  // Timing tokens
-  css.push(`\n  /* Timing Tokens */`);
-  css.push(`  --duration-fast: 0.1s;`);
-  css.push(`  --duration-normal: 0.2s;`);
-  css.push(`  --duration-slow: 0.5s;`);
-  css.push(`  --ease-default: ease;`);
-  css.push(`  --ease-in: ease-in;`);
-  css.push(`  --ease-out: ease-out;`);
-
-  // Shadow tokens
-  css.push(`\n  /* Shadow Tokens */`);
-  css.push(`  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);`);
-  css.push(`  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);`);
-  css.push(`  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);`);
-
-  // Z-index tokens
-  css.push(`\n  /* Z-Index Tokens */`);
-  css.push(`  --z-base: 0;`);
-  css.push(`  --z-dropdown: 1000;`);
-  css.push(`  --z-popover: 1001;`);
-  css.push(`  --z-toast: 1100;`);
-  css.push(`  --z-modal: 1200;`);
-
-  css.push(`}`);
-
-  return css.join('\n');
-}
-
-// Generate dark mode overrides
-function generateDarkModeOverrides() {
-  return `:root.dark {
-  /* Dark Mode Color Overrides */
-  --foreground: #e5e5e5;
-  --muted-foreground: #9ca3af;
-  --card: #1f2937;
-  --input: #1f2937;
-  --border: #374151;
-  --muted: #111827;
-  --ring: #60a5fa;
-}`;
-}
-
-// Generate component variants
-function generateComponentVariants() {
-  const sections = [];
-
-  Object.entries(componentDefinitions.components).forEach(([componentKey, def]) => {
-    sections.push(`\n/* ============================================ */`);
-    sections.push(`/* ${def.name} Component - ${def.variantCombinations} Variants × ${def.stateCount} States */`);
-    sections.push(`/* ============================================ */\n`);
-
-    // Base styles
-    sections.push(`${def.cssClass} {`);
-    sections.push(`  /* Base styles using design tokens */`);
-    sections.push(`  box-sizing: border-box;`);
-    if (def.tokens.color) {
-      sections.push(`  color: var(--foreground, inherit);`);
-    }
-    if (def.tokens.radius) {
-      sections.push(`  border-radius: var(--radius-md, 6px);`);
-    }
-    sections.push(`  transition: all var(--duration-normal, 0.2s) var(--ease-default, ease);`);
-    sections.push(`}`);
-
-    // Variant documentation
-    if (def.variants) {
-      sections.push(`\n/* Variants: ${Object.entries(def.variants).map(([k, v]) => `${k}=[${v.join('|')}]`).join(', ')} */`);
-    }
-
-    // State documentation
-    if (def.states) {
-      sections.push(`/* States: ${def.states.join(', ')} */`);
-    }
-
-    // Dark mode support note
-    if (def.darkMode && def.darkMode.support) {
-      sections.push(`/* Dark mode: supported (colors: ${def.darkMode.colorOverrides.join(', ')}) */`);
-    }
-
-    sections.push(``);
-  });
-
-  return sections.join('\n');
-}
-
-// Generate accessibility utilities
-function generateA11yUtilities() {
-  return `
-
-/* ============================================ */
-/* Accessibility Utilities */
-/* ============================================ */
-
-/* Screen reader only */
-.sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border-width: 0;
-}
-
-/* Focus visible (keyboard navigation) */
-*:focus-visible {
-  outline: 2px solid var(--ring, #3b82f6);
-  outline-offset: 2px;
-}
-
-/* Reduced motion */
-@media (prefers-reduced-motion: reduce) {
-  *,
-  *::before,
-  *::after {
-    animation-duration: 0.01ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: 0.01ms !important;
-  }
-}
-
-/* High contrast mode */
-@media (prefers-contrast: more) {
-  * {
-    border-width: 1px;
-  }
-}`;
-}
-
-// Generate animations
-function generateAnimations() {
-  return `
-
-/* ============================================ */
-/* Animation Definitions */
-/* ============================================ */
-
-@keyframes slideIn {
-  from {
-    opacity: 0;
-    transform: translateY(-10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes slideOut {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(-10px);
-  }
-}
-
-@keyframes fadeIn {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fadeOut {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
-@keyframes spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
-}
-
-.animate-in {
-  animation: slideIn var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-out {
-  animation: slideOut var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-fade-in {
-  animation: fadeIn var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-fade-out {
-  animation: fadeOut var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-spin {
-  animation: spin 1s linear infinite;
-}`;
-}
-
-// Generate complete CSS
-const cssOutput = [
-  generateHeader(),
-  generateTokenFallbacks(),
-  generateComponentVariants(),
-  generateDarkModeOverrides(),
-  generateA11yUtilities(),
-  generateAnimations(),
-].join('\n');
-
-// Write to file
-const outputPath = path.join(__dirname, '..', '..', 'css', 'variants.css');
-fs.writeFileSync(outputPath, cssOutput, 'utf8');
-
-console.log(`✅ Generated: ${outputPath}`);
-console.log(`📊 File size: ${(cssOutput.length / 1024).toFixed(1)} KB`);
-console.log(`📝 Lines: ${cssOutput.split('\n').length}`);
-console.log(`🎯 Components: ${Object.keys(componentDefinitions.components).length}`);
-console.log(`📈 Variants: ${componentDefinitions.summary.totalVariants}`);
-console.log(`✔️  Tests: ${componentDefinitions.summary.totalTestCases}`);
diff --git a/admin-ui/js/core/landing-page.js b/admin-ui/js/core/landing-page.js
deleted file mode 100644
index 5eae005..0000000
--- a/admin-ui/js/core/landing-page.js
+++ /dev/null
@@ -1,224 +0,0 @@
-/**
- * admin-ui/js/core/landing-page.js
- * Manages the landing page that displays all available dashboards
- */
-
-const DASHBOARDS = [
-  {
-    id: 'dashboard',
-    category: 'Overview',
-    icon: '📊',
-    title: 'Dashboard',
-    description: 'System overview and key metrics',
-    href: '#dashboard'
-  },
-  {
-    id: 'projects',
-    category: 'Overview',
-    icon: '📁',
-    title: 'Projects',
-    description: 'Manage and organize projects',
-    href: '#projects'
-  },
-  {
-    id: 'services',
-    category: 'Tools',
-    icon: '⚙️',
-    title: 'Services',
-    description: 'Manage system services and endpoints',
-    href: '#services'
-  },
-  {
-    id: 'quick-wins',
-    category: 'Tools',
-    icon: '⭐',
-    title: 'Quick Wins',
-    description: 'Quick optimization opportunities',
-    href: '#quick-wins'
-  },
-  {
-    id: 'chat',
-    category: 'Tools',
-    icon: '💬',
-    title: 'Chat',
-    description: 'AI-powered chat assistant',
-    href: '#chat'
-  },
-  {
-    id: 'tokens',
-    category: 'Design System',
-    icon: '🎨',
-    title: 'Tokens',
-    description: 'Design tokens and variables',
-    href: '#tokens'
-  },
-  {
-    id: 'components',
-    category: 'Design System',
-    icon: '🧩',
-    title: 'Components',
-    description: 'Reusable component library',
-    href: '#components'
-  },
-  {
-    id: 'figma',
-    category: 'Design System',
-    icon: '🎭',
-    title: 'Figma',
-    description: 'Figma integration and sync',
-    href: '#figma'
-  },
-  {
-    id: 'storybook',
-    category: 'Design System',
-    icon: '📚',
-    title: 'Storybook',
-    description: 'Component documentation',
-    href: 'http://localhost:6006',
-    target: '_blank'
-  },
-  {
-    id: 'docs',
-    category: 'System',
-    icon: '📖',
-    title: 'Documentation',
-    description: 'System documentation and guides',
-    href: '#docs'
-  },
-  {
-    id: 'teams',
-    category: 'System',
-    icon: '👥',
-    title: 'Teams',
-    description: 'Team management and permissions',
-    href: '#teams'
-  },
-  {
-    id: 'audit',
-    category: 'System',
-    icon: '✅',
-    title: 'Audit',
-    description: 'Audit logs and system events',
-    href: '#audit'
-  },
-  {
-    id: 'plugins',
-    category: 'System',
-    icon: '🔌',
-    title: 'Plugins',
-    description: 'Plugin management system',
-    href: '#plugins'
-  },
-  {
-    id: 'settings',
-    category: 'System',
-    icon: '⚡',
-    title: 'Settings',
-    description: 'System configuration and preferences',
-    href: '#settings'
-  }
-];
-
-class LandingPage {
-  constructor(appElement) {
-    this.app = appElement;
-    this.landingPage = null;
-    this.pageContent = null;
-    this.init();
-  }
-
-  init() {
-    this.landingPage = this.app.querySelector('#landing-page');
-    this.pageContent = this.app.querySelector('#page-content');
-    
-    if (this.landingPage) {
-      this.render();
-      this.bindEvents();
-    }
-    
-    // Listen for hash changes
-    window.addEventListener('hashchange', () => this.handleRouteChange());
-    this.handleRouteChange();
-  }
-
-  handleRouteChange() {
-    const hash = window.location.hash.substring(1) || '';
-    const isLanding = hash === '' || hash === 'landing';
-    
-    if (this.landingPage) {
-      this.landingPage.classList.toggle('active', isLanding);
-    }
-    
-    if (this.pageContent) {
-      this.pageContent.style.display = isLanding ? 'none' : 'block';
-    }
-  }
-
-  render() {
-    if (!this.landingPage) return;
-    
-    const categories = this.groupByCategory();
-    
-    this.landingPage.innerHTML = `
-      <div class="landing-hero">
-        <h1>Design System Server</h1>
-        <p>Welcome to your design system management interface. Select a dashboard to get started.</p>
-      </div>
-      
-      <div class="landing-content">
-        ${Object.entries(categories)
-          .map(([category, dashboards]) => `
-            <div class="dashboard-category">
-              <h2 class="dashboard-category__title">${category}</h2>
-              <div class="dashboard-grid">
-                ${dashboards
-                  .map(d => `
-                    <a href="${d.href}" class="dashboard-card" ${d.target ? `target="${d.target}"` : ''} data-page="${d.id}">
-                      <div class="dashboard-card__icon">${d.icon}</div>
-                      <div class="dashboard-card__content">
-                        <h3 class="dashboard-card__title">${d.title}</h3>
-                        <p class="dashboard-card__description">${d.description}</p>
-                      </div>
-                      <div class="dashboard-card__meta">
-                        <span>→</span>
-                      </div>
-                    </a>
-                  `)
-                  .join('')}
-              </div>
-            </div>
-          `)
-          .join('')}
-      </div>
-    `;
-  }
-
-  groupByCategory() {
-    const grouped = {};
-    
-    DASHBOARDS.forEach(dashboard => {
-      if (!grouped[dashboard.category]) {
-        grouped[dashboard.category] = [];
-      }
-      grouped[dashboard.category].push(dashboard);
-    });
-    
-    return grouped;
-  }
-
-  bindEvents() {
-    const cards = this.landingPage.querySelectorAll('.dashboard-card');
-    cards.forEach(card => {
-      card.addEventListener('click', (e) => {
-        // Allow external links (Storybook) to open normally
-        if (card.target === '_blank') {
-          return;
-        }
-        e.preventDefault();
-        window.location.hash = card.getAttribute('href').substring(1);
-      });
-    });
-  }
-}
-
-export default LandingPage;
diff --git a/admin-ui/js/core/layout-manager.js b/admin-ui/js/core/layout-manager.js
deleted file mode 100644
index ab0fc3d..0000000
--- a/admin-ui/js/core/layout-manager.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * layout-manager.js
- * Manages workdesk switching and layout state
- */
-
-class LayoutManager {
-  constructor() {
-    this.currentWorkdesk = null;
-    this.workdesks = new Map();
-    this.shell = null;
-  }
-
-  /**
-   * Initialize the layout manager with a shell instance
-   */
-  init(shell) {
-    this.shell = shell;
-  }
-
-  /**
-   * Register a workdesk class for a team
-   */
-  registerWorkdesk(teamId, WorkdeskClass) {
-    this.workdesks.set(teamId, WorkdeskClass);
-  }
-
-  /**
-   * Switch to a different team's workdesk
-   */
-  async switchWorkdesk(teamId) {
-    if (!this.shell) {
-      throw new Error('LayoutManager not initialized with shell');
-    }
-
-    // Cleanup current workdesk
-    if (this.currentWorkdesk) {
-      this.currentWorkdesk.destroy();
-      this.currentWorkdesk = null;
-    }
-
-    // Load workdesk class if not already registered
-    if (!this.workdesks.has(teamId)) {
-      try {
-        const module = await import(`../workdesks/${teamId}-workdesk.js`);
-        this.registerWorkdesk(teamId, module.default);
-      } catch (error) {
-        console.error(`Failed to load workdesk for team ${teamId}:`, error);
-        throw error;
-      }
-    }
-
-    // Create new workdesk instance
-    const WorkdeskClass = this.workdesks.get(teamId);
-    this.currentWorkdesk = new WorkdeskClass(this.shell);
-
-    // Render the workdesk
-    this.currentWorkdesk.render();
-
-    return this.currentWorkdesk;
-  }
-
-  /**
-   * Get the current active workdesk
-   */
-  getCurrentWorkdesk() {
-    return this.currentWorkdesk;
-  }
-
-  /**
-   * Clean up all workdesks
-   */
-  destroy() {
-    if (this.currentWorkdesk) {
-      this.currentWorkdesk.destroy();
-      this.currentWorkdesk = null;
-    }
-    this.workdesks.clear();
-  }
-}
-
-// Singleton instance
-const layoutManager = new LayoutManager();
-
-export default layoutManager;
diff --git a/admin-ui/js/core/logger.js b/admin-ui/js/core/logger.js
deleted file mode 100644
index 25cc954..0000000
--- a/admin-ui/js/core/logger.js
+++ /dev/null
@@ -1,183 +0,0 @@
-/**
- * DSS Logger - Structured Logging System
- *
- * Provides structured logging with categories and levels for the DSS admin UI.
- *
- * Log Categories:
- *   'storage'       - Database operations and data persistence
- *   'validation'    - Validation, analysis, and decision making
- *   'api'           - API calls, webhooks, communication
- *   'parser'        - Data ingestion, parsing, transformation
- *   'tokens'        - Design token flow and distribution
- *   'transform'     - Style-dictionary transformations
- *   'config'        - Theme system and configuration
- *   'security'      - Validation, error detection, security
- *   'assets'        - Asset loading, Figma integration
- *   'ui'            - UI rendering, Storybook output
- *   'schema'        - Schema and structure validation
- */
-
-const LOG_LEVELS = {
-  DEBUG: 0,
-  INFO: 1,
-  WARN: 2,
-  ERROR: 3,
-  NONE: 4
-};
-
-class Logger {
-  constructor(name = 'DSS', level = 'INFO') {
-    this.name = name;
-    this.level = LOG_LEVELS[level] || LOG_LEVELS.INFO;
-    this.logs = [];
-    this.maxLogs = 1000;
-    this.remoteLoggingEnabled = false;
-  }
-
-  setLevel(level) {
-    this.level = LOG_LEVELS[level] || LOG_LEVELS.INFO;
-  }
-
-  enableRemoteLogging() {
-    this.remoteLoggingEnabled = true;
-  }
-
-  _shouldLog(level) {
-    return LOG_LEVELS[level] >= this.level;
-  }
-
-  _formatMessage(level, category, message, data) {
-    const timestamp = new Date().toISOString();
-    return {
-      timestamp,
-      level,
-      category,
-      name: this.name,
-      message,
-      data
-    };
-  }
-
-  _log(level, category, message, data = null) {
-    if (!this._shouldLog(level)) return;
-
-    const logEntry = this._formatMessage(level, category, message, data);
-
-    // Store in memory
-    this.logs.push(logEntry);
-    if (this.logs.length > this.maxLogs) {
-      this.logs.shift();
-    }
-
-    const levelIcons = {
-      DEBUG: '[D]',
-      INFO: '[I]',
-      WARN: '[W]',
-      ERROR: '[E]'
-    };
-
-    const colors = {
-      DEBUG: 'color: #666; font-style: italic',
-      INFO: 'color: #2196F3; font-weight: bold',
-      WARN: 'color: #FF9800; font-weight: bold',
-      ERROR: 'color: #F44336; font-weight: bold'
-    };
-
-    const icon = levelIcons[level] || '[?]';
-    const prefix = `${icon} [${category}]`;
-    const style = colors[level] || '';
-
-    if (data) {
-      console.log(`%c${prefix} ${message}`, style, data);
-    } else {
-      console.log(`%c${prefix} ${message}`, style);
-    }
-
-    // Remote logging (if enabled)
-    if (this.remoteLoggingEnabled && level === 'ERROR') {
-      this._sendToServer(logEntry);
-    }
-  }
-
-  async _sendToServer(logEntry) {
-    try {
-      await fetch('/api/logs', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(logEntry)
-      });
-    } catch (e) {
-      // Fail silently for logging errors
-    }
-  }
-
-  /**
-   * DEBUG - Detailed internal information
-   */
-  debug(category, message, data) {
-    this._log('DEBUG', category, message, data);
-  }
-
-  /**
-   * INFO - General information
-   */
-  info(category, message, data) {
-    this._log('INFO', category, message, data);
-  }
-
-  /**
-   * WARN - Warning, something unusual detected
-   */
-  warn(category, message, data) {
-    this._log('WARN', category, message, data);
-  }
-
-  /**
-   * ERROR - Error, something went wrong
-   */
-  error(category, message, data) {
-    this._log('ERROR', category, message, data);
-  }
-
-  /**
-   * Get recent log entries
-   */
-  getRecentLogs(count = 50) {
-    return this.logs.slice(-count);
-  }
-
-  /**
-   * Clear all logs
-   */
-  clear() {
-    this.logs = [];
-  }
-
-  /**
-   * Export logs to file
-   */
-  export() {
-    const dataStr = JSON.stringify(this.logs, null, 2);
-    const dataUri = 'data:application/json;charset=utf-8,' + encodeURIComponent(dataStr);
-
-    const exportFileDefaultName = `dss-logs-${Date.now()}.json`;
-
-    const linkElement = document.createElement('a');
-    linkElement.setAttribute('href', dataUri);
-    linkElement.setAttribute('download', exportFileDefaultName);
-    linkElement.click();
-  }
-}
-
-/**
- * DSS Logger singleton
- */
-const logger = new Logger('DSS', 'INFO');
-
-// Set log level from localStorage or URL param
-const urlParams = new URLSearchParams(window.location.search);
-const logLevel = urlParams.get('log') || localStorage.getItem('dss_log_level') || 'INFO';
-logger.setLevel(logLevel.toUpperCase());
-
-export default logger;
-export { Logger, LOG_LEVELS };
diff --git a/admin-ui/js/core/messaging.js b/admin-ui/js/core/messaging.js
deleted file mode 100644
index 1362418..0000000
--- a/admin-ui/js/core/messaging.js
+++ /dev/null
@@ -1,324 +0,0 @@
-/**
- * DSS Notification Service
- *
- * Centralized messaging system with structured formats, error taxonomy,
- * and correlation IDs for enterprise-grade error tracking and user feedback.
- *
- * @module messaging
- */
-
-// Event bus for pub/sub notifications
-const bus = new EventTarget();
-
-// Event name constant
-export const NOTIFICATION_EVENT = 'dss-notification';
-
-/**
- * Notification severity types
- */
-export const NotificationType = {
-  SUCCESS: 'success',
-  ERROR: 'error',
-  WARNING: 'warning',
-  INFO: 'info',
-};
-
-/**
- * Error taxonomy for structured error handling
- */
-export const ErrorCode = {
-  // User errors (E1xxx)
-  USER_INPUT_INVALID: 'E1001',
-  USER_ACTION_FORBIDDEN: 'E1002',
-  USER_NOT_AUTHENTICATED: 'E1003',
-
-  // Validation errors (E2xxx)
-  VALIDATION_FAILED: 'E2001',
-  VALIDATION_MISSING_FIELD: 'E2002',
-  VALIDATION_INVALID_FORMAT: 'E2003',
-
-  // API errors (E3xxx)
-  API_REQUEST_FAILED: 'E3001',
-  API_TIMEOUT: 'E3002',
-  API_UNAUTHORIZED: 'E3003',
-  API_NOT_FOUND: 'E3004',
-  API_SERVER_ERROR: 'E3005',
-
-  // System errors (E4xxx)
-  SYSTEM_UNEXPECTED: 'E4001',
-  SYSTEM_NETWORK: 'E4002',
-  SYSTEM_STORAGE: 'E4003',
-
-  // Integration errors (E5xxx)
-  FIGMA_CONNECTION_FAILED: 'E5001',
-  FIGMA_INVALID_KEY: 'E5002',
-  FIGMA_API_ERROR: 'E5003',
-
-  // Success codes (S1xxx)
-  SUCCESS_OPERATION: 'S1001',
-  SUCCESS_CREATED: 'S1002',
-  SUCCESS_UPDATED: 'S1003',
-  SUCCESS_DELETED: 'S1004',
-};
-
-/**
- * Generate correlation ID for request tracking
- * @returns {string} UUID v4 correlation ID
- */
-function generateCorrelationId() {
-  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
-    const r = Math.random() * 16 | 0;
-    const v = c === 'x' ? r : (r & 0x3 | 0x8);
-    return v.toString(16);
-  });
-}
-
-/**
- * Message queue for persistence
- */
-class MessageQueue {
-  constructor(maxSize = 50) {
-    this.maxSize = maxSize;
-    this.storageKey = 'dss_message_queue';
-  }
-
-  /**
-   * Add message to queue
-   * @param {Object} message - Notification message
-   */
-  add(message) {
-    try {
-      const queue = this.getAll();
-      queue.unshift(message);
-
-      // Keep only last maxSize messages
-      const trimmed = queue.slice(0, this.maxSize);
-
-      localStorage.setItem(this.storageKey, JSON.stringify(trimmed));
-    } catch (error) {
-      console.warn('Failed to persist message to queue:', error);
-    }
-  }
-
-  /**
-   * Get all messages from queue
-   * @returns {Array} Array of messages
-   */
-  getAll() {
-    try {
-      const data = localStorage.getItem(this.storageKey);
-      return data ? JSON.parse(data) : [];
-    } catch (error) {
-      console.warn('Failed to read message queue:', error);
-      return [];
-    }
-  }
-
-  /**
-   * Clear the message queue
-   */
-  clear() {
-    try {
-      localStorage.removeItem(this.storageKey);
-    } catch (error) {
-      console.warn('Failed to clear message queue:', error);
-    }
-  }
-
-  /**
-   * Get recent errors for debugging
-   * @param {number} limit - Max number of errors to return
-   * @returns {Array} Recent error messages
-   */
-  getRecentErrors(limit = 10) {
-    const queue = this.getAll();
-    return queue
-      .filter(msg => msg.type === NotificationType.ERROR)
-      .slice(0, limit);
-  }
-}
-
-// Singleton message queue
-const messageQueue = new MessageQueue();
-
-/**
- * Send a notification
- *
- * @param {Object} detail - Notification details
- * @param {string} detail.message - User-facing message
- * @param {NotificationType} [detail.type=INFO] - Notification type
- * @param {string} [detail.code] - Machine-readable error code
- * @param {Object} [detail.metadata] - Additional context for logging
- * @param {string} [detail.correlationId] - Optional correlation ID (auto-generated if not provided)
- * @param {number} [detail.duration] - Auto-dismiss duration in ms (0 = no auto-dismiss)
- *
- * @example
- * notify({
- *   message: 'Project created successfully',
- *   type: NotificationType.SUCCESS,
- *   code: ErrorCode.SUCCESS_CREATED,
- *   metadata: { projectId: 'demo-ds' }
- * });
- *
- * @example
- * notify({
- *   message: 'Failed to connect to Figma',
- *   type: NotificationType.ERROR,
- *   code: ErrorCode.FIGMA_CONNECTION_FAILED,
- *   metadata: { fileKey: 'abc123', endpoint: '/figma/file' },
- *   correlationId: 'custom-id-123'
- * });
- */
-export function notify(detail) {
-  const notification = {
-    id: generateCorrelationId(),
-    message: detail.message,
-    type: detail.type || NotificationType.INFO,
-    code: detail.code || null,
-    metadata: detail.metadata || {},
-    correlationId: detail.correlationId || generateCorrelationId(),
-    timestamp: new Date().toISOString(),
-    duration: detail.duration !== undefined ? detail.duration : 5000, // Default 5s
-  };
-
-  // Persist to queue
-  messageQueue.add(notification);
-
-  // Dispatch event
-  bus.dispatchEvent(new CustomEvent(NOTIFICATION_EVENT, {
-    detail: notification
-  }));
-
-  // Log for debugging
-  const logMethod = notification.type === NotificationType.ERROR ? 'error' : 'log';
-  console[logMethod]('[DSS Notification]', {
-    message: notification.message,
-    code: notification.code,
-    correlationId: notification.correlationId,
-    metadata: notification.metadata,
-  });
-
-  return notification;
-}
-
-/**
- * Subscribe to notifications
- *
- * @param {Function} callback - Called when notification is sent
- * @returns {Function} Unsubscribe function
- *
- * @example
- * const unsubscribe = subscribe((notification) => {
- *   console.log('Notification:', notification.message);
- * });
- *
- * // Later: unsubscribe();
- */
-export function subscribe(callback) {
-  const handler = (event) => callback(event.detail);
-  bus.addEventListener(NOTIFICATION_EVENT, handler);
-
-  // Return unsubscribe function
-  return () => {
-    bus.removeEventListener(NOTIFICATION_EVENT, handler);
-  };
-}
-
-/**
- * Helper: Send success notification
- * @param {string} message - Success message
- * @param {string} [code] - Success code
- * @param {Object} [metadata] - Additional context
- */
-export function notifySuccess(message, code = ErrorCode.SUCCESS_OPERATION, metadata = {}) {
-  return notify({
-    message,
-    type: NotificationType.SUCCESS,
-    code,
-    metadata,
-  });
-}
-
-/**
- * Helper: Send error notification
- * @param {string} message - Error message
- * @param {string} [code] - Error code
- * @param {Object} [metadata] - Additional context
- */
-export function notifyError(message, code = ErrorCode.SYSTEM_UNEXPECTED, metadata = {}) {
-  return notify({
-    message,
-    type: NotificationType.ERROR,
-    code,
-    metadata,
-    duration: 0, // Errors don't auto-dismiss
-  });
-}
-
-/**
- * Helper: Send warning notification
- * @param {string} message - Warning message
- * @param {Object} [metadata] - Additional context
- */
-export function notifyWarning(message, metadata = {}) {
-  return notify({
-    message,
-    type: NotificationType.WARNING,
-    metadata,
-    duration: 7000, // Warnings stay a bit longer
-  });
-}
-
-/**
- * Helper: Send info notification
- * @param {string} message - Info message
- * @param {Object} [metadata] - Additional context
- */
-export function notifyInfo(message, metadata = {}) {
-  return notify({
-    message,
-    type: NotificationType.INFO,
-    metadata,
-  });
-}
-
-/**
- * Get message history
- * @returns {Array} All persisted messages
- */
-export function getMessageHistory() {
-  return messageQueue.getAll();
-}
-
-/**
- * Get recent errors for debugging
- * @param {number} limit - Max number of errors
- * @returns {Array} Recent errors
- */
-export function getRecentErrors(limit = 10) {
-  return messageQueue.getRecentErrors(limit);
-}
-
-/**
- * Clear message history
- */
-export function clearMessageHistory() {
-  messageQueue.clear();
-}
-
-// Export singleton queue for advanced use cases
-export { messageQueue };
-
-export default {
-  notify,
-  subscribe,
-  notifySuccess,
-  notifyError,
-  notifyWarning,
-  notifyInfo,
-  getMessageHistory,
-  getRecentErrors,
-  clearMessageHistory,
-  NotificationType,
-  ErrorCode,
-};
diff --git a/admin-ui/js/core/navigation.js b/admin-ui/js/core/navigation.js
deleted file mode 100644
index 2876b51..0000000
--- a/admin-ui/js/core/navigation.js
+++ /dev/null
@@ -1,92 +0,0 @@
-/**
- * admin-ui/js/core/navigation.js
- * Manages active state and keyboard navigation for flat navigation structure.
- */
-class NavigationManager {
-  constructor(navElement) {
-    if (!navElement) return;
-    this.nav = navElement;
-    this.items = Array.from(this.nav.querySelectorAll('.nav-item'));
-
-    this.init();
-  }
-
-  init() {
-    this.bindEvents();
-    this.updateActiveState();
-  }
-
-  bindEvents() {
-    // Listen for navigation changes
-    window.addEventListener('hashchange', this.updateActiveState.bind(this));
-    window.addEventListener('app-navigate', this.updateActiveState.bind(this));
-
-    // Handle keyboard navigation
-    this.nav.addEventListener('keydown', this.onKeyDown.bind(this));
-
-    // Handle manual nav item clicks
-    this.items.forEach(item => {
-      item.addEventListener('click', this.onItemClick.bind(this));
-    });
-  }
-
-  onItemClick(event) {
-    const item = event.currentTarget;
-    const page = item.dataset.page;
-
-    if (page) {
-      window.location.hash = `#${page}`;
-      this.updateActiveState();
-    }
-  }
-
-  updateActiveState() {
-    const currentPage = window.location.hash.substring(1) || 'dashboard';
-
-    this.items.forEach(item => {
-      const itemPage = item.dataset.page;
-      const isActive = itemPage === currentPage;
-      item.classList.toggle('active', isActive);
-
-      // Update aria-current for accessibility
-      if (isActive) {
-        item.setAttribute('aria-current', 'page');
-      } else {
-        item.removeAttribute('aria-current');
-      }
-    });
-  }
-
-  onKeyDown(event) {
-    const activeElement = document.activeElement;
-    if (!this.nav.contains(activeElement)) return;
-
-    const visibleItems = this.items.filter(el => el.offsetParent !== null);
-    const currentIndex = visibleItems.indexOf(activeElement);
-
-    switch (event.key) {
-      case 'ArrowDown':
-        event.preventDefault();
-        if (currentIndex < visibleItems.length - 1) {
-          visibleItems[currentIndex + 1].focus();
-        }
-        break;
-      case 'ArrowUp':
-        event.preventDefault();
-        if (currentIndex > 0) {
-          visibleItems[currentIndex - 1].focus();
-        }
-        break;
-      case 'Enter':
-      case ' ':
-        event.preventDefault();
-        activeElement.click();
-        break;
-      case 'Tab':
-        // Allow default Tab behavior (move to next focusable element)
-        break;
-    }
-  }
-}
-
-export default NavigationManager;
diff --git a/admin-ui/js/core/phase8-enterprise.js b/admin-ui/js/core/phase8-enterprise.js
deleted file mode 100644
index 1e8e8d1..0000000
--- a/admin-ui/js/core/phase8-enterprise.js
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * Phase 8: Enterprise Patterns - Index
- *
- * Consolidates all enterprise-grade patterns for:
- * - Workflow persistence (save/restore state)
- * - Audit logging (track all actions)
- * - Route guards (enforce permissions)
- * - Error recovery (resilience & crash recovery)
- */
-
-export { WorkflowPersistence, default as persistence } from './workflow-persistence.js';
-export { AuditLogger, default as auditLogger } from './audit-logger.js';
-export { RouteGuard, default as routeGuard } from './route-guards.js';
-export { ErrorRecovery, default as errorRecovery } from './error-recovery.js';
-
-// Default export includes all modules
-export default {
-  persistence: () => import('./workflow-persistence.js').then(m => m.default),
-  auditLogger: () => import('./audit-logger.js').then(m => m.default),
-  routeGuard: () => import('./route-guards.js').then(m => m.default),
-  errorRecovery: () => import('./error-recovery.js').then(m => m.default),
-};
diff --git a/admin-ui/js/core/project-selector.js b/admin-ui/js/core/project-selector.js
deleted file mode 100644
index 398d2b2..0000000
--- a/admin-ui/js/core/project-selector.js
+++ /dev/null
@@ -1,74 +0,0 @@
-/**
- * admin-ui/js/core/project-selector.js
- * Manages project selection in the header
- */
-
-class ProjectSelector {
-  constructor(containerElement) {
-    if (!containerElement) return;
-    this.container = containerElement;
-    this.init();
-  }
-
-  init() {
-    this.projects = this.getProjects();
-    this.selectedProject = this.getSelectedProject();
-    this.render();
-    this.bindEvents();
-  }
-
-  getProjects() {
-    // Sample projects - in production these would come from an API
-    return [
-      { id: 'dss', name: 'Design System Server', icon: '🎨' },
-      { id: 'component-library', name: 'Component Library', icon: '📦' },
-      { id: 'tokens-manager', name: 'Tokens Manager', icon: '🎯' },
-      { id: 'figma-sync', name: 'Figma Sync', icon: '🔄' }
-    ];
-  }
-
-  getSelectedProject() {
-    const stored = localStorage.getItem('dss_selected_project');
-    return stored || this.projects[0].id;
-  }
-
-  setSelectedProject(projectId) {
-    this.selectedProject = projectId;
-    localStorage.setItem('dss_selected_project', projectId);
-    
-    // Dispatch custom event
-    window.dispatchEvent(new CustomEvent('project-changed', {
-      detail: { projectId }
-    }));
-  }
-
-  render() {
-    const selectedProject = this.projects.find(p => p.id === this.selectedProject);
-    
-    this.container.innerHTML = `
-      <div class="project-selector">
-        <label for="project-select" class="project-selector__label">Project:</label>
-        <select id="project-select" class="project-selector__select" aria-label="Select project">
-          ${this.projects.map(project => `
-            <option value="${project.id}" ${project.id === this.selectedProject ? 'selected' : ''}>
-              ${project.icon} ${project.name}
-            </option>
-          `).join('')}
-        </select>
-      </div>
-    `;
-  }
-
-  bindEvents() {
-    const select = this.container.querySelector('#project-select');
-    if (select) {
-      select.addEventListener('change', (event) => {
-        this.setSelectedProject(event.target.value);
-        this.render();
-        this.bindEvents();
-      });
-    }
-  }
-}
-
-export default ProjectSelector;
diff --git a/admin-ui/js/core/route-guards.js b/admin-ui/js/core/route-guards.js
deleted file mode 100644
index 971ca18..0000000
--- a/admin-ui/js/core/route-guards.js
+++ /dev/null
@@ -1,179 +0,0 @@
-/**
- * Route Guards - Phase 8 Enterprise Pattern
- *
- * Validates route access, enforces permissions, and handles
- * authentication/authorization before allowing navigation.
- */
-
-import store from '../stores/app-store.js';
-import auditLogger from './audit-logger.js';
-
-class RouteGuard {
-  constructor() {
-    this.guards = new Map();
-    this.setupDefaultGuards();
-  }
-
-  /**
-   * Register a guard for a specific route
-   */
-  register(route, guard) {
-    this.guards.set(route, guard);
-  }
-
-  /**
-   * Check if user can access route
-   */
-  canActivate(route) {
-    const state = store.get();
-
-    // Not authenticated
-    if (!state.user) {
-      auditLogger.logPermissionCheck('route_access', false, 'anonymous', `Unauthenticated access to ${route}`);
-      return {
-        allowed: false,
-        reason: 'User must be logged in',
-        redirect: '/#/login'
-      };
-    }
-
-    // Check route-specific guard
-    const guard = this.guards.get(route);
-    if (guard) {
-      const result = guard(state);
-      if (!result.allowed) {
-        auditLogger.logPermissionCheck('route_access', false, state.user.id, `Access denied to ${route}: ${result.reason}`);
-      }
-      return result;
-    }
-
-    auditLogger.logPermissionCheck('route_access', true, state.user.id, `Access granted to ${route}`);
-    return { allowed: true };
-  }
-
-  /**
-   * Check user permission
-   */
-  hasPermission(permission) {
-    const state = store.get();
-    if (!state.user) {
-      auditLogger.logPermissionCheck('permission_check', false, 'anonymous', `Checking ${permission}`);
-      return false;
-    }
-
-    const allowed = store.hasPermission(permission);
-    auditLogger.logPermissionCheck('permission_check', allowed, state.user.id, `Checking ${permission}`);
-    return allowed;
-  }
-
-  /**
-   * Require permission before action
-   */
-  requirePermission(permission) {
-    if (!this.hasPermission(permission)) {
-      throw new Error(`Permission denied: ${permission}`);
-    }
-    return true;
-  }
-
-  /**
-   * Setup default route guards
-   */
-  setupDefaultGuards() {
-    // Settings page - requires TEAM_LEAD or SUPER_ADMIN
-    this.register('settings', (state) => {
-      const allowed = ['TEAM_LEAD', 'SUPER_ADMIN'].includes(state.role);
-      return {
-        allowed,
-        reason: allowed ? '' : 'Settings access requires team lead or admin role'
-      };
-    });
-
-    // Admin page - requires SUPER_ADMIN
-    this.register('admin', (state) => {
-      const allowed = state.role === 'SUPER_ADMIN';
-      return {
-        allowed,
-        reason: allowed ? '' : 'Admin access requires super admin role'
-      };
-    });
-
-    // Projects page - requires active team
-    this.register('projects', (state) => {
-      const allowed = !!state.team;
-      return {
-        allowed,
-        reason: allowed ? '' : 'Must select a team first'
-      };
-    });
-
-    // Figma integration - requires DEVELOPER or above
-    this.register('figma', (state) => {
-      const allowed = ['DEVELOPER', 'TEAM_LEAD', 'SUPER_ADMIN'].includes(state.role);
-      return {
-        allowed,
-        reason: allowed ? '' : 'Figma integration requires developer or higher role'
-      };
-    });
-  }
-
-  /**
-   * Validate action before execution
-   */
-  validateAction(action, resource) {
-    const state = store.get();
-
-    if (!state.user) {
-      throw new Error('User must be authenticated');
-    }
-
-    const requiredPermission = this.getRequiredPermission(action, resource);
-    if (!this.hasPermission(requiredPermission)) {
-      throw new Error(`Permission denied: ${action} on ${resource}`);
-    }
-
-    auditLogger.logAction(`${action}_${resource}`, {
-      user: state.user.id,
-      role: state.role
-    });
-
-    return true;
-  }
-
-  /**
-   * Map action to required permission
-   */
-  getRequiredPermission(action, resource) {
-    const permissions = {
-      'create_project': 'write',
-      'delete_project': 'write',
-      'sync_figma': 'write',
-      'export_tokens': 'read',
-      'modify_settings': 'write',
-      'manage_team': 'manage_team',
-      'view_audit': 'read',
-    };
-
-    return permissions[`${action}_${resource}`] || 'read';
-  }
-
-  /**
-   * Get all available routes
-   */
-  getRoutes() {
-    return Array.from(this.guards.keys());
-  }
-
-  /**
-   * Check if route is protected
-   */
-  isProtected(route) {
-    return this.guards.has(route);
-  }
-}
-
-// Create and export singleton
-const routeGuard = new RouteGuard();
-
-export { RouteGuard };
-export default routeGuard;
diff --git a/admin-ui/js/core/router.js b/admin-ui/js/core/router.js
deleted file mode 100644
index 3c73619..0000000
--- a/admin-ui/js/core/router.js
+++ /dev/null
@@ -1,449 +0,0 @@
-/**
- * DSS Router
- *
- * Centralized hash-based routing with guards, lifecycle hooks, and
- * declarative route definitions for enterprise-grade navigation management.
- *
- * @module router
- */
-
-import { notifyError, ErrorCode } from './messaging.js';
-
-/**
- * Route configuration object
- * @typedef {Object} RouteConfig
- * @property {string} path - Route path (e.g., '/dashboard', '/projects')
- * @property {string} name - Route name for programmatic navigation
- * @property {Function} handler - Route handler function
- * @property {Function} [beforeEnter] - Guard called before entering route
- * @property {Function} [afterEnter] - Hook called after entering route
- * @property {Function} [onLeave] - Hook called when leaving route
- * @property {Object} [meta] - Route metadata
- */
-
-/**
- * Router class for centralized route management
- */
-class Router {
-  constructor() {
-    this.routes = new Map();
-    this.currentRoute = null;
-    this.previousRoute = null;
-    this.defaultRoute = 'projects'; // Updated default for new architecture
-    this.isNavigating = false;
-
-    // Bind handlers
-    this.handleHashChange = this.handleHashChange.bind(this);
-    this.handlePopState = this.handlePopState.bind(this);
-  }
-
-  /**
-   * Initialize the router
-   */
-  init() {
-    // Register new feature module routes
-    this.registerAll([
-      {
-        path: '/projects',
-        name: 'Projects',
-        handler: () => this.loadModule('dss-projects-module', () => import('../modules/projects/ProjectsModule.js'))
-      },
-      {
-        path: '/config',
-        name: 'Configuration',
-        handler: () => this.loadModule('dss-config-module', () => import('../modules/config/ConfigModule.js'))
-      },
-      {
-        path: '/components',
-        name: 'Components',
-        handler: () => this.loadModule('dss-components-module', () => import('../modules/components/ComponentsModule.js'))
-      },
-      {
-        path: '/translations',
-        name: 'Translations',
-        handler: () => this.loadModule('dss-translations-module', () => import('../modules/translations/TranslationsModule.js'))
-      },
-      {
-        path: '/discovery',
-        name: 'Discovery',
-        handler: () => this.loadModule('dss-discovery-module', () => import('../modules/discovery/DiscoveryModule.js'))
-      },
-      {
-        path: '/admin',
-        name: 'Admin',
-        handler: () => this.loadModule('dss-admin-module', () => import('../modules/admin/AdminModule.js'))
-      }
-    ]);
-
-    // Listen for hash changes
-    window.addEventListener('hashchange', this.handleHashChange);
-    window.addEventListener('popstate', this.handlePopState);
-
-    // Handle initial route
-    this.handleHashChange();
-  }
-
-  /**
-   * Helper to load dynamic modules into the stage
-   * @param {string} tagName - Custom element tag name
-   * @param {Function} importFn - Dynamic import function
-   */
-  async loadModule(tagName, importFn) {
-    try {
-      // 1. Load the module file
-      await importFn();
-
-      // 2. Update the stage content
-      const stageContent = document.querySelector('#stage-workdesk-content');
-      if (stageContent) {
-        stageContent.innerHTML = '';
-        const element = document.createElement(tagName);
-        stageContent.appendChild(element);
-      }
-    } catch (error) {
-      console.error(`Failed to load module ${tagName}:`, error);
-      notifyError(`Failed to load module`, ErrorCode.SYSTEM_UNEXPECTED);
-    }
-  }
-
-  /**
-   * Register a route
-   * @param {RouteConfig} config - Route configuration
-   */
-  register(config) {
-    if (!config.path) {
-      throw new Error('Route path is required');
-    }
-
-    if (!config.handler) {
-      throw new Error('Route handler is required');
-    }
-
-    // Normalize path (remove leading slash for hash routing)
-    const path = config.path.replace(/^\//, '');
-
-    this.routes.set(path, {
-      path,
-      name: config.name || path,
-      handler: config.handler,
-      beforeEnter: config.beforeEnter || null,
-      afterEnter: config.afterEnter || null,
-      onLeave: config.onLeave || null,
-      meta: config.meta || {},
-    });
-
-    return this;
-  }
-
-  /**
-   * Register multiple routes
-   * @param {RouteConfig[]} routes - Array of route configurations
-   */
-  registerAll(routes) {
-    routes.forEach(route => this.register(route));
-    return this;
-  }
-
-  /**
-   * Set default route
-   * @param {string} path - Default route path
-   */
-  setDefaultRoute(path) {
-    this.defaultRoute = path.replace(/^\//, '');
-    return this;
-  }
-
-  /**
-   * Navigate to a route
-   * @param {string} path - Route path or name
-   * @param {Object} [options] - Navigation options
-   * @param {boolean} [options.replace] - Replace history instead of push
-   * @param {Object} [options.state] - State to pass to route
-   */
-  navigate(path, options = {}) {
-    const normalizedPath = path.replace(/^\//, '');
-
-    // Update hash
-    if (options.replace) {
-      window.location.replace(`#${normalizedPath}`);
-    } else {
-      window.location.hash = normalizedPath;
-    }
-
-    return this;
-  }
-
-  /**
-   * Navigate to a route by name
-   * @param {string} name - Route name
-   * @param {Object} [options] - Navigation options
-   */
-  navigateByName(name, options = {}) {
-    const route = Array.from(this.routes.values()).find(r => r.name === name);
-
-    if (!route) {
-      notifyError(`Route not found: ${name}`, ErrorCode.SYSTEM_UNEXPECTED);
-      return this;
-    }
-
-    return this.navigate(route.path, options);
-  }
-
-  /**
-   * Handle hash change event
-   */
-  async handleHashChange() {
-    if (this.isNavigating) return;
-
-    this.isNavigating = true;
-
-    try {
-      // Get path from hash
-      let path = window.location.hash.replace(/^#/, '') || this.defaultRoute;
-
-      // Extract route and params
-      const { routePath, params } = this.parseRoute(path);
-
-      // Find route
-      const route = this.routes.get(routePath);
-
-      if (!route) {
-        console.warn(`Route not registered: ${routePath}, falling back to default`);
-        this.navigate(this.defaultRoute, { replace: true });
-        return;
-      }
-
-      // Call onLeave hook for previous route
-      if (this.currentRoute && this.currentRoute.onLeave) {
-        await this.callHook(this.currentRoute.onLeave, { from: this.currentRoute, to: route });
-      }
-
-      // Call beforeEnter guard
-      if (route.beforeEnter) {
-        const canEnter = await this.callGuard(route.beforeEnter, { route, params });
-
-        if (!canEnter) {
-          // Guard rejected, stay on current route or go to default
-          if (this.currentRoute) {
-            this.navigate(this.currentRoute.path, { replace: true });
-          } else {
-            this.navigate(this.defaultRoute, { replace: true });
-          }
-          return;
-        }
-      }
-
-      // Update route tracking
-      this.previousRoute = this.currentRoute;
-      this.currentRoute = route;
-
-      // Call route handler
-      await route.handler({ route, params, router: this });
-
-      // Call afterEnter hook
-      if (route.afterEnter) {
-        await this.callHook(route.afterEnter, { route, params, from: this.previousRoute });
-      }
-
-      // Emit route change event
-      this.emitRouteChange(route, params);
-
-    } catch (error) {
-      console.error('Router navigation error:', error);
-      notifyError('Navigation failed', ErrorCode.SYSTEM_UNEXPECTED, {
-        path: window.location.hash,
-        error: error.message,
-      });
-    } finally {
-      this.isNavigating = false;
-    }
-  }
-
-  /**
-   * Handle popstate event (browser back/forward)
-   */
-  handlePopState(event) {
-    this.handleHashChange();
-  }
-
-  /**
-   * Parse route path and extract params
-   * @param {string} path - Route path
-   * @returns {Object} Route path and params
-   */
-  parseRoute(path) {
-    // For now, simple implementation - just return the path
-    // Can be extended to support params like '/projects/:id'
-    const [routePath, queryString] = path.split('?');
-
-    const params = {};
-    if (queryString) {
-      new URLSearchParams(queryString).forEach((value, key) => {
-        params[key] = value;
-      });
-    }
-
-    return { routePath, params };
-  }
-
-  /**
-   * Call a route guard
-   * @param {Function} guard - Guard function
-   * @param {Object} context - Guard context
-   * @returns {Promise<boolean>} Whether navigation should proceed
-   */
-  async callGuard(guard, context) {
-    try {
-      const result = await guard(context);
-      return result !== false; // Undefined or true = proceed
-    } catch (error) {
-      console.error('Route guard error:', error);
-      return false;
-    }
-  }
-
-  /**
-   * Call a lifecycle hook
-   * @param {Function} hook - Hook function
-   * @param {Object} context - Hook context
-   */
-  async callHook(hook, context) {
-    try {
-      await hook(context);
-    } catch (error) {
-      console.error('Route hook error:', error);
-    }
-  }
-
-  /**
-   * Emit route change event
-   * @param {Object} route - Current route
-   * @param {Object} params - Route params
-   */
-  emitRouteChange(route, params) {
-    window.dispatchEvent(new CustomEvent('route-changed', {
-      detail: {
-        route,
-        params,
-        previous: this.previousRoute,
-      }
-    }));
-  }
-
-  /**
-   * Get current route
-   * @returns {Object|null} Current route config
-   */
-  getCurrentRoute() {
-    return this.currentRoute;
-  }
-
-  /**
-   * Get previous route
-   * @returns {Object|null} Previous route config
-   */
-  getPreviousRoute() {
-    return this.previousRoute;
-  }
-
-  /**
-   * Check if a route exists
-   * @param {string} path - Route path
-   * @returns {boolean} Whether route exists
-   */
-  hasRoute(path) {
-    const normalizedPath = path.replace(/^\//, '');
-    return this.routes.has(normalizedPath);
-  }
-
-  /**
-   * Get route by path
-   * @param {string} path - Route path
-   * @returns {Object|null} Route config
-   */
-  getRoute(path) {
-    const normalizedPath = path.replace(/^\//, '');
-    return this.routes.get(normalizedPath) || null;
-  }
-
-  /**
-   * Get all routes
-   * @returns {Array} All registered routes
-   */
-  getAllRoutes() {
-    return Array.from(this.routes.values());
-  }
-
-  /**
-   * Go back in history
-   */
-  back() {
-    window.history.back();
-    return this;
-  }
-
-  /**
-   * Go forward in history
-   */
-  forward() {
-    window.history.forward();
-    return this;
-  }
-
-  /**
-   * Destroy the router (cleanup)
-   */
-  destroy() {
-    window.removeEventListener('hashchange', this.handleHashChange);
-    window.removeEventListener('popstate', this.handlePopState);
-    this.routes.clear();
-    this.currentRoute = null;
-    this.previousRoute = null;
-  }
-}
-
-// Singleton instance
-const router = new Router();
-
-// Export both the instance and the class
-export { Router };
-export default router;
-
-/**
- * Common route guards
- */
-export const guards = {
-  /**
-   * Require authentication
-   */
-  requireAuth({ route }) {
-    // Check if user is authenticated
-    // For now, always allow (implement auth later)
-    return true;
-  },
-
-  /**
-   * Require specific permission
-   */
-  requirePermission(permission) {
-    return ({ route }) => {
-      // Check if user has permission
-      // For now, always allow (implement RBAC later)
-      return true;
-    };
-  },
-
-  /**
-   * Require project selected
-   */
-  requireProject({ route, params }) {
-    const projectId = localStorage.getItem('dss_selected_project');
-
-    if (!projectId) {
-      notifyError('Please select a project first', ErrorCode.USER_ACTION_FORBIDDEN);
-      return false;
-    }
-
-    return true;
-  },
-};
diff --git a/admin-ui/js/core/sanitizer.js b/admin-ui/js/core/sanitizer.js
deleted file mode 100644
index 2cd5f3e..0000000
--- a/admin-ui/js/core/sanitizer.js
+++ /dev/null
@@ -1,181 +0,0 @@
-/**
- * HTML Sanitization Module
- *
- * Provides secure HTML rendering with DOMPurify integration.
- * Ensures consistent XSS protection across the application.
- */
-
-/**
- * Sanitize HTML content for safe rendering
- *
- * @param {string} html - HTML to sanitize
- * @param {object} options - DOMPurify options
- * @returns {string} Sanitized HTML
- */
-export function sanitizeHtml(html, options = {}) {
-  const defaultOptions = {
-    ALLOWED_TAGS: [
-      'div', 'span', 'p', 'a', 'button', 'input', 'textarea',
-      'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
-      'ul', 'ol', 'li', 'table', 'tr', 'td', 'th', 'thead', 'tbody',
-      'strong', 'em', 'code', 'pre', 'blockquote',
-      'svg', 'img'
-    ],
-    ALLOWED_ATTR: [
-      'class', 'id', 'style', 'data-*',
-      'href', 'target', 'rel',
-      'type', 'placeholder', 'disabled', 'checked', 'name', 'value',
-      'alt', 'src', 'width', 'height',
-      'aria-label', 'aria-describedby', 'aria-invalid', 'role'
-    ],
-    KEEP_CONTENT: true,
-    RETURN_DOM: false
-  };
-
-  const mergedOptions = { ...defaultOptions, ...options };
-
-  // Use DOMPurify if available (loaded in HTML)
-  if (typeof DOMPurify !== 'undefined') {
-    return DOMPurify.sanitize(html, mergedOptions);
-  }
-
-  // Fallback: escape HTML (basic protection)
-  console.warn('DOMPurify not available, using basic HTML escaping');
-  return escapeHtml(html);
-}
-
-/**
- * Escape HTML special characters (basic XSS protection)
- *
- * @param {string} text - Text to escape
- * @returns {string} Escaped text
- */
-export function escapeHtml(text) {
-  const map = {
-    '&': '&amp;',
-    '<': '&lt;',
-    '>': '&gt;',
-    '"': '&quot;',
-    "'": '&#039;'
-  };
-  return text.replace(/[&<>"']/g, char => map[char]);
-}
-
-/**
- * Safely set innerHTML on an element
- *
- * @param {HTMLElement} element - Target element
- * @param {string} html - HTML to set (will be sanitized)
- * @param {object} options - Sanitization options
- */
-export function setSafeHtml(element, html, options = {}) {
-  if (!element) {
-    console.warn('setSafeHtml: element is null or undefined');
-    return;
-  }
-  element.innerHTML = sanitizeHtml(html, options);
-}
-
-/**
- * Sanitize text for safe display (no HTML)
- *
- * @param {string} text - Text to sanitize
- * @returns {string} Sanitized text
- */
-export function sanitizeText(text) {
-  return escapeHtml(String(text || ''));
-}
-
-/**
- * Sanitize URL for safe linking
- *
- * @param {string} url - URL to sanitize
- * @returns {string} Safe URL or empty string
- */
-export function sanitizeUrl(url) {
-  try {
-    // Only allow safe protocols
-    const allowedProtocols = ['http:', 'https:', 'mailto:', 'tel:', 'data:'];
-    const urlObj = new URL(url, window.location.href);
-
-    if (allowedProtocols.includes(urlObj.protocol)) {
-      return url;
-    }
-
-    console.warn(`Unsafe URL protocol: ${urlObj.protocol}`);
-    return '';
-  } catch (e) {
-    console.warn(`Invalid URL: ${url}`);
-    return '';
-  }
-}
-
-/**
- * Create safe HTML element from template literal
- *
- * Usage:
- *   const html = createSafeHtml`
- *     <div class="card">
- *       <h3>${title}</h3>
- *       <p>${description}</p>
- *     </div>
- *   `;
- *
- * @param {string[]} strings - Template strings
- * @param {...any} values - Interpolated values (will be escaped)
- * @returns {string} Safe HTML
- */
-export function createSafeHtml(strings, ...values) {
-  let result = '';
-
-  for (let i = 0; i < strings.length; i++) {
-    result += strings[i];
-
-    if (i < values.length) {
-      // Escape all interpolated values
-      const value = values[i];
-
-      if (value === null || value === undefined) {
-        result += '';
-      } else if (typeof value === 'object') {
-        result += sanitizeText(JSON.stringify(value));
-      } else {
-        result += sanitizeText(String(value));
-      }
-    }
-  }
-
-  return result;
-}
-
-/**
- * Validate HTML structure without executing scripts
- *
- * @param {string} html - HTML to validate
- * @returns {boolean} True if HTML is well-formed
- */
-export function validateHtml(html) {
-  try {
-    const parser = new DOMParser();
-    const doc = parser.parseFromString(html, 'text/html');
-
-    // Check for parsing errors
-    if (doc.getElementsByTagName('parsererror').length > 0) {
-      return false;
-    }
-
-    return true;
-  } catch (e) {
-    return false;
-  }
-}
-
-export default {
-  sanitizeHtml,
-  escapeHtml,
-  setSafeHtml,
-  sanitizeText,
-  sanitizeUrl,
-  createSafeHtml,
-  validateHtml
-};
diff --git a/admin-ui/js/core/stylesheet-manager.js b/admin-ui/js/core/stylesheet-manager.js
deleted file mode 100644
index 1945b1a..0000000
--- a/admin-ui/js/core/stylesheet-manager.js
+++ /dev/null
@@ -1,268 +0,0 @@
-/**
- * StylesheetManager - Manages shared stylesheets for Web Components
- *
- * Implements constructable stylesheets (CSSStyleSheet API) to:
- * 1. Load CSS files once, not 14+ times per component
- * 2. Share stylesheets across all shadow DOMs
- * 3. Improve component initialization performance 40-60%
- * 4. Maintain CSS encapsulation with shadow DOM
- *
- * Usage:
- *   // In component connectedCallback():
- *   await StylesheetManager.attachStyles(this.shadowRoot, ['tokens', 'components']);
- *
- * Architecture:
- *   - CSS files loaded once and cached in memory
- *   - Parsed into CSSStyleSheet objects
- *   - Adopted by shadow DOM (adoptedStyleSheets API)
- *   - No re-parsing, no duplication
- */
-
-class StylesheetManager {
-  // Cache for loaded stylesheets
-  static #styleCache = new Map();
-
-  // Track loading promises to prevent race conditions
-  static #loadingPromises = new Map();
-
-  // Configuration for stylesheet locations
-  static #config = {
-    tokens: '/admin-ui/css/tokens.css',
-    components: '/admin-ui/css/dss-components.css',
-    integrations: '/admin-ui/css/dss-integrations.css'
-  };
-
-  /**
-   * Load tokens stylesheet (colors, spacing, typography, etc.)
-   * @returns {Promise<CSSStyleSheet>} Pre-parsed stylesheet
-   */
-  static async loadTokens() {
-    return this.#loadStylesheet('tokens', this.#config.tokens);
-  }
-
-  /**
-   * Load components stylesheet (component variant CSS)
-   * @returns {Promise<CSSStyleSheet>} Pre-parsed stylesheet
-   */
-  static async loadComponents() {
-    return this.#loadStylesheet('components', this.#config.components);
-  }
-
-  /**
-   * Load integrations stylesheet (third-party integrations)
-   * @returns {Promise<CSSStyleSheet>} Pre-parsed stylesheet
-   */
-  static async loadIntegrations() {
-    return this.#loadStylesheet('integrations', this.#config.integrations);
-  }
-
-  /**
-   * Load a specific stylesheet by key
-   * @private
-   */
-  static async #loadStylesheet(key, url) {
-    // Return cached stylesheet if already loaded
-    if (this.#styleCache.has(key)) {
-      return this.#styleCache.get(key);
-    }
-
-    // If currently loading, return the in-flight promise
-    if (this.#loadingPromises.has(key)) {
-      return this.#loadingPromises.get(key);
-    }
-
-    // Create loading promise
-    const promise = this.#fetchAndParseStylesheet(key, url);
-    this.#loadingPromises.set(key, promise);
-
-    try {
-      const sheet = await promise;
-      this.#styleCache.set(key, sheet);
-      return sheet;
-    } finally {
-      this.#loadingPromises.delete(key);
-    }
-  }
-
-  /**
-   * Fetch CSS file and parse into CSSStyleSheet
-   * @private
-   */
-  static async #fetchAndParseStylesheet(key, url) {
-    try {
-      const response = await fetch(url);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch ${url}: ${response.statusText}`);
-      }
-
-      const cssText = await response.text();
-
-      // Create and populate CSSStyleSheet using constructable API
-      const sheet = new CSSStyleSheet();
-      await sheet.replace(cssText);
-
-      return sheet;
-    } catch (error) {
-      console.error(`[StylesheetManager] Error loading ${key}:`, error);
-      // Return empty stylesheet as fallback
-      const sheet = new CSSStyleSheet();
-      await sheet.replace('/* Failed to load styles */');
-      return sheet;
-    }
-  }
-
-  /**
-   * Attach stylesheets to a shadow DOM
-   * @param {ShadowRoot} shadowRoot - Shadow DOM to attach styles to
-   * @param {string[]} [keys] - Which stylesheets to attach (default: ['tokens', 'components'])
-   * @returns {Promise<void>}
-   *
-   * Usage:
-   *   await StylesheetManager.attachStyles(this.shadowRoot);
-   *   await StylesheetManager.attachStyles(this.shadowRoot, ['tokens', 'components', 'integrations']);
-   */
-  static async attachStyles(shadowRoot, keys = ['tokens', 'components']) {
-    if (!shadowRoot || !shadowRoot.adoptedStyleSheets) {
-      console.warn('[StylesheetManager] Shadow DOM does not support adoptedStyleSheets');
-      return;
-    }
-
-    try {
-      // Load all requested stylesheets in parallel
-      const sheets = await Promise.all(
-        keys.map(key => {
-          switch (key) {
-            case 'tokens':
-              return this.loadTokens();
-            case 'components':
-              return this.loadComponents();
-            case 'integrations':
-              return this.loadIntegrations();
-            default:
-              console.warn(`[StylesheetManager] Unknown stylesheet key: ${key}`);
-              return null;
-          }
-        })
-      );
-
-      // Filter out null values and set adopted stylesheets
-      const validSheets = sheets.filter(s => s !== null);
-      if (validSheets.length > 0) {
-        shadowRoot.adoptedStyleSheets = [
-          ...shadowRoot.adoptedStyleSheets,
-          ...validSheets
-        ];
-      }
-    } catch (error) {
-      console.error('[StylesheetManager] Error attaching styles:', error);
-    }
-  }
-
-  /**
-   * Pre-load stylesheets at app initialization
-   * Useful for warming cache before first component renders
-   * @returns {Promise<void>}
-   */
-  static async preloadAll() {
-    try {
-      await Promise.all([
-        this.loadTokens(),
-        this.loadComponents(),
-        this.loadIntegrations()
-      ]);
-      console.log('[StylesheetManager] All stylesheets pre-loaded');
-    } catch (error) {
-      console.error('[StylesheetManager] Error pre-loading stylesheets:', error);
-    }
-  }
-
-  /**
-   * Clear cache and reload stylesheets
-   * Useful for development hot-reload scenarios
-   * @returns {Promise<void>}
-   */
-  static async clearCache() {
-    this.#styleCache.clear();
-    this.#loadingPromises.clear();
-    console.log('[StylesheetManager] Cache cleared');
-  }
-
-  /**
-   * Get current cache statistics
-   * @returns {object} Cache info
-   */
-  static getStats() {
-    return {
-      cachedSheets: Array.from(this.#styleCache.keys()),
-      pendingLoads: Array.from(this.#loadingPromises.keys()),
-      totalCached: this.#styleCache.size,
-      totalPending: this.#loadingPromises.size
-    };
-  }
-
-  /**
-   * Check if a stylesheet is cached
-   * @param {string} key - Stylesheet key
-   * @returns {boolean}
-   */
-  static isCached(key) {
-    return this.#styleCache.has(key);
-  }
-
-  /**
-   * Set custom stylesheet URL
-   * @param {string} key - Stylesheet key
-   * @param {string} url - New URL for stylesheet
-   */
-  static setStylesheetUrl(key, url) {
-    if (this.#styleCache.has(key)) {
-      console.warn(`[StylesheetManager] Cannot change URL for already-cached stylesheet: ${key}`);
-      return;
-    }
-    this.#config[key] = url;
-  }
-
-  /**
-   * Export the stylesheet manager instance for global access
-   */
-  static getInstance() {
-    return this;
-  }
-}
-
-// Make available globally
-if (typeof window !== 'undefined') {
-  window.StylesheetManager = StylesheetManager;
-
-  // Pre-load stylesheets when DOM is ready
-  if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', () => {
-      StylesheetManager.preloadAll().catch(e => {
-        console.error('[StylesheetManager] Failed to pre-load on DOMContentLoaded:', e);
-      });
-    });
-  } else {
-    StylesheetManager.preloadAll().catch(e => {
-      console.error('[StylesheetManager] Failed to pre-load:', e);
-    });
-  }
-
-  // Add to debug interface
-  if (!window.__DSS_DEBUG) {
-    window.__DSS_DEBUG = {};
-  }
-
-  window.__DSS_DEBUG.stylesheets = () => {
-    const stats = StylesheetManager.getStats();
-    console.table(stats);
-    return stats;
-  };
-
-  window.__DSS_DEBUG.clearStyleCache = () => {
-    StylesheetManager.clearCache();
-    console.log('Stylesheet cache cleared');
-  };
-}
-
-// Export for module systems
-export default StylesheetManager;
diff --git a/admin-ui/js/core/team-dashboards.js b/admin-ui/js/core/team-dashboards.js
deleted file mode 100644
index cd5003e..0000000
--- a/admin-ui/js/core/team-dashboards.js
+++ /dev/null
@@ -1,459 +0,0 @@
-/**
- * Team-Specific Dashboard Templates
- *
- * Each team (UI, UX, QA) gets a tailored dashboard with relevant metrics and actions
- */
-
-export const UITeamDashboard = (health, stats, discovery, activity, projectName = 'Default Project', dashboardData = {}, projectId = null, app = null) => {
-  const uiData = dashboardData.ui || { token_drift: { total: 0, by_severity: {} }, code_metrics: {} };
-  const tokenDrift = uiData.token_drift || { total: 0, by_severity: {} };
-
-  return `
-  <div class="page-header">
-    <h1>UI Team Dashboard</h1>
-    <p class="text-muted">Component library & Figma sync tools · <strong class="text-primary">${projectName}</strong></p>
-  </div>
-
-  <!-- Key Metrics -->
-  <div class="grid grid-cols-4 gap-4 mt-6">
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Components</div>
-          <div class="stat__value">${stats.components?.total || discovery.files?.components || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Token Drift Issues</div>
-          <div class="stat__value">${tokenDrift.total || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Critical Issues</div>
-          <div class="stat__value">${tokenDrift.by_severity?.critical || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Warnings</div>
-          <div class="stat__value">${tokenDrift.by_severity?.warning || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- Quick Actions -->
-  <div class="grid grid-cols-2 gap-6 mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>Figma Tools</ds-card-title>
-        <ds-card-description>Extract and sync from Figma</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        <div class="flex flex-col gap-3">
-          <ds-button variant="primary" data-action="extractTokens">
-            🎨 Extract Tokens from Figma
-          </ds-button>
-          <ds-button variant="outline" data-action="extractComponents">
-            📦 Extract Components
-          </ds-button>
-          <ds-button variant="outline" data-action="syncTokens">
-            🔄 Sync Tokens to File
-          </ds-button>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>Component Generation</ds-card-title>
-        <ds-card-description>Generate code from designs</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        <div class="flex flex-col gap-3">
-          <ds-button variant="primary">
-            ⚡ Generate Component Code
-          </ds-button>
-          <ds-button variant="outline">
-            📚 Generate Storybook Stories
-          </ds-button>
-          <ds-button variant="outline">
-            🎨 Generate Storybook Theme
-          </ds-button>
-        </div>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- Recent Activity -->
-  <div class="mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>Recent Syncs</ds-card-title>
-      </ds-card-header>
-      <ds-card-content>
-        ${activity.length > 0 ? `
-          <div class="flex flex-col gap-3">
-            ${activity.slice(0, 5).map(item => `
-              <div class="flex items-center gap-3 text-sm">
-                <span class="status-dot ${item.status === 'success' ? 'status-dot--success' : 'status-dot--error'}"></span>
-                <span class="flex-1">${item.message}</span>
-                <span class="text-muted text-xs">${new Date(item.timestamp).toLocaleTimeString()}</span>
-              </div>
-            `).join('')}
-          </div>
-        ` : '<p class="text-muted text-sm">No recent activity</p>'}
-      </ds-card-content>
-    </ds-card>
-  </div>
-`;
-};
-
-export const UXTeamDashboard = (health, stats, discovery, activity, projectName = 'Default Project', dashboardData = {}, projectId = null, app = null) => {
-  const uxData = dashboardData.ux || { figma_files_count: 0, figma_files: [] };
-  const figmaFiles = uxData.figma_files || [];
-
-  return `
-  <div class="page-header">
-    <h1>UX Team Dashboard</h1>
-    <p class="text-muted">Design consistency & token validation · <strong class="text-primary">${projectName}</strong></p>
-  </div>
-
-  <!-- Key Metrics -->
-  <div class="grid grid-cols-4 gap-4 mt-6">
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Figma Files</div>
-          <div class="stat__value">${uxData.figma_files_count || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Synced Files</div>
-          <div class="stat__value">${figmaFiles.filter(f => f.sync_status === 'success').length}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Pending Sync</div>
-          <div class="stat__value">${figmaFiles.filter(f => f.sync_status === 'pending').length}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Design Tokens</div>
-          <div class="stat__value">${stats.tokens?.total || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- Add New Figma File Form -->
-  <div class="mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>➕ Add Figma File</ds-card-title>
-        <ds-card-description>Configure Figma files for this project</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        <form id="add-figma-file-form" class="flex flex-col gap-3">
-          <div>
-            <label class="text-sm font-medium">File Name</label>
-            <input
-              type="text"
-              name="file_name"
-              placeholder="Design System Components"
-              required
-              class="w-full p-2 border rounded mt-1"
-            />
-          </div>
-          <div>
-            <label class="text-sm font-medium">Figma URL</label>
-            <input
-              type="url"
-              name="figma_url"
-              placeholder="https://figma.com/file/..."
-              required
-              class="w-full p-2 border rounded mt-1"
-            />
-          </div>
-          <div>
-            <label class="text-sm font-medium">File Key</label>
-            <input
-              type="text"
-              name="file_key"
-              placeholder="abc123xyz"
-              required
-              class="w-full p-2 border rounded mt-1"
-            />
-            <p class="text-xs text-muted mt-1">Extract from Figma URL: figma.com/file/<strong>FILE_KEY</strong>/...</p>
-          </div>
-          <ds-button type="submit" variant="primary" class="w-full">
-            Add Figma File
-          </ds-button>
-        </form>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- Figma Files List -->
-  <div class="mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>Figma Files (${figmaFiles.length})</ds-card-title>
-        <ds-card-description>Manage Figma files for this project</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        ${figmaFiles.length === 0 ? `
-          <p class="text-muted text-sm text-center py-8">
-            No Figma files configured yet. Add your first file above! 👆
-          </p>
-        ` : `
-          <div class="flex flex-col gap-3">
-            ${figmaFiles.map(file => {
-              const statusColors = {
-                pending: 'text-muted',
-                syncing: 'text-warning',
-                success: 'text-success',
-                error: 'text-destructive'
-              };
-              const statusIcons = {
-                pending: '⏳',
-                syncing: '🔄',
-                success: '✓',
-                error: '❌'
-              };
-              return `
-                <div class="flex items-center gap-3 p-3 rounded border">
-                  <span class="text-2xl">${statusIcons[file.sync_status] || '📄'}</span>
-                  <div class="flex-1">
-                    <div class="font-medium">${file.file_name}</div>
-                    <div class="text-xs text-muted">Key: ${file.file_key}</div>
-                    <div class="text-xs ${statusColors[file.sync_status] || 'text-muted'}">
-                      Status: ${file.sync_status || 'pending'}
-                      ${file.last_synced ? `· Last synced: ${new Date(file.last_synced).toLocaleString()}` : ''}
-                    </div>
-                  </div>
-                  <div class="flex gap-2">
-                    <ds-button
-                      variant="outline"
-                      size="sm"
-                      data-action="sync-figma-file"
-                      data-file-id="${file.id}"
-                    >
-                      🔄 Sync
-                    </ds-button>
-                    <ds-button
-                      variant="ghost"
-                      size="sm"
-                      data-action="delete-figma-file"
-                      data-file-id="${file.id}"
-                    >
-                      🗑️
-                    </ds-button>
-                  </div>
-                </div>
-              `;
-            }).join('')}
-          </div>
-        `}
-      </ds-card-content>
-    </ds-card>
-  </div>
-`;
-};
-
-export const QATeamDashboard = (health, stats, discovery, activity, projectName = 'Default Project', dashboardData = {}, projectId = null, app = null) => {
-  const healthScore = discovery.health?.score || 0;
-  const healthGrade = discovery.health?.grade || '-';
-  const qaData = dashboardData.qa || { esre_count: 0, test_summary: {} };
-
-  return `
-  <div class="page-header">
-    <h1>QA Team Dashboard</h1>
-    <p class="text-muted">Testing, validation & quality metrics · <strong class="text-primary">${projectName}</strong></p>
-  </div>
-
-  <!-- Key Metrics -->
-  <div class="grid grid-cols-4 gap-4 mt-6">
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Health Score</div>
-          <div class="stat__value flex items-center gap-2">
-            <span class="status-dot ${healthScore >= 80 ? 'status-dot--success' : healthScore >= 60 ? 'status-dot--warning' : 'status-dot--error'}"></span>
-            ${healthScore}% (${healthGrade})
-          </div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">ESRE Definitions</div>
-          <div class="stat__value">${qaData.esre_count || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Tests Run</div>
-          <div class="stat__value">${qaData.test_summary?.total_tests || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-content>
-        <div class="stat">
-          <div class="stat__label">Tests Passed</div>
-          <div class="stat__value">${qaData.test_summary?.passed_tests || 0}</div>
-        </div>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- Quick Actions -->
-  <div class="grid grid-cols-2 gap-6 mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>Quality Analysis</ds-card-title>
-        <ds-card-description>Find issues and improvements</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        <div class="flex flex-col gap-3">
-          <ds-button variant="primary" data-action="navigate-quick-wins">
-            ⚡ Get Quick Wins
-          </ds-button>
-          <ds-button variant="outline">
-            🔍 Find Unused Styles
-          </ds-button>
-          <ds-button variant="outline">
-            📍 Find Inline Styles
-          </ds-button>
-        </div>
-      </ds-card-content>
-    </ds-card>
-
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>Validation</ds-card-title>
-        <ds-card-description>Check compliance and quality</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        <div class="flex flex-col gap-3">
-          <ds-button variant="primary" data-action="validateComponents">
-            ✅ Validate Components
-          </ds-button>
-          <ds-button variant="outline">
-            📊 Analyze React Components
-          </ds-button>
-          <ds-button variant="outline">
-            🎯 Check Story Coverage
-          </ds-button>
-        </div>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- Add New ESRE Definition Form -->
-  <div class="mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>➕ Add ESRE Definition</ds-card-title>
-        <ds-card-description>Define Expected State Requirements for components</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        <form id="add-esre-form" class="flex flex-col gap-3">
-          <div>
-            <label class="text-sm font-medium">Name</label>
-            <input
-              type="text"
-              name="name"
-              placeholder="Button Color Test"
-              required
-              class="w-full p-2 border rounded mt-1"
-            />
-          </div>
-          <div>
-            <label class="text-sm font-medium">Component Name (Optional)</label>
-            <input
-              type="text"
-              name="component_name"
-              placeholder="Button"
-              class="w-full p-2 border rounded mt-1"
-            />
-          </div>
-          <div>
-            <label class="text-sm font-medium">Definition (Natural Language)</label>
-            <textarea
-              name="definition_text"
-              placeholder="Primary button background should use the primary-500 token"
-              required
-              rows="3"
-              class="w-full p-2 border rounded mt-1"
-            ></textarea>
-          </div>
-          <div>
-            <label class="text-sm font-medium">Expected Value (Optional)</label>
-            <input
-              type="text"
-              name="expected_value"
-              placeholder="var(--primary-500)"
-              class="w-full p-2 border rounded mt-1"
-            />
-          </div>
-          <ds-button type="submit" variant="primary" class="w-full">
-            Add ESRE Definition
-          </ds-button>
-        </form>
-      </ds-card-content>
-    </ds-card>
-  </div>
-
-  <!-- ESRE Definitions List -->
-  <div class="mt-6">
-    <ds-card>
-      <ds-card-header>
-        <ds-card-title>ESRE Definitions (${qaData.esre_count || 0})</ds-card-title>
-        <ds-card-description>Expected State Requirements for testing</ds-card-description>
-      </ds-card-header>
-      <ds-card-content>
-        ${qaData.esre_count === 0 ? `
-          <p class="text-muted text-sm text-center py-8">
-            No ESRE definitions yet. Add your first definition above! 👆
-          </p>
-        ` : `
-          <p class="text-muted text-sm text-center py-4">
-            Use the API to list ESRE definitions for this project.
-          </p>
-        `}
-      </ds-card-content>
-    </ds-card>
-  </div>
-`;
-};
diff --git a/admin-ui/js/core/theme-loader.js b/admin-ui/js/core/theme-loader.js
deleted file mode 100644
index ed477d0..0000000
--- a/admin-ui/js/core/theme-loader.js
+++ /dev/null
@@ -1,435 +0,0 @@
-/**
- * DSS Theme Loader Service
- *
- * Manages the loading and hot-reloading of DSS CSS layers.
- * Handles the "Bootstrapping Paradox" by providing fallback mechanisms
- * when token files are missing or corrupted.
- *
- * CSS Layer Order:
- * 1. dss-core.css (structural) - REQUIRED, always loaded first
- * 2. dss-tokens.css (design tokens) - Can be regenerated from Figma
- * 3. dss-theme.css (semantic mapping) - Maps tokens to purposes
- * 4. dss-components.css (styled components) - Uses semantic tokens
- */
-
-import logger from './logger.js';
-import { notifySuccess, notifyError, notifyInfo, ErrorCode } from './messaging.js';
-
-// CSS Layer definitions with fallback behavior
-const CSS_LAYERS = [
-  {
-    id: 'dss-core',
-    path: '/admin-ui/css/dss-core.css',
-    name: 'Core/Structural',
-    required: true,
-    fallback: null // No fallback - this is the baseline
-  },
-  {
-    id: 'dss-tokens',
-    path: '/admin-ui/css/dss-tokens.css',
-    name: 'Design Tokens',
-    required: false,
-    fallback: '/admin-ui/css/dss-tokens-fallback.css'
-  },
-  {
-    id: 'dss-theme',
-    path: '/admin-ui/css/dss-theme.css',
-    name: 'Semantic Theme',
-    required: false,
-    fallback: null
-  },
-  {
-    id: 'dss-components',
-    path: '/admin-ui/css/dss-components.css',
-    name: 'Component Styles',
-    required: false,
-    fallback: null
-  }
-];
-
-class ThemeLoaderService {
-  constructor() {
-    this.layers = new Map();
-    this.isInitialized = false;
-    this.healthCheckInterval = null;
-    this.listeners = new Set();
-  }
-
-  /**
-   * Initialize the theme loader
-   * Validates all CSS layers are loaded and functional
-   */
-  async init() {
-    logger.info('ThemeLoader', 'Initializing DSS Theme Loader...');
-
-    try {
-      // Perform health check on all layers
-      const healthStatus = await this.healthCheck();
-
-      if (healthStatus.allHealthy) {
-        logger.info('ThemeLoader', 'All CSS layers loaded successfully');
-        this.isInitialized = true;
-        notifySuccess('Design system styles loaded successfully');
-      } else {
-        logger.warn('ThemeLoader', 'Some CSS layers failed to load', {
-          failed: healthStatus.failed
-        });
-        notifyInfo(`Design system loaded with ${healthStatus.failed.length} layer(s) using fallbacks`);
-      }
-
-      // Start periodic health checks (every 30 seconds)
-      this.startHealthCheckInterval();
-
-      return healthStatus;
-    } catch (error) {
-      logger.error('ThemeLoader', 'Failed to initialize theme loader', { error: error.message });
-      notifyError('Failed to load design system styles', ErrorCode.SYSTEM_STARTUP_FAILED);
-      throw error;
-    }
-  }
-
-  /**
-   * Check health of all CSS layers
-   * Returns status of each layer and overall health
-   */
-  async healthCheck() {
-    const results = {
-      allHealthy: true,
-      layers: [],
-      failed: [],
-      timestamp: new Date().toISOString()
-    };
-
-    for (const layer of CSS_LAYERS) {
-      const linkElement = document.querySelector(`link[href*="${layer.id}"]`);
-      const status = {
-        id: layer.id,
-        name: layer.name,
-        loaded: false,
-        path: layer.path,
-        error: null
-      };
-
-      if (linkElement) {
-        // Check if stylesheet is loaded and accessible
-        try {
-          const response = await fetch(layer.path, { method: 'HEAD' });
-          status.loaded = response.ok;
-          if (!response.ok) {
-            status.error = `HTTP ${response.status}`;
-          }
-        } catch (error) {
-          status.error = error.message;
-        }
-      } else {
-        status.error = 'Link element not found in DOM';
-      }
-
-      if (!status.loaded && layer.required) {
-        results.allHealthy = false;
-        results.failed.push(layer.id);
-      } else if (!status.loaded && !layer.required && layer.fallback) {
-        // Try to load fallback
-        await this.loadFallback(layer);
-      }
-
-      results.layers.push(status);
-      this.layers.set(layer.id, status);
-    }
-
-    // Notify listeners of health check results
-    this.notifyListeners('healthCheck', results);
-
-    return results;
-  }
-
-  /**
-   * Load a fallback CSS file for a failed layer
-   */
-  async loadFallback(layer) {
-    if (!layer.fallback) return false;
-
-    try {
-      const response = await fetch(layer.fallback, { method: 'HEAD' });
-      if (response.ok) {
-        const linkElement = document.querySelector(`link[href*="${layer.id}"]`);
-        if (linkElement) {
-          linkElement.href = layer.fallback;
-          logger.info('ThemeLoader', `Loaded fallback for ${layer.name}`, { fallback: layer.fallback });
-          return true;
-        }
-      }
-    } catch (error) {
-      logger.warn('ThemeLoader', `Failed to load fallback for ${layer.name}`, { error: error.message });
-    }
-
-    return false;
-  }
-
-  /**
-   * Reload a specific CSS layer
-   * Used when tokens are regenerated from Figma
-   */
-  async reloadLayer(layerId) {
-    const layer = CSS_LAYERS.find(l => l.id === layerId);
-    if (!layer) {
-      logger.warn('ThemeLoader', `Unknown layer: ${layerId}`);
-      return false;
-    }
-
-    logger.info('ThemeLoader', `Reloading layer: ${layer.name}`);
-
-    try {
-      const linkElement = document.querySelector(`link[href*="${layer.id}"]`);
-      if (!linkElement) {
-        logger.error('ThemeLoader', `Link element not found for ${layer.id}`);
-        return false;
-      }
-
-      // Force reload by adding cache-busting timestamp
-      const timestamp = Date.now();
-      const newHref = `${layer.path}?t=${timestamp}`;
-
-      // Create a promise that resolves when the new stylesheet loads
-      return new Promise((resolve, reject) => {
-        const tempLink = document.createElement('link');
-        tempLink.rel = 'stylesheet';
-        tempLink.href = newHref;
-
-        tempLink.onload = () => {
-          // Replace old link with new one
-          linkElement.href = newHref;
-          tempLink.remove();
-          logger.info('ThemeLoader', `Successfully reloaded ${layer.name}`);
-          this.notifyListeners('layerReloaded', { layerId, timestamp });
-          resolve(true);
-        };
-
-        tempLink.onerror = () => {
-          tempLink.remove();
-          logger.error('ThemeLoader', `Failed to reload ${layer.name}`);
-          reject(new Error(`Failed to reload ${layer.name}`));
-        };
-
-        // Add temp link to head to trigger load
-        document.head.appendChild(tempLink);
-
-        // Timeout after 5 seconds
-        setTimeout(() => {
-          if (document.head.contains(tempLink)) {
-            tempLink.remove();
-            reject(new Error(`Timeout loading ${layer.name}`));
-          }
-        }, 5000);
-      });
-    } catch (error) {
-      logger.error('ThemeLoader', `Error reloading ${layer.name}`, { error: error.message });
-      return false;
-    }
-  }
-
-  /**
-   * Reload all CSS layers (hot reload)
-   */
-  async reloadAllLayers() {
-    logger.info('ThemeLoader', 'Reloading all CSS layers...');
-    notifyInfo('Reloading design system styles...');
-
-    const results = [];
-    for (const layer of CSS_LAYERS) {
-      const success = await this.reloadLayer(layer.id);
-      results.push({ id: layer.id, success });
-    }
-
-    const failed = results.filter(r => !r.success);
-    if (failed.length === 0) {
-      notifySuccess('All styles reloaded successfully');
-    } else {
-      notifyError(`Failed to reload ${failed.length} layer(s)`);
-    }
-
-    return results;
-  }
-
-  /**
-   * Reload only the tokens layer
-   * Used after Figma sync or token generation
-   */
-  async reloadTokens() {
-    logger.info('ThemeLoader', 'Reloading design tokens...');
-    notifyInfo('Applying new design tokens...');
-
-    try {
-      await this.reloadLayer('dss-tokens');
-      // Also reload theme since it depends on tokens
-      await this.reloadLayer('dss-theme');
-      notifySuccess('Design tokens applied successfully');
-      return true;
-    } catch (error) {
-      notifyError('Failed to apply design tokens');
-      return false;
-    }
-  }
-
-  /**
-   * Start periodic health check interval
-   */
-  startHealthCheckInterval(intervalMs = 30000) {
-    if (this.healthCheckInterval) {
-      clearInterval(this.healthCheckInterval);
-    }
-
-    this.healthCheckInterval = setInterval(async () => {
-      const status = await this.healthCheck();
-      if (!status.allHealthy) {
-        logger.warn('ThemeLoader', 'Health check detected issues', {
-          failed: status.failed
-        });
-      }
-    }, intervalMs);
-  }
-
-  /**
-   * Stop periodic health checks
-   */
-  stopHealthCheckInterval() {
-    if (this.healthCheckInterval) {
-      clearInterval(this.healthCheckInterval);
-      this.healthCheckInterval = null;
-    }
-  }
-
-  /**
-   * Get current theme status
-   */
-  getStatus() {
-    return {
-      initialized: this.isInitialized,
-      layers: Array.from(this.layers.values()),
-      layerCount: CSS_LAYERS.length
-    };
-  }
-
-  /**
-   * Subscribe to theme loader events
-   */
-  subscribe(callback) {
-    this.listeners.add(callback);
-    return () => this.listeners.delete(callback);
-  }
-
-  /**
-   * Notify all listeners of an event
-   */
-  notifyListeners(event, data) {
-    this.listeners.forEach(callback => {
-      try {
-        callback(event, data);
-      } catch (error) {
-        logger.error('ThemeLoader', 'Listener error', { error: error.message });
-      }
-    });
-  }
-
-  /**
-   * Generate CSS token file from extracted tokens
-   * This is called after Figma sync to create dss-tokens.css
-   */
-  async generateTokensFile(tokens) {
-    logger.info('ThemeLoader', 'Generating tokens CSS file...');
-
-    // Convert tokens object to CSS custom properties
-    const cssContent = this.tokensToCSS(tokens);
-
-    // Send to backend to save file
-    try {
-      const response = await fetch('/api/dss/save-tokens', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          content: cssContent,
-          path: '/admin-ui/css/dss-tokens.css'
-        })
-      });
-
-      if (response.ok) {
-        logger.info('ThemeLoader', 'Tokens file generated successfully');
-        await this.reloadTokens();
-        return true;
-      } else {
-        throw new Error(`Server returned ${response.status}`);
-      }
-    } catch (error) {
-      logger.error('ThemeLoader', 'Failed to generate tokens file', { error: error.message });
-      notifyError('Failed to save design tokens');
-      return false;
-    }
-  }
-
-  /**
-   * Convert tokens object to CSS custom properties
-   */
-  tokensToCSS(tokens) {
-    let css = `/**
- * DSS Design Tokens - Generated ${new Date().toISOString()}
- * Source: Figma extraction
- */
-
-:root {
-`;
-
-    // Recursively flatten tokens and create CSS variables
-    const flattenTokens = (obj, prefix = '--ds') => {
-      let result = '';
-      for (const [key, value] of Object.entries(obj)) {
-        const varName = `${prefix}-${key.replace(/([A-Z])/g, '-$1').toLowerCase()}`;
-        if (typeof value === 'object' && value !== null && !value.$value) {
-          result += flattenTokens(value, varName);
-        } else {
-          const cssValue = value.$value || value;
-          result += `  ${varName}: ${cssValue};\n`;
-        }
-      }
-      return result;
-    };
-
-    css += flattenTokens(tokens);
-    css += '}\n';
-
-    return css;
-  }
-
-  /**
-   * Export current tokens as JSON
-   */
-  async exportTokens() {
-    const computedStyle = getComputedStyle(document.documentElement);
-    const tokens = {};
-
-    // Extract all --ds-* variables
-    const styleSheets = document.styleSheets;
-    for (const sheet of styleSheets) {
-      try {
-        for (const rule of sheet.cssRules) {
-          if (rule.selectorText === ':root') {
-            const text = rule.cssText;
-            const matches = text.matchAll(/--ds-([^:]+):\s*([^;]+);/g);
-            for (const match of matches) {
-              const [, name, value] = match;
-              tokens[name] = value.trim();
-            }
-          }
-        }
-      } catch (e) {
-        // CORS restrictions on external stylesheets
-      }
-    }
-
-    return tokens;
-  }
-}
-
-// Export singleton instance
-const themeLoader = new ThemeLoaderService();
-export default themeLoader;
-export { ThemeLoaderService, CSS_LAYERS };
diff --git a/admin-ui/js/core/theme.js b/admin-ui/js/core/theme.js
deleted file mode 100644
index d704dcd..0000000
--- a/admin-ui/js/core/theme.js
+++ /dev/null
@@ -1,94 +0,0 @@
-/**
- * Theme Manager - Handles light/dark theme with cookie persistence
- */
-
-class ThemeManager {
-  constructor() {
-    this.cookieName = 'dss-theme';
-    this.cookieExpireDays = 365;
-    this.init();
-  }
-
-  init() {
-    // Load theme from cookie or default to dark
-    const savedTheme = this.getCookie(this.cookieName) || 'dark';
-    this.setTheme(savedTheme, false); // Don't save on init
-  }
-
-  /**
-   * Get cookie value
-   */
-  getCookie(name) {
-    const value = `; ${document.cookie}`;
-    const parts = value.split(`; ${name}=`);
-    if (parts.length === 2) {
-      return parts.pop().split(';').shift();
-    }
-    return null;
-  }
-
-  /**
-   * Set cookie value
-   */
-  setCookie(name, value, days) {
-    const date = new Date();
-    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
-    const expires = `expires=${date.toUTCString()}`;
-    document.cookie = `${name}=${value};${expires};path=/;SameSite=Lax`;
-  }
-
-  /**
-   * Set theme (light or dark)
-   */
-  setTheme(theme, save = true) {
-    const html = document.documentElement;
-
-    if (theme === 'dark') {
-      html.classList.add('dark');
-      html.classList.remove('light');
-    } else {
-      html.classList.add('light');
-      html.classList.remove('dark');
-    }
-
-    // Save to cookie
-    if (save) {
-      this.setCookie(this.cookieName, theme, this.cookieExpireDays);
-    }
-
-    // Dispatch event for other components
-    window.dispatchEvent(new CustomEvent('theme-changed', {
-      detail: { theme }
-    }));
-
-    return theme;
-  }
-
-  /**
-   * Toggle between light and dark
-   */
-  toggle() {
-    const currentTheme = this.getCurrentTheme();
-    const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
-    return this.setTheme(newTheme);
-  }
-
-  /**
-   * Get current theme
-   */
-  getCurrentTheme() {
-    return document.documentElement.classList.contains('dark') ? 'dark' : 'light';
-  }
-
-  /**
-   * Check if dark mode is active
-   */
-  isDark() {
-    return this.getCurrentTheme() === 'dark';
-  }
-}
-
-// Create singleton instance
-const themeManager = new ThemeManager();
-
-export default themeManager;
diff --git a/admin-ui/js/core/token-validator.js b/admin-ui/js/core/token-validator.js
deleted file mode 100644
index e7c358c..0000000
--- a/admin-ui/js/core/token-validator.js
+++ /dev/null
@@ -1,410 +0,0 @@
-/**
- * TokenValidator - Validates CSS and HTML for design token compliance
- *
- * Ensures all color, spacing, typography, and other design values use
- * valid CSS custom properties instead of hardcoded values.
- *
- * Usage:
- *   const validator = new TokenValidator();
- *   const report = validator.validateCSS(cssText);
- *   console.log(report.violations); // Array of violations found
- */
-
-class TokenValidator {
-  constructor() {
-    // Define all valid tokens from the design system
-    this.validTokens = {
-      colors: [
-        // Semantic colors
-        '--primary', '--primary-foreground',
-        '--secondary', '--secondary-foreground',
-        '--accent', '--accent-foreground',
-        '--destructive', '--destructive-foreground',
-        '--success', '--success-foreground',
-        '--warning', '--warning-foreground',
-        '--info', '--info-foreground',
-        // Functional colors
-        '--background', '--foreground',
-        '--card', '--card-foreground',
-        '--popover', '--popover-foreground',
-        '--muted', '--muted-foreground',
-        '--border', '--ring',
-        '--input'
-      ],
-      spacing: [
-        '--space-0', '--space-1', '--space-2', '--space-3', '--space-4',
-        '--space-5', '--space-6', '--space-8', '--space-10', '--space-12',
-        '--space-16', '--space-20', '--space-24', '--space-32'
-      ],
-      typography: [
-        // Font families
-        '--font-sans', '--font-mono',
-        // Font sizes
-        '--text-xs', '--text-sm', '--text-base', '--text-lg', '--text-xl',
-        '--text-2xl', '--text-3xl', '--text-4xl',
-        // Font weights
-        '--font-normal', '--font-medium', '--font-semibold', '--font-bold',
-        // Line heights
-        '--leading-tight', '--leading-normal', '--leading-relaxed',
-        // Letter spacing
-        '--tracking-tight', '--tracking-normal', '--tracking-wide'
-      ],
-      radius: [
-        '--radius-none', '--radius-sm', '--radius', '--radius-md',
-        '--radius-lg', '--radius-xl', '--radius-full'
-      ],
-      shadows: [
-        '--shadow-sm', '--shadow', '--shadow-md', '--shadow-lg', '--shadow-xl'
-      ],
-      timing: [
-        '--duration-fast', '--duration-normal', '--duration-slow',
-        '--ease-default', '--ease-in', '--ease-out'
-      ],
-      zIndex: [
-        '--z-base', '--z-dropdown', '--z-sticky', '--z-fixed',
-        '--z-modal-background', '--z-modal', '--z-popover', '--z-tooltip',
-        '--z-notification', '--z-toast'
-      ]
-    };
-
-    // Flatten all valid tokens for quick lookup
-    this.allValidTokens = new Set();
-    Object.values(this.validTokens).forEach(group => {
-      group.forEach(token => this.allValidTokens.add(token));
-    });
-
-    // Patterns for detecting CSS variable usage
-    this.varPattern = /var\(\s*([a-z0-9\-_]+)/gi;
-    // Patterns for detecting hardcoded values
-    this.colorPattern = /#[0-9a-f]{3,6}|rgb\(|hsl\(|oklch\(/gi;
-    this.spacingPattern = /\b\d+(?:px|rem|em|ch|vw|vh)\b/g;
-
-    // Track violations
-    this.violations = [];
-    this.warnings = [];
-    this.stats = {
-      totalTokenReferences: 0,
-      validTokenReferences: 0,
-      invalidTokenReferences: 0,
-      hardcodedValues: 0,
-      files: {}
-    };
-  }
-
-  /**
-   * Validate CSS text for token compliance
-   * @param {string} cssText - CSS content to validate
-   * @param {string} [fileName] - Optional filename for reporting
-   * @returns {object} Report with violations, warnings, and stats
-   */
-  validateCSS(cssText, fileName = 'inline') {
-    this.violations = [];
-    this.warnings = [];
-
-    if (!cssText || typeof cssText !== 'string') {
-      return { violations: [], warnings: [], stats: this.stats };
-    }
-
-    // Parse CSS and check for token compliance
-    this._validateTokenReferences(cssText, fileName);
-    this._validateHardcodedColors(cssText, fileName);
-    this._validateSpacingValues(cssText, fileName);
-
-    // Store stats for this file
-    this.stats.files[fileName] = {
-      violations: this.violations.length,
-      warnings: this.warnings.length
-    };
-
-    return {
-      violations: this.violations,
-      warnings: this.warnings,
-      stats: this.stats,
-      isCompliant: this.violations.length === 0
-    };
-  }
-
-  /**
-   * Validate all CSS variable references
-   * @private
-   */
-  _validateTokenReferences(cssText, fileName) {
-    let match;
-    const varPattern = /var\(\s*([a-z0-9\-_]+)/gi;
-
-    while ((match = varPattern.exec(cssText)) !== null) {
-      const tokenName = match[1];
-      this.stats.totalTokenReferences++;
-
-      if (this.allValidTokens.has(tokenName)) {
-        this.stats.validTokenReferences++;
-      } else {
-        this.stats.invalidTokenReferences++;
-        this.violations.push({
-          type: 'INVALID_TOKEN',
-          token: tokenName,
-          message: `Invalid token: '${tokenName}'`,
-          file: fileName,
-          suggestion: this._suggestToken(tokenName),
-          code: match[0]
-        });
-      }
-    }
-  }
-
-  /**
-   * Detect hardcoded colors (anti-pattern)
-   * @private
-   */
-  _validateHardcodedColors(cssText, fileName) {
-    // Skip comments
-    const cleanCSS = cssText.replace(/\/\*[\s\S]*?\*\//g, '');
-
-    // Find hardcoded hex colors
-    const hexPattern = /#[0-9a-f]{3,6}(?![a-z0-9\-])/gi;
-    let match;
-
-    while ((match = hexPattern.exec(cleanCSS)) !== null) {
-      // Check if this is a valid CSS variable fallback (e.g., var(--primary, #fff))
-      const context = cleanCSS.substring(Math.max(0, match.index - 20), match.index + 10);
-      if (!context.includes('var(')) {
-        this.stats.hardcodedValues++;
-        this.violations.push({
-          type: 'HARDCODED_COLOR',
-          value: match[0],
-          message: `Hardcoded color detected: '${match[0]}' - Use CSS tokens instead`,
-          file: fileName,
-          suggestion: `Use var(--primary) or similar color token`,
-          code: match[0],
-          severity: 'HIGH'
-        });
-      }
-    }
-
-    // Find hardcoded rgb/hsl colors (but not as fallback)
-    const rgbPattern = /rgb\([^)]+\)|hsl\([^)]+\)|oklch\([^)]+\)(?![a-z])/gi;
-    while ((match = rgbPattern.exec(cleanCSS)) !== null) {
-      const context = cleanCSS.substring(Math.max(0, match.index - 20), match.index + 10);
-      if (!context.includes('var(')) {
-        this.stats.hardcodedValues++;
-        this.violations.push({
-          type: 'HARDCODED_COLOR_FUNCTION',
-          value: match[0],
-          message: `Hardcoded color function detected - Use CSS tokens instead`,
-          file: fileName,
-          suggestion: 'Use var(--color-name) instead of hardcoded rgb/hsl/oklch',
-          code: match[0],
-          severity: 'HIGH'
-        });
-      }
-    }
-  }
-
-  /**
-   * Detect hardcoded spacing values
-   * @private
-   */
-  _validateSpacingValues(cssText, fileName) {
-    // Look for padding/margin with px values that could be tokens
-    const spacingProps = ['padding', 'margin', 'gap', 'width', 'height'];
-    const spacingPattern = /(?:padding|margin|gap|width|height):\s*(\d+)px\b/gi;
-
-    let match;
-    while ((match = spacingPattern.exec(cssText)) !== null) {
-      const value = parseInt(match[1]);
-      // Only warn if it's a multiple of 4 (our spacing base unit)
-      if (value % 4 === 0 && value <= 128) {
-        this.warnings.push({
-          type: 'HARDCODED_SPACING',
-          value: match[0],
-          message: `Hardcoded spacing value: '${match[1]}px' - Could use --space-* token`,
-          file: fileName,
-          suggestion: `Use var(--space-${Math.log2(value / 4)}) or appropriate token`,
-          code: match[0],
-          severity: 'MEDIUM'
-        });
-      }
-    }
-  }
-
-  /**
-   * Suggest the closest valid token based on fuzzy matching
-   * @private
-   */
-  _suggestToken(invalidToken) {
-    const lower = invalidToken.toLowerCase();
-    let closest = null;
-    let closestDistance = Infinity;
-
-    this.allValidTokens.forEach(validToken => {
-      const distance = this._levenshteinDistance(lower, validToken.toLowerCase());
-      if (distance < closestDistance && distance < 5) {
-        closestDistance = distance;
-        closest = validToken;
-      }
-    });
-
-    return closest ? `Did you mean '${closest}'?` : 'Check valid tokens in tokens.css';
-  }
-
-  /**
-   * Calculate Levenshtein distance for fuzzy matching
-   * @private
-   */
-  _levenshteinDistance(str1, str2) {
-    const matrix = [];
-
-    for (let i = 0; i <= str2.length; i++) {
-      matrix[i] = [i];
-    }
-
-    for (let j = 0; j <= str1.length; j++) {
-      matrix[0][j] = j;
-    }
-
-    for (let i = 1; i <= str2.length; i++) {
-      for (let j = 1; j <= str1.length; j++) {
-        if (str2.charAt(i - 1) === str1.charAt(j - 1)) {
-          matrix[i][j] = matrix[i - 1][j - 1];
-        } else {
-          matrix[i][j] = Math.min(
-            matrix[i - 1][j - 1] + 1,
-            matrix[i][j - 1] + 1,
-            matrix[i - 1][j] + 1
-          );
-        }
-      }
-    }
-
-    return matrix[str2.length][str1.length];
-  }
-
-  /**
-   * Validate HTML for inline style violations
-   * @param {HTMLElement} element - Element to validate
-   * @param {string} [fileName] - Optional filename for reporting
-   * @returns {object} Report with violations
-   */
-  validateHTML(element, fileName = 'html') {
-    this.violations = [];
-    this.warnings = [];
-
-    if (!element) return { violations: [], warnings: [] };
-
-    // Check style attributes
-    const allElements = element.querySelectorAll('[style]');
-    allElements.forEach(el => {
-      const styleAttr = el.getAttribute('style');
-      if (styleAttr) {
-        this.validateCSS(styleAttr, `${fileName}:${el.tagName}`);
-      }
-    });
-
-    // Check shadow DOM styles
-    const walkElements = (node) => {
-      if (node.shadowRoot) {
-        const styleElements = node.shadowRoot.querySelectorAll('style');
-        styleElements.forEach(style => {
-          this.validateCSS(style.textContent, `${fileName}:${node.tagName}(shadow)`);
-        });
-      }
-
-      for (let child of node.children) {
-        walkElements(child);
-      }
-    };
-
-    walkElements(element);
-
-    return {
-      violations: this.violations,
-      warnings: this.warnings,
-      stats: this.stats
-    };
-  }
-
-  /**
-   * Generate a compliance report
-   * @param {boolean} [includeStats=true] - Include detailed statistics
-   * @returns {string} Formatted report
-   */
-  generateReport(includeStats = true) {
-    let report = `
-╔══════════════════════════════════════════════════════════════╗
-║          Design Token Compliance Report                      ║
-╚══════════════════════════════════════════════════════════════╝
-
-`;
-
-    if (this.violations.length === 0) {
-      report += `✅ COMPLIANT - No token violations found\n`;
-    } else {
-      report += `❌ ${this.violations.length} VIOLATIONS FOUND:\n\n`;
-      this.violations.forEach((v, i) => {
-        report += `${i + 1}. ${v.type}: ${v.message}\n`;
-        report += `   File: ${v.file}\n`;
-        report += `   Code: ${v.code}\n`;
-        if (v.suggestion) report += `   Suggestion: ${v.suggestion}\n`;
-        report += `\n`;
-      });
-    }
-
-    if (this.warnings.length > 0) {
-      report += `⚠️  ${this.warnings.length} WARNINGS:\n\n`;
-      this.warnings.forEach((w, i) => {
-        report += `${i + 1}. ${w.type}: ${w.message}\n`;
-        if (w.suggestion) report += `   Suggestion: ${w.suggestion}\n`;
-        report += `\n`;
-      });
-    }
-
-    if (includeStats && this.stats.totalTokenReferences > 0) {
-      report += `\n📊 STATISTICS:\n`;
-      report += `   Total Token References: ${this.stats.totalTokenReferences}\n`;
-      report += `   Valid References: ${this.stats.validTokenReferences}\n`;
-      report += `   Invalid References: ${this.stats.invalidTokenReferences}\n`;
-      report += `   Hardcoded Values: ${this.stats.hardcodedValues}\n`;
-      report += `   Compliance Rate: ${((this.stats.validTokenReferences / this.stats.totalTokenReferences) * 100).toFixed(1)}%\n`;
-    }
-
-    return report;
-  }
-
-  /**
-   * Get list of all valid tokens
-   * @returns {object} Tokens organized by category
-   */
-  getValidTokens() {
-    return this.validTokens;
-  }
-
-  /**
-   * Export validator instance for global access
-   */
-  static getInstance() {
-    if (!window.__dssTokenValidator) {
-      window.__dssTokenValidator = new TokenValidator();
-    }
-    return window.__dssTokenValidator;
-  }
-}
-
-// Export for module systems
-if (typeof module !== 'undefined' && module.exports) {
-  module.exports = TokenValidator;
-}
-
-// Make available globally for console debugging
-if (typeof window !== 'undefined') {
-  window.TokenValidator = TokenValidator;
-  window.__dssTokenValidator = new TokenValidator();
-
-  // Add to debug interface
-  if (window.__DSS_DEBUG) {
-    window.__DSS_DEBUG.validateTokens = () => {
-      const report = TokenValidator.getInstance().generateReport();
-      console.log(report);
-      return TokenValidator.getInstance();
-    };
-  }
-}
diff --git a/admin-ui/js/core/variant-generator.js b/admin-ui/js/core/variant-generator.js
deleted file mode 100644
index e7538c9..0000000
--- a/admin-ui/js/core/variant-generator.js
+++ /dev/null
@@ -1,664 +0,0 @@
-/**
- * Variant Generator - Auto-generates CSS for all component variants
- *
- * This system generates CSS for all component state combinations using:
- * 1. Component definitions metadata (variant combinations, tokens, states)
- * 2. CSS mixin system for DRY code generation
- * 3. Token validation to ensure all references are valid
- * 4. Dark mode support with color overrides
- *
- * Generated variants: 123 total combinations across 9 components
- * Expected output: /admin-ui/css/variants.css
- *
- * Usage:
- *   const generator = new VariantGenerator();
- *   const css = generator.generateAllVariants();
- *   generator.exportCSS(css, 'admin-ui/css/variants.css');
- */
-
-import { componentDefinitions } from './component-definitions.js';
-
-export class VariantGenerator {
-  constructor(tokenValidator = null) {
-    this.componentDefs = componentDefinitions.components;
-    this.tokenMap = componentDefinitions.tokenDependencies;
-    this.a11yReqs = componentDefinitions.a11yRequirements;
-    this.tokenValidator = tokenValidator;
-    this.generatedVariants = {};
-    this.cssOutput = '';
-    this.errors = [];
-    this.warnings = [];
-  }
-
-  /**
-   * Generate CSS for all components and their variants
-   * @returns {string} Complete CSS text with all variant definitions
-   */
-  generateAllVariants() {
-    const sections = [];
-
-    // Header comment
-    sections.push(this._generateHeader());
-
-    // CSS variables fallback system
-    sections.push(this._generateTokenFallbacks());
-
-    // Mixin system
-    sections.push(this._generateMixins());
-
-    // Component-specific variants
-    Object.entries(this.componentDefs).forEach(([componentKey, def]) => {
-      try {
-        const componentCSS = this.generateComponentVariants(componentKey, def);
-        sections.push(componentCSS);
-        this.generatedVariants[componentKey] = { success: true, variants: def.variantCombinations };
-      } catch (error) {
-        this.errors.push(`Error generating variants for ${componentKey}: ${error.message}`);
-        this.generatedVariants[componentKey] = { success: false, error: error.message };
-      }
-    });
-
-    // Dark mode overrides
-    sections.push(this._generateDarkModeOverrides());
-
-    // Accessibility utility classes
-    sections.push(this._generateA11yUtilities());
-
-    // Animation definitions
-    sections.push(this._generateAnimations());
-
-    this.cssOutput = sections.filter(Boolean).join('\n\n');
-    return this.cssOutput;
-  }
-
-  /**
-   * Generate CSS for a single component's variants
-   * @param {string} componentKey - Component identifier (e.g., 'ds-button')
-   * @param {object} def - Component definition from metadata
-   * @returns {string} CSS for all variants of this component
-   */
-  generateComponentVariants(componentKey, def) {
-    const sections = [];
-    const { cssClass, variants, states, tokens, darkMode } = def;
-
-    sections.push(`/* ============================================ */`);
-    sections.push(`/* ${def.name} Component - ${def.variantCombinations} Variants × ${def.stateCount} States */`);
-    sections.push(`/* ============================================ */\n`);
-
-    // Base component styles
-    sections.push(this._generateBaseStyles(cssClass, tokens));
-
-    // Generate variant combinations
-    if (variants) {
-      const variantKeys = Object.keys(variants);
-      const variantCombinations = this._cartesianProduct(
-        variantKeys.map(key => variants[key])
-      );
-
-      variantCombinations.forEach((combo, idx) => {
-        const variantCSS = this._generateVariantCSS(cssClass, variantKeys, combo, tokens);
-        sections.push(variantCSS);
-      });
-    }
-
-    // Generate state combinations
-    if (states && states.length > 0) {
-      states.forEach(state => {
-        const stateCSS = this._generateStateCSS(cssClass, state, tokens);
-        sections.push(stateCSS);
-      });
-    }
-
-    // Generate dark mode variants
-    if (darkMode && darkMode.support) {
-      const darkModeCSS = this._generateDarkModeVariant(cssClass, darkMode, tokens);
-      sections.push(darkModeCSS);
-    }
-
-    return sections.join('\n');
-  }
-
-  /**
-   * Generate base styles for a component
-   * @private
-   */
-  _generateBaseStyles(cssClass, tokens) {
-    const css = [];
-    css.push(`${cssClass} {`);
-    css.push(`  /* Base styles using design tokens */`);
-    css.push(`  box-sizing: border-box;`);
-    css.push(`  transition: all var(--duration-normal, 0.2s) var(--ease-default, ease);`);
-
-    if (tokens.spacing) {
-      css.push(`  padding: var(--space-3, 0.75rem);`);
-    }
-
-    if (tokens.color) {
-      css.push(`  color: var(--foreground, inherit);`);
-    }
-
-    if (tokens.radius) {
-      css.push(`  border-radius: var(--radius-md, 6px);`);
-    }
-
-    css.push(`}`);
-    return css.join('\n');
-  }
-
-  /**
-   * Generate CSS for a specific variant combination
-   * @private
-   */
-  _generateVariantCSS(cssClass, variantKeys, variantValues, tokens) {
-    const selector = this._buildVariantSelector(cssClass, variantKeys, variantValues);
-    const css = [];
-
-    css.push(`${selector} {`);
-    css.push(`  /* Variant: ${variantValues.join(', ')} */`);
-
-    // Apply variant-specific styles based on token usage
-    variantValues.forEach((value, idx) => {
-      const key = variantKeys[idx];
-      const variantRule = this._getVariantRule(key, value, tokens);
-      if (variantRule) {
-        css.push(`  ${variantRule}`);
-      }
-    });
-
-    css.push(`}`);
-    return css.join('\n');
-  }
-
-  /**
-   * Generate CSS for a specific state (hover, active, focus, disabled, loading)
-   * @private
-   */
-  _generateStateCSS(cssClass, state, tokens) {
-    const css = [];
-    const selector = `${cssClass}:${state}`;
-
-    css.push(`${selector} {`);
-    css.push(`  /* State: ${state} */`);
-
-    // Apply state-specific styles
-    switch (state) {
-      case 'hover':
-        css.push(`  opacity: 0.95;`);
-        if (tokens.color) {
-          css.push(`  filter: brightness(1.05);`);
-        }
-        break;
-      case 'active':
-        css.push(`  transform: scale(0.98);`);
-        if (tokens.color) {
-          css.push(`  filter: brightness(0.95);`);
-        }
-        break;
-      case 'focus':
-        css.push(`  outline: 2px solid var(--ring, #3b82f6);`);
-        css.push(`  outline-offset: 2px;`);
-        break;
-      case 'disabled':
-        css.push(`  opacity: 0.5;`);
-        css.push(`  cursor: not-allowed;`);
-        css.push(`  pointer-events: none;`);
-        break;
-      case 'loading':
-        css.push(`  pointer-events: none;`);
-        css.push(`  opacity: 0.7;`);
-        break;
-    }
-
-    css.push(`}`);
-    return css.join('\n');
-  }
-
-  /**
-   * Generate dark mode variant styles
-   * @private
-   */
-  _generateDarkModeVariant(cssClass, darkModeConfig, tokens) {
-    const css = [];
-
-    css.push(`:root.dark ${cssClass} {`);
-    css.push(`  /* Dark mode overrides */`);
-
-    if (darkModeConfig.colorOverrides && darkModeConfig.colorOverrides.length > 0) {
-      darkModeConfig.colorOverrides.forEach(token => {
-        const darkToken = `${token}`;
-        css.push(`  /* Uses dark variant of ${token} */`);
-      });
-    }
-
-    css.push(`}`);
-    return css.join('\n');
-  }
-
-  /**
-   * Build CSS selector for variant combination
-   * @private
-   */
-  _buildVariantSelector(cssClass, keys, values) {
-    if (keys.length === 0) return cssClass;
-
-    const attributes = keys
-      .map((key, idx) => `[data-${key}="${values[idx]}"]`)
-      .join('');
-
-    return `${cssClass}${attributes}`;
-  }
-
-  /**
-   * Get CSS rule for a specific variant value
-   * @private
-   */
-  _getVariantRule(key, value, tokens) {
-    const ruleMap = {
-      // Size variants
-      'size': {
-        'sm': 'padding: var(--space-2, 0.5rem); font-size: var(--text-xs, 0.75rem);',
-        'default': 'padding: var(--space-3, 0.75rem); font-size: var(--text-sm, 0.875rem);',
-        'lg': 'padding: var(--space-4, 1rem); font-size: var(--text-base, 1rem);',
-        'icon': 'width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;',
-        'icon-sm': 'width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;',
-        'icon-lg': 'width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;',
-      },
-      // Variant types
-      'variant': {
-        'primary': 'background: var(--primary, #3b82f6); color: white;',
-        'secondary': 'background: var(--secondary, #6b7280); color: white;',
-        'outline': 'border: 1px solid var(--border, #e5e7eb); background: transparent;',
-        'ghost': 'background: transparent;',
-        'destructive': 'background: var(--destructive, #dc2626); color: white;',
-        'success': 'background: var(--success, #10b981); color: white;',
-        'link': 'background: transparent; text-decoration: underline;',
-      },
-      // Type variants
-      'type': {
-        'text': 'input-type: text;',
-        'password': 'input-type: password;',
-        'email': 'input-type: email;',
-        'number': 'input-type: number;',
-        'search': 'input-type: search;',
-        'tel': 'input-type: tel;',
-        'url': 'input-type: url;',
-      },
-      // Style variants
-      'style': {
-        'default': 'background: var(--card, white); border: 1px solid var(--border, #e5e7eb);',
-        'interactive': 'background: var(--card, white); border: 1px solid var(--primary, #3b82f6); cursor: pointer;',
-      },
-      // Position variants
-      'position': {
-        'fixed': 'position: fixed;',
-        'relative': 'position: relative;',
-        'sticky': 'position: sticky;',
-      },
-      // Alignment variants
-      'alignment': {
-        'left': 'justify-content: flex-start;',
-        'center': 'justify-content: center;',
-        'right': 'justify-content: flex-end;',
-      },
-      // Layout variants
-      'layout': {
-        'compact': 'gap: var(--space-2, 0.5rem); padding: var(--space-2, 0.5rem);',
-        'expanded': 'gap: var(--space-4, 1rem); padding: var(--space-4, 1rem);',
-      },
-      // Direction variants
-      'direction': {
-        'vertical': 'flex-direction: column;',
-        'horizontal': 'flex-direction: row;',
-      },
-    };
-
-    const rule = ruleMap[key]?.[value];
-    return rule || null;
-  }
-
-  /**
-   * Generate CSS mixin system for DRY variant generation
-   * @private
-   */
-  _generateMixins() {
-    return `/* CSS Mixin System - Reusable style patterns */
-
-/* Size mixins */
-@property --mixin-size-sm {
-  syntax: '<length>';
-  initial-value: 0.5rem;
-  inherits: false;
-}
-
-/* Color mixins */
-@property --mixin-color-primary {
-  syntax: '<color>';
-  initial-value: var(--primary, #3b82f6);
-  inherits: true;
-}
-
-/* Spacing mixins */
-@property --mixin-space-compact {
-  syntax: '<length>';
-  initial-value: var(--space-2, 0.5rem);
-  inherits: false;
-}`;
-  }
-
-  /**
-   * Generate token fallback system for CSS variables
-   * @private
-   */
-  _generateTokenFallbacks() {
-    const css = [];
-    css.push(`/* Design Token Fallback System */`);
-    css.push(`/* Ensures components work even if tokens aren't loaded */\n`);
-
-    css.push(`:root {`);
-
-    // Color tokens
-    css.push(`  /* Color Tokens */`);
-    css.push(`  --primary: #3b82f6;`);
-    css.push(`  --secondary: #6b7280;`);
-    css.push(`  --destructive: #dc2626;`);
-    css.push(`  --success: #10b981;`);
-    css.push(`  --warning: #f59e0b;`);
-    css.push(`  --info: #0ea5e9;`);
-    css.push(`  --foreground: #1a1a1a;`);
-    css.push(`  --muted-foreground: #6b7280;`);
-    css.push(`  --card: white;`);
-    css.push(`  --input: white;`);
-    css.push(`  --border: #e5e7eb;`);
-    css.push(`  --muted: #f3f4f6;`);
-    css.push(`  --ring: #3b82f6;`);
-
-    // Spacing tokens
-    css.push(`\n  /* Spacing Tokens */`);
-    for (let i = 0; i <= 24; i++) {
-      const value = `${i * 0.25}rem`;
-      css.push(`  --space-${i}: ${value};`);
-    }
-
-    // Typography tokens
-    css.push(`\n  /* Typography Tokens */`);
-    css.push(`  --text-xs: 0.75rem;`);
-    css.push(`  --text-sm: 0.875rem;`);
-    css.push(`  --text-base: 1rem;`);
-    css.push(`  --text-lg: 1.125rem;`);
-    css.push(`  --text-xl: 1.25rem;`);
-    css.push(`  --text-2xl: 1.75rem;`);
-    css.push(`  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;`);
-    css.push(`  --font-mono: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;`);
-    css.push(`  --font-light: 300;`);
-    css.push(`  --font-normal: 400;`);
-    css.push(`  --font-medium: 500;`);
-    css.push(`  --font-semibold: 600;`);
-    css.push(`  --font-bold: 700;`);
-
-    // Radius tokens
-    css.push(`\n  /* Radius Tokens */`);
-    css.push(`  --radius-sm: 4px;`);
-    css.push(`  --radius-md: 8px;`);
-    css.push(`  --radius-lg: 12px;`);
-    css.push(`  --radius-full: 9999px;`);
-
-    // Timing tokens
-    css.push(`\n  /* Timing Tokens */`);
-    css.push(`  --duration-fast: 0.1s;`);
-    css.push(`  --duration-normal: 0.2s;`);
-    css.push(`  --duration-slow: 0.5s;`);
-    css.push(`  --ease-default: ease;`);
-    css.push(`  --ease-in: ease-in;`);
-    css.push(`  --ease-out: ease-out;`);
-
-    // Shadow tokens
-    css.push(`\n  /* Shadow Tokens */`);
-    css.push(`  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);`);
-    css.push(`  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);`);
-    css.push(`  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);`);
-
-    // Z-index tokens
-    css.push(`\n  /* Z-Index Tokens */`);
-    css.push(`  --z-base: 0;`);
-    css.push(`  --z-dropdown: 1000;`);
-    css.push(`  --z-popover: 1001;`);
-    css.push(`  --z-toast: 1100;`);
-    css.push(`  --z-modal: 1200;`);
-
-    css.push(`}`);
-
-    return css.join('\n');
-  }
-
-  /**
-   * Generate dark mode override section
-   * @private
-   */
-  _generateDarkModeOverrides() {
-    return `:root.dark {
-  /* Dark Mode Color Overrides */
-  --foreground: #e5e5e5;
-  --muted-foreground: #9ca3af;
-  --card: #1f2937;
-  --input: #1f2937;
-  --border: #374151;
-  --muted: #111827;
-  --ring: #60a5fa;
-}`;
-  }
-
-  /**
-   * Generate accessibility utility classes
-   * @private
-   */
-  _generateA11yUtilities() {
-    return `/* Accessibility Utilities */
-
-/* Screen reader only */
-.sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border-width: 0;
-}
-
-/* Focus visible (keyboard navigation) */
-*:focus-visible {
-  outline: 2px solid var(--ring, #3b82f6);
-  outline-offset: 2px;
-}
-
-/* Reduced motion */
-@media (prefers-reduced-motion: reduce) {
-  *,
-  *::before,
-  *::after {
-    animation-duration: 0.01ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: 0.01ms !important;
-  }
-}
-
-/* High contrast mode */
-@media (prefers-contrast: more) {
-  * {
-    border-width: 1px;
-  }
-}`;
-  }
-
-  /**
-   * Generate animation definitions
-   * @private
-   */
-  _generateAnimations() {
-    return `/* Animation Definitions */
-
-@keyframes slideIn {
-  from {
-    opacity: 0;
-    transform: translateY(-10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes slideOut {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(-10px);
-  }
-}
-
-@keyframes fadeIn {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes fadeOut {
-  from { opacity: 1; }
-  to { opacity: 0; }
-}
-
-@keyframes spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
-}
-
-/* Animation utility classes */
-.animate-in {
-  animation: slideIn var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-out {
-  animation: slideOut var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-fade-in {
-  animation: fadeIn var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-fade-out {
-  animation: fadeOut var(--duration-normal, 0.2s) var(--ease-default, ease);
-}
-
-.animate-spin {
-  animation: spin 1s linear infinite;
-}`;
-  }
-
-  /**
-   * Generate file header with metadata
-   * @private
-   */
-  _generateHeader() {
-    const timestamp = new Date().toISOString();
-    const totalVariants = componentDefinitions.summary.totalVariants;
-    const totalTestCases = componentDefinitions.summary.totalTestCases;
-
-    return `/**
- * Auto-Generated Component Variants CSS
- *
- * Generated: ${timestamp}
- * Source: /admin-ui/js/core/component-definitions.js
- * Generator: /admin-ui/js/core/variant-generator.js
- *
- * This file contains CSS for:
- * - ${totalVariants} total component variant combinations
- * - ${Object.keys(this.componentDefs).length} components
- * - ${totalTestCases} test cases worth of coverage
- * - Full dark mode support
- * - WCAG 2.1 AA accessibility compliance
- *
- * DO NOT EDIT MANUALLY
- * Regenerate using: new VariantGenerator().generateAllVariants()
- */`;
-  }
-
-  /**
-   * Generate validation report for all variants
-   * @returns {object} Report with pass/fail counts and details
-   */
-  generateValidationReport() {
-    const report = {
-      totalComponents: Object.keys(this.componentDefs).length,
-      totalVariants: 0,
-      validVariants: 0,
-      invalidVariants: 0,
-      componentReports: {},
-      errors: this.errors,
-      warnings: this.warnings,
-      timestamp: new Date().toISOString(),
-    };
-
-    Object.entries(this.generatedVariants).forEach(([component, result]) => {
-      if (result.success) {
-        report.validVariants += result.variants;
-        report.totalVariants += result.variants;
-        report.componentReports[component] = {
-          status: 'PASS',
-          variants: result.variants,
-        };
-      } else {
-        report.invalidVariants += 1;
-        report.componentReports[component] = {
-          status: 'FAIL',
-          error: result.error,
-        };
-      }
-    });
-
-    return report;
-  }
-
-  /**
-   * Export generated CSS to file
-   * @param {string} css - CSS content to export
-   * @param {string} filepath - Destination filepath
-   */
-  exportCSS(css = this.cssOutput, filepath = 'admin-ui/css/variants.css') {
-    if (!css) {
-      throw new Error('No CSS generated. Run generateAllVariants() first.');
-    }
-
-    return {
-      content: css,
-      filepath,
-      lineCount: css.split('\n').length,
-      byteSize: new Blob([css]).size,
-      timestamp: new Date().toISOString(),
-    };
-  }
-
-  /**
-   * Cartesian product helper - generates all combinations of arrays
-   * @private
-   */
-  _cartesianProduct(arrays) {
-    if (arrays.length === 0) return [[]];
-    if (arrays.length === 1) return arrays[0].map(item => [item]);
-
-    return arrays.reduce((acc, array) => {
-      const product = [];
-      acc.forEach(combo => {
-        array.forEach(item => {
-          product.push([...combo, item]);
-        });
-      });
-      return product;
-    });
-  }
-}
-
-export default VariantGenerator;
diff --git a/admin-ui/js/core/variant-validator.js b/admin-ui/js/core/variant-validator.js
deleted file mode 100644
index aa657ba..0000000
--- a/admin-ui/js/core/variant-validator.js
+++ /dev/null
@@ -1,376 +0,0 @@
-/**
- * Variant Validator - Validates all generated component variants
- *
- * Checks:
- * 1. All components defined in metadata exist
- * 2. All variants are covered by CSS
- * 3. All tokens are referenced correctly
- * 4. Dark mode overrides are in place
- * 5. Accessibility requirements are met
- * 6. Test case coverage is complete
- */
-
-import { componentDefinitions } from './component-definitions.js';
-
-export class VariantValidator {
-  constructor() {
-    this.results = {
-      timestamp: new Date().toISOString(),
-      passed: 0,
-      failed: 0,
-      warnings: 0,
-      details: [],
-    };
-    this.errors = [];
-    this.warnings = [];
-  }
-
-  /**
-   * Run complete validation suite
-   * @returns {object} Validation report
-   */
-  validate() {
-    this.validateComponentDefinitions();
-    this.validateVariantCoverage();
-    this.validateTokenReferences();
-    this.validateDarkModeSupport();
-    this.validateAccessibilityRequirements();
-    this.validateTestCaseCoverage();
-
-    return this.generateReport();
-  }
-
-  /**
-   * Validate component definitions are complete
-   * @private
-   */
-  validateComponentDefinitions() {
-    const components = componentDefinitions.components;
-    const requiredFields = ['name', 'group', 'cssClass', 'states', 'tokens', 'a11y', 'darkMode'];
-
-    Object.entries(components).forEach(([key, def]) => {
-      const missing = requiredFields.filter(field => !def[field]);
-
-      if (missing.length > 0) {
-        this.addError(`Component '${key}' missing fields: ${missing.join(', ')}`);
-      } else {
-        this.addSuccess(`Component '${key}' definition complete`);
-      }
-
-      // Validate variant counts
-      if (def.variantCombinations !== (def.stateCount * (Object.values(def.variants || {}).reduce((acc, v) => acc * v.length, 1) || 1))) {
-        this.addWarning(`Component '${key}' variant count mismatch`);
-      }
-    });
-  }
-
-  /**
-   * Validate all variant combinations are covered
-   * @private
-   */
-  validateVariantCoverage() {
-    const components = componentDefinitions.components;
-    let totalVariants = 0;
-    let coveredVariants = 0;
-
-    Object.entries(components).forEach(([key, def]) => {
-      if (def.variants) {
-        const variantCount = Object.values(def.variants).reduce((acc, v) => acc * v.length, 1);
-        totalVariants += variantCount;
-        coveredVariants += variantCount; // Assume all are covered since we generated CSS
-      }
-    });
-
-    if (coveredVariants === totalVariants) {
-      this.addSuccess(`All ${totalVariants} variants have CSS definitions`);
-    } else {
-      this.addError(`Variant coverage incomplete: ${coveredVariants}/${totalVariants}`);
-    }
-  }
-
-  /**
-   * Validate all token references are valid
-   * @private
-   */
-  validateTokenReferences() {
-    const tokenDeps = componentDefinitions.tokenDependencies;
-    const validTokens = Object.keys(tokenDeps);
-
-    let tokenCount = 0;
-    let validCount = 0;
-
-    Object.entries(componentDefinitions.components).forEach(([key, def]) => {
-      if (def.tokens) {
-        Object.values(def.tokens).forEach(tokens => {
-          tokens.forEach(token => {
-            tokenCount++;
-            if (validTokens.includes(token)) {
-              validCount++;
-            } else {
-              this.addError(`Component '${key}' references invalid token: ${token}`);
-            }
-          });
-        });
-      }
-    });
-
-    const compliance = ((validCount / tokenCount) * 100).toFixed(1);
-    if (validCount === tokenCount) {
-      this.addSuccess(`All ${tokenCount} token references are valid (100%)`);
-    } else {
-      this.addWarning(`Token compliance: ${validCount}/${tokenCount} (${compliance}%)`);
-    }
-  }
-
-  /**
-   * Validate dark mode support
-   * @private
-   */
-  validateDarkModeSupport() {
-    const components = componentDefinitions.components;
-    let darkModeSupported = 0;
-    let darkModeTotal = 0;
-
-    Object.entries(components).forEach(([key, def]) => {
-      if (def.darkMode) {
-        darkModeTotal++;
-        if (def.darkMode.support && def.darkMode.colorOverrides && def.darkMode.colorOverrides.length > 0) {
-          darkModeSupported++;
-        } else {
-          this.addWarning(`Component '${key}' has incomplete dark mode support`);
-        }
-      }
-    });
-
-    const coverage = ((darkModeSupported / darkModeTotal) * 100).toFixed(1);
-    this.addSuccess(`Dark mode support: ${darkModeSupported}/${darkModeTotal} components (${coverage}%)`);
-  }
-
-  /**
-   * Validate accessibility requirements
-   * @private
-   */
-  validateAccessibilityRequirements() {
-    const a11yReqs = componentDefinitions.a11yRequirements;
-    const requiredA11yFields = ['wcagLevel', 'contrastRatio', 'keyboardSupport', 'screenReaderSupport'];
-
-    let compliantComponents = 0;
-
-    Object.entries(a11yReqs).forEach(([key, req]) => {
-      const missing = requiredA11yFields.filter(field => !req[field] && field !== 'ariaRoles');
-
-      if (missing.length === 0) {
-        compliantComponents++;
-        // Check WCAG level
-        if (req.wcagLevel !== 'AA') {
-          this.addWarning(`Component '${key}' WCAG level is ${req.wcagLevel}, expected AA`);
-        }
-      } else {
-        this.addError(`Component '${key}' missing a11y fields: ${missing.join(', ')}`);
-      }
-    });
-
-    const compliance = ((compliantComponents / Object.keys(a11yReqs).length) * 100).toFixed(1);
-    this.addSuccess(`WCAG 2.1 compliance: ${compliantComponents}/${Object.keys(a11yReqs).length} components (${compliance}%)`);
-  }
-
-  /**
-   * Validate test case coverage
-   * @private
-   */
-  validateTestCaseCoverage() {
-    const components = componentDefinitions.components;
-    let totalTestCases = 0;
-    let minimumMet = 0;
-
-    Object.entries(components).forEach(([key, def]) => {
-      const minTests = def.variantCombinations * 2; // Minimum 2 tests per variant
-      totalTestCases += def.testCases || 0;
-
-      if ((def.testCases || 0) >= minTests) {
-        minimumMet++;
-      } else {
-        const deficit = minTests - (def.testCases || 0);
-        this.addWarning(`Component '${key}' has ${deficit} test case deficit`);
-      }
-    });
-
-    const summary = componentDefinitions.summary.totalTestCases;
-    const coverage = ((totalTestCases / summary) * 100).toFixed(1);
-
-    if (totalTestCases >= summary * 0.85) {
-      this.addSuccess(`Test coverage: ${totalTestCases}/${summary} cases (${coverage}%)`);
-    } else {
-      this.addWarning(`Test coverage below 85% threshold: ${coverage}%`);
-    }
-  }
-
-  /**
-   * Generate final validation report
-   * @private
-   */
-  generateReport() {
-    const report = {
-      ...this.results,
-      summary: {
-        totalComponents: Object.keys(componentDefinitions.components).length,
-        totalVariants: componentDefinitions.summary.totalVariants,
-        totalTestCases: componentDefinitions.summary.totalTestCases,
-        totalTokens: Object.keys(componentDefinitions.tokenDependencies).length,
-        tokenCategories: {
-          color: componentDefinitions.summary.colorTokens,
-          spacing: componentDefinitions.summary.spacingTokens,
-          typography: componentDefinitions.summary.typographyTokens,
-          radius: componentDefinitions.summary.radiusTokens,
-          transitions: componentDefinitions.summary.transitionTokens,
-          shadows: componentDefinitions.summary.shadowTokens,
-        },
-      },
-      errors: this.errors,
-      warnings: this.warnings,
-      status: this.errors.length === 0 ? 'PASS' : 'FAIL',
-      statusDetails: {
-        passed: this.results.passed,
-        failed: this.results.failed,
-        warnings: this.results.warnings,
-      },
-    };
-
-    return report;
-  }
-
-  /**
-   * Add success result
-   * @private
-   */
-  addSuccess(message) {
-    this.results.details.push({ type: 'success', message });
-    this.results.passed++;
-  }
-
-  /**
-   * Add error result
-   * @private
-   */
-  addError(message) {
-    this.results.details.push({ type: 'error', message });
-    this.results.failed++;
-    this.errors.push(message);
-  }
-
-  /**
-   * Add warning result
-   * @private
-   */
-  addWarning(message) {
-    this.results.details.push({ type: 'warning', message });
-    this.results.warnings++;
-    this.warnings.push(message);
-  }
-
-  /**
-   * Export report as JSON
-   */
-  exportJSON() {
-    return JSON.stringify(this.generateReport(), null, 2);
-  }
-
-  /**
-   * Export report as formatted text
-   */
-  exportText() {
-    const report = this.generateReport();
-    const lines = [];
-
-    lines.push('╔════════════════════════════════════════════════════════════════╗');
-    lines.push('║           DESIGN SYSTEM VARIANT VALIDATION REPORT              ║');
-    lines.push('╚════════════════════════════════════════════════════════════════╝');
-    lines.push('');
-    lines.push(`📅 Timestamp: ${report.timestamp}`);
-    lines.push(`🎯 Status: ${report.status}`);
-    lines.push('');
-
-    lines.push('📊 Summary');
-    lines.push('─'.repeat(60));
-    lines.push(`Components: ${report.summary.totalComponents}`);
-    lines.push(`Variants: ${report.summary.totalVariants}`);
-    lines.push(`Test Cases: ${report.summary.totalTestCases}`);
-    lines.push(`Design Tokens: ${report.summary.totalTokens}`);
-    lines.push('');
-
-    lines.push('✅ Results');
-    lines.push('─'.repeat(60));
-    lines.push(`Passed: ${report.statusDetails.passed}`);
-    lines.push(`Failed: ${report.statusDetails.failed}`);
-    lines.push(`Warnings: ${report.statusDetails.warnings}`);
-    lines.push('');
-
-    if (report.errors.length > 0) {
-      lines.push('❌ Errors');
-      lines.push('─'.repeat(60));
-      report.errors.forEach(err => lines.push(`  • ${err}`));
-      lines.push('');
-    }
-
-    if (report.warnings.length > 0) {
-      lines.push('⚠️  Warnings');
-      lines.push('─'.repeat(60));
-      report.warnings.forEach(warn => lines.push(`  • ${warn}`));
-      lines.push('');
-    }
-
-    lines.push('✨ Compliance Metrics');
-    lines.push('─'.repeat(60));
-    lines.push(`Token Coverage: 100%`);
-    lines.push(`Dark Mode Support: 100%`);
-    lines.push(`WCAG 2.1 Level AA: 100%`);
-    lines.push(`Test Coverage Target: 85%+`);
-    lines.push('');
-
-    lines.push('╚════════════════════════════════════════════════════════════════╝');
-
-    return lines.join('\n');
-  }
-
-  /**
-   * Get HTML report for web display
-   */
-  exportHTML() {
-    const report = this.generateReport();
-
-    return `
-<div style="font-family: monospace; padding: 2rem; background: #f5f5f5; border-radius: 8px;">
-  <h2>Design System Variant Validation Report</h2>
-  <div style="background: white; padding: 1rem; border-radius: 4px; margin: 1rem 0;">
-    <p><strong>Status:</strong> <span style="color: ${report.status === 'PASS' ? 'green' : 'red'}">${report.status}</span></p>
-    <p><strong>Timestamp:</strong> ${report.timestamp}</p>
-    <p><strong>Results:</strong> ${report.statusDetails.passed} passed, ${report.statusDetails.failed} failed, ${report.statusDetails.warnings} warnings</p>
-  </div>
-
-  <h3>Summary</h3>
-  <ul>
-    <li>Components: ${report.summary.totalComponents}</li>
-    <li>Variants: ${report.summary.totalVariants}</li>
-    <li>Test Cases: ${report.summary.totalTestCases}</li>
-    <li>Design Tokens: ${report.summary.totalTokens}</li>
-  </ul>
-
-  ${report.errors.length > 0 ? `
-  <h3>Errors</h3>
-  <ul>
-    ${report.errors.map(err => `<li style="color: red;">${err}</li>`).join('')}
-  </ul>
-  ` : ''}
-
-  ${report.warnings.length > 0 ? `
-  <h3>Warnings</h3>
-  <ul>
-    ${report.warnings.map(warn => `<li style="color: orange;">${warn}</li>`).join('')}
-  </ul>
-  ` : ''}
-</div>
-    `;
-  }
-}
-
-export default VariantValidator;
diff --git a/admin-ui/js/core/workflow-persistence.js b/admin-ui/js/core/workflow-persistence.js
deleted file mode 100644
index 9922d4a..0000000
--- a/admin-ui/js/core/workflow-persistence.js
+++ /dev/null
@@ -1,193 +0,0 @@
-/**
- * Workflow Persistence - Phase 8 Enterprise Pattern
- *
- * Saves and restores workflow states to localStorage and server,
- * enabling crash recovery and session restoration.
- */
-
-import store from '../stores/app-store.js';
-
-class WorkflowPersistence {
-  constructor() {
-    this.storageKey = 'dss-workflow-state';
-    this.maxSnapshots = 10;
-    this.autoSaveInterval = 30000; // 30 seconds
-    this.isAutosaving = false;
-  }
-
-  /**
-   * Take a workflow snapshot of current state
-   */
-  snapshot() {
-    const state = store.get();
-    const snapshot = {
-      id: `snapshot-${Date.now()}`,
-      timestamp: new Date().toISOString(),
-      data: {
-        currentPage: state.currentPage,
-        sidebarOpen: state.sidebarOpen,
-        user: state.user,
-        team: state.team,
-        role: state.role,
-        figmaConnected: state.figmaConnected,
-        figmaFileKey: state.figmaFileKey,
-        selectedProject: state.projects[0]?.id || null,
-      }
-    };
-    return snapshot;
-  }
-
-  /**
-   * Save snapshot to localStorage with versioning
-   */
-  saveSnapshot(snapshot = null) {
-    try {
-      const snap = snapshot || this.snapshot();
-      const snapshots = this.getSnapshots();
-
-      // Keep only latest N snapshots
-      snapshots.unshift(snap);
-      snapshots.splice(this.maxSnapshots);
-
-      localStorage.setItem(this.storageKey, JSON.stringify(snapshots));
-      return snap.id;
-    } catch (e) {
-      console.error('[WorkflowPersistence] Failed to save snapshot:', e);
-      return null;
-    }
-  }
-
-  /**
-   * Get all saved snapshots
-   */
-  getSnapshots() {
-    try {
-      const stored = localStorage.getItem(this.storageKey);
-      return stored ? JSON.parse(stored) : [];
-    } catch (e) {
-      console.warn('[WorkflowPersistence] Failed to load snapshots:', e);
-      return [];
-    }
-  }
-
-  /**
-   * Get latest snapshot
-   */
-  getLatestSnapshot() {
-    const snapshots = this.getSnapshots();
-    return snapshots[0] || null;
-  }
-
-  /**
-   * Get snapshot by ID
-   */
-  getSnapshot(id) {
-    const snapshots = this.getSnapshots();
-    return snapshots.find(s => s.id === id) || null;
-  }
-
-  /**
-   * Restore workflow from snapshot
-   */
-  restoreSnapshot(id) {
-    const snapshot = this.getSnapshot(id);
-    if (!snapshot) {
-      console.warn('[WorkflowPersistence] Snapshot not found:', id);
-      return false;
-    }
-
-    try {
-      const data = snapshot.data;
-      store.set({
-        currentPage: data.currentPage,
-        sidebarOpen: data.sidebarOpen,
-        user: data.user,
-        team: data.team,
-        role: data.role,
-        figmaConnected: data.figmaConnected,
-        figmaFileKey: data.figmaFileKey,
-      });
-      return true;
-    } catch (e) {
-      console.error('[WorkflowPersistence] Failed to restore snapshot:', e);
-      return false;
-    }
-  }
-
-  /**
-   * Clear all snapshots
-   */
-  clearSnapshots() {
-    localStorage.removeItem(this.storageKey);
-  }
-
-  /**
-   * Delete specific snapshot
-   */
-  deleteSnapshot(id) {
-    const snapshots = this.getSnapshots();
-    const filtered = snapshots.filter(s => s.id !== id);
-    localStorage.setItem(this.storageKey, JSON.stringify(filtered));
-  }
-
-  /**
-   * Start auto-saving workflow every N milliseconds
-   */
-  startAutoSave(interval = this.autoSaveInterval) {
-    if (this.isAutosaving) return;
-
-    this.isAutosaving = true;
-    this.autoSaveTimer = setInterval(() => {
-      this.saveSnapshot();
-    }, interval);
-
-    console.log('[WorkflowPersistence] Auto-save enabled');
-  }
-
-  /**
-   * Stop auto-saving
-   */
-  stopAutoSave() {
-    if (this.autoSaveTimer) {
-      clearInterval(this.autoSaveTimer);
-      this.isAutosaving = false;
-      console.log('[WorkflowPersistence] Auto-save disabled');
-    }
-  }
-
-  /**
-   * Export snapshots as JSON file
-   */
-  exportSnapshots() {
-    const snapshots = this.getSnapshots();
-    const data = {
-      exportDate: new Date().toISOString(),
-      version: '1.0',
-      snapshots: snapshots
-    };
-    return JSON.stringify(data, null, 2);
-  }
-
-  /**
-   * Import snapshots from JSON data
-   */
-  importSnapshots(jsonData) {
-    try {
-      const data = JSON.parse(jsonData);
-      if (!Array.isArray(data.snapshots)) {
-        throw new Error('Invalid snapshot format');
-      }
-      localStorage.setItem(this.storageKey, JSON.stringify(data.snapshots));
-      return true;
-    } catch (e) {
-      console.error('[WorkflowPersistence] Failed to import snapshots:', e);
-      return false;
-    }
-  }
-}
-
-// Create and export singleton
-const persistence = new WorkflowPersistence();
-
-export { WorkflowPersistence };
-export default persistence;
diff --git a/admin-ui/js/core/workflows.js b/admin-ui/js/core/workflows.js
deleted file mode 100644
index 4d22599..0000000
--- a/admin-ui/js/core/workflows.js
+++ /dev/null
@@ -1,511 +0,0 @@
-/**
- * DSS Workflow State Machines
- *
- * State machine implementation for orchestrating multi-step workflows
- * with transition guards, side effects, and progress tracking.
- *
- * @module workflows
- */
-
-import { notifySuccess, notifyError, notifyInfo, ErrorCode } from './messaging.js';
-import router from './router.js';
-
-/**
- * Base State Machine class
- */
-class StateMachine {
-  constructor(config) {
-    this.config = config;
-    this.currentState = config.initial;
-    this.previousState = null;
-    this.context = {};
-    this.history = [];
-    this.listeners = new Map();
-  }
-
-  /**
-   * Get current state definition
-   */
-  getCurrentStateDefinition() {
-    return this.config.states[this.currentState];
-  }
-
-  /**
-   * Check if transition is allowed
-   * @param {string} event - Event to transition on
-   * @returns {string|null} Next state or null if not allowed
-   */
-  canTransition(event) {
-    const stateDefinition = this.getCurrentStateDefinition();
-
-    if (!stateDefinition || !stateDefinition.on) {
-      return null;
-    }
-
-    return stateDefinition.on[event] || null;
-  }
-
-  /**
-   * Send an event to trigger state transition
-   * @param {string} event - Event name
-   * @param {Object} [data] - Event data
-   * @returns {Promise<boolean>} Whether transition succeeded
-   */
-  async send(event, data = {}) {
-    const nextState = this.canTransition(event);
-
-    if (!nextState) {
-      console.warn(`No transition for event "${event}" in state "${this.currentState}"`);
-      return false;
-    }
-
-    // Call exit actions for current state
-    await this.callActions(this.getCurrentStateDefinition().exit, { event, data });
-
-    // Store previous state
-    this.previousState = this.currentState;
-
-    // Transition to next state
-    this.currentState = nextState;
-
-    // Record history
-    this.history.push({
-      from: this.previousState,
-      to: this.currentState,
-      event,
-      timestamp: new Date().toISOString(),
-      data,
-    });
-
-    // Call entry actions for new state
-    await this.callActions(this.getCurrentStateDefinition().entry, { event, data });
-
-    // Emit state change
-    this.emit('stateChange', {
-      previous: this.previousState,
-      current: this.currentState,
-      event,
-      data,
-    });
-
-    return true;
-  }
-
-  /**
-   * Call state actions
-   * @param {string[]|undefined} actions - Action names to execute
-   * @param {Object} context - Action context
-   */
-  async callActions(actions, context) {
-    if (!actions || !Array.isArray(actions)) {
-      return;
-    }
-
-    for (const actionName of actions) {
-      const action = this.config.actions?.[actionName];
-
-      if (action) {
-        try {
-          await action.call(this, { ...context, machine: this });
-        } catch (error) {
-          console.error(`Action "${actionName}" failed:`, error);
-        }
-      }
-    }
-  }
-
-  /**
-   * Check if machine is in a specific state
-   * @param {string} state - State name
-   * @returns {boolean} Whether machine is in that state
-   */
-  isIn(state) {
-    return this.currentState === state;
-  }
-
-  /**
-   * Check if machine is in final state
-   * @returns {boolean} Whether machine is in final state
-   */
-  isFinal() {
-    const stateDefinition = this.getCurrentStateDefinition();
-    return stateDefinition?.type === 'final' || false;
-  }
-
-  /**
-   * Subscribe to machine events
-   * @param {string} event - Event name
-   * @param {Function} handler - Event handler
-   * @returns {Function} Unsubscribe function
-   */
-  on(event, handler) {
-    if (!this.listeners.has(event)) {
-      this.listeners.set(event, []);
-    }
-
-    this.listeners.get(event).push(handler);
-
-    // Return unsubscribe function
-    return () => {
-      const handlers = this.listeners.get(event);
-      const index = handlers.indexOf(handler);
-      if (index > -1) {
-        handlers.splice(index, 1);
-      }
-    };
-  }
-
-  /**
-   * Emit event to listeners
-   * @param {string} event - Event name
-   * @param {*} data - Event data
-   */
-  emit(event, data) {
-    const handlers = this.listeners.get(event) || [];
-    handlers.forEach(handler => {
-      try {
-        handler(data);
-      } catch (error) {
-        console.error(`Event handler error for "${event}":`, error);
-      }
-    });
-  }
-
-  /**
-   * Get workflow progress
-   * @returns {Object} Progress information
-   */
-  getProgress() {
-    const states = Object.keys(this.config.states);
-    const currentIndex = states.indexOf(this.currentState);
-    const total = states.length;
-
-    return {
-      current: currentIndex + 1,
-      total,
-      percentage: Math.round(((currentIndex + 1) / total) * 100),
-      state: this.currentState,
-      isComplete: this.isFinal(),
-    };
-  }
-
-  /**
-   * Reset machine to initial state
-   */
-  reset() {
-    this.currentState = this.config.initial;
-    this.previousState = null;
-    this.context = {};
-    this.history = [];
-    this.emit('reset', {});
-  }
-
-  /**
-   * Get state history
-   * @returns {Array} State transition history
-   */
-  getHistory() {
-    return [...this.history];
-  }
-}
-
-/**
- * Create Project Workflow
- *
- * Guides user through: Create Project → Configure Settings → Extract Tokens → Success
- */
-export class CreateProjectWorkflow extends StateMachine {
-  constructor(options = {}) {
-    const config = {
-      initial: 'init',
-      states: {
-        init: {
-          on: {
-            CREATE_PROJECT: 'creating',
-          },
-          entry: ['showCreateForm'],
-        },
-        creating: {
-          on: {
-            PROJECT_CREATED: 'created',
-            CREATE_FAILED: 'init',
-          },
-          entry: ['createProject'],
-        },
-        created: {
-          on: {
-            CONFIGURE_SETTINGS: 'configuring',
-            SKIP_CONFIG: 'ready',
-          },
-          entry: ['showSuccessMessage', 'promptConfiguration'],
-        },
-        configuring: {
-          on: {
-            SETTINGS_SAVED: 'ready',
-            CONFIG_CANCELLED: 'created',
-          },
-          entry: ['navigateToSettings'],
-        },
-        ready: {
-          on: {
-            EXTRACT_TOKENS: 'extracting',
-            RECONFIGURE: 'configuring',
-          },
-          entry: ['showReadyMessage'],
-        },
-        extracting: {
-          on: {
-            EXTRACTION_SUCCESS: 'complete',
-            EXTRACTION_FAILED: 'ready',
-          },
-          entry: ['extractTokens'],
-        },
-        complete: {
-          type: 'final',
-          entry: ['showCompletionMessage', 'navigateToTokens'],
-        },
-      },
-      actions: {
-        showCreateForm: async ({ machine }) => {
-          notifyInfo('Create a new project to get started');
-          if (options.onShowCreateForm) {
-            await options.onShowCreateForm(machine);
-          }
-        },
-
-        createProject: async ({ data, machine }) => {
-          machine.context.projectName = data.projectName;
-          machine.context.projectId = data.projectId;
-
-          if (options.onCreateProject) {
-            await options.onCreateProject(machine.context);
-          }
-        },
-
-        showSuccessMessage: async ({ machine }) => {
-          notifySuccess(
-            `Project "${machine.context.projectName}" created successfully!`,
-            ErrorCode.SUCCESS_CREATED,
-            { projectId: machine.context.projectId }
-          );
-        },
-
-        promptConfiguration: async ({ machine }) => {
-          notifyInfo(
-            'Next: Configure your project settings (Figma key, description)',
-            { duration: 7000 }
-          );
-
-          if (options.onPromptConfiguration) {
-            await options.onPromptConfiguration(machine);
-          }
-        },
-
-        navigateToSettings: async ({ machine }) => {
-          router.navigate('figma');
-
-          if (options.onNavigateToSettings) {
-            await options.onNavigateToSettings(machine);
-          }
-        },
-
-        showReadyMessage: async ({ machine }) => {
-          notifyInfo('Project configured! Ready to extract tokens from Figma');
-
-          if (options.onReady) {
-            await options.onReady(machine);
-          }
-        },
-
-        extractTokens: async ({ machine }) => {
-          if (options.onExtractTokens) {
-            await options.onExtractTokens(machine);
-          }
-        },
-
-        showCompletionMessage: async ({ machine }) => {
-          notifySuccess(
-            'Tokens extracted successfully! Your design system is ready.',
-            ErrorCode.SUCCESS_OPERATION
-          );
-
-          if (options.onComplete) {
-            await options.onComplete(machine);
-          }
-        },
-
-        navigateToTokens: async ({ machine }) => {
-          router.navigate('tokens');
-        },
-      },
-    };
-
-    super(config);
-
-    // Store options
-    this.options = options;
-
-    // Subscribe to progress updates
-    this.on('stateChange', ({ current, previous }) => {
-      const progress = this.getProgress();
-
-      if (options.onProgress) {
-        options.onProgress(current, progress);
-      }
-
-      // Emit to global event bus
-      window.dispatchEvent(new CustomEvent('workflow-progress', {
-        detail: {
-          workflow: 'create-project',
-          current,
-          previous,
-          progress,
-        }
-      }));
-    });
-  }
-
-  /**
-   * Start the workflow
-   * @param {Object} data - Initial data
-   */
-  async start(data = {}) {
-    this.reset();
-    this.context = { ...data };
-    await this.send('CREATE_PROJECT', data);
-  }
-}
-
-/**
- * Token Extraction Workflow
- *
- * Guides through: Connect Figma → Select File → Extract → Sync
- */
-export class TokenExtractionWorkflow extends StateMachine {
-  constructor(options = {}) {
-    const config = {
-      initial: 'disconnected',
-      states: {
-        disconnected: {
-          on: {
-            CONNECT_FIGMA: 'connecting',
-          },
-          entry: ['promptFigmaConnection'],
-        },
-        connecting: {
-          on: {
-            CONNECTION_SUCCESS: 'connected',
-            CONNECTION_FAILED: 'disconnected',
-          },
-          entry: ['testFigmaConnection'],
-        },
-        connected: {
-          on: {
-            SELECT_FILE: 'fileSelected',
-            DISCONNECT: 'disconnected',
-          },
-          entry: ['showFileSelector'],
-        },
-        fileSelected: {
-          on: {
-            EXTRACT: 'extracting',
-            CHANGE_FILE: 'connected',
-          },
-          entry: ['showExtractButton'],
-        },
-        extracting: {
-          on: {
-            EXTRACT_SUCCESS: 'extracted',
-            EXTRACT_FAILED: 'fileSelected',
-          },
-          entry: ['performExtraction'],
-        },
-        extracted: {
-          on: {
-            SYNC: 'syncing',
-            EXTRACT_AGAIN: 'extracting',
-          },
-          entry: ['showSyncOption'],
-        },
-        syncing: {
-          on: {
-            SYNC_SUCCESS: 'complete',
-            SYNC_FAILED: 'extracted',
-          },
-          entry: ['performSync'],
-        },
-        complete: {
-          type: 'final',
-          entry: ['showSuccess'],
-        },
-      },
-      actions: {
-        promptFigmaConnection: async () => {
-          notifyInfo('Connect to Figma to extract design tokens');
-        },
-
-        testFigmaConnection: async ({ data, machine }) => {
-          if (options.onTestConnection) {
-            await options.onTestConnection(data);
-          }
-        },
-
-        showFileSelector: async () => {
-          notifySuccess('Connected to Figma! Select a file to extract tokens.');
-        },
-
-        showExtractButton: async ({ data }) => {
-          notifyInfo(`File selected: ${data.fileName || 'Unknown'}. Ready to extract.`);
-        },
-
-        performExtraction: async ({ data, machine }) => {
-          if (options.onExtract) {
-            await options.onExtract(data);
-          }
-        },
-
-        showSyncOption: async () => {
-          notifySuccess('Tokens extracted! Sync to your codebase?');
-        },
-
-        performSync: async ({ data }) => {
-          if (options.onSync) {
-            await options.onSync(data);
-          }
-        },
-
-        showSuccess: async () => {
-          notifySuccess('Workflow complete! Tokens are synced and ready to use.');
-        },
-      },
-    };
-
-    super(config);
-    this.options = options;
-  }
-
-  async start(data = {}) {
-    this.reset();
-    await this.send('CONNECT_FIGMA', data);
-  }
-}
-
-/**
- * Create workflow instances
- */
-export function createProjectWorkflow(options) {
-  return new CreateProjectWorkflow(options);
-}
-
-export function tokenExtractionWorkflow(options) {
-  return new TokenExtractionWorkflow(options);
-}
-
-export { StateMachine };
-export default {
-  StateMachine,
-  CreateProjectWorkflow,
-  TokenExtractionWorkflow,
-  createProjectWorkflow,
-  tokenExtractionWorkflow,
-};
diff --git a/admin-ui/js/db/indexed-db.js b/admin-ui/js/db/indexed-db.js
deleted file mode 100644
index 7c9a3fa..0000000
--- a/admin-ui/js/db/indexed-db.js
+++ /dev/null
@@ -1,403 +0,0 @@
-/**
- * Design System Server (DSS) - IndexedDB Storage
- *
- * Browser-side storage for offline-first operation:
- * - Projects, components, tokens (synced from backend)
- * - UI state persistence
- * - Request queue for offline operations
- *
- * Uses IndexedDB for structured data with good performance.
- */
-
-const DB_NAME = 'dss';
-const DB_VERSION = 2;
-
-class DssDB {
-  constructor() {
-    this.db = null;
-    this.ready = this.init();
-  }
-
-  // === Initialization ===
-
-  async init() {
-    return new Promise((resolve, reject) => {
-      const request = indexedDB.open(DB_NAME, DB_VERSION);
-
-      request.onerror = () => reject(request.error);
-      request.onsuccess = () => {
-        this.db = request.result;
-        console.log('[DssDB] Database ready');
-        resolve(this.db);
-      };
-
-      request.onupgradeneeded = (event) => {
-        const db = event.target.result;
-        this.createStores(db);
-      };
-    });
-  }
-
-  createStores(db) {
-    // Projects
-    if (!db.objectStoreNames.contains('projects')) {
-      const store = db.createObjectStore('projects', { keyPath: 'id' });
-      store.createIndex('status', 'status', { unique: false });
-      store.createIndex('updated_at', 'updated_at', { unique: false });
-    }
-
-    // Components
-    if (!db.objectStoreNames.contains('components')) {
-      const store = db.createObjectStore('components', { keyPath: 'id' });
-      store.createIndex('project_id', 'project_id', { unique: false });
-      store.createIndex('name', 'name', { unique: false });
-    }
-
-    // Tokens
-    if (!db.objectStoreNames.contains('tokens')) {
-      const store = db.createObjectStore('tokens', { keyPath: 'id' });
-      store.createIndex('project_id', 'project_id', { unique: false });
-      store.createIndex('category', 'category', { unique: false });
-    }
-
-    // Styles
-    if (!db.objectStoreNames.contains('styles')) {
-      const store = db.createObjectStore('styles', { keyPath: 'id' });
-      store.createIndex('project_id', 'project_id', { unique: false });
-      store.createIndex('type', 'type', { unique: false });
-    }
-
-    // Sync Queue (offline operations)
-    if (!db.objectStoreNames.contains('sync_queue')) {
-      const store = db.createObjectStore('sync_queue', { keyPath: 'id', autoIncrement: true });
-      store.createIndex('status', 'status', { unique: false });
-      store.createIndex('created_at', 'created_at', { unique: false });
-    }
-
-    // Activity Log
-    if (!db.objectStoreNames.contains('activity')) {
-      const store = db.createObjectStore('activity', { keyPath: 'id', autoIncrement: true });
-      store.createIndex('project_id', 'project_id', { unique: false });
-      store.createIndex('created_at', 'created_at', { unique: false });
-    }
-
-    // Cache (with TTL)
-    if (!db.objectStoreNames.contains('cache')) {
-      const store = db.createObjectStore('cache', { keyPath: 'key' });
-      store.createIndex('expires_at', 'expires_at', { unique: false });
-    }
-
-    // UI State
-    if (!db.objectStoreNames.contains('ui_state')) {
-      db.createObjectStore('ui_state', { keyPath: 'key' });
-    }
-
-    // Notifications
-    if (!db.objectStoreNames.contains('notifications')) {
-      const store = db.createObjectStore('notifications', { keyPath: 'id' });
-      store.createIndex('read', 'read', { unique: false });
-      store.createIndex('timestamp', 'timestamp', { unique: false });
-      store.createIndex('type', 'type', { unique: false });
-    }
-
-    console.log('[DssDB] Stores created');
-  }
-
-  // === Generic Operations ===
-
-  async transaction(storeName, mode = 'readonly') {
-    await this.ready;
-    return this.db.transaction(storeName, mode).objectStore(storeName);
-  }
-
-  async put(storeName, data) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readwrite');
-      const store = tx.objectStore(storeName);
-      const request = store.put(data);
-      request.onsuccess = () => resolve(request.result);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async get(storeName, key) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readonly');
-      const store = tx.objectStore(storeName);
-      const request = store.get(key);
-      request.onsuccess = () => resolve(request.result);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async getAll(storeName) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readonly');
-      const store = tx.objectStore(storeName);
-      const request = store.getAll();
-      request.onsuccess = () => resolve(request.result);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async getAllByIndex(storeName, indexName, value) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readonly');
-      const store = tx.objectStore(storeName);
-      const index = store.index(indexName);
-      const request = index.getAll(value);
-      request.onsuccess = () => resolve(request.result);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async delete(storeName, key) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readwrite');
-      const store = tx.objectStore(storeName);
-      const request = store.delete(key);
-      request.onsuccess = () => resolve(true);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async clear(storeName) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readwrite');
-      const store = tx.objectStore(storeName);
-      const request = store.clear();
-      request.onsuccess = () => resolve(true);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  async count(storeName) {
-    await this.ready;
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction(storeName, 'readonly');
-      const store = tx.objectStore(storeName);
-      const request = store.count();
-      request.onsuccess = () => resolve(request.result);
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  // === Cache with TTL ===
-
-  async cacheSet(key, value, ttlSeconds = 300) {
-    const data = {
-      key,
-      value,
-      created_at: Date.now(),
-      expires_at: Date.now() + (ttlSeconds * 1000)
-    };
-    return this.put('cache', data);
-  }
-
-  async cacheGet(key) {
-    const data = await this.get('cache', key);
-    if (!data) return null;
-
-    // Check expiration
-    if (Date.now() > data.expires_at) {
-      await this.delete('cache', key);
-      return null;
-    }
-
-    return data.value;
-  }
-
-  async cacheClear() {
-    return this.clear('cache');
-  }
-
-  async cacheCleanExpired() {
-    await this.ready;
-    const now = Date.now();
-
-    return new Promise((resolve, reject) => {
-      const tx = this.db.transaction('cache', 'readwrite');
-      const store = tx.objectStore('cache');
-      const index = store.index('expires_at');
-      const range = IDBKeyRange.upperBound(now);
-
-      let count = 0;
-      const request = index.openCursor(range);
-
-      request.onsuccess = (event) => {
-        const cursor = event.target.result;
-        if (cursor) {
-          store.delete(cursor.primaryKey);
-          count++;
-          cursor.continue();
-        } else {
-          resolve(count);
-        }
-      };
-
-      request.onerror = () => reject(request.error);
-    });
-  }
-
-  // === Projects ===
-
-  async saveProject(project) {
-    return this.put('projects', {
-      ...project,
-      updated_at: new Date().toISOString()
-    });
-  }
-
-  async getProject(id) {
-    return this.get('projects', id);
-  }
-
-  async getProjects() {
-    return this.getAll('projects');
-  }
-
-  // === Components ===
-
-  async saveComponents(projectId, components) {
-    for (const comp of components) {
-      await this.put('components', {
-        id: comp.id || `${projectId}-${comp.name}`,
-        project_id: projectId,
-        ...comp
-      });
-    }
-    return components.length;
-  }
-
-  async getComponents(projectId) {
-    return this.getAllByIndex('components', 'project_id', projectId);
-  }
-
-  // === Tokens ===
-
-  async saveTokens(projectId, tokens) {
-    for (const token of tokens) {
-      await this.put('tokens', {
-        id: `${projectId}-${token.name}`,
-        project_id: projectId,
-        ...token
-      });
-    }
-    return tokens.length;
-  }
-
-  async getTokens(projectId) {
-    return this.getAllByIndex('tokens', 'project_id', projectId);
-  }
-
-  async getTokensByCategory(projectId, category) {
-    const tokens = await this.getTokens(projectId);
-    return tokens.filter(t => t.category === category);
-  }
-
-  // === Sync Queue (Offline Operations) ===
-
-  async queueOperation(operation) {
-    return this.put('sync_queue', {
-      ...operation,
-      status: 'pending',
-      created_at: new Date().toISOString(),
-      retries: 0
-    });
-  }
-
-  async getPendingOperations() {
-    return this.getAllByIndex('sync_queue', 'status', 'pending');
-  }
-
-  async markOperationComplete(id) {
-    const op = await this.get('sync_queue', id);
-    if (op) {
-      op.status = 'complete';
-      op.completed_at = new Date().toISOString();
-      await this.put('sync_queue', op);
-    }
-  }
-
-  async markOperationFailed(id, error) {
-    const op = await this.get('sync_queue', id);
-    if (op) {
-      op.status = 'failed';
-      op.error = error;
-      op.retries = (op.retries || 0) + 1;
-      await this.put('sync_queue', op);
-    }
-  }
-
-  // === Activity Log ===
-
-  async logActivity(action, details = {}) {
-    return this.put('activity', {
-      action,
-      ...details,
-      created_at: new Date().toISOString()
-    });
-  }
-
-  async getRecentActivity(limit = 50) {
-    const all = await this.getAll('activity');
-    return all
-      .sort((a, b) => new Date(b.created_at) - new Date(a.created_at))
-      .slice(0, limit);
-  }
-
-  // === UI State ===
-
-  async saveUIState(key, value) {
-    return this.put('ui_state', { key, value });
-  }
-
-  async getUIState(key) {
-    const data = await this.get('ui_state', key);
-    return data?.value;
-  }
-
-  // === Stats ===
-
-  async getStats() {
-    const stores = ['projects', 'components', 'tokens', 'styles', 'activity', 'sync_queue', 'cache'];
-    const stats = {};
-
-    for (const store of stores) {
-      stats[store] = await this.count(store);
-    }
-
-    // Storage estimate
-    if (navigator.storage && navigator.storage.estimate) {
-      const estimate = await navigator.storage.estimate();
-      stats.storage_used_mb = Math.round(estimate.usage / (1024 * 1024) * 100) / 100;
-      stats.storage_quota_mb = Math.round(estimate.quota / (1024 * 1024));
-    }
-
-    return stats;
-  }
-
-  // === Sync with Backend ===
-
-  async syncFromBackend(storeName, data, keyField = 'id') {
-    // Clear existing and bulk insert
-    await this.clear(storeName);
-    for (const item of data) {
-      await this.put(storeName, item);
-    }
-    return data.length;
-  }
-}
-
-// Singleton instance
-const dssDB = new DssDB();
-
-// Export
-export { DssDB };
-export default dssDB;
diff --git a/admin-ui/js/main.js b/admin-ui/js/main.js
deleted file mode 100644
index 5527810..0000000
--- a/admin-ui/js/main.js
+++ /dev/null
@@ -1,30 +0,0 @@
-/**
- * Design System Server - Main Entry Point
- *
- * Vite module entry point that initializes the application
- */
-
-// Import CSS bundle first to ensure all styles are loaded before components render
-import './css-bundle.js'
-import app from './core/app.js'
-
-// Initialize application when DOM is ready
-if (document.readyState === 'loading') {
-  document.addEventListener('DOMContentLoaded', initApp)
-} else {
-  initApp()
-}
-
-function initApp() {
-  console.log('Initializing Design System Server v1.0.0...')
-  app.init().catch(error => {
-    console.error('Failed to initialize application:', error)
-  })
-}
-
-// Enable hot module reloading in development
-if (import.meta.hot) {
-  import.meta.hot.accept('./core/app.js', (newModule) => {
-    console.log('App module hot-reloaded')
-  })
-}
diff --git a/admin-ui/js/modules/admin/AdminModule.js b/admin-ui/js/modules/admin/AdminModule.js
deleted file mode 100644
index 89df528..0000000
--- a/admin-ui/js/modules/admin/AdminModule.js
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * AdminModule.js
- * Feature module for RBAC, user management, and system audit logs.
- */
-
-class AdminModule extends HTMLElement {
-  constructor() {
-    super();
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.innerHTML = `
-      <style>
-        .module-container { padding: 24px; color: var(--vscode-foreground); }
-        .empty-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          border: 1px dashed var(--vscode-input-border);
-          border-radius: 6px;
-          margin-top: 24px;
-        }
-        .icon-large { font-size: 48px; margin-bottom: 16px; }
-        h1 { font-size: 24px; font-weight: 500; margin-bottom: 8px; }
-        p {
-          color: var(--vscode-descriptionForeground);
-          max-width: 500px;
-          text-align: center;
-          line-height: 1.5;
-        }
-      </style>
-
-      <div class="module-container">
-        <h1>Administration</h1>
-        <div class="empty-state">
-          <div class="icon-large">👤</div>
-          <h3>Admin Module Under Construction</h3>
-          <p>
-            Manage users, permissions (RBAC), and view audit logs.
-            Only available to users with administrative privileges.
-          </p>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('dss-admin-module', AdminModule);
-export default AdminModule;
diff --git a/admin-ui/js/modules/components/ComponentsModule.js b/admin-ui/js/modules/components/ComponentsModule.js
deleted file mode 100644
index 9902247..0000000
--- a/admin-ui/js/modules/components/ComponentsModule.js
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * ComponentsModule.js
- * Feature module for the Component Registry, search, and status tracking.
- */
-
-class ComponentsModule extends HTMLElement {
-  constructor() {
-    super();
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.innerHTML = `
-      <style>
-        .module-container { padding: 24px; color: var(--vscode-foreground); }
-        .empty-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          border: 1px dashed var(--vscode-input-border);
-          border-radius: 6px;
-          margin-top: 24px;
-        }
-        .icon-large { font-size: 48px; margin-bottom: 16px; }
-        h1 { font-size: 24px; font-weight: 500; margin-bottom: 8px; }
-        p {
-          color: var(--vscode-descriptionForeground);
-          max-width: 500px;
-          text-align: center;
-          line-height: 1.5;
-        }
-      </style>
-
-      <div class="module-container">
-        <h1>Components</h1>
-        <div class="empty-state">
-          <div class="icon-large">🧩</div>
-          <h3>Components Registry Under Construction</h3>
-          <p>
-            View component status, health, and documentation links.
-            This module will interface with the registry to show what is available in your design system.
-          </p>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('dss-components-module', ComponentsModule);
-export default ComponentsModule;
diff --git a/admin-ui/js/modules/config/ConfigModule.js b/admin-ui/js/modules/config/ConfigModule.js
deleted file mode 100644
index c9b2c50..0000000
--- a/admin-ui/js/modules/config/ConfigModule.js
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * ConfigModule.js
- * Feature module for managing the 3-tier cascade configuration.
- */
-
-class ConfigModule extends HTMLElement {
-  constructor() {
-    super();
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.innerHTML = `
-      <style>
-        .module-container { padding: 24px; color: var(--vscode-foreground); }
-        .empty-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          border: 1px dashed var(--vscode-input-border);
-          border-radius: 6px;
-          margin-top: 24px;
-        }
-        .icon-large { font-size: 48px; margin-bottom: 16px; }
-        h1 { font-size: 24px; font-weight: 500; margin-bottom: 8px; }
-        p {
-          color: var(--vscode-descriptionForeground);
-          max-width: 500px;
-          text-align: center;
-          line-height: 1.5;
-        }
-      </style>
-
-      <div class="module-container">
-        <h1>Configuration</h1>
-        <div class="empty-state">
-          <div class="icon-large">⚙️</div>
-          <h3>Configuration Module Under Construction</h3>
-          <p>
-            Manage your 3-tier configuration cascade here (Base → Brand → Project).
-            Future updates will include visual editors for JSON/YAML config files.
-          </p>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('dss-config-module', ConfigModule);
-export default ConfigModule;
diff --git a/admin-ui/js/modules/discovery/DiscoveryModule.js b/admin-ui/js/modules/discovery/DiscoveryModule.js
deleted file mode 100644
index 9dc948c..0000000
--- a/admin-ui/js/modules/discovery/DiscoveryModule.js
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * DiscoveryModule.js
- * Feature module for scanning projects, activity logs, and analysis.
- */
-
-class DiscoveryModule extends HTMLElement {
-  constructor() {
-    super();
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.innerHTML = `
-      <style>
-        .module-container { padding: 24px; color: var(--vscode-foreground); }
-        .empty-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          border: 1px dashed var(--vscode-input-border);
-          border-radius: 6px;
-          margin-top: 24px;
-        }
-        .icon-large { font-size: 48px; margin-bottom: 16px; }
-        h1 { font-size: 24px; font-weight: 500; margin-bottom: 8px; }
-        p {
-          color: var(--vscode-descriptionForeground);
-          max-width: 500px;
-          text-align: center;
-          line-height: 1.5;
-        }
-      </style>
-
-      <div class="module-container">
-        <h1>Discovery</h1>
-        <div class="empty-state">
-          <div class="icon-large">🔍</div>
-          <h3>Discovery Module Under Construction</h3>
-          <p>
-            Run scanners, view codebase analytics, and monitor system activity.
-            Integration with the scanner backend is coming in the next phase.
-          </p>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('dss-discovery-module', DiscoveryModule);
-export default DiscoveryModule;
diff --git a/admin-ui/js/modules/projects/ProjectsModule.js b/admin-ui/js/modules/projects/ProjectsModule.js
deleted file mode 100644
index d175cc4..0000000
--- a/admin-ui/js/modules/projects/ProjectsModule.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/**
- * ProjectsModule.js
- * Feature module for managing DSS projects, metadata, and selection.
- */
-
-class ProjectsModule extends HTMLElement {
-  constructor() {
-    super();
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.innerHTML = `
-      <style>
-        .module-container {
-          padding: 24px;
-          color: var(--vscode-foreground);
-        }
-        .empty-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          border: 1px dashed var(--vscode-input-border, #3c3c3c);
-          border-radius: 6px;
-          background-color: var(--vscode-editor-background);
-          margin-top: 24px;
-        }
-        h1 {
-          font-size: 24px;
-          font-weight: 500;
-          margin-bottom: 8px;
-        }
-        .icon-large {
-          font-size: 48px;
-          margin-bottom: 16px;
-          opacity: 0.8;
-        }
-        p {
-          color: var(--vscode-descriptionForeground);
-          max-width: 500px;
-          text-align: center;
-          line-height: 1.5;
-        }
-      </style>
-
-      <div class="module-container">
-        <h1>Projects</h1>
-        <div class="empty-state">
-          <div class="icon-large">📁</div>
-          <h3>Projects Module Under Construction</h3>
-          <p>
-            This module will allow you to create new projects, edit project metadata,
-            and manage access controls. Currently, use the selector in the top bar to switch contexts.
-          </p>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('dss-projects-module', ProjectsModule);
-export default ProjectsModule;
diff --git a/admin-ui/js/modules/translations/TranslationsModule.js b/admin-ui/js/modules/translations/TranslationsModule.js
deleted file mode 100644
index e8a44aa..0000000
--- a/admin-ui/js/modules/translations/TranslationsModule.js
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * TranslationsModule.js
- * Feature module for managing Legacy → DSS token mappings (Principle #2).
- */
-
-class TranslationsModule extends HTMLElement {
-  constructor() {
-    super();
-  }
-
-  connectedCallback() {
-    this.render();
-  }
-
-  render() {
-    this.innerHTML = `
-      <style>
-        .module-container { padding: 24px; color: var(--vscode-foreground); }
-        .empty-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: 48px;
-          border: 1px dashed var(--vscode-input-border);
-          border-radius: 6px;
-          margin-top: 24px;
-        }
-        .icon-large { font-size: 48px; margin-bottom: 16px; }
-        h1 { font-size: 24px; font-weight: 500; margin-bottom: 8px; }
-        p {
-          color: var(--vscode-descriptionForeground);
-          max-width: 500px;
-          text-align: center;
-          line-height: 1.5;
-        }
-      </style>
-
-      <div class="module-container">
-        <h1>Translation Dictionaries</h1>
-        <div class="empty-state">
-          <div class="icon-large">🔄</div>
-          <h3>Translations Module Under Construction</h3>
-          <p>
-            <b>Core DSS Principle #2:</b> Map legacy design tokens to modern DSS tokens.
-            This interface will allow creation and validation of translation dictionaries.
-          </p>
-        </div>
-      </div>
-    `;
-  }
-}
-
-customElements.define('dss-translations-module', TranslationsModule);
-export default TranslationsModule;
diff --git a/admin-ui/js/pages/integrations.js b/admin-ui/js/pages/integrations.js
deleted file mode 100644
index 4a18245..0000000
--- a/admin-ui/js/pages/integrations.js
+++ /dev/null
@@ -1,285 +0,0 @@
-/**
- * Integrations Page - MCP Integration Configuration
- *
- * Allows users to configure project integrations:
- * - Figma (design tokens, components)
- * - Jira (issue tracking)
- * - Confluence (documentation)
- */
-
-import claudeService from '../services/claude-service.js';
-import logger from '../core/logger.js';
-
-class IntegrationsPage {
-  constructor() {
-    this.container = null;
-    this.projectId = null;
-    this.integrations = [];
-    this.healthStatus = [];
-  }
-
-  /**
-   * Initialize the page
-   */
-  async init(container, projectId) {
-    this.container = container;
-    this.projectId = projectId;
-
-    claudeService.setProject(projectId);
-
-    await this.loadData();
-    this.render();
-  }
-
-  /**
-   * Load integrations data
-   */
-  async loadData() {
-    try {
-      // Load global health status
-      this.healthStatus = await claudeService.getIntegrations();
-
-      // Load project-specific integrations
-      if (this.projectId) {
-        this.integrations = await claudeService.getProjectIntegrations(this.projectId);
-      }
-    } catch (error) {
-      logger.error('Integrations', 'Failed to load data', error);
-    }
-  }
-
-  /**
-   * Render the page
-   */
-  render() {
-    if (!this.container) return;
-
-    this.container.innerHTML = `
-      <div class="integrations-page">
-        <header class="page-header">
-          <h1>MCP Integrations</h1>
-          <p class="subtitle">Configure external service connections for Claude</p>
-        </header>
-
-        <div class="integrations-grid">
-          ${this.renderIntegrationCard('figma', {
-            title: 'Figma',
-            description: 'Connect to Figma for design tokens, components, and styles',
-            icon: '<svg viewBox="0 0 24 24" width="32" height="32"><path fill="currentColor" d="M12 12a4 4 0 1 1 4 4H8a4 4 0 1 1 0-8V4h4a4 4 0 0 1 0 8z"/></svg>',
-            fields: [
-              { name: 'api_token', label: 'API Token', type: 'password', placeholder: 'Enter Figma API token' }
-            ]
-          })}
-
-          ${this.renderIntegrationCard('jira', {
-            title: 'Jira',
-            description: 'Connect to Jira for issue tracking and project management',
-            icon: '<svg viewBox="0 0 24 24" width="32" height="32"><path fill="currentColor" d="M12 2L4 10l8 8 8-8-8-8zm0 4l4 4-4 4-4-4 4-4z"/></svg>',
-            fields: [
-              { name: 'url', label: 'Jira URL', type: 'url', placeholder: 'https://your-domain.atlassian.net' },
-              { name: 'username', label: 'Email', type: 'email', placeholder: 'your-email@example.com' },
-              { name: 'api_token', label: 'API Token', type: 'password', placeholder: 'Enter Jira API token' }
-            ]
-          })}
-
-          ${this.renderIntegrationCard('confluence', {
-            title: 'Confluence',
-            description: 'Connect to Confluence for documentation and knowledge base',
-            icon: '<svg viewBox="0 0 24 24" width="32" height="32"><path fill="currentColor" d="M4 4h16v16H4V4zm2 2v12h12V6H6z"/></svg>',
-            fields: [
-              { name: 'url', label: 'Confluence URL', type: 'url', placeholder: 'https://your-domain.atlassian.net/wiki' },
-              { name: 'username', label: 'Email', type: 'email', placeholder: 'your-email@example.com' },
-              { name: 'api_token', label: 'API Token', type: 'password', placeholder: 'Enter Confluence API token' }
-            ]
-          })}
-        </div>
-
-        <section class="mcp-tools-section">
-          <h2>Available MCP Tools</h2>
-          <div class="tools-list" id="tools-list">
-            <p class="loading">Loading tools...</p>
-          </div>
-        </section>
-      </div>
-    `;
-
-    this.attachEventListeners();
-    this.loadToolsList();
-  }
-
-  /**
-   * Render an integration card
-   */
-  renderIntegrationCard(type, config) {
-    const health = this.healthStatus.find(h => h.integration_type === type) || {};
-    const projectConfig = this.integrations.find(i => i.integration_type === type);
-    const isConfigured = !!projectConfig;
-    const isEnabled = projectConfig?.enabled ?? false;
-
-    const healthClass = health.is_healthy ? 'healthy' : 'unhealthy';
-    const healthText = health.is_healthy ? 'Healthy' : `Unhealthy (${health.failure_count} failures)`;
-
-    return `
-      <div class="integration-card ${isEnabled ? 'enabled' : ''}" data-type="${type}">
-        <div class="card-header">
-          <div class="icon">${config.icon}</div>
-          <div class="info">
-            <h3>${config.title}</h3>
-            <p>${config.description}</p>
-          </div>
-          <div class="status">
-            <span class="health-badge ${healthClass}">${healthText}</span>
-            ${isConfigured ? '<span class="configured-badge">Configured</span>' : ''}
-          </div>
-        </div>
-
-        <form class="integration-form" data-type="${type}">
-          ${config.fields.map(field => `
-            <div class="form-group">
-              <label for="${type}-${field.name}">${field.label}</label>
-              <input
-                type="${field.type}"
-                id="${type}-${field.name}"
-                name="${field.name}"
-                placeholder="${field.placeholder}"
-                ${field.type === 'password' ? 'autocomplete="off"' : ''}
-              />
-            </div>
-          `).join('')}
-
-          <div class="form-actions">
-            <button type="submit" class="btn btn-primary">
-              ${isConfigured ? 'Update' : 'Connect'}
-            </button>
-            ${isConfigured ? `
-              <button type="button" class="btn btn-secondary toggle-btn" data-enabled="${isEnabled}">
-                ${isEnabled ? 'Disable' : 'Enable'}
-              </button>
-              <button type="button" class="btn btn-danger delete-btn">Disconnect</button>
-            ` : ''}
-          </div>
-        </form>
-      </div>
-    `;
-  }
-
-  /**
-   * Attach event listeners
-   */
-  attachEventListeners() {
-    // Form submissions
-    this.container.querySelectorAll('.integration-form').forEach(form => {
-      form.addEventListener('submit', (e) => this.handleFormSubmit(e));
-    });
-
-    // Toggle buttons
-    this.container.querySelectorAll('.toggle-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => this.handleToggle(e));
-    });
-
-    // Delete buttons
-    this.container.querySelectorAll('.delete-btn').forEach(btn => {
-      btn.addEventListener('click', (e) => this.handleDelete(e));
-    });
-  }
-
-  /**
-   * Handle form submission
-   */
-  async handleFormSubmit(e) {
-    e.preventDefault();
-    const form = e.target;
-    const type = form.dataset.type;
-    const formData = new FormData(form);
-    const config = {};
-
-    formData.forEach((value, key) => {
-      if (value) config[key] = value;
-    });
-
-    if (Object.keys(config).length === 0) {
-      alert('Please fill in at least one field');
-      return;
-    }
-
-    try {
-      await claudeService.configureIntegration(type, config, this.projectId);
-      alert(`${type} integration configured successfully!`);
-      await this.loadData();
-      this.render();
-    } catch (error) {
-      alert(`Failed to configure ${type}: ${error.message}`);
-    }
-  }
-
-  /**
-   * Handle toggle
-   */
-  async handleToggle(e) {
-    const card = e.target.closest('.integration-card');
-    const type = card.dataset.type;
-    const currentlyEnabled = e.target.dataset.enabled === 'true';
-
-    try {
-      await claudeService.toggleIntegration(type, !currentlyEnabled, this.projectId);
-      await this.loadData();
-      this.render();
-    } catch (error) {
-      alert(`Failed to toggle ${type}: ${error.message}`);
-    }
-  }
-
-  /**
-   * Handle delete
-   */
-  async handleDelete(e) {
-    const card = e.target.closest('.integration-card');
-    const type = card.dataset.type;
-
-    if (!confirm(`Are you sure you want to disconnect ${type}?`)) {
-      return;
-    }
-
-    try {
-      await claudeService.deleteIntegration(type, this.projectId);
-      await this.loadData();
-      this.render();
-    } catch (error) {
-      alert(`Failed to disconnect ${type}: ${error.message}`);
-    }
-  }
-
-  /**
-   * Load and display MCP tools list
-   */
-  async loadToolsList() {
-    const toolsList = this.container.querySelector('#tools-list');
-
-    try {
-      const result = await claudeService.getMcpTools();
-
-      const html = Object.entries(result.tools).map(([category, tools]) => `
-        <div class="tool-category">
-          <h3>${category.charAt(0).toUpperCase() + category.slice(1)} Tools (${tools.length})</h3>
-          <ul>
-            ${tools.map(tool => `
-              <li>
-                <strong>${tool.name}</strong>
-                <span>${tool.description}</span>
-              </li>
-            `).join('')}
-          </ul>
-        </div>
-      `).join('');
-
-      toolsList.innerHTML = html || '<p>No tools available</p>';
-    } catch (error) {
-      toolsList.innerHTML = '<p class="error">Failed to load tools</p>';
-    }
-  }
-}
-
-// Export singleton
-const integrationsPage = new IntegrationsPage();
-export default integrationsPage;
-export { IntegrationsPage };
diff --git a/admin-ui/js/plugins/claude-plugin.js b/admin-ui/js/plugins/claude-plugin.js
deleted file mode 100644
index eeb5d0d..0000000
--- a/admin-ui/js/plugins/claude-plugin.js
+++ /dev/null
@@ -1,208 +0,0 @@
-/**
- * Claude Plugin for DSS Admin UI
- *
- * Provides Claude AI integration features:
- * - Enhanced AI assistant capabilities
- * - Code generation commands
- * - Design token analysis
- * - Component suggestions
- */
-
-const ClaudePlugin = {
-  id: 'claude-ai',
-  name: 'Claude AI Assistant',
-  version: '1.0.0',
-  description: 'Enhanced Claude AI integration for design system workflows',
-  author: 'DSS Team',
-  icon: '🤖',
-  category: 'ai',
-  enabledByDefault: true,
-
-  // Plugin settings schema
-  settings: [
-    {
-      key: 'model',
-      label: 'Claude Model',
-      type: 'select',
-      options: [
-        { value: 'claude-3-sonnet', label: 'Claude 3 Sonnet (Fast)' },
-        { value: 'claude-3-opus', label: 'Claude 3 Opus (Advanced)' },
-        { value: 'claude-3-haiku', label: 'Claude 3 Haiku (Quick)' }
-      ],
-      default: 'claude-3-sonnet'
-    },
-    {
-      key: 'autoSuggest',
-      label: 'Auto-suggest improvements',
-      type: 'boolean',
-      default: true
-    },
-    {
-      key: 'contextDepth',
-      label: 'Context Depth',
-      type: 'select',
-      options: [
-        { value: 'minimal', label: 'Minimal' },
-        { value: 'standard', label: 'Standard' },
-        { value: 'deep', label: 'Deep Analysis' }
-      ],
-      default: 'standard'
-    }
-  ],
-
-  // Commands provided by this plugin
-  commands: [
-    {
-      name: 'analyze-tokens',
-      description: 'Analyze design tokens with Claude AI',
-      icon: '🎨',
-      execute: async (ctx, args) => {
-        ctx.log('Analyzing tokens...');
-        return { success: true, message: 'Token analysis complete' };
-      }
-    },
-    {
-      name: 'suggest-components',
-      description: 'Get component suggestions based on project analysis',
-      icon: '🧩',
-      execute: async (ctx, args) => {
-        ctx.log('Generating component suggestions...');
-        return { success: true, message: 'Suggestions generated' };
-      }
-    },
-    {
-      name: 'generate-docs',
-      description: 'Generate documentation for components',
-      icon: '📝',
-      execute: async (ctx, args) => {
-        ctx.log('Generating documentation...');
-        return { success: true, message: 'Documentation generated' };
-      }
-    },
-    {
-      name: 'review-code',
-      description: 'Review generated code for best practices',
-      icon: '🔍',
-      execute: async (ctx, args) => {
-        ctx.log('Reviewing code...');
-        return { success: true, message: 'Code review complete' };
-      }
-    }
-  ],
-
-  // UI panels provided by this plugin
-  panels: [
-    {
-      id: 'claude-insights',
-      name: 'AI Insights',
-      icon: '💡',
-      position: 'sidebar',
-      render: (container, ctx) => {
-        container.innerHTML = `
-          <div class="claude-insights-panel">
-            <h4>AI Insights</h4>
-            <div class="insights-content">
-              <p class="insight-placeholder">
-                Run an analysis to see AI-powered insights about your design system.
-              </p>
-            </div>
-            <button class="btn btn--sm btn--primary" data-action="run-analysis">
-              Run Analysis
-            </button>
-          </div>
-        `;
-      }
-    }
-  ],
-
-  // Lifecycle hooks
-  onInit: async (ctx) => {
-    ctx.log('Claude plugin initializing...');
-
-    // Register hooks for AI-related events
-    ctx.registerHook('chat:message', async (data) => {
-      // Intercept chat messages for AI processing hints
-      return data;
-    });
-
-    ctx.registerHook('project:analyzed', async (data) => {
-      // Auto-generate insights when project is analyzed
-      const settings = ctx.getSettings();
-      if (settings.autoSuggest) {
-        ctx.emit('claude:insights-ready', {
-          type: 'auto',
-          project: data.projectId
-        });
-      }
-    });
-
-    ctx.log('Claude plugin initialized');
-  },
-
-  onEnable: async (ctx) => {
-    ctx.log('Claude plugin enabled');
-
-    // Add Claude-specific styles
-    const style = document.createElement('style');
-    style.id = 'claude-plugin-styles';
-    style.textContent = `
-      .claude-insights-panel {
-        padding: 12px;
-      }
-      .claude-insights-panel h4 {
-        margin: 0 0 12px 0;
-        font-size: 14px;
-        color: var(--text-primary);
-      }
-      .insights-content {
-        background: var(--bg-secondary);
-        border-radius: 6px;
-        padding: 12px;
-        margin-bottom: 12px;
-        min-height: 100px;
-      }
-      .insight-placeholder {
-        color: var(--text-muted);
-        font-size: 13px;
-        margin: 0;
-      }
-      .claude-badge {
-        display: inline-flex;
-        align-items: center;
-        gap: 4px;
-        padding: 2px 8px;
-        background: linear-gradient(135deg, #7c3aed, #a855f7);
-        color: white;
-        border-radius: 12px;
-        font-size: 11px;
-        font-weight: 500;
-      }
-      .claude-suggestion {
-        border-left: 3px solid #a855f7;
-        padding-left: 12px;
-        margin: 8px 0;
-      }
-    `;
-    document.head.appendChild(style);
-  },
-
-  onDisable: async (ctx) => {
-    ctx.log('Claude plugin disabled');
-
-    // Remove Claude-specific styles
-    const style = document.getElementById('claude-plugin-styles');
-    if (style) {
-      style.remove();
-    }
-
-    // Unregister hooks
-    ctx.unregisterHook('chat:message');
-    ctx.unregisterHook('project:analyzed');
-  },
-
-  onDestroy: async (ctx) => {
-    ctx.log('Claude plugin destroyed');
-  }
-};
-
-export default ClaudePlugin;
diff --git a/admin-ui/js/plugins/index.js b/admin-ui/js/plugins/index.js
deleted file mode 100644
index ab590be..0000000
--- a/admin-ui/js/plugins/index.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/**
- * Plugin Registry - Auto-registers all available plugins
- */
-
-import pluginService from '../services/plugin-service.js';
-import ClaudePlugin from './claude-plugin.js';
-
-// Built-in plugins
-const builtInPlugins = [
-  ClaudePlugin
-];
-
-/**
- * Initialize all plugins
- */
-export function initializePlugins() {
-  for (const plugin of builtInPlugins) {
-    try {
-      pluginService.register(plugin);
-    } catch (e) {
-      console.error(`Failed to register plugin ${plugin.id}:`, e);
-    }
-  }
-}
-
-/**
- * Load a plugin from URL (for external plugins)
- */
-export async function loadExternalPlugin(url) {
-  try {
-    const module = await import(url);
-    if (module.default) {
-      pluginService.register(module.default);
-      return module.default;
-    }
-    throw new Error('Plugin module must have a default export');
-  } catch (e) {
-    console.error(`Failed to load plugin from ${url}:`, e);
-    throw e;
-  }
-}
-
-export default {
-  initializePlugins,
-  loadExternalPlugin
-};
diff --git a/admin-ui/js/services/api-client.js b/admin-ui/js/services/api-client.js
deleted file mode 100644
index ca8474b..0000000
--- a/admin-ui/js/services/api-client.js
+++ /dev/null
@@ -1,268 +0,0 @@
-/**
- * api-client.js
- * Unified API client for backend communication
- * Handles authentication, request/response formatting, error handling
- * Supports incognito mode with sessionStorage fallback (lazy-initialized)
- */
-
-class ApiClient {
-  constructor(baseURL = null) {
-    // Use relative path /api which works for both production (proxied through nginx)
-    // and development (proxied through Vite to backend on localhost:8002)
-    this.baseURL = baseURL || '/api';
-    this.accessToken = null;
-    this.refreshToken = null;
-    this.loadTokensFromStorage();
-    this.setupAuthChangeListener();
-  }
-
-  setupAuthChangeListener() {
-    // Listen for auth changes (e.g., from demo-auth-init.js or other components)
-    // and reload tokens from storage
-    document.addEventListener('auth-change', () => {
-      console.log('[ApiClient] Auth change detected, reloading tokens...');
-      this.loadTokensFromStorage();
-    });
-    window.addEventListener('auth-change', () => {
-      console.log('[ApiClient] Auth change detected, reloading tokens...');
-      this.loadTokensFromStorage();
-    });
-  }
-
-  loadTokensFromStorage() {
-    // Always use localStorage directly for auth tokens
-    // This ensures compatibility with demo-auth-init.js which also uses localStorage
-    const stored = localStorage.getItem('auth_tokens');
-    if (stored) {
-      try {
-        const parsed = JSON.parse(stored);
-        console.log('[ApiClient] Parsed tokens object:', { hasAccessToken: !!parsed.accessToken, hasRefreshToken: !!parsed.refreshToken });
-        this.accessToken = parsed.accessToken;
-        this.refreshToken = parsed.refreshToken;
-        console.log('[ApiClient] Tokens assigned - accessToken:', this.accessToken ? `${this.accessToken.substring(0, 20)}...` : 'null');
-      } catch (e) {
-        console.error('[ApiClient] Failed to parse stored tokens:', e, 'stored value:', stored);
-      }
-    } else {
-      console.warn('[ApiClient] No auth_tokens found in localStorage');
-    }
-  }
-
-  saveTokensToStorage() {
-    try {
-      // Always use localStorage directly for auth tokens
-      localStorage.setItem('auth_tokens', JSON.stringify({
-        accessToken: this.accessToken,
-        refreshToken: this.refreshToken
-      }));
-    } catch (e) {
-      console.warn('[ApiClient] Failed to save tokens to storage:', e);
-    }
-  }
-
-  clearTokens() {
-    this.accessToken = null;
-    this.refreshToken = null;
-    localStorage.removeItem('auth_tokens');
-  }
-
-  async request(method, endpoint, data = null) {
-    // Always reload tokens from storage before making a request
-    // This handles the case where tokens were set after API client initialization (e.g., auto-login)
-    this.loadTokensFromStorage();
-
-    const url = `${this.baseURL}${endpoint}`;
-    const options = {
-      method,
-      headers: {
-        'Content-Type': 'application/json'
-      }
-    };
-
-    if (this.accessToken) {
-      options.headers['Authorization'] = `Bearer ${this.accessToken}`;
-      console.log(`[ApiClient] ${method} ${endpoint}: Token present (${this.accessToken.substring(0, 20)}...)`);
-    } else {
-      console.warn(`[ApiClient] ${method} ${endpoint}: No token provided`);
-    }
-
-    if (data) {
-      options.body = JSON.stringify(data);
-    }
-
-    try {
-      const response = await fetch(url, options);
-      const result = await response.json();
-
-      if (!response.ok) {
-        // Handle token refresh
-        if (response.status === 403 && result.code === 'FORBIDDEN' && this.refreshToken) {
-          await this.refreshAccessToken();
-          return this.request(method, endpoint, data);
-        }
-
-        throw new Error(result.message || 'API request failed');
-      }
-
-      // Handle both response formats:
-      // 1. Standard wrapped response: { data: {...} }
-      // 2. Direct array response: [...]
-      // 3. Direct object response: {...}
-      if (Array.isArray(result)) {
-        return result;
-      }
-      return result.data || result;
-    } catch (error) {
-      console.error(`[ApiClient] ${method} ${endpoint}:`, error);
-      throw error;
-    }
-  }
-
-  async refreshAccessToken() {
-    try {
-      const response = await fetch(`${this.baseURL}/auth/refresh`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ refreshToken: this.refreshToken })
-      });
-
-      const result = await response.json();
-      if (result.status === 'success') {
-        this.accessToken = result.data.tokens.accessToken;
-        this.refreshToken = result.data.tokens.refreshToken;
-        this.saveTokensToStorage();
-        this.dispatchAuthChangeEvent('token-refresh');
-        return true;
-      }
-
-      this.clearTokens();
-      this.dispatchAuthChangeEvent('token-expired');
-      return false;
-    } catch (error) {
-      console.error('[ApiClient] Token refresh failed:', error);
-      this.clearTokens();
-      this.dispatchAuthChangeEvent('token-refresh-error');
-      return false;
-    }
-  }
-
-  /**
-   * Dispatch auth-change event to notify all listeners of authentication state changes
-   */
-  dispatchAuthChangeEvent(reason = 'auth-change') {
-    const event = new CustomEvent('auth-change', {
-      detail: { reason, hasToken: !!this.accessToken },
-      bubbles: true,
-      composed: true
-    });
-    document.dispatchEvent(event);
-    window.dispatchEvent(event);
-  }
-
-  // Auth endpoints
-  async register(email, password, name) {
-    const result = await this.request('POST', '/auth/register', {
-      email, password, name
-    });
-    this.accessToken = result.tokens.accessToken;
-    this.refreshToken = result.tokens.refreshToken;
-    this.saveTokensToStorage();
-    this.dispatchAuthChangeEvent('user-registered');
-    return result.user;
-  }
-
-  async login(email, password) {
-    const result = await this.request('POST', '/auth/login', {
-      email, password
-    });
-    this.accessToken = result.tokens.accessToken;
-    this.refreshToken = result.tokens.refreshToken;
-    this.saveTokensToStorage();
-    this.dispatchAuthChangeEvent('user-logged-in');
-    return result.user;
-  }
-
-  async getMe() {
-    const result = await this.request('GET', '/auth/me');
-    return result.user;
-  }
-
-  async logout() {
-    this.clearTokens();
-    this.dispatchAuthChangeEvent('user-logged-out');
-  }
-
-  // Project endpoints
-  async getProjects() {
-    const result = await this.request('GET', '/projects');
-    // Handle both response formats:
-    // 1. Wrapped response: { data: { projects: [...] } }
-    // 2. Direct array response: [...]
-    if (Array.isArray(result)) {
-      return result;
-    }
-    return result.projects || result.data?.projects || [];
-  }
-
-  async getProject(id) {
-    const result = await this.request('GET', `/projects/${id}`);
-    return result.project;
-  }
-
-  async createProject(data) {
-    const result = await this.request('POST', '/projects', data);
-    return result.project;
-  }
-
-  async updateProject(id, data) {
-    const result = await this.request('PUT', `/projects/${id}`, data);
-    return result.project;
-  }
-
-  async deleteProject(id) {
-    await this.request('DELETE', `/projects/${id}`);
-  }
-
-  // Token endpoints
-  async getTokens(projectId, category = null) {
-    const url = `/tokens/project/${projectId}${category ? `?category=${category}` : ''}`;
-    const result = await this.request('GET', url);
-    return result.tokens;
-  }
-
-  async createToken(data) {
-    const result = await this.request('POST', '/tokens', data);
-    return result.token;
-  }
-
-  async updateToken(id, data) {
-    const result = await this.request('PUT', `/tokens/${id}`, data);
-    return result.token;
-  }
-
-  async deleteToken(id) {
-    await this.request('DELETE', `/tokens/${id}`);
-  }
-
-  // Component endpoints
-  async getComponents(projectId) {
-    const result = await this.request('GET', `/components/project/${projectId}`);
-    return result.components;
-  }
-
-  async createComponent(data) {
-    const result = await this.request('POST', '/components', data);
-    return result.component;
-  }
-
-  async updateComponent(id, data) {
-    const result = await this.request('PUT', `/components/${id}`, data);
-    return result.component;
-  }
-
-  async deleteComponent(id) {
-    await this.request('DELETE', `/components/${id}`);
-  }
-}
-
-export default new ApiClient();
diff --git a/admin-ui/js/services/audit-service.js b/admin-ui/js/services/audit-service.js
deleted file mode 100644
index 06a7317..0000000
--- a/admin-ui/js/services/audit-service.js
+++ /dev/null
@@ -1,193 +0,0 @@
-/**
- * Audit Log Service - User action history tracking
- */
-
-import api from '../core/api.js';
-import logger from '../core/logger.js';
-
-class AuditService {
-  constructor() {
-    this.cache = {
-      categories: null,
-      actions: null
-    };
-  }
-
-  /**
-   * Get audit log with filters
-   */
-  async getAuditLog(filters = {}) {
-    const params = new URLSearchParams();
-
-    if (filters.project_id) params.append('project_id', filters.project_id);
-    if (filters.user_id) params.append('user_id', filters.user_id);
-    if (filters.action) params.append('action', filters.action);
-    if (filters.category) params.append('category', filters.category);
-    if (filters.entity_type) params.append('entity_type', filters.entity_type);
-    if (filters.severity) params.append('severity', filters.severity);
-    if (filters.start_date) params.append('start_date', filters.start_date);
-    if (filters.end_date) params.append('end_date', filters.end_date);
-    if (filters.limit) params.append('limit', filters.limit);
-    if (filters.offset) params.append('offset', filters.offset);
-
-    try {
-      const response = await api.get(`/audit?${params.toString()}`);
-      return response;
-    } catch (error) {
-      logger.error('AuditService', 'Failed to fetch audit log', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Get audit statistics
-   */
-  async getStats() {
-    try {
-      return await api.get('/audit/stats');
-    } catch (error) {
-      logger.error('AuditService', 'Failed to fetch audit stats', error);
-      return {
-        by_category: {},
-        by_user: {},
-        total_count: 0
-      };
-    }
-  }
-
-  /**
-   * Get all categories
-   */
-  async getCategories() {
-    if (this.cache.categories) {
-      return this.cache.categories;
-    }
-
-    try {
-      this.cache.categories = await api.get('/audit/categories');
-      return this.cache.categories;
-    } catch (error) {
-      logger.error('AuditService', 'Failed to fetch categories', error);
-      return [];
-    }
-  }
-
-  /**
-   * Get all actions
-   */
-  async getActions() {
-    if (this.cache.actions) {
-      return this.cache.actions;
-    }
-
-    try {
-      this.cache.actions = await api.get('/audit/actions');
-      return this.cache.actions;
-    } catch (error) {
-      logger.error('AuditService', 'Failed to fetch actions', error);
-      return [];
-    }
-  }
-
-  /**
-   * Create audit entry
-   */
-  async logAction(entry) {
-    try {
-      await api.post('/audit', entry);
-      logger.info('AuditService', 'Action logged', { action: entry.action });
-    } catch (error) {
-      logger.error('AuditService', 'Failed to log action', error);
-    }
-  }
-
-  /**
-   * Export audit log
-   */
-  async export(filters = {}, format = 'json') {
-    const params = new URLSearchParams({ format });
-
-    if (filters.project_id) params.append('project_id', filters.project_id);
-    if (filters.category) params.append('category', filters.category);
-    if (filters.start_date) params.append('start_date', filters.start_date);
-    if (filters.end_date) params.append('end_date', filters.end_date);
-
-    try {
-      const url = `${api.baseUrl}/audit/export?${params.toString()}`;
-      window.open(url, '_blank');
-      logger.info('AuditService', 'Export initiated', { format });
-    } catch (error) {
-      logger.error('AuditService', 'Failed to export', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Get severity badge class
-   */
-  getSeverityClass(severity) {
-    const classes = {
-      'info': 'badge--primary',
-      'warning': 'badge--warning',
-      'critical': 'badge--destructive'
-    };
-    return classes[severity] || 'badge--secondary';
-  }
-
-  /**
-   * Get category icon
-   */
-  getCategoryIcon(category) {
-    const icons = {
-      'design_system': '🎨',
-      'code': '⚛️',
-      'configuration': '⚙️',
-      'project': '📁',
-      'team': '👥',
-      'storybook': '📚',
-      'other': '📌'
-    };
-    return icons[category] || '📌';
-  }
-
-  /**
-   * Format timestamp
-   */
-  formatTimestamp(timestamp) {
-    const date = new Date(timestamp);
-    const now = new Date();
-    const diff = now - date;
-
-    // Less than 1 minute
-    if (diff < 60000) {
-      return 'Just now';
-    }
-
-    // Less than 1 hour
-    if (diff < 3600000) {
-      const minutes = Math.floor(diff / 60000);
-      return `${minutes} minute${minutes > 1 ? 's' : ''} ago`;
-    }
-
-    // Less than 1 day
-    if (diff < 86400000) {
-      const hours = Math.floor(diff / 3600000);
-      return `${hours} hour${hours > 1 ? 's' : ''} ago`;
-    }
-
-    // Less than 7 days
-    if (diff < 604800000) {
-      const days = Math.floor(diff / 86400000);
-      return `${days} day${days > 1 ? 's' : ''} ago`;
-    }
-
-    // Show full date
-    return date.toLocaleDateString() + ' ' + date.toLocaleTimeString();
-  }
-}
-
-// Singleton instance
-const auditService = new AuditService();
-
-export default auditService;
-export { AuditService };
diff --git a/admin-ui/js/services/claude-service.js b/admin-ui/js/services/claude-service.js
deleted file mode 100644
index dcb7194..0000000
--- a/admin-ui/js/services/claude-service.js
+++ /dev/null
@@ -1,378 +0,0 @@
-/**
- * Claude Service - Chat interface with Claude AI and MCP Integration
- *
- * Provides:
- * - Direct Claude chat
- * - MCP tool execution
- * - Project context integration
- * - Integration management (Figma, Jira, Confluence)
- */
-
-import api from '../core/api.js';
-import logger from '../core/logger.js';
-
-class ClaudeService {
-  constructor() {
-    this.conversationHistory = [];
-    this.maxHistory = 50;
-    this.currentProjectId = null;
-    this.userId = 1; // Default user ID (TODO: implement proper auth)
-    this.mcpTools = null;
-    this.mcpStatus = null;
-
-    // Load persisted chat history
-    this.loadHistory();
-  }
-
-  /**
-   * Get storage key for current user
-   * @private
-   */
-  _getStorageKey() {
-    return `ds-chat-history-user-${this.userId}`;
-  }
-
-  /**
-   * Load chat history from localStorage
-   * @private
-   */
-  loadHistory() {
-    const key = this._getStorageKey();
-    try {
-      const stored = localStorage.getItem(key);
-      if (stored) {
-        this.conversationHistory = JSON.parse(stored);
-        logger.info('Claude', `Loaded ${this.conversationHistory.length} messages from history`);
-      }
-    } catch (error) {
-      logger.warn('Claude', 'Failed to load chat history, resetting', error);
-      localStorage.removeItem(key);
-      this.conversationHistory = [];
-    }
-  }
-
-  /**
-   * Save chat history to localStorage with quota management
-   * @private
-   */
-  saveHistory() {
-    const key = this._getStorageKey();
-    try {
-      // Keep only last 50 messages to respect localStorage limits
-      const historyToSave = this.conversationHistory.slice(-50);
-      localStorage.setItem(key, JSON.stringify(historyToSave));
-    } catch (error) {
-      logger.warn('Claude', 'Failed to save chat history', error);
-      if (error.name === 'QuotaExceededError') {
-        // Emergency trim: cut in half and retry
-        this.conversationHistory = this.conversationHistory.slice(-25);
-        try {
-          localStorage.setItem(key, JSON.stringify(this.conversationHistory));
-          logger.info('Claude', 'History trimmed to 25 messages due to quota');
-        } catch (retryError) {
-          logger.error('Claude', 'Failed to save history even after trim', retryError);
-        }
-      }
-    }
-  }
-
-  /**
-   * Set current project context
-   */
-  setProject(projectId) {
-    this.currentProjectId = projectId;
-    logger.info('Claude', 'Project context set', { projectId });
-  }
-
-  /**
-   * Send message to Claude with MCP context
-   */
-  async chat(message, context = {}) {
-    logger.info('Claude', 'Sending message', { message: message.substring(0, 50) + '...' });
-
-    // Add project context if available
-    if (this.currentProjectId && !context.projectId) {
-      context.projectId = this.currentProjectId;
-    }
-
-    // Add to history
-    this.conversationHistory.push({
-      role: 'user',
-      content: message,
-      timestamp: new Date().toISOString()
-    });
-
-    try {
-      // Call backend Claude endpoint with MCP context
-      const response = await api.post('/claude/chat', {
-        message,
-        context: {
-          ...context,
-          mcp_enabled: true,
-          available_tools: this.mcpTools ? Object.keys(this.mcpTools).flatMap(k => this.mcpTools[k].map(t => t.name)) : []
-        },
-        history: this.conversationHistory.slice(-10) // Send last 10 messages
-      });
-
-      // Add response to history
-      this.conversationHistory.push({
-        role: 'assistant',
-        content: response.response,
-        timestamp: new Date().toISOString(),
-        tools_used: response.tools_used || []
-      });
-
-      // Keep history manageable
-      if (this.conversationHistory.length > this.maxHistory) {
-        this.conversationHistory = this.conversationHistory.slice(-this.maxHistory);
-      }
-
-      // Persist updated history
-      this.saveHistory();
-
-      logger.info('Claude', 'Received response', { length: response.response.length });
-
-      return response.response;
-    } catch (error) {
-      logger.error('Claude', 'Chat failed', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Get conversation history
-   */
-  getHistory() {
-    return this.conversationHistory;
-  }
-
-  /**
-   * Clear history
-   */
-  clearHistory() {
-    this.conversationHistory = [];
-    this.saveHistory(); // Persist empty state
-    logger.info('Claude', 'Conversation history cleared');
-  }
-
-  /**
-   * Export conversation
-   */
-  exportConversation() {
-    const data = JSON.stringify(this.conversationHistory, null, 2);
-    const dataUri = 'data:application/json;charset=utf-8,' + encodeURIComponent(data);
-    const exportFileDefaultName = `claude-conversation-${Date.now()}.json`;
-
-    const linkElement = document.createElement('a');
-    linkElement.setAttribute('href', dataUri);
-    linkElement.setAttribute('download', exportFileDefaultName);
-    linkElement.click();
-  }
-
-  // === MCP Integration Methods ===
-
-  /**
-   * Get MCP server status
-   */
-  async getMcpStatus() {
-    try {
-      const status = await api.get('/mcp/status');
-      this.mcpStatus = status;
-      logger.info('Claude', 'MCP status fetched', status);
-      return status;
-    } catch (error) {
-      logger.error('Claude', 'Failed to fetch MCP status', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Get all available MCP tools
-   */
-  async getMcpTools() {
-    try {
-      const tools = await api.get('/mcp/tools');
-      this.mcpTools = tools.tools;
-      logger.info('Claude', 'MCP tools fetched', { count: tools.total_count });
-      return tools;
-    } catch (error) {
-      logger.error('Claude', 'Failed to fetch MCP tools', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Execute an MCP tool directly
-   */
-  async executeMcpTool(toolName, args = {}) {
-    if (this.currentProjectId && !args.project_id) {
-      args.project_id = this.currentProjectId;
-    }
-
-    try {
-      logger.info('Claude', 'Executing MCP tool', { toolName, args });
-      const result = await api.post(`/mcp/tools/${toolName}/execute?user_id=${this.userId}`, args);
-      logger.info('Claude', 'MCP tool executed', { toolName, success: !result.error });
-      return result;
-    } catch (error) {
-      logger.error('Claude', 'MCP tool execution failed', error);
-      throw error;
-    }
-  }
-
-  // === Integration Management ===
-
-  /**
-   * Get all integration types and their health status
-   */
-  async getIntegrations() {
-    try {
-      const integrations = await api.get('/mcp/integrations');
-      logger.info('Claude', 'Integrations fetched', { count: integrations.integrations.length });
-      return integrations.integrations;
-    } catch (error) {
-      logger.error('Claude', 'Failed to fetch integrations', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Get project-specific integrations
-   */
-  async getProjectIntegrations(projectId = null) {
-    const pid = projectId || this.currentProjectId;
-    if (!pid) {
-      throw new Error('No project ID specified');
-    }
-
-    try {
-      const integrations = await api.get(`/projects/${pid}/integrations?user_id=${this.userId}`);
-      return integrations.integrations;
-    } catch (error) {
-      logger.error('Claude', 'Failed to fetch project integrations', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Configure an integration for a project
-   */
-  async configureIntegration(integrationType, config, projectId = null) {
-    const pid = projectId || this.currentProjectId;
-    if (!pid) {
-      throw new Error('No project ID specified');
-    }
-
-    try {
-      const result = await api.post(`/projects/${pid}/integrations?user_id=${this.userId}`, {
-        integration_type: integrationType,
-        config,
-        enabled: true
-      });
-      logger.info('Claude', 'Integration configured', { integrationType, projectId: pid });
-      return result;
-    } catch (error) {
-      logger.error('Claude', 'Failed to configure integration', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Update an integration
-   */
-  async updateIntegration(integrationType, updates, projectId = null) {
-    const pid = projectId || this.currentProjectId;
-    if (!pid) {
-      throw new Error('No project ID specified');
-    }
-
-    try {
-      const result = await api.put(
-        `/projects/${pid}/integrations/${integrationType}?user_id=${this.userId}`,
-        updates
-      );
-      logger.info('Claude', 'Integration updated', { integrationType, projectId: pid });
-      return result;
-    } catch (error) {
-      logger.error('Claude', 'Failed to update integration', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Delete an integration
-   */
-  async deleteIntegration(integrationType, projectId = null) {
-    const pid = projectId || this.currentProjectId;
-    if (!pid) {
-      throw new Error('No project ID specified');
-    }
-
-    try {
-      const result = await api.delete(
-        `/projects/${pid}/integrations/${integrationType}?user_id=${this.userId}`
-      );
-      logger.info('Claude', 'Integration deleted', { integrationType, projectId: pid });
-      return result;
-    } catch (error) {
-      logger.error('Claude', 'Failed to delete integration', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Toggle integration enabled/disabled
-   */
-  async toggleIntegration(integrationType, enabled, projectId = null) {
-    return this.updateIntegration(integrationType, { enabled }, projectId);
-  }
-
-  // === Project Context Tools ===
-
-  /**
-   * Get project summary via MCP
-   */
-  async getProjectSummary(projectId = null) {
-    return this.executeMcpTool('dss_get_project_summary', {
-      project_id: projectId || this.currentProjectId,
-      include_components: false
-    });
-  }
-
-  /**
-   * Get project health via MCP
-   */
-  async getProjectHealth(projectId = null) {
-    return this.executeMcpTool('dss_get_project_health', {
-      project_id: projectId || this.currentProjectId
-    });
-  }
-
-  /**
-   * List project components via MCP
-   */
-  async listComponents(projectId = null, filter = null) {
-    const args = { project_id: projectId || this.currentProjectId };
-    if (filter) {
-      args.filter_name = filter;
-    }
-    return this.executeMcpTool('dss_list_components', args);
-  }
-
-  /**
-   * Get design tokens via MCP
-   */
-  async getDesignTokens(projectId = null, category = null) {
-    const args = { project_id: projectId || this.currentProjectId };
-    if (category) {
-      args.token_category = category;
-    }
-    return this.executeMcpTool('dss_get_design_tokens', args);
-  }
-}
-
-// Singleton instance
-const claudeService = new ClaudeService();
-
-export default claudeService;
-export { ClaudeService };
diff --git a/admin-ui/js/services/dashboard-service.js b/admin-ui/js/services/dashboard-service.js
deleted file mode 100644
index 6499f12..0000000
--- a/admin-ui/js/services/dashboard-service.js
+++ /dev/null
@@ -1,256 +0,0 @@
-/**
- * Dashboard Service
- *
- * Handles team dashboard data fetching and management
- * - UX Dashboard: Figma files and component tokens
- * - UI Dashboard: Token drift detection and code metrics
- * - QA Dashboard: ESRE definitions and test results
- */
-
-const API_BASE = '/api';
-
-export class DashboardService {
-  /**
-   * Get aggregated dashboard summary for all teams
-   */
-  static async getDashboardSummary(projectId) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/dashboard/summary`);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch dashboard summary: ${response.statusText}`);
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error fetching dashboard summary:', error);
-      throw error;
-    }
-  }
-
-  // ============================================
-  // UX DASHBOARD - Figma Files
-  // ============================================
-
-  /**
-   * List all Figma files for a project
-   */
-  static async listFigmaFiles(projectId) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/figma-files`);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch Figma files: ${response.statusText}`);
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error fetching Figma files:', error);
-      return [];
-    }
-  }
-
-  /**
-   * Add a new Figma file to a project
-   */
-  static async addFigmaFile(projectId, figmaData) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/figma-files`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(figmaData)
-      });
-      if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.detail || 'Failed to add Figma file');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error adding Figma file:', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Update Figma file sync status
-   */
-  static async updateFigmaFileSync(projectId, fileId, syncStatus) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/figma-files/${fileId}/sync`, {
-        method: 'PUT',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          sync_status: syncStatus,
-          last_synced: new Date().toISOString()
-        })
-      });
-      if (!response.ok) {
-        throw new Error('Failed to update sync status');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error updating Figma sync status:', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Delete a Figma file
-   */
-  static async deleteFigmaFile(projectId, fileId) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/figma-files/${fileId}`, {
-        method: 'DELETE'
-      });
-      if (!response.ok) {
-        throw new Error('Failed to delete Figma file');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error deleting Figma file:', error);
-      throw error;
-    }
-  }
-
-  // ============================================
-  // UI DASHBOARD - Token Drift
-  // ============================================
-
-  /**
-   * List token drift issues for a project
-   */
-  static async listTokenDrift(projectId, severity = null) {
-    try {
-      const url = severity
-        ? `${API_BASE}/projects/${projectId}/token-drift?severity=${severity}`
-        : `${API_BASE}/projects/${projectId}/token-drift`;
-
-      const response = await fetch(url);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch token drift: ${response.statusText}`);
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error fetching token drift:', error);
-      return [];
-    }
-  }
-
-  /**
-   * Record a new token drift issue
-   */
-  static async recordTokenDrift(projectId, driftData) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/token-drift`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(driftData)
-      });
-      if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.detail || 'Failed to record token drift');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error recording token drift:', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Update token drift status (pending/fixed/ignored)
-   */
-  static async updateTokenDriftStatus(projectId, driftId, status) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/token-drift/${driftId}/status`, {
-        method: 'PUT',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ status })
-      });
-      if (!response.ok) {
-        throw new Error('Failed to update token drift status');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error updating token drift status:', error);
-      throw error;
-    }
-  }
-
-  // ============================================
-  // QA DASHBOARD - ESRE Definitions
-  // ============================================
-
-  /**
-   * List all ESRE definitions for a project
-   */
-  static async listESREDefinitions(projectId) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/esre`);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch ESRE definitions: ${response.statusText}`);
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error fetching ESRE definitions:', error);
-      return [];
-    }
-  }
-
-  /**
-   * Create a new ESRE definition
-   */
-  static async createESREDefinition(projectId, esreData) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/esre`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(esreData)
-      });
-      if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.detail || 'Failed to create ESRE definition');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error creating ESRE definition:', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Update an ESRE definition
-   */
-  static async updateESREDefinition(projectId, esreId, updateData) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/esre/${esreId}`, {
-        method: 'PUT',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(updateData)
-      });
-      if (!response.ok) {
-        throw new Error('Failed to update ESRE definition');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error updating ESRE definition:', error);
-      throw error;
-    }
-  }
-
-  /**
-   * Delete an ESRE definition
-   */
-  static async deleteESREDefinition(projectId, esreId) {
-    try {
-      const response = await fetch(`${API_BASE}/projects/${projectId}/esre/${esreId}`, {
-        method: 'DELETE'
-      });
-      if (!response.ok) {
-        throw new Error('Failed to delete ESRE definition');
-      }
-      return await response.json();
-    } catch (error) {
-      console.error('Error deleting ESRE definition:', error);
-      throw error;
-    }
-  }
-}
-
-export default DashboardService;
diff --git a/admin-ui/js/services/discovery-service.js b/admin-ui/js/services/discovery-service.js
deleted file mode 100644
index ac9dd5d..0000000
--- a/admin-ui/js/services/discovery-service.js
+++ /dev/null
@@ -1,90 +0,0 @@
-/**
- * Design System Server (DSS) - Discovery Service
- *
- * Project analysis interface for the admin dashboard.
- * No mocks - requires backend connection.
- */
-
-class DiscoveryService {
-  constructor() {
-    this.apiBase = '/api/discovery';
-    this.connected = null;
-    this.cache = new Map();
-    this.cacheExpiry = 5 * 60 * 1000; // 5 minutes
-  }
-
-  async checkConnection() {
-    try {
-      const response = await fetch('/health', { method: 'GET' });
-      this.connected = response.ok;
-    } catch {
-      this.connected = false;
-    }
-    return this.connected;
-  }
-
-  _requireConnection() {
-    if (this.connected === false) {
-      throw new Error('API unavailable. Start DSS server first.');
-    }
-  }
-
-  async discover(projectPath = '.', fullScan = false) {
-    const cacheKey = `${projectPath}:${fullScan}`;
-
-    // Check cache
-    if (this.cache.has(cacheKey)) {
-      const cached = this.cache.get(cacheKey);
-      if (Date.now() - cached.timestamp < this.cacheExpiry) {
-        return cached.data;
-      }
-    }
-
-    const response = await fetch(`${this.apiBase}/scan`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ path: projectPath, full_scan: fullScan })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Discovery scan failed');
-    }
-
-    const result = await response.json();
-    this.cache.set(cacheKey, { data: result, timestamp: Date.now() });
-    return result;
-  }
-
-  async getHealth() {
-    const response = await fetch('/health');
-    if (!response.ok) {
-      throw new Error('Health check failed');
-    }
-    return response.json();
-  }
-
-  async getRecentActivity() {
-    const response = await fetch(`${this.apiBase}/activity`);
-    if (!response.ok) {
-      return { items: [] };
-    }
-    return response.json();
-  }
-
-  async getProjectStats() {
-    const response = await fetch(`${this.apiBase}/stats`);
-    if (!response.ok) {
-      return { projects: {}, tokens: {}, components: {}, syncs: {} };
-    }
-    return response.json();
-  }
-
-  invalidateCache() {
-    this.cache.clear();
-  }
-}
-
-const discoveryService = new DiscoveryService();
-export { DiscoveryService };
-export default discoveryService;
diff --git a/admin-ui/js/services/figma-service.js b/admin-ui/js/services/figma-service.js
deleted file mode 100644
index 7f5a2e5..0000000
--- a/admin-ui/js/services/figma-service.js
+++ /dev/null
@@ -1,229 +0,0 @@
-/**
- * Design System Server (DSS) - Figma Service
- *
- * Client-side interface to Figma API tools.
- * No mocks - requires backend connection.
- */
-import notificationService from './notification-service.js';
-
-class FigmaService {
-  constructor() {
-    this.apiBase = '/api/figma';
-    this.connected = null; // null = unknown, true/false = checked
-    this.listeners = new Set();
-  }
-
-  // === Connection ===
-
-  async checkConnection() {
-    try {
-      const response = await fetch('/health', { method: 'GET' });
-      this.connected = response.ok;
-    } catch {
-      this.connected = false;
-    }
-    return this.connected;
-  }
-
-  _requireConnection() {
-    if (this.connected === false) {
-      throw new Error('API unavailable. Start DSS server first.');
-    }
-  }
-
-  // === Event System ===
-
-  on(event, callback) {
-    this.listeners.add({ event, callback });
-    return () => this.listeners.delete({ event, callback });
-  }
-
-  emit(event, data) {
-    this.listeners.forEach(l => {
-      if (l.event === event) l.callback(data);
-    });
-  }
-
-  // === API Methods ===
-
-  async extractVariables(fileKey, format = 'css') {
-    this._requireConnection();
-    this.emit('loading', { operation: 'extractVariables' });
-
-    try {
-      const response = await fetch(`${this.apiBase}/extract-variables`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ file_key: fileKey, format })
-      });
-
-      if (!response.ok) {
-        const err = await response.json().catch(() => ({}));
-        throw new Error(err.detail || 'Failed to extract variables');
-      }
-
-      const result = await response.json();
-      this.emit('complete', { operation: 'extractVariables', result });
-
-      notificationService.create({
-        title: 'Variables Extracted',
-        message: `Successfully extracted ${result.variable_count || 'variables'} from Figma.`,
-        type: 'success',
-        source: 'Figma',
-        actions: [
-          { label: 'View Tokens', event: 'navigate', payload: { page: 'tokens' } }
-        ]
-      });
-
-      return result;
-    } catch (error) {
-      notificationService.create({
-        title: 'Extraction Failed',
-        message: error.message,
-        type: 'error',
-        source: 'Figma'
-      });
-      throw error;
-    }
-  }
-
-  async extractComponents(fileKey) {
-    this._requireConnection();
-    this.emit('loading', { operation: 'extractComponents' });
-
-    const response = await fetch(`${this.apiBase}/extract-components`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ file_key: fileKey })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Failed to extract components');
-    }
-
-    const result = await response.json();
-    this.emit('complete', { operation: 'extractComponents', result });
-    return result;
-  }
-
-  async extractStyles(fileKey) {
-    this._requireConnection();
-    this.emit('loading', { operation: 'extractStyles' });
-
-    const response = await fetch(`${this.apiBase}/extract-styles`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ file_key: fileKey })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Failed to extract styles');
-    }
-
-    return response.json();
-  }
-
-  async syncTokens(fileKey, targetPath, format = 'css') {
-    this._requireConnection();
-    this.emit('loading', { operation: 'syncTokens' });
-
-    try {
-      const response = await fetch(`${this.apiBase}/sync-tokens`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ file_key: fileKey, target_path: targetPath, format })
-      });
-
-      if (!response.ok) {
-        const err = await response.json().catch(() => ({}));
-        throw new Error(err.detail || 'Sync failed');
-      }
-
-      const result = await response.json();
-      this.emit('complete', { operation: 'syncTokens', result });
-
-      notificationService.create({
-        title: 'Tokens Synced',
-        message: `Tokens successfully written to ${result.path || targetPath}.`,
-        type: 'success',
-        source: 'Figma',
-        actions: [
-          { label: 'View Tokens', event: 'navigate', payload: { page: 'tokens' } }
-        ]
-      });
-
-      return result;
-    } catch (error) {
-      notificationService.create({
-        title: 'Token Sync Failed',
-        message: error.message,
-        type: 'error',
-        source: 'Figma',
-        actions: [
-          { label: 'Retry', event: 'figma:sync', payload: { fileKey } }
-        ]
-      });
-      throw error;
-    }
-  }
-
-  async visualDiff(fileKey, baselineVersion = 'latest') {
-    this._requireConnection();
-    this.emit('loading', { operation: 'visualDiff' });
-
-    const response = await fetch(`${this.apiBase}/visual-diff`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ file_key: fileKey, baseline_version: baselineVersion })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Visual diff failed');
-    }
-
-    return response.json();
-  }
-
-  async validateComponents(fileKey) {
-    this._requireConnection();
-    this.emit('loading', { operation: 'validateComponents' });
-
-    const response = await fetch(`${this.apiBase}/validate-components`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ file_key: fileKey })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Validation failed');
-    }
-
-    return response.json();
-  }
-
-  async generateCode(fileKey, componentName, framework = 'webcomponent') {
-    this._requireConnection();
-    this.emit('loading', { operation: 'generateCode' });
-
-    const response = await fetch(`${this.apiBase}/generate-code`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ file_key: fileKey, component_name: componentName, framework })
-    });
-
-    if (!response.ok) {
-      const err = await response.json().catch(() => ({}));
-      throw new Error(err.detail || 'Code generation failed');
-    }
-
-    return response.json();
-  }
-}
-
-const figmaService = new FigmaService();
-export { FigmaService };
-export default figmaService;
diff --git a/admin-ui/js/services/notification-service.js b/admin-ui/js/services/notification-service.js
deleted file mode 100644
index 923a228..0000000
--- a/admin-ui/js/services/notification-service.js
+++ /dev/null
@@ -1,298 +0,0 @@
-/**
- * @fileoverview Manages application-wide notifications.
- * Handles persistence via IndexedDB, real-time updates via SSE, and state management.
- */
-
-import dssDB from '../db/indexed-db.js';
-
-const NOTIFICATION_STORE = 'notifications';
-
-class NotificationService extends EventTarget {
-  constructor() {
-    super();
-    this.notifications = [];
-    this.unreadCount = 0;
-    this._eventSource = null;
-    this._initialized = false;
-    this._broadcastChannel = null;
-  }
-
-  async init() {
-    if (this._initialized) return;
-    this._initialized = true;
-
-    await this._loadFromStorage();
-    this._connectToEvents();
-    this._setupCrossTabSync();
-  }
-
-  /**
-   * Setup cross-tab synchronization via BroadcastChannel API
-   * When notifications are modified in another tab, reload them
-   */
-  _setupCrossTabSync() {
-    try {
-      this._broadcastChannel = new BroadcastChannel('dss-notifications');
-
-      this._broadcastChannel.onmessage = (event) => {
-        if (event.data?.type === 'notifications-updated') {
-          console.log('[NotificationService] Notifications updated in another tab, reloading...');
-          this._loadFromStorage();
-        }
-      };
-    } catch (error) {
-      console.warn('[NotificationService] BroadcastChannel not available:', error);
-    }
-  }
-
-  /**
-   * Notify other tabs about notification changes
-   * @private
-   */
-  _notifyOtherTabs() {
-    if (this._broadcastChannel) {
-      try {
-        this._broadcastChannel.postMessage({ type: 'notifications-updated' });
-      } catch (error) {
-        console.warn('[NotificationService] Failed to broadcast update:', error);
-      }
-    }
-  }
-
-  async _loadFromStorage() {
-    try {
-      this.notifications = await dssDB.getAll(NOTIFICATION_STORE) || [];
-      this._sortNotifications();
-      this._updateUnreadCount();
-      this.dispatchEvent(new CustomEvent('notifications-updated', {
-        detail: { notifications: this.notifications }
-      }));
-    } catch (error) {
-      console.error('Failed to load notifications from storage:', error);
-      this.notifications = [];
-    }
-  }
-
-  _connectToEvents() {
-    // Only connect if SSE endpoint exists and we have an auth token
-    try {
-      // Get access token from localStorage
-      const authTokens = localStorage.getItem('auth_tokens');
-      if (!authTokens) {
-        console.log('[NotificationService] No auth token available, skipping SSE connection');
-        return;
-      }
-
-      const { accessToken } = JSON.parse(authTokens);
-      if (!accessToken) {
-        console.log('[NotificationService] No access token found, skipping SSE connection');
-        return;
-      }
-
-      // Construct SSE URL with token parameter (EventSource can't send custom headers)
-      const sseUrl = `/api/notifications/events?token=${encodeURIComponent(accessToken)}`;
-      console.log('[NotificationService] Connecting to SSE with authentication...');
-
-      this._eventSource = new EventSource(sseUrl);
-
-      this._eventSource.onmessage = (event) => {
-        try {
-          const notificationData = JSON.parse(event.data);
-          console.log('[NotificationService] SSE notification received:', notificationData.type);
-          // From SSE, persist to local storage
-          this.create(notificationData, true);
-        } catch (error) {
-          console.error('[NotificationService] Error parsing SSE notification:', error);
-        }
-      };
-
-      this._eventSource.onerror = (err) => {
-        console.warn('[NotificationService] SSE connection error, using local-only mode');
-        this._eventSource.close();
-        this._eventSource = null;
-      };
-
-      this._eventSource.onopen = () => {
-        console.log('[NotificationService] ✅ SSE connection established successfully');
-      };
-    } catch (error) {
-      console.warn('[NotificationService] SSE setup error:', error);
-    }
-  }
-
-  _sortNotifications() {
-    this.notifications.sort((a, b) => b.timestamp - a.timestamp);
-  }
-
-  _updateUnreadCount() {
-    const newCount = this.notifications.filter(n => !n.read).length;
-    if (newCount !== this.unreadCount) {
-      this.unreadCount = newCount;
-      this.dispatchEvent(new CustomEvent('unread-count-changed', {
-        detail: { count: this.unreadCount }
-      }));
-    }
-  }
-
-  _dispatchUpdate() {
-    this._sortNotifications();
-    this._updateUnreadCount();
-    this.dispatchEvent(new CustomEvent('notifications-updated', {
-      detail: { notifications: this.notifications }
-    }));
-  }
-
-  /**
-   * Creates a new notification.
-   * @param {object} notificationData - The notification data.
-   * @param {string} notificationData.title - Notification title
-   * @param {string} [notificationData.message] - Notification message
-   * @param {string} [notificationData.type='info'] - 'info', 'success', 'warning', 'error'
-   * @param {string} [notificationData.source] - Source service name
-   * @param {Array} [notificationData.actions] - Action buttons
-   * @param {boolean} [persist=true] - Whether to save to IndexedDB.
-   * @returns {Promise<object>} The created notification.
-   */
-  async create(notificationData, persist = true) {
-    const newNotification = {
-      id: crypto.randomUUID(),
-      timestamp: Date.now(),
-      read: false,
-      type: 'info',
-      ...notificationData,
-    };
-
-    this.notifications.unshift(newNotification);
-
-    if (persist) {
-      try {
-        await dssDB.put(NOTIFICATION_STORE, newNotification);
-      } catch (error) {
-        console.error('Failed to persist notification:', error);
-      }
-    }
-
-    this._dispatchUpdate();
-    this._notifyOtherTabs();
-
-    // Also show as toast for immediate visibility
-    if (typeof window.showToast === 'function') {
-      window.showToast({
-        message: `<strong>${newNotification.title}</strong>${newNotification.message ? `<br>${newNotification.message}` : ''}`,
-        type: newNotification.type,
-        duration: 5000,
-        dismissible: true
-      });
-    }
-
-    return newNotification;
-  }
-
-  /**
-   * Retrieves all notifications.
-   * @returns {object[]}
-   */
-  getAll() {
-    return [...this.notifications];
-  }
-
-  /**
-   * Get unread count
-   * @returns {number}
-   */
-  getUnreadCount() {
-    return this.unreadCount;
-  }
-
-  /**
-   * Marks a specific notification as read.
-   * @param {string} id - The ID of the notification to update.
-   * @returns {Promise<void>}
-   */
-  async markAsRead(id) {
-    const notification = this.notifications.find(n => n.id === id);
-    if (notification && !notification.read) {
-      notification.read = true;
-      try {
-        await dssDB.put(NOTIFICATION_STORE, notification);
-      } catch (error) {
-        console.error('Failed to update notification:', error);
-      }
-      this._dispatchUpdate();
-      this._notifyOtherTabs();
-    }
-  }
-
-  /**
-   * Marks all unread notifications as read.
-   * @returns {Promise<void>}
-   */
-  async markAllAsRead() {
-    const updates = [];
-    this.notifications.forEach(n => {
-      if (!n.read) {
-        n.read = true;
-        updates.push(dssDB.put(NOTIFICATION_STORE, n));
-      }
-    });
-
-    if (updates.length > 0) {
-      try {
-        await Promise.all(updates);
-      } catch (error) {
-        console.error('Failed to mark all as read:', error);
-      }
-      this._dispatchUpdate();
-      this._notifyOtherTabs();
-    }
-  }
-
-  /**
-   * Deletes a notification by its ID.
-   * @param {string} id
-   * @returns {Promise<void>}
-   */
-  async delete(id) {
-    this.notifications = this.notifications.filter(n => n.id !== id);
-    try {
-      await dssDB.delete(NOTIFICATION_STORE, id);
-    } catch (error) {
-      console.error('Failed to delete notification:', error);
-    }
-    this._dispatchUpdate();
-    this._notifyOtherTabs();
-  }
-
-  /**
-   * Clears all notifications.
-   * @returns {Promise<void>}
-   */
-  async clearAll() {
-    this.notifications = [];
-    try {
-      await dssDB.clear(NOTIFICATION_STORE);
-    } catch (error) {
-      console.error('Failed to clear notifications:', error);
-    }
-    this._dispatchUpdate();
-    this._notifyOtherTabs();
-  }
-
-  /**
-   * Cleanup on app shutdown
-   */
-  destroy() {
-    if (this._eventSource) {
-      this._eventSource.close();
-      this._eventSource = null;
-    }
-    if (this._broadcastChannel) {
-      this._broadcastChannel.close();
-      this._broadcastChannel = null;
-    }
-  }
-}
-
-// Export a singleton instance
-const notificationService = new NotificationService();
-export default notificationService;
diff --git a/admin-ui/js/services/plugin-service.js b/admin-ui/js/services/plugin-service.js
deleted file mode 100644
index bf59f3f..0000000
--- a/admin-ui/js/services/plugin-service.js
+++ /dev/null
@@ -1,335 +0,0 @@
-/**
- * Plugin Service - Manages frontend plugins for DSS Admin UI
- *
- * Supports loading, enabling/disabling, and configuring plugins.
- * Plugins can extend UI, add commands, and integrate with services.
- */
-
-import logger from '../core/logger.js';
-
-class PluginService {
-  constructor() {
-    this.plugins = new Map();
-    this.hooks = new Map();
-    this.loadedPlugins = [];
-    this.storageKey = 'dss_plugins_config';
-
-    // Load saved plugin states
-    this.config = this._loadConfig();
-  }
-
-  /**
-   * Load plugin configuration from localStorage
-   */
-  _loadConfig() {
-    try {
-      const saved = localStorage.getItem(this.storageKey);
-      return saved ? JSON.parse(saved) : { enabled: {}, settings: {} };
-    } catch (e) {
-      logger.warn('PluginService', 'Failed to load plugin config', e);
-      return { enabled: {}, settings: {} };
-    }
-  }
-
-  /**
-   * Save plugin configuration to localStorage
-   */
-  _saveConfig() {
-    try {
-      localStorage.setItem(this.storageKey, JSON.stringify(this.config));
-    } catch (e) {
-      logger.warn('PluginService', 'Failed to save plugin config', e);
-    }
-  }
-
-  /**
-   * Register a plugin
-   * @param {Object} plugin - Plugin definition
-   */
-  register(plugin) {
-    if (!plugin.id || !plugin.name) {
-      throw new Error('Plugin must have id and name');
-    }
-
-    if (this.plugins.has(plugin.id)) {
-      logger.warn('PluginService', `Plugin ${plugin.id} already registered`);
-      return;
-    }
-
-    const pluginDef = {
-      id: plugin.id,
-      name: plugin.name,
-      version: plugin.version || '1.0.0',
-      description: plugin.description || '',
-      author: plugin.author || 'Unknown',
-      icon: plugin.icon || '🔌',
-      category: plugin.category || 'general',
-
-      // Lifecycle hooks
-      onInit: plugin.onInit || (() => {}),
-      onEnable: plugin.onEnable || (() => {}),
-      onDisable: plugin.onDisable || (() => {}),
-      onDestroy: plugin.onDestroy || (() => {}),
-
-      // Extension points
-      commands: plugin.commands || [],
-      panels: plugin.panels || [],
-      settings: plugin.settings || [],
-
-      // State
-      enabled: this.config.enabled[plugin.id] ?? plugin.enabledByDefault ?? false,
-      initialized: false
-    };
-
-    this.plugins.set(plugin.id, pluginDef);
-    logger.info('PluginService', `Registered plugin: ${plugin.name} v${pluginDef.version}`);
-
-    // Auto-init if enabled
-    if (pluginDef.enabled) {
-      this._initPlugin(pluginDef);
-    }
-
-    return pluginDef;
-  }
-
-  /**
-   * Initialize a plugin
-   */
-  async _initPlugin(plugin) {
-    if (plugin.initialized) return;
-
-    try {
-      await plugin.onInit(this._createPluginContext(plugin));
-      plugin.initialized = true;
-      this.loadedPlugins.push(plugin.id);
-      logger.info('PluginService', `Initialized plugin: ${plugin.name}`);
-    } catch (e) {
-      logger.error('PluginService', `Failed to init plugin ${plugin.name}`, e);
-    }
-  }
-
-  /**
-   * Create context object passed to plugin hooks
-   */
-  _createPluginContext(plugin) {
-    return {
-      pluginId: plugin.id,
-      settings: this.config.settings[plugin.id] || {},
-
-      // API for plugins
-      registerHook: (hookName, callback) => this.registerHook(plugin.id, hookName, callback),
-      unregisterHook: (hookName) => this.unregisterHook(plugin.id, hookName),
-      getSettings: () => this.config.settings[plugin.id] || {},
-      setSetting: (key, value) => this.setPluginSetting(plugin.id, key, value),
-
-      // Access to app APIs
-      emit: (event, data) => this._emitEvent(plugin.id, event, data),
-      log: (msg, data) => logger.info(`Plugin:${plugin.name}`, msg, data)
-    };
-  }
-
-  /**
-   * Enable a plugin
-   */
-  async enable(pluginId) {
-    const plugin = this.plugins.get(pluginId);
-    if (!plugin) {
-      throw new Error(`Plugin ${pluginId} not found`);
-    }
-
-    if (plugin.enabled) return;
-
-    plugin.enabled = true;
-    this.config.enabled[pluginId] = true;
-    this._saveConfig();
-
-    if (!plugin.initialized) {
-      await this._initPlugin(plugin);
-    }
-
-    try {
-      await plugin.onEnable(this._createPluginContext(plugin));
-      logger.info('PluginService', `Enabled plugin: ${plugin.name}`);
-      this._emitEvent('system', 'plugin:enabled', { pluginId });
-    } catch (e) {
-      logger.error('PluginService', `Failed to enable plugin ${plugin.name}`, e);
-      plugin.enabled = false;
-      this.config.enabled[pluginId] = false;
-      this._saveConfig();
-      throw e;
-    }
-  }
-
-  /**
-   * Disable a plugin
-   */
-  async disable(pluginId) {
-    const plugin = this.plugins.get(pluginId);
-    if (!plugin) {
-      throw new Error(`Plugin ${pluginId} not found`);
-    }
-
-    if (!plugin.enabled) return;
-
-    try {
-      await plugin.onDisable(this._createPluginContext(plugin));
-      plugin.enabled = false;
-      this.config.enabled[pluginId] = false;
-      this._saveConfig();
-      logger.info('PluginService', `Disabled plugin: ${plugin.name}`);
-      this._emitEvent('system', 'plugin:disabled', { pluginId });
-    } catch (e) {
-      logger.error('PluginService', `Failed to disable plugin ${plugin.name}`, e);
-      throw e;
-    }
-  }
-
-  /**
-   * Toggle plugin enabled state
-   */
-  async toggle(pluginId) {
-    const plugin = this.plugins.get(pluginId);
-    if (!plugin) {
-      throw new Error(`Plugin ${pluginId} not found`);
-    }
-
-    if (plugin.enabled) {
-      await this.disable(pluginId);
-    } else {
-      await this.enable(pluginId);
-    }
-  }
-
-  /**
-   * Register a hook callback
-   */
-  registerHook(pluginId, hookName, callback) {
-    const key = `${pluginId}:${hookName}`;
-    if (!this.hooks.has(hookName)) {
-      this.hooks.set(hookName, new Map());
-    }
-    this.hooks.get(hookName).set(pluginId, callback);
-    logger.debug('PluginService', `Registered hook ${hookName} for ${pluginId}`);
-  }
-
-  /**
-   * Unregister a hook callback
-   */
-  unregisterHook(pluginId, hookName) {
-    const hookMap = this.hooks.get(hookName);
-    if (hookMap) {
-      hookMap.delete(pluginId);
-    }
-  }
-
-  /**
-   * Execute all callbacks for a hook
-   */
-  async executeHook(hookName, data = {}) {
-    const hookMap = this.hooks.get(hookName);
-    if (!hookMap) return [];
-
-    const results = [];
-    for (const [pluginId, callback] of hookMap) {
-      const plugin = this.plugins.get(pluginId);
-      if (plugin?.enabled) {
-        try {
-          const result = await callback(data);
-          results.push({ pluginId, result });
-        } catch (e) {
-          logger.error('PluginService', `Hook ${hookName} failed for ${pluginId}`, e);
-        }
-      }
-    }
-    return results;
-  }
-
-  /**
-   * Set a plugin setting
-   */
-  setPluginSetting(pluginId, key, value) {
-    if (!this.config.settings[pluginId]) {
-      this.config.settings[pluginId] = {};
-    }
-    this.config.settings[pluginId][key] = value;
-    this._saveConfig();
-    this._emitEvent(pluginId, 'settings:changed', { key, value });
-  }
-
-  /**
-   * Get plugin settings
-   */
-  getPluginSettings(pluginId) {
-    return this.config.settings[pluginId] || {};
-  }
-
-  /**
-   * Emit event to listeners
-   */
-  _emitEvent(source, event, data) {
-    window.dispatchEvent(new CustomEvent('dss:plugin:event', {
-      detail: { source, event, data }
-    }));
-  }
-
-  /**
-   * Get all registered plugins
-   */
-  getAll() {
-    return Array.from(this.plugins.values());
-  }
-
-  /**
-   * Get enabled plugins
-   */
-  getEnabled() {
-    return this.getAll().filter(p => p.enabled);
-  }
-
-  /**
-   * Get plugin by ID
-   */
-  get(pluginId) {
-    return this.plugins.get(pluginId);
-  }
-
-  /**
-   * Get all commands from enabled plugins
-   */
-  getAllCommands() {
-    const commands = [];
-    for (const plugin of this.getEnabled()) {
-      for (const cmd of plugin.commands) {
-        commands.push({
-          ...cmd,
-          pluginId: plugin.id,
-          pluginName: plugin.name
-        });
-      }
-    }
-    return commands;
-  }
-
-  /**
-   * Get all panels from enabled plugins
-   */
-  getAllPanels() {
-    const panels = [];
-    for (const plugin of this.getEnabled()) {
-      for (const panel of plugin.panels) {
-        panels.push({
-          ...panel,
-          pluginId: plugin.id,
-          pluginName: plugin.name
-        });
-      }
-    }
-    return panels;
-  }
-}
-
-// Singleton instance
-const pluginService = new PluginService();
-
-export default pluginService;
-export { PluginService };
diff --git a/admin-ui/js/services/team-service.js b/admin-ui/js/services/team-service.js
deleted file mode 100644
index ff0c619..0000000
--- a/admin-ui/js/services/team-service.js
+++ /dev/null
@@ -1,241 +0,0 @@
-/**
- * Design System Server (DSS) - Team Service
- *
- * Multi-team management with RBAC handling team operations,
- * role management, and permissions.
- */
-
-// Role definitions with permissions
-const ROLES = {
-  SUPER_ADMIN: {
-    name: 'Super Admin',
-    description: 'Full system access',
-    permissions: ['*'],
-    level: 100
-  },
-  TEAM_LEAD: {
-    name: 'Team Lead',
-    description: 'Full team access, can manage members',
-    permissions: [
-      'read', 'write', 'delete',
-      'sync_tokens', 'sync_components',
-      'manage_team_members', 'invite_users',
-      'configure_figma', 'run_visual_diff',
-      'generate_code', 'export_tokens'
-    ],
-    level: 80
-  },
-  DEVELOPER: {
-    name: 'Developer',
-    description: 'Read/write access, can sync and generate',
-    permissions: [
-      'read', 'write',
-      'sync_tokens', 'sync_components',
-      'generate_code', 'export_tokens',
-      'run_visual_diff'
-    ],
-    level: 50
-  },
-  VIEWER: {
-    name: 'Viewer',
-    description: 'Read-only access',
-    permissions: ['read', 'export_tokens'],
-    level: 10
-  }
-};
-
-class TeamService {
-  constructor() {
-    this.apiBase = '/api/teams';
-    this.useMock = false;
-    this.currentUser = null;
-    this.currentTeam = null;
-  }
-
-  // === Role Management ===
-
-  getRoles() {
-    return ROLES;
-  }
-
-  getRole(roleKey) {
-    return ROLES[roleKey];
-  }
-
-  hasPermission(userRole, permission) {
-    const role = ROLES[userRole];
-    if (!role) return false;
-    if (role.permissions.includes('*')) return true;
-    return role.permissions.includes(permission);
-  }
-
-  canManage(managerRole, targetRole) {
-    const manager = ROLES[managerRole];
-    const target = ROLES[targetRole];
-    if (!manager || !target) return false;
-    return manager.level > target.level;
-  }
-
-  // === Team Operations ===
-
-  async getTeams() {
-    if (this.useMock) {
-      await this._delay(300);
-      return this._getMockTeams();
-    }
-
-    const response = await fetch(`${this.apiBase}`);
-    return response.json();
-  }
-
-  async getTeam(teamId) {
-    if (this.useMock) {
-      await this._delay(200);
-      const teams = this._getMockTeams();
-      return teams.find(t => t.id === teamId);
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}`);
-    return response.json();
-  }
-
-  async createTeam(data) {
-    if (this.useMock) {
-      await this._delay(400);
-      return {
-        id: `team-${Date.now()}`,
-        ...data,
-        createdAt: new Date().toISOString(),
-        members: []
-      };
-    }
-
-    const response = await fetch(`${this.apiBase}`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(data)
-    });
-    return response.json();
-  }
-
-  async updateTeam(teamId, data) {
-    if (this.useMock) {
-      await this._delay(300);
-      return { id: teamId, ...data, updatedAt: new Date().toISOString() };
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}`, {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(data)
-    });
-    return response.json();
-  }
-
-  // === Member Management ===
-
-  async getTeamMembers(teamId) {
-    if (this.useMock) {
-      await this._delay(200);
-      return this._getMockMembers(teamId);
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/members`);
-    return response.json();
-  }
-
-  async addTeamMember(teamId, email, role) {
-    if (this.useMock) {
-      await this._delay(400);
-      return {
-        id: `member-${Date.now()}`,
-        email,
-        role,
-        teamId,
-        status: 'pending',
-        invitedAt: new Date().toISOString()
-      };
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/members`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ email, role })
-    });
-    return response.json();
-  }
-
-  async updateMemberRole(teamId, memberId, role) {
-    if (this.useMock) {
-      await this._delay(300);
-      return { id: memberId, role, updatedAt: new Date().toISOString() };
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/members/${memberId}`, {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ role })
-    });
-    return response.json();
-  }
-
-  async removeMember(teamId, memberId) {
-    if (this.useMock) {
-      await this._delay(300);
-      return { success: true };
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/members/${memberId}`, {
-      method: 'DELETE'
-    });
-    return response.json();
-  }
-
-  // === Team Settings ===
-
-  async getTeamSettings(teamId) {
-    if (this.useMock) {
-      await this._delay(200);
-      return this._getMockTeamSettings(teamId);
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/settings`);
-    return response.json();
-  }
-
-  async updateTeamSettings(teamId, settings) {
-    if (this.useMock) {
-      await this._delay(300);
-      return { ...settings, updatedAt: new Date().toISOString() };
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/settings`, {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(settings)
-    });
-    return response.json();
-  }
-
-  // === Dashboard Data ===
-
-  async getTeamDashboard(teamId) {
-    if (this.useMock) {
-      await this._delay(400);
-      return this._getMockDashboard(teamId);
-    }
-
-    const response = await fetch(`${this.apiBase}/${teamId}/dashboard`);
-    return response.json();
-  }
-
-  async getAdminDashboard() {
-    if (this.useMock) {
-      await this._delay(500);
-      return this._getMockAdminDashboard();
-    }
-
-    const response = await fetch(`${this.apiBase}/admin/dashboard`);
-    return response.json();
-  }
-}
diff --git a/admin-ui/js/services/tool-bridge.js b/admin-ui/js/services/tool-bridge.js
deleted file mode 100644
index 3612762..0000000
--- a/admin-ui/js/services/tool-bridge.js
+++ /dev/null
@@ -1,311 +0,0 @@
-/**
- * tool-bridge.js
- * Service to execute MCP tools from the UI
- * MVP1: Auto-injects context from ContextStore, removes hardcoded defaults
- */
-
-import contextStore from '../stores/context-store.js';
-
-class ToolBridge {
-  constructor() {
-    this.apiBase = '/api';
-    this.toolCache = new Map();
-    this.context = null; // Deprecated - use contextStore instead
-  }
-
-  /**
-   * MVP1: Get execution context from ContextStore
-   * NO DEFAULTS - throws if project not selected
-   * @returns {object} Context with projectId, teamId, userId
-   */
-  getContext() {
-    const mcpContext = contextStore.getMCPContext();
-
-    // Validate required context
-    if (!mcpContext.project_id) {
-      throw new Error('No project selected. Please select a project from the header.');
-    }
-
-    return {
-      projectId: mcpContext.project_id,
-      teamId: mcpContext.team_id,
-      userId: mcpContext.user_id,
-      capabilities: mcpContext.capabilities
-    };
-  }
-
-  /**
-   * Set execution context (DEPRECATED - use contextStore.setProject/setTeam instead)
-   * @param {string} projectId - Project ID
-   * @param {string} userId - User ID
-   */
-  setContext(projectId, userId) {
-    console.warn('[ToolBridge] setContext is deprecated. Use contextStore.setProject() instead');
-    contextStore.setProject(projectId);
-    this.context = { projectId, userId };
-  }
-
-  /**
-   * MVP1: Execute an MCP tool with auto-context injection
-   * Implements interceptor pattern with standardized error handling
-   * @param {string} toolName - MCP tool name (e.g., 'dss_extract_tokens')
-   * @param {object} params - Tool parameters
-   * @returns {Promise<any>} Tool execution result
-   */
-  async executeTool(toolName, params = {}) {
-    console.log(`[ToolBridge] Executing tool: ${toolName}`, params);
-
-    try {
-      // Auto-inject context from ContextStore
-      const context = this.getContext();
-
-      // Wrap parameters with auto-injected context
-      const payload = {
-        project_id: context.projectId,
-        team_id: context.teamId,
-        user_id: context.userId,
-        arguments: params,
-        _client_timestamp: Date.now() // For debugging
-      };
-
-      const response = await fetch(`${this.apiBase}/mcp/tools/${toolName}/execute`, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json'
-        },
-        body: JSON.stringify(payload)
-      });
-
-      // Standardized error handling
-      if (!response.ok) {
-        // Handle specific HTTP status codes
-        if (response.status === 502) {
-          throw new Error('MCP Server Offline - Please check backend connection');
-        }
-        if (response.status === 404) {
-          throw new Error(`Tool not found: ${toolName}`);
-        }
-
-        const errorText = await response.text();
-        let errorMessage;
-
-        try {
-          const errorJson = JSON.parse(errorText);
-          errorMessage = errorJson.message || errorJson.detail || `Tool execution failed: ${response.statusText}`;
-        } catch (e) {
-          errorMessage = `Tool execution failed: ${response.status} - ${errorText}`;
-        }
-
-        throw new Error(errorMessage);
-      }
-
-      const result = await response.json();
-      console.log(`[ToolBridge] Tool ${toolName} completed:`, result);
-
-      return result;
-    } catch (error) {
-      console.error(`[ToolBridge] Tool ${toolName} failed:`, error);
-
-      // Re-throw with enhanced error message if it's a context error
-      if (error.message.includes('No project selected')) {
-        throw new Error(`${error.message}\n\nTool: ${toolName}`);
-      }
-
-      throw error;
-    }
-  }
-
-  /**
-   * Get list of available MCP tools
-   * @returns {Promise<Array>} Array of tool definitions
-   */
-  async getAvailableTools() {
-    if (this.toolCache.has('all')) {
-      return this.toolCache.get('all');
-    }
-
-    try {
-      const response = await fetch(`${this.apiBase}/mcp/tools`);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch tools: ${response.statusText}`);
-      }
-
-      const tools = await response.json();
-      this.toolCache.set('all', tools);
-      return tools;
-    } catch (error) {
-      console.error('[ToolBridge] Failed to fetch available tools:', error);
-      return [];
-    }
-  }
-
-  /**
-   * Get tool definition by name
-   * @param {string} toolName - MCP tool name
-   * @returns {Promise<object|null>} Tool definition
-   */
-  async getToolDefinition(toolName) {
-    const tools = await this.getAvailableTools();
-    return tools.find(tool => tool.name === toolName) || null;
-  }
-
-  /**
-   * Execute dss_extract_tokens tool
-   */
-  async extractTokens(path, sources = ['css', 'scss', 'tailwind', 'json']) {
-    return this.executeTool('dss_extract_tokens', { path, sources });
-  }
-
-  /**
-   * Execute dss_generate_theme tool
-   */
-  async generateTheme(format, tokens = null, themeName = 'default') {
-    return this.executeTool('dss_generate_theme', {
-      format,
-      tokens,
-      theme_name: themeName
-    });
-  }
-
-  /**
-   * Execute dss_sync_figma tool
-   */
-  async syncFigma(fileKey) {
-    return this.executeTool('dss_sync_figma', { file_key: fileKey });
-  }
-
-  /**
-   * Execute dss_resolve_token tool
-   */
-  async resolveToken(manifestPath, tokenPath, forceRefresh = false) {
-    return this.executeTool('dss_resolve_token', {
-      manifest_path: manifestPath,
-      token_path: tokenPath,
-      force_refresh: forceRefresh
-    });
-  }
-
-  /**
-   * Execute dss_get_resolved_context tool
-   */
-  async getResolvedContext(manifestPath, debug = false, forceRefresh = false) {
-    return this.executeTool('dss_get_resolved_context', {
-      manifest_path: manifestPath,
-      debug,
-      force_refresh: forceRefresh
-    });
-  }
-
-  /**
-   * Execute browser_get_logs tool
-   */
-  async getBrowserLogs(level = 'all', limit = 100) {
-    return this.executeTool('browser_get_logs', { level, limit });
-  }
-
-  /**
-   * Execute browser_get_errors tool
-   */
-  async getBrowserErrors(limit = 50) {
-    return this.executeTool('browser_get_errors', { limit });
-  }
-
-  /**
-   * Execute browser_accessibility_audit tool
-   */
-  async runAccessibilityAudit(selector = null) {
-    return this.executeTool('browser_accessibility_audit', { selector });
-  }
-
-  /**
-   * Execute browser_performance tool
-   */
-  async getPerformanceMetrics() {
-    return this.executeTool('browser_performance');
-  }
-
-  /**
-   * Execute devtools_screenshot tool
-   */
-  async takeScreenshot(fullPage = false, selector = null) {
-    return this.executeTool('devtools_screenshot', { full_page: fullPage, selector });
-  }
-
-  /**
-   * Execute devtools_query_dom tool
-   */
-  async queryDOM(selector) {
-    return this.executeTool('devtools_query_dom', { selector });
-  }
-
-  /**
-   * Execute devtools_network_requests tool
-   */
-  async getNetworkRequests(filterUrl = null, limit = 50) {
-    return this.executeTool('devtools_network_requests', {
-      filter_url: filterUrl,
-      limit
-    });
-  }
-
-  /**
-   * Execute dss_audit_components tool
-   */
-  async auditComponents(path) {
-    return this.executeTool('dss_audit_components', { path });
-  }
-
-  /**
-   * Execute dss_find_quick_wins tool
-   */
-  async findQuickWins(path) {
-    return this.executeTool('dss_find_quick_wins', { path });
-  }
-
-  /**
-   * Execute dss_get_status tool
-   */
-  async getDSSStatus(format = 'json') {
-    return this.executeTool('dss_get_status', { format });
-  }
-
-  /**
-   * Execute dss_list_themes tool
-   */
-  async listThemes() {
-    return this.executeTool('dss_list_themes');
-  }
-
-  /**
-   * Execute browser_dom_snapshot tool
-   */
-  async getDOMSnapshot() {
-    return this.executeTool('browser_dom_snapshot');
-  }
-
-  /**
-   * Execute devtools_console_logs tool
-   */
-  async getConsoleLogs(level = 'all', limit = 100, clear = false) {
-    return this.executeTool('devtools_console_logs', { level, limit, clear });
-  }
-
-  /**
-   * Get token information from Context Compiler
-   */
-  async getTokens(manifestPath) {
-    return this.getResolvedContext(manifestPath, false, false);
-  }
-
-  /**
-   * Clear browser console logs
-   */
-  async clearConsoleLogs() {
-    return this.executeTool('devtools_console_logs', { clear: true, limit: 0 });
-  }
-}
-
-// Singleton instance
-const toolBridge = new ToolBridge();
-
-export default toolBridge;
diff --git a/admin-ui/js/services/tools-service.js b/admin-ui/js/services/tools-service.js
deleted file mode 100644
index 2797aeb..0000000
--- a/admin-ui/js/services/tools-service.js
+++ /dev/null
@@ -1,449 +0,0 @@
-/**
- * Tools Service - Manages MCP tools catalog and execution
- */
-
-import api from '../core/api.js';
-import logger from '../core/logger.js';
-
-class ToolsService {
-  constructor() {
-    this.tools = [];
-    this.toolsMetadata = this._getToolsMetadata();
-    this.executionHistory = [];
-    this.toolStatus = {};
-    this.teamToolMappings = this._getTeamToolMappings();
-  }
-
-  /**
-   * Define which tools are relevant for each team
-   */
-  _getTeamToolMappings() {
-    return {
-      'ui': [
-        'extract_tokens', 'extract_components', 'generate_component_code',
-        'sync_tokens_to_file', 'ingest_css_tokens', 'ingest_scss_tokens',
-        'ingest_tailwind_tokens', 'merge_tokens', 'export_tokens',
-        'scan_storybook', 'generate_story', 'generate_stories_batch',
-        'generate_storybook_theme'
-      ],
-      'ux': [
-        'analyze_style_values', 'check_naming_consistency', 'find_style_patterns',
-        'validate_tokens', 'extract_tokens', 'export_tokens',
-        'discover_project', 'get_sync_history'
-      ],
-      'qa': [
-        'get_quick_wins', 'get_quick_wins_report', 'validate_tokens',
-        'find_unused_styles', 'find_inline_styles', 'analyze_react_components',
-        'build_source_graph', 'get_story_coverage'
-      ],
-      'all': [] // Empty means all tools
-    };
-  }
-
-  /**
-   * Get metadata for all 32 MCP tools
-   */
-  _getToolsMetadata() {
-    return {
-      // Projects
-      list_projects: {
-        name: 'list_projects',
-        category: 'Projects',
-        description: 'List all design system projects',
-        parameters: [],
-        icon: '📁'
-      },
-      create_project: {
-        name: 'create_project',
-        category: 'Projects',
-        description: 'Create a new design system project',
-        parameters: ['name', 'description', 'figma_file_key'],
-        icon: '➕'
-      },
-      get_project: {
-        name: 'get_project',
-        category: 'Projects',
-        description: 'Get details of a specific project',
-        parameters: ['project_id'],
-        icon: '🔍'
-      },
-
-      // Figma
-      extract_tokens: {
-        name: 'extract_tokens',
-        category: 'Figma',
-        description: 'Extract design tokens from Figma file',
-        parameters: ['file_key', 'format'],
-        icon: '🎨',
-        requiresConfig: ['figma_token']
-      },
-      extract_components: {
-        name: 'extract_components',
-        category: 'Figma',
-        description: 'Extract components from Figma file',
-        parameters: ['file_key'],
-        icon: '🧩',
-        requiresConfig: ['figma_token']
-      },
-      generate_component_code: {
-        name: 'generate_component_code',
-        category: 'Figma',
-        description: 'Generate React code from Figma component',
-        parameters: ['file_key', 'node_id', 'framework'],
-        icon: '⚛️',
-        requiresConfig: ['figma_token']
-      },
-      sync_tokens_to_file: {
-        name: 'sync_tokens_to_file',
-        category: 'Figma',
-        description: 'Sync tokens to output file',
-        parameters: ['file_key', 'output_path', 'format'],
-        icon: '🔄',
-        requiresConfig: ['figma_token']
-      },
-
-      // Ingestion
-      ingest_css_tokens: {
-        name: 'ingest_css_tokens',
-        category: 'Ingestion',
-        description: 'Ingest tokens from CSS variables',
-        parameters: ['source'],
-        icon: '📥'
-      },
-      ingest_scss_tokens: {
-        name: 'ingest_scss_tokens',
-        category: 'Ingestion',
-        description: 'Ingest tokens from SCSS variables',
-        parameters: ['source'],
-        icon: '📥'
-      },
-      ingest_tailwind_tokens: {
-        name: 'ingest_tailwind_tokens',
-        category: 'Ingestion',
-        description: 'Ingest tokens from Tailwind config',
-        parameters: ['source'],
-        icon: '📥'
-      },
-      ingest_json_tokens: {
-        name: 'ingest_json_tokens',
-        category: 'Ingestion',
-        description: 'Ingest tokens from JSON format',
-        parameters: ['source'],
-        icon: '📥'
-      },
-      merge_tokens: {
-        name: 'merge_tokens',
-        category: 'Ingestion',
-        description: 'Merge tokens from multiple sources',
-        parameters: ['sources', 'strategy'],
-        icon: '🔗'
-      },
-      export_tokens: {
-        name: 'export_tokens',
-        category: 'Ingestion',
-        description: 'Export tokens to specified format',
-        parameters: ['format', 'output_path'],
-        icon: '📤'
-      },
-      validate_tokens: {
-        name: 'validate_tokens',
-        category: 'Ingestion',
-        description: 'Validate token structure and values',
-        parameters: ['source'],
-        icon: '✓'
-      },
-
-      // Analysis
-      discover_project: {
-        name: 'discover_project',
-        category: 'Analysis',
-        description: 'Discover project structure and frameworks',
-        parameters: ['path'],
-        icon: '🔎',
-        quickWin: true
-      },
-      analyze_react_components: {
-        name: 'analyze_react_components',
-        category: 'Analysis',
-        description: 'Analyze React components in project',
-        parameters: ['path'],
-        icon: '⚛️',
-        quickWin: true
-      },
-      find_inline_styles: {
-        name: 'find_inline_styles',
-        category: 'Analysis',
-        description: 'Find components with inline styles',
-        parameters: ['path'],
-        icon: '🎯',
-        quickWin: true
-      },
-      find_style_patterns: {
-        name: 'find_style_patterns',
-        category: 'Analysis',
-        description: 'Identify common style patterns',
-        parameters: ['path'],
-        icon: '📊',
-        quickWin: true
-      },
-      analyze_style_values: {
-        name: 'analyze_style_values',
-        category: 'Analysis',
-        description: 'Analyze style property values',
-        parameters: ['path', 'property'],
-        icon: '📈',
-        quickWin: true
-      },
-      find_unused_styles: {
-        name: 'find_unused_styles',
-        category: 'Analysis',
-        description: 'Find unused style definitions',
-        parameters: ['path'],
-        icon: '🗑️',
-        quickWin: true
-      },
-      build_source_graph: {
-        name: 'build_source_graph',
-        category: 'Analysis',
-        description: 'Build component dependency graph',
-        parameters: ['path', 'depth'],
-        icon: '🕸️'
-      },
-      get_quick_wins: {
-        name: 'get_quick_wins',
-        category: 'Analysis',
-        description: 'Get actionable improvement opportunities',
-        parameters: ['path'],
-        icon: '⚡',
-        quickWin: true,
-        featured: true
-      },
-      get_quick_wins_report: {
-        name: 'get_quick_wins_report',
-        category: 'Analysis',
-        description: 'Generate detailed quick wins report',
-        parameters: ['path'],
-        icon: '📋',
-        quickWin: true
-      },
-      check_naming_consistency: {
-        name: 'check_naming_consistency',
-        category: 'Analysis',
-        description: 'Check component naming consistency',
-        parameters: ['path'],
-        icon: '🏷️',
-        quickWin: true
-      },
-
-      // Storybook
-      scan_storybook: {
-        name: 'scan_storybook',
-        category: 'Storybook',
-        description: 'Scan existing Storybook configuration',
-        parameters: ['path'],
-        icon: '📚'
-      },
-      generate_story: {
-        name: 'generate_story',
-        category: 'Storybook',
-        description: 'Generate Storybook story for component',
-        parameters: ['component_path', 'template'],
-        icon: '📖'
-      },
-      generate_stories_batch: {
-        name: 'generate_stories_batch',
-        category: 'Storybook',
-        description: 'Generate stories for multiple components',
-        parameters: ['components', 'template'],
-        icon: '📚'
-      },
-      generate_storybook_theme: {
-        name: 'generate_storybook_theme',
-        category: 'Storybook',
-        description: 'Generate Storybook theme from tokens',
-        parameters: ['tokens', 'output_path'],
-        icon: '🎨'
-      },
-      get_story_coverage: {
-        name: 'get_story_coverage',
-        category: 'Storybook',
-        description: 'Check which components have stories',
-        parameters: ['path'],
-        icon: '📊'
-      },
-
-      // Activity
-      get_status: {
-        name: 'get_status',
-        category: 'Activity',
-        description: 'Get server status and statistics',
-        parameters: [],
-        icon: '💚'
-      },
-      get_sync_history: {
-        name: 'get_sync_history',
-        category: 'Activity',
-        description: 'Get token sync history',
-        parameters: ['limit'],
-        icon: '📜'
-      },
-      get_activity: {
-        name: 'get_activity',
-        category: 'Activity',
-        description: 'Get recent activity log',
-        parameters: ['limit'],
-        icon: '📝'
-      }
-    };
-  }
-
-  /**
-   * Get all tools with metadata
-   */
-  getAllTools() {
-    return Object.values(this.toolsMetadata).map(tool => ({
-      ...tool,
-      status: this.toolStatus[tool.name] || 'available',
-      lastUsed: this._getLastUsed(tool.name)
-    }));
-  }
-
-  /**
-   * Get tools by category
-   */
-  getToolsByCategory(category) {
-    return this.getAllTools().filter(tool => tool.category === category);
-  }
-
-  /**
-   * Get quick win tools
-   */
-  getQuickWinTools() {
-    return this.getAllTools().filter(tool => tool.quickWin);
-  }
-
-  /**
-   * Get featured tools
-   */
-  getFeaturedTools() {
-    return this.getAllTools().filter(tool => tool.featured);
-  }
-
-  /**
-   * Get tools filtered by team context
-   */
-  getToolsByTeam(teamContext = 'all') {
-    if (teamContext === 'all' || !this.teamToolMappings[teamContext]) {
-      return this.getAllTools();
-    }
-
-    const teamTools = this.teamToolMappings[teamContext];
-    return this.getAllTools().filter(tool => teamTools.includes(tool.name));
-  }
-
-  /**
-   * Execute a tool
-   */
-  async executeTool(toolName, params = {}) {
-    logger.info('Tools', `Executing tool: ${toolName}`, params);
-
-    this.toolStatus[toolName] = 'executing';
-
-    const startTime = Date.now();
-
-    try {
-      // Map tool name to API endpoint
-      const result = await api.executeMCPTool(toolName, params);
-
-      const duration = Date.now() - startTime;
-
-      this.toolStatus[toolName] = 'success';
-
-      // Log execution
-      this._logExecution(toolName, params, result, duration, 'success');
-
-      logger.info('Tools', `Tool ${toolName} succeeded in ${duration}ms`);
-
-      return result;
-    } catch (error) {
-      const duration = Date.now() - startTime;
-
-      this.toolStatus[toolName] = 'error';
-
-      // Log error
-      this._logExecution(toolName, params, null, duration, 'error', error.message);
-
-      logger.error('Tools', `Tool ${toolName} failed: ${error.message}`, error);
-
-      throw error;
-    }
-  }
-
-  /**
-   * Log tool execution
-   */
-  _logExecution(toolName, params, result, duration, status, error = null) {
-    const execution = {
-      toolName,
-      params,
-      result,
-      duration,
-      status,
-      error,
-      timestamp: new Date().toISOString()
-    };
-
-    this.executionHistory.push(execution);
-
-    // Keep only last 100 executions
-    if (this.executionHistory.length > 100) {
-      this.executionHistory.shift();
-    }
-  }
-
-  /**
-   * Get execution history for a tool
-   */
-  getToolHistory(toolName) {
-    return this.executionHistory
-      .filter(exec => exec.toolName === toolName)
-      .slice(-10);
-  }
-
-  /**
-   * Get last used timestamp
-   */
-  _getLastUsed(toolName) {
-    const executions = this.executionHistory.filter(exec => exec.toolName === toolName);
-    if (executions.length === 0) return null;
-    return executions[executions.length - 1].timestamp;
-  }
-
-  /**
-   * Get tool success rate
-   */
-  getSuccessRate(toolName) {
-    const executions = this.executionHistory.filter(exec => exec.toolName === toolName);
-    if (executions.length === 0) return null;
-
-    const successful = executions.filter(exec => exec.status === 'success').length;
-    return successful / executions.length;
-  }
-
-  /**
-   * Get all categories
-   */
-  getCategories() {
-    const categories = new Set();
-    Object.values(this.toolsMetadata).forEach(tool => {
-      categories.add(tool.category);
-    });
-    return Array.from(categories);
-  }
-}
-
-// Singleton instance
-const toolsService = new ToolsService();
-
-export default toolsService;
-export { ToolsService };
diff --git a/admin-ui/js/services/translation-service.js b/admin-ui/js/services/translation-service.js
deleted file mode 100644
index 3b51156..0000000
--- a/admin-ui/js/services/translation-service.js
+++ /dev/null
@@ -1,76 +0,0 @@
-/**
- * translation-service.js
- * API wrapper for Translation Dictionary endpoints
- */
-
-import apiClient from './api-client.js';
-
-class TranslationService {
-  constructor() {
-    this.baseUrl = '/translations';
-  }
-
-  // ========== Dictionary Operations ==========
-
-  async listDictionaries(filters = {}) {
-    const params = new URLSearchParams();
-    if (filters.projectId) params.set('projectId', filters.projectId);
-    if (filters.status) params.set('status', filters.status);
-    if (filters.limit) params.set('limit', filters.limit);
-    if (filters.offset) params.set('offset', filters.offset);
-
-    const queryString = params.toString();
-    const url = queryString ? `${this.baseUrl}?${queryString}` : this.baseUrl;
-    return apiClient.request('GET', url);
-  }
-
-  async getDictionary(id) {
-    return apiClient.request('GET', `${this.baseUrl}/${id}`);
-  }
-
-  async createDictionary(data) {
-    return apiClient.request('POST', this.baseUrl, data);
-  }
-
-  async updateDictionary(id, data) {
-    return apiClient.request('PUT', `${this.baseUrl}/${id}`, data);
-  }
-
-  async deleteDictionary(id) {
-    return apiClient.request('DELETE', `${this.baseUrl}/${id}`);
-  }
-
-  // ========== Mapping Operations ==========
-
-  async createMapping(dictionaryId, data) {
-    return apiClient.request('POST', `${this.baseUrl}/${dictionaryId}/mappings`, data);
-  }
-
-  async updateMapping(dictionaryId, mappingId, data) {
-    return apiClient.request('PUT', `${this.baseUrl}/${dictionaryId}/mappings/${mappingId}`, data);
-  }
-
-  async deleteMapping(dictionaryId, mappingId) {
-    return apiClient.request('DELETE', `${this.baseUrl}/${dictionaryId}/mappings/${mappingId}`);
-  }
-
-  async bulkImportMappings(dictionaryId, mappings) {
-    return apiClient.request('POST', `${this.baseUrl}/${dictionaryId}/mappings/bulk`, { mappings });
-  }
-
-  // ========== Validation & Analysis ==========
-
-  async validateDictionary(id) {
-    return apiClient.request('GET', `${this.baseUrl}/${id}/validate`);
-  }
-
-  async getCoverage(id) {
-    return apiClient.request('GET', `${this.baseUrl}/${id}/coverage`);
-  }
-
-  async exportDictionary(id) {
-    return apiClient.request('GET', `${this.baseUrl}/${id}/export`);
-  }
-}
-
-export default new TranslationService();
diff --git a/admin-ui/js/stores/admin-store.js b/admin-ui/js/stores/admin-store.js
deleted file mode 100644
index a733180..0000000
--- a/admin-ui/js/stores/admin-store.js
+++ /dev/null
@@ -1,113 +0,0 @@
-/**
- * admin-store.js
- * Global admin settings store for DSS configuration
- * Manages hostname, port, local/remote setup type
- */
-
-export class AdminStore {
-  constructor() {
-    this.state = {
-      hostname: localStorage.getItem('admin_hostname') || 'localhost',
-      port: parseInt(localStorage.getItem('admin_port')) || 6006,
-      isRemote: localStorage.getItem('admin_isRemote') === 'true' || false,
-      dssSetupType: localStorage.getItem('admin_setupType') || 'local'
-    };
-    this.listeners = new Set();
-  }
-
-  getState() {
-    return { ...this.state };
-  }
-
-  setState(newState) {
-    const oldState = this.state;
-    this.state = { ...this.state, ...newState };
-
-    // Persist to localStorage
-    localStorage.setItem('admin_hostname', this.state.hostname);
-    localStorage.setItem('admin_port', this.state.port.toString());
-    localStorage.setItem('admin_isRemote', this.state.isRemote.toString());
-    localStorage.setItem('admin_setupType', this.state.dssSetupType);
-
-    // Notify listeners
-    this.notifyListeners();
-    return this.state;
-  }
-
-  /**
-   * Update hostname
-   * @param {string} hostname - Hostname or IP address
-   */
-  setHostname(hostname) {
-    return this.setState({ hostname });
-  }
-
-  /**
-   * Update port
-   * @param {number} port - Port number
-   */
-  setPort(port) {
-    return this.setState({ port: parseInt(port) });
-  }
-
-  /**
-   * Toggle between local and remote DSS setup
-   * @param {boolean} isRemote - True for remote, false for local
-   */
-  setRemote(isRemote) {
-    const dssSetupType = isRemote ? 'remote' : 'local';
-    return this.setState({ isRemote, dssSetupType });
-  }
-
-  /**
-   * Get full URL for Storybook based on current settings
-   * @param {string} skin - Selected skin/theme
-   * @returns {string} Full Storybook URL
-   */
-  getStorybookUrl(skin = 'default') {
-    const protocol = this.state.isRemote ? 'https' : 'http';
-    return `${protocol}://${this.state.hostname}:${this.state.port}/storybook/?skin=${skin}`;
-  }
-
-  /**
-   * Subscribe to state changes
-   * @param {Function} callback - Called when state changes
-   * @returns {Function} Unsubscribe function
-   */
-  subscribe(callback) {
-    this.listeners.add(callback);
-    return () => this.listeners.delete(callback);
-  }
-
-  notifyListeners() {
-    this.listeners.forEach(listener => listener(this.state));
-  }
-
-  /**
-   * Reset to defaults
-   */
-  reset() {
-    localStorage.removeItem('admin_hostname');
-    localStorage.removeItem('admin_port');
-    localStorage.removeItem('admin_isRemote');
-    localStorage.removeItem('admin_setupType');
-
-    this.state = {
-      hostname: 'localhost',
-      port: 6006,
-      isRemote: false,
-      dssSetupType: 'local'
-    };
-    this.notifyListeners();
-  }
-}
-
-// Singleton instance
-let adminStoreInstance = null;
-
-export function useAdminStore() {
-  if (!adminStoreInstance) {
-    adminStoreInstance = new AdminStore();
-  }
-  return adminStoreInstance;
-}
diff --git a/admin-ui/js/stores/app-store.js b/admin-ui/js/stores/app-store.js
deleted file mode 100644
index 8a1b3b4..0000000
--- a/admin-ui/js/stores/app-store.js
+++ /dev/null
@@ -1,548 +0,0 @@
-/**
- * Design System Server (DSS) - App Store
- *
- * Centralized state management with reactive subscriptions
- * for managing application state across components and pages.
- */
-
-class AppStore {
-  constructor() {
-    this.state = {
-      // User & Auth
-      user: null,
-      team: null,
-      role: null,
-
-      // Navigation
-      currentPage: 'dashboard',
-      currentProject: null,
-      sidebarOpen: true,
-
-      // Data
-      projects: [],
-      tokens: [],
-      components: [],
-      styles: [],
-
-      // Discovery
-      discovery: null,
-      health: null,
-      activity: [],
-      stats: null,
-
-      // Figma
-      figmaConnected: false,
-      figmaFileKey: null,
-      lastSync: null,
-
-      // Configuration (loaded from server /api/config)
-      serverConfig: null,
-      isConfigLoading: true,
-      configError: null,
-
-      // UI State
-      loading: {},
-      errors: {},
-      notifications: []
-    };
-
-    this.listeners = new Map();
-    this.middleware = [];
-
-    // Track in-flight requests to prevent duplicates
-    this.pendingRequests = new Map();
-  }
-
-  // === State Access ===
-
-  get(key) {
-    return key ? this.state[key] : this.state;
-  }
-
-  // === State Updates ===
-
-  set(updates, silent = false) {
-    const prevState = { ...this.state };
-
-    // Apply middleware
-    for (const mw of this.middleware) {
-      updates = mw(updates, prevState);
-    }
-
-    this.state = { ...this.state, ...updates };
-
-    if (!silent) {
-      this._notify(updates, prevState);
-    }
-  }
-
-  // === Subscriptions ===
-
-  subscribe(key, callback) {
-    if (!this.listeners.has(key)) {
-      this.listeners.set(key, new Set());
-    }
-    this.listeners.get(key).add(callback);
-
-    // Return unsubscribe function
-    return () => {
-      this.listeners.get(key)?.delete(callback);
-    };
-  }
-
-  subscribeAll(callback) {
-    return this.subscribe('*', callback);
-  }
-
-  _notify(updates, prevState) {
-    // Notify specific key listeners
-    for (const key of Object.keys(updates)) {
-      const listeners = this.listeners.get(key);
-      if (listeners) {
-        listeners.forEach(cb => cb(updates[key], prevState[key], key));
-      }
-    }
-
-    // Notify global listeners
-    const globalListeners = this.listeners.get('*');
-    if (globalListeners) {
-      globalListeners.forEach(cb => cb(this.state, prevState));
-    }
-  }
-
-  // === Middleware ===
-
-  use(middleware) {
-    this.middleware.push(middleware);
-  }
-
-  // === Loading State ===
-
-  setLoading(key, loading = true) {
-    this.set({
-      loading: { ...this.state.loading, [key]: loading }
-    });
-  }
-
-  isLoading(key) {
-    return this.state.loading[key] || false;
-  }
-
-  // === Error State ===
-
-  setError(key, error) {
-    this.set({
-      errors: { ...this.state.errors, [key]: error }
-    });
-  }
-
-  clearError(key) {
-    const errors = { ...this.state.errors };
-    delete errors[key];
-    this.set({ errors });
-  }
-
-  // === Notifications ===
-
-  notify(message, type = 'info', duration = 5000) {
-    const notification = {
-      id: Date.now(),
-      message,
-      type,
-      timestamp: new Date()
-    };
-
-    this.set({
-      notifications: [...this.state.notifications, notification]
-    });
-
-    if (duration > 0) {
-      setTimeout(() => this.dismissNotification(notification.id), duration);
-    }
-
-    return notification.id;
-  }
-
-  dismissNotification(id) {
-    this.set({
-      notifications: this.state.notifications.filter(n => n.id !== id)
-    });
-  }
-
-  // === User & Auth ===
-
-  setUser(user, team = null, role = null) {
-    this.set({ user, team, role });
-  }
-
-  logout() {
-    this.set({
-      user: null,
-      team: null,
-      role: null,
-      projects: [],
-      tokens: [],
-      components: [],
-      currentProject: null
-    });
-    localStorage.removeItem('currentProject');
-  }
-
-  hasPermission(permission) {
-    const rolePermissions = {
-      SUPER_ADMIN: ['*'],
-      TEAM_LEAD: ['read', 'write', 'sync', 'manage_team'],
-      DEVELOPER: ['read', 'write', 'sync'],
-      VIEWER: ['read']
-    };
-
-    const perms = rolePermissions[this.state.role] || [];
-    return perms.includes('*') || perms.includes(permission);
-  }
-
-  // === Projects ===
-
-  /**
-   * Fetch all projects from API
-   */
-  async fetchProjects() {
-    this.setLoading('projects', true);
-    try {
-      const response = await fetch('/api/projects');
-
-      if (!response.ok) throw new Error(`API Error: ${response.status}`);
-
-      const json = await response.json();
-
-      if (json.status === 'success') {
-        // Clear any previous errors on success
-        this.setError('projects', null);
-        this.setProjects(json.data.projects || []);
-
-        // Auto-restore last selected project if available
-        if (!this.state.currentProject && json.data.projects.length > 0) {
-          const stored = localStorage.getItem('currentProject');
-          if (stored) {
-            try {
-              const parsed = JSON.parse(stored);
-              const exists = json.data.projects.find(p => p.id === parsed.id);
-              if (exists) this.setProject(exists);
-            } catch (e) {
-              console.warn('Invalid stored project', e);
-            }
-          }
-        }
-      } else {
-        throw new Error(json.message || 'Failed to fetch projects');
-      }
-    } catch (error) {
-      console.error('Project fetch error:', error);
-      this.setError('projects', error.message);
-    } finally {
-      this.setLoading('projects', false);
-    }
-  }
-
-  setProjects(projects) {
-    this.set({ projects });
-  }
-
-  setProject(project) {
-    this.set({ currentProject: project });
-    if (project) {
-      localStorage.setItem('currentProject', JSON.stringify(project));
-    } else {
-      localStorage.removeItem('currentProject');
-    }
-  }
-
-  async getProjectConfig() {
-    if (!this.state.currentProject) return null;
-
-    this.setLoading('config', true);
-    try {
-      const response = await fetch(`/api/config/${this.state.currentProject.id}/resolved`);
-
-      if (!response.ok) throw new Error(`API Error: ${response.status}`);
-
-      const json = await response.json();
-
-      if (json.status === 'success') {
-        // Clear any previous errors on success
-        this.setError('config', null);
-        return json.data.config;
-      } else {
-        throw new Error(json.message || 'Failed to fetch config');
-      }
-    } catch (error) {
-      console.error('Config fetch error:', error);
-      // Set error state so UI can display retry option
-      this.setError('config', error.message);
-      return null;
-    } finally {
-      this.setLoading('config', false);
-    }
-  }
-
-  /**
-   * Fetch all components from registry
-   * Includes request deduplication to prevent duplicate API calls
-   */
-  async fetchComponents() {
-    const requestKey = 'components';
-
-    // Return existing promise if request is in flight
-    if (this.pendingRequests.has(requestKey)) {
-      return this.pendingRequests.get(requestKey);
-    }
-
-    // Create new request promise
-    const requestPromise = (async () => {
-      this.setLoading('components', true);
-      try {
-        const response = await fetch('/api/components');
-
-        if (!response.ok) throw new Error(`API Error: ${response.status}`);
-
-        const json = await response.json();
-
-        if (json.status === 'success') {
-          this.setError('components', null);
-          this.setComponents(json.data.components || []);
-        } else {
-          throw new Error(json.message || 'Failed to fetch components');
-        }
-      } catch (error) {
-        console.error('Components fetch error:', error);
-        this.setError('components', error.message);
-        throw error;
-      } finally {
-        this.setLoading('components', false);
-        this.pendingRequests.delete(requestKey);
-      }
-    })();
-
-    this.pendingRequests.set(requestKey, requestPromise);
-    return requestPromise;
-  }
-
-  /**
-   * Fetch design tokens for a project
-   * Includes request deduplication to prevent duplicate API calls
-   */
-  async fetchTokens(projectId) {
-    if (!projectId) {
-      console.warn('fetchTokens called without projectId');
-      return;
-    }
-
-    const requestKey = `tokens:${projectId}`;
-
-    // Return existing promise if request is in flight
-    if (this.pendingRequests.has(requestKey)) {
-      return this.pendingRequests.get(requestKey);
-    }
-
-    // Create new request promise
-    const requestPromise = (async () => {
-      this.setLoading('tokens', true);
-      try {
-        const response = await fetch(`/api/projects/${projectId}/tokens`);
-
-        if (!response.ok) throw new Error(`API Error: ${response.status}`);
-
-        const json = await response.json();
-
-        if (json.status === 'success') {
-          this.setError('tokens', null);
-          this.setTokens(json.data.tokens || []);
-        } else {
-          throw new Error(json.message || 'Failed to fetch tokens');
-        }
-      } catch (error) {
-        console.error('Tokens fetch error:', error);
-        this.setError('tokens', error.message);
-        throw error;
-      } finally {
-        this.setLoading('tokens', false);
-        this.pendingRequests.delete(requestKey);
-      }
-    })();
-
-    this.pendingRequests.set(requestKey, requestPromise);
-    return requestPromise;
-  }
-
-  /**
-   * Fetch discovery scan results for a project
-   * Includes request deduplication to prevent duplicate API calls
-   */
-  async fetchDiscoveryResults(projectId) {
-    if (!projectId) {
-      console.warn('fetchDiscoveryResults called without projectId');
-      return;
-    }
-
-    const requestKey = `discovery:${projectId}`;
-
-    // Return existing promise if request is in flight
-    if (this.pendingRequests.has(requestKey)) {
-      return this.pendingRequests.get(requestKey);
-    }
-
-    // Create new request promise
-    const requestPromise = (async () => {
-      this.setLoading('discovery', true);
-      try {
-        const response = await fetch(`/api/discovery/scan?projectId=${projectId}`);
-
-        if (!response.ok) throw new Error(`API Error: ${response.status}`);
-
-        const json = await response.json();
-
-        if (json.status === 'success') {
-          this.setError('discovery', null);
-          this.setDiscovery(json.data || null);
-        } else {
-          throw new Error(json.message || 'Failed to fetch discovery results');
-        }
-      } catch (error) {
-        console.error('Discovery fetch error:', error);
-        this.setError('discovery', error.message);
-        throw error;
-      } finally {
-        this.setLoading('discovery', false);
-        this.pendingRequests.delete(requestKey);
-      }
-    })();
-
-    this.pendingRequests.set(requestKey, requestPromise);
-    return requestPromise;
-  }
-
-  addProject(project) {
-    this.set({
-      projects: [...this.state.projects, project]
-    });
-  }
-
-  updateProject(id, updates) {
-    this.set({
-      projects: this.state.projects.map(p =>
-        p.id === id ? { ...p, ...updates } : p
-      )
-    });
-  }
-
-  // === Figma ===
-
-  setFigmaConnected(connected, fileKey = null) {
-    this.set({
-      figmaConnected: connected,
-      figmaFileKey: fileKey
-    });
-  }
-
-  setLastSync(timestamp) {
-    this.set({ lastSync: timestamp });
-  }
-
-  // === Tokens ===
-
-  setTokens(tokens) {
-    this.set({ tokens });
-  }
-
-  getTokensByCategory(category) {
-    return this.state.tokens.filter(t => t.category === category);
-  }
-
-  // === Components ===
-
-  setComponents(components) {
-    this.set({ components });
-  }
-
-  // === Discovery ===
-
-  setDiscovery(discovery) {
-    this.set({ discovery });
-  }
-
-  setHealth(health) {
-    this.set({ health });
-  }
-
-  setActivity(activity) {
-    this.set({ activity });
-  }
-
-  setStats(stats) {
-    this.set({ stats });
-  }
-
-  // === Persistence ===
-
-  persist() {
-    const toPersist = {
-      user: this.state.user,
-      team: this.state.team,
-      role: this.state.role,
-      figmaFileKey: this.state.figmaFileKey,
-      sidebarOpen: this.state.sidebarOpen
-      // NOTE: serverConfig is loaded from /api/config, not persisted locally
-    };
-    localStorage.setItem('dss-store', JSON.stringify(toPersist));
-  }
-
-  hydrate() {
-    try {
-      // Hydrate general store data
-      const stored = localStorage.getItem('dss-store');
-      if (stored) {
-        const data = JSON.parse(stored);
-        this.set(data, true);
-      }
-
-      // Hydrate project context separately
-      const storedProject = localStorage.getItem('currentProject');
-      if (storedProject) {
-        const project = JSON.parse(storedProject);
-        this.set({ currentProject: project }, true);
-      }
-    } catch (e) {
-      console.warn('Failed to hydrate store:', e);
-    }
-  }
-
-  // === Debug ===
-
-  debug() {
-    console.group('App Store State');
-    console.log('State:', this.state);
-    console.log('Listeners:', Array.from(this.listeners.keys()));
-    console.groupEnd();
-  }
-}
-
-// Logging middleware
-const loggingMiddleware = (updates, prevState) => {
-  if (window.DEBUG) {
-    console.log('[Store Update]', updates);
-  }
-  return updates;
-};
-
-// Create and export singleton
-const store = new AppStore();
-store.use(loggingMiddleware);
-store.hydrate();
-
-// Auto-persist on important changes
-store.subscribe('user', () => store.persist());
-store.subscribe('team', () => store.persist());
-store.subscribe('figmaFileKey', () => store.persist());
-// NOTE: serverConfig is NOT persisted - loaded fresh from /api/config on each init
-
-export { AppStore };
-export default store;
diff --git a/admin-ui/js/stores/context-store.js b/admin-ui/js/stores/context-store.js
deleted file mode 100644
index 69cb5fe..0000000
--- a/admin-ui/js/stores/context-store.js
+++ /dev/null
@@ -1,318 +0,0 @@
-/**
- * @fileoverview A simple global store for application context.
- * Manages shared state like current page, project, team, and selected items.
- * Used by components like ds-ai-chat to be context-aware.
- * MVP2: Extended with admin settings and project configuration context.
- *
- * ARCHITECTURE NOTE: Context store uses localStorage directly for persistence.
- * Incognito mode handling is managed at the API client layer (api-client.js).
- * This removes circular dependencies and initialization order issues.
- */
-
-/**
- * Page-specific context prompts for the AI assistant.
- * These provide contextual awareness for each page in the admin UI.
- */
-const PAGE_CONTEXT_PROMPTS = {
-  dashboard: 'You are helping with the DSS dashboard. The user can see project overview, recent activity, and quick actions.',
-  projects: 'You are helping manage design system projects. The user can create, configure, and monitor projects.',
-  services: 'You are helping analyze design system services and integrations.',
-  'quick-wins': 'You are helping find quick win opportunities for design system adoption.',
-  chat: 'You are a helpful AI assistant for the Design System Server.',
-  tokens: 'You are helping manage design tokens. The user can extract, validate, sync, and transform tokens between formats.',
-  components: 'You are helping with React components. The user can generate, audit, and validate design system components.',
-  figma: 'You are helping with Figma integration. The user can connect files, sync tokens, and view visual diffs.',
-  docs: 'You are helping with DSS documentation and guides.',
-  teams: 'You are helping manage team access and permissions for design system projects.',
-  audit: 'You are helping with design system audits. The user can identify issues, track adoption, and create quick wins.',
-  plugins: 'You are helping manage DSS plugins and extensions.',
-  settings: 'You are helping configure DSS settings and preferences.',
-  storybook: 'You are helping with Storybook setup. The user can generate stories and configure theme documentation.',
-};
-
-class ContextStore extends EventTarget {
-  constructor() {
-    super();
-    this.state = {
-      // MVP1 Core Context (no defaults for project - force selection)
-      projectId: localStorage.getItem('current_project_id') || null,
-      teamId: localStorage.getItem('current_team_id') || 'ui',
-      userId: localStorage.getItem('current_user_id') || 'admin',
-      capabilities: JSON.parse(localStorage.getItem('user_capabilities') || '[]'),
-
-      // MVP2: Admin settings context
-      adminSettings: {
-        hostname: localStorage.getItem('admin_hostname') || 'localhost',
-        port: parseInt(localStorage.getItem('admin_port')) || 6006,
-        isRemote: localStorage.getItem('admin_isRemote') === 'true' || false,
-        dssSetupType: localStorage.getItem('admin_setupType') || 'local',
-      },
-
-      // MVP2: Current project configuration
-      currentProject: null, // Will be set from ProjectStore
-      currentProjectSkin: localStorage.getItem('current_project_skin') || 'default',
-
-      // Legacy fields (keep for backward compatibility)
-      page: null,
-      project: null,
-      team: 'all',
-      selectedItems: [], // For batch actions on lists
-      pageData: null,    // Current page-specific data (tokens, components, etc.)
-    };
-  }
-
-  /**
-   * Updates one or more context values and dispatches an event.
-   * @param {Partial<typeof this.state>} newContext - An object with keys to update.
-   */
-  setContext(newContext) {
-    let hasChanged = false;
-    const changes = {};
-
-    for (const key in newContext) {
-      if (Object.prototype.hasOwnProperty.call(this.state, key)) {
-        const oldValue = this.state[key];
-        const newValue = newContext[key];
-
-        // Deep comparison for arrays/objects
-        const isDifferent = Array.isArray(newValue) || typeof newValue === 'object'
-          ? JSON.stringify(oldValue) !== JSON.stringify(newValue)
-          : oldValue !== newValue;
-
-        if (isDifferent) {
-          this.state[key] = newValue;
-          changes[key] = { oldValue, newValue };
-          hasChanged = true;
-        }
-      }
-    }
-
-    if (hasChanged) {
-      this.dispatchEvent(new CustomEvent('context-change', {
-        detail: {
-          state: { ...this.state },
-          changes
-        }
-      }));
-    }
-  }
-
-  /**
-   * Sets a single context value
-   * @param {string} key - The context key
-   * @param {any} value - The new value
-   */
-  set(key, value) {
-    this.setContext({ [key]: value });
-  }
-
-  /**
-   * Gets a single context value
-   * @param {string} key - The context key
-   * @returns {any}
-   */
-  get(key) {
-    return this.state[key];
-  }
-
-  /**
-   * Returns the current state (shallow copy).
-   * @returns {typeof this.state}
-   */
-  getState() {
-    return { ...this.state };
-  }
-
-  /**
-   * Gets a context-aware prompt for the current page.
-   * Used by the AI chat to provide page-specific assistance.
-   * @returns {string} A contextual prompt string.
-   */
-  getContextPrompt() {
-    const page = this.get('page') || 'dashboard';
-    return PAGE_CONTEXT_PROMPTS[page] || PAGE_CONTEXT_PROMPTS.chat;
-  }
-
-  /**
-   * A convenience method to subscribe to context changes.
-   * @param {Function} callback - The function to call on change.
-   * @returns {Function} An unsubscribe function.
-   */
-  subscribe(callback) {
-    const handler = (event) => callback(event.detail);
-    this.addEventListener('context-change', handler);
-    // Return an unsubscribe function
-    return () => this.removeEventListener('context-change', handler);
-  }
-
-  /**
-   * Subscribe to changes on a specific key only
-   * @param {string} key - The key to watch
-   * @param {Function} callback - Called with (newValue, oldValue) when key changes
-   * @returns {Function} Unsubscribe function
-   */
-  subscribeToKey(key, callback) {
-    const handler = (event) => {
-      const { changes } = event.detail;
-      if (changes[key]) {
-        callback(changes[key].newValue, changes[key].oldValue);
-      }
-    };
-    this.addEventListener('context-change', handler);
-    return () => this.removeEventListener('context-change', handler);
-  }
-
-  /**
-   * Clears selection state
-   */
-  clearSelection() {
-    this.setContext({ selectedItems: [] });
-  }
-
-  /**
-   * Adds items to selection
-   * @param {Array} items - Items to add
-   */
-  addToSelection(items) {
-    const current = this.state.selectedItems || [];
-    const newItems = Array.isArray(items) ? items : [items];
-    this.setContext({
-      selectedItems: [...new Set([...current, ...newItems])]
-    });
-  }
-
-  /**
-   * Removes items from selection
-   * @param {Array} items - Items to remove
-   */
-  removeFromSelection(items) {
-    const current = this.state.selectedItems || [];
-    const toRemove = new Set(Array.isArray(items) ? items : [items]);
-    this.setContext({
-      selectedItems: current.filter(item => !toRemove.has(item))
-    });
-  }
-
-  /**
-   * MVP1: Set active project with storage persistence
-   * @param {string} id - Project ID
-   */
-  setProject(id) {
-    if (!id) {
-      console.error('[ContextStore] Cannot set null projectId');
-      return;
-    }
-    localStorage.setItem('current_project_id', id);
-    this.setContext({ projectId: id, project: id }); // Update both for compatibility
-  }
-
-  /**
-   * MVP1: Set active team with storage persistence
-   * @param {string} id - Team ID (ui, ux, qa, admin)
-   */
-  setTeam(id) {
-    localStorage.setItem('current_team_id', id);
-    this.setContext({ teamId: id, team: id }); // Update both for compatibility
-  }
-
-  /**
-   * MVP1: Check if project is selected
-   * @returns {boolean}
-   */
-  hasProject() {
-    return !!this.state.projectId;
-  }
-
-  /**
-   * MVP1: Get full context for MCP tool calls
-   * @returns {Object} Context object with projectId, teamId, userId
-   */
-  getMCPContext() {
-    return {
-      project_id: this.state.projectId,
-      team_id: this.state.teamId,
-      user_id: this.state.userId,
-      capabilities: this.state.capabilities,
-    };
-  }
-
-  /**
-   * MVP2: Update admin settings in context
-   * @param {Object} settings - Admin settings object
-   */
-  updateAdminSettings(settings) {
-    this.setContext({
-      adminSettings: {
-        ...this.state.adminSettings,
-        ...settings
-      }
-    });
-  }
-
-  /**
-   * MVP2: Get current admin settings
-   * @returns {Object} Admin settings
-   */
-  getAdminSettings() {
-    return { ...this.state.adminSettings };
-  }
-
-  /**
-   * MVP2: Update current project information
-   * @param {Object} project - Project object from ProjectStore
-   */
-  setCurrentProject(project) {
-    this.setContext({
-      currentProject: project,
-      projectId: project?.id || null,
-      currentProjectSkin: project?.skinSelected || 'default'
-    });
-  }
-
-  /**
-   * MVP2: Get current project from context
-   * @returns {Object|null} Current project or null
-   */
-  getCurrentProject() {
-    return this.state.currentProject || null;
-  }
-
-  /**
-   * MVP2: Update current project skin
-   * @param {string} skin - Skin name
-   */
-  setCurrentProjectSkin(skin) {
-    localStorage.setItem('current_project_skin', skin);
-    this.setContext({
-      currentProjectSkin: skin
-    });
-  }
-
-  /**
-   * MVP2: Check if system is configured for remote/headless mode
-   * @returns {boolean}
-   */
-  isRemoteSetup() {
-    return this.state.adminSettings.isRemote;
-  }
-
-  /**
-   * MVP2: Check if system is configured for local mode
-   * @returns {boolean}
-   */
-  isLocalSetup() {
-    return !this.state.adminSettings.isRemote;
-  }
-
-  /**
-   * MVP2: Get DSS setup type
-   * @returns {string} 'local' or 'remote'
-   */
-  getDSSSetupType() {
-    return this.state.adminSettings.dssSetupType;
-  }
-}
-
-// Export a singleton instance
-const contextStore = new ContextStore();
-export default contextStore;
diff --git a/admin-ui/js/stores/project-store.js b/admin-ui/js/stores/project-store.js
deleted file mode 100644
index eb627a6..0000000
--- a/admin-ui/js/stores/project-store.js
+++ /dev/null
@@ -1,250 +0,0 @@
-/**
- * project-store.js
- * Project configuration store
- * Manages project list, current project selection, and project metadata
- * MVP3: Integrates with API backend while maintaining localStorage fallback
- */
-
-import apiClient from '../services/api-client.js';
-
-export class ProjectStore {
-  constructor() {
-    // Load projects from localStorage (fallback for MVP2)
-    const stored = localStorage.getItem('projects_list');
-    this.projects = stored ? JSON.parse(stored) : this.getDefaultProjects();
-
-    // Load current project selection
-    this.currentProjectId = localStorage.getItem('current_project_id') || (this.projects.length > 0 ? this.projects[0].id : null);
-
-    this.listeners = new Set();
-    this.isLoading = false;
-    this.hasLoadedFromAPI = false;
-
-    // Try to load from API on initialization
-    this.syncWithAPI();
-  }
-
-  async syncWithAPI() {
-    try {
-      const projects = await apiClient.getProjects();
-      this.projects = projects;
-      this.hasLoadedFromAPI = true;
-      this.persist();
-      this.notifyListeners();
-    } catch (error) {
-      console.warn('[ProjectStore] Failed to sync with API, using localStorage:', error);
-      // Continue using localStorage data
-    }
-  }
-
-  getDefaultProjects() {
-    return [
-      {
-        id: 'DEFAULT-DESIGN-SYSTEM',
-        name: 'Default Design System',
-        skinSelected: 'default',
-        createdAt: new Date().toISOString(),
-        updatedAt: new Date().toISOString()
-      }
-    ];
-  }
-
-  /**
-   * Get all projects
-   * @returns {Array} Projects array
-   */
-  getProjects() {
-    return [...this.projects];
-  }
-
-  /**
-   * Get current project
-   * @returns {Object|null} Current project or null
-   */
-  getCurrentProject() {
-    return this.projects.find(p => p.id === this.currentProjectId) || null;
-  }
-
-  /**
-   * Get project by ID
-   * @param {string} id - Project ID
-   * @returns {Object|null} Project or null
-   */
-  getProject(id) {
-    return this.projects.find(p => p.id === id) || null;
-  }
-
-  /**
-   * Create new project
-   * @param {Object} projectData - {name, key, description, figmaFileKey, jiraProjectKey, storybookUrl}
-   * @returns {Object} Created project
-   */
-  async createProject(projectData) {
-    try {
-      // Try API first if authenticated
-      if (apiClient.accessToken) {
-        const project = await apiClient.createProject(projectData);
-        this.projects.push(project);
-        this.persist();
-        this.notifyListeners();
-        return project;
-      }
-    } catch (error) {
-      console.warn('[ProjectStore] API creation failed, using localStorage:', error);
-    }
-
-    // Fallback to localStorage
-    const now = new Date().toISOString();
-    const project = {
-      id: projectData.id || `PROJECT-${Date.now()}`,
-      name: projectData.name || 'Untitled Project',
-      key: projectData.key || `KEY-${Date.now()}`,
-      description: projectData.description || '',
-      createdAt: now,
-      updatedAt: now,
-      ...projectData
-    };
-
-    this.projects.push(project);
-    this.persist();
-    this.notifyListeners();
-    return project;
-  }
-
-  /**
-   * Update project
-   * @param {string} id - Project ID
-   * @param {Object} updates - Partial project updates
-   * @returns {Object|null} Updated project or null
-   */
-  async updateProject(id, updates) {
-    const project = this.projects.find(p => p.id === id);
-    if (!project) return null;
-
-    try {
-      // Try API first if authenticated
-      if (apiClient.accessToken) {
-        const updated = await apiClient.updateProject(id, updates);
-        const index = this.projects.findIndex(p => p.id === id);
-        if (index !== -1) {
-          this.projects[index] = updated;
-        }
-        this.persist();
-        this.notifyListeners();
-        return updated;
-      }
-    } catch (error) {
-      console.warn('[ProjectStore] API update failed, using localStorage:', error);
-    }
-
-    // Fallback to localStorage
-    Object.assign(project, updates, {
-      updatedAt: new Date().toISOString()
-    });
-
-    this.persist();
-    this.notifyListeners();
-    return project;
-  }
-
-  /**
-   * Delete project
-   * @param {string} id - Project ID
-   * @returns {boolean} Success
-   */
-  async deleteProject(id) {
-    try {
-      // Try API first if authenticated
-      if (apiClient.accessToken) {
-        await apiClient.deleteProject(id);
-      }
-    } catch (error) {
-      console.warn('[ProjectStore] API deletion failed, using localStorage:', error);
-    }
-
-    const index = this.projects.findIndex(p => p.id === id);
-    if (index === -1) return false;
-
-    this.projects.splice(index, 1);
-
-    // If deleted project was selected, select first available
-    if (this.currentProjectId === id) {
-      this.currentProjectId = this.projects.length > 0 ? this.projects[0].id : null;
-      localStorage.setItem('current_project_id', this.currentProjectId || '');
-    }
-
-    this.persist();
-    this.notifyListeners();
-    return true;
-  }
-
-  /**
-   * Select/switch to different project
-   * @param {string} id - Project ID
-   * @returns {Object|null} Selected project or null
-   */
-  selectProject(id) {
-    const project = this.projects.find(p => p.id === id);
-    if (!project) return null;
-
-    this.currentProjectId = id;
-    localStorage.setItem('current_project_id', id);
-    this.notifyListeners();
-    return project;
-  }
-
-  /**
-   * Update selected skin for current project
-   * @param {string} skin - Skin name
-   * @returns {Object|null} Updated project
-   */
-  setSkinForCurrentProject(skin) {
-    if (!this.currentProjectId) return null;
-    return this.updateProject(this.currentProjectId, { skinSelected: skin });
-  }
-
-  /**
-   * Persist to localStorage
-   */
-  persist() {
-    localStorage.setItem('projects_list', JSON.stringify(this.projects));
-  }
-
-  /**
-   * Subscribe to changes
-   * @param {Function} callback - Called on state changes
-   * @returns {Function} Unsubscribe function
-   */
-  subscribe(callback) {
-    this.listeners.add(callback);
-    return () => this.listeners.delete(callback);
-  }
-
-  notifyListeners() {
-    this.listeners.forEach(listener => listener({
-      projects: this.getProjects(),
-      currentProject: this.getCurrentProject()
-    }));
-  }
-
-  /**
-   * Reset to default project
-   */
-  reset() {
-    localStorage.removeItem('projects_list');
-    localStorage.removeItem('current_project_id');
-    this.projects = this.getDefaultProjects();
-    this.currentProjectId = this.projects[0].id;
-    this.notifyListeners();
-  }
-}
-
-// Singleton instance
-let projectStoreInstance = null;
-
-export function useProjectStore() {
-  if (!projectStoreInstance) {
-    projectStoreInstance = new ProjectStore();
-  }
-  return projectStoreInstance;
-}
diff --git a/admin-ui/js/stores/user-store.js b/admin-ui/js/stores/user-store.js
deleted file mode 100644
index cffe5a5..0000000
--- a/admin-ui/js/stores/user-store.js
+++ /dev/null
@@ -1,413 +0,0 @@
-/**
- * user-store.js
- * User state management store
- * Manages current logged-in user, preferences, and integrations
- * MVP3: Integrates with backend API while maintaining localStorage persistence
- */
-
-import apiClient from '../services/api-client.js';
-
-export class UserStore {
-  constructor() {
-    // Current user state
-    this.currentUser = this.loadUserFromStorage();
-    this.isAuthenticated = !!this.currentUser;
-    this.isLoading = false;
-
-    // User preferences
-    this.preferences = this.loadPreferencesFromStorage() || this.getDefaultPreferences();
-
-    // User integrations (API keys, tokens)
-    this.integrations = this.loadIntegrationsFromStorage() || {};
-
-    // Event listeners
-    this.listeners = new Set();
-
-    // Try to verify current user with API on initialization
-    if (this.isAuthenticated) {
-      this.verifyUserWithAPI();
-    }
-  }
-
-  /**
-   * Get default user preferences
-   * @returns {Object} Default preferences
-   */
-  getDefaultPreferences() {
-    return {
-      theme: 'dark',
-      language: 'en',
-      lastTeam: 'ui',
-      chatCollapsedState: true,
-      notifications: {
-        enabled: true,
-        email: true,
-        desktop: true
-      },
-      layout: {
-        showChat: true,
-        showPanel: true,
-        sidebarWidth: 250
-      },
-      editor: {
-        fontSize: 13,
-        fontFamily: 'Monaco, Menlo, Ubuntu Mono, monospace',
-        lineHeight: 1.6
-      }
-    };
-  }
-
-  /**
-   * Load user from localStorage
-   * @returns {Object|null} User object or null
-   */
-  loadUserFromStorage() {
-    try {
-      const stored = localStorage.getItem('current_user');
-      return stored ? JSON.parse(stored) : null;
-    } catch (error) {
-      console.warn('[UserStore] Failed to parse stored user:', error);
-      return null;
-    }
-  }
-
-  /**
-   * Load preferences from localStorage
-   * @returns {Object|null} Preferences or null
-   */
-  loadPreferencesFromStorage() {
-    try {
-      const stored = localStorage.getItem('user_preferences');
-      return stored ? JSON.parse(stored) : null;
-    } catch (error) {
-      console.warn('[UserStore] Failed to parse stored preferences:', error);
-      return null;
-    }
-  }
-
-  /**
-   * Load integrations from localStorage
-   * @returns {Object} Integrations object
-   */
-  loadIntegrationsFromStorage() {
-    try {
-      const stored = localStorage.getItem('user_integrations');
-      return stored ? JSON.parse(stored) : {};
-    } catch (error) {
-      console.warn('[UserStore] Failed to parse stored integrations:', error);
-      return {};
-    }
-  }
-
-  /**
-   * Persist user to localStorage
-   */
-  persistUser() {
-    if (this.currentUser) {
-      localStorage.setItem('current_user', JSON.stringify(this.currentUser));
-    } else {
-      localStorage.removeItem('current_user');
-    }
-  }
-
-  /**
-   * Persist preferences to localStorage
-   */
-  persistPreferences() {
-    localStorage.setItem('user_preferences', JSON.stringify(this.preferences));
-  }
-
-  /**
-   * Persist integrations to localStorage
-   */
-  persistIntegrations() {
-    localStorage.setItem('user_integrations', JSON.stringify(this.integrations));
-  }
-
-  /**
-   * Verify current user with API
-   */
-  async verifyUserWithAPI() {
-    try {
-      const user = await apiClient.getMe();
-      this.currentUser = user;
-      this.isAuthenticated = true;
-      this.persistUser();
-      this.notifyListeners();
-    } catch (error) {
-      console.warn('[UserStore] Failed to verify user with API:', error);
-      // Fall back to localStorage user
-    }
-  }
-
-  /**
-   * Register new user
-   * @param {string} email - User email
-   * @param {string} password - User password
-   * @param {string} name - User name
-   * @returns {Object} Created user
-   */
-  async register(email, password, name) {
-    this.isLoading = true;
-    this.notifyListeners();
-
-    try {
-      const user = await apiClient.register(email, password, name);
-      this.currentUser = user;
-      this.isAuthenticated = true;
-      this.persistUser();
-      this.notifyListeners();
-      return user;
-    } catch (error) {
-      this.isLoading = false;
-      this.notifyListeners();
-      throw error;
-    }
-  }
-
-  /**
-   * Login user
-   * @param {string} email - User email
-   * @param {string} password - User password
-   * @returns {Object} Logged-in user
-   */
-  async login(email, password) {
-    this.isLoading = true;
-    this.notifyListeners();
-
-    try {
-      const user = await apiClient.login(email, password);
-      this.currentUser = user;
-      this.isAuthenticated = true;
-      this.persistUser();
-      this.isLoading = false;
-      this.notifyListeners();
-      return user;
-    } catch (error) {
-      this.isLoading = false;
-      this.isAuthenticated = false;
-      this.notifyListeners();
-      throw error;
-    }
-  }
-
-  /**
-   * Logout user
-   */
-  async logout() {
-    try {
-      await apiClient.logout();
-    } catch (error) {
-      console.warn('[UserStore] API logout failed:', error);
-    }
-
-    this.currentUser = null;
-    this.isAuthenticated = false;
-    this.integrations = {};
-
-    localStorage.removeItem('current_user');
-    localStorage.removeItem('user_preferences');
-    localStorage.removeItem('user_integrations');
-    localStorage.removeItem('access_token');
-    localStorage.removeItem('refresh_token');
-
-    this.notifyListeners();
-  }
-
-  /**
-   * Get current user
-   * @returns {Object|null} Current user or null
-   */
-  getCurrentUser() {
-    return this.currentUser;
-  }
-
-  /**
-   * Check if user is authenticated
-   * @returns {boolean} Authentication status
-   */
-  isLoggedIn() {
-    return this.isAuthenticated;
-  }
-
-  /**
-   * Update user profile
-   * @param {Object} updates - {name, email, avatar, bio}
-   * @returns {Object} Updated user
-   */
-  async updateProfile(updates) {
-    try {
-      // Try API first if authenticated
-      if (this.isAuthenticated && apiClient.accessToken) {
-        const updated = await apiClient.updateUser(this.currentUser.id, updates);
-        this.currentUser = { ...this.currentUser, ...updated };
-        this.persistUser();
-        this.notifyListeners();
-        return updated;
-      }
-    } catch (error) {
-      console.warn('[UserStore] API profile update failed:', error);
-    }
-
-    // Fallback to local update
-    this.currentUser = { ...this.currentUser, ...updates };
-    this.persistUser();
-    this.notifyListeners();
-    return this.currentUser;
-  }
-
-  /**
-   * Update user preferences
-   * @param {Object} updates - Partial preference updates
-   * @returns {Object} Updated preferences
-   */
-  updatePreferences(updates) {
-    this.preferences = { ...this.preferences, ...updates };
-
-    // Deep merge nested objects
-    if (updates.notifications) {
-      this.preferences.notifications = { ...this.preferences.notifications, ...updates.notifications };
-    }
-    if (updates.layout) {
-      this.preferences.layout = { ...this.preferences.layout, ...updates.layout };
-    }
-    if (updates.editor) {
-      this.preferences.editor = { ...this.preferences.editor, ...updates.editor };
-    }
-
-    this.persistPreferences();
-    this.notifyListeners();
-    return this.preferences;
-  }
-
-  /**
-   * Get user preferences
-   * @returns {Object} Current preferences
-   */
-  getPreferences() {
-    return { ...this.preferences };
-  }
-
-  /**
-   * Add or update integration
-   * @param {string} service - Service name (figma, jira, github, slack, storybook)
-   * @param {string} apiKey - API key or token for the service
-   * @param {Object} metadata - Additional metadata (e.g., {projectKey: 'ABC'})
-   * @returns {Object} Updated integrations
-   */
-  setIntegration(service, apiKey, metadata = {}) {
-    this.integrations[service] = {
-      enabled: !!apiKey,
-      apiKey,
-      ...metadata,
-      lastUpdated: new Date().toISOString()
-    };
-    this.persistIntegrations();
-    this.notifyListeners();
-    return this.integrations;
-  }
-
-  /**
-   * Get specific integration
-   * @param {string} service - Service name
-   * @returns {Object|null} Integration config or null
-   */
-  getIntegration(service) {
-    return this.integrations[service] || null;
-  }
-
-  /**
-   * Get all integrations
-   * @returns {Object} All integrations
-   */
-  getIntegrations() {
-    return { ...this.integrations };
-  }
-
-  /**
-   * Remove integration
-   * @param {string} service - Service name
-   * @returns {Object} Updated integrations
-   */
-  removeIntegration(service) {
-    delete this.integrations[service];
-    this.persistIntegrations();
-    this.notifyListeners();
-    return this.integrations;
-  }
-
-  /**
-   * Get user avatar (with fallback)
-   * @returns {string} Avatar URL or initials
-   */
-  getAvatar() {
-    if (!this.currentUser) return null;
-    if (this.currentUser.avatar) return this.currentUser.avatar;
-
-    // Generate initials-based avatar
-    const initials = (this.currentUser.name || this.currentUser.email)
-      .split(' ')
-      .map(n => n[0])
-      .join('')
-      .toUpperCase();
-
-    return `data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect fill='%23007acc' width='32' height='32'/%3E%3Ctext x='50%25' y='50%25' dominant-baseline='middle' text-anchor='middle' fill='white' font-size='14' font-weight='bold' font-family='sans-serif' transform='translate(0, 1)'%3E${initials}%3C/text%3E%3C/svg%3E`;
-  }
-
-  /**
-   * Get user display name
-   * @returns {string} Name or email
-   */
-  getDisplayName() {
-    if (!this.currentUser) return 'Anonymous';
-    return this.currentUser.name || this.currentUser.email;
-  }
-
-  /**
-   * Subscribe to user state changes
-   * @param {Function} callback - Called with {currentUser, preferences, integrations, isAuthenticated}
-   * @returns {Function} Unsubscribe function
-   */
-  subscribe(callback) {
-    this.listeners.add(callback);
-    return () => this.listeners.delete(callback);
-  }
-
-  /**
-   * Notify all listeners of state changes
-   */
-  notifyListeners() {
-    this.listeners.forEach(listener => listener({
-      currentUser: this.currentUser,
-      preferences: this.getPreferences(),
-      integrations: this.getIntegrations(),
-      isAuthenticated: this.isAuthenticated
-    }));
-  }
-
-  /**
-   * Reset to default state
-   */
-  reset() {
-    this.currentUser = null;
-    this.isAuthenticated = false;
-    this.preferences = this.getDefaultPreferences();
-    this.integrations = {};
-
-    localStorage.removeItem('current_user');
-    localStorage.removeItem('user_preferences');
-    localStorage.removeItem('user_integrations');
-
-    this.notifyListeners();
-  }
-}
-
-// Singleton instance
-let userStoreInstance = null;
-
-export function useUserStore() {
-  if (!userStoreInstance) {
-    userStoreInstance = new UserStore();
-  }
-  return userStoreInstance;
-}
diff --git a/admin-ui/js/templates/gallery-template.js b/admin-ui/js/templates/gallery-template.js
deleted file mode 100644
index d3ebaa7..0000000
--- a/admin-ui/js/templates/gallery-template.js
+++ /dev/null
@@ -1,320 +0,0 @@
-/**
- * gallery-template.js
- * DSS-compliant gallery template module (Strangler Fig Pattern)
- *
- * Replaces createGalleryView() from tool-templates.js with standards-compliant version:
- * - NO inline event handlers (onmouseover, onmouseout)
- * - NO inline styles (uses Shadow DOM <style> blocks)
- * - Uses data-action attributes for event delegation
- * - Returns {html, styles} structure for Shadow DOM adoption
- *
- * Reference: .knowledge/dss-coding-standards.json
- *   - WC-001: Shadow DOM Required
- *   - EVENT-001: NO Inline Events
- *   - STYLE-001: NO Inline Styles
- */
-
-import { ComponentHelpers } from '../utils/component-helpers.js';
-
-/**
- * Create a gallery view template (DSS-compliant)
- *
- * @param {Object} config - Gallery configuration
- * @param {string} config.title - Gallery title
- * @param {Array} config.items - Gallery items [{src, title, subtitle}]
- * @param {Function} [config.onItemClick] - Click handler (handled via event delegation)
- * @param {Function} [config.onDelete] - Delete handler (handled via event delegation)
- * @returns {Object} {html, styles} - Separated HTML and CSS for Shadow DOM
- */
-export function createGalleryView({ title, items = [], onItemClick = null, onDelete = null }) {
-  // Validation
-  if (!title || !Array.isArray(items)) {
-    throw new Error('createGalleryView requires title (string) and items (array)');
-  }
-
-  // Generate HTML (NO inline styles, NO inline event handlers)
-  const html = `
-    <div class="gallery-container">
-      <!-- Header -->
-      <div class="gallery-header">
-        <h2 class="gallery-title">${ComponentHelpers.escapeHtml(title)}</h2>
-        <div class="gallery-count">
-          ${items.length} ${items.length === 1 ? 'item' : 'items'}
-        </div>
-      </div>
-
-      <!-- Gallery Grid -->
-      <div class="gallery-body">
-        ${items.length === 0 ? renderEmpty(title) : renderGalleryGrid(items, onDelete)}
-      </div>
-    </div>
-  `;
-
-  // Separate styles for Shadow DOM <style> block
-  const styles = `
-    /* Gallery Container */
-    .gallery-container {
-      display: flex;
-      flex-direction: column;
-      height: 100%;
-    }
-
-    /* Header */
-    .gallery-header {
-      padding: 16px;
-      border-bottom: 1px solid var(--vscode-panel-border);
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-    }
-
-    .gallery-title {
-      font-size: 16px;
-      font-weight: 600;
-      margin: 0;
-      color: var(--vscode-foreground);
-    }
-
-    .gallery-count {
-      font-size: 11px;
-      color: var(--vscode-descriptionForeground);
-    }
-
-    /* Body */
-    .gallery-body {
-      flex: 1;
-      overflow: auto;
-      padding: 16px;
-    }
-
-    /* Grid */
-    .gallery-grid {
-      display: grid;
-      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
-      gap: 16px;
-    }
-
-    /* Gallery Item */
-    .gallery-item {
-      background: var(--vscode-sideBar-background);
-      border: 1px solid var(--vscode-panel-border);
-      border-radius: 4px;
-      overflow: hidden;
-      cursor: pointer;
-      transition: transform 0.2s ease, box-shadow 0.2s ease;
-    }
-
-    /* STYLE-003: CSS :hover instead of inline onmouseover/onmouseout */
-    .gallery-item:hover {
-      transform: translateY(-4px);
-      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
-    }
-
-    .gallery-item:active {
-      transform: translateY(-2px);
-    }
-
-    /* Image/Preview */
-    .gallery-preview {
-      aspect-ratio: 16 / 9;
-      background: var(--vscode-editor-background);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      overflow: hidden;
-    }
-
-    .gallery-preview img {
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-    }
-
-    .gallery-preview-placeholder {
-      font-size: 48px;
-    }
-
-    /* Info */
-    .gallery-info {
-      padding: 12px;
-    }
-
-    .gallery-item-title {
-      font-size: 12px;
-      font-weight: 600;
-      margin-bottom: 4px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      color: var(--vscode-foreground);
-    }
-
-    .gallery-item-subtitle {
-      font-size: 10px;
-      color: var(--vscode-descriptionForeground);
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-
-    /* Actions */
-    .gallery-actions {
-      padding: 0 12px 12px;
-    }
-
-    .gallery-delete-btn {
-      width: 100%;
-      font-size: 10px;
-      padding: 4px 8px;
-      background: var(--vscode-button-secondaryBackground);
-      color: var(--vscode-button-secondaryForeground);
-      border: 1px solid var(--vscode-button-border);
-      border-radius: 2px;
-      cursor: pointer;
-      transition: background 0.15s ease;
-    }
-
-    .gallery-delete-btn:hover {
-      background: var(--vscode-button-secondaryHoverBackground);
-    }
-
-    .gallery-delete-btn:active {
-      background: var(--vscode-button-background);
-    }
-
-    /* Empty State */
-    .gallery-empty {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      padding: 48px 16px;
-      color: var(--vscode-descriptionForeground);
-    }
-
-    .gallery-empty-icon {
-      font-size: 48px;
-      margin-bottom: 12px;
-      opacity: 0.5;
-    }
-
-    .gallery-empty-text {
-      font-size: 13px;
-      text-align: center;
-    }
-  `;
-
-  return { html, styles };
-}
-
-/**
- * Render empty state
- * @private
- */
-function renderEmpty(title) {
-  return `
-    <div class="gallery-empty">
-      <div class="gallery-empty-icon">🖼️</div>
-      <div class="gallery-empty-text">No ${title.toLowerCase()} available</div>
-    </div>
-  `;
-}
-
-/**
- * Render gallery grid
- * @private
- */
-function renderGalleryGrid(items, onDelete) {
-  return `
-    <div class="gallery-grid">
-      ${items.map((item, idx) => renderGalleryItem(item, idx, onDelete)).join('')}
-    </div>
-  `;
-}
-
-/**
- * Render individual gallery item
- * EVENT-002: Use data-action attributes for event delegation
- * @private
- */
-function renderGalleryItem(item, idx, onDelete) {
-  return `
-    <div class="gallery-item" data-action="item-click" data-item-idx="${idx}">
-      <!-- Image/Preview -->
-      <div class="gallery-preview">
-        ${item.src
-          ? `<img src="${ComponentHelpers.escapeHtml(item.src)}" alt="${ComponentHelpers.escapeHtml(item.title || 'Gallery item')}" />`
-          : '<div class="gallery-preview-placeholder">📄</div>'
-        }
-      </div>
-
-      <!-- Info -->
-      <div class="gallery-info">
-        <div class="gallery-item-title">
-          ${ComponentHelpers.escapeHtml(item.title || 'Untitled')}
-        </div>
-        ${item.subtitle ? `
-          <div class="gallery-item-subtitle">
-            ${ComponentHelpers.escapeHtml(item.subtitle)}
-          </div>
-        ` : ''}
-      </div>
-
-      <!-- Actions -->
-      ${onDelete ? `
-        <div class="gallery-actions">
-          <button
-            class="gallery-delete-btn"
-            data-action="item-delete"
-            data-item-idx="${idx}"
-            type="button"
-            aria-label="Delete ${ComponentHelpers.escapeHtml(item.title || 'item')}">
-            🗑️ Delete
-          </button>
-        </div>
-      ` : ''}
-    </div>
-  `;
-}
-
-/**
- * Setup event handlers using event delegation pattern
- * To be called by the component after rendering
- *
- * @param {ShadowRoot} shadowRoot - Component's shadow root
- * @param {Function} onItemClick - Handler for item clicks
- * @param {Function} onDelete - Handler for delete button clicks
- */
-export function setupGalleryEvents(shadowRoot, onItemClick, onDelete) {
-  const container = shadowRoot.querySelector('.gallery-container');
-  if (!container) return;
-
-  // EVENT-002: Event delegation pattern
-  container.addEventListener('click', (e) => {
-    const target = e.target.closest('[data-action]');
-    if (!target) return;
-
-    const action = target.dataset.action;
-    const idx = parseInt(target.dataset.itemIdx, 10);
-
-    switch (action) {
-      case 'item-click':
-        if (onItemClick && !isNaN(idx)) {
-          // Don't trigger if clicking delete button
-          if (!e.target.closest('[data-action="item-delete"]')) {
-            onItemClick(idx, e);
-          }
-        }
-        break;
-
-      case 'item-delete':
-        if (onDelete && !isNaN(idx)) {
-          e.stopPropagation(); // Prevent item-click from firing
-          onDelete(idx, e);
-        }
-        break;
-    }
-  });
-}
-
-export default createGalleryView;
diff --git a/admin-ui/js/templates/table-template.js b/admin-ui/js/templates/table-template.js
deleted file mode 100644
index fcd63c5..0000000
--- a/admin-ui/js/templates/table-template.js
+++ /dev/null
@@ -1,361 +0,0 @@
-/**
- * table-template.js
- * DSS-compliant table template with expandable rows
- *
- * Replaces inline event handlers and styles for table-based UIs
- * - NO inline event handlers (onmouseover, onmouseout, onclick)
- * - NO inline styles (uses Shadow DOM <style> blocks)
- * - CSS :hover for row highlighting
- * - data-action attributes for event delegation
- * - Expandable detail rows pattern
- *
- * Reference: .knowledge/dss-coding-standards.json
- */
-
-import { ComponentHelpers } from '../utils/component-helpers.js';
-
-/**
- * Create an expandable table view (DSS-compliant)
- *
- * @param {Object} config - Table configuration
- * @param {string} config.title - Table title (optional)
- * @param {Array} config.columns - Column definitions [{header, key, width, align}]
- * @param {Array} config.rows - Row data objects
- * @param {Function} config.renderCell - Custom cell renderer (column, row) => html
- * @param {Function} config.renderDetails - Detail row renderer (row) => html
- * @param {string} [config.emptyMessage] - Message when no rows
- * @param {string} [config.emptyIcon] - Icon for empty state
- * @returns {Object} {html, styles} - Separated HTML and CSS for Shadow DOM
- */
-export function createTableView(config) {
-  const {
-    title,
-    columns = [],
-    rows = [],
-    renderCell,
-    renderDetails,
-    emptyMessage = 'No data available',
-    emptyIcon = '📋'
-  } = config;
-
-  // Validation
-  if (!Array.isArray(columns) || columns.length === 0) {
-    throw new Error('createTableView requires columns array');
-  }
-  if (!Array.isArray(rows)) {
-    throw new Error('createTableView requires rows array');
-  }
-
-  // Generate HTML (NO inline styles, NO inline event handlers)
-  const html = `
-    <div class="table-container">
-      ${title ? `
-        <div class="table-header">
-          <h2 class="table-title">${ComponentHelpers.escapeHtml(title)}</h2>
-        </div>
-      ` : ''}
-
-      <div class="table-body">
-        ${rows.length === 0 ? renderEmpty(emptyMessage, emptyIcon) : renderTable(columns, rows, renderCell, renderDetails)}
-      </div>
-    </div>
-  `;
-
-  // Separate styles for Shadow DOM <style> block
-  const styles = `
-    /* Table Container */
-    .table-container {
-      display: flex;
-      flex-direction: column;
-      height: 100%;
-    }
-
-    /* Header */
-    .table-header {
-      padding: 16px;
-      border-bottom: 1px solid var(--vscode-panel-border);
-    }
-
-    .table-title {
-      font-size: 16px;
-      font-weight: 600;
-      margin: 0;
-      color: var(--vscode-foreground);
-    }
-
-    /* Body */
-    .table-body {
-      flex: 1;
-      overflow: auto;
-    }
-
-    /* Table */
-    .data-table {
-      width: 100%;
-      border-collapse: collapse;
-      background-color: var(--vscode-sideBar-background);
-    }
-
-    /* Table Header */
-    .data-table thead tr {
-      border-bottom: 2px solid var(--vscode-panel-border);
-    }
-
-    .data-table th {
-      padding: 8px 12px;
-      text-align: left;
-      font-size: 11px;
-      text-transform: uppercase;
-      letter-spacing: 0.5px;
-      color: var(--vscode-descriptionForeground);
-      font-weight: 600;
-    }
-
-    /* Table Body Rows */
-    .data-table tbody tr.table-row {
-      border-bottom: 1px solid var(--vscode-panel-border);
-      cursor: pointer;
-      transition: background-color 0.15s ease;
-    }
-
-    /* STYLE-003: CSS :hover instead of inline onmouseover/onmouseout */
-    .data-table tbody tr.table-row:hover {
-      background-color: var(--vscode-list-hoverBackground);
-    }
-
-    .data-table tbody tr.table-row:active {
-      background-color: var(--vscode-list-activeSelectionBackground);
-    }
-
-    .data-table td {
-      padding: 8px 12px;
-      font-size: 11px;
-      color: var(--vscode-foreground);
-    }
-
-    /* Detail Rows */
-    .data-table tbody tr.detail-row {
-      background-color: var(--vscode-editor-background);
-      display: none;
-    }
-
-    .data-table tbody tr.detail-row.visible {
-      display: table-row;
-    }
-
-    .detail-content {
-      padding: 16px;
-      font-size: 11px;
-    }
-
-    .detail-content > div {
-      margin-bottom: 8px;
-    }
-
-    .detail-label {
-      color: var(--vscode-descriptionForeground);
-      display: inline-block;
-      width: 100px;
-    }
-
-    .detail-value {
-      font-family: 'Courier New', monospace;
-    }
-
-    .detail-code {
-      background-color: var(--vscode-sideBar-background);
-      padding: 8px;
-      border-radius: 2px;
-      overflow-x: auto;
-      font-size: 10px;
-      font-family: 'Courier New', monospace;
-      max-height: 200px;
-      overflow-y: auto;
-    }
-
-    /* Empty State */
-    .table-empty {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      padding: 48px 16px;
-      color: var(--vscode-descriptionForeground);
-    }
-
-    .table-empty-icon {
-      font-size: 48px;
-      margin-bottom: 12px;
-      opacity: 0.5;
-    }
-
-    .table-empty-text {
-      font-size: 13px;
-      text-align: center;
-    }
-
-    /* Column Alignment */
-    .align-left { text-align: left; }
-    .align-center { text-align: center; }
-    .align-right { text-align: right; }
-
-    /* Expand/Collapse Indicator */
-    .expand-indicator {
-      display: inline-block;
-      margin-right: 8px;
-      transition: transform 0.2s ease;
-    }
-
-    .table-row.expanded .expand-indicator {
-      transform: rotate(90deg);
-    }
-  `;
-
-  return { html, styles };
-}
-
-/**
- * Render empty state
- * @private
- */
-function renderEmpty(message, icon) {
-  return `
-    <div class="table-empty">
-      <div class="table-empty-icon">${icon}</div>
-      <div class="table-empty-text">${ComponentHelpers.escapeHtml(message)}</div>
-    </div>
-  `;
-}
-
-/**
- * Render table with rows
- * @private
- */
-function renderTable(columns, rows, renderCell, renderDetails) {
-  return `
-    <table class="data-table">
-      <thead>
-        <tr>
-          ${renderDetails ? '<th style="width: 24px;"></th>' : ''}
-          ${columns.map(col => `
-            <th class="align-${col.align || 'left'}" ${col.width ? `style="width: ${col.width};"` : ''}>
-              ${ComponentHelpers.escapeHtml(col.header)}
-            </th>
-          `).join('')}
-        </tr>
-      </thead>
-      <tbody>
-        ${rows.map((row, idx) => renderRow(columns, row, idx, renderCell, renderDetails)).join('')}
-      </tbody>
-    </table>
-  `;
-}
-
-/**
- * Render individual table row with optional expandable details
- * EVENT-002: Use data-action attributes for event delegation
- * @private
- */
-function renderRow(columns, row, idx, renderCell, renderDetails) {
-  const mainRow = `
-    <tr class="table-row" data-action="row-click" data-row-idx="${idx}">
-      ${renderDetails ? `
-        <td>
-          <span class="expand-indicator">▶</span>
-        </td>
-      ` : ''}
-      ${columns.map(col => `
-        <td class="align-${col.align || 'left'}">
-          ${renderCell ? renderCell(col, row, idx) : renderDefaultCell(col, row)}
-        </td>
-      `).join('')}
-    </tr>
-  `;
-
-  const detailRow = renderDetails ? `
-    <tr class="detail-row" data-row-idx="${idx}">
-      <td colspan="${columns.length + 1}">
-        <div class="detail-content">
-          ${renderDetails(row, idx)}
-        </div>
-      </td>
-    </tr>
-  ` : '';
-
-  return mainRow + detailRow;
-}
-
-/**
- * Default cell renderer
- * @private
- */
-function renderDefaultCell(col, row) {
-  const value = row[col.key];
-
-  if (value === null || value === undefined) {
-    return '<span style="color: var(--vscode-descriptionForeground);">-</span>';
-  }
-
-  if (typeof value === 'boolean') {
-    return value ? '✓' : '✗';
-  }
-
-  return ComponentHelpers.escapeHtml(String(value));
-}
-
-/**
- * Setup event handlers for table interactions
- * To be called by the component after rendering
- *
- * @param {ShadowRoot} shadowRoot - Component's shadow root
- * @param {Function} onRowClick - Handler for row clicks (optional)
- */
-export function setupTableEvents(shadowRoot, onRowClick) {
-  const tableBody = shadowRoot.querySelector('.data-table tbody');
-  if (!tableBody) return;
-
-  // EVENT-002: Event delegation pattern
-  tableBody.addEventListener('click', (e) => {
-    const row = e.target.closest('[data-action="row-click"]');
-    if (!row) return;
-
-    const idx = parseInt(row.dataset.rowIdx, 10);
-    if (isNaN(idx)) return;
-
-    // Toggle detail row visibility
-    const detailRow = shadowRoot.querySelector(`.detail-row[data-row-idx="${idx}"]`);
-    if (detailRow) {
-      const isVisible = detailRow.classList.toggle('visible');
-      row.classList.toggle('expanded', isVisible);
-    }
-
-    // Call custom handler if provided
-    if (onRowClick) {
-      onRowClick(idx, e);
-    }
-  });
-}
-
-/**
- * Helper: Create a stats summary card for tables
- * @param {Object} stats - Stats object {label: value}
- * @returns {string} HTML string
- */
-export function createStatsCard(stats) {
-  const entries = Object.entries(stats);
-
-  return `
-    <div style="background-color: var(--vscode-sideBar-background); border: 1px solid var(--vscode-panel-border); border-radius: 4px; padding: 12px; margin-bottom: 16px;">
-      <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 12px; font-size: 11px;">
-        ${entries.map(([label, value]) => `
-          <div style="text-align: center;">
-            <div style="font-size: 20px; font-weight: 600; color: var(--vscode-foreground);">${ComponentHelpers.escapeHtml(String(value))}</div>
-            <div style="color: var(--vscode-descriptionForeground); margin-top: 2px;">${ComponentHelpers.escapeHtml(label)}</div>
-          </div>
-        `).join('')}
-      </div>
-    </div>
-  `;
-}
-
-export default createTableView;
diff --git a/admin-ui/js/utils/component-helpers.js b/admin-ui/js/utils/component-helpers.js
deleted file mode 100644
index a58499f..0000000
--- a/admin-ui/js/utils/component-helpers.js
+++ /dev/null
@@ -1,334 +0,0 @@
-/**
- * component-helpers.js
- * Shared utilities for panel components
- * Provides standardized loading, error, and empty states
- */
-
-export class ComponentHelpers {
-  /**
-   * Render a loading spinner with optional message
-   * @param {string} message - Optional loading message
-   * @returns {string} HTML string for loading state
-   */
-  static renderLoading(message = 'Loading...') {
-    return `
-      <div style="
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        padding: 32px;
-        color: var(--vscode-text-dim);
-      ">
-        <div style="
-          width: 24px;
-          height: 24px;
-          border: 3px solid var(--vscode-border);
-          border-top-color: var(--vscode-accent);
-          border-radius: 50%;
-          animation: spin 1s linear infinite;
-        "></div>
-        <div style="margin-top: 16px; font-size: 12px;">${message}</div>
-      </div>
-      <style>
-        @keyframes spin {
-          to { transform: rotate(360deg); }
-        }
-      </style>
-    `;
-  }
-
-  /**
-   * Render an error state with message
-   * @param {string} message - Error message to display
-   * @param {Error} error - Optional error object for details
-   * @returns {string} HTML string for error state
-   */
-  static renderError(message, error = null) {
-    const details = error ? `<div style="
-      margin-top: 8px;
-      padding: 8px;
-      background-color: rgba(244, 135, 113, 0.1);
-      border-radius: 2px;
-      font-family: 'Courier New', monospace;
-      font-size: 11px;
-      color: #f48771;
-    ">${error.message || error.toString()}</div>` : '';
-
-    return `
-      <div style="
-        padding: 24px;
-        text-align: center;
-        color: #f48771;
-      ">
-        <div style="font-size: 32px; margin-bottom: 12px;">⚠️</div>
-        <div style="font-size: 13px; font-weight: 500;">${message}</div>
-        ${details}
-      </div>
-    `;
-  }
-
-  /**
-   * Render an empty state with message
-   * @param {string} message - Empty state message
-   * @param {string} icon - Optional icon/emoji
-   * @returns {string} HTML string for empty state
-   */
-  static renderEmpty(message = 'No data available', icon = '📭') {
-    return `
-      <div style="
-        padding: 48px 24px;
-        text-align: center;
-        color: var(--vscode-text-dim);
-      ">
-        <div style="font-size: 48px; margin-bottom: 16px;">${icon}</div>
-        <div style="font-size: 13px;">${message}</div>
-      </div>
-    `;
-  }
-
-  /**
-   * Format timestamp for display
-   * @param {Date|string|number} date - Date to format
-   * @param {boolean} includeTime - Include time in output
-   * @returns {string} Formatted date string
-   */
-  static formatTimestamp(date, includeTime = true) {
-    if (!date) return 'N/A';
-
-    const d = date instanceof Date ? date : new Date(date);
-
-    if (isNaN(d.getTime())) return 'Invalid Date';
-
-    const dateStr = d.toLocaleDateString('en-US', {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric'
-    });
-
-    if (!includeTime) return dateStr;
-
-    const timeStr = d.toLocaleTimeString('en-US', {
-      hour: '2-digit',
-      minute: '2-digit',
-      second: '2-digit',
-      hour12: false
-    });
-
-    return `${dateStr} ${timeStr}`;
-  }
-
-  /**
-   * Format relative time (e.g., "2 minutes ago")
-   * @param {Date|string|number} date - Date to format
-   * @returns {string} Relative time string
-   */
-  static formatRelativeTime(date) {
-    if (!date) return 'N/A';
-
-    const d = date instanceof Date ? date : new Date(date);
-    if (isNaN(d.getTime())) return 'Invalid Date';
-
-    const now = new Date();
-    const diffMs = now - d;
-    const diffSec = Math.floor(diffMs / 1000);
-    const diffMin = Math.floor(diffSec / 60);
-    const diffHour = Math.floor(diffMin / 60);
-    const diffDay = Math.floor(diffHour / 24);
-
-    if (diffSec < 60) return 'just now';
-    if (diffMin < 60) return `${diffMin} minute${diffMin !== 1 ? 's' : ''} ago`;
-    if (diffHour < 24) return `${diffHour} hour${diffHour !== 1 ? 's' : ''} ago`;
-    if (diffDay < 7) return `${diffDay} day${diffDay !== 1 ? 's' : ''} ago`;
-
-    return this.formatTimestamp(d, false);
-  }
-
-  /**
-   * Truncate text to max length with ellipsis
-   * @param {string} text - Text to truncate
-   * @param {number} maxLength - Maximum length
-   * @returns {string} Truncated text
-   */
-  static truncateText(text, maxLength = 100) {
-    if (!text || text.length <= maxLength) return text;
-    return text.substring(0, maxLength - 3) + '...';
-  }
-
-  /**
-   * Escape HTML to prevent XSS
-   * @param {string} text - Text to escape
-   * @returns {string} Escaped HTML
-   */
-  static escapeHtml(text) {
-    if (!text) return '';
-    const div = document.createElement('div');
-    div.textContent = text;
-    return div.innerHTML;
-  }
-
-  /**
-   * Format file size in human-readable format
-   * @param {number} bytes - Size in bytes
-   * @returns {string} Formatted size string
-   */
-  static formatFileSize(bytes) {
-    if (bytes === 0) return '0 B';
-    if (!bytes) return 'N/A';
-
-    const k = 1024;
-    const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
-    const i = Math.floor(Math.log(bytes) / Math.log(k));
-
-    return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`;
-  }
-
-  /**
-   * Format duration in human-readable format
-   * @param {number} ms - Duration in milliseconds
-   * @returns {string} Formatted duration string
-   */
-  static formatDuration(ms) {
-    if (ms === 0) return '0ms';
-    if (!ms) return 'N/A';
-
-    if (ms < 1000) return `${Math.round(ms)}ms`;
-    if (ms < 60000) return `${(ms / 1000).toFixed(2)}s`;
-    if (ms < 3600000) return `${Math.floor(ms / 60000)}m ${Math.floor((ms % 60000) / 1000)}s`;
-
-    const hours = Math.floor(ms / 3600000);
-    const minutes = Math.floor((ms % 3600000) / 60000);
-    return `${hours}h ${minutes}m`;
-  }
-
-  /**
-   * Create a badge element
-   * @param {string} label - Badge label
-   * @param {string} type - Badge type (success, warning, error, info)
-   * @returns {string} HTML string for badge
-   */
-  static createBadge(label, type = 'info') {
-    const colors = {
-      success: '#89d185',
-      warning: '#dbb765',
-      error: '#f48771',
-      info: '#75beff'
-    };
-
-    const color = colors[type] || colors.info;
-
-    return `
-      <span style="
-        display: inline-block;
-        padding: 2px 8px;
-        background-color: rgba(${this.hexToRgb(color)}, 0.2);
-        color: ${color};
-        border-radius: 2px;
-        font-size: 11px;
-        font-weight: 500;
-        text-transform: uppercase;
-        letter-spacing: 0.5px;
-      ">${label}</span>
-    `;
-  }
-
-  /**
-   * Convert hex color to RGB values
-   * @param {string} hex - Hex color
-   * @returns {string} RGB values (e.g., "255, 0, 0")
-   */
-  static hexToRgb(hex) {
-    const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-    return result
-      ? `${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}`
-      : '128, 128, 128';
-  }
-
-  /**
-   * Debounce function execution
-   * @param {Function} func - Function to debounce
-   * @param {number} wait - Wait time in milliseconds
-   * @returns {Function} Debounced function
-   */
-  static debounce(func, wait = 300) {
-    let timeout;
-    return function executedFunction(...args) {
-      const later = () => {
-        clearTimeout(timeout);
-        func(...args);
-      };
-      clearTimeout(timeout);
-      timeout = setTimeout(later, wait);
-    };
-  }
-
-  /**
-   * Parse JSON safely with fallback
-   * @param {string} jsonString - JSON string to parse
-   * @param {*} fallback - Fallback value if parse fails
-   * @returns {*} Parsed object or fallback
-   */
-  static safeJsonParse(jsonString, fallback = null) {
-    try {
-      return JSON.parse(jsonString);
-    } catch (e) {
-      console.warn('Failed to parse JSON:', e);
-      return fallback;
-    }
-  }
-
-  /**
-   * Create a table from array of objects
-   * @param {Array<Object>} data - Array of objects
-   * @param {Array<string>} columns - Column names to display
-   * @returns {string} HTML string for table
-   */
-  static createTable(data, columns = null) {
-    if (!data || data.length === 0) {
-      return this.renderEmpty('No data to display', '📋');
-    }
-
-    const cols = columns || Object.keys(data[0]);
-
-    const headerRow = cols.map(col =>
-      `<th style="
-        padding: 8px 12px;
-        text-align: left;
-        border-bottom: 1px solid var(--vscode-border);
-        font-size: 11px;
-        text-transform: uppercase;
-        letter-spacing: 0.5px;
-        color: var(--vscode-text-dim);
-      ">${col}</th>`
-    ).join('');
-
-    const dataRows = data.map(row => `
-      <tr style="border-bottom: 1px solid var(--vscode-border);">
-        ${cols.map(col => `
-          <td style="
-            padding: 8px 12px;
-            font-size: 12px;
-            color: var(--vscode-text);
-          ">${this.escapeHtml(String(row[col] ?? ''))}</td>
-        `).join('')}
-      </tr>
-    `).join('');
-
-    return `
-      <div style="overflow-x: auto;">
-        <table style="
-          width: 100%;
-          border-collapse: collapse;
-          background-color: var(--vscode-sidebar);
-        ">
-          <thead>
-            <tr>${headerRow}</tr>
-          </thead>
-          <tbody>
-            ${dataRows}
-          </tbody>
-        </table>
-      </div>
-    `;
-  }
-}
diff --git a/admin-ui/js/utils/console-forwarder.js b/admin-ui/js/utils/console-forwarder.js
deleted file mode 100644
index 29641b1..0000000
--- a/admin-ui/js/utils/console-forwarder.js
+++ /dev/null
@@ -1,163 +0,0 @@
-/**
- * @file console-forwarder.js
- * @description Intercepts browser console logs and forwards them to the server.
- * Handles circular references, batches requests, and prevents infinite loops.
- */
-
-(function () {
-  // CONFIGURATION
-  const LOG_ENDPOINT = '/api/logs/browser';
-  const BATCH_SIZE = 50;
-  const FLUSH_INTERVAL_MS = 2000;
-  const MAX_RETRIES = 3;
-
-  // STATE
-  let logQueue = [];
-  let flushTimer = null;
-  let isSending = false;
-  let retryCount = 0;
-
-  // CIRCULAR REFERENCE SAFE SERIALIZER
-  const safeStringify = (obj) => {
-    const seen = new WeakSet();
-    return JSON.stringify(obj, (key, value) => {
-      if (typeof value === 'object' && value !== null) {
-        if (seen.has(value)) {
-          return '[Circular]';
-        }
-        seen.add(value);
-      }
-      // Handle Error objects explicitly as they don't stringify well by default
-      if (value instanceof Error) {
-        return {
-          message: value.message,
-          stack: value.stack,
-          name: value.name
-        };
-      }
-      return value;
-    });
-  };
-
-  // LOG QUEUE MANAGER
-  const flushQueue = async () => {
-    if (logQueue.length === 0 || isSending) return;
-
-    const batch = [...logQueue];
-    logQueue = []; // Clear queue immediately to prevent duplicates
-    isSending = true;
-
-    try {
-      const response = await fetch(LOG_ENDPOINT, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ logs: batch }),
-        // critical: prevent this fetch from triggering global error handlers
-        // if it fails, to avoid infinite loops
-      });
-
-      if (!response.ok) {
-        throw new Error(`Server responded with ${response.status}`);
-      }
-      retryCount = 0;
-    } catch (err) {
-      // DO NOT log errors here to prevent infinite loops
-      // If network fails, put specific logs back or drop them to prevent memory leaks
-      if (retryCount < MAX_RETRIES) {
-        retryCount++;
-        // Re-queue logs at the front
-        logQueue = [...batch, ...logQueue];
-      }
-    } finally {
-      isSending = false;
-    }
-  };
-
-  const scheduleFlush = () => {
-    if (flushTimer) return;
-    flushTimer = setTimeout(() => {
-      flushTimer = null;
-      flushQueue();
-    }, FLUSH_INTERVAL_MS);
-  };
-
-  const pushLog = (level, args) => {
-    // timestamp
-    const timestamp = new Date().toISOString();
-
-    // safe serialization of arguments
-    const serializedArgs = args.map(arg => {
-      try {
-        if (typeof arg === 'string') return arg;
-        return JSON.parse(safeStringify(arg));
-      } catch (e) {
-        return '[Unserializable]';
-      }
-    });
-
-    logQueue.push({
-      level,
-      timestamp,
-      message: serializedArgs.join(' '), // Flatten for simple viewing
-      data: serializedArgs // Keep structured for deep inspection if backend supports it
-    });
-
-    if (logQueue.length >= BATCH_SIZE) {
-      if (flushTimer) clearTimeout(flushTimer);
-      flushTimer = null;
-      flushQueue();
-    } else {
-      scheduleFlush();
-    }
-  };
-
-  // INTERCEPTORS
-  const originalConsole = {
-    log: console.log,
-    info: console.info,
-    warn: console.warn,
-    error: console.error,
-    debug: console.debug,
-  };
-
-  const methods = ['log', 'info', 'warn', 'error', 'debug'];
-
-  methods.forEach((method) => {
-    console[method] = (...args) => {
-      // 1. Call original method so developer tools still work
-      originalConsole[method].apply(console, args);
-
-      // 2. Push to queue
-      try {
-        pushLog(method, args);
-      } catch (e) {
-        // Silent fail - do not use console.error here!
-      }
-    };
-  });
-
-  // GLOBAL ERROR HANDLERS
-  window.addEventListener('error', (event) => {
-    pushLog('error', [`Uncaught Exception: ${event.message}`, event.filename, event.lineno, event.colno, event.error]);
-  });
-
-  window.addEventListener('unhandledrejection', (event) => {
-    pushLog('error', ['Unhandled Promise Rejection:', event.reason]);
-  });
-
-  // PAGE UNLOAD FLUSH
-  // Use sendBeacon for reliable "last gasp" logging
-  window.addEventListener('visibilitychange', () => {
-    if (document.visibilityState === 'hidden' && logQueue.length > 0) {
-      const batch = safeStringify({ logs: logQueue });
-      // sendBeacon is more reliable on unload than fetch
-      if (navigator.sendBeacon) {
-        const blob = new Blob([batch], { type: 'application/json' });
-        navigator.sendBeacon(LOG_ENDPOINT, blob);
-        logQueue = [];
-      }
-    }
-  });
-
-  console.info('[Console Forwarder] Initialized. Monitoring active.');
-})();
diff --git a/admin-ui/js/utils/incognito-detector.js b/admin-ui/js/utils/incognito-detector.js
deleted file mode 100644
index 2b73671..0000000
--- a/admin-ui/js/utils/incognito-detector.js
+++ /dev/null
@@ -1,118 +0,0 @@
-/**
- * incognito-detector.js
- * Detects if the browser is running in incognito/private mode
- * Uses LAZY initialization to avoid cascading failures at module load time
- */
-
-let isIncognitoResult = null;
-let storageTypeResult = null;
-
-/**
- * Detect if browser is in incognito/private mode
- * Works by trying to write to localStorage and catching the silent failure
- * Result is memoized after first call
- */
-function detectIncognito() {
-  try {
-    const testKey = '__incognito_test__';
-    const testValue = Date.now().toString();
-
-    // Try to write to localStorage
-    localStorage.setItem(testKey, testValue);
-
-    // Try to read it back
-    const retrieved = localStorage.getItem(testKey);
-
-    // Clean up
-    localStorage.removeItem(testKey);
-
-    // If we can write and read, we're not in incognito
-    isIncognitoResult = retrieved !== testValue;
-    storageTypeResult = isIncognitoResult ? 'sessionStorage' : 'localStorage';
-
-    if (isIncognitoResult) {
-      console.log('[IncognitoDetector] Incognito mode detected - using sessionStorage');
-    }
-    return isIncognitoResult;
-
-  } catch (e) {
-    // If localStorage access throws an error, we're definitely in incognito
-    console.warn('[IncognitoDetector] Storage access failed, assuming incognito mode:', e);
-    isIncognitoResult = true;
-    storageTypeResult = 'sessionStorage';
-    return true;
-  }
-}
-
-/**
- * Get the appropriate storage object for this browser context
- * Triggers incognito detection if not yet done
- */
-export function getStorage() {
-  if (isIncognitoResult === null) {
-    detectIncognito();
-  }
-  return isIncognitoResult ? sessionStorage : localStorage;
-}
-
-/**
- * Check if we're in incognito mode
- * Triggers detection if not yet done
- */
-export function checkIncognito() {
-  if (isIncognitoResult === null) {
-    detectIncognito();
-  }
-  return isIncognitoResult;
-}
-
-/**
- * Set an item in the appropriate storage
- */
-export function setItem(key, value) {
-  try {
-    getStorage().setItem(key, value);
-    return true;
-  } catch (e) {
-    console.error('[IncognitoDetector] Failed to store item:', key, e);
-    return false;
-  }
-}
-
-/**
- * Get an item from the appropriate storage
- */
-export function getItem(key) {
-  try {
-    return getStorage().getItem(key);
-  } catch (e) {
-    console.error('[IncognitoDetector] Failed to retrieve item:', key, e);
-    return null;
-  }
-}
-
-/**
- * Remove an item from the appropriate storage
- */
-export function removeItem(key) {
-  try {
-    getStorage().removeItem(key);
-    return true;
-  } catch (e) {
-    console.error('[IncognitoDetector] Failed to remove item:', key, e);
-    return false;
-  }
-}
-
-/**
- * Clear all items from the appropriate storage
- */
-export function clear() {
-  try {
-    getStorage().clear();
-    return true;
-  } catch (e) {
-    console.error('[IncognitoDetector] Failed to clear storage:', e);
-    return false;
-  }
-}
diff --git a/admin-ui/js/utils/logger.js b/admin-ui/js/utils/logger.js
deleted file mode 100644
index d7bef61..0000000
--- a/admin-ui/js/utils/logger.js
+++ /dev/null
@@ -1,134 +0,0 @@
-/**
- * logger.js
- * Centralized logging utility for DSS
- * Replaces direct console.log usage for structured, environment-aware logging
- */
-
-// Determine if we're in development mode
-const isDevelopment = () => {
-  // Check various indicators of development environment
-  return (
-    window.location.hostname === 'localhost' ||
-    window.location.hostname === '127.0.0.1' ||
-    window.location.port === '3456' || // DSS development port
-    window.location.search.includes('debug=true')
-  );
-};
-
-// Check if debug mode is enabled
-const isDebugEnabled = () => {
-  return isDevelopment() || localStorage.getItem('dss_debug') === 'true';
-};
-
-/**
- * Format log message with timestamp and component context
- * @param {string} level - Log level (DEBUG, INFO, WARN, ERROR)
- * @param {string} message - Log message
- * @param {...any} args - Additional arguments
- * @returns {Array} Formatted arguments for console methods
- */
-function formatLog(level, message, ...args) {
-  const timestamp = new Date().toISOString().split('T')[1].slice(0, -1); // HH:MM:SS.mmm
-  const prefix = `[${timestamp}] [${level}]`;
-
-  return [prefix, message, ...args];
-}
-
-/**
- * Logger object with structured logging methods
- */
-export const logger = {
-  /**
-   * Debug logging - only shown in development or when debug flag enabled
-   * Use for detailed diagnostic information
-   * @param {string} message - Log message
-   * @param {...any} args - Additional data to log
-   */
-  debug(message, ...args) {
-    if (isDebugEnabled()) {
-      console.log(...formatLog('DEBUG', message, ...args));
-    }
-  },
-
-  /**
-   * Info logging - informational messages about normal operations
-   * @param {string} message - Log message
-   * @param {...any} args - Additional data to log
-   */
-  info(message, ...args) {
-    console.info(...formatLog('INFO', message, ...args));
-  },
-
-  /**
-   * Warning logging - potentially harmful situations
-   * @param {string} message - Log message
-   * @param {...any} args - Additional data to log
-   */
-  warn(message, ...args) {
-    console.warn(...formatLog('WARN', message, ...args));
-  },
-
-  /**
-   * Error logging - error events that might still allow the application to continue
-   * @param {string} message - Log message
-   * @param {...any} args - Additional data to log (typically Error objects)
-   */
-  error(message, ...args) {
-    console.error(...formatLog('ERROR', message, ...args));
-  },
-
-  /**
-   * Performance timing helper
-   * Returns a function that logs elapsed time when called
-   * @param {string} label - Label for the timing measurement
-   * @returns {Function} Function to call when operation completes
-   *
-   * @example
-   * const endTimer = logger.time('Data load');
-   * await loadData();
-   * endTimer(); // Logs: [TIME] Data load: 234ms
-   */
-  time(label) {
-    const start = performance.now();
-    return () => {
-      if (isDebugEnabled()) {
-        const elapsed = (performance.now() - start).toFixed(2);
-        console.log(...formatLog('TIME', `${label}: ${elapsed}ms`));
-      }
-    };
-  },
-
-  /**
-   * Enable debug mode (persists in localStorage)
-   */
-  enableDebug() {
-    localStorage.setItem('dss_debug', 'true');
-    this.info('Debug mode enabled');
-  },
-
-  /**
-   * Disable debug mode
-   */
-  disableDebug() {
-    localStorage.removeItem('dss_debug');
-    this.info('Debug mode disabled');
-  },
-
-  /**
-   * Check if debug mode is enabled
-   * @returns {boolean}
-   */
-  isDebugEnabled() {
-    return isDebugEnabled();
-  }
-};
-
-// Export as default for convenience
-export default logger;
-
-// Make logger available globally for console debugging
-if (isDevelopment()) {
-  window.dssLogger = logger;
-  logger.debug('[Logger] Logger utility initialized. Access via window.dssLogger');
-  logger.debug('[Logger] Enable debug: logger.enableDebug() | Disable: logger.disableDebug()');
-}
diff --git a/admin-ui/js/utils/tool-templates.js b/admin-ui/js/utils/tool-templates.js
deleted file mode 100644
index e78e65d..0000000
--- a/admin-ui/js/utils/tool-templates.js
+++ /dev/null
@@ -1,546 +0,0 @@
-/**
- * tool-templates.js
- * Reusable template functions for building team-specific tool components
- * Follows DRY principles to avoid code duplication across 14 team tools
- */
-
-import { ComponentHelpers } from './component-helpers.js';
-import toolBridge from '../services/tool-bridge.js';
-
-/**
- * Create a side-by-side comparison view
- * Used for: Storybook/Figma, Storybook/Live, Figma/Live comparisons
- *
- * @param {Object} config
- * @param {string} config.leftTitle - Title for left panel
- * @param {string} config.rightTitle - Title for right panel
- * @param {string} config.leftSrc - URL or content for left panel
- * @param {string} config.rightSrc - URL or content for right panel
- * @param {Function} config.onSync - Optional sync scroll callback
- * @returns {string} HTML template
- */
-export function createComparisonView(config) {
-  const {
-    leftTitle = 'Left',
-    rightTitle = 'Right',
-    leftSrc = '',
-    rightSrc = '',
-    onSync = null
-  } = config;
-
-  return `
-    <div style="display: flex; flex-direction: column; height: 100%;">
-      <!-- Toolbar -->
-      <div style="padding: 12px 16px; border-bottom: 1px solid var(--vscode-border); display: flex; justify-content: space-between; align-items: center;">
-        <div style="display: flex; gap: 12px; align-items: center;">
-          <button id="sync-scroll-btn" class="button" style="font-size: 11px; padding: 4px 12px;">
-            🔗 Sync Scroll
-          </button>
-          <button id="reset-zoom-btn" class="button" style="font-size: 11px; padding: 4px 12px;">
-            🔍 Reset Zoom
-          </button>
-        </div>
-        <div style="font-size: 11px; color: var(--vscode-text-dim);">
-          Use mouse wheel to zoom, drag to pan
-        </div>
-      </div>
-
-      <!-- Comparison Panels -->
-      <div style="flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--vscode-border); overflow: hidden;">
-        <!-- Left Panel -->
-        <div style="background: var(--vscode-bg); display: flex; flex-direction: column;">
-          <div style="padding: 8px 12px; background: var(--vscode-sidebar); border-bottom: 1px solid var(--vscode-border); font-size: 12px; font-weight: 600;">
-            ${ComponentHelpers.escapeHtml(leftTitle)}
-          </div>
-          <div id="left-panel-content" style="flex: 1; overflow: auto; position: relative;">
-            ${leftSrc ? `<iframe src="${ComponentHelpers.escapeHtml(leftSrc)}" style="width: 100%; height: 100%; border: none;"></iframe>` : ComponentHelpers.renderEmpty('Select content to display', '📄')}
-          </div>
-        </div>
-
-        <!-- Right Panel -->
-        <div style="background: var(--vscode-bg); display: flex; flex-direction: column;">
-          <div style="padding: 8px 12px; background: var(--vscode-sidebar); border-bottom: 1px solid var(--vscode-border); font-size: 12px; font-weight: 600;">
-            ${ComponentHelpers.escapeHtml(rightTitle)}
-          </div>
-          <div id="right-panel-content" style="flex: 1; overflow: auto; position: relative;">
-            ${rightSrc ? `<iframe src="${ComponentHelpers.escapeHtml(rightSrc)}" style="width: 100%; height: 100%; border: none;"></iframe>` : ComponentHelpers.renderEmpty('Select content to display', '📄')}
-          </div>
-        </div>
-      </div>
-    </div>
-  `;
-}
-
-/**
- * Create a list view with search, filter, and actions
- * Used for: Token list, Asset list, Component list
- *
- * @param {Object} config
- * @param {string} config.title - List title
- * @param {Array} config.items - Array of items to display
- * @param {Array} config.columns - Column definitions [{ key, label, render }]
- * @param {Array} config.actions - Action buttons [{ label, icon, onClick }]
- * @param {Function} config.onSearch - Search callback
- * @param {Function} config.onFilter - Filter callback
- * @returns {string} HTML template
- */
-export function createListView(config) {
-  const {
-    title = 'Items',
-    items = [],
-    columns = [],
-    actions = [],
-    onSearch = null,
-    onFilter = null
-  } = config;
-
-  return `
-    <div style="display: flex; flex-direction: column; height: 100%;">
-      <!-- Header -->
-      <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border);">
-        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
-          <h2 style="font-size: 16px; font-weight: 600;">${ComponentHelpers.escapeHtml(title)}</h2>
-          <div style="display: flex; gap: 8px;">
-            ${actions.map((action, idx) => `
-              <button class="action-btn button" data-action-idx="${idx}" style="font-size: 11px; padding: 4px 12px;">
-                ${action.icon || ''} ${ComponentHelpers.escapeHtml(action.label)}
-              </button>
-            `).join('')}
-          </div>
-        </div>
-
-        <!-- Search Bar -->
-        <div style="display: flex; gap: 8px;">
-          <input
-            type="text"
-            id="search-input"
-            placeholder="Search..."
-            class="input"
-            style="flex: 1; font-size: 12px;"
-          />
-          <select id="filter-select" class="input" style="font-size: 12px; width: 150px;">
-            <option value="">All Types</option>
-          </select>
-        </div>
-      </div>
-
-      <!-- Table -->
-      <div style="flex: 1; overflow: auto;">
-        ${items.length === 0 ? ComponentHelpers.renderEmpty(`No ${title.toLowerCase()} found`, '📦') : `
-          <table style="width: 100%; border-collapse: collapse; font-size: 12px;">
-            <thead style="position: sticky; top: 0; background: var(--vscode-sidebar); z-index: 1;">
-              <tr>
-                ${columns.map(col => `
-                  <th style="padding: 8px 12px; text-align: left; border-bottom: 1px solid var(--vscode-border); font-weight: 600;">
-                    ${ComponentHelpers.escapeHtml(col.label)}
-                  </th>
-                `).join('')}
-              </tr>
-            </thead>
-            <tbody>
-              ${items.map((item, itemIdx) => `
-                <tr style="border-bottom: 1px solid var(--vscode-border);" onmouseover="this.style.background='var(--vscode-list-hoverBackground)'" onmouseout="this.style.background='transparent'">
-                  ${columns.map(col => `
-                    <td style="padding: 8px 12px;">
-                      ${col.render ? col.render(item) : ComponentHelpers.escapeHtml(String(item[col.key] || ''))}
-                    </td>
-                  `).join('')}
-                </tr>
-              `).join('')}
-            </tbody>
-          </table>
-        `}
-      </div>
-
-      <!-- Footer -->
-      <div style="padding: 12px 16px; border-top: 1px solid var(--vscode-border); font-size: 11px; color: var(--vscode-text-dim);">
-        Showing ${items.length} ${title.toLowerCase()}
-      </div>
-    </div>
-  `;
-}
-
-/**
- * Create an editor view with save/export functionality
- * Used for: ESRE editor, configuration editors
- *
- * @param {Object} config
- * @param {string} config.title - Editor title
- * @param {string} config.content - Initial content
- * @param {string} config.language - Syntax highlighting language (text, json, yaml, etc.)
- * @param {Function} config.onSave - Save callback
- * @param {Function} config.onExport - Export callback
- * @returns {string} HTML template
- */
-export function createEditorView(config) {
-  const {
-    title = 'Editor',
-    content = '',
-    language = 'text',
-    onSave = null,
-    onExport = null
-  } = config;
-
-  return `
-    <div style="display: flex; flex-direction: column; height: 100%;">
-      <!-- Header -->
-      <div style="padding: 12px 16px; border-bottom: 1px solid var(--vscode-border); display: flex; justify-content: space-between; align-items: center;">
-        <h2 style="font-size: 14px; font-weight: 600;">${ComponentHelpers.escapeHtml(title)}</h2>
-        <div style="display: flex; gap: 8px;">
-          <button id="editor-save-btn" class="button" style="font-size: 11px; padding: 4px 12px;">
-            💾 Save
-          </button>
-          <button id="editor-export-btn" class="button" style="font-size: 11px; padding: 4px 12px;">
-            📥 Export
-          </button>
-          <button id="editor-clear-btn" class="button" style="font-size: 11px; padding: 4px 12px;">
-            🗑️ Clear
-          </button>
-        </div>
-      </div>
-
-      <!-- Editor -->
-      <div style="flex: 1; overflow: hidden; position: relative;">
-        <textarea
-          id="editor-content"
-          class="input"
-          style="width: 100%; height: 100%; resize: none; font-family: 'Courier New', monospace; font-size: 12px; padding: 16px; border: none;"
-          placeholder="Enter content here..."
-        >${ComponentHelpers.escapeHtml(content)}</textarea>
-      </div>
-
-      <!-- Footer Stats -->
-      <div style="padding: 8px 16px; border-top: 1px solid var(--vscode-border); display: flex; justify-content: space-between; font-size: 10px; color: var(--vscode-text-dim);">
-        <span id="editor-stats">0 lines, 0 characters</span>
-        <span>Language: ${language}</span>
-      </div>
-    </div>
-  `;
-}
-
-/**
- * Create a gallery/grid view for visual content
- * Used for: Screenshot gallery, navigation demos
- *
- * @param {Object} config
- * @param {string} config.title - Gallery title
- * @param {Array} config.items - Array of items with { id, src, title, subtitle }
- * @param {Function} config.onItemClick - Item click callback
- * @param {Function} config.onDelete - Delete callback
- * @returns {string} HTML template
- */
-export function createGalleryView(config) {
-  const {
-    title = 'Gallery',
-    items = [],
-    onItemClick = null,
-    onDelete = null
-  } = config;
-
-  return `
-    <div style="display: flex; flex-direction: column; height: 100%;">
-      <!-- Header -->
-      <div style="padding: 16px; border-bottom: 1px solid var(--vscode-border);">
-        <div style="display: flex; justify-content: space-between; align-items: center;">
-          <h2 style="font-size: 16px; font-weight: 600;">${ComponentHelpers.escapeHtml(title)}</h2>
-          <div style="font-size: 11px; color: var(--vscode-text-dim);">
-            ${items.length} ${items.length === 1 ? 'item' : 'items'}
-          </div>
-        </div>
-      </div>
-
-      <!-- Gallery Grid -->
-      <div style="flex: 1; overflow: auto; padding: 16px;">
-        ${items.length === 0 ? ComponentHelpers.renderEmpty(`No ${title.toLowerCase()} available`, '🖼️') : `
-          <div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px;">
-            ${items.map((item, idx) => `
-              <div class="gallery-item" data-item-idx="${idx}" style="
-                background: var(--vscode-sidebar);
-                border: 1px solid var(--vscode-border);
-                border-radius: 4px;
-                overflow: hidden;
-                cursor: pointer;
-                transition: transform 0.2s, box-shadow 0.2s;
-              " onmouseover="this.style.transform='translateY(-4px)'; this.style.boxShadow='0 4px 12px rgba(0,0,0,0.3)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='none'">
-                <!-- Image/Preview -->
-                <div style="aspect-ratio: 16/9; background: var(--vscode-bg); display: flex; align-items: center; justify-content: center; overflow: hidden;">
-                  ${item.src ? `<img src="${ComponentHelpers.escapeHtml(item.src)}" style="width: 100%; height: 100%; object-fit: cover;" />` : '<div style="font-size: 48px;">📄</div>'}
-                </div>
-
-                <!-- Info -->
-                <div style="padding: 12px;">
-                  <div style="font-size: 12px; font-weight: 600; margin-bottom: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
-                    ${ComponentHelpers.escapeHtml(item.title || 'Untitled')}
-                  </div>
-                  ${item.subtitle ? `<div style="font-size: 10px; color: var(--vscode-text-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">${ComponentHelpers.escapeHtml(item.subtitle)}</div>` : ''}
-                </div>
-
-                <!-- Actions -->
-                ${onDelete ? `
-                  <div style="padding: 0 12px 12px;">
-                    <button class="gallery-delete-btn button" data-item-idx="${idx}" style="width: 100%; font-size: 10px; padding: 4px;">
-                      🗑️ Delete
-                    </button>
-                  </div>
-                ` : ''}
-              </div>
-            `).join('')}
-          </div>
-        `}
-      </div>
-    </div>
-  `;
-}
-
-/**
- * Create a form view with validation
- * Used for: Project analysis configuration, quick wins settings
- *
- * @param {Object} config
- * @param {string} config.title - Form title
- * @param {Array} config.fields - Field definitions [{ name, label, type, placeholder, required }]
- * @param {Function} config.onSubmit - Submit callback
- * @returns {string} HTML template
- */
-export function createFormView(config) {
-  const {
-    title = 'Configuration',
-    fields = [],
-    onSubmit = null
-  } = config;
-
-  return `
-    <div style="padding: 24px; max-width: 600px; margin: 0 auto;">
-      <h2 style="font-size: 16px; font-weight: 600; margin-bottom: 24px;">${ComponentHelpers.escapeHtml(title)}</h2>
-
-      <form id="config-form" style="display: flex; flex-direction: column; gap: 16px;">
-        ${fields.map(field => `
-          <div>
-            <label style="display: block; font-size: 12px; font-weight: 600; margin-bottom: 6px;">
-              ${ComponentHelpers.escapeHtml(field.label)}
-              ${field.required ? '<span style="color: #f48771;">*</span>' : ''}
-            </label>
-            ${field.type === 'textarea' ? `
-              <textarea
-                name="${field.name}"
-                class="input"
-                placeholder="${ComponentHelpers.escapeHtml(field.placeholder || '')}"
-                style="width: 100%; min-height: 80px; font-size: 12px;"
-                ${field.required ? 'required' : ''}
-              ></textarea>
-            ` : field.type === 'select' ? `
-              <select
-                name="${field.name}"
-                class="input"
-                style="width: 100%; font-size: 12px;"
-                ${field.required ? 'required' : ''}
-              >
-                <option value="">Select...</option>
-                ${(field.options || []).map(opt => `
-                  <option value="${ComponentHelpers.escapeHtml(opt.value)}">${ComponentHelpers.escapeHtml(opt.label)}</option>
-                `).join('')}
-              </select>
-            ` : `
-              <input
-                type="${field.type || 'text'}"
-                name="${field.name}"
-                class="input"
-                placeholder="${ComponentHelpers.escapeHtml(field.placeholder || '')}"
-                style="width: 100%; font-size: 12px;"
-                ${field.required ? 'required' : ''}
-              />
-            `}
-            ${field.description ? `<div style="font-size: 10px; color: var(--vscode-text-dim); margin-top: 4px;">${ComponentHelpers.escapeHtml(field.description)}</div>` : ''}
-          </div>
-        `).join('')}
-
-        <div style="display: flex; gap: 12px; justify-content: flex-end; margin-top: 12px;">
-          <button type="button" id="form-cancel-btn" class="button" style="font-size: 12px;">
-            Cancel
-          </button>
-          <button type="submit" class="button" style="font-size: 12px;">
-            Submit
-          </button>
-        </div>
-      </form>
-    </div>
-  `;
-}
-
-/**
- * Setup event handlers for comparison view
- */
-export function setupComparisonHandlers(container, config) {
-  const syncBtn = container.querySelector('#sync-scroll-btn');
-  const resetBtn = container.querySelector('#reset-zoom-btn');
-  const leftPanel = container.querySelector('#left-panel-content');
-  const rightPanel = container.querySelector('#right-panel-content');
-
-  let syncEnabled = false;
-
-  if (syncBtn && leftPanel && rightPanel) {
-    syncBtn.addEventListener('click', () => {
-      syncEnabled = !syncEnabled;
-      syncBtn.textContent = syncEnabled ? '🔗 Synced' : '🔗 Sync Scroll';
-
-      if (syncEnabled) {
-        leftPanel.addEventListener('scroll', syncScroll);
-        rightPanel.addEventListener('scroll', syncScroll);
-      } else {
-        leftPanel.removeEventListener('scroll', syncScroll);
-        rightPanel.removeEventListener('scroll', syncScroll);
-      }
-    });
-
-    function syncScroll(e) {
-      if (!syncEnabled) return;
-      const source = e.target;
-      const target = source === leftPanel ? rightPanel : leftPanel;
-      target.scrollTop = source.scrollTop;
-      target.scrollLeft = source.scrollLeft;
-    }
-  }
-
-  if (resetBtn) {
-    resetBtn.addEventListener('click', () => {
-      const iframes = container.querySelectorAll('iframe');
-      iframes.forEach(iframe => {
-        iframe.style.transform = 'scale(1)';
-      });
-    });
-  }
-}
-
-/**
- * Setup event handlers for list view
- */
-export function setupListHandlers(container, config) {
-  const searchInput = container.querySelector('#search-input');
-  const filterSelect = container.querySelector('#filter-select');
-  const actionBtns = container.querySelectorAll('.action-btn');
-
-  if (searchInput && config.onSearch) {
-    searchInput.addEventListener('input', (e) => {
-      config.onSearch(e.target.value);
-    });
-  }
-
-  if (filterSelect && config.onFilter) {
-    filterSelect.addEventListener('change', (e) => {
-      config.onFilter(e.target.value);
-    });
-  }
-
-  if (actionBtns && config.actions) {
-    actionBtns.forEach(btn => {
-      btn.addEventListener('click', () => {
-        const idx = parseInt(btn.dataset.actionIdx);
-        if (config.actions[idx] && config.actions[idx].onClick) {
-          config.actions[idx].onClick();
-        }
-      });
-    });
-  }
-}
-
-/**
- * Setup event handlers for editor view
- */
-export function setupEditorHandlers(container, config) {
-  const saveBtn = container.querySelector('#editor-save-btn');
-  const exportBtn = container.querySelector('#editor-export-btn');
-  const clearBtn = container.querySelector('#editor-clear-btn');
-  const textarea = container.querySelector('#editor-content');
-  const stats = container.querySelector('#editor-stats');
-
-  function updateStats() {
-    if (textarea && stats) {
-      const lines = textarea.value.split('\n').length;
-      const chars = textarea.value.length;
-      stats.textContent = `${lines} lines, ${chars} characters`;
-    }
-  }
-
-  if (textarea) {
-    textarea.addEventListener('input', updateStats);
-    updateStats();
-  }
-
-  if (saveBtn && config.onSave) {
-    saveBtn.addEventListener('click', () => {
-      config.onSave(textarea.value);
-    });
-  }
-
-  if (exportBtn && config.onExport) {
-    exportBtn.addEventListener('click', () => {
-      config.onExport(textarea.value);
-    });
-  }
-
-  if (clearBtn && textarea) {
-    clearBtn.addEventListener('click', () => {
-      if (confirm('Clear all content?')) {
-        textarea.value = '';
-        updateStats();
-      }
-    });
-  }
-}
-
-/**
- * Setup event handlers for gallery view
- */
-export function setupGalleryHandlers(container, config) {
-  const items = container.querySelectorAll('.gallery-item');
-  const deleteBtns = container.querySelectorAll('.gallery-delete-btn');
-
-  if (items && config.onItemClick) {
-    items.forEach(item => {
-      item.addEventListener('click', (e) => {
-        // Don't trigger if delete button was clicked
-        if (e.target.classList.contains('gallery-delete-btn')) return;
-
-        const idx = parseInt(item.dataset.itemIdx);
-        config.onItemClick(config.items[idx], idx);
-      });
-    });
-  }
-
-  if (deleteBtns && config.onDelete) {
-    deleteBtns.forEach(btn => {
-      btn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        const idx = parseInt(btn.dataset.itemIdx);
-        if (confirm('Delete this item?')) {
-          config.onDelete(config.items[idx], idx);
-        }
-      });
-    });
-  }
-}
-
-/**
- * Setup event handlers for form view
- */
-export function setupFormHandlers(container, config) {
-  const form = container.querySelector('#config-form');
-  const cancelBtn = container.querySelector('#form-cancel-btn');
-
-  if (form && config.onSubmit) {
-    form.addEventListener('submit', (e) => {
-      e.preventDefault();
-
-      const formData = new FormData(form);
-      const data = Object.fromEntries(formData.entries());
-
-      config.onSubmit(data);
-    });
-  }
-
-  if (cancelBtn) {
-    cancelBtn.addEventListener('click', () => {
-      form.reset();
-    });
-  }
-}
diff --git a/admin-ui/js/utils/url-builder.js b/admin-ui/js/utils/url-builder.js
deleted file mode 100644
index 96143e5..0000000
--- a/admin-ui/js/utils/url-builder.js
+++ /dev/null
@@ -1,101 +0,0 @@
-/**
- * url-builder.js
- * Utility for building URLs based on admin settings and project context
- * Handles dynamic Storybook URL generation with hostname, port, skin
- */
-
-import { useAdminStore } from '../stores/admin-store.js';
-import { useProjectStore } from '../stores/project-store.js';
-
-class URLBuilder {
-  /**
-   * Get Storybook URL for current context
-   * @param {Object} options - Options for URL generation
-   * @param {string} options.skin - Skin/theme name (optional, uses project default)
-   * @param {string} options.projectId - Project ID (optional, uses current project)
-   * @returns {string} Full Storybook URL
-   */
-  static getStorybookUrl(options = {}) {
-    const adminStore = useAdminStore();
-    const projectStore = useProjectStore();
-
-    const skin = options.skin || projectStore.getCurrentProject()?.skinSelected || 'default';
-    const projectId = options.projectId || projectStore.currentProjectId;
-
-    const protocol = adminStore.state.isRemote ? 'https' : 'http';
-    const hostname = adminStore.state.hostname;
-    const port = adminStore.state.port;
-
-    const baseUrl = `${protocol}://${hostname}:${port}/storybook/`;
-    const params = new URLSearchParams();
-
-    if (skin) params.append('skin', skin);
-    if (projectId) params.append('project', projectId);
-
-    const queryString = params.toString();
-    return queryString ? `${baseUrl}?${queryString}` : baseUrl;
-  }
-
-  /**
-   * Get API base URL for backend
-   * @returns {string} API base URL
-   */
-  static getAPIBaseUrl() {
-    const adminStore = useAdminStore();
-    const protocol = adminStore.state.isRemote ? 'https' : 'http';
-    const hostname = adminStore.state.hostname;
-
-    return `${protocol}://${hostname}:3456/api`;
-  }
-
-  /**
-   * Get Jira API URL (depends on backend for authentication)
-   * @returns {string} Jira API endpoint URL
-   */
-  static getJiraApiUrl() {
-    const baseUrl = this.getAPIBaseUrl();
-    return `${baseUrl}/integrations/jira`;
-  }
-
-  /**
-   * Get Figma API URL (depends on backend for authentication)
-   * @returns {string} Figma API endpoint URL
-   */
-  static getFigmaApiUrl() {
-    const baseUrl = this.getAPIBaseUrl();
-    return `${baseUrl}/integrations/figma`;
-  }
-
-  /**
-   * Get MCP bridge URL for tool execution
-   * @returns {string} MCP bridge endpoint URL
-   */
-  static getMCPBridgeUrl() {
-    const baseUrl = this.getAPIBaseUrl();
-    return `${baseUrl}/mcp-bridge`;
-  }
-
-  /**
-   * Build a link to a component in Storybook
-   * @param {Object} component - Component info
-   * @param {string} component.id - Component ID
-   * @param {string} component.name - Component name
-   * @returns {string} Link to Storybook component
-   */
-  static getComponentUrl(component) {
-    const baseUrl = this.getStorybookUrl();
-    const componentPath = `${component.id}--${component.name}`.toLowerCase().replace(/\s+/g, '-');
-    return `${baseUrl}?path=/story/${componentPath}`;
-  }
-
-  /**
-   * Build a link to theme/skin preview
-   * @param {string} skin - Skin name
-   * @returns {string} Link to Storybook with selected skin
-   */
-  static getSkinPreviewUrl(skin) {
-    return this.getStorybookUrl({ skin });
-  }
-}
-
-export default URLBuilder;
diff --git a/admin-ui/js/workdesks/admin-workdesk.js b/admin-ui/js/workdesks/admin-workdesk.js
deleted file mode 100644
index b19c99d..0000000
--- a/admin-ui/js/workdesks/admin-workdesk.js
+++ /dev/null
@@ -1,133 +0,0 @@
-/**
- * admin-workdesk.js
- * Admin Team workdesk - System settings and project management
- */
-
-import BaseWorkdesk from './base-workdesk.js';
-import '../components/admin/ds-admin-settings.js';
-import '../components/admin/ds-project-list.js';
-
-export default class AdminWorkdesk extends BaseWorkdesk {
-  constructor(shell) {
-    super(shell);
-    this.teamId = 'admin';
-    this.teamName = 'Admin';
-    this.tools = [
-      {
-        id: 'settings',
-        name: 'System Settings',
-        description: 'Configure DSS hostname, port, and setup type',
-        component: 'ds-admin-settings'
-      },
-      {
-        id: 'projects',
-        name: 'Projects',
-        description: 'Create and manage design system projects',
-        component: 'ds-project-list'
-      }
-    ];
-    this.currentTab = 'settings';
-  }
-
-  /**
-   * Admin sidebar shows tab navigation for Settings and Projects
-   */
-  renderSidebar() {
-    const sidebar = this.shell.sidebarContent;
-    if (!sidebar) return;
-
-    sidebar.innerHTML = `
-      <div style="padding: 12px; display: flex; flex-direction: column; gap: 8px;">
-        ${this.tools.map(tool => `
-          <button class="tab-btn" data-tab="${tool.id}" style="
-            padding: 8px 12px;
-            border: 1px solid ${this.currentTab === tool.id ? 'var(--vscode-focusBorder)' : 'var(--vscode-border)'};
-            background: ${this.currentTab === tool.id ? 'var(--vscode-selection)' : 'var(--vscode-sidebar)'};
-            color: var(--vscode-foreground);
-            border-radius: 4px;
-            cursor: pointer;
-            font-weight: ${this.currentTab === tool.id ? '600' : '500'};
-            text-align: left;
-            transition: all 0.2s;
-          " title="${tool.description}">
-            ${tool.name}
-          </button>
-        `).join('')}
-      </div>
-    `;
-
-    // Setup tab click handlers
-    sidebar.querySelectorAll('.tab-btn').forEach(btn => {
-      btn.addEventListener('click', () => {
-        const tabId = btn.dataset.tab;
-        this.switchTab(tabId);
-      });
-    });
-  }
-
-  /**
-   * Admin stage shows tab content - either Settings or Projects
-   */
-  renderStage() {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    stage.innerHTML = `
-      <div style="height: 100%; overflow-y: auto;">
-        ${this.renderTabContent()}
-      </div>
-    `;
-
-    // Trigger connectedCallback on custom elements
-    this.hydrateComponents();
-  }
-
-  /**
-   * Render content based on current tab
-   */
-  renderTabContent() {
-    switch (this.currentTab) {
-      case 'settings':
-        return '<ds-admin-settings></ds-admin-settings>';
-      case 'projects':
-        return '<ds-project-list></ds-project-list>';
-      default:
-        return '<ds-admin-settings></ds-admin-settings>';
-    }
-  }
-
-  /**
-   * Switch to a different tab and re-render
-   */
-  switchTab(tabId) {
-    this.currentTab = tabId;
-    this.renderSidebar();
-    this.renderStage();
-  }
-
-  /**
-   * Hydrate custom elements after rendering
-   */
-  hydrateComponents() {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    // Find and trigger connectedCallback on custom elements
-    stage.querySelectorAll('ds-admin-settings, ds-project-list').forEach(el => {
-      // Web components auto-trigger connectedCallback when inserted into DOM
-      // No manual trigger needed
-    });
-  }
-
-  /**
-   * Admin panel shows minimal system log
-   */
-  renderPanel() {
-    const panel = this.shell.querySelector('ds-panel');
-    if (panel) {
-      // Configure panel with admin config
-      panel.configure('admin', false);
-    }
-  }
-
-}
diff --git a/admin-ui/js/workdesks/base-workdesk.js b/admin-ui/js/workdesks/base-workdesk.js
deleted file mode 100644
index 6bc50fe..0000000
--- a/admin-ui/js/workdesks/base-workdesk.js
+++ /dev/null
@@ -1,210 +0,0 @@
-/**
- * base-workdesk.js
- * Abstract base class for all team workdesks
- * Refactored: A11y improvements, extracted styles, event delegation
- */
-
-import '../components/tools/ds-metrics-panel.js';
-
-export default class BaseWorkdesk {
-  constructor(shell) {
-    if (new.target === BaseWorkdesk) {
-      throw new Error('Cannot instantiate abstract class BaseWorkdesk');
-    }
-
-    this.shell = shell;
-    this.teamId = '';
-    this.teamName = '';
-    this.tools = [];
-  }
-
-  /**
-   * Render the workdesk - must be implemented by subclasses
-   */
-  render() {
-    this.renderSidebar();
-    this.renderStage();
-    this.renderPanel();
-  }
-
-  /**
-   * Render sidebar content
-   * Improved: Uses semantic <button> elements, injected styles, and keyboard support
-   */
-  renderSidebar() {
-    const sidebar = this.shell.sidebarContent;
-    if (!sidebar) return;
-
-    // We define styles here to keep BaseWorkdesk self-contained without external CSS dependencies
-    const css = `
-      .workdesk-sidebar-container {
-        padding: 16px;
-      }
-      .workdesk-header {
-        color: var(--vscode-descriptionForeground);
-        margin-bottom: 12px;
-        font-size: 11px;
-        text-transform: uppercase;
-        letter-spacing: 0.5px;
-        font-weight: 600;
-      }
-      .tools-list {
-        display: flex;
-        flex-direction: column;
-        gap: 8px;
-      }
-      .tool-btn {
-        appearance: none;
-        background: transparent;
-        border: 1px solid transparent;
-        border-radius: 4px;
-        padding: 8px;
-        width: 100%;
-        text-align: left;
-        cursor: pointer;
-        color: var(--vscode-foreground);
-        transition: background-color 0.1s, border-color 0.1s;
-      }
-      .tool-btn:hover {
-        background-color: var(--vscode-list-hoverBackground);
-      }
-      .tool-btn:focus-visible {
-        outline: 2px solid var(--vscode-focusBorder);
-        outline-offset: -2px;
-        background-color: var(--vscode-list-activeSelectionBackground);
-        color: var(--vscode-list-activeSelectionForeground);
-      }
-      .tool-name {
-        font-size: 13px;
-        margin-bottom: 2px;
-        font-weight: 500;
-      }
-      .tool-desc {
-        font-size: 11px;
-        color: var(--vscode-descriptionForeground);
-      }
-      /* A11y focus support for description inside button */
-      .tool-btn:focus-visible .tool-desc {
-        color: var(--vscode-list-activeSelectionForeground);
-        opacity: 0.9;
-      }
-    `;
-
-    sidebar.innerHTML = `
-      <style>${css}</style>
-      <div class="workdesk-sidebar-container">
-        <div class="workdesk-header" id="tools-heading">
-          ${this.teamName} Tools
-        </div>
-        <div class="tools-list" role="group" aria-labelledby="tools-heading">
-          ${this.tools.map(tool => `
-            <button class="tool-btn" data-tool="${tool.id}" type="button">
-              <div class="tool-name">${tool.name}</div>
-              <div class="tool-desc">${tool.description}</div>
-            </button>
-          `).join('')}
-        </div>
-      </div>
-    `;
-
-    // Event delegation for better performance and lifecycle management
-    const toolsList = sidebar.querySelector('.tools-list');
-    if (toolsList) {
-      toolsList.addEventListener('click', (e) => {
-        const btn = e.target.closest('.tool-btn');
-        if (btn) {
-          this.onToolClick(btn.dataset.tool);
-        }
-      });
-    }
-  }
-
-  /**
-   * Render stage content - must be implemented by subclasses
-   */
-  renderStage() {
-    throw new Error('renderStage() must be implemented by subclass');
-  }
-
-  /**
-   * Render panel content - DEPRECATED
-   * Panel is now configured by ds-shell.js via panel.configure() during team switch
-   * Subclasses should not override this method
-   */
-  renderPanel() {
-    // Panel configuration is now handled by ds-shell.js
-    // This method is kept for backwards compatibility but does nothing
-    console.log(`[${this.teamId}] Panel configured by shell via panel-config.js`);
-  }
-
-  /**
-   * Handle tool click - can be overridden by subclasses
-   */
-  onToolClick(toolId) {
-    console.log(`Tool clicked: ${toolId}`);
-    const tool = this.tools.find(t => t.id === toolId);
-    if (tool) {
-      this.loadTool(tool);
-    }
-  }
-
-  /**
-   * Load a tool into the stage - can be overridden by subclasses
-   * Improved: Loading spinner using CSS instead of Emoji
-   */
-  loadTool(tool) {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    // Use a clean CSS spinner with codicon if available
-    stage.innerHTML = `
-      <div style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: 48px;">
-        <div class="codicon codicon-loading codicon-modifier-spin" style="font-size: 24px; margin-bottom: 12px;"></div>
-        <div style="font-size: 12px; color: var(--vscode-descriptionForeground);">Loading ${tool.name}...</div>
-      </div>
-    `;
-  }
-
-  /**
-   * Clean up workdesk - can be overridden by subclasses
-   */
-  destroy() {
-    if (this.shell.sidebarContent) {
-      this.shell.sidebarContent.innerHTML = '';
-    }
-    if (this.shell.stageContent) {
-      this.shell.stageContent.innerHTML = '';
-    }
-  }
-
-  /**
-   * Utility: Create a card element
-   * NOTE: Deprecated - use ds-metric-card web component instead
-   */
-  createCard(title, content) {
-    return `
-      <div style="
-        background-color: var(--vscode-sidebar);
-        border: 1px solid var(--vscode-border);
-        border-radius: 4px;
-        padding: 16px;
-      ">
-        <h3 style="margin-bottom: 12px; font-size: 14px;">${title}</h3>
-        <div style="font-size: 12px; color: var(--vscode-text-dim);">
-          ${content}
-        </div>
-      </div>
-    `;
-  }
-
-  /**
-   * Utility: Create a button
-   */
-  createButton(label, onClick) {
-    const button = document.createElement('button');
-    button.className = 'button';
-    button.textContent = label;
-    button.addEventListener('click', onClick);
-    return button;
-  }
-}
diff --git a/admin-ui/js/workdesks/qa-workdesk.js b/admin-ui/js/workdesks/qa-workdesk.js
deleted file mode 100644
index b65d559..0000000
--- a/admin-ui/js/workdesks/qa-workdesk.js
+++ /dev/null
@@ -1,175 +0,0 @@
-/**
- * qa-workdesk.js
- * QA Team workdesk - Console logs, network monitoring, DOM inspection
- * MVP2: Added metrics frontpage as default view
- */
-
-import BaseWorkdesk from './base-workdesk.js';
-import { hydrateComponent } from '../config/component-registry.js';
-import '../components/tools/ds-console-viewer.js';
-
-export default class QAWorkdesk extends BaseWorkdesk {
-  constructor(shell) {
-    super(shell);
-    this.teamId = 'qa';
-    this.teamName = 'QA Team';
-    this.tools = [
-      {
-        id: 'frontpage',
-        name: 'Dashboard',
-        description: 'Team metrics and quick actions',
-        component: 'ds-frontpage'
-      },
-      {
-        id: 'figma-live-compare',
-        name: 'Figma vs Live',
-        description: 'QA validation: Figma design vs live implementation',
-        component: 'ds-figma-live-compare'
-      },
-      {
-        id: 'esre-editor',
-        name: 'ESRE Editor',
-        description: 'Edit Explicit Style Requirements and Expectations',
-        component: 'ds-esre-editor'
-      },
-      {
-        id: 'console-viewer',
-        name: 'Console Viewer',
-        description: 'Monitor browser console logs',
-        mcpTool: 'browser_get_logs'
-      },
-      {
-        id: 'network-monitor',
-        name: 'Network Monitor',
-        description: 'Track network requests',
-        mcpTool: 'devtools_network_requests'
-      },
-      {
-        id: 'error-tracker',
-        name: 'Error Tracker',
-        description: 'Track uncaught exceptions',
-        mcpTool: 'browser_get_errors'
-      }
-    ];
-    this.currentTool = 'frontpage';
-  }
-
-  async loadTool(tool) {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    // For tools with components, load them dynamically
-    if (tool.component) {
-      // Show loading state
-      stage.innerHTML = `
-        <div style="display: flex; align-items: center; justify-content: center; height: 100%; padding: 48px;">
-          <div style="text-align: center;">
-            <div style="font-size: 24px; margin-bottom: 12px;">⏳</div>
-            <div style="font-size: 12px; color: var(--vscode-text-dim);">Loading ${tool.name}...</div>
-          </div>
-        </div>
-      `;
-
-      try {
-        // Clear the stage and hydrate the component
-        stage.innerHTML = '';
-        await hydrateComponent(tool.component, stage);
-        console.log(`[QAWorkdesk] Loaded component: ${tool.component}`);
-      } catch (error) {
-        console.error(`[QAWorkdesk] Failed to load tool ${tool.component}:`, error);
-        stage.innerHTML = `
-          <div style="padding: 24px;">
-            <h2 style="margin-bottom: 16px; color: var(--vscode-error);">Error Loading Tool</h2>
-            <p style="color: var(--vscode-text-dim);">${error.message}</p>
-          </div>
-        `;
-      }
-    } else {
-      // Fall back to base implementation for MCP tools
-      super.loadTool(tool);
-    }
-  }
-
-  renderStage() {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    stage.innerHTML = `
-      <div style="padding: 24px;">
-        <h1 style="margin-bottom: 8px; font-size: 24px;">QA Team Workdesk</h1>
-        <p style="color: var(--vscode-text-dim); margin-bottom: 32px;">
-          QA validation, testing, and debugging tools
-        </p>
-
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px;">
-          ${this.createCard('QA Validation', `
-            <p>Compare and validate implementations:</p>
-            <ul style="margin-top: 8px; padding-left: 20px;">
-              <li>Figma vs Live comparison</li>
-              <li>Screenshot capture</li>
-              <li>Visual validation</li>
-              <li>Style requirements (ESRE)</li>
-            </ul>
-          `)}
-
-          ${this.createCard('Console Monitoring', `
-            <p>Real-time console log streaming:</p>
-            <ul style="margin-top: 8px; padding-left: 20px;">
-              <li>Log, warn, error levels</li>
-              <li>Stack trace analysis</li>
-              <li>Filter by severity</li>
-              <li>Export logs</li>
-            </ul>
-          `)}
-
-          ${this.createCard('Network Debugging', `
-            <p>Track all HTTP requests:</p>
-            <ul style="margin-top: 8px; padding-left: 20px;">
-              <li>Request/response headers</li>
-              <li>Payload inspection</li>
-              <li>Timing analysis</li>
-              <li>Failed requests</li>
-            </ul>
-          `)}
-        </div>
-
-        <div style="margin-top: 32px;">
-          <h2 style="margin-bottom: 16px; font-size: 16px;">Quick Actions</h2>
-          <div style="display: flex; gap: 12px; flex-wrap: wrap;">
-            <button class="button" id="compare-btn">Figma vs Live</button>
-            <button class="button" id="esre-btn">Edit ESRE</button>
-            <button class="button" id="console-btn">Open Console</button>
-            <button class="button" id="network-btn">Network Monitor</button>
-          </div>
-        </div>
-      </div>
-    `;
-
-    // Setup button handlers
-    stage.querySelector('#compare-btn')?.addEventListener('click', () => {
-      this.onToolClick('figma-live-compare');
-    });
-
-    stage.querySelector('#esre-btn')?.addEventListener('click', () => {
-      this.onToolClick('esre-editor');
-    });
-
-    stage.querySelector('#console-btn')?.addEventListener('click', () => {
-      this.onToolClick('console-viewer');
-      // Switch panel to console tab (component is already configured via panel-config.js)
-      const panel = this.shell.querySelector('ds-panel');
-      if (panel) {
-        panel.switchTab('console');
-      }
-    });
-
-    stage.querySelector('#network-btn')?.addEventListener('click', () => {
-      this.onToolClick('network-monitor');
-      // Switch panel to network tab (component is already configured via panel-config.js)
-      const panel = this.shell.querySelector('ds-panel');
-      if (panel) {
-        panel.switchTab('network');
-      }
-    });
-  }
-}
diff --git a/admin-ui/js/workdesks/ui-workdesk.js b/admin-ui/js/workdesks/ui-workdesk.js
deleted file mode 100644
index 1f4956b..0000000
--- a/admin-ui/js/workdesks/ui-workdesk.js
+++ /dev/null
@@ -1,115 +0,0 @@
-/**
- * ui-workdesk.js
- * UI Team workdesk - Token management, Figma sync, code generation
- * Refactored: Simplified renderStage to act as controller delegation
- */
-
-import BaseWorkdesk from './base-workdesk.js';
-import { hydrateComponent } from '../config/component-registry.js';
-
-export default class UIWorkdesk extends BaseWorkdesk {
-  constructor(shell) {
-    super(shell);
-    this.teamId = 'ui';
-    this.teamName = 'UI Team';
-    this.tools = [
-      {
-        id: 'frontpage',
-        name: 'Dashboard',
-        description: 'Team metrics and quick actions',
-        component: 'ds-frontpage'
-      },
-      {
-        id: 'storybook-figma-compare',
-        name: 'Storybook vs Figma',
-        description: 'Compare Storybook and Figma side by side',
-        component: 'ds-storybook-figma-compare'
-      },
-      {
-        id: 'storybook-live-compare',
-        name: 'Storybook vs Live',
-        description: 'Compare Storybook and live app for drift detection',
-        component: 'ds-storybook-live-compare'
-      },
-      {
-        id: 'figma-extraction',
-        name: 'Figma Token Extraction',
-        description: 'Extract design tokens from Figma',
-        component: 'ds-figma-extraction'
-      },
-      {
-        id: 'project-analysis',
-        name: 'Project Analysis',
-        description: 'Analyze design system adoption',
-        component: 'ds-project-analysis'
-      },
-      {
-        id: 'quick-wins',
-        name: 'Quick Wins',
-        description: 'Find low-effort improvements',
-        component: 'ds-quick-wins'
-      },
-      {
-        id: 'regression-testing',
-        name: 'Regression Testing',
-        description: 'Visual regression testing',
-        component: 'ds-regression-testing'
-      }
-    ];
-    this.currentTool = 'frontpage';
-  }
-
-  async loadTool(tool) {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    // Show loading state with codicon spinner
-    stage.innerHTML = `
-      <div style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%;">
-        <div class="codicon codicon-loading codicon-modifier-spin" style="font-size: 24px; margin-bottom: 12px;"></div>
-        <div style="color: var(--vscode-descriptionForeground);">Loading ${tool.name}...</div>
-      </div>
-    `;
-
-    try {
-      stage.innerHTML = '';
-      await hydrateComponent(tool.component, stage);
-      console.log(`[UIWorkdesk] Loaded component: ${tool.component}`);
-
-      // Update internal state tracking
-      this.currentTool = tool.id;
-    } catch (error) {
-      console.error(`[UIWorkdesk] Failed to load tool ${tool.component}:`, error);
-      stage.innerHTML = `
-        <div style="padding: 24px; max-width: 600px; margin: 0 auto;">
-          <h2 style="margin-bottom: 16px; color: var(--vscode-errorForeground);">Error Loading Tool</h2>
-          <p style="color: var(--vscode-descriptionForeground); margin-bottom: 16px;">${error.message}</p>
-          <button id="retry-btn" class="button" type="button"
-            style="padding: 8px 16px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); border: none; border-radius: 4px; cursor: pointer;">
-            Retry
-          </button>
-        </div>
-      `;
-
-      // Add event listener without inline handler
-      const retryBtn = stage.querySelector('#retry-btn');
-      if (retryBtn) {
-        retryBtn.addEventListener('click', () => location.reload());
-      }
-    }
-  }
-
-  /**
-   * Render stage content
-   * REFACTORED: Now strictly delegates to the default tool (Dashboard)
-   * instead of maintaining a hardcoded duplicate view.
-   */
-  renderStage() {
-    const defaultTool = this.tools.find(t => t.id === this.currentTool || t.id === 'frontpage');
-    if (defaultTool) {
-      this.loadTool(defaultTool);
-    } else {
-      console.error('Default tool "frontpage" not found in configuration');
-    }
-  }
-}
diff --git a/admin-ui/js/workdesks/ux-workdesk.js b/admin-ui/js/workdesks/ux-workdesk.js
deleted file mode 100644
index d393902..0000000
--- a/admin-ui/js/workdesks/ux-workdesk.js
+++ /dev/null
@@ -1,158 +0,0 @@
-/**
- * ux-workdesk.js
- * UX Team workdesk - Visual diff, accessibility audits, component gallery
- * MVP2: Added metrics frontpage as default view
- */
-
-import BaseWorkdesk from './base-workdesk.js';
-import { hydrateComponent } from '../config/component-registry.js';
-
-export default class UXWorkdesk extends BaseWorkdesk {
-  constructor(shell) {
-    super(shell);
-    this.teamId = 'ux';
-    this.teamName = 'UX Team';
-    this.tools = [
-      {
-        id: 'frontpage',
-        name: 'Dashboard',
-        description: 'Team metrics and quick actions',
-        component: 'ds-frontpage'
-      },
-      {
-        id: 'figma-plugin',
-        name: 'Figma Plugin',
-        description: 'Export tokens/assets/components from Figma',
-        component: 'ds-figma-plugin'
-      },
-      {
-        id: 'token-list',
-        name: 'Token List',
-        description: 'View all design tokens',
-        component: 'ds-token-list'
-      },
-      {
-        id: 'asset-list',
-        name: 'Asset List',
-        description: 'Gallery of design assets',
-        component: 'ds-asset-list'
-      },
-      {
-        id: 'component-list',
-        name: 'Component List',
-        description: 'Design system components',
-        component: 'ds-component-list'
-      },
-      {
-        id: 'navigation-demos',
-        name: 'Navigation Demos',
-        description: 'Generate navigation flow demos',
-        component: 'ds-navigation-demos'
-      }
-    ];
-    this.currentTool = 'frontpage';
-  }
-
-  async loadTool(tool) {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    // Show loading state
-    stage.innerHTML = `
-      <div style="display: flex; align-items: center; justify-content: center; height: 100%; padding: 48px;">
-        <div style="text-align: center;">
-          <div style="font-size: 24px; margin-bottom: 12px;">⏳</div>
-          <div style="font-size: 12px; color: var(--vscode-text-dim);">Loading ${tool.name}...</div>
-        </div>
-      </div>
-    `;
-
-    try {
-      // Clear the stage and hydrate the component
-      stage.innerHTML = '';
-      await hydrateComponent(tool.component, stage);
-      console.log(`[UXWorkdesk] Loaded component: ${tool.component}`);
-    } catch (error) {
-      console.error(`[UXWorkdesk] Failed to load tool ${tool.component}:`, error);
-      stage.innerHTML = `
-        <div style="padding: 24px;">
-          <h2 style="margin-bottom: 16px; color: var(--vscode-error);">Error Loading Tool</h2>
-          <p style="color: var(--vscode-text-dim);">${error.message}</p>
-        </div>
-      `;
-    }
-  }
-
-  renderStage() {
-    const stage = this.shell.stageContent;
-    if (!stage) return;
-
-    stage.innerHTML = `
-      <div style="padding: 24px;">
-        <h1 style="margin-bottom: 8px; font-size: 24px;">UX Team Workdesk</h1>
-        <p style="color: var(--vscode-text-dim); margin-bottom: 32px;">
-          Design system assets, tokens, and component management
-        </p>
-
-        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px;">
-          ${this.createCard('Figma Integration', `
-            <p>Export from Figma:</p>
-            <ul style="margin-top: 8px; padding-left: 20px;">
-              <li>Design tokens</li>
-              <li>Asset export</li>
-              <li>Component definitions</li>
-              <li>Multiple format support</li>
-            </ul>
-          `)}
-
-          ${this.createCard('Asset Management', `
-            <p>Manage design assets:</p>
-            <ul style="margin-top: 8px; padding-left: 20px;">
-              <li>Token library</li>
-              <li>Asset gallery</li>
-              <li>Component catalog</li>
-              <li>Visual preview</li>
-            </ul>
-          `)}
-
-          ${this.createCard('Navigation', `
-            <p>Navigation flow demos:</p>
-            <ul style="margin-top: 8px; padding-left: 20px;">
-              <li>Generate flow demos</li>
-              <li>Interactive HTML</li>
-              <li>Flow library</li>
-              <li>Quick preview</li>
-            </ul>
-          `)}
-        </div>
-
-        <div style="margin-top: 32px;">
-          <h2 style="margin-bottom: 16px; font-size: 16px;">Quick Actions</h2>
-          <div style="display: flex; gap: 12px; flex-wrap: wrap;">
-            <button class="button" id="figma-btn">Figma Export</button>
-            <button class="button" id="tokens-btn">View Tokens</button>
-            <button class="button" id="assets-btn">Asset Gallery</button>
-            <button class="button" id="components-btn">Components</button>
-          </div>
-        </div>
-      </div>
-    `;
-
-    // Setup button handlers
-    stage.querySelector('#figma-btn')?.addEventListener('click', () => {
-      this.onToolClick('figma-plugin');
-    });
-
-    stage.querySelector('#tokens-btn')?.addEventListener('click', () => {
-      this.onToolClick('token-list');
-    });
-
-    stage.querySelector('#assets-btn')?.addEventListener('click', () => {
-      this.onToolClick('asset-list');
-    });
-
-    stage.querySelector('#components-btn')?.addEventListener('click', () => {
-      this.onToolClick('component-list');
-    });
-  }
-}
diff --git a/admin-ui/js/workflows/onboarding-workflow.js b/admin-ui/js/workflows/onboarding-workflow.js
deleted file mode 100644
index 11cc892..0000000
--- a/admin-ui/js/workflows/onboarding-workflow.js
+++ /dev/null
@@ -1,155 +0,0 @@
-/**
- * @fileoverview Manages the user onboarding workflow, guiding them through
- * the initial setup of a design system project.
- */
-import contextStore from '../stores/context-store.js';
-import notificationService from '../services/notification-service.js';
-
-const WORKFLOW_STEPS = [
-  {
-    id: 'create-project',
-    title: 'Create a New Project',
-    description: 'Projects are containers for your design system, linking your Figma files to your codebase.',
-    action: { label: 'Go to Projects', event: 'onboarding:create-project' },
-  },
-  {
-    id: 'configure-figma',
-    title: 'Connect Figma File',
-    description: 'Add your Figma file key to allow DSS to access your design tokens and components.',
-    dependsOn: ['create-project'],
-    action: { label: 'Configure Figma', event: 'onboarding:configure-figma' },
-  },
-  {
-    id: 'extract-tokens',
-    title: 'Extract Design Tokens',
-    description: 'Scan your Figma file for variables and styles to generate design tokens.',
-    dependsOn: ['configure-figma'],
-    action: { label: 'Extract Tokens', event: 'onboarding:extract-tokens' },
-  },
-  {
-    id: 'review-tokens',
-    title: 'Review & Customize Tokens',
-    description: 'Check the extracted tokens for accuracy before syncing them to your codebase.',
-    dependsOn: ['extract-tokens'],
-    optional: true,
-    action: { label: 'Review Tokens', event: 'onboarding:review-tokens' },
-  },
-  {
-    id: 'generate-components',
-    title: 'Generate Components',
-    description: 'Use the AI agent to generate initial component code from your design system.',
-    dependsOn: ['extract-tokens'],
-    action: { label: 'Go to Components', event: 'onboarding:generate-components' },
-  },
-  {
-    id: 'setup-storybook',
-    title: 'Set Up Storybook',
-    description: 'View your generated components in an isolated Storybook environment.',
-    dependsOn: ['generate-components'],
-    optional: true,
-    action: { label: 'Open Storybook', event: 'onboarding:setup-storybook' },
-  },
-];
-
-/**
- * Initializes the onboarding workflow component with steps and event handlers.
- * @param {HTMLElement} workflowElement - The <ds-workflow> custom element.
- * @returns {Object} Object with destroy method for cleanup
- */
-export function initOnboardingWorkflow(workflowElement) {
-  if (!workflowElement || workflowElement.tagName !== 'DS-WORKFLOW') {
-    console.error('Onboarding workflow requires a valid <ds-workflow> element.');
-    return { destroy: () => {} };
-  }
-
-  workflowElement.steps = WORKFLOW_STEPS;
-  workflowElement.setAttribute('workflow-id', 'onboarding');
-
-  const handleAction = async (e) => {
-    const { stepId } = e.detail;
-    const project = contextStore.get('project');
-
-    switch (e.type) {
-      case 'onboarding:create-project':
-        window.location.hash = 'projects';
-        notificationService.create({
-          title: 'Navigate to Projects',
-          message: 'Create a new project from the projects page to continue.',
-          type: 'info',
-          source: 'Onboarding'
-        });
-        break;
-
-      case 'onboarding:configure-figma':
-        if (!project) {
-          notificationService.create({
-            title: 'No Project Selected',
-            message: 'Please create and select a project first.',
-            type: 'warning',
-            source: 'Onboarding'
-          });
-          return;
-        }
-        window.location.hash = 'figma';
-        workflowElement.updateStepStatus(stepId, 'completed');
-        break;
-
-      case 'onboarding:extract-tokens':
-        window.location.hash = 'tokens';
-        notificationService.create({
-          title: 'Token Extraction',
-          message: 'Use the Extract from Figma button to pull your design tokens.',
-          type: 'info',
-          source: 'Onboarding'
-        });
-        break;
-
-      case 'onboarding:review-tokens':
-        window.location.hash = 'tokens';
-        workflowElement.updateStepStatus(stepId, 'completed');
-        break;
-
-      case 'onboarding:generate-components':
-        window.location.hash = 'components';
-        workflowElement.updateStepStatus(stepId, 'completed');
-        break;
-
-      case 'onboarding:setup-storybook':
-        const storybookLink = document.getElementById('storybook-link');
-        if (storybookLink) {
-          window.open(storybookLink.href, '_blank');
-        }
-        workflowElement.updateStepStatus(stepId, 'completed');
-        break;
-    }
-  };
-
-  // Register event handlers
-  WORKFLOW_STEPS.forEach(step => {
-    if (step.action) {
-      workflowElement.addEventListener(step.action.event, handleAction);
-    }
-  });
-
-  // Listen for project changes to auto-complete first step
-  const unsubscribe = contextStore.subscribeToKey('project', (newProject) => {
-    if (newProject && workflowElement.steps[0].status !== 'completed') {
-      workflowElement.updateStepStatus('create-project', 'completed');
-    }
-  });
-
-  // Return cleanup function
-  return {
-    destroy: () => {
-      WORKFLOW_STEPS.forEach(step => {
-        if (step.action) {
-          workflowElement.removeEventListener(step.action.event, handleAction);
-        }
-      });
-      unsubscribe();
-    }
-  };
-}
-
-export { WORKFLOW_STEPS };
-export default { initOnboardingWorkflow, WORKFLOW_STEPS };
diff --git a/admin-ui/package.json b/admin-ui/package.json
index 1044bcf..a5ecc20 100644
--- a/admin-ui/package.json
+++ b/admin-ui/package.json
@@ -11,7 +11,10 @@
     "test": "vitest",
     "test:watch": "vitest --watch",
     "test:ui": "vitest --ui",
-    "test:coverage": "vitest --coverage"
+    "test:coverage": "vitest --coverage",
+    "test:debug": "vitest --inspect-brk --inspect-port=9229 --no-coverage",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
   },
   "dependencies": {
     "preact": "^10.19.0",
@@ -25,6 +28,15 @@
     "vite": "^5.0.0",
     "vite-plugin-pwa": "^0.17.0",
     "vitest": "^1.0.0",
-    "workbox-window": "^7.0.0"
+    "workbox-window": "^7.0.0",
+    "storybook": "^10.1.6",
+    "@storybook/html-vite": "^10.1.6",
+    "@chromatic-com/storybook": "^4.1.3",
+    "@storybook/addon-vitest": "^10.1.6",
+    "@storybook/addon-a11y": "^10.1.6",
+    "@storybook/addon-docs": "^10.1.6",
+    "playwright": "^1.57.0",
+    "@vitest/browser": "^1.0.0",
+    "@vitest/coverage-v8": "^1.0.0"
   }
 }
diff --git a/admin-ui/src/components/ds-button.js b/admin-ui/src/components/ds-button.js
deleted file mode 100644
index 61d1f7a..0000000
--- a/admin-ui/src/components/ds-button.js
+++ /dev/null
@@ -1,198 +0,0 @@
-/**
- * DS Button - Web Component
- *
- * Usage:
- *   <ds-button variant="primary" size="default">Click me</ds-button>
- *   <ds-button variant="outline" disabled>Disabled</ds-button>
- *   <ds-button variant="ghost" size="icon"><svg>...</svg></ds-button>
- *
- * Attributes:
- *   - variant: primary | secondary | outline | ghost | destructive | success | link
- *   - size: sm | default | lg | icon | icon-sm | icon-lg
- *   - disabled: boolean
- *   - loading: boolean
- *   - type: button | submit | reset
- */
-
-class DsButton extends HTMLElement {
-  static get observedAttributes() {
-    return ['variant', 'size', 'disabled', 'loading', 'type', 'tabindex', 'aria-label', 'aria-expanded', 'aria-pressed'];
-  }
-
-  constructor() {
-    super();
-    this.attachShadow({ mode: 'open' });
-  }
-
-  connectedCallback() {
-    this.render();
-    this.setupEventListeners();
-  }
-
-  disconnectedCallback() {
-    this.cleanupEventListeners();
-  }
-
-  attributeChangedCallback() {
-    if (this.shadowRoot.innerHTML) {
-      this.render();
-    }
-  }
-
-  get variant() {
-    return this.getAttribute('variant') || 'primary';
-  }
-
-  get size() {
-    return this.getAttribute('size') || 'default';
-  }
-
-  get disabled() {
-    return this.hasAttribute('disabled');
-  }
-
-  get loading() {
-    return this.hasAttribute('loading');
-  }
-
-  get type() {
-    return this.getAttribute('type') || 'button';
-  }
-
-  setupEventListeners() {
-    const button = this.shadowRoot.querySelector('button');
-
-    // Store handler references for cleanup
-    this.clickHandler = (e) => {
-      if (this.disabled || this.loading) {
-        e.preventDefault();
-        e.stopPropagation();
-        return;
-      }
-      this.dispatchEvent(new CustomEvent('ds-click', {
-        bubbles: true,
-        composed: true,
-        detail: { originalEvent: e }
-      }));
-    };
-
-    this.keydownHandler = (e) => {
-      // Enter or Space to activate button
-      if ((e.key === 'Enter' || e.key === ' ') && !this.disabled && !this.loading) {
-        e.preventDefault();
-        button.click();
-      }
-    };
-
-    this.focusHandler = (e) => {
-      // Delegate focus to internal button
-      if (e.target === this && !this.disabled) {
-        button.focus();
-      }
-    };
-
-    button.addEventListener('click', this.clickHandler);
-    this.addEventListener('keydown', this.keydownHandler);
-    this.addEventListener('focus', this.focusHandler);
-  }
-
-  cleanupEventListeners() {
-    const button = this.shadowRoot?.querySelector('button');
-    if (button && this.clickHandler) {
-      button.removeEventListener('click', this.clickHandler);
-      delete this.clickHandler;
-    }
-    if (this.keydownHandler) {
-      this.removeEventListener('keydown', this.keydownHandler);
-      delete this.keydownHandler;
-    }
-    if (this.focusHandler) {
-      this.removeEventListener('focus', this.focusHandler);
-      delete this.focusHandler;
-    }
-  }
-
-  getVariantClass() {
-    const variants = {
-      primary: 'ds-btn--primary',
-      secondary: 'ds-btn--secondary',
-      outline: 'ds-btn--outline',
-      ghost: 'ds-btn--ghost',
-      destructive: 'ds-btn--destructive',
-      success: 'ds-btn--success',
-      link: 'ds-btn--link'
-    };
-    return variants[this.variant] || variants.primary;
-  }
-
-  getSizeClass() {
-    const sizes = {
-      sm: 'ds-btn--sm',
-      default: '',
-      lg: 'ds-btn--lg',
-      icon: 'ds-btn--icon',
-      'icon-sm': 'ds-btn--icon-sm',
-      'icon-lg': 'ds-btn--icon-lg'
-    };
-    return sizes[this.size] || '';
-  }
-
-  render() {
-    const variantClass = this.getVariantClass();
-    const sizeClass = this.getSizeClass();
-    const disabledAttr = this.disabled || this.loading ? 'disabled' : '';
-    const tabindex = this.disabled ? '-1' : (this.getAttribute('tabindex') || '0');
-
-    // ARIA attributes delegation
-    const ariaLabel = this.getAttribute('aria-label') ? `aria-label="${this.getAttribute('aria-label')}"` : '';
-    const ariaExpanded = this.getAttribute('aria-expanded') ? `aria-expanded="${this.getAttribute('aria-expanded')}"` : '';
-    const ariaPressed = this.getAttribute('aria-pressed') ? `aria-pressed="${this.getAttribute('aria-pressed')}"` : '';
-    const ariaAttrs = `${ariaLabel} ${ariaExpanded} ${ariaPressed}`.trim();
-
-    this.shadowRoot.innerHTML = `
-      <style>
-
-        :host {
-          display: inline-block;
-        }
-
-        button {
-          width: 100%;
-        }
-
-        button:focus-visible {
-          outline: 2px solid var(--primary);
-          outline-offset: 2px;
-        }
-
-        .loading-spinner {
-          display: inline-block;
-          width: 1rem;
-          height: 1rem;
-          border: 2px solid currentColor;
-          border-top-color: transparent;
-          border-radius: 50%;
-          animation: spin 0.75s linear infinite;
-        }
-
-        @keyframes spin {
-          to { transform: rotate(360deg); }
-        }
-      </style>
-      <button
-        class="ds-btn ${variantClass} ${sizeClass}"
-        type="${this.type}"
-        tabindex="${tabindex}"
-        ${disabledAttr}
-        ${ariaAttrs}
-      >
-        ${this.loading ? '<span class="loading-spinner"></span>' : ''}
-        <slot></slot>
-      </button>
-    `;
-  }
-}
-
-customElements.define('ds-button', DsButton);
-
-export default DsButton;
diff --git a/admin-ui/src/stories/ColorPrimitives.stories.js b/admin-ui/src/stories/ColorPrimitives.stories.js
new file mode 100644
index 0000000..1303896
--- /dev/null
+++ b/admin-ui/src/stories/ColorPrimitives.stories.js
@@ -0,0 +1,884 @@
+/**
+ * Color Primitives - Foundation
+ * Full Tailwind color palette organized by category
+ * @generated 2025-12-10T21:48:22.317702
+ */
+export default {
+  title: 'Foundation/Colors/Primitives',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Core color primitives from Tailwind palette. Organized into Base, Neutral, and Semantic scales.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .color-container { font-family: system-ui, sans-serif; }
+  .color-section { margin-bottom: 3rem; }
+  .color-section h2 { font-size: 1.25rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; margin-bottom: 1rem; }
+  .swatch-row { display: flex; flex-wrap: wrap; gap: 1rem; }
+  .color-swatch { text-align: center; }
+  .swatch { width: 80px; height: 80px; border-radius: 8px; margin-bottom: 0.5rem; }
+  .label { font-weight: 500; font-size: 0.875rem; }
+  .value { font-family: monospace; font-size: 0.75rem; color: #6b7280; }
+  .palette-grid { display: flex; flex-wrap: wrap; gap: 2rem; }
+  .color-palette { min-width: 140px; }
+  .color-palette h3 { margin: 0 0 0.5rem; text-transform: capitalize; font-size: 0.875rem; font-weight: 600; }
+  .shades { display: flex; flex-direction: column; border-radius: 8px; overflow: hidden; }
+  .shade { padding: 0.5rem 0.75rem; font-family: monospace; font-size: 0.65rem; }
+`;
+
+export const AllColors = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="color-container">
+      
+      <div class="color-section">
+        <h2>Base</h2>
+        <div class="swatch-row">
+        <div class="color-swatch">
+          <div class="swatch" style="background: #ffffff; border: 1px solid #e5e7eb;"></div>
+          <div class="label">white</div>
+          <div class="value">#ffffff</div>
+        </div>
+        <div class="color-swatch">
+          <div class="swatch" style="background: #000000; "></div>
+          <div class="label">black</div>
+          <div class="value">#000000</div>
+        </div>
+        <div class="color-swatch">
+          <div class="swatch" style="background: transparent; border: 1px solid #e5e7eb;"></div>
+          <div class="label">transparent</div>
+          <div class="value">transparent</div>
+        </div></div>
+      </div>
+      
+      <div class="color-section">
+        <h2>Neutral Scales</h2>
+        <div class="palette-grid">
+        <div class="color-palette">
+          <h3>slate</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f8fafc; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #f1f5f9; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #e2e8f0; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #cbd5e1; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #94a3b8; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #64748b; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #475569; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #334155; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #1e293b; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #0f172a; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #020617; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>gray</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f9fafb; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #f3f4f6; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #e5e7eb; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #d1d5db; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #9ca3af; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #6b7280; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #4b5563; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #374151; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #1f2937; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #111827; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #030712; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>zinc</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fafafa; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #f4f4f5; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #e4e4e7; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #d4d4d8; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #a1a1aa; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #71717a; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #52525b; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #3f3f46; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #27272a; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #18181b; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #09090b; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>neutral</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fafafa; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #f5f5f5; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #e5e5e5; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #d4d4d4; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #a3a3a3; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #737373; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #525252; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #404040; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #262626; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #171717; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #0a0a0a; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>stone</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fafaf9; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #f5f5f4; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #e7e5e4; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #d6d3d1; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #a8a29e; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #78716c; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #57534e; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #44403c; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #292524; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #1c1917; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #0c0a09; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div></div>
+      </div>
+      
+      <div class="color-section">
+        <h2>Semantic Scales</h2>
+        <div class="palette-grid">
+        <div class="color-palette">
+          <h3>red</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fef2f2; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #fee2e2; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #fecaca; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #fca5a5; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #f87171; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #ef4444; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #dc2626; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #b91c1c; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #991b1b; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #7f1d1d; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #450a0a; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>orange</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fff7ed; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #ffedd5; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #fed7aa; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #fdba74; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #fb923c; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #f97316; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #ea580c; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #c2410c; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #9a3412; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #7c2d12; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #431407; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>amber</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fffbeb; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #fef3c7; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #fde68a; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #fcd34d; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #fbbf24; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #f59e0b; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #d97706; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #b45309; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #92400e; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #78350f; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #451a03; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>yellow</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fefce8; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #fef9c3; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #fef08a; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #fde047; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #facc15; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #eab308; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #ca8a04; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #a16207; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #854d0e; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #713f12; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #422006; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>lime</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f7fee7; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #ecfccb; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #d9f99d; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #bef264; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #a3e635; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #84cc16; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #65a30d; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #4d7c0f; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #3f6212; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #365314; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #1a2e05; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>green</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f0fdf4; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #dcfce7; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #bbf7d0; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #86efac; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #4ade80; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #22c55e; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #16a34a; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #15803d; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #166534; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #14532d; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #052e16; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>emerald</h3>
+          <div class="shades">
+          <div class="shade" style="background: #ecfdf5; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #d1fae5; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #a7f3d0; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #6ee7b7; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #34d399; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #10b981; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #059669; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #047857; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #065f46; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #064e3b; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #022c22; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>teal</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f0fdfa; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #ccfbf1; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #99f6e4; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #5eead4; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #2dd4bf; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #14b8a6; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #0d9488; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #0f766e; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #115e59; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #134e4a; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #042f2e; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>cyan</h3>
+          <div class="shades">
+          <div class="shade" style="background: #ecfeff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #cffafe; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #a5f3fc; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #67e8f9; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #22d3ee; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #06b6d4; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #0891b2; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #0e7490; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #155e75; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #164e63; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #083344; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>sky</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f0f9ff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #e0f2fe; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #bae6fd; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #7dd3fc; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #38bdf8; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #0ea5e9; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #0284c7; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #0369a1; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #075985; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #0c4a6e; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #082f49; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>blue</h3>
+          <div class="shades">
+          <div class="shade" style="background: #eff6ff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #dbeafe; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #bfdbfe; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #93c5fd; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #60a5fa; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #3b82f6; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #2563eb; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #1d4ed8; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #1e40af; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #1e3a8a; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #172554; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>indigo</h3>
+          <div class="shades">
+          <div class="shade" style="background: #eef2ff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #e0e7ff; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #c7d2fe; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #a5b4fc; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #818cf8; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #6366f1; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #4f46e5; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #4338ca; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #3730a3; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #312e81; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #1e1b4b; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>violet</h3>
+          <div class="shades">
+          <div class="shade" style="background: #f5f3ff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #ede9fe; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #ddd6fe; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #c4b5fd; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #a78bfa; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #8b5cf6; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #7c3aed; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #6d28d9; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #5b21b6; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #4c1d95; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #2e1065; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>purple</h3>
+          <div class="shades">
+          <div class="shade" style="background: #faf5ff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #f3e8ff; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #e9d5ff; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #d8b4fe; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #c084fc; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #a855f7; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #9333ea; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #7e22ce; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #6b21a8; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #581c87; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #3b0764; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>fuchsia</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fdf4ff; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #fae8ff; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #f5d0fe; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #f0abfc; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #e879f9; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #d946ef; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #c026d3; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #a21caf; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #86198f; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #701a75; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #4a044e; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>pink</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fdf2f8; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #fce7f3; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #fbcfe8; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #f9a8d4; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #f472b6; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #ec4899; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #db2777; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #be185d; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #9d174d; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #831843; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #500724; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div>
+        <div class="color-palette">
+          <h3>rose</h3>
+          <div class="shades">
+          <div class="shade" style="background: #fff1f2; color: #000;">
+            <span>50</span>
+          </div>
+          <div class="shade" style="background: #ffe4e6; color: #000;">
+            <span>100</span>
+          </div>
+          <div class="shade" style="background: #fecdd3; color: #000;">
+            <span>200</span>
+          </div>
+          <div class="shade" style="background: #fda4af; color: #000;">
+            <span>300</span>
+          </div>
+          <div class="shade" style="background: #fb7185; color: #000;">
+            <span>400</span>
+          </div>
+          <div class="shade" style="background: #f43f5e; color: #fff;">
+            <span>500</span>
+          </div>
+          <div class="shade" style="background: #e11d48; color: #fff;">
+            <span>600</span>
+          </div>
+          <div class="shade" style="background: #be123c; color: #fff;">
+            <span>700</span>
+          </div>
+          <div class="shade" style="background: #9f1239; color: #fff;">
+            <span>800</span>
+          </div>
+          <div class="shade" style="background: #881337; color: #fff;">
+            <span>900</span>
+          </div>
+          <div class="shade" style="background: #4c0519; color: #fff;">
+            <span>950</span>
+          </div></div>
+        </div></div>
+      </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/ComponentsDataDisplay.stories.js b/admin-ui/src/stories/ComponentsDataDisplay.stories.js
new file mode 100644
index 0000000..8e0ef02
--- /dev/null
+++ b/admin-ui/src/stories/ComponentsDataDisplay.stories.js
@@ -0,0 +1,164 @@
+/**
+ * Data Display
+ * Components for displaying data
+ * @generated 2025-12-10T21:48:22.319651
+ */
+export default {
+  title: 'Components/Data Display',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Components for displaying data'
+      }
+    }
+  }
+};
+
+const styles = `
+  .component-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
+  .component-card {
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+  .card-header h3 { margin: 0; font-size: 1rem; }
+  .radix-badge {
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }
+  .description { font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }
+  .variants { margin-bottom: 0.5rem; }
+  .variant-row { font-size: 0.7rem; margin-bottom: 0.25rem; }
+  .var-name { font-weight: 500; margin-right: 0.25rem; }
+  .badge {
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }
+  .deps { font-size: 0.65rem; color: #9ca3af; font-family: monospace; }
+`;
+
+export const Overview = {
+  name: 'Component Catalog',
+  render: () => `
+    <style>${styles}</style>
+    <div class="component-grid">
+      
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Accordion</h3>
+            <span class="radix-badge">@radix-ui/react-accordion</span>
+          </div>
+          <p class="description">A vertically stacked set of interactive headings that reveal content sections</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Avatar</h3>
+            <span class="radix-badge">@radix-ui/react-avatar</span>
+          </div>
+          <p class="description">An image element with a fallback for user profile images</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">size:</span> <span class="badge">sm</span> <span class="badge">md</span> <span class="badge">lg</span></div></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Badge</h3>
+            
+          </div>
+          <p class="description">Displays a badge or label</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">variant:</span> <span class="badge">default</span> <span class="badge">secondary</span> <span class="badge">destructive</span> <span class="badge">outline</span></div></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Carousel</h3>
+            
+          </div>
+          <p class="description">A carousel with embla-carousel</p>
+          <div class="variants"></div>
+          <div class="deps">deps: embla-carousel-react</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Chart</h3>
+            
+          </div>
+          <p class="description">Beautiful charts using Recharts</p>
+          <div class="variants"></div>
+          <div class="deps">deps: recharts</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Collapsible</h3>
+            <span class="radix-badge">@radix-ui/react-collapsible</span>
+          </div>
+          <p class="description">An interactive component that expands/collapses content</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Data Table</h3>
+            
+          </div>
+          <p class="description">Powerful table with sorting, filtering, pagination</p>
+          <div class="variants"></div>
+          <div class="deps">deps: @tanstack/react-table</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Item</h3>
+            
+          </div>
+          <p class="description">Generic list item component</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Kbd</h3>
+            
+          </div>
+          <p class="description">Keyboard key display</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Table</h3>
+            
+          </div>
+          <p class="description">Styled HTML table</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Typography</h3>
+            
+          </div>
+          <p class="description">Text styling components</p>
+          <div class="variants"></div>
+          
+        </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/ComponentsFeedback.stories.js b/admin-ui/src/stories/ComponentsFeedback.stories.js
new file mode 100644
index 0000000..99d4232
--- /dev/null
+++ b/admin-ui/src/stories/ComponentsFeedback.stories.js
@@ -0,0 +1,128 @@
+/**
+ * Feedback
+ * User feedback components
+ * @generated 2025-12-10T21:48:22.319831
+ */
+export default {
+  title: 'Components/Feedback',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'User feedback components'
+      }
+    }
+  }
+};
+
+const styles = `
+  .component-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
+  .component-card {
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+  .card-header h3 { margin: 0; font-size: 1rem; }
+  .radix-badge {
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }
+  .description { font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }
+  .variants { margin-bottom: 0.5rem; }
+  .variant-row { font-size: 0.7rem; margin-bottom: 0.25rem; }
+  .var-name { font-weight: 500; margin-right: 0.25rem; }
+  .badge {
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }
+  .deps { font-size: 0.65rem; color: #9ca3af; font-family: monospace; }
+`;
+
+export const Overview = {
+  name: 'Component Catalog',
+  render: () => `
+    <style>${styles}</style>
+    <div class="component-grid">
+      
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Alert</h3>
+            
+          </div>
+          <p class="description">Displays a callout for user attention</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">variant:</span> <span class="badge">default</span> <span class="badge">destructive</span></div></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Empty</h3>
+            
+          </div>
+          <p class="description">Empty state display</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Progress</h3>
+            <span class="radix-badge">@radix-ui/react-progress</span>
+          </div>
+          <p class="description">Progress indicator bar</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Skeleton</h3>
+            
+          </div>
+          <p class="description">Loading placeholder</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Sonner</h3>
+            
+          </div>
+          <p class="description">Toast notifications with sonner</p>
+          <div class="variants"></div>
+          <div class="deps">deps: sonner</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Spinner</h3>
+            
+          </div>
+          <p class="description">Loading spinner animation</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Toast</h3>
+            <span class="radix-badge">@radix-ui/react-toast</span>
+          </div>
+          <p class="description">Toast notification component</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">variant:</span> <span class="badge">default</span> <span class="badge">destructive</span></div></div>
+          
+        </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/ComponentsFormComponents.stories.js b/admin-ui/src/stories/ComponentsFormComponents.stories.js
new file mode 100644
index 0000000..98033c1
--- /dev/null
+++ b/admin-ui/src/stories/ComponentsFormComponents.stories.js
@@ -0,0 +1,254 @@
+/**
+ * Form Components
+ * Input controls and form elements
+ * @generated 2025-12-10T21:48:22.319378
+ */
+export default {
+  title: 'Components/Form Components',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Input controls and form elements'
+      }
+    }
+  }
+};
+
+const styles = `
+  .component-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
+  .component-card {
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+  .card-header h3 { margin: 0; font-size: 1rem; }
+  .radix-badge {
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }
+  .description { font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }
+  .variants { margin-bottom: 0.5rem; }
+  .variant-row { font-size: 0.7rem; margin-bottom: 0.25rem; }
+  .var-name { font-weight: 500; margin-right: 0.25rem; }
+  .badge {
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }
+  .deps { font-size: 0.65rem; color: #9ca3af; font-family: monospace; }
+`;
+
+export const Overview = {
+  name: 'Component Catalog',
+  render: () => `
+    <style>${styles}</style>
+    <div class="component-grid">
+      
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Button</h3>
+            
+          </div>
+          <p class="description">Displays a button or a component that looks like a button</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">variant:</span> <span class="badge">default</span> <span class="badge">destructive</span> <span class="badge">outline</span> <span class="badge">secondary</span></div><div class="variant-row"><span class="var-name">size:</span> <span class="badge">default</span> <span class="badge">sm</span> <span class="badge">lg</span> <span class="badge">icon</span></div></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Button Group</h3>
+            
+          </div>
+          <p class="description">Groups multiple buttons together</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Calendar</h3>
+            
+          </div>
+          <p class="description">A date picker component with monthly/yearly views</p>
+          <div class="variants"></div>
+          <div class="deps">deps: react-day-picker</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Checkbox</h3>
+            <span class="radix-badge">@radix-ui/react-checkbox</span>
+          </div>
+          <p class="description">A control that allows toggling between checked and unchecked</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Combobox</h3>
+            
+          </div>
+          <p class="description">Autocomplete input with command palette</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Command</h3>
+            
+          </div>
+          <p class="description">Command palette with search and filtering</p>
+          <div class="variants"></div>
+          <div class="deps">deps: cmdk</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Date Picker</h3>
+            
+          </div>
+          <p class="description">A date picker built with calendar and popover</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Field</h3>
+            
+          </div>
+          <p class="description">Form field wrapper with label and error</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Form</h3>
+            
+          </div>
+          <p class="description">Form component with react-hook-form integration</p>
+          <div class="variants"></div>
+          <div class="deps">deps: react-hook-form, @hookform/resolvers, zod</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Input</h3>
+            
+          </div>
+          <p class="description">Text input field</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Input Group</h3>
+            
+          </div>
+          <p class="description">Group of inputs with addons</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Input OTP</h3>
+            
+          </div>
+          <p class="description">One-time password input</p>
+          <div class="variants"></div>
+          <div class="deps">deps: input-otp</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Label</h3>
+            <span class="radix-badge">@radix-ui/react-label</span>
+          </div>
+          <p class="description">Text label for form elements</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Native Select</h3>
+            
+          </div>
+          <p class="description">Native HTML select element with styling</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Radio Group</h3>
+            <span class="radix-badge">@radix-ui/react-radio-group</span>
+          </div>
+          <p class="description">Set of mutually exclusive options</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Select</h3>
+            <span class="radix-badge">@radix-ui/react-select</span>
+          </div>
+          <p class="description">Custom select dropdown</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Slider</h3>
+            <span class="radix-badge">@radix-ui/react-slider</span>
+          </div>
+          <p class="description">Range slider input</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Switch</h3>
+            <span class="radix-badge">@radix-ui/react-switch</span>
+          </div>
+          <p class="description">Toggle switch control</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Textarea</h3>
+            
+          </div>
+          <p class="description">Multi-line text input</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Toggle</h3>
+            <span class="radix-badge">@radix-ui/react-toggle</span>
+          </div>
+          <p class="description">Two-state button</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">variant:</span> <span class="badge">default</span> <span class="badge">outline</span></div><div class="variant-row"><span class="var-name">size:</span> <span class="badge">default</span> <span class="badge">sm</span> <span class="badge">lg</span></div></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Toggle Group</h3>
+            <span class="radix-badge">@radix-ui/react-toggle-group</span>
+          </div>
+          <p class="description">Group of toggle buttons</p>
+          <div class="variants"></div>
+          
+        </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/ComponentsLayout.stories.js b/admin-ui/src/stories/ComponentsLayout.stories.js
new file mode 100644
index 0000000..7a8852d
--- /dev/null
+++ b/admin-ui/src/stories/ComponentsLayout.stories.js
@@ -0,0 +1,110 @@
+/**
+ * Layout
+ * Layout and structure components
+ * @generated 2025-12-10T21:48:22.320304
+ */
+export default {
+  title: 'Components/Layout',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Layout and structure components'
+      }
+    }
+  }
+};
+
+const styles = `
+  .component-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
+  .component-card {
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+  .card-header h3 { margin: 0; font-size: 1rem; }
+  .radix-badge {
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }
+  .description { font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }
+  .variants { margin-bottom: 0.5rem; }
+  .variant-row { font-size: 0.7rem; margin-bottom: 0.25rem; }
+  .var-name { font-weight: 500; margin-right: 0.25rem; }
+  .badge {
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }
+  .deps { font-size: 0.65rem; color: #9ca3af; font-family: monospace; }
+`;
+
+export const Overview = {
+  name: 'Component Catalog',
+  render: () => `
+    <style>${styles}</style>
+    <div class="component-grid">
+      
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Aspect Ratio</h3>
+            <span class="radix-badge">@radix-ui/react-aspect-ratio</span>
+          </div>
+          <p class="description">Displays content with a desired aspect ratio</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Card</h3>
+            
+          </div>
+          <p class="description">Displays a card with header, content, and footer</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Resizable</h3>
+            
+          </div>
+          <p class="description">Resizable panel groups</p>
+          <div class="variants"></div>
+          <div class="deps">deps: react-resizable-panels</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Scroll Area</h3>
+            <span class="radix-badge">@radix-ui/react-scroll-area</span>
+          </div>
+          <p class="description">Custom scrollbar styling</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Separator</h3>
+            <span class="radix-badge">@radix-ui/react-separator</span>
+          </div>
+          <p class="description">Visual divider</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">orientation:</span> <span class="badge">horizontal</span> <span class="badge">vertical</span></div></div>
+          
+        </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/ComponentsNavigation.stories.js b/admin-ui/src/stories/ComponentsNavigation.stories.js
new file mode 100644
index 0000000..97d3ddf
--- /dev/null
+++ b/admin-ui/src/stories/ComponentsNavigation.stories.js
@@ -0,0 +1,119 @@
+/**
+ * Navigation
+ * Navigation components
+ * @generated 2025-12-10T21:48:22.319990
+ */
+export default {
+  title: 'Components/Navigation',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Navigation components'
+      }
+    }
+  }
+};
+
+const styles = `
+  .component-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
+  .component-card {
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+  .card-header h3 { margin: 0; font-size: 1rem; }
+  .radix-badge {
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }
+  .description { font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }
+  .variants { margin-bottom: 0.5rem; }
+  .variant-row { font-size: 0.7rem; margin-bottom: 0.25rem; }
+  .var-name { font-weight: 500; margin-right: 0.25rem; }
+  .badge {
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }
+  .deps { font-size: 0.65rem; color: #9ca3af; font-family: monospace; }
+`;
+
+export const Overview = {
+  name: 'Component Catalog',
+  render: () => `
+    <style>${styles}</style>
+    <div class="component-grid">
+      
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Breadcrumb</h3>
+            
+          </div>
+          <p class="description">Displays the path to the current page in a hierarchy</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Menubar</h3>
+            <span class="radix-badge">@radix-ui/react-menubar</span>
+          </div>
+          <p class="description">Horizontal menu with dropdowns</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Navigation Menu</h3>
+            <span class="radix-badge">@radix-ui/react-navigation-menu</span>
+          </div>
+          <p class="description">Website navigation with mega menus</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Pagination</h3>
+            
+          </div>
+          <p class="description">Page navigation with previous/next</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Sidebar</h3>
+            
+          </div>
+          <p class="description">Application sidebar with collapsible sections</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Tabs</h3>
+            <span class="radix-badge">@radix-ui/react-tabs</span>
+          </div>
+          <p class="description">Tabbed interface</p>
+          <div class="variants"></div>
+          
+        </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/ComponentsOverlay.stories.js b/admin-ui/src/stories/ComponentsOverlay.stories.js
new file mode 100644
index 0000000..2e2b92e
--- /dev/null
+++ b/admin-ui/src/stories/ComponentsOverlay.stories.js
@@ -0,0 +1,146 @@
+/**
+ * Overlay
+ * Modal and overlay components
+ * @generated 2025-12-10T21:48:22.320136
+ */
+export default {
+  title: 'Components/Overlay',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Modal and overlay components'
+      }
+    }
+  }
+};
+
+const styles = `
+  .component-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
+  .component-card {
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }
+  .card-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }
+  .card-header h3 { margin: 0; font-size: 1rem; }
+  .radix-badge {
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }
+  .description { font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }
+  .variants { margin-bottom: 0.5rem; }
+  .variant-row { font-size: 0.7rem; margin-bottom: 0.25rem; }
+  .var-name { font-weight: 500; margin-right: 0.25rem; }
+  .badge {
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }
+  .deps { font-size: 0.65rem; color: #9ca3af; font-family: monospace; }
+`;
+
+export const Overview = {
+  name: 'Component Catalog',
+  render: () => `
+    <style>${styles}</style>
+    <div class="component-grid">
+      
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Alert Dialog</h3>
+            <span class="radix-badge">@radix-ui/react-alert-dialog</span>
+          </div>
+          <p class="description">A modal dialog that interrupts user flow with important information</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Context Menu</h3>
+            <span class="radix-badge">@radix-ui/react-context-menu</span>
+          </div>
+          <p class="description">Right-click context menu with keyboard support</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Dialog</h3>
+            <span class="radix-badge">@radix-ui/react-dialog</span>
+          </div>
+          <p class="description">A modal dialog for content display</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Drawer</h3>
+            
+          </div>
+          <p class="description">A drawer component extending dialog</p>
+          <div class="variants"></div>
+          <div class="deps">deps: vaul</div>
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Dropdown Menu</h3>
+            <span class="radix-badge">@radix-ui/react-dropdown-menu</span>
+          </div>
+          <p class="description">Menu displayed on trigger interaction</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Hover Card</h3>
+            <span class="radix-badge">@radix-ui/react-hover-card</span>
+          </div>
+          <p class="description">Content appearing on hover</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Popover</h3>
+            <span class="radix-badge">@radix-ui/react-popover</span>
+          </div>
+          <p class="description">Floating content panel</p>
+          <div class="variants"></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Sheet</h3>
+            <span class="radix-badge">@radix-ui/react-dialog</span>
+          </div>
+          <p class="description">Side panel overlay</p>
+          <div class="variants"><div class="variant-row"><span class="var-name">side:</span> <span class="badge">top</span> <span class="badge">right</span> <span class="badge">bottom</span> <span class="badge">left</span></div></div>
+          
+        </div>
+        <div class="component-card">
+          <div class="card-header">
+            <h3>Tooltip</h3>
+            <span class="radix-badge">@radix-ui/react-tooltip</span>
+          </div>
+          <p class="description">Informative popup on hover</p>
+          <div class="variants"></div>
+          
+        </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/Effects.stories.js b/admin-ui/src/stories/Effects.stories.js
new file mode 100644
index 0000000..d467bfe
--- /dev/null
+++ b/admin-ui/src/stories/Effects.stories.js
@@ -0,0 +1,60 @@
+/**
+ * Effects - Design Tokens
+ * Shadows and focus rings
+ * @generated 2025-12-10T19:56:03.054416
+ */
+export default {
+  title: 'Foundation/Effects',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Shadow and focus ring effects extracted from Figma.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .effects-grid { display: flex; flex-wrap: wrap; gap: 2rem; padding: 2rem; }
+  .effect-card {
+    width: 150px;
+    height: 100px;
+    background: white;
+    border-radius: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  .name { font-family: monospace; font-size: 0.75rem; color: #6b7280; }
+`;
+
+export const Shadows = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="effects-grid">
+      
+      <div class="effect-card" style="box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);">
+        <span class="name">shadow-xs</span>
+      </div>
+      <div class="effect-card" style="box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);">
+        <span class="name">shadow-sm</span>
+      </div>
+      <div class="effect-card" style="box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);">
+        <span class="name">shadow-md</span>
+      </div>
+      <div class="effect-card" style="box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);">
+        <span class="name">shadow-lg</span>
+      </div>
+      <div class="effect-card" style="box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);">
+        <span class="name">shadow-xl</span>
+      </div>
+      <div class="effect-card" style="box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);">
+        <span class="name">shadow-2xl</span>
+      </div>
+      <div class="effect-card" style="box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5);">
+        <span class="name">focus-ring</span>
+      </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/Overview.stories.js b/admin-ui/src/stories/Overview.stories.js
new file mode 100644
index 0000000..8fb2ead
--- /dev/null
+++ b/admin-ui/src/stories/Overview.stories.js
@@ -0,0 +1,94 @@
+/**
+ * Design System Overview
+ * @generated 2025-12-10T21:48:22.316923
+ */
+export default {
+  title: 'Overview',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'DSS Design System - Token documentation and component library'
+      }
+    }
+  }
+};
+
+const styles = `
+  .overview { max-width: 800px; font-family: system-ui, sans-serif; }
+  .overview h1 { font-size: 2rem; margin-bottom: 0.5rem; }
+  .overview .subtitle { color: #6b7280; margin-bottom: 2rem; }
+  .overview h2 { font-size: 1.25rem; margin-top: 2rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; }
+  .overview ul { padding-left: 1.5rem; }
+  .overview li { margin: 0.5rem 0; }
+  .overview code { background: #f3f4f6; padding: 0.125rem 0.375rem; border-radius: 4px; font-size: 0.875rem; }
+  .layer { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem; background: #f9fafb; border-radius: 8px; margin: 0.5rem 0; }
+  .layer-num { width: 24px; height: 24px; background: #18181b; color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 600; }
+  .stats { display: flex; gap: 1rem; margin: 1rem 0; }
+  .stat { background: #f9fafb; padding: 1rem; border-radius: 8px; text-align: center; }
+  .stat-value { font-size: 2rem; font-weight: 700; color: #18181b; }
+  .stat-label { font-size: 0.75rem; color: #6b7280; }
+`;
+
+export const Introduction = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="overview">
+      <h1>DSS Design System</h1>
+      <p class="subtitle">Token-driven design system with 3-layer architecture</p>
+
+      <div class="stats">
+        <div class="stat">
+          <div class="stat-value">22</div>
+          <div class="stat-label">Color Scales</div>
+        </div>
+        <div class="stat">
+          <div class="stat-value">59</div>
+          <div class="stat-label">Components</div>
+        </div>
+        <div class="stat">
+          <div class="stat-value">6</div>
+          <div class="stat-label">Categories</div>
+        </div>
+      </div>
+
+      <h2>Architecture</h2>
+      <div class="layer">
+        <span class="layer-num">1</span>
+        <strong>Core Primitives</strong> - Raw Tailwind values (colors, spacing, fonts)
+      </div>
+      <div class="layer">
+        <span class="layer-num">2</span>
+        <strong>Skin</strong> - Semantic mapping (primary, secondary, etc.)
+      </div>
+      <div class="layer">
+        <span class="layer-num">3</span>
+        <strong>Theme</strong> - Brand overrides
+      </div>
+
+      <h2>Navigation</h2>
+      <ul>
+        <li><strong>Foundation</strong> - Core primitives (colors, spacing, typography, radius, shadows)</li>
+        <li><strong>Tokens</strong> - Semantic design tokens from skin</li>
+        <li><strong>Components</strong> - 59 shadcn/ui components organized by category</li>
+      </ul>
+
+      <h2>Component Categories</h2>
+      <ul>
+        <li><strong>Form</strong> - Button, Input, Select, Checkbox, etc.</li>
+        <li><strong>Data Display</strong> - Table, Badge, Avatar, Chart, etc.</li>
+        <li><strong>Feedback</strong> - Alert, Toast, Progress, Spinner, etc.</li>
+        <li><strong>Navigation</strong> - Tabs, Breadcrumb, Sidebar, etc.</li>
+        <li><strong>Overlay</strong> - Dialog, Sheet, Dropdown, Tooltip, etc.</li>
+        <li><strong>Layout</strong> - Card, Separator, Scroll Area, etc.</li>
+      </ul>
+
+      <h2>Usage</h2>
+      <p>Import tokens CSS in your project:</p>
+      <pre><code>import '.dss/data/_system/themes/tokens.css';</code></pre>
+      <p>Use CSS variables in your styles:</p>
+      <pre><code>color: var(--color-primary);
+background: var(--color-background);</code></pre>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/Radius.stories.js b/admin-ui/src/stories/Radius.stories.js
new file mode 100644
index 0000000..f7d6a9f
--- /dev/null
+++ b/admin-ui/src/stories/Radius.stories.js
@@ -0,0 +1,87 @@
+/**
+ * Border Radius - Foundation
+ * @generated 2025-12-10T21:48:22.318737
+ */
+export default {
+  title: 'Foundation/Radius',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Border radius scale for consistent rounded corners.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .radius-grid { display: flex; flex-wrap: wrap; gap: 2rem; }
+  .radius-item { text-align: center; }
+  .box { width: 80px; height: 80px; background: var(--color-primary, #18181b); margin-bottom: 0.5rem; }
+  .name { font-weight: 500; font-size: 0.875rem; }
+  .value { font-family: monospace; font-size: 0.75rem; color: #6b7280; }
+  .comment { font-size: 0.65rem; color: #9ca3af; }
+`;
+
+export const RadiusScale = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="radius-grid">
+      
+      <div class="radius-item">
+        <div class="box" style="border-radius: 0;"></div>
+        <div class="name">none</div>
+        <div class="value">0</div>
+        <div class="comment"></div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 0.125rem;"></div>
+        <div class="name">sm</div>
+        <div class="value">0.125rem</div>
+        <div class="comment">2px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 0.25rem;"></div>
+        <div class="name">default</div>
+        <div class="value">0.25rem</div>
+        <div class="comment">4px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 0.375rem;"></div>
+        <div class="name">md</div>
+        <div class="value">0.375rem</div>
+        <div class="comment">6px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 0.5rem;"></div>
+        <div class="name">lg</div>
+        <div class="value">0.5rem</div>
+        <div class="comment">8px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 0.75rem;"></div>
+        <div class="name">xl</div>
+        <div class="value">0.75rem</div>
+        <div class="comment">12px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 1rem;"></div>
+        <div class="name">2xl</div>
+        <div class="value">1rem</div>
+        <div class="comment">16px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 1.5rem;"></div>
+        <div class="name">3xl</div>
+        <div class="value">1.5rem</div>
+        <div class="comment">24px</div>
+      </div>
+      <div class="radius-item">
+        <div class="box" style="border-radius: 9999px;"></div>
+        <div class="name">full</div>
+        <div class="value">9999px</div>
+        <div class="comment"></div>
+      </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/SemanticColors.stories.js b/admin-ui/src/stories/SemanticColors.stories.js
new file mode 100644
index 0000000..8b8c1bb
--- /dev/null
+++ b/admin-ui/src/stories/SemanticColors.stories.js
@@ -0,0 +1,178 @@
+/**
+ * Semantic Colors - Design Tokens
+ * Resolved color tokens for light theme
+ * @generated 2025-12-10T21:48:22.319129
+ */
+export default {
+  title: 'Tokens/Semantic Colors',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Semantic color tokens mapped from primitives. Use these in components via CSS variables.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .semantic-colors { display: flex; flex-direction: column; gap: 2rem; }
+  .token-group h3 { margin: 0 0 1rem; font-size: 1rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; }
+  .token-row { display: flex; flex-wrap: wrap; gap: 1rem; }
+  .token-card { text-align: center; }
+  .swatch { width: 80px; height: 60px; border-radius: 8px; border: 1px solid #e5e7eb; margin-bottom: 0.5rem; }
+  .name { font-size: 0.75rem; font-weight: 500; }
+  .value { font-family: monospace; font-size: 0.65rem; color: #6b7280; }
+  .comment { font-size: 0.6rem; color: #9ca3af; max-width: 80px; }
+`;
+
+export const LightTheme = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="semantic-colors">
+      
+      <div class="token-group">
+        <h3>Surface</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #ffffff;"></div>
+          <div class="name">background</div>
+          <div class="value">#ffffff</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #09090b;"></div>
+          <div class="name">foreground</div>
+          <div class="value">#09090b</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #ffffff;"></div>
+          <div class="name">card</div>
+          <div class="value">#ffffff</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #09090b;"></div>
+          <div class="name">card-foreground</div>
+          <div class="value">#09090b</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #ffffff;"></div>
+          <div class="name">popover</div>
+          <div class="value">#ffffff</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #09090b;"></div>
+          <div class="name">popover-foreground</div>
+          <div class="value">#09090b</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #fafafa;"></div>
+          <div class="name">primary-foreground</div>
+          <div class="value">#fafafa</div>
+          <div class="comment">zinc-50</div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #18181b;"></div>
+          <div class="name">secondary-foreground</div>
+          <div class="value">#18181b</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #71717a;"></div>
+          <div class="name">muted-foreground</div>
+          <div class="value">#71717a</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #18181b;"></div>
+          <div class="name">accent-foreground</div>
+          <div class="value">#18181b</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #fafafa;"></div>
+          <div class="name">destructive-foreground</div>
+          <div class="value">#fafafa</div>
+          <div class="comment"></div>
+        </div></div>
+      </div>
+      <div class="token-group">
+        <h3>Primary</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #18181b;"></div>
+          <div class="name">primary</div>
+          <div class="value">#18181b</div>
+          <div class="comment">zinc-900 - brand primary</div>
+        </div></div>
+      </div>
+      <div class="token-group">
+        <h3>Secondary</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #f4f4f5;"></div>
+          <div class="name">secondary</div>
+          <div class="value">#f4f4f5</div>
+          <div class="comment"></div>
+        </div></div>
+      </div>
+      <div class="token-group">
+        <h3>Accent</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #f4f4f5;"></div>
+          <div class="name">accent</div>
+          <div class="value">#f4f4f5</div>
+          <div class="comment"></div>
+        </div></div>
+      </div>
+      <div class="token-group">
+        <h3>Muted</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #f4f4f5;"></div>
+          <div class="name">muted</div>
+          <div class="value">#f4f4f5</div>
+          <div class="comment"></div>
+        </div></div>
+      </div>
+      <div class="token-group">
+        <h3>Destructive</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #ef4444;"></div>
+          <div class="name">destructive</div>
+          <div class="value">#ef4444</div>
+          <div class="comment"></div>
+        </div></div>
+      </div>
+      <div class="token-group">
+        <h3>Other</h3>
+        <div class="token-row">
+        <div class="token-card">
+          <div class="swatch" style="background: #e4e4e7;"></div>
+          <div class="name">border</div>
+          <div class="value">#e4e4e7</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #e4e4e7;"></div>
+          <div class="name">input</div>
+          <div class="value">#e4e4e7</div>
+          <div class="comment"></div>
+        </div>
+        <div class="token-card">
+          <div class="swatch" style="background: #18181b;"></div>
+          <div class="name">ring</div>
+          <div class="value">#18181b</div>
+          <div class="comment">matches primary</div>
+        </div></div>
+      </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/Shadows.stories.js b/admin-ui/src/stories/Shadows.stories.js
new file mode 100644
index 0000000..0e4a8e1
--- /dev/null
+++ b/admin-ui/src/stories/Shadows.stories.js
@@ -0,0 +1,108 @@
+/**
+ * Shadows - Foundation
+ * Box shadow scale
+ * @generated 2025-12-10T21:48:22.318898
+ */
+export default {
+  title: 'Foundation/Effects/Shadows',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Box shadow tokens for elevation and depth.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .shadows-grid { display: flex; flex-wrap: wrap; gap: 2rem; padding: 2rem; background: #f9fafb; }
+  .shadow-card { text-align: center; }
+  .box { width: 120px; height: 80px; background: white; border-radius: 8px; margin-bottom: 0.5rem; }
+  .name { font-size: 0.75rem; font-weight: 500; }
+  .value { font-size: 0.6rem; color: #6b7280; font-family: monospace; max-width: 120px; word-wrap: break-word; }
+`;
+
+export const AllShadows = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="shadows-grid">
+      
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: none;"></div>
+        <div class="name">none</div>
+        <div class="value">none</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);"></div>
+        <div class="name">xs</div>
+        <div class="value">0 1px 2px 0 rgba(0, 0, 0, 0.05)</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">sm</div>
+        <div class="value">0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgb...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">default</div>
+        <div class="value">0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgb...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">md</div>
+        <div class="value">0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px ...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">lg</div>
+        <div class="value">0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4p...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">xl</div>
+        <div class="value">0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);"></div>
+        <div class="name">2xl</div>
+        <div class="value">0 25px 50px -12px rgba(0, 0, 0, 0.25)</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);"></div>
+        <div class="name">inner</div>
+        <div class="value">inset 0 2px 4px 0 rgba(0, 0, 0, 0.05)</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);"></div>
+        <div class="name">shadow-xs</div>
+        <div class="value">0 1px 2px 0 rgba(0, 0, 0, 0.05)</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">shadow-sm</div>
+        <div class="value">0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgb...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">shadow-md</div>
+        <div class="value">0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px ...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">shadow-lg</div>
+        <div class="value">0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4p...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);"></div>
+        <div class="name">shadow-xl</div>
+        <div class="value">0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6...</div>
+      </div>
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);"></div>
+        <div class="name">shadow-2xl</div>
+        <div class="value">0 25px 50px -12px rgba(0, 0, 0, 0.25)</div>
+      </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/Spacing.stories.js b/admin-ui/src/stories/Spacing.stories.js
new file mode 100644
index 0000000..d05eb9c
--- /dev/null
+++ b/admin-ui/src/stories/Spacing.stories.js
@@ -0,0 +1,314 @@
+/**
+ * Spacing Primitives - Foundation
+ * @generated 2025-12-10T21:48:22.318244
+ */
+export default {
+  title: 'Foundation/Spacing',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Spacing scale based on 4px grid. Use for margins, padding, and gaps.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .spacing-grid { display: flex; flex-direction: column; gap: 0.25rem; max-width: 600px; }
+  .spacing-item { display: flex; align-items: center; gap: 1rem; }
+  .bar { height: 20px; background: var(--color-primary, #18181b); border-radius: 2px; min-width: 2px; }
+  .info { display: flex; gap: 1rem; font-family: monospace; font-size: 0.75rem; }
+  .name { font-weight: 600; min-width: 32px; }
+  .value { color: #6b7280; min-width: 80px; }
+  .comment { color: #9ca3af; font-size: 0.65rem; }
+`;
+
+export const SpacingScale = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="spacing-grid">
+      
+      <div class="spacing-item">
+        <div class="bar" style="width: 1px;"></div>
+        <div class="info">
+          <span class="name">px</span>
+          <span class="value">1px</span>
+          <span class="comment"></span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0;"></div>
+        <div class="info">
+          <span class="name">0</span>
+          <span class="value">0</span>
+          <span class="comment"></span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.125rem;"></div>
+        <div class="info">
+          <span class="name">0.5</span>
+          <span class="value">0.125rem</span>
+          <span class="comment">2px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.25rem;"></div>
+        <div class="info">
+          <span class="name">1</span>
+          <span class="value">0.25rem</span>
+          <span class="comment">4px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.375rem;"></div>
+        <div class="info">
+          <span class="name">1.5</span>
+          <span class="value">0.375rem</span>
+          <span class="comment">6px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.5rem;"></div>
+        <div class="info">
+          <span class="name">2</span>
+          <span class="value">0.5rem</span>
+          <span class="comment">8px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.625rem;"></div>
+        <div class="info">
+          <span class="name">2.5</span>
+          <span class="value">0.625rem</span>
+          <span class="comment">10px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.75rem;"></div>
+        <div class="info">
+          <span class="name">3</span>
+          <span class="value">0.75rem</span>
+          <span class="comment">12px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 0.875rem;"></div>
+        <div class="info">
+          <span class="name">3.5</span>
+          <span class="value">0.875rem</span>
+          <span class="comment">14px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 1rem;"></div>
+        <div class="info">
+          <span class="name">4</span>
+          <span class="value">1rem</span>
+          <span class="comment">16px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 1.25rem;"></div>
+        <div class="info">
+          <span class="name">5</span>
+          <span class="value">1.25rem</span>
+          <span class="comment">20px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 1.5rem;"></div>
+        <div class="info">
+          <span class="name">6</span>
+          <span class="value">1.5rem</span>
+          <span class="comment">24px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 1.75rem;"></div>
+        <div class="info">
+          <span class="name">7</span>
+          <span class="value">1.75rem</span>
+          <span class="comment">28px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 2rem;"></div>
+        <div class="info">
+          <span class="name">8</span>
+          <span class="value">2rem</span>
+          <span class="comment">32px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 2.25rem;"></div>
+        <div class="info">
+          <span class="name">9</span>
+          <span class="value">2.25rem</span>
+          <span class="comment">36px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 2.5rem;"></div>
+        <div class="info">
+          <span class="name">10</span>
+          <span class="value">2.5rem</span>
+          <span class="comment">40px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 2.75rem;"></div>
+        <div class="info">
+          <span class="name">11</span>
+          <span class="value">2.75rem</span>
+          <span class="comment">44px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 3rem;"></div>
+        <div class="info">
+          <span class="name">12</span>
+          <span class="value">3rem</span>
+          <span class="comment">48px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 3.5rem;"></div>
+        <div class="info">
+          <span class="name">14</span>
+          <span class="value">3.5rem</span>
+          <span class="comment">56px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 4rem;"></div>
+        <div class="info">
+          <span class="name">16</span>
+          <span class="value">4rem</span>
+          <span class="comment">64px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 5rem;"></div>
+        <div class="info">
+          <span class="name">20</span>
+          <span class="value">5rem</span>
+          <span class="comment">80px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 6rem;"></div>
+        <div class="info">
+          <span class="name">24</span>
+          <span class="value">6rem</span>
+          <span class="comment">96px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 7rem;"></div>
+        <div class="info">
+          <span class="name">28</span>
+          <span class="value">7rem</span>
+          <span class="comment">112px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 8rem;"></div>
+        <div class="info">
+          <span class="name">32</span>
+          <span class="value">8rem</span>
+          <span class="comment">128px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 9rem;"></div>
+        <div class="info">
+          <span class="name">36</span>
+          <span class="value">9rem</span>
+          <span class="comment">144px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 10rem;"></div>
+        <div class="info">
+          <span class="name">40</span>
+          <span class="value">10rem</span>
+          <span class="comment">160px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 11rem;"></div>
+        <div class="info">
+          <span class="name">44</span>
+          <span class="value">11rem</span>
+          <span class="comment">176px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 12rem;"></div>
+        <div class="info">
+          <span class="name">48</span>
+          <span class="value">12rem</span>
+          <span class="comment">192px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 13rem;"></div>
+        <div class="info">
+          <span class="name">52</span>
+          <span class="value">13rem</span>
+          <span class="comment">208px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 14rem;"></div>
+        <div class="info">
+          <span class="name">56</span>
+          <span class="value">14rem</span>
+          <span class="comment">224px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 15rem;"></div>
+        <div class="info">
+          <span class="name">60</span>
+          <span class="value">15rem</span>
+          <span class="comment">240px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 16rem;"></div>
+        <div class="info">
+          <span class="name">64</span>
+          <span class="value">16rem</span>
+          <span class="comment">256px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 18rem;"></div>
+        <div class="info">
+          <span class="name">72</span>
+          <span class="value">18rem</span>
+          <span class="comment">288px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 20rem;"></div>
+        <div class="info">
+          <span class="name">80</span>
+          <span class="value">20rem</span>
+          <span class="comment">320px</span>
+        </div>
+      </div>
+      <div class="spacing-item">
+        <div class="bar" style="width: 24rem;"></div>
+        <div class="info">
+          <span class="name">96</span>
+          <span class="value">24rem</span>
+          <span class="comment">384px</span>
+        </div>
+      </div>
+    </div>
+  `
+};
diff --git a/admin-ui/src/stories/Typography.stories.js b/admin-ui/src/stories/Typography.stories.js
new file mode 100644
index 0000000..a28e1d2
--- /dev/null
+++ b/admin-ui/src/stories/Typography.stories.js
@@ -0,0 +1,284 @@
+/**
+ * Typography - Foundation
+ * Font families, sizes, weights, and composed styles
+ * @generated 2025-12-10T21:48:22.318522
+ */
+export default {
+  title: 'Foundation/Typography',
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Typography primitives and composed text styles.'
+      }
+    }
+  }
+};
+
+const styles = `
+  .typo-container { font-family: system-ui, sans-serif; }
+  .section { margin-bottom: 3rem; }
+  .section h2 { font-size: 1.25rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; margin-bottom: 1rem; }
+  .font-sample { margin-bottom: 1.5rem; }
+  .sample-text { font-size: 1.5rem; margin-bottom: 0.25rem; }
+  .meta { font-size: 0.75rem; font-family: monospace; }
+  .meta .name { font-weight: 600; margin-right: 1rem; }
+  .meta .value { color: #6b7280; }
+  .size-grid, .weight-grid { display: flex; flex-wrap: wrap; gap: 1.5rem; }
+  .size-sample, .weight-sample { text-align: center; min-width: 60px; }
+  .size-sample .text { display: block; margin-bottom: 0.25rem; }
+  .weight-sample .text { display: block; margin-bottom: 0.25rem; font-size: 1.5rem; }
+  .name { font-size: 0.75rem; font-weight: 500; display: block; }
+  .value { font-size: 0.65rem; color: #6b7280; font-family: monospace; }
+  .props { color: #6b7280; font-family: monospace; }
+  .style-sample { margin-bottom: 1rem; border-bottom: 1px solid #f3f4f6; padding-bottom: 1rem; }
+  .style-sample .text { margin-bottom: 0.25rem; color: var(--color-foreground, #18181b); }
+`;
+
+export const FontFamilies = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Font Families</h2>
+        
+      <div class="font-sample">
+        <div class="sample-text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;">
+          The quick brown fox jumps over the lazy dog
+        </div>
+        <div class="meta">
+          <span class="name">sans</span>
+          <span class="value">Inter, ui-sans-serif, system-ui, -apple-...</span>
+        </div>
+      </div>
+      <div class="font-sample">
+        <div class="sample-text" style="font-family: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;">
+          The quick brown fox jumps over the lazy dog
+        </div>
+        <div class="meta">
+          <span class="name">serif</span>
+          <span class="value">ui-serif, Georgia, Cambria, 'Times New R...</span>
+        </div>
+      </div>
+      <div class="font-sample">
+        <div class="sample-text" style="font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;">
+          The quick brown fox jumps over the lazy dog
+        </div>
+        <div class="meta">
+          <span class="name">mono</span>
+          <span class="value">ui-monospace, SFMono-Regular, 'SF Mono',...</span>
+        </div>
+      </div>
+      </div>
+    </div>
+  `
+};
+
+export const FontSizes = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Font Sizes</h2>
+        <div class="size-grid">
+      <div class="size-sample">
+        <span class="text" style="font-size: 0.75rem;">Aa</span>
+        <span class="name">xs</span>
+        <span class="value">0.75rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 0.875rem;">Aa</span>
+        <span class="name">sm</span>
+        <span class="value">0.875rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 1rem;">Aa</span>
+        <span class="name">base</span>
+        <span class="value">1rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 1.125rem;">Aa</span>
+        <span class="name">lg</span>
+        <span class="value">1.125rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 1.25rem;">Aa</span>
+        <span class="name">xl</span>
+        <span class="value">1.25rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 1.5rem;">Aa</span>
+        <span class="name">2xl</span>
+        <span class="value">1.5rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 1.875rem;">Aa</span>
+        <span class="name">3xl</span>
+        <span class="value">1.875rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 2.25rem;">Aa</span>
+        <span class="name">4xl</span>
+        <span class="value">2.25rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 3rem;">Aa</span>
+        <span class="name">5xl</span>
+        <span class="value">3rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 3.75rem;">Aa</span>
+        <span class="name">6xl</span>
+        <span class="value">3.75rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 4.5rem;">Aa</span>
+        <span class="name">7xl</span>
+        <span class="value">4.5rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 6rem;">Aa</span>
+        <span class="name">8xl</span>
+        <span class="value">6rem</span>
+      </div>
+      <div class="size-sample">
+        <span class="text" style="font-size: 8rem;">Aa</span>
+        <span class="name">9xl</span>
+        <span class="value">8rem</span>
+      </div></div>
+      </div>
+    </div>
+  `
+};
+
+export const FontWeights = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Font Weights</h2>
+        <div class="weight-grid">
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 100;">Aa</span>
+        <span class="name">thin</span>
+        <span class="value">100</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 200;">Aa</span>
+        <span class="name">extralight</span>
+        <span class="value">200</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 300;">Aa</span>
+        <span class="name">light</span>
+        <span class="value">300</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 400;">Aa</span>
+        <span class="name">normal</span>
+        <span class="value">400</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 500;">Aa</span>
+        <span class="name">medium</span>
+        <span class="value">500</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 600;">Aa</span>
+        <span class="name">semibold</span>
+        <span class="value">600</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 700;">Aa</span>
+        <span class="name">bold</span>
+        <span class="value">700</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 800;">Aa</span>
+        <span class="name">extrabold</span>
+        <span class="value">800</span>
+      </div>
+      <div class="weight-sample">
+        <span class="text" style="font-weight: 900;">Aa</span>
+        <span class="name">black</span>
+        <span class="value">900</span>
+      </div></div>
+      </div>
+    </div>
+  `
+};
+
+export const TextStyles = {
+  render: () => `
+    <style>${styles}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Composed Text Styles</h2>
+        
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 3rem; font-weight: 700; line-height: 1;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">heading-1</span>
+          <span class="props">3rem / 700</span>
+        </div>
+      </div>
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 1.875rem; font-weight: 600; line-height: 1.2;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">heading-2</span>
+          <span class="props">1.875rem / 600</span>
+        </div>
+      </div>
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 1.3;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">heading-3</span>
+          <span class="props">1.5rem / 600</span>
+        </div>
+      </div>
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 1.25rem; font-weight: 600; line-height: 1.4;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">heading-4</span>
+          <span class="props">1.25rem / 600</span>
+        </div>
+      </div>
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">paragraph-regular</span>
+          <span class="props">1rem / 400</span>
+        </div>
+      </div>
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 1rem; font-weight: 500; line-height: 1.5;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">paragraph-bold</span>
+          <span class="props">1rem / 500</span>
+        </div>
+      </div>
+      <div class="style-sample">
+        <div class="text" style="font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 0.875rem; font-weight: 400; line-height: 1.5;">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">paragraph-small-regular</span>
+          <span class="props">0.875rem / 400</span>
+        </div>
+      </div>
+      </div>
+    </div>
+  `
+};
diff --git a/dss-claude-plugin/commands/dss-init.md b/dss-claude-plugin/commands/dss-init.md
new file mode 100644
index 0000000..f5b3953
--- /dev/null
+++ b/dss-claude-plugin/commands/dss-init.md
@@ -0,0 +1,84 @@
+---
+name: dss-init
+description: Full DSS workflow - reset, structure, analyze, sync, build CSS
+arguments:
+  - name: flags
+    description: Optional flags (--reset, --skip-analysis)
+    required: false
+---
+
+# DSS Init Command - Full Workflow Pipeline
+
+Complete DSS initialization and build pipeline for admin-ui and storybook targets.
+
+## Usage
+
+```
+/dss-init [--reset] [--skip-analysis]
+```
+
+## Full Workflow
+
+1. **Reset** (with --reset flag)
+   - Clears all DSS data, tokens, themes
+   - Resets skins to empty state
+   - Removes generated CSS/stories
+
+2. **Validate Environment**
+   - Python3, Node.js, style-dictionary
+   - FIGMA_TOKEN availability
+
+3. **Create Structure**
+   - `.dss/data/_system/themes/` - CSS output
+   - `.dss/data/_system/tokens/` - Token JSON
+   - Database initialization
+
+4. **Analyze Targets**
+   - admin-ui: web app consumer
+   - storybook: documentation
+
+5. **Figma Sync** (MCP required)
+   - Uses `dss_sync_figma` tool
+   - Populates tokens from Figma
+
+6. **Build CSS**
+   - Runs style-dictionary
+   - Generates tokens.css, _tokens.scss, tokens.json
+
+## Instructions for Claude
+
+When the user runs this command:
+
+1. Execute: `scripts/dss-init.sh [flags]`
+
+2. If status shows "AWAITING FIGMA SYNC":
+   - Run `dss_sync_figma` MCP tool to populate tokens
+   - Re-run `scripts/dss-init.sh` to build CSS
+
+3. If status shows "READY":
+   - admin-ui can import from `.dss/data/_system/themes/`
+
+## Flags
+
+- `--reset`: Clear everything first (fresh start)
+- `--skip-analysis`: Skip code analysis step
+
+## Typical Workflow
+
+```bash
+# Fresh start
+scripts/dss-init.sh --reset
+
+# Populate tokens (MCP tool)
+dss_sync_figma
+
+# Build CSS
+scripts/dss-init.sh
+
+# admin-ui imports from .dss/data/_system/themes/
+```
+
+## Related Commands
+
+- `/dss-figma` - Sync tokens from Figma
+- `/dss-analyze` - Analyze specific project
diff --git a/dss-claude-plugin/commands/dss-reset.md b/dss-claude-plugin/commands/dss-reset.md
new file mode 100644
index 0000000..10e060a
--- /dev/null
+++ b/dss-claude-plugin/commands/dss-reset.md
@@ -0,0 +1,68 @@
+---
+name: dss-reset
+description: Reset DSS to clean state (clear all data, skins, tokens)
+arguments:
+  - name: confirm
+    description: Pass --confirm to execute (otherwise dry-run)
+    required: false
+---
+
+# DSS Reset Command
+
+Clear all DSS data, skins, tokens, and generated files. Returns to clean state awaiting Figma sync.
+
+## Usage
+
+```
+/dss-reset [--confirm]
+```
+
+Without `--confirm`, runs in dry-run mode showing what would be deleted.
+
+## What This Clears
+
+1. `.dss/data/` - Projects, teams, cache, activity
+2. `.dss/dss.db` - SQLite database
+3. `admin-ui/css/dss-*.css` - Generated CSS files
+4. `admin-ui/src/components/*.stories.js` - Generated stories
+5. `admin-ui/src/components/ds-*.js` - Generated components
+6. `dss/core_tokens/tokens.json` - Reset to empty
+7. `dss-claude-plugin/core/skins/*.json` - Reset to awaiting sync
+8. `.dss/logs/` - Clear log files
+
+## Instructions for Claude
+
+When the user runs this command:
+
+1. Check if `--confirm` flag is provided
+2. Execute reset script:
+   ```bash
+   scripts/dss-reset.sh [--confirm]
+   ```
+3. Show what was cleared (or would be cleared in dry-run)
+4. Remind user to run `/dss-init` to re-initialize structure
+
+## Safety
+
+- Default is DRY RUN - no changes unless `--confirm` is passed
+- Regenerates hash manifest after reset
+- Stops any running Storybook processes
+
+## Example Output (Dry Run)
+
+```
+DSS Full Reset
+==========================================
+
+DRY RUN MODE - No changes will be made
+   Run with --confirm to execute
+
+1. Clearing .dss/data/ structure...
+  Would run: rm -rf .dss/data/projects/* ...
+2. Resetting database...
+  Would run: rm -f .dss/dss.db
+...
+
+DRY RUN COMPLETE
+  Run with --confirm to execute
+```
diff --git a/dss-claude-plugin/commands/dss-services.md b/dss-claude-plugin/commands/dss-services.md
new file mode 100644
index 0000000..c0a2408
--- /dev/null
+++ b/dss-claude-plugin/commands/dss-services.md
@@ -0,0 +1,109 @@
+---
+name: dss-services
+description: Manage all DSS development services (API, admin-ui, Storybook)
+arguments:
+  - name: action
+    description: Action to perform (start, stop, status, restart, logs)
+    required: true
+  - name: service
+    description: Specific service (api, admin-ui, storybook) - optional
+    required: false
+---
+
+# DSS Services Command
+
+Manage all DSS development services from a single command.
+
+## Usage
+
+```
+/dss-services <action> [service]
+```
+
+## Actions
+
+| Action | Description |
+|--------|-------------|
+| start | Start all services (or specific service) |
+| stop | Stop all services (or specific service) |
+| status | Show status of all services |
+| restart | Restart all services (or specific service) |
+| logs | Show service logs |
+
+## Services
+
+| Service | Port | Description |
+|---------|------|-------------|
+| api | 8000 | FastAPI REST server |
+| admin-ui | 3456 | Vite dev server |
+| storybook | 6006 | Storybook design docs |
+
+## Examples
+
+```bash
+# Start all services
+/dss-services start
+
+# Check status
+/dss-services status
+
+# Start only the API server
+/dss-services start api
+
+# Stop Storybook
+/dss-services stop storybook
+
+# View admin-ui logs
+/dss-services logs admin-ui
+
+# Restart everything
+/dss-services restart
+```
+
+## Instructions for Claude
+
+When the user runs this command:
+
+1. Execute: `scripts/dss-services.sh <action> [service]`
+
+2. Present the output in a clean format
+
+3. For `status` action, show a table with service states
+
+4. After `start`, provide clickable URLs:
+   - API: http://localhost:8000
+   - admin-ui: http://localhost:3456
+   - Storybook: http://localhost:6006
+
+## Service Details
+
+### API Server (port 8000)
+- FastAPI REST API
+- Endpoints: projects, figma, health, config
+- Command: `uvicorn apps.api.server:app --reload`
+- Log: `/tmp/dss-api.log`
+
+### Admin UI (port 3456)
+- Preact/Vite development server
+- Design system management interface
+- Command: `npm run dev`
+- Log: `/tmp/dss-admin-ui.log`
+
+### Storybook (port 6006)
+- Component documentation
+- Token visualization
+- Command: `npm run storybook`
+- Log: `/tmp/dss-storybook.log`
+
+## Troubleshooting
+
+If a service fails to start:
+1. Check the log file: `/dss-services logs <service>`
+2. Verify port is not in use: `lsof -i :<port>`
+3. Check dependencies are installed
+
+## Related Commands
+
+- `/dss-setup` - Full environment setup
+- `/dss-init` - Initialize DSS structure
+- `/dss-reset` - Reset to clean state
diff --git a/dss-claude-plugin/commands/dss-setup.md b/dss-claude-plugin/commands/dss-setup.md
new file mode 100644
index 0000000..8d81369
--- /dev/null
+++ b/dss-claude-plugin/commands/dss-setup.md
@@ -0,0 +1,70 @@
+---
+name: dss-setup
+description: Complete DSS setup - MCP config, init, and start servers
+arguments:
+  - name: flags
+    description: Optional flags (--reset, --skip-servers)
+    required: false
+---
+
+# DSS Setup Command
+
+Complete DSS environment setup including MCP configuration, initialization, and development servers.
+
+## Usage
+
+```
+/dss-setup [--reset] [--skip-servers]
+```
+
+## What This Does
+
+1. **Generate MCP Config**
+   - Creates `.mcp.json` with absolute paths
+   - Configures DSS MCP server connection
+
+2. **Check Dependencies**
+   - Python venv setup
+   - Node modules installation
+
+3. **Initialize DSS** (calls dss-init.sh)
+   - Directory structure
+   - Database initialization
+   - Target analysis (admin-ui, storybook)
+   - Token structure
+   - Hash manifest
+
+4. **Start Servers**
+   - admin-ui on port 3456
+   - Storybook on port 6006
+
+## Instructions for Claude
+
+When the user runs this command:
+
+1. Execute: `scripts/dss-setup.sh [flags]`
+
+2. After completion, remind user to restart Claude Code to load MCP server
+
+## Flags
+
+- `--reset`: Clear all DSS data first (fresh start)
+- `--skip-servers`: Don't start development servers
+
+## Services
+
+| Service | Port | URL |
+|---------|------|-----|
+| admin-ui | 3456 | http://localhost:3456 |
+| Storybook | 6006 | http://localhost:6006 |
+
+## Logs
+
+- `/tmp/dss-admin-ui.log`
+- `/tmp/dss-storybook.log`
+
+## Related Commands
+
+- `/dss-init` - Initialize DSS structure only
+- `/dss-reset` - Reset to clean state
+- `/dss-figma` - Sync tokens from Figma
diff --git a/dss-claude-plugin/core/skins/base.json b/dss-claude-plugin/core/skins/base.json
index 6ec64f5..907b42e 100644
--- a/dss-claude-plugin/core/skins/base.json
+++ b/dss-claude-plugin/core/skins/base.json
@@ -2,27 +2,7 @@
   "meta": {
     "id": "base",
     "version": "1.0.0",
-    "description": "Foundation tokens shared across all skins"
+    "description": "Base skin - awaiting Figma sync"
   },
-  "tokens": {
-    "colors": {
-      "transparent": "transparent",
-      "current": "currentColor",
-      "white": "#ffffff",
-      "black": "#000000"
-    },
-    "spacing": {
-      "0": "0px",
-      "1": "4px",
-      "2": "8px",
-      "4": "16px",
-      "8": "32px"
-    },
-    "typography": {
-      "fontFamily": {
-        "sans": ["system-ui", "sans-serif"],
-        "mono": ["monospace"]
-      }
-    }
-  }
+  "tokens": {}
 }
diff --git a/dss-claude-plugin/core/skins/classic.json b/dss-claude-plugin/core/skins/classic.json
index a208f5f..7139f4b 100644
--- a/dss-claude-plugin/core/skins/classic.json
+++ b/dss-claude-plugin/core/skins/classic.json
@@ -1,21 +1,9 @@
 {
   "meta": {
     "id": "classic",
-    "version": "2.0.0",
-    "parent": "base"
+    "version": "1.0.0",
+    "description": "Classic skin - awaiting Figma sync",
+    "extends": "base"
   },
-  "tokens": {
-    "colors": {
-      "primary": "#3B82F6",
-      "secondary": "#10B981",
-      "danger": "#EF4444",
-      "background": "#F3F4F6",
-      "surface": "#FFFFFF",
-      "text": "#1F2937"
-    },
-    "borderRadius": {
-      "default": "0.25rem",
-      "lg": "0.5rem"
-    }
-  }
+  "tokens": {}
 }
diff --git a/dss-claude-plugin/core/skins/workbench.json b/dss-claude-plugin/core/skins/workbench.json
index 39b9609..5f28e81 100644
--- a/dss-claude-plugin/core/skins/workbench.json
+++ b/dss-claude-plugin/core/skins/workbench.json
@@ -1,33 +1,9 @@
 {
   "meta": {
     "id": "workbench",
-    "version": "2.0.0",
-    "parent": "base",
-    "description": "High density technical interface skin"
+    "version": "1.0.0",
+    "description": "Workbench skin - awaiting Figma sync",
+    "extends": "base"
   },
-  "tokens": {
-    "colors": {
-      "primary": "#2563EB",
-      "secondary": "#475569",
-      "danger": "#DC2626",
-      "background": "#0F172A",
-      "surface": "#1E293B",
-      "text": "#E2E8F0"
-    },
-    "spacing": {
-      "1": "2px",
-      "2": "4px",
-      "4": "8px",
-      "8": "16px"
-    },
-    "borderRadius": {
-      "default": "0px",
-      "lg": "2px"
-    },
-    "typography": {
-      "fontFamily": {
-        "sans": ["Inter", "system-ui", "sans-serif"]
-      }
-    }
-  }
+  "tokens": {}
 }
diff --git a/dss-claude-plugin/hooks/.state/.git-backup.lock b/dss-claude-plugin/hooks/.state/.git-backup.lock
index 45eeca1..6aa11ab 100644
--- a/dss-claude-plugin/hooks/.state/.git-backup.lock
+++ b/dss-claude-plugin/hooks/.state/.git-backup.lock
@@ -1 +1 @@
-1765316404612
\ No newline at end of file
+1765407101539
\ No newline at end of file
diff --git a/dss-claude-plugin/servers/dss-mcp-server.py b/dss-claude-plugin/servers/dss-mcp-server.py
index b8a8d68..a6242e0 100644
--- a/dss-claude-plugin/servers/dss-mcp-server.py
+++ b/dss-claude-plugin/servers/dss-mcp-server.py
@@ -66,13 +66,19 @@ except ImportError:
 try:
     import dss
     from dss import (
+        # Analyze - Context generation & project graph
         ProjectScanner, ReactAnalyzer, StyleAnalyzer, DependencyGraph, QuickWinFinder,
+        # Ingest - Token sources
         CSSTokenSource, SCSSTokenSource, TailwindTokenSource, JSONTokenSource,
         TokenMerger, MergeStrategy, TokenCollection,
-        StyleDictionaryWrapper, ShadcnWrapper, FigmaWrapper,
+        # Models
         Theme, Project, ProjectMetadata,
+        # Storybook
         StorybookScanner, StoryGenerator, ThemeGenerator,
-        DSSSettings, DSSManager, settings, manager
+        # Settings
+        DSSSettings, DSSManager, settings, manager,
+        # Figma
+        FigmaToolSuite,
     )
     DSS_AVAILABLE = True
 except ImportError as e:
@@ -962,7 +968,10 @@ async def list_tools() -> List[Tool]:
 async def call_tool(name: str, arguments: Dict[str, Any]) -> List[TextContent]:
     """Handle tool calls"""
 
-    if not DSS_AVAILABLE and name.startswith("dss_"):
+    # Tools that work without DSS module imports (use scripts directly)
+    DSS_INDEPENDENT_TOOLS = {"dss_sync_figma", "dss_get_status", "dss_list_themes"}
+
+    if not DSS_AVAILABLE and name.startswith("dss_") and name not in DSS_INDEPENDENT_TOOLS:
         return [TextContent(
             type="text",
             text=json.dumps({
@@ -1430,19 +1439,90 @@ async def setup_storybook(path: str, action: str) -> Dict[str, Any]:
 
 
 async def sync_figma(file_key: str) -> Dict[str, Any]:
-    """Sync tokens from Figma"""
+    """Sync tokens from Figma using intelligent sync v2.0
+
+    Features:
+    - Rate limiting with exponential backoff
+    - Caching with lastModified checks
+    - Figma Variables extraction
+    - W3C token format output
+    - Component variant classification
+    """
     if not file_key:
         return {"success": False, "error": "file_key is required"}
-    figma_token = os.environ.get("FIGMA_TOKEN") or settings.FIGMA_TOKEN
+
+    # Get token from env or config
+    figma_token = os.environ.get("FIGMA_TOKEN")
     if not figma_token:
-        return {"success": False, "error": "FIGMA_TOKEN not configured."}
+        config_path = Path(__file__).parent.parent.parent / ".dss/config/figma.json"
+        if config_path.exists():
+            try:
+                with open(config_path) as f:
+                    config = json.load(f)
+                figma_token = config.get("token")
+            except Exception:
+                pass
+
+    if not figma_token:
+        return {"success": False, "error": "FIGMA_TOKEN not configured. Set env var or add to .dss/config/figma.json"}
+
     try:
-        loop = asyncio.get_event_loop()
-        figma = FigmaWrapper(token=figma_token)
-        result = await loop.run_in_executor(None, lambda: figma.extract_tokens(file_key))
-        return {"success": True, "file_key": file_key, "tokens": safe_serialize(result)}
+        # Import intelligent sync from scripts
+        scripts_dir = Path(__file__).parent.parent.parent / "scripts"
+        sys.path.insert(0, str(scripts_dir))
+
+        from importlib import import_module
+        import importlib.util
+
+        spec = importlib.util.spec_from_file_location("figma_sync", scripts_dir / "figma-sync.py")
+        figma_sync_module = importlib.util.module_from_spec(spec)
+        spec.loader.exec_module(figma_sync_module)
+
+        # Run intelligent sync
+        success = await figma_sync_module.intelligent_sync(
+            file_key=file_key,
+            token=figma_token,
+            force=True,
+            verbose=False
+        )
+
+        if success:
+            # Load results
+            tokens_path = Path(__file__).parent.parent.parent / ".dss/data/_system/tokens/figma-tokens.json"
+            components_path = Path(__file__).parent.parent.parent / ".dss/components/figma-registry.json"
+
+            tokens = {}
+            components = {}
+
+            if tokens_path.exists():
+                with open(tokens_path) as f:
+                    tokens = json.load(f)
+
+            if components_path.exists():
+                with open(components_path) as f:
+                    components = json.load(f)
+
+            token_count = sum(
+                len(v) for k, v in tokens.items()
+                if not k.startswith("$") and not k.startswith("_") and isinstance(v, dict)
+            )
+
+            return {
+                "success": True,
+                "file_key": file_key,
+                "tokens_extracted": token_count,
+                "components_extracted": components.get("component_count", 0),
+                "output_files": {
+                    "tokens": str(tokens_path),
+                    "components": str(components_path)
+                }
+            }
+        else:
+            return {"success": False, "error": "Sync failed - check logs"}
+
     except Exception as e:
-        return {"success": False, "error": str(e)}
+        import traceback
+        return {"success": False, "error": str(e), "traceback": traceback.format_exc()}
 
 
 async def find_quick_wins(path: str) -> Dict[str, Any]:
diff --git a/dss-temp-handover.md b/dss-temp-handover.md
new file mode 100644
index 0000000..deed114
--- /dev/null
+++ b/dss-temp-handover.md
@@ -0,0 +1,59 @@
+### **Situation Handover to Claude**
+
+**Context:** The overarching goal is to enhance DSS (Design System Server) with greater intelligence for analyzing and managing React projects, initially by "dogfooding" DSS itself on its own `admin-ui` project.
+
+**Initial Goal from User:**
+1.  Implement a robust Python-based analysis engine (`project_analyzer.py`) for React projects.
+2.  Integrate this into the DSS MCP and CLI.
+3.  Ensure continuous integration (CI/CD) automates the analysis and commits results (`project_context.json`) back to the repository.
+4.  Set up DSS to manage its own `admin-ui` project.
+5.  Link core DSS to its Figma UI Kit.
+6.  Build a default Storybook skin with DSS atoms and shadcn styles.
+
+---
+
+**Actions Taken & Current Status:**
+
+1.  **Analysis Engine & CLI**:
+    *   **Implemented**: `dss-mvp1/dss/analyze/project_analyzer.py` was created, capable of parsing React/JS/TS files (using a Node.js `@babel/parser` subprocess) and generating a `networkx` graph. It also includes an `export_project_context` function.
+    *   **Implemented**: `dss-mvp1/dss-cli.py` was created as a command-line interface, including `analyze`, `export-context`, `add-figma-file`, `setup-storybook`, and `sync-tokens` commands.
+    *   **Implemented**: The `dss-claude-plugin/servers/dss-mcp-server.py` was updated to expose `dss_project_graph_analysis` and `dss_project_export_context` as MCP tools for AI agents.
+    *   **Implemented**: Unit tests for `project_analyzer.py` were added and are currently passing.
+
+2.  **CI/CD Setup**:
+    *   **Implemented**: `.gitea/workflows/dss-analysis.yml` was created to automate the `dss-cli.py analyze` and `git commit` process for `project_context.json` on every push.
+    *   **Verified**: Git hooks were fixed and confirmed to be running.
+    *   **Verified**: SSH key authentication for Git push was correctly set up after troubleshooting.
+
+3.  **Dogfooding `admin-ui` Project**:
+    *   **Goal**: Initialize `admin-ui` as a DSS project, generate its analysis context, link it to Figma, and generate Storybook stories.
+    *   **Status**:
+        *   `admin-ui/.dss/analysis_graph.json` was successfully created (by `dss-mvp1/dss-cli.py analyze --project-path ./admin-ui`).
+        *   `admin-ui/ds.config.json` was manually corrected and populated to resolve Pydantic validation errors during project loading.
+        *   Figma UI Kit `figd_ScdBk47HlYEItZbQv2CcF9aq-3TfWbBXN3yoRKWA` was successfully linked to `admin-ui` (by `dss-mvp1/dss-cli.py add-figma-file --project-path ./admin-ui --file-key ...`).
+        *   **Token Synchronization (Blocked)**: `dss-mvp1/dss-cli.py sync-tokens --project-path ./admin-ui` fails with `403 Client Error: Forbidden` from Figma API due to a placeholder token. This is expected, as a valid `FIGMA_TOKEN` environment variable is required.
+
+4.  **Storybook Generation (Current Blocker)**:
+    *   **Goal**: Build a default Storybook skin with DSS atoms and shadcn styles applied.
+    *   **Expected Tool**: `dss-mvp1/dss-cli.py setup-storybook --action generate --project-path ./admin-ui`.
+    *   **Problem**: This command consistently reports `Generated 0 new stories.`
+    *   **Investigation**:
+        *   Initial assumption that `dss-mvp1` itself contained components was incorrect.
+        *   Moved `admin-ui/js/components/ds-button.js` to `admin-ui/src/components/ds-button.js` to match component discovery paths.
+        *   Re-read `dss/storybook/generator.py` to confirm its logic. It expects components in standard directories like `src/components`.
+        *   Confirmed that `StoryGenerator.generate` calls `generate_stories_for_directory`, which in turn calls `_parse_component`.
+        *   Despite placing `ds-button.js` in a recognized path, `0 new stories` are still being generated.
+        *   The `StoryGenerator` logic in `dss/storybook/generator.py` inspects component files, but it relies on specific patterns (e.g., `interface ButtonProps`, `children`) to extract `PropInfo` and `ComponentMeta`. The output of `@babel/parser` is not currently being used by `StoryGenerator` to populate `ComponentMeta`.
+
+**The core issue preventing Storybook generation is that the `StoryGenerator` is unable to correctly parse the provided JavaScript/TypeScript component files and extract the necessary metadata (props, component name, etc.) to create a story.** The integration between the `@babel/parser` output (which is JSON AST) and the `StoryGenerator`'s `_parse_component` method is either missing or misconfigured. The `_parse_component` method appears to be using regex on the raw file content, which might be insufficient or incorrect for the component's structure.
+
+---
+
+**Recommendation for Claude:**
+
+1.  **Investigate `dss/storybook/generator.py`**: Focus on the `_parse_component` method. How does it extract `ComponentMeta` from the component file? It currently uses regex, which is fragile.
+2.  **Integrate Babel AST**: The `@babel/parser` subprocess call already produces a full AST. The `_parse_component` method should be updated to consume and interpret this AST to reliably extract component metadata (name, props, children, description). This would be much more robust than regex.
+3.  **Validate Component Structure**: Ensure the `ds-button.js` (or any target component) has a structure that the updated parser can understand and extract metadata from.
+4.  **Re-run Storybook Generation**: Once `_parse_component` can correctly extract metadata, re-run `setup-storybook --action generate` to confirm stories are created.
+
+I have included the contents of `dss/storybook/generator.py` for direct reference.
\ No newline at end of file
diff --git a/dss/__init__.py b/dss/__init__.py
index b73c883..f72c35d 100644
--- a/dss/__init__.py
+++ b/dss/__init__.py
@@ -44,6 +44,10 @@ from dss.analyze.base import (
     StylingApproach,
 )
 from dss.analyze.scanner import ProjectScanner
+from dss.analyze.react import ReactAnalyzer
+from dss.analyze.styles import StyleAnalyzer
+from dss.analyze.graph import DependencyGraph
+from dss.analyze.quick_wins import QuickWinFinder
 
 # Ingest
 from dss.ingest.base import (
@@ -53,6 +57,11 @@ from dss.ingest.base import (
     TokenType,
     TokenCategory,
 )
+from dss.ingest.css import CSSTokenSource
+from dss.ingest.scss import SCSSTokenSource
+from dss.ingest.tailwind import TailwindTokenSource
+from dss.ingest.json_tokens import JSONTokenSource
+from dss.ingest.merge import TokenMerger, MergeStrategy
 
 # Export/Import
 from dss.export_import.service import DSSArchiveExporter, DSSArchiveImporter
@@ -61,6 +70,7 @@ from dss.export_import.merger import SmartMerger
 # Storybook
 from dss.storybook.generator import StoryGenerator
 from dss.storybook.scanner import StorybookScanner
+from dss.storybook.theme import ThemeGenerator
 
 # Translations
 from dss.translations import TranslationDictionary, TokenResolver
@@ -79,7 +89,7 @@ from dss.project.manager import DSSProject
 # Models
 from dss.models.theme import Theme
 from dss.models.component import Component
-from dss.models.project import Project
+from dss.models.project import Project, ProjectMetadata
 
 # Validators
 from dss.validators.schema import ProjectValidator, ValidationResult
@@ -116,12 +126,22 @@ __all__ = [
     "Framework",
     "StylingApproach",
     "ProjectScanner",
+    "ReactAnalyzer",
+    "StyleAnalyzer",
+    "DependencyGraph",
+    "QuickWinFinder",
     # Ingest
     "DesignToken",
     "TokenCollection",
     "TokenSource",
     "TokenType",
     "TokenCategory",
+    "CSSTokenSource",
+    "SCSSTokenSource",
+    "TailwindTokenSource",
+    "JSONTokenSource",
+    "TokenMerger",
+    "MergeStrategy",
     # Export/Import
     "DSSArchiveExporter",
     "DSSArchiveImporter",
@@ -129,6 +149,7 @@ __all__ = [
     # Storybook
     "StoryGenerator",
     "StorybookScanner",
+    "ThemeGenerator",
     # Translations
     "TranslationDictionary",
     "TokenResolver",
@@ -145,6 +166,7 @@ __all__ = [
     "Theme",
     "Component",
     "Project",
+    "ProjectMetadata",
     # Validators
     "ProjectValidator",
     "ValidationResult",
diff --git a/dss/core_tokens/tokens.json b/dss/core_tokens/tokens.json
index 51d6448..07d27c2 100644
--- a/dss/core_tokens/tokens.json
+++ b/dss/core_tokens/tokens.json
@@ -1,5868 +1,9 @@
 {
-  "version": "1.0.0",
-  "source": "figma",
-  "figma_file": "evCZlaeZrP7X20NIViSJbl",
-  "synced_at": "2025-12-09T12:50:40.840869",
-  "categories": {
-    "color": {
-      "neutral.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9803921580314636,
-            "g": 0.9803921580314636,
-            "b": 0.9803921580314636,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:101",
-        "type": "variable"
-      },
-      "neutral.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9607843160629272,
-            "g": 0.9607843160629272,
-            "b": 0.9607843160629272,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:102",
-        "type": "variable"
-      },
-      "neutral.200": {
-        "value": {
-          "6:0": {
-            "r": 0.8980392217636108,
-            "g": 0.8980392217636108,
-            "b": 0.8980392217636108,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:103",
-        "type": "variable"
-      },
-      "neutral.300": {
-        "value": {
-          "6:0": {
-            "r": 0.8313725590705872,
-            "g": 0.8313725590705872,
-            "b": 0.8313725590705872,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:104",
-        "type": "variable"
-      },
-      "neutral.400": {
-        "value": {
-          "6:0": {
-            "r": 0.6392157077789307,
-            "g": 0.6392157077789307,
-            "b": 0.6392157077789307,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:105",
-        "type": "variable"
-      },
-      "neutral.500": {
-        "value": {
-          "6:0": {
-            "r": 0.45098039507865906,
-            "g": 0.45098039507865906,
-            "b": 0.45098039507865906,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:106",
-        "type": "variable"
-      },
-      "neutral.600": {
-        "value": {
-          "6:0": {
-            "r": 0.32156863808631897,
-            "g": 0.32156863808631897,
-            "b": 0.32156863808631897,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:107",
-        "type": "variable"
-      },
-      "neutral.700": {
-        "value": {
-          "6:0": {
-            "r": 0.250980406999588,
-            "g": 0.250980406999588,
-            "b": 0.250980406999588,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:108",
-        "type": "variable"
-      },
-      "neutral.800": {
-        "value": {
-          "6:0": {
-            "r": 0.14901961386203766,
-            "g": 0.14901961386203766,
-            "b": 0.14901961386203766,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:109",
-        "type": "variable"
-      },
-      "neutral.900": {
-        "value": {
-          "6:0": {
-            "r": 0.09019608050584793,
-            "g": 0.09019608050584793,
-            "b": 0.09019608050584793,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:110",
-        "type": "variable"
-      },
-      "neutral.950": {
-        "value": {
-          "6:0": {
-            "r": 0.03921568766236305,
-            "g": 0.03921568766236305,
-            "b": 0.03921568766236305,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:6:111",
-        "type": "variable"
-      },
-      "red.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.9490196108818054,
-            "b": 0.9490196108818054,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1991",
-        "type": "variable"
-      },
-      "red.100": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 0.886274516582489,
-            "b": 0.886274516582489,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1992",
-        "type": "variable"
-      },
-      "red.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.7921568751335144,
-            "b": 0.7921568751335144,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1993",
-        "type": "variable"
-      },
-      "red.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9882352948188782,
-            "g": 0.6470588445663452,
-            "b": 0.6470588445663452,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1994",
-        "type": "variable"
-      },
-      "red.400": {
-        "value": {
-          "6:0": {
-            "r": 0.9725490212440491,
-            "g": 0.4431372582912445,
-            "b": 0.4431372582912445,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1995",
-        "type": "variable"
-      },
-      "red.500": {
-        "value": {
-          "6:0": {
-            "r": 0.9372549057006836,
-            "g": 0.2666666805744171,
-            "b": 0.2666666805744171,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1996",
-        "type": "variable"
-      },
-      "red.600": {
-        "value": {
-          "6:0": {
-            "r": 0.8627451062202454,
-            "g": 0.14901961386203766,
-            "b": 0.14901961386203766,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1997",
-        "type": "variable"
-      },
-      "red.700": {
-        "value": {
-          "6:0": {
-            "r": 0.7254902124404907,
-            "g": 0.10980392247438431,
-            "b": 0.10980392247438431,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1998",
-        "type": "variable"
-      },
-      "red.800": {
-        "value": {
-          "6:0": {
-            "r": 0.6000000238418579,
-            "g": 0.10588235408067703,
-            "b": 0.10588235408067703,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:1999",
-        "type": "variable"
-      },
-      "red.900": {
-        "value": {
-          "6:0": {
-            "r": 0.49803921580314636,
-            "g": 0.11372549086809158,
-            "b": 0.11372549086809158,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2000",
-        "type": "variable"
-      },
-      "red.950": {
-        "value": {
-          "6:0": {
-            "r": 0.2705882489681244,
-            "g": 0.03921568766236305,
-            "b": 0.03921568766236305,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2001",
-        "type": "variable"
-      },
-      "blue.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9372549057006836,
-            "g": 0.9647058844566345,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2013",
-        "type": "variable"
-      },
-      "blue.100": {
-        "value": {
-          "6:0": {
-            "r": 0.8588235378265381,
-            "g": 0.9176470637321472,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2014",
-        "type": "variable"
-      },
-      "blue.200": {
-        "value": {
-          "6:0": {
-            "r": 0.7490196228027344,
-            "g": 0.8588235378265381,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2015",
-        "type": "variable"
-      },
-      "blue.300": {
-        "value": {
-          "6:0": {
-            "r": 0.5764706134796143,
-            "g": 0.772549033164978,
-            "b": 0.9921568632125854,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2016",
-        "type": "variable"
-      },
-      "blue.400": {
-        "value": {
-          "6:0": {
-            "r": 0.3764705955982208,
-            "g": 0.6470588445663452,
-            "b": 0.9803921580314636,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2017",
-        "type": "variable"
-      },
-      "blue.500": {
-        "value": {
-          "6:0": {
-            "r": 0.23137255012989044,
-            "g": 0.5098039507865906,
-            "b": 0.9647058844566345,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2018",
-        "type": "variable"
-      },
-      "blue.600": {
-        "value": {
-          "6:0": {
-            "r": 0.14509804546833038,
-            "g": 0.38823530077934265,
-            "b": 0.9215686321258545,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2019",
-        "type": "variable"
-      },
-      "blue.700": {
-        "value": {
-          "6:0": {
-            "r": 0.11372549086809158,
-            "g": 0.30588236451148987,
-            "b": 0.8470588326454163,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2020",
-        "type": "variable"
-      },
-      "blue.800": {
-        "value": {
-          "6:0": {
-            "r": 0.11764705926179886,
-            "g": 0.250980406999588,
-            "b": 0.686274528503418,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2021",
-        "type": "variable"
-      },
-      "blue.900": {
-        "value": {
-          "6:0": {
-            "r": 0.11764705926179886,
-            "g": 0.22745098173618317,
-            "b": 0.5411764979362488,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2022",
-        "type": "variable"
-      },
-      "blue.950": {
-        "value": {
-          "6:0": {
-            "r": 0.09019608050584793,
-            "g": 0.14509804546833038,
-            "b": 0.3294117748737335,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:16:2023",
-        "type": "variable"
-      },
-      "white": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:55:5102",
-        "type": "variable"
-      },
-      "color": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:24:3454",
-        "type": "variable"
-      },
-      "black": {
-        "value": {
-          "6:0": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:55:5103",
-        "type": "variable"
-      },
-      "slate.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9725490212440491,
-            "g": 0.9803921580314636,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30311",
-        "type": "variable"
-      },
-      "slate.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9450980424880981,
-            "g": 0.9607843160629272,
-            "b": 0.9764705896377563,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30312",
-        "type": "variable"
-      },
-      "slate.200": {
-        "value": {
-          "6:0": {
-            "r": 0.886274516582489,
-            "g": 0.9098039269447327,
-            "b": 0.9411764740943909,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30313",
-        "type": "variable"
-      },
-      "slate.300": {
-        "value": {
-          "6:0": {
-            "r": 0.7960784435272217,
-            "g": 0.8352941274642944,
-            "b": 0.8823529481887817,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30314",
-        "type": "variable"
-      },
-      "slate.400": {
-        "value": {
-          "6:0": {
-            "r": 0.5803921818733215,
-            "g": 0.6392157077789307,
-            "b": 0.7215686440467834,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30315",
-        "type": "variable"
-      },
-      "slate.500": {
-        "value": {
-          "6:0": {
-            "r": 0.3921568691730499,
-            "g": 0.45490196347236633,
-            "b": 0.545098066329956,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30316",
-        "type": "variable"
-      },
-      "slate.600": {
-        "value": {
-          "6:0": {
-            "r": 0.27843138575553894,
-            "g": 0.3333333432674408,
-            "b": 0.4117647111415863,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30317",
-        "type": "variable"
-      },
-      "slate.700": {
-        "value": {
-          "6:0": {
-            "r": 0.20000000298023224,
-            "g": 0.2549019753932953,
-            "b": 0.3333333432674408,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30318",
-        "type": "variable"
-      },
-      "slate.800": {
-        "value": {
-          "6:0": {
-            "r": 0.11764705926179886,
-            "g": 0.16078431904315948,
-            "b": 0.23137255012989044,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30319",
-        "type": "variable"
-      },
-      "slate.900": {
-        "value": {
-          "6:0": {
-            "r": 0.05882352963089943,
-            "g": 0.09019608050584793,
-            "b": 0.16470588743686676,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30320",
-        "type": "variable"
-      },
-      "slate.950": {
-        "value": {
-          "6:0": {
-            "r": 0.007843137718737125,
-            "g": 0.0235294122248888,
-            "b": 0.09019608050584793,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30321",
-        "type": "variable"
-      },
-      "gray.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9764705896377563,
-            "g": 0.9803921580314636,
-            "b": 0.9843137264251709,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30322",
-        "type": "variable"
-      },
-      "gray.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9529411792755127,
-            "g": 0.95686274766922,
-            "b": 0.9647058844566345,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30323",
-        "type": "variable"
-      },
-      "gray.200": {
-        "value": {
-          "6:0": {
-            "r": 0.8980392217636108,
-            "g": 0.9058823585510254,
-            "b": 0.9215686321258545,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30324",
-        "type": "variable"
-      },
-      "gray.300": {
-        "value": {
-          "6:0": {
-            "r": 0.8196078538894653,
-            "g": 0.8352941274642944,
-            "b": 0.8588235378265381,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30325",
-        "type": "variable"
-      },
-      "gray.400": {
-        "value": {
-          "6:0": {
-            "r": 0.6117647290229797,
-            "g": 0.6392157077789307,
-            "b": 0.686274528503418,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30326",
-        "type": "variable"
-      },
-      "gray.500": {
-        "value": {
-          "6:0": {
-            "r": 0.41960784792900085,
-            "g": 0.4470588266849518,
-            "b": 0.501960813999176,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30327",
-        "type": "variable"
-      },
-      "gray.600": {
-        "value": {
-          "6:0": {
-            "r": 0.29411765933036804,
-            "g": 0.3333333432674408,
-            "b": 0.38823530077934265,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30328",
-        "type": "variable"
-      },
-      "gray.700": {
-        "value": {
-          "6:0": {
-            "r": 0.21568627655506134,
-            "g": 0.2549019753932953,
-            "b": 0.3176470696926117,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30329",
-        "type": "variable"
-      },
-      "gray.800": {
-        "value": {
-          "6:0": {
-            "r": 0.12156862765550613,
-            "g": 0.16078431904315948,
-            "b": 0.21568627655506134,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30330",
-        "type": "variable"
-      },
-      "gray.900": {
-        "value": {
-          "6:0": {
-            "r": 0.06666667014360428,
-            "g": 0.0941176488995552,
-            "b": 0.15294118225574493,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30331",
-        "type": "variable"
-      },
-      "gray.950": {
-        "value": {
-          "6:0": {
-            "r": 0.0117647061124444,
-            "g": 0.027450980618596077,
-            "b": 0.07058823853731155,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30332",
-        "type": "variable"
-      },
-      "zinc.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9803921580314636,
-            "g": 0.9803921580314636,
-            "b": 0.9803921580314636,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30333",
-        "type": "variable"
-      },
-      "zinc.100": {
-        "value": {
-          "6:0": {
-            "r": 0.95686274766922,
-            "g": 0.95686274766922,
-            "b": 0.9607843160629272,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30334",
-        "type": "variable"
-      },
-      "zinc.200": {
-        "value": {
-          "6:0": {
-            "r": 0.8941176533699036,
-            "g": 0.8941176533699036,
-            "b": 0.9058823585510254,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30335",
-        "type": "variable"
-      },
-      "zinc.300": {
-        "value": {
-          "6:0": {
-            "r": 0.8313725590705872,
-            "g": 0.8313725590705872,
-            "b": 0.8470588326454163,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30336",
-        "type": "variable"
-      },
-      "zinc.400": {
-        "value": {
-          "6:0": {
-            "r": 0.6313725709915161,
-            "g": 0.6313725709915161,
-            "b": 0.6666666865348816,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30337",
-        "type": "variable"
-      },
-      "zinc.500": {
-        "value": {
-          "6:0": {
-            "r": 0.4431372582912445,
-            "g": 0.4431372582912445,
-            "b": 0.47843137383461,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30338",
-        "type": "variable"
-      },
-      "zinc.600": {
-        "value": {
-          "6:0": {
-            "r": 0.32156863808631897,
-            "g": 0.32156863808631897,
-            "b": 0.35686275362968445,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30339",
-        "type": "variable"
-      },
-      "zinc.700": {
-        "value": {
-          "6:0": {
-            "r": 0.24705882370471954,
-            "g": 0.24705882370471954,
-            "b": 0.27450981736183167,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30340",
-        "type": "variable"
-      },
-      "zinc.800": {
-        "value": {
-          "6:0": {
-            "r": 0.15294118225574493,
-            "g": 0.15294118225574493,
-            "b": 0.16470588743686676,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30341",
-        "type": "variable"
-      },
-      "zinc.900": {
-        "value": {
-          "6:0": {
-            "r": 0.0941176488995552,
-            "g": 0.0941176488995552,
-            "b": 0.10588235408067703,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30342",
-        "type": "variable"
-      },
-      "zinc.950": {
-        "value": {
-          "6:0": {
-            "r": 0.03529411926865578,
-            "g": 0.03529411926865578,
-            "b": 0.04313725605607033,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30343",
-        "type": "variable"
-      },
-      "stone.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9803921580314636,
-            "g": 0.9803921580314636,
-            "b": 0.9764705896377563,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30344",
-        "type": "variable"
-      },
-      "stone.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9607843160629272,
-            "g": 0.9607843160629272,
-            "b": 0.95686274766922,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30345",
-        "type": "variable"
-      },
-      "stone.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9058823585510254,
-            "g": 0.8980392217636108,
-            "b": 0.8941176533699036,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30346",
-        "type": "variable"
-      },
-      "stone.300": {
-        "value": {
-          "6:0": {
-            "r": 0.8392156958580017,
-            "g": 0.8274509906768799,
-            "b": 0.8196078538894653,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30347",
-        "type": "variable"
-      },
-      "stone.400": {
-        "value": {
-          "6:0": {
-            "r": 0.658823549747467,
-            "g": 0.6352941393852234,
-            "b": 0.6196078658103943,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30348",
-        "type": "variable"
-      },
-      "stone.500": {
-        "value": {
-          "6:0": {
-            "r": 0.47058823704719543,
-            "g": 0.4431372582912445,
-            "b": 0.42352941632270813,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30349",
-        "type": "variable"
-      },
-      "stone.600": {
-        "value": {
-          "6:0": {
-            "r": 0.34117648005485535,
-            "g": 0.32549020648002625,
-            "b": 0.30588236451148987,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30350",
-        "type": "variable"
-      },
-      "stone.700": {
-        "value": {
-          "6:0": {
-            "r": 0.2666666805744171,
-            "g": 0.250980406999588,
-            "b": 0.23529411852359772,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30351",
-        "type": "variable"
-      },
-      "stone.800": {
-        "value": {
-          "6:0": {
-            "r": 0.16078431904315948,
-            "g": 0.14509804546833038,
-            "b": 0.1411764770746231,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30352",
-        "type": "variable"
-      },
-      "stone.900": {
-        "value": {
-          "6:0": {
-            "r": 0.10980392247438431,
-            "g": 0.09803921729326248,
-            "b": 0.09019608050584793,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30353",
-        "type": "variable"
-      },
-      "stone.950": {
-        "value": {
-          "6:0": {
-            "r": 0.0470588244497776,
-            "g": 0.03921568766236305,
-            "b": 0.03529411926865578,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30354",
-        "type": "variable"
-      },
-      "orange.50": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 0.9686274528503418,
-            "b": 0.929411768913269,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30355",
-        "type": "variable"
-      },
-      "orange.100": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30356",
-        "type": "variable"
-      },
-      "orange.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.843137264251709,
-            "b": 0.6666666865348816,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30357",
-        "type": "variable"
-      },
-      "orange.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9921568632125854,
-            "g": 0.729411780834198,
-            "b": 0.45490196347236633,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30358",
-        "type": "variable"
-      },
-      "orange.400": {
-        "value": {
-          "6:0": {
-            "r": 0.9843137264251709,
-            "g": 0.572549045085907,
-            "b": 0.23529411852359772,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30359",
-        "type": "variable"
-      },
-      "orange.500": {
-        "value": {
-          "6:0": {
-            "r": 0.9764705896377563,
-            "g": 0.45098039507865906,
-            "b": 0.08627451211214066,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30360",
-        "type": "variable"
-      },
-      "orange.600": {
-        "value": {
-          "6:0": {
-            "r": 0.9176470637321472,
-            "g": 0.3450980484485626,
-            "b": 0.0470588244497776,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30361",
-        "type": "variable"
-      },
-      "orange.700": {
-        "value": {
-          "6:0": {
-            "r": 0.7607843279838562,
-            "g": 0.2549019753932953,
-            "b": 0.0470588244497776,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30362",
-        "type": "variable"
-      },
-      "orange.800": {
-        "value": {
-          "6:0": {
-            "r": 0.6039215922355652,
-            "g": 0.20392157137393951,
-            "b": 0.07058823853731155,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30363",
-        "type": "variable"
-      },
-      "orange.900": {
-        "value": {
-          "6:0": {
-            "r": 0.48627451062202454,
-            "g": 0.1764705926179886,
-            "b": 0.07058823853731155,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30364",
-        "type": "variable"
-      },
-      "orange.950": {
-        "value": {
-          "6:0": {
-            "r": 0.26274511218070984,
-            "g": 0.0784313753247261,
-            "b": 0.027450980618596077,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30365",
-        "type": "variable"
-      },
-      "amber.50": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 0.9843137264251709,
-            "b": 0.9215686321258545,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30366",
-        "type": "variable"
-      },
-      "amber.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.9529411792755127,
-            "b": 0.7803921699523926,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30367",
-        "type": "variable"
-      },
-      "amber.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9921568632125854,
-            "g": 0.9019607901573181,
-            "b": 0.5411764979362488,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30368",
-        "type": "variable"
-      },
-      "amber.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9882352948188782,
-            "g": 0.8274509906768799,
-            "b": 0.3019607961177826,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30369",
-        "type": "variable"
-      },
-      "amber.400": {
-        "value": {
-          "6:0": {
-            "r": 0.9843137264251709,
-            "g": 0.7490196228027344,
-            "b": 0.1411764770746231,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30370",
-        "type": "variable"
-      },
-      "amber.500": {
-        "value": {
-          "6:0": {
-            "r": 0.9607843160629272,
-            "g": 0.6196078658103943,
-            "b": 0.04313725605607033,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30371",
-        "type": "variable"
-      },
-      "amber.600": {
-        "value": {
-          "6:0": {
-            "r": 0.8509804010391235,
-            "g": 0.46666666865348816,
-            "b": 0.0235294122248888,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30372",
-        "type": "variable"
-      },
-      "amber.700": {
-        "value": {
-          "6:0": {
-            "r": 0.7058823704719543,
-            "g": 0.32549020648002625,
-            "b": 0.03529411926865578,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30373",
-        "type": "variable"
-      },
-      "amber.800": {
-        "value": {
-          "6:0": {
-            "r": 0.572549045085907,
-            "g": 0.250980406999588,
-            "b": 0.054901961237192154,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30374",
-        "type": "variable"
-      },
-      "amber.900": {
-        "value": {
-          "6:0": {
-            "r": 0.47058823704719543,
-            "g": 0.2078431397676468,
-            "b": 0.05882352963089943,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30375",
-        "type": "variable"
-      },
-      "amber.950": {
-        "value": {
-          "6:0": {
-            "r": 0.2705882489681244,
-            "g": 0.10196078568696976,
-            "b": 0.0117647061124444,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30376",
-        "type": "variable"
-      },
-      "lime.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9686274528503418,
-            "g": 0.9960784316062927,
-            "b": 0.9058823585510254,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30377",
-        "type": "variable"
-      },
-      "lime.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9254902005195618,
-            "g": 0.9882352948188782,
-            "b": 0.7960784435272217,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30378",
-        "type": "variable"
-      },
-      "lime.200": {
-        "value": {
-          "6:0": {
-            "r": 0.8509804010391235,
-            "g": 0.9764705896377563,
-            "b": 0.615686297416687,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30379",
-        "type": "variable"
-      },
-      "lime.300": {
-        "value": {
-          "6:0": {
-            "r": 0.7450980544090271,
-            "g": 0.9490196108818054,
-            "b": 0.3921568691730499,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30380",
-        "type": "variable"
-      },
-      "lime.400": {
-        "value": {
-          "6:0": {
-            "r": 0.6392157077789307,
-            "g": 0.9019607901573181,
-            "b": 0.2078431397676468,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30381",
-        "type": "variable"
-      },
-      "lime.500": {
-        "value": {
-          "6:0": {
-            "r": 0.5176470875740051,
-            "g": 0.800000011920929,
-            "b": 0.08627451211214066,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30382",
-        "type": "variable"
-      },
-      "lime.600": {
-        "value": {
-          "6:0": {
-            "r": 0.3960784375667572,
-            "g": 0.6392157077789307,
-            "b": 0.05098039284348488,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30383",
-        "type": "variable"
-      },
-      "lime.700": {
-        "value": {
-          "6:0": {
-            "r": 0.3019607961177826,
-            "g": 0.48627451062202454,
-            "b": 0.05882352963089943,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30384",
-        "type": "variable"
-      },
-      "lime.800": {
-        "value": {
-          "6:0": {
-            "r": 0.24705882370471954,
-            "g": 0.3843137323856354,
-            "b": 0.07058823853731155,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30385",
-        "type": "variable"
-      },
-      "lime.900": {
-        "value": {
-          "6:0": {
-            "r": 0.21176470816135406,
-            "g": 0.32549020648002625,
-            "b": 0.0784313753247261,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30386",
-        "type": "variable"
-      },
-      "lime.950": {
-        "value": {
-          "6:0": {
-            "r": 0.10196078568696976,
-            "g": 0.18039216101169586,
-            "b": 0.019607843831181526,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30387",
-        "type": "variable"
-      },
-      "emerald.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9254902005195618,
-            "g": 0.9921568632125854,
-            "b": 0.9607843160629272,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30388",
-        "type": "variable"
-      },
-      "emerald.100": {
-        "value": {
-          "6:0": {
-            "r": 0.8196078538894653,
-            "g": 0.9803921580314636,
-            "b": 0.8980392217636108,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30389",
-        "type": "variable"
-      },
-      "emerald.200": {
-        "value": {
-          "6:0": {
-            "r": 0.6549019813537598,
-            "g": 0.9529411792755127,
-            "b": 0.8156862854957581,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30390",
-        "type": "variable"
-      },
-      "emerald.300": {
-        "value": {
-          "6:0": {
-            "r": 0.4313725531101227,
-            "g": 0.9058823585510254,
-            "b": 0.7176470756530762,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30391",
-        "type": "variable"
-      },
-      "emerald.400": {
-        "value": {
-          "6:0": {
-            "r": 0.20392157137393951,
-            "g": 0.8274509906768799,
-            "b": 0.6000000238418579,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30392",
-        "type": "variable"
-      },
-      "emerald.500": {
-        "value": {
-          "6:0": {
-            "r": 0.062745101749897,
-            "g": 0.7254902124404907,
-            "b": 0.5058823823928833,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30393",
-        "type": "variable"
-      },
-      "emerald.600": {
-        "value": {
-          "6:0": {
-            "r": 0.019607843831181526,
-            "g": 0.5882353186607361,
-            "b": 0.4117647111415863,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30394",
-        "type": "variable"
-      },
-      "emerald.700": {
-        "value": {
-          "6:0": {
-            "r": 0.01568627543747425,
-            "g": 0.47058823704719543,
-            "b": 0.34117648005485535,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30395",
-        "type": "variable"
-      },
-      "emerald.800": {
-        "value": {
-          "6:0": {
-            "r": 0.0235294122248888,
-            "g": 0.37254902720451355,
-            "b": 0.27450981736183167,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30396",
-        "type": "variable"
-      },
-      "emerald.900": {
-        "value": {
-          "6:0": {
-            "r": 0.0235294122248888,
-            "g": 0.30588236451148987,
-            "b": 0.23137255012989044,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30397",
-        "type": "variable"
-      },
-      "emerald.950": {
-        "value": {
-          "6:0": {
-            "r": 0.007843137718737125,
-            "g": 0.1725490242242813,
-            "b": 0.13333334028720856,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30398",
-        "type": "variable"
-      },
-      "teal.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9411764740943909,
-            "g": 0.9921568632125854,
-            "b": 0.9803921580314636,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30399",
-        "type": "variable"
-      },
-      "teal.100": {
-        "value": {
-          "6:0": {
-            "r": 0.800000011920929,
-            "g": 0.9843137264251709,
-            "b": 0.9450980424880981,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30400",
-        "type": "variable"
-      },
-      "teal.200": {
-        "value": {
-          "6:0": {
-            "r": 0.6000000238418579,
-            "g": 0.9647058844566345,
-            "b": 0.8941176533699036,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30401",
-        "type": "variable"
-      },
-      "teal.300": {
-        "value": {
-          "6:0": {
-            "r": 0.3686274588108063,
-            "g": 0.9176470637321472,
-            "b": 0.8313725590705872,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30402",
-        "type": "variable"
-      },
-      "teal.400": {
-        "value": {
-          "6:0": {
-            "r": 0.1764705926179886,
-            "g": 0.8313725590705872,
-            "b": 0.7490196228027344,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30403",
-        "type": "variable"
-      },
-      "teal.500": {
-        "value": {
-          "6:0": {
-            "r": 0.0784313753247261,
-            "g": 0.7215686440467834,
-            "b": 0.6509804129600525,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30404",
-        "type": "variable"
-      },
-      "teal.600": {
-        "value": {
-          "6:0": {
-            "r": 0.05098039284348488,
-            "g": 0.5803921818733215,
-            "b": 0.5333333611488342,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30405",
-        "type": "variable"
-      },
-      "teal.700": {
-        "value": {
-          "6:0": {
-            "r": 0.05882352963089943,
-            "g": 0.4627451002597809,
-            "b": 0.4313725531101227,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30406",
-        "type": "variable"
-      },
-      "teal.800": {
-        "value": {
-          "6:0": {
-            "r": 0.06666667014360428,
-            "g": 0.3686274588108063,
-            "b": 0.3490196168422699,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30407",
-        "type": "variable"
-      },
-      "teal.900": {
-        "value": {
-          "6:0": {
-            "r": 0.07450980693101883,
-            "g": 0.30588236451148987,
-            "b": 0.29019609093666077,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30408",
-        "type": "variable"
-      },
-      "teal.950": {
-        "value": {
-          "6:0": {
-            "r": 0.01568627543747425,
-            "g": 0.18431372940540314,
-            "b": 0.18039216101169586,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30409",
-        "type": "variable"
-      },
-      "cyan.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9254902005195618,
-            "g": 0.9960784316062927,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30410",
-        "type": "variable"
-      },
-      "cyan.100": {
-        "value": {
-          "6:0": {
-            "r": 0.8117647171020508,
-            "g": 0.9803921580314636,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30411",
-        "type": "variable"
-      },
-      "cyan.200": {
-        "value": {
-          "6:0": {
-            "r": 0.6470588445663452,
-            "g": 0.9529411792755127,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30412",
-        "type": "variable"
-      },
-      "cyan.300": {
-        "value": {
-          "6:0": {
-            "r": 0.40392157435417175,
-            "g": 0.9098039269447327,
-            "b": 0.9764705896377563,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30413",
-        "type": "variable"
-      },
-      "cyan.400": {
-        "value": {
-          "6:0": {
-            "r": 0.13333334028720856,
-            "g": 0.8274509906768799,
-            "b": 0.9333333373069763,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30414",
-        "type": "variable"
-      },
-      "cyan.500": {
-        "value": {
-          "6:0": {
-            "r": 0.0235294122248888,
-            "g": 0.7137255072593689,
-            "b": 0.8313725590705872,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30415",
-        "type": "variable"
-      },
-      "cyan.600": {
-        "value": {
-          "6:0": {
-            "r": 0.0313725508749485,
-            "g": 0.5686274766921997,
-            "b": 0.6980392336845398,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30416",
-        "type": "variable"
-      },
-      "cyan.700": {
-        "value": {
-          "6:0": {
-            "r": 0.054901961237192154,
-            "g": 0.45490196347236633,
-            "b": 0.5647059082984924,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30417",
-        "type": "variable"
-      },
-      "cyan.800": {
-        "value": {
-          "6:0": {
-            "r": 0.08235294371843338,
-            "g": 0.3686274588108063,
-            "b": 0.4588235318660736,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30418",
-        "type": "variable"
-      },
-      "cyan.900": {
-        "value": {
-          "6:0": {
-            "r": 0.08627451211214066,
-            "g": 0.30588236451148987,
-            "b": 0.38823530077934265,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30419",
-        "type": "variable"
-      },
-      "cyan.950": {
-        "value": {
-          "6:0": {
-            "r": 0.0313725508749485,
-            "g": 0.20000000298023224,
-            "b": 0.2666666805744171,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30420",
-        "type": "variable"
-      },
-      "sky.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9411764740943909,
-            "g": 0.9764705896377563,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30421",
-        "type": "variable"
-      },
-      "sky.100": {
-        "value": {
-          "6:0": {
-            "r": 0.8784313797950745,
-            "g": 0.9490196108818054,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30422",
-        "type": "variable"
-      },
-      "sky.200": {
-        "value": {
-          "6:0": {
-            "r": 0.729411780834198,
-            "g": 0.9019607901573181,
-            "b": 0.9921568632125854,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30423",
-        "type": "variable"
-      },
-      "sky.300": {
-        "value": {
-          "6:0": {
-            "r": 0.4901960790157318,
-            "g": 0.8274509906768799,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30424",
-        "type": "variable"
-      },
-      "sky.400": {
-        "value": {
-          "6:0": {
-            "r": 0.21960784494876862,
-            "g": 0.7411764860153198,
-            "b": 0.9725490212440491,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30425",
-        "type": "variable"
-      },
-      "sky.500": {
-        "value": {
-          "6:0": {
-            "r": 0.054901961237192154,
-            "g": 0.6470588445663452,
-            "b": 0.9137254953384399,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30426",
-        "type": "variable"
-      },
-      "sky.600": {
-        "value": {
-          "6:0": {
-            "r": 0.007843137718737125,
-            "g": 0.5176470875740051,
-            "b": 0.7803921699523926,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30427",
-        "type": "variable"
-      },
-      "sky.700": {
-        "value": {
-          "6:0": {
-            "r": 0.0117647061124444,
-            "g": 0.4117647111415863,
-            "b": 0.6313725709915161,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30428",
-        "type": "variable"
-      },
-      "sky.800": {
-        "value": {
-          "6:0": {
-            "r": 0.027450980618596077,
-            "g": 0.3490196168422699,
-            "b": 0.5215686559677124,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30429",
-        "type": "variable"
-      },
-      "sky.900": {
-        "value": {
-          "6:0": {
-            "r": 0.0470588244497776,
-            "g": 0.29019609093666077,
-            "b": 0.4313725531101227,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30430",
-        "type": "variable"
-      },
-      "sky.950": {
-        "value": {
-          "6:0": {
-            "r": 0.0313725508749485,
-            "g": 0.18431372940540314,
-            "b": 0.2862745225429535,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30431",
-        "type": "variable"
-      },
-      "indigo.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9333333373069763,
-            "g": 0.9490196108818054,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30432",
-        "type": "variable"
-      },
-      "indigo.100": {
-        "value": {
-          "6:0": {
-            "r": 0.8784313797950745,
-            "g": 0.9058823585510254,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30433",
-        "type": "variable"
-      },
-      "indigo.200": {
-        "value": {
-          "6:0": {
-            "r": 0.7803921699523926,
-            "g": 0.8235294222831726,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30434",
-        "type": "variable"
-      },
-      "indigo.300": {
-        "value": {
-          "6:0": {
-            "r": 0.6470588445663452,
-            "g": 0.7058823704719543,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30435",
-        "type": "variable"
-      },
-      "indigo.400": {
-        "value": {
-          "6:0": {
-            "r": 0.5058823823928833,
-            "g": 0.5490196347236633,
-            "b": 0.9725490212440491,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30436",
-        "type": "variable"
-      },
-      "indigo.500": {
-        "value": {
-          "6:0": {
-            "r": 0.38823530077934265,
-            "g": 0.4000000059604645,
-            "b": 0.9450980424880981,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30437",
-        "type": "variable"
-      },
-      "indigo.600": {
-        "value": {
-          "6:0": {
-            "r": 0.30980393290519714,
-            "g": 0.27450981736183167,
-            "b": 0.8980392217636108,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30438",
-        "type": "variable"
-      },
-      "indigo.700": {
-        "value": {
-          "6:0": {
-            "r": 0.26274511218070984,
-            "g": 0.21960784494876862,
-            "b": 0.7921568751335144,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30439",
-        "type": "variable"
-      },
-      "indigo.800": {
-        "value": {
-          "6:0": {
-            "r": 0.21568627655506134,
-            "g": 0.1882352977991104,
-            "b": 0.6392157077789307,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30440",
-        "type": "variable"
-      },
-      "indigo.900": {
-        "value": {
-          "6:0": {
-            "r": 0.1921568661928177,
-            "g": 0.18039216101169586,
-            "b": 0.5058823823928833,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30441",
-        "type": "variable"
-      },
-      "indigo.950": {
-        "value": {
-          "6:0": {
-            "r": 0.11764705926179886,
-            "g": 0.10588235408067703,
-            "b": 0.29411765933036804,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30442",
-        "type": "variable"
-      },
-      "violet.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9607843160629272,
-            "g": 0.9529411792755127,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30443",
-        "type": "variable"
-      },
-      "violet.100": {
-        "value": {
-          "6:0": {
-            "r": 0.929411768913269,
-            "g": 0.9137254953384399,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30444",
-        "type": "variable"
-      },
-      "violet.200": {
-        "value": {
-          "6:0": {
-            "r": 0.8666666746139526,
-            "g": 0.8392156958580017,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30445",
-        "type": "variable"
-      },
-      "violet.300": {
-        "value": {
-          "6:0": {
-            "r": 0.7686274647712708,
-            "g": 0.7098039388656616,
-            "b": 0.9921568632125854,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30446",
-        "type": "variable"
-      },
-      "violet.400": {
-        "value": {
-          "6:0": {
-            "r": 0.6549019813537598,
-            "g": 0.545098066329956,
-            "b": 0.9803921580314636,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30447",
-        "type": "variable"
-      },
-      "violet.500": {
-        "value": {
-          "6:0": {
-            "r": 0.545098066329956,
-            "g": 0.3607843220233917,
-            "b": 0.9647058844566345,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30448",
-        "type": "variable"
-      },
-      "violet.600": {
-        "value": {
-          "6:0": {
-            "r": 0.48627451062202454,
-            "g": 0.22745098173618317,
-            "b": 0.929411768913269,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30449",
-        "type": "variable"
-      },
-      "violet.700": {
-        "value": {
-          "6:0": {
-            "r": 0.4274509847164154,
-            "g": 0.1568627506494522,
-            "b": 0.8509804010391235,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30450",
-        "type": "variable"
-      },
-      "violet.800": {
-        "value": {
-          "6:0": {
-            "r": 0.35686275362968445,
-            "g": 0.12941177189350128,
-            "b": 0.7137255072593689,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30451",
-        "type": "variable"
-      },
-      "violet.900": {
-        "value": {
-          "6:0": {
-            "r": 0.2980392277240753,
-            "g": 0.11372549086809158,
-            "b": 0.5843137502670288,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30452",
-        "type": "variable"
-      },
-      "violet.950": {
-        "value": {
-          "6:0": {
-            "r": 0.18039216101169586,
-            "g": 0.062745101749897,
-            "b": 0.3960784375667572,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30453",
-        "type": "variable"
-      },
-      "purple.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9803921580314636,
-            "g": 0.9607843160629272,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30454",
-        "type": "variable"
-      },
-      "purple.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9529411792755127,
-            "g": 0.9098039269447327,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30455",
-        "type": "variable"
-      },
-      "purple.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9137254953384399,
-            "g": 0.8352941274642944,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30456",
-        "type": "variable"
-      },
-      "purple.300": {
-        "value": {
-          "6:0": {
-            "r": 0.8470588326454163,
-            "g": 0.7058823704719543,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30457",
-        "type": "variable"
-      },
-      "purple.400": {
-        "value": {
-          "6:0": {
-            "r": 0.7529411911964417,
-            "g": 0.5176470875740051,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30458",
-        "type": "variable"
-      },
-      "purple.500": {
-        "value": {
-          "6:0": {
-            "r": 0.658823549747467,
-            "g": 0.3333333432674408,
-            "b": 0.9686274528503418,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30459",
-        "type": "variable"
-      },
-      "purple.600": {
-        "value": {
-          "6:0": {
-            "r": 0.5764706134796143,
-            "g": 0.20000000298023224,
-            "b": 0.9176470637321472,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30460",
-        "type": "variable"
-      },
-      "purple.700": {
-        "value": {
-          "6:0": {
-            "r": 0.4941176474094391,
-            "g": 0.13333334028720856,
-            "b": 0.8078431487083435,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30461",
-        "type": "variable"
-      },
-      "purple.800": {
-        "value": {
-          "6:0": {
-            "r": 0.41960784792900085,
-            "g": 0.12941177189350128,
-            "b": 0.658823549747467,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30462",
-        "type": "variable"
-      },
-      "purple.900": {
-        "value": {
-          "6:0": {
-            "r": 0.3450980484485626,
-            "g": 0.10980392247438431,
-            "b": 0.529411792755127,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30463",
-        "type": "variable"
-      },
-      "purple.950": {
-        "value": {
-          "6:0": {
-            "r": 0.23137255012989044,
-            "g": 0.027450980618596077,
-            "b": 0.3921568691730499,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30464",
-        "type": "variable"
-      },
-      "fuchsia.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9921568632125854,
-            "g": 0.95686274766922,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30465",
-        "type": "variable"
-      },
-      "fuchsia.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9803921580314636,
-            "g": 0.9098039269447327,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30466",
-        "type": "variable"
-      },
-      "fuchsia.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9607843160629272,
-            "g": 0.8156862854957581,
-            "b": 0.9960784316062927,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30467",
-        "type": "variable"
-      },
-      "fuchsia.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9411764740943909,
-            "g": 0.6705882549285889,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30468",
-        "type": "variable"
-      },
-      "fuchsia.400": {
-        "value": {
-          "6:0": {
-            "r": 0.9098039269447327,
-            "g": 0.4745098054409027,
-            "b": 0.9764705896377563,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30469",
-        "type": "variable"
-      },
-      "fuchsia.500": {
-        "value": {
-          "6:0": {
-            "r": 0.8509804010391235,
-            "g": 0.27450981736183167,
-            "b": 0.9372549057006836,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30470",
-        "type": "variable"
-      },
-      "fuchsia.600": {
-        "value": {
-          "6:0": {
-            "r": 0.7529411911964417,
-            "g": 0.14901961386203766,
-            "b": 0.8274509906768799,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30471",
-        "type": "variable"
-      },
-      "fuchsia.700": {
-        "value": {
-          "6:0": {
-            "r": 0.6352941393852234,
-            "g": 0.10980392247438431,
-            "b": 0.686274528503418,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30472",
-        "type": "variable"
-      },
-      "fuchsia.800": {
-        "value": {
-          "6:0": {
-            "r": 0.5254902243614197,
-            "g": 0.09803921729326248,
-            "b": 0.5607843399047852,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30473",
-        "type": "variable"
-      },
-      "fuchsia.900": {
-        "value": {
-          "6:0": {
-            "r": 0.43921568989753723,
-            "g": 0.10196078568696976,
-            "b": 0.4588235318660736,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30474",
-        "type": "variable"
-      },
-      "fuchsia.950": {
-        "value": {
-          "6:0": {
-            "r": 0.29019609093666077,
-            "g": 0.01568627543747425,
-            "b": 0.30588236451148987,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30475",
-        "type": "variable"
-      },
-      "pink.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9921568632125854,
-            "g": 0.9490196108818054,
-            "b": 0.9725490212440491,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30476",
-        "type": "variable"
-      },
-      "pink.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9882352948188782,
-            "g": 0.9058823585510254,
-            "b": 0.9529411792755127,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30477",
-        "type": "variable"
-      },
-      "pink.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9843137264251709,
-            "g": 0.8117647171020508,
-            "b": 0.9098039269447327,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30478",
-        "type": "variable"
-      },
-      "pink.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9764705896377563,
-            "g": 0.658823549747467,
-            "b": 0.8313725590705872,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30479",
-        "type": "variable"
-      },
-      "pink.400": {
-        "value": {
-          "6:0": {
-            "r": 0.95686274766922,
-            "g": 0.4470588266849518,
-            "b": 0.7137255072593689,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30480",
-        "type": "variable"
-      },
-      "pink.500": {
-        "value": {
-          "6:0": {
-            "r": 0.9254902005195618,
-            "g": 0.2823529541492462,
-            "b": 0.6000000238418579,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30481",
-        "type": "variable"
-      },
-      "pink.600": {
-        "value": {
-          "6:0": {
-            "r": 0.8588235378265381,
-            "g": 0.15294118225574493,
-            "b": 0.46666666865348816,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30482",
-        "type": "variable"
-      },
-      "pink.700": {
-        "value": {
-          "6:0": {
-            "r": 0.7450980544090271,
-            "g": 0.0941176488995552,
-            "b": 0.364705890417099,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30483",
-        "type": "variable"
-      },
-      "pink.800": {
-        "value": {
-          "6:0": {
-            "r": 0.615686297416687,
-            "g": 0.09019608050584793,
-            "b": 0.3019607961177826,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30484",
-        "type": "variable"
-      },
-      "pink.900": {
-        "value": {
-          "6:0": {
-            "r": 0.5137255191802979,
-            "g": 0.0941176488995552,
-            "b": 0.26274511218070984,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30485",
-        "type": "variable"
-      },
-      "pink.950": {
-        "value": {
-          "6:0": {
-            "r": 0.3137255012989044,
-            "g": 0.027450980618596077,
-            "b": 0.1411764770746231,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30486",
-        "type": "variable"
-      },
-      "rose.50": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 0.9450980424880981,
-            "b": 0.9490196108818054,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30487",
-        "type": "variable"
-      },
-      "rose.100": {
-        "value": {
-          "6:0": {
-            "r": 1,
-            "g": 0.8941176533699036,
-            "b": 0.9019607901573181,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30488",
-        "type": "variable"
-      },
-      "rose.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.8039215803146362,
-            "b": 0.8274509906768799,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30489",
-        "type": "variable"
-      },
-      "rose.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9921568632125854,
-            "g": 0.6431372761726379,
-            "b": 0.686274528503418,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30490",
-        "type": "variable"
-      },
-      "rose.400": {
-        "value": {
-          "6:0": {
-            "r": 0.9843137264251709,
-            "g": 0.4431372582912445,
-            "b": 0.5215686559677124,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30491",
-        "type": "variable"
-      },
-      "rose.500": {
-        "value": {
-          "6:0": {
-            "r": 0.95686274766922,
-            "g": 0.24705882370471954,
-            "b": 0.3686274588108063,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30492",
-        "type": "variable"
-      },
-      "rose.600": {
-        "value": {
-          "6:0": {
-            "r": 0.8823529481887817,
-            "g": 0.11372549086809158,
-            "b": 0.2823529541492462,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30493",
-        "type": "variable"
-      },
-      "rose.700": {
-        "value": {
-          "6:0": {
-            "r": 0.7450980544090271,
-            "g": 0.07058823853731155,
-            "b": 0.23529411852359772,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30494",
-        "type": "variable"
-      },
-      "rose.800": {
-        "value": {
-          "6:0": {
-            "r": 0.6235294342041016,
-            "g": 0.07058823853731155,
-            "b": 0.2235294133424759,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30495",
-        "type": "variable"
-      },
-      "rose.900": {
-        "value": {
-          "6:0": {
-            "r": 0.5333333611488342,
-            "g": 0.07450980693101883,
-            "b": 0.21568627655506134,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30496",
-        "type": "variable"
-      },
-      "rose.950": {
-        "value": {
-          "6:0": {
-            "r": 0.2980392277240753,
-            "g": 0.019607843831181526,
-            "b": 0.09803921729326248,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30497",
-        "type": "variable"
-      },
-      "green.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9411764740943909,
-            "g": 0.9921568632125854,
-            "b": 0.95686274766922,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30498",
-        "type": "variable"
-      },
-      "green.100": {
-        "value": {
-          "6:0": {
-            "r": 0.8627451062202454,
-            "g": 0.9882352948188782,
-            "b": 0.9058823585510254,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30499",
-        "type": "variable"
-      },
-      "green.200": {
-        "value": {
-          "6:0": {
-            "r": 0.7333333492279053,
-            "g": 0.9686274528503418,
-            "b": 0.8156862854957581,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30500",
-        "type": "variable"
-      },
-      "green.300": {
-        "value": {
-          "6:0": {
-            "r": 0.5254902243614197,
-            "g": 0.9372549057006836,
-            "b": 0.6745098233222961,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30501",
-        "type": "variable"
-      },
-      "green.400": {
-        "value": {
-          "6:0": {
-            "r": 0.29019609093666077,
-            "g": 0.8705882430076599,
-            "b": 0.501960813999176,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30502",
-        "type": "variable"
-      },
-      "green.500": {
-        "value": {
-          "6:0": {
-            "r": 0.13333334028720856,
-            "g": 0.772549033164978,
-            "b": 0.3686274588108063,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30503",
-        "type": "variable"
-      },
-      "green.600": {
-        "value": {
-          "6:0": {
-            "r": 0.08627451211214066,
-            "g": 0.6392157077789307,
-            "b": 0.29019609093666077,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30504",
-        "type": "variable"
-      },
-      "green.700": {
-        "value": {
-          "6:0": {
-            "r": 0.08235294371843338,
-            "g": 0.501960813999176,
-            "b": 0.239215686917305,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30505",
-        "type": "variable"
-      },
-      "green.800": {
-        "value": {
-          "6:0": {
-            "r": 0.08627451211214066,
-            "g": 0.3960784375667572,
-            "b": 0.20392157137393951,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30506",
-        "type": "variable"
-      },
-      "green.900": {
-        "value": {
-          "6:0": {
-            "r": 0.0784313753247261,
-            "g": 0.32549020648002625,
-            "b": 0.1764705926179886,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30507",
-        "type": "variable"
-      },
-      "green.950": {
-        "value": {
-          "6:0": {
-            "r": 0.019607843831181526,
-            "g": 0.18039216101169586,
-            "b": 0.08627451211214066,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30508",
-        "type": "variable"
-      },
-      "yellow.50": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.9882352948188782,
-            "b": 0.9098039269447327,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30509",
-        "type": "variable"
-      },
-      "yellow.100": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.9764705896377563,
-            "b": 0.7647058963775635,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30510",
-        "type": "variable"
-      },
-      "yellow.200": {
-        "value": {
-          "6:0": {
-            "r": 0.9960784316062927,
-            "g": 0.9411764740943909,
-            "b": 0.5411764979362488,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30511",
-        "type": "variable"
-      },
-      "yellow.300": {
-        "value": {
-          "6:0": {
-            "r": 0.9921568632125854,
-            "g": 0.8784313797950745,
-            "b": 0.27843138575553894,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30512",
-        "type": "variable"
-      },
-      "yellow.400": {
-        "value": {
-          "6:0": {
-            "r": 0.9803921580314636,
-            "g": 0.800000011920929,
-            "b": 0.08235294371843338,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30513",
-        "type": "variable"
-      },
-      "yellow.500": {
-        "value": {
-          "6:0": {
-            "r": 0.9176470637321472,
-            "g": 0.7019608020782471,
-            "b": 0.0313725508749485,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30514",
-        "type": "variable"
-      },
-      "yellow.600": {
-        "value": {
-          "6:0": {
-            "r": 0.7921568751335144,
-            "g": 0.5411764979362488,
-            "b": 0.01568627543747425,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30515",
-        "type": "variable"
-      },
-      "yellow.700": {
-        "value": {
-          "6:0": {
-            "r": 0.6313725709915161,
-            "g": 0.3843137323856354,
-            "b": 0.027450980618596077,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30516",
-        "type": "variable"
-      },
-      "yellow.800": {
-        "value": {
-          "6:0": {
-            "r": 0.5215686559677124,
-            "g": 0.3019607961177826,
-            "b": 0.054901961237192154,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30517",
-        "type": "variable"
-      },
-      "yellow.900": {
-        "value": {
-          "6:0": {
-            "r": 0.4431372582912445,
-            "g": 0.24705882370471954,
-            "b": 0.07058823853731155,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30518",
-        "type": "variable"
-      },
-      "yellow.950": {
-        "value": {
-          "6:0": {
-            "r": 0.25882354378700256,
-            "g": 0.125490203499794,
-            "b": 0.0235294122248888,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:534:30519",
-        "type": "variable"
-      },
-      "general.background": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5103"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:618:31274",
-        "type": "variable"
-      },
-      "general.foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30321"
-          }
-        },
-        "figma_id": "VariableID:618:31275",
-        "type": "variable"
-      },
-      "general.primary": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30320"
-          }
-        },
-        "figma_id": "VariableID:618:31276",
-        "type": "variable"
-      },
-      "general.primary-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30311"
-          }
-        },
-        "figma_id": "VariableID:618:31277",
-        "type": "variable"
-      },
-      "general.secondary": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:109"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30312"
-          }
-        },
-        "figma_id": "VariableID:618:31278",
-        "type": "variable"
-      },
-      "general.secondary-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30320"
-          }
-        },
-        "figma_id": "VariableID:618:31279",
-        "type": "variable"
-      },
-      "general.accent": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30312"
-          }
-        },
-        "figma_id": "VariableID:618:31282",
-        "type": "variable"
-      },
-      "general.accent-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30320"
-          }
-        },
-        "figma_id": "VariableID:618:31283",
-        "type": "variable"
-      },
-      "general.muted": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30312"
-          }
-        },
-        "figma_id": "VariableID:618:31280",
-        "type": "variable"
-      },
-      "general.muted-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:105"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30316"
-          }
-        },
-        "figma_id": "VariableID:618:31281",
-        "type": "variable"
-      },
-      "general.destructive": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1997"
-          },
-          "618:1": {
-            "r": 0.6196078658103943,
-            "g": 0.250980406999588,
-            "b": 0.25882354378700256,
-            "a": 1
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1997"
-          }
-        },
-        "figma_id": "VariableID:618:31284",
-        "type": "variable"
-      },
-      "general.border": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:103"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30313"
-          }
-        },
-        "figma_id": "VariableID:618:31285",
-        "type": "variable"
-      },
-      "general.input": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "618:1": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.05000000074505806
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:618:31286",
-        "type": "variable"
-      },
-      "card.card": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:618:31288",
-        "type": "variable"
-      },
-      "card.card-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30321"
-          }
-        },
-        "figma_id": "VariableID:618:31289",
-        "type": "variable"
-      },
-      "popover.popover": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5103"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5103"
-          }
-        },
-        "figma_id": "VariableID:618:31290",
-        "type": "variable"
-      },
-      "popover.popover-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5103"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:618:31291",
-        "type": "variable"
-      },
-      "unofficial.foreground-alt": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30318"
-          }
-        },
-        "figma_id": "VariableID:644:68578",
-        "type": "variable"
-      },
-      "unofficial.body-background": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:658:92959",
-        "type": "variable"
-      },
-      "unofficial.destructive-border": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1996"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1996"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1996"
-          }
-        },
-        "figma_id": "VariableID:644:34029",
-        "type": "variable"
-      },
-      "unofficial.destructive-subtle": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1991"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:2001"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1991"
-          }
-        },
-        "figma_id": "VariableID:643:77342",
-        "type": "variable"
-      },
-      "unofficial.contrast-(deprecated)": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5103"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5103"
-          }
-        },
-        "figma_id": "VariableID:645:30114",
-        "type": "variable"
-      },
-      "unofficial.backdrop": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.6000000238418579
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.6000000238418579
-          },
-          "847:4": {
-            "r": 0.20000000298023224,
-            "g": 0.2549019753932953,
-            "b": 0.3333333432674408,
-            "a": 0.6000000238418579
-          }
-        },
-        "figma_id": "VariableID:643:77398",
-        "type": "variable"
-      },
-      "unofficial.mid-(deprecated)": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30316"
-          }
-        },
-        "figma_id": "VariableID:619:32543",
-        "type": "variable"
-      },
-      "unofficial.mid-alt": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:107"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:105"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30317"
-          }
-        },
-        "figma_id": "VariableID:619:61424",
-        "type": "variable"
-      },
-      "unofficial.destructive-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1997"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1995"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1997"
-          }
-        },
-        "figma_id": "VariableID:625:31535",
-        "type": "variable"
-      },
-      "unofficial.ghost-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:103"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30318"
-          }
-        },
-        "figma_id": "VariableID:643:77308",
-        "type": "variable"
-      },
-      "unofficial.ghost": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 9.999999747378752e-05
-          },
-          "618:1": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 9.999999747378752e-05
-          },
-          "847:4": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 9.999999747378752e-05
-          }
-        },
-        "figma_id": "VariableID:653:37621",
-        "type": "variable"
-      },
-      "unofficial.ghost-hover": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          },
-          "618:1": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.10000000149011612
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          }
-        },
-        "figma_id": "VariableID:625:31108",
-        "type": "variable"
-      },
-      "unofficial.primary-hover": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30318"
-          }
-        },
-        "figma_id": "VariableID:619:32541",
-        "type": "variable"
-      },
-      "unofficial.secondary-hover": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30311"
-          }
-        },
-        "figma_id": "VariableID:619:32542",
-        "type": "variable"
-      },
-      "unofficial.outline": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.10000000149011612
-          },
-          "618:1": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.05000000074505806
-          },
-          "847:4": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.10000000149011612
-          }
-        },
-        "figma_id": "VariableID:644:37106",
-        "type": "variable"
-      },
-      "unofficial.outline-hover": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.0333000011742115
-          },
-          "618:1": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.10000000149011612
-          },
-          "847:4": {
-            "r": 0.20000000298023224,
-            "g": 0.2549019753932953,
-            "b": 0.3333333432674408,
-            "a": 0.0333000011742115
-          }
-        },
-        "figma_id": "VariableID:644:37107",
-        "type": "variable"
-      },
-      "unofficial.outline-active": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          },
-          "618:1": {
-            "r": 1,
-            "g": 1,
-            "b": 1,
-            "a": 0.15000000596046448
-          },
-          "847:4": {
-            "r": 0.20000000298023224,
-            "g": 0.2549019753932953,
-            "b": 0.3333333432674408,
-            "a": 0.05000000074505806
-          }
-        },
-        "figma_id": "VariableID:663:35805",
-        "type": "variable"
-      },
-      "unofficial.accent-0": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30311"
-          }
-        },
-        "figma_id": "VariableID:619:31281",
-        "type": "variable"
-      },
-      "unofficial.accent-2": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:103"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:109"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30313"
-          }
-        },
-        "figma_id": "VariableID:619:31279",
-        "type": "variable"
-      },
-      "unofficial.accent-3": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30314"
-          }
-        },
-        "figma_id": "VariableID:619:31280",
-        "type": "variable"
-      },
-      "unofficial.border-0": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30311"
-          }
-        },
-        "figma_id": "VariableID:619:31282",
-        "type": "variable"
-      },
-      "unofficial.border-1": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30312"
-          }
-        },
-        "figma_id": "VariableID:619:31278",
-        "type": "variable"
-      },
-      "unofficial.border-3": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30314"
-          }
-        },
-        "figma_id": "VariableID:619:31283",
-        "type": "variable"
-      },
-      "unofficial.border-4": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:105"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:107"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30315"
-          }
-        },
-        "figma_id": "VariableID:644:34026",
-        "type": "variable"
-      },
-      "unofficial.border-5": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30316"
-          }
-        },
-        "figma_id": "VariableID:644:34027",
-        "type": "variable"
-      },
-      "focus.ring": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30314"
-          }
-        },
-        "figma_id": "VariableID:618:31287",
-        "type": "variable"
-      },
-      "sidebar.sidebar": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:111"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30312"
-          }
-        },
-        "figma_id": "VariableID:643:77395",
-        "type": "variable"
-      },
-      "sidebar.sidebar-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30318"
-          }
-        },
-        "figma_id": "VariableID:643:77390",
-        "type": "variable"
-      },
-      "sidebar.sidebar-accent": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30313"
-          }
-        },
-        "figma_id": "VariableID:643:77391",
-        "type": "variable"
-      },
-      "sidebar.sidebar-accent-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:102"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30318"
-          }
-        },
-        "figma_id": "VariableID:643:77394",
-        "type": "variable"
-      },
-      "sidebar.sidebar-primary": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30320"
-          }
-        },
-        "figma_id": "VariableID:643:77392",
-        "type": "variable"
-      },
-      "sidebar.sidebar-primary-foreground": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:101"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:110"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30311"
-          }
-        },
-        "figma_id": "VariableID:643:77393",
-        "type": "variable"
-      },
-      "sidebar.sidebar-border": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:103"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:109"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30313"
-          }
-        },
-        "figma_id": "VariableID:643:77396",
-        "type": "variable"
-      },
-      "sidebar.sidebar-ring": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:104"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:108"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30314"
-          }
-        },
-        "figma_id": "VariableID:643:77397",
-        "type": "variable"
-      },
-      "sidebar.unofficial.sidebar-muted": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "618:1": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:6:106"
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30316"
-          }
-        },
-        "figma_id": "VariableID:653:49232",
-        "type": "variable"
-      },
-      "focus.ring-error": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1994"
-          },
-          "618:1": {
-            "r": 0.4274509847164154,
-            "g": 0.18039216101169586,
-            "b": 0.18431372940540314,
-            "a": 1
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:1994"
-          }
-        },
-        "figma_id": "VariableID:643:77309",
-        "type": "variable"
-      },
-      "chart.legacy.chart-1": {
-        "value": {
-          "618:0": {
-            "r": 0.9607843160629272,
-            "g": 0.29019609093666077,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.0784313753247261,
-            "g": 0.27843138575553894,
-            "b": 0.9019607901573181,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.12156862765550613,
-            "g": 0.46666666865348816,
-            "b": 0.7058823704719543,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:619:31273",
-        "type": "variable"
-      },
-      "chart.legacy.chart-2": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.5882353186607361,
-            "b": 0.5372549295425415,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.7372549176216125,
-            "b": 0.4901960790157318,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.49803921580314636,
-            "b": 0.054901961237192154,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:619:31274",
-        "type": "variable"
-      },
-      "chart.legacy.chart-3": {
-        "value": {
-          "618:0": {
-            "r": 0.062745101749897,
-            "g": 0.30588236451148987,
-            "b": 0.3921568691730499,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.9921568632125854,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.1725490242242813,
-            "g": 0.6274510025978088,
-            "b": 0.1725490242242813,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:619:31275",
-        "type": "variable"
-      },
-      "chart.legacy.chart-4": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.7254902124404907,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.6784313917160034,
-            "g": 0.27450981736183167,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.8392156958580017,
-            "g": 0.15294118225574493,
-            "b": 0.1568627506494522,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:619:31276",
-        "type": "variable"
-      },
-      "chart.legacy.chart-5": {
-        "value": {
-          "618:0": {
-            "r": 0.9960784316062927,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.125490203499794,
-            "b": 0.33725491166114807,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.5803921818733215,
-            "g": 0.40392157435417175,
-            "b": 0.7411764860153198,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:619:31277",
-        "type": "variable"
-      },
-      "chart.area.orange.fill": {
-        "value": {
-          "618:0": {
-            "r": 0.9920479655265808,
-            "g": 0.8146340250968933,
-            "b": 0.6118749976158142,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.4588235318660736,
-            "g": 0.34117648005485535,
-            "b": 0.21960784494876862,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.9920479655265808,
-            "g": 0.8146340250968933,
-            "b": 0.6118749976158142,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:647:31549",
-        "type": "variable"
-      },
-      "chart.area.orange.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.9708533883094788,
-            "g": 0.690407395362854,
-            "b": 0.49409517645835876,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.4627451002597809,
-            "g": 0.21960784494876862,
-            "b": 0.054901961237192154,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.9708533883094788,
-            "g": 0.690407395362854,
-            "b": 0.49409517645835876,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73256",
-        "type": "variable"
-      },
-      "chart.area.orange.stroke": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.7215686440467834,
-            "b": 0.4156862795352936,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.7215686440467834,
-            "b": 0.4156862795352936,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.7215686440467834,
-            "b": 0.4156862795352936,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:647:31551",
-        "type": "variable"
-      },
-      "chart.area.orange.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.4117647111415863,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.4745098054409027,
-            "b": 0.08235294371843338,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.4117647111415863,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73257",
-        "type": "variable"
-      },
-      "chart.area.blue.fill": {
-        "value": {
-          "618:0": {
-            "r": 0.7496619820594788,
-            "g": 0.8687251806259155,
-            "b": 1,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.27843138575553894,
-            "g": 0.364705890417099,
-            "b": 0.4588235318660736,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.7496619820594788,
-            "g": 0.8687251806259155,
-            "b": 1,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:72416",
-        "type": "variable"
-      },
-      "chart.area.blue.stroke": {
-        "value": {
-          "618:0": {
-            "r": 0.5568627715110779,
-            "g": 0.772549033164978,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.5568627715110779,
-            "g": 0.772549033164978,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.5568627715110779,
-            "g": 0.772549033164978,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:72417",
-        "type": "variable"
-      },
-      "chart.area.blue.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.6666666865348816,
-            "g": 0.800000011920929,
-            "b": 1,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.12156862765550613,
-            "g": 0.2549019753932953,
-            "b": 0.4627451002597809,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.6666666865348816,
-            "g": 0.800000011920929,
-            "b": 1,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73254",
-        "type": "variable"
-      },
-      "chart.area.blue.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 0.24705882370471954,
-            "g": 0.5529412031173706,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.32549020648002625,
-            "g": 0.6078431606292725,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.24705882370471954,
-            "g": 0.5529412031173706,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73255",
-        "type": "variable"
-      },
-      "chart.area.green.fill": {
-        "value": {
-          "618:0": {
-            "r": 0.7252106666564941,
-            "g": 0.9840070009231567,
-            "b": 0.822259247303009,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.24705882370471954,
-            "g": 0.4313725531101227,
-            "b": 0.3176470696926117,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.7252106666564941,
-            "g": 0.9840070009231567,
-            "b": 0.822259247303009,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:72418",
-        "type": "variable"
-      },
-      "chart.area.green.stroke": {
-        "value": {
-          "618:0": {
-            "r": 0.48235294222831726,
-            "g": 0.9450980424880981,
-            "b": 0.6687395572662354,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.48235294222831726,
-            "g": 0.9450980424880981,
-            "b": 0.658823549747467,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.48235294222831726,
-            "g": 0.9450980424880981,
-            "b": 0.6687395572662354,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:72419",
-        "type": "variable"
-      },
-      "chart.area.green.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.5098943710327148,
-            "g": 0.8876308798789978,
-            "b": 0.660988986492157,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.054901961237192154,
-            "g": 0.3686274588108063,
-            "b": 0.18039216101169586,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.5098943710327148,
-            "g": 0.8876308798789978,
-            "b": 0.660988986492157,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73252",
-        "type": "variable"
-      },
-      "chart.area.green.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 0.09803921729326248,
-            "g": 0.8196078538894653,
-            "b": 0.38823530077934265,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.09803921729326248,
-            "g": 0.8196078538894653,
-            "b": 0.38823530077934265,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.09803921729326248,
-            "g": 0.8196078538894653,
-            "b": 0.38823530077934265,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73253",
-        "type": "variable"
-      },
-      "chart.area.rose.fill": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.8509804010391235,
-            "b": 0.8705882430076599,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.4588235318660736,
-            "g": 0.30588236451148987,
-            "b": 0.32549020648002625,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.8509804010391235,
-            "b": 0.8705882430076599,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73169",
-        "type": "variable"
-      },
-      "chart.area.rose.stroke": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.6313725709915161,
-            "b": 0.6784313917160034,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.6313725709915161,
-            "b": 0.6784313917160034,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.6313725709915161,
-            "b": 0.6784313917160034,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73170",
-        "type": "variable"
-      },
-      "chart.area.rose.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.9578414559364319,
-            "g": 0.5668655633926392,
-            "b": 0.6601600646972656,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.45490196347236633,
-            "g": 0.10588235408067703,
-            "b": 0.1882352977991104,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.9578414559364319,
-            "g": 0.5668655633926392,
-            "b": 0.6601600646972656,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73176",
-        "type": "variable"
-      },
-      "chart.area.rose.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.30980393290519714,
-            "b": 0.4745098054409027,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.27450981736183167,
-            "b": 0.43921568989753723,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.30980393290519714,
-            "b": 0.4745098054409027,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73177",
-        "type": "variable"
-      },
-      "chart.area.teal.fill": {
-        "value": {
-          "618:0": {
-            "r": 0.6622663736343384,
-            "g": 0.9549305438995361,
-            "b": 0.9112495183944702,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.2528286874294281,
-            "g": 0.5769955515861511,
-            "b": 0.5327908992767334,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.6622663736343384,
-            "g": 0.9549305438995361,
-            "b": 0.9112495183944702,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73171",
-        "type": "variable"
-      },
-      "chart.area.teal.stroke": {
-        "value": {
-          "618:0": {
-            "r": 0.27450981736183167,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.27450981736183167,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.27450981736183167,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73172",
-        "type": "variable"
-      },
-      "chart.area.teal.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.4880538582801819,
-            "g": 0.9056999683380127,
-            "b": 0.8611510396003723,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.054901961237192154,
-            "g": 0.3490196168422699,
-            "b": 0.3176470696926117,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.4880538582801819,
-            "g": 0.9056999683380127,
-            "b": 0.8611510396003723,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73250",
-        "type": "variable"
-      },
-      "chart.area.teal.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 0.027450980618596077,
-            "g": 0.7529411911964417,
-            "b": 0.6745098233222961,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.10980392247438431,
-            "g": 0.8117647171020508,
-            "b": 0.7254902124404907,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.027450980618596077,
-            "g": 0.7529411911964417,
-            "b": 0.6745098233222961,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73251",
-        "type": "variable"
-      },
-      "chart.area.purple.fill": {
-        "value": {
-          "618:0": {
-            "r": 0.9411764740943909,
-            "g": 0.8784313797950745,
-            "b": 1,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.3960784375667572,
-            "g": 0.3333333432674408,
-            "b": 0.4627451002597809,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.9411764740943909,
-            "g": 0.8784313797950745,
-            "b": 1,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73545",
-        "type": "variable"
-      },
-      "chart.area.purple.stroke": {
-        "value": {
-          "618:0": {
-            "r": 0.8549019694328308,
-            "g": 0.6980392336845398,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.8549019694328308,
-            "g": 0.6980392336845398,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.8549019694328308,
-            "g": 0.6980392336845398,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73546",
-        "type": "variable"
-      },
-      "chart.area.purple.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.8705882430076599,
-            "g": 0.7098039388656616,
-            "b": 1,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.32549020648002625,
-            "g": 0.16470588743686676,
-            "b": 0.46666666865348816,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.8705882430076599,
-            "g": 0.7098039388656616,
-            "b": 1,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73547",
-        "type": "variable"
-      },
-      "chart.area.purple.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 0.7764706015586853,
-            "g": 0.4941176474094391,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.6627451181411743,
-            "g": 0.4156862795352936,
-            "b": 0.8666666746139526,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.7764706015586853,
-            "g": 0.4941176474094391,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73548",
-        "type": "variable"
-      },
-      "obra-shadn-docs.obra-shadcn-ui-docs-1": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:16:2015"
-          },
-          "618:1": {
-            "r": 0.06697625666856766,
-            "g": 0.08797097951173782,
-            "b": 0.15845328569412231,
-            "a": 1
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:644:68503",
-        "type": "variable"
-      },
-      "chart.area.amber.fill": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.929411768913269,
-            "b": 0.6745098233222961,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.45490196347236633,
-            "g": 0.3843137323856354,
-            "b": 0.12941177189350128,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.929411768913269,
-            "b": 0.6745098233222961,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73549",
-        "type": "variable"
-      },
-      "obra-shadn-docs.obra-shadcn-ui-docs-2": {
-        "value": {
-          "618:0": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:534:30510"
-          },
-          "618:1": {
-            "r": 0.12658406794071198,
-            "g": 0.11423555761575699,
-            "b": 0.10479257255792618,
-            "a": 1
-          },
-          "847:4": {
-            "type": "VARIABLE_ALIAS",
-            "id": "VariableID:55:5102"
-          }
-        },
-        "figma_id": "VariableID:644:68504",
-        "type": "variable"
-      },
-      "chart.area.amber.stroke": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.8235294222831726,
-            "b": 0.1882352977991104,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.8235294222831726,
-            "b": 0.1882352977991104,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.8235294222831726,
-            "b": 0.1882352977991104,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73550",
-        "type": "variable"
-      },
-      "chart.area.amber.fill-2": {
-        "value": {
-          "618:0": {
-            "r": 0.9960784316062927,
-            "g": 0.8392156958580017,
-            "b": 0.6000000238418579,
-            "a": 0.699999988079071
-          },
-          "618:1": {
-            "r": 0.45098039507865906,
-            "g": 0.29411765933036804,
-            "b": 0.054901961237192154,
-            "a": 0.699999988079071
-          },
-          "847:4": {
-            "r": 0.9960784316062927,
-            "g": 0.8392156958580017,
-            "b": 0.6000000238418579,
-            "a": 0.699999988079071
-          }
-        },
-        "figma_id": "VariableID:667:73551",
-        "type": "variable"
-      },
-      "chart.area.amber.stroke-2": {
-        "value": {
-          "618:0": {
-            "r": 0.9960784316062927,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.6470588445663452,
-            "b": 0.03921568766236305,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.9960784316062927,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:667:73552",
-        "type": "variable"
-      },
-      "chart.static.blue.1": {
-        "value": {
-          "618:0": {
-            "r": 0.5568627715110779,
-            "g": 0.772549033164978,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.5568627715110779,
-            "g": 0.772549033164978,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.5568627715110779,
-            "g": 0.772549033164978,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34330",
-        "type": "variable"
-      },
-      "chart.static.rose.1": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.6313725709915161,
-            "b": 0.6784313917160034,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.6313725709915161,
-            "b": 0.6784313917160034,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.6313725709915161,
-            "b": 0.6784313917160034,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34364",
-        "type": "variable"
-      },
-      "chart.static.rose.2": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.125490203499794,
-            "b": 0.33725491166114807,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.125490203499794,
-            "b": 0.33725491166114807,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.125490203499794,
-            "b": 0.33725491166114807,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34365",
-        "type": "variable"
-      },
-      "chart.static.rose.3": {
-        "value": {
-          "618:0": {
-            "r": 0.9254902005195618,
-            "g": 0,
-            "b": 0.24705882370471954,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.9254902005195618,
-            "g": 0,
-            "b": 0.24705882370471954,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.9254902005195618,
-            "g": 0,
-            "b": 0.24705882370471954,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34366",
-        "type": "variable"
-      },
-      "chart.static.rose.4": {
-        "value": {
-          "618:0": {
-            "r": 0.7803921699523926,
-            "g": 0,
-            "b": 0.21176470816135406,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.7803921699523926,
-            "g": 0,
-            "b": 0.21176470816135406,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.7803921699523926,
-            "g": 0,
-            "b": 0.21176470816135406,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34367",
-        "type": "variable"
-      },
-      "chart.static.rose.5": {
-        "value": {
-          "618:0": {
-            "r": 0.6470588445663452,
-            "g": 0,
-            "b": 0.21176470816135406,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.6470588445663452,
-            "g": 0,
-            "b": 0.21176470816135406,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.6470588445663452,
-            "g": 0,
-            "b": 0.21176470816135406,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34368",
-        "type": "variable"
-      },
-      "chart.static.purple.1": {
-        "value": {
-          "618:0": {
-            "r": 0.8549019694328308,
-            "g": 0.6980392336845398,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.8549019694328308,
-            "g": 0.6980392336845398,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.8549019694328308,
-            "g": 0.6980392336845398,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34378",
-        "type": "variable"
-      },
-      "chart.static.purple.2": {
-        "value": {
-          "618:0": {
-            "r": 0.6784313917160034,
-            "g": 0.27450981736183167,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.6784313917160034,
-            "g": 0.27450981736183167,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.6784313917160034,
-            "g": 0.27450981736183167,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34379",
-        "type": "variable"
-      },
-      "chart.static.purple.3": {
-        "value": {
-          "618:0": {
-            "r": 0.5960784554481506,
-            "g": 0.062745101749897,
-            "b": 0.9803921580314636,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.5960784554481506,
-            "g": 0.062745101749897,
-            "b": 0.9803921580314636,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.5960784554481506,
-            "g": 0.062745101749897,
-            "b": 0.9803921580314636,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34380",
-        "type": "variable"
-      },
-      "chart.static.purple.4": {
-        "value": {
-          "618:0": {
-            "r": 0.5098039507865906,
-            "g": 0,
-            "b": 0.8588235378265381,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.5098039507865906,
-            "g": 0,
-            "b": 0.8588235378265381,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.5098039507865906,
-            "g": 0,
-            "b": 0.8588235378265381,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34381",
-        "type": "variable"
-      },
-      "chart.static.purple.5": {
-        "value": {
-          "618:0": {
-            "r": 0.4313725531101227,
-            "g": 0.06666667014360428,
-            "b": 0.6901960968971252,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.4313725531101227,
-            "g": 0.06666667014360428,
-            "b": 0.6901960968971252,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.4313725531101227,
-            "g": 0.06666667014360428,
-            "b": 0.6901960968971252,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34382",
-        "type": "variable"
-      },
-      "chart.static.orange.1": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.7215686440467834,
-            "b": 0.4156862795352936,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.7215686440467834,
-            "b": 0.4156862795352936,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.7215686440467834,
-            "b": 0.4156862795352936,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34392",
-        "type": "variable"
-      },
-      "chart.static.orange.2": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.4117647111415863,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.4117647111415863,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.4117647111415863,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34393",
-        "type": "variable"
-      },
-      "chart.static.orange.3": {
-        "value": {
-          "618:0": {
-            "r": 0.9607843160629272,
-            "g": 0.29019609093666077,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.9607843160629272,
-            "g": 0.29019609093666077,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.9607843160629272,
-            "g": 0.29019609093666077,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34394",
-        "type": "variable"
-      },
-      "chart.static.orange.4": {
-        "value": {
-          "618:0": {
-            "r": 0.7921568751335144,
-            "g": 0.2078431397676468,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.7921568751335144,
-            "g": 0.2078431397676468,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.7921568751335144,
-            "g": 0.2078431397676468,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34395",
-        "type": "variable"
-      },
-      "chart.static.orange.5": {
-        "value": {
-          "618:0": {
-            "r": 0.6235294342041016,
-            "g": 0.1764705926179886,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.6235294342041016,
-            "g": 0.1764705926179886,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.6235294342041016,
-            "g": 0.1764705926179886,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34396",
-        "type": "variable"
-      },
-      "chart.static.teal.1": {
-        "value": {
-          "618:0": {
-            "r": 0.27450981736183167,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.27450981736183167,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.27450981736183167,
-            "g": 0.929411768913269,
-            "b": 0.8352941274642944,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34406",
-        "type": "variable"
-      },
-      "chart.static.teal.2": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.7333333492279053,
-            "b": 0.6549019813537598,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.7333333492279053,
-            "b": 0.6549019813537598,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.7333333492279053,
-            "b": 0.6549019813537598,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34407",
-        "type": "variable"
-      },
-      "chart.static.teal.3": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.5882353186607361,
-            "b": 0.5372549295425415,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.5882353186607361,
-            "b": 0.5372549295425415,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.5882353186607361,
-            "b": 0.5372549295425415,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34408",
-        "type": "variable"
-      },
-      "chart.static.teal.4": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.47058823704719543,
-            "b": 0.43529412150382996,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.47058823704719543,
-            "b": 0.43529412150382996,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.47058823704719543,
-            "b": 0.43529412150382996,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34409",
-        "type": "variable"
-      },
-      "chart.static.teal.5": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.37254902720451355,
-            "b": 0.3529411852359772,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.37254902720451355,
-            "b": 0.3529411852359772,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.37254902720451355,
-            "b": 0.3529411852359772,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34410",
-        "type": "variable"
-      },
-      "chart.static.blue.2": {
-        "value": {
-          "618:0": {
-            "r": 0.16862745583057404,
-            "g": 0.49803921580314636,
-            "b": 1,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.16862745583057404,
-            "g": 0.49803921580314636,
-            "b": 1,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.16862745583057404,
-            "g": 0.49803921580314636,
-            "b": 1,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34331",
-        "type": "variable"
-      },
-      "chart.static.blue.3": {
-        "value": {
-          "618:0": {
-            "r": 0.08235294371843338,
-            "g": 0.364705890417099,
-            "b": 0.9882352948188782,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.08235294371843338,
-            "g": 0.364705890417099,
-            "b": 0.9882352948188782,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.08235294371843338,
-            "g": 0.364705890417099,
-            "b": 0.9882352948188782,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34332",
-        "type": "variable"
-      },
-      "chart.static.blue.4": {
-        "value": {
-          "618:0": {
-            "r": 0.0784313753247261,
-            "g": 0.27843138575553894,
-            "b": 0.9019607901573181,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.0784313753247261,
-            "g": 0.27843138575553894,
-            "b": 0.9019607901573181,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.0784313753247261,
-            "g": 0.27843138575553894,
-            "b": 0.9019607901573181,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34333",
-        "type": "variable"
-      },
-      "chart.static.blue.5": {
-        "value": {
-          "618:0": {
-            "r": 0.09803921729326248,
-            "g": 0.23529411852359772,
-            "b": 0.7215686440467834,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.09803921729326248,
-            "g": 0.23529411852359772,
-            "b": 0.7215686440467834,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.09803921729326248,
-            "g": 0.23529411852359772,
-            "b": 0.7215686440467834,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34334",
-        "type": "variable"
-      },
-      "chart.static.amber.1": {
-        "value": {
-          "618:0": {
-            "r": 1,
-            "g": 0.8235294222831726,
-            "b": 0.1882352977991104,
-            "a": 1
-          },
-          "618:1": {
-            "r": 1,
-            "g": 0.8235294222831726,
-            "b": 0.1882352977991104,
-            "a": 1
-          },
-          "847:4": {
-            "r": 1,
-            "g": 0.8235294222831726,
-            "b": 0.1882352977991104,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34350",
-        "type": "variable"
-      },
-      "chart.static.amber.2": {
-        "value": {
-          "618:0": {
-            "r": 0.9960784316062927,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.9960784316062927,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.9960784316062927,
-            "g": 0.6039215922355652,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34351",
-        "type": "variable"
-      },
-      "chart.static.amber.3": {
-        "value": {
-          "618:0": {
-            "r": 0.8823529481887817,
-            "g": 0.4431372582912445,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.8823529481887817,
-            "g": 0.4431372582912445,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.8823529481887817,
-            "g": 0.4431372582912445,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34352",
-        "type": "variable"
-      },
-      "chart.static.amber.4": {
-        "value": {
-          "618:0": {
-            "r": 0.7333333492279053,
-            "g": 0.3019607961177826,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.7333333492279053,
-            "g": 0.3019607961177826,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.7333333492279053,
-            "g": 0.3019607961177826,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34353",
-        "type": "variable"
-      },
-      "chart.static.amber.5": {
-        "value": {
-          "618:0": {
-            "r": 0.5921568870544434,
-            "g": 0.23529411852359772,
-            "b": 0,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.5921568870544434,
-            "g": 0.23529411852359772,
-            "b": 0,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.5921568870544434,
-            "g": 0.23529411852359772,
-            "b": 0,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34354",
-        "type": "variable"
-      },
-      "chart.static.green.1": {
-        "value": {
-          "618:0": {
-            "r": 0.48235294222831726,
-            "g": 0.9450980424880981,
-            "b": 0.658823549747467,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.48235294222831726,
-            "g": 0.9450980424880981,
-            "b": 0.658823549747467,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.48235294222831726,
-            "g": 0.9450980424880981,
-            "b": 0.658823549747467,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34335",
-        "type": "variable"
-      },
-      "chart.static.green.2": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.7882353067398071,
-            "b": 0.3176470696926117,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.7882353067398071,
-            "b": 0.3176470696926117,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.7882353067398071,
-            "b": 0.3176470696926117,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:683:34336",
-        "type": "variable"
-      },
-      "chart.static.green.3": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.6509804129600525,
-            "b": 0.24313725531101227,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.6509804129600525,
-            "b": 0.24313725531101227,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.6509804129600525,
-            "b": 0.24313725531101227,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34337",
-        "type": "variable"
-      },
-      "chart.static.green.4": {
-        "value": {
-          "618:0": {
-            "r": 0,
-            "g": 0.5098039507865906,
-            "b": 0.21176470816135406,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0,
-            "g": 0.5098039507865906,
-            "b": 0.21176470816135406,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0,
-            "g": 0.5098039507865906,
-            "b": 0.21176470816135406,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34338",
-        "type": "variable"
-      },
-      "chart.static.green.5": {
-        "value": {
-          "618:0": {
-            "r": 0.003921568859368563,
-            "g": 0.4000000059604645,
-            "b": 0.1882352977991104,
-            "a": 1
-          },
-          "618:1": {
-            "r": 0.003921568859368563,
-            "g": 0.4000000059604645,
-            "b": 0.1882352977991104,
-            "a": 1
-          },
-          "847:4": {
-            "r": 0.003921568859368563,
-            "g": 0.4000000059604645,
-            "b": 0.1882352977991104,
-            "a": 1
-          }
-        },
-        "figma_id": "VariableID:684:34339",
-        "type": "variable"
-      },
-      "2xs.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          }
-        },
-        "figma_id": "VariableID:848:48160",
-        "type": "variable"
-      },
-      "xs.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.05000000074505806
-          }
-        },
-        "figma_id": "VariableID:848:48177",
-        "type": "variable"
-      },
-      "sm.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          }
-        },
-        "figma_id": "VariableID:848:48182",
-        "type": "variable"
-      },
-      "md.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          }
-        },
-        "figma_id": "VariableID:848:48242",
-        "type": "variable"
-      },
-      "lg.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          }
-        },
-        "figma_id": "VariableID:848:48251",
-        "type": "variable"
-      },
-      "xl.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.10000000149011612
-          }
-        },
-        "figma_id": "VariableID:848:48260",
-        "type": "variable"
-      },
-      "2xl.color": {
-        "value": {
-          "848:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.25
-          },
-          "851:1": {
-            "r": 0,
-            "g": 0,
-            "b": 0,
-            "a": 0.25
-          }
-        },
-        "figma_id": "VariableID:848:48202",
-        "type": "variable"
-      }
-    },
-    "typography": {
-      "heading-1": {
-        "value": null,
-        "figma_id": "6:83",
-        "name": "heading 1"
-      },
-      "heading-2": {
-        "value": null,
-        "figma_id": "6:84",
-        "name": "heading 2"
-      },
-      "paragraph-small.regular": {
-        "value": null,
-        "figma_id": "862:71752",
-        "name": "paragraph small/regular"
-      },
-      "paragraph-small.bold": {
-        "value": null,
-        "figma_id": "862:73054",
-        "name": "paragraph small/bold"
-      },
-      "heading-3": {
-        "value": null,
-        "figma_id": "6:85",
-        "name": "heading 3"
-      },
-      "paragraph.bold": {
-        "value": null,
-        "figma_id": "862:71716",
-        "name": "paragraph/bold"
-      },
-      "paragraph.regular": {
-        "value": null,
-        "figma_id": "6:87",
-        "name": "paragraph/regular"
-      },
-      "paragraph-mini.regular": {
-        "value": null,
-        "figma_id": "862:73098",
-        "name": "paragraph mini/regular"
-      },
-      "heading-4": {
-        "value": null,
-        "figma_id": "6:86",
-        "name": "heading 4"
-      },
-      "monospaced": {
-        "value": null,
-        "figma_id": "199:32930",
-        "name": "monospaced"
-      },
-      "paragraph.medium": {
-        "value": null,
-        "figma_id": "869:27329",
-        "name": "paragraph/medium"
-      },
-      "paragraph-small.medium": {
-        "value": null,
-        "figma_id": "363:28805",
-        "name": "paragraph small/medium"
-      },
-      "paragraph-mini.bold": {
-        "value": null,
-        "figma_id": "862:71791",
-        "name": "paragraph mini/bold"
-      },
-      "paragraph-mini.medium": {
-        "value": null,
-        "figma_id": "869:27331",
-        "name": "paragraph mini/medium"
-      }
-    },
-    "effect": {
-      "shadow-sm": {
-        "value": null,
-        "figma_id": "862:71996",
-        "name": "shadow-sm"
-      },
-      "shadow-lg": {
-        "value": null,
-        "figma_id": "14:1579",
-        "name": "shadow-lg"
-      },
-      "shadow-2xs": {
-        "value": null,
-        "figma_id": "16:1667",
-        "name": "shadow-2xs"
-      },
-      "shadow-xs": {
-        "value": null,
-        "figma_id": "862:73052",
-        "name": "shadow-xs"
-      },
-      "shadow-md": {
-        "value": null,
-        "figma_id": "16:1669",
-        "name": "shadow-md"
-      },
-      "shadow-xl": {
-        "value": null,
-        "figma_id": "16:1670",
-        "name": "shadow-xl"
-      },
-      "shadow-2xl": {
-        "value": null,
-        "figma_id": "16:1671",
-        "name": "shadow-2xl"
-      },
-      "focus-ring": {
-        "value": null,
-        "figma_id": "147:11610",
-        "name": "focus ring"
-      },
-      "focus-ring-error": {
-        "value": null,
-        "figma_id": "176:25107",
-        "name": "focus ring error"
-      },
-      "focus-ring-sidebar": {
-        "value": null,
-        "figma_id": "653:49231",
-        "name": "focus ring sidebar"
-      }
-    }
-  }
-}
\ No newline at end of file
+  "_meta": {
+    "version": "1.0.0",
+    "generated": null,
+    "source": "awaiting Figma sync",
+    "status": "empty"
+  },
+  "tokens": {}
+}
diff --git a/scripts/dss-init.sh b/scripts/dss-init.sh
new file mode 100755
index 0000000..dc5038b
--- /dev/null
+++ b/scripts/dss-init.sh
@@ -0,0 +1,604 @@
+#!/bin/bash
+# DSS Initialization Script - Full Workflow
+# Sets up complete DSS structure and manages the entire pipeline
+#
+# Usage: scripts/dss-init.sh [--reset] [--skip-analysis]
+#
+# Full Workflow:
+# 1. Reset to clean state (optional, with --reset)
+# 2. Create directory structure and database
+# 3. Analyze target projects (admin-ui, storybook)
+# 4. Figma sync (requires FIGMA_TOKEN, uses MCP)
+# 5. Build CSS with style-dictionary
+# 6. admin-ui imports from .dss/data/_system/themes/
+
+set -e
+
+DSS_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+cd "$DSS_ROOT"
+
+# Parse arguments
+RESET=false
+SKIP_ANALYSIS=false
+for arg in "$@"; do
+  case $arg in
+    --reset) RESET=true ;;
+    --skip-analysis) SKIP_ANALYSIS=true ;;
+  esac
+done
+
+# Colors
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+BLUE='\033[0;34m'
+CYAN='\033[0;36m'
+NC='\033[0m'
+
+log_step() { echo -e "${BLUE}[STEP]${NC} $1"; }
+log_ok() { echo -e "${GREEN}[OK]${NC} $1"; }
+log_warn() { echo -e "${YELLOW}[WARN]${NC} $1"; }
+log_error() { echo -e "${RED}[ERROR]${NC} $1"; }
+log_info() { echo -e "${CYAN}[INFO]${NC} $1"; }
+
+echo "╔══════════════════════════════════════════════════════════════╗"
+echo "║                    DSS INITIALIZATION                        ║"
+echo "║                    Full Workflow Pipeline                    ║"
+echo "╚══════════════════════════════════════════════════════════════╝"
+echo ""
+
+# ============================================================================
+# STEP 1: Reset (if requested)
+# ============================================================================
+if [ "$RESET" = true ]; then
+  log_step "1. Resetting DSS to clean state..."
+
+  # Clear data directories
+  rm -rf .dss/data/projects/* .dss/data/teams/* .dss/data/_system/cache/* .dss/data/_system/activity/* 2>/dev/null || true
+  rm -rf .dss/data/_system/tokens/* .dss/data/_system/themes/* .dss/data/_system/components/* 2>/dev/null || true
+
+  # Reset database
+  rm -f .dss/dss.db .dss/dss.db.old
+
+  # Clear admin-ui generated files
+  rm -f admin-ui/css/dss-*.css 2>/dev/null || true
+  rm -f admin-ui/src/components/*.stories.js admin-ui/src/components/ds-*.js 2>/dev/null || true
+
+  # Reset core_tokens
+  mkdir -p dss/core_tokens
+  cat > dss/core_tokens/tokens.json << 'EOF'
+{
+  "_meta": {
+    "version": "1.0.0",
+    "generated": null,
+    "source": "awaiting Figma sync",
+    "status": "empty"
+  },
+  "tokens": {}
+}
+EOF
+
+  # Reset skins
+  for skin in base classic workbench; do
+    if [ "$skin" = "base" ]; then
+      cat > "dss-claude-plugin/core/skins/${skin}.json" << EOF
+{
+  "meta": {
+    "id": "${skin}",
+    "version": "1.0.0",
+    "description": "${skin^} skin - awaiting Figma sync"
+  },
+  "tokens": {}
+}
+EOF
+    else
+      cat > "dss-claude-plugin/core/skins/${skin}.json" << EOF
+{
+  "meta": {
+    "id": "${skin}",
+    "version": "1.0.0",
+    "description": "${skin^} skin - awaiting Figma sync",
+    "extends": "base"
+  },
+  "tokens": {}
+}
+EOF
+    fi
+  done
+
+  # Clear logs
+  rm -f .dss/logs/*.jsonl 2>/dev/null || true
+  rm -rf .dss/logs/browser-logs/* 2>/dev/null || true
+
+  log_ok "Reset complete"
+  echo ""
+else
+  log_step "1. Skipping reset (use --reset to clear first)"
+  echo ""
+fi
+
+# ============================================================================
+# STEP 2: Validate Environment
+# ============================================================================
+log_step "2. Validating DSS environment..."
+
+STYLE_DICT_AVAILABLE=false
+FIGMA_AVAILABLE=false
+
+# Check Python
+if ! command -v python3 &> /dev/null; then
+  log_error "Python3 not found"
+  exit 1
+fi
+log_ok "Python3: $(python3 --version | cut -d' ' -f2)"
+
+# Check Node.js
+if command -v node &> /dev/null; then
+  log_ok "Node.js: $(node --version)"
+else
+  log_warn "Node.js not found - Storybook features limited"
+fi
+
+# Check style-dictionary (project, home, or global)
+if command -v style-dictionary &> /dev/null; then
+  STYLE_DICT_AVAILABLE=true
+  log_ok "style-dictionary: available"
+elif [ -f "node_modules/.bin/style-dictionary" ]; then
+  STYLE_DICT_AVAILABLE=true
+  log_ok "style-dictionary: local install"
+elif [ -f "$HOME/node_modules/.bin/style-dictionary" ]; then
+  STYLE_DICT_AVAILABLE=true
+  log_ok "style-dictionary: installed (~)"
+else
+  log_warn "style-dictionary not installed (npm install -g style-dictionary)"
+fi
+
+# Check Figma token - load from config if not in environment
+FIGMA_CONFIG=".dss/config/figma.json"
+if [ -z "$FIGMA_TOKEN" ] && [ -f "$FIGMA_CONFIG" ]; then
+  FIGMA_TOKEN=$(python3 -c "import json; print(json.load(open('$FIGMA_CONFIG')).get('token',''))" 2>/dev/null)
+  export FIGMA_TOKEN
+fi
+
+if [ -n "$FIGMA_TOKEN" ]; then
+  FIGMA_AVAILABLE=true
+  log_ok "FIGMA_TOKEN: configured (from .dss/config/figma.json)"
+  # Also show UIKit reference if available
+  if [ -f "$FIGMA_CONFIG" ]; then
+    UIKIT_NAME=$(python3 -c "import json; d=json.load(open('$FIGMA_CONFIG')); print(d.get('uikit_reference',{}).get('name',''))" 2>/dev/null)
+    [ -n "$UIKIT_NAME" ] && log_ok "UIKit reference: $UIKIT_NAME"
+  fi
+else
+  log_warn "FIGMA_TOKEN not set - add to .dss/config/figma.json"
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 3: Create Directory Structure
+# ============================================================================
+log_step "3. Creating DSS directory structure..."
+
+mkdir -p .dss/data/{_system/{tokens,themes,components,cache,activity},projects,teams}
+mkdir -p .dss/schema
+mkdir -p .dss/logs/browser-logs
+touch .dss/logs/dss-operations.jsonl
+touch .dss/logs/git-hooks.jsonl
+
+# Create _system ds.config.json
+if [ ! -f ".dss/data/_system/ds.config.json" ]; then
+  cat > .dss/data/_system/ds.config.json << 'EOF'
+{
+  "name": "dss-system",
+  "version": "1.0.0",
+  "description": "DSS internal design system (dogfooding)",
+  "skin": "base",
+  "base_theme": "light",
+  "targets": [
+    {
+      "name": "admin-ui",
+      "path": "./admin-ui",
+      "type": "web-app",
+      "framework": "vanilla"
+    },
+    {
+      "name": "storybook",
+      "path": "./storybook",
+      "type": "documentation",
+      "framework": "storybook"
+    }
+  ],
+  "output": {
+    "tokens_dir": "./.dss/data/_system/tokens",
+    "themes_dir": "./.dss/data/_system/themes",
+    "components_dir": "./.dss/data/_system/components",
+    "formats": ["css", "scss", "json"]
+  }
+}
+EOF
+fi
+log_ok "Directory structure ready"
+
+echo ""
+
+# ============================================================================
+# STEP 4: Initialize Database
+# ============================================================================
+log_step "4. Initializing database..."
+
+if [ ! -f ".dss/dss.db" ]; then
+  python3 << 'PYEOF'
+import sqlite3
+conn = sqlite3.connect(".dss/dss.db")
+c = conn.cursor()
+c.execute('''CREATE TABLE IF NOT EXISTS projects (
+    id TEXT PRIMARY KEY, name TEXT NOT NULL, path TEXT,
+    config TEXT, created_at TEXT, updated_at TEXT)''')
+c.execute('''CREATE TABLE IF NOT EXISTS tokens (
+    id TEXT PRIMARY KEY, project_id TEXT, category TEXT,
+    name TEXT, value TEXT, source TEXT, created_at TEXT,
+    FOREIGN KEY (project_id) REFERENCES projects(id))''')
+c.execute('''CREATE TABLE IF NOT EXISTS components (
+    id TEXT PRIMARY KEY, project_id TEXT, name TEXT,
+    path TEXT, analysis TEXT, created_at TEXT,
+    FOREIGN KEY (project_id) REFERENCES projects(id))''')
+c.execute('''CREATE TABLE IF NOT EXISTS figma_syncs (
+    id TEXT PRIMARY KEY, file_key TEXT, file_name TEXT,
+    tokens_count INTEGER, status TEXT, synced_at TEXT)''')
+conn.commit()
+conn.close()
+PYEOF
+  log_ok "Database initialized"
+else
+  log_ok "Database exists"
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 5: Analyze Target Projects
+# ============================================================================
+if [ "$SKIP_ANALYSIS" = false ]; then
+  log_step "5. Analyzing target projects..."
+
+  # Analyze admin-ui
+  if [ -d "admin-ui" ]; then
+    JS_COUNT=$(find admin-ui -name "*.js" -not -path "*/node_modules/*" 2>/dev/null | wc -l)
+    CSS_COUNT=$(find admin-ui -name "*.css" -not -path "*/node_modules/*" 2>/dev/null | wc -l)
+    HTML_COUNT=$(find admin-ui -name "*.html" -not -path "*/node_modules/*" 2>/dev/null | wc -l)
+
+    cat > .dss/data/_system/analysis-admin-ui.json << EOF
+{"target":"admin-ui","analyzed_at":"$(date -Iseconds)","stats":{"js":$JS_COUNT,"css":$CSS_COUNT,"html":$HTML_COUNT},"status":"analyzed"}
+EOF
+    log_ok "admin-ui: $JS_COUNT js, $CSS_COUNT css, $HTML_COUNT html"
+  else
+    log_warn "admin-ui directory not found"
+  fi
+
+  # Analyze storybook
+  STORIES_COUNT=$(find . -name "*.stories.js" -o -name "*.stories.ts" 2>/dev/null | grep -v node_modules | wc -l)
+  MDX_COUNT=$(find . -name "*.mdx" 2>/dev/null | grep -v node_modules | wc -l)
+
+  cat > .dss/data/_system/analysis-storybook.json << EOF
+{"target":"storybook","analyzed_at":"$(date -Iseconds)","stats":{"stories":$STORIES_COUNT,"mdx":$MDX_COUNT},"status":"analyzed"}
+EOF
+  log_ok "storybook: $STORIES_COUNT stories, $MDX_COUNT mdx"
+
+  echo ""
+else
+  log_step "5. Skipping analysis (--skip-analysis)"
+  echo ""
+fi
+
+# ============================================================================
+# STEP 6: Initialize Token Structure
+# ============================================================================
+log_step "6. Checking token structure..."
+
+mkdir -p .dss/data/_system/tokens
+if [ ! -f ".dss/data/_system/tokens/base.json" ]; then
+  cat > .dss/data/_system/tokens/base.json << 'EOF'
+{
+  "_meta": {
+    "version": "1.0.0",
+    "generated": null,
+    "source": "awaiting Figma sync",
+    "status": "empty"
+  },
+  "tokens": {}
+}
+EOF
+  log_ok "Empty token structure created"
+else
+  # Check if tokens have content
+  TOKEN_STATUS=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(d.get('_meta',{}).get('status','unknown'))" 2>/dev/null || echo "unknown")
+  if [ "$TOKEN_STATUS" = "empty" ]; then
+    log_warn "Tokens empty - run Figma sync to populate"
+  else
+    log_ok "Tokens present (status: $TOKEN_STATUS)"
+  fi
+fi
+
+# Create style-dictionary config (paths relative to .dss/data/_system/ where it runs)
+cat > .dss/data/_system/style-dictionary.config.json << 'EOF'
+{
+  "source": ["tokens/tokens.json"],
+  "platforms": {
+    "css": {
+      "transformGroup": "css",
+      "buildPath": "themes/",
+      "files": [{"destination": "tokens.css", "format": "css/variables"}]
+    },
+    "scss": {
+      "transformGroup": "scss",
+      "buildPath": "themes/",
+      "files": [{"destination": "_tokens.scss", "format": "scss/variables"}]
+    },
+    "json": {
+      "transformGroup": "js",
+      "buildPath": "themes/",
+      "files": [{"destination": "tokens.json", "format": "json/flat"}]
+    }
+  }
+}
+EOF
+
+echo ""
+
+# ============================================================================
+# STEP 7: Validate 3-Layer Architecture
+# ============================================================================
+log_step "7. Validating 3-layer architecture..."
+
+# Check core primitives
+if [ -f ".dss/core/primitives.json" ]; then
+  PRIM_COUNT=$(python3 -c "import json; d=json.load(open('.dss/core/primitives.json')); print(sum(len(v) if isinstance(v,dict) else 0 for k,v in d.items() if not k.startswith('_')))" 2>/dev/null || echo "0")
+  log_ok "Core primitives: $PRIM_COUNT tokens"
+else
+  log_warn "Core primitives not found (.dss/core/primitives.json)"
+fi
+
+# Check skin contract
+if [ -f ".dss/schema/skin-contract.json" ]; then
+  log_ok "Skin contract defined"
+else
+  log_warn "Skin contract not found (.dss/schema/skin-contract.json)"
+fi
+
+# Check skins
+SKIN_COUNT=$(find .dss/skins -name "tokens.json" 2>/dev/null | wc -l)
+if [ "$SKIN_COUNT" -gt 0 ]; then
+  log_ok "Skins available: $SKIN_COUNT"
+  for skin in $(find .dss/skins -type d -mindepth 1 -maxdepth 1 2>/dev/null); do
+    SKIN_NAME=$(basename "$skin")
+    log_info "  - $SKIN_NAME"
+  done
+else
+  log_warn "No skins found (.dss/skins/)"
+fi
+
+# Check themes
+THEME_COUNT=$(find .dss/themes -name "*.json" 2>/dev/null | grep -v "_" | wc -l)
+if [ "$THEME_COUNT" -gt 0 ]; then
+  log_ok "Themes available: $THEME_COUNT"
+  for theme in $(find .dss/themes -name "*.json" 2>/dev/null | grep -v "_"); do
+    THEME_NAME=$(basename "$theme" .json)
+    log_info "  - $THEME_NAME"
+  done
+else
+  log_warn "No themes found (.dss/themes/)"
+fi
+
+# Run validation if available
+if [ -f "scripts/validate-theme.py" ] && [ -f ".dss/schema/skin-contract.json" ]; then
+  log_info "Running theme/skin validation..."
+  if python3 scripts/validate-theme.py --validate-skin --quiet 2>&1 | while read line; do
+    echo "       $line"
+  done; then
+    log_ok "All validations passed"
+  else
+    log_warn "Validation had issues - check output above"
+  fi
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 8: Figma Sync
+# ============================================================================
+log_step "8. Figma sync..."
+
+# Check if tokens are empty and Figma is available
+TOKEN_STATUS=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(d.get('_meta',{}).get('status','empty'))" 2>/dev/null || echo "empty")
+
+if [ "$FIGMA_AVAILABLE" = true ] && [ "$TOKEN_STATUS" = "empty" ]; then
+  log_info "Tokens empty - syncing from Figma..."
+
+  # Get file key from config
+  FIGMA_FILE_KEY=$(python3 -c "import json; print(json.load(open('$FIGMA_CONFIG')).get('uikit_reference',{}).get('file_key',''))" 2>/dev/null)
+
+  if [ -n "$FIGMA_FILE_KEY" ]; then
+    log_info "File: $FIGMA_FILE_KEY"
+
+    # Run Figma sync script
+    if python3 "$DSS_ROOT/scripts/figma-sync.py" --file-key "$FIGMA_FILE_KEY" 2>&1 | while read line; do
+      echo "       $line"
+    done; then
+      log_ok "Figma sync complete"
+    else
+      log_warn "Figma sync had issues - check output above"
+    fi
+  else
+    log_warn "No UIKit file_key in config - add to .dss/config/figma.json"
+  fi
+elif [ "$TOKEN_STATUS" != "empty" ]; then
+  log_ok "Tokens already synced (status: $TOKEN_STATUS)"
+else
+  log_warn "FIGMA_TOKEN not set - add to .dss/config/figma.json"
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 9: Resolve 3-Layer Token Cascade
+# ============================================================================
+log_step "9. Resolving 3-layer token cascade..."
+
+# Check if we have the 3-layer structure
+HAS_PRIMITIVES=$([ -f ".dss/core/primitives.json" ] && echo "yes" || echo "no")
+HAS_SKINS=$([ -d ".dss/skins/shadcn" ] && echo "yes" || echo "no")
+
+if [ "$HAS_PRIMITIVES" = "yes" ] && [ "$HAS_SKINS" = "yes" ]; then
+  log_info "Resolving: Core → Skin → Theme"
+  if python3 scripts/resolve-tokens.py 2>&1 | while read line; do
+    echo "       $line"
+  done; then
+    log_ok "Token cascade resolved"
+  else
+    log_warn "Token resolution had issues"
+  fi
+else
+  log_warn "3-layer structure incomplete - using legacy tokens"
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 10: Build CSS with style-dictionary
+# ============================================================================
+log_step "10. Building CSS from tokens..."
+
+# Re-check if tokens have content (may have been resolved in step 9)
+# Check tokens.json which is the style-dictionary input file
+HAS_TOKENS=$(python3 -c "
+import json
+try:
+    d = json.load(open('.dss/data/_system/tokens/tokens.json'))
+    has_content = bool(d)  # tokens.json has direct categories like typography, effect
+    print('yes' if has_content else 'no')
+except:
+    print('no')
+" 2>/dev/null || echo "no")
+
+# Find style-dictionary (local, parent, home, or global)
+STYLE_DICT_CMD=""
+if [ -f "$DSS_ROOT/node_modules/.bin/style-dictionary" ]; then
+  STYLE_DICT_CMD="$DSS_ROOT/node_modules/.bin/style-dictionary"
+elif [ -f "$HOME/node_modules/.bin/style-dictionary" ]; then
+  STYLE_DICT_CMD="$HOME/node_modules/.bin/style-dictionary"
+elif [ -f "$(dirname "$DSS_ROOT")/node_modules/.bin/style-dictionary" ]; then
+  STYLE_DICT_CMD="$(dirname "$DSS_ROOT")/node_modules/.bin/style-dictionary"
+elif command -v style-dictionary &> /dev/null; then
+  STYLE_DICT_CMD="style-dictionary"
+fi
+
+if [ "$HAS_TOKENS" = "yes" ] && [ -n "$STYLE_DICT_CMD" ]; then
+  log_info "Running style-dictionary build..."
+  cd .dss/data/_system
+  if $STYLE_DICT_CMD build --config style-dictionary.config.json 2>&1 | grep -v "^$"; then
+    log_ok "CSS/SCSS/JSON generated in .dss/data/_system/themes/"
+  else
+    log_warn "style-dictionary build had issues"
+  fi
+  cd "$DSS_ROOT"
+
+  # Show what was generated
+  if [ -f ".dss/data/_system/themes/tokens.css" ]; then
+    CSS_VARS=$(grep -c "^  --" .dss/data/_system/themes/tokens.css 2>/dev/null || echo "0")
+    log_ok "Generated $CSS_VARS CSS variables"
+  fi
+elif [ "$HAS_TOKENS" = "no" ]; then
+  log_warn "No tokens - run Figma sync first"
+elif [ -z "$STYLE_DICT_CMD" ]; then
+  log_warn "style-dictionary not found"
+  log_info "Install: npm install style-dictionary (in project root)"
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 11: Generate Storybook Stories
+# ============================================================================
+log_step "11. Generating Storybook stories..."
+
+if [ "$HAS_TOKENS" = "yes" ] && [ -f "scripts/generate-storybook.py" ]; then
+  log_info "Building stories from tokens..."
+  if python3 scripts/generate-storybook.py 2>&1 | while read line; do
+    echo "       $line"
+  done; then
+    STORY_COUNT=$(find admin-ui/src/stories -name "*.stories.js" 2>/dev/null | wc -l)
+    log_ok "Generated $STORY_COUNT Storybook stories"
+  else
+    log_warn "Storybook generation had issues"
+  fi
+else
+  if [ "$HAS_TOKENS" = "no" ]; then
+    log_warn "No tokens - skipping Storybook generation"
+  else
+    log_warn "Storybook generator not found (scripts/generate-storybook.py)"
+  fi
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 12: Regenerate Hash Manifest
+# ============================================================================
+log_step "12. Updating hash manifest..."
+
+if [ -f "scripts/regenerate-core-hashes.sh" ]; then
+  ./scripts/regenerate-core-hashes.sh 2>/dev/null
+  log_ok "Hash manifest updated"
+else
+  log_warn "Hash script not found"
+fi
+
+echo ""
+
+# ============================================================================
+# SUMMARY
+# ============================================================================
+
+# Re-check token status after Figma sync
+FINAL_TOKEN_STATUS=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(d.get('_meta',{}).get('status','empty'))" 2>/dev/null || echo "empty")
+FINAL_TOKEN_COUNT=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(sum(len(v) for v in d.get('tokens',{}).values()))" 2>/dev/null || echo "0")
+
+# Determine overall status
+if [ -f ".dss/data/_system/themes/tokens.css" ]; then
+  STATUS="READY"
+  STATUS_MSG="admin-ui can import from .dss/data/_system/themes/"
+elif [ "$FINAL_TOKEN_STATUS" = "synced" ]; then
+  STATUS="TOKENS SYNCED ($FINAL_TOKEN_COUNT tokens)"
+  STATUS_MSG="Install style-dictionary to build CSS: npm install -g style-dictionary"
+elif [ "$FIGMA_AVAILABLE" = true ]; then
+  STATUS="AWAITING FIGMA SYNC"
+  STATUS_MSG="Run: dss_sync_figma or /dss-figma to populate tokens"
+else
+  STATUS="AWAITING SETUP"
+  STATUS_MSG="Set FIGMA_TOKEN environment variable first"
+fi
+
+echo "╔══════════════════════════════════════════════════════════════╗"
+echo "║                  DSS INITIALIZATION COMPLETE                 ║"
+echo "╚══════════════════════════════════════════════════════════════╝"
+echo ""
+echo "  Status: $STATUS"
+echo "  → $STATUS_MSG"
+echo ""
+echo "  3-Layer Architecture:"
+echo "    .dss/core/primitives.json  ← Core Tailwind primitives (immutable)"
+echo "    .dss/skins/*/tokens.json   ← Skins (semantic mappings)"
+echo "    .dss/themes/*.json         ← Themes (brand overrides)"
+echo "    .dss/schema/skin-contract  ← Contract for skin compatibility"
+echo ""
+echo "  Output:"
+echo "    .dss/data/_system/themes/  ← CSS output for admin-ui"
+echo "    .dss/data/_system/tokens/  ← Token JSON files"
+echo "    admin-ui/src/stories/      ← Storybook stories"
+echo ""
+echo "  Workflow:"
+echo "    1. scripts/dss-init.sh --reset    # Fresh start"
+echo "    2. dss_sync_figma                 # Populate from Figma"
+echo "    3. scripts/dss-init.sh            # Validate + Build CSS"
+echo "    4. admin-ui imports themes/       # Ready to use"
+echo ""
diff --git a/scripts/dss-reset.sh b/scripts/dss-reset.sh
new file mode 100755
index 0000000..1b17874
--- /dev/null
+++ b/scripts/dss-reset.sh
@@ -0,0 +1,126 @@
+#!/bin/bash
+# DSS Full Reset Script
+# Clears all DSS data, skins, tokens, and generated files
+#
+# Usage: scripts/dss-reset.sh [--confirm]
+# Without --confirm, runs in dry-run mode showing what would be deleted
+
+set -e
+
+DSS_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+cd "$DSS_ROOT"
+
+DRY_RUN=true
+if [ "$1" = "--confirm" ]; then
+  DRY_RUN=false
+fi
+
+echo "=========================================="
+echo "  DSS Full Reset"
+echo "=========================================="
+echo ""
+
+if [ "$DRY_RUN" = true ]; then
+  echo "🔍 DRY RUN MODE - No changes will be made"
+  echo "   Run with --confirm to execute reset"
+  echo ""
+fi
+
+run_or_show() {
+  if [ "$DRY_RUN" = true ]; then
+    echo "  Would run: $*"
+  else
+    eval "$@"
+  fi
+}
+
+# 1. Clear .dss/data/ (preserves .dss/config/ which is IMMUTABLE)
+echo "1. Clearing .dss/data/ structure..."
+echo "   (preserving .dss/config/ - Figma credentials)"
+run_or_show "rm -rf .dss/data/projects/* .dss/data/teams/* .dss/data/_system/cache/* .dss/data/_system/activity/* 2>/dev/null || true"
+run_or_show "rm -rf .dss/data/_system/tokens/* .dss/data/_system/themes/* .dss/data/_system/components/* 2>/dev/null || true"
+run_or_show "mkdir -p .dss/data/{projects,teams,_system/{cache,activity,tokens,themes,components}}"
+
+# 2. Reset database
+echo "2. Resetting database..."
+run_or_show "rm -f .dss/dss.db .dss/dss.db.old"
+
+# 3. Remove admin-ui DSS CSS (keep non-dss files)
+echo "3. Removing admin-ui DSS CSS files..."
+run_or_show "rm -f admin-ui/css/dss-*.css"
+
+# 4. Remove generated stories and components
+echo "4. Removing generated stories and components..."
+run_or_show "rm -f admin-ui/src/components/*.stories.js admin-ui/src/components/ds-*.js"
+
+# 5. Reset core_tokens
+echo "5. Resetting core_tokens..."
+if [ "$DRY_RUN" = false ]; then
+  cat > dss/core_tokens/tokens.json << 'EOF'
+{
+  "_meta": {
+    "version": "1.0.0",
+    "generated": null,
+    "source": "awaiting Figma sync",
+    "status": "empty"
+  },
+  "tokens": {}
+}
+EOF
+else
+  echo "  Would reset: dss/core_tokens/tokens.json"
+fi
+
+# 6. Reset skins to empty
+echo "6. Resetting skins..."
+for skin in base classic workbench; do
+  if [ "$DRY_RUN" = false ]; then
+    if [ "$skin" = "base" ]; then
+      extends_line=""
+    else
+      extends_line='"extends": "base",'
+    fi
+    cat > "dss-claude-plugin/core/skins/${skin}.json" << EOF
+{
+  "meta": {
+    "id": "${skin}",
+    "version": "1.0.0",
+    "description": "${skin^} skin - awaiting Figma sync"${extends_line:+,
+    $extends_line}
+  },
+  "tokens": {}
+}
+EOF
+  else
+    echo "  Would reset: dss-claude-plugin/core/skins/${skin}.json"
+  fi
+done
+
+# 7. Clear caches and logs
+echo "7. Clearing caches and logs..."
+run_or_show "rm -f .dss/logs/*.jsonl 2>/dev/null || true"
+run_or_show "rm -rf .dss/logs/browser-logs/* 2>/dev/null || true"
+run_or_show "touch .dss/logs/dss-operations.jsonl .dss/logs/git-hooks.jsonl"
+
+# 8. Regenerate hash manifest
+echo "8. Regenerating hash manifest..."
+if [ "$DRY_RUN" = false ]; then
+  ./scripts/regenerate-core-hashes.sh
+else
+  echo "  Would run: ./scripts/regenerate-core-hashes.sh"
+fi
+
+# 9. Stop Storybook if running
+echo "9. Stopping Storybook..."
+run_or_show "pkill -f storybook 2>/dev/null || true"
+
+echo ""
+echo "=========================================="
+if [ "$DRY_RUN" = true ]; then
+  echo "  DRY RUN COMPLETE"
+  echo "  Run with --confirm to execute"
+else
+  echo "  DSS RESET COMPLETE"
+  echo "  Ready for fresh Figma sync"
+fi
+echo "=========================================="
diff --git a/scripts/dss-services.sh b/scripts/dss-services.sh
new file mode 100755
index 0000000..a750c32
--- /dev/null
+++ b/scripts/dss-services.sh
@@ -0,0 +1,311 @@
+#!/bin/bash
+# DSS Services Manager
+# Start, stop, and manage all DSS development services
+#
+# Usage: scripts/dss-services.sh <action> [--service NAME]
+#
+# Actions:
+#   start   - Start all services (or specific service)
+#   stop    - Stop all services (or specific service)
+#   status  - Show status of all services
+#   restart - Restart all services (or specific service)
+#   logs    - Show service logs
+
+set -e
+
+DSS_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+cd "$DSS_ROOT"
+
+# Colors
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+BLUE='\033[0;34m'
+CYAN='\033[0;36m'
+NC='\033[0m'
+
+# Service configuration
+declare -A SERVICES=(
+  ["api"]="8000"
+  ["admin-ui"]="3456"
+  ["storybook"]="6006"
+)
+
+declare -A SERVICE_CMDS=(
+  ["api"]="uvicorn apps.api.server:app --host 0.0.0.0 --port 8000 --reload"
+  ["admin-ui"]="npm run dev"
+  ["storybook"]="npm run storybook"
+)
+
+declare -A SERVICE_DIRS=(
+  ["api"]="$DSS_ROOT"
+  ["admin-ui"]="$DSS_ROOT/admin-ui"
+  ["storybook"]="$DSS_ROOT/admin-ui"
+)
+
+declare -A SERVICE_LOGS=(
+  ["api"]="/tmp/dss-api.log"
+  ["admin-ui"]="/tmp/dss-admin-ui.log"
+  ["storybook"]="/tmp/dss-storybook.log"
+)
+
+# Logging
+log_info() { echo -e "${CYAN}[INFO]${NC} $1"; }
+log_ok() { echo -e "${GREEN}[OK]${NC} $1"; }
+log_warn() { echo -e "${YELLOW}[WARN]${NC} $1"; }
+log_error() { echo -e "${RED}[ERROR]${NC} $1"; }
+
+# Check if port is in use
+is_port_active() {
+  local port=$1
+  lsof -i ":$port" &>/dev/null
+}
+
+# Get PID using port
+get_port_pid() {
+  local port=$1
+  lsof -ti ":$port" 2>/dev/null | head -1
+}
+
+# Start a single service
+start_service() {
+  local service=$1
+  local port=${SERVICES[$service]}
+  local cmd=${SERVICE_CMDS[$service]}
+  local dir=${SERVICE_DIRS[$service]}
+  local log=${SERVICE_LOGS[$service]}
+
+  if is_port_active "$port"; then
+    log_warn "$service already running on port $port"
+    return 0
+  fi
+
+  log_info "Starting $service on port $port..."
+
+  cd "$dir"
+
+  if [ "$service" = "api" ]; then
+    # Activate venv for API server
+    source "$DSS_ROOT/.venv/bin/activate"
+    nohup $cmd > "$log" 2>&1 &
+  else
+    nohup $cmd > "$log" 2>&1 &
+  fi
+
+  local pid=$!
+  cd "$DSS_ROOT"
+
+  # Wait for service to start
+  local max_wait=30
+  local waited=0
+  while [ $waited -lt $max_wait ]; do
+    if is_port_active "$port"; then
+      log_ok "$service started (PID: $(get_port_pid $port), port: $port)"
+      return 0
+    fi
+    sleep 1
+    ((waited++))
+  done
+
+  log_error "$service failed to start (check $log)"
+  return 1
+}
+
+# Stop a single service
+stop_service() {
+  local service=$1
+  local port=${SERVICES[$service]}
+
+  if ! is_port_active "$port"; then
+    log_info "$service not running"
+    return 0
+  fi
+
+  local pid=$(get_port_pid "$port")
+  log_info "Stopping $service (PID: $pid)..."
+
+  kill "$pid" 2>/dev/null || true
+  sleep 1
+
+  # Force kill if still running
+  if is_port_active "$port"; then
+    kill -9 "$(get_port_pid $port)" 2>/dev/null || true
+  fi
+
+  log_ok "$service stopped"
+}
+
+# Show status of all services
+show_status() {
+  echo ""
+  echo "╔══════════════════════════════════════════════════════════════╗"
+  echo "║                     DSS SERVICES STATUS                      ║"
+  echo "╚══════════════════════════════════════════════════════════════╝"
+  echo ""
+  printf "  %-12s %-8s %-8s %-30s\n" "SERVICE" "PORT" "STATUS" "URL"
+  echo "  ──────────────────────────────────────────────────────────────"
+
+  for service in api admin-ui storybook; do
+    local port=${SERVICES[$service]}
+    local status="STOPPED"
+    local color=$RED
+    local url="-"
+
+    if is_port_active "$port"; then
+      status="RUNNING"
+      color=$GREEN
+      url="http://localhost:$port"
+    fi
+
+    printf "  %-12s %-8s ${color}%-8s${NC} %-30s\n" "$service" "$port" "$status" "$url"
+  done
+
+  echo ""
+  echo "  Logs:"
+  for service in api admin-ui storybook; do
+    echo "    $service: ${SERVICE_LOGS[$service]}"
+  done
+  echo ""
+}
+
+# Show logs for a service
+show_logs() {
+  local service=$1
+  local log=${SERVICE_LOGS[$service]}
+
+  if [ -z "$log" ]; then
+    log_error "Unknown service: $service"
+    return 1
+  fi
+
+  if [ ! -f "$log" ]; then
+    log_warn "No log file found: $log"
+    return 0
+  fi
+
+  echo "=== $service logs ($log) ==="
+  tail -50 "$log"
+}
+
+# Main command handling
+ACTION=${1:-status}
+SPECIFIC_SERVICE=""
+
+# Parse arguments
+shift || true
+while [[ $# -gt 0 ]]; do
+  case $1 in
+    --service|-s)
+      SPECIFIC_SERVICE="$2"
+      shift 2
+      ;;
+    api|admin-ui|storybook)
+      SPECIFIC_SERVICE="$1"
+      shift
+      ;;
+    *)
+      shift
+      ;;
+  esac
+done
+
+case $ACTION in
+  start)
+    echo ""
+    echo "╔══════════════════════════════════════════════════════════════╗"
+    echo "║                    STARTING DSS SERVICES                     ║"
+    echo "╚══════════════════════════════════════════════════════════════╝"
+    echo ""
+
+    if [ -n "$SPECIFIC_SERVICE" ]; then
+      start_service "$SPECIFIC_SERVICE"
+    else
+      for service in api admin-ui storybook; do
+        start_service "$service"
+      done
+    fi
+
+    echo ""
+    show_status
+    ;;
+
+  stop)
+    echo ""
+    echo "╔══════════════════════════════════════════════════════════════╗"
+    echo "║                    STOPPING DSS SERVICES                     ║"
+    echo "╚══════════════════════════════════════════════════════════════╝"
+    echo ""
+
+    if [ -n "$SPECIFIC_SERVICE" ]; then
+      stop_service "$SPECIFIC_SERVICE"
+    else
+      for service in api admin-ui storybook; do
+        stop_service "$service"
+      done
+    fi
+
+    echo ""
+    show_status
+    ;;
+
+  restart)
+    echo ""
+    echo "╔══════════════════════════════════════════════════════════════╗"
+    echo "║                   RESTARTING DSS SERVICES                    ║"
+    echo "╚══════════════════════════════════════════════════════════════╝"
+    echo ""
+
+    if [ -n "$SPECIFIC_SERVICE" ]; then
+      stop_service "$SPECIFIC_SERVICE"
+      sleep 1
+      start_service "$SPECIFIC_SERVICE"
+    else
+      for service in api admin-ui storybook; do
+        stop_service "$service"
+      done
+      sleep 2
+      for service in api admin-ui storybook; do
+        start_service "$service"
+      done
+    fi
+
+    echo ""
+    show_status
+    ;;
+
+  status)
+    show_status
+    ;;
+
+  logs)
+    if [ -n "$SPECIFIC_SERVICE" ]; then
+      show_logs "$SPECIFIC_SERVICE"
+    else
+      for service in api admin-ui storybook; do
+        show_logs "$service"
+        echo ""
+      done
+    fi
+    ;;
+
+  *)
+    echo "DSS Services Manager"
+    echo ""
+    echo "Usage: $0 <action> [--service NAME]"
+    echo ""
+    echo "Actions:"
+    echo "  start    Start all services (or specific service)"
+    echo "  stop     Stop all services (or specific service)"
+    echo "  status   Show status of all services"
+    echo "  restart  Restart all services (or specific service)"
+    echo "  logs     Show service logs"
+    echo ""
+    echo "Services: api, admin-ui, storybook"
+    echo ""
+    echo "Examples:"
+    echo "  $0 start                    # Start all services"
+    echo "  $0 start --service api      # Start only API server"
+    echo "  $0 stop storybook           # Stop Storybook"
+    echo "  $0 logs admin-ui            # Show admin-ui logs"
+    ;;
+esac
diff --git a/scripts/dss-setup.sh b/scripts/dss-setup.sh
new file mode 100755
index 0000000..6d939b5
--- /dev/null
+++ b/scripts/dss-setup.sh
@@ -0,0 +1,178 @@
+#!/bin/bash
+# DSS Complete Setup Script
+# Sets up MCP, initializes DSS structure, and starts services
+#
+# Usage: scripts/dss-setup.sh [--reset] [--skip-servers]
+#
+# Flow:
+# 1. Generate MCP configuration
+# 2. Install dependencies if needed
+# 3. Initialize DSS structure (dss-init.sh)
+# 4. Start development servers
+
+set -e
+
+DSS_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+cd "$DSS_ROOT"
+
+# Parse arguments
+RESET=false
+SKIP_SERVERS=false
+for arg in "$@"; do
+  case $arg in
+    --reset) RESET=true ;;
+    --skip-servers) SKIP_SERVERS=true ;;
+  esac
+done
+
+# Colors
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+BLUE='\033[0;34m'
+CYAN='\033[0;36m'
+NC='\033[0m'
+
+log_step() { echo -e "${BLUE}[SETUP]${NC} $1"; }
+log_ok() { echo -e "${GREEN}[OK]${NC} $1"; }
+log_warn() { echo -e "${YELLOW}[WARN]${NC} $1"; }
+log_info() { echo -e "${CYAN}[INFO]${NC} $1"; }
+
+echo "╔══════════════════════════════════════════════════════════════╗"
+echo "║                     DSS COMPLETE SETUP                       ║"
+echo "╚══════════════════════════════════════════════════════════════╝"
+echo ""
+
+# ============================================================================
+# STEP 1: Generate MCP Configuration
+# ============================================================================
+log_step "1. Generating MCP configuration..."
+
+cat > "$DSS_ROOT/.mcp.json" << EOF
+{
+  "\$schema": "https://raw.githubusercontent.com/anthropics/claude-code/main/schemas/mcp-servers.schema.json",
+  "mcpServers": {
+    "dss": {
+      "command": "$DSS_ROOT/.venv/bin/python3",
+      "args": ["$DSS_ROOT/dss-claude-plugin/servers/dss-mcp-server.py"],
+      "env": {
+        "PYTHONPATH": "$DSS_ROOT:$DSS_ROOT/dss-claude-plugin",
+        "DSS_HOME": "$DSS_ROOT/.dss",
+        "DSS_DATABASE": "$DSS_ROOT/.dss/dss.db",
+        "DSS_CACHE": "$DSS_ROOT/.dss/cache",
+        "DSS_BASE_PATH": "$DSS_ROOT"
+      },
+      "description": "Design System Server MCP - local development"
+    }
+  }
+}
+EOF
+log_ok "MCP config generated: .mcp.json"
+
+echo ""
+
+# ============================================================================
+# STEP 2: Check/Install Dependencies
+# ============================================================================
+log_step "2. Checking dependencies..."
+
+# Check Python venv
+if [ ! -d "$DSS_ROOT/.venv" ]; then
+  log_info "Creating Python virtual environment..."
+  python3 -m venv "$DSS_ROOT/.venv"
+fi
+
+# Activate venv and check packages
+source "$DSS_ROOT/.venv/bin/activate"
+if ! python3 -c "import mcp" 2>/dev/null; then
+  log_info "Installing MCP package..."
+  pip install mcp 2>/dev/null || log_warn "MCP package install failed"
+fi
+log_ok "Python venv ready"
+
+# Check admin-ui node_modules
+if [ ! -d "$DSS_ROOT/admin-ui/node_modules" ]; then
+  log_info "Installing admin-ui dependencies..."
+  cd "$DSS_ROOT/admin-ui" && npm install
+  cd "$DSS_ROOT"
+fi
+log_ok "Node dependencies ready"
+
+echo ""
+
+# ============================================================================
+# STEP 3: Initialize DSS Structure
+# ============================================================================
+log_step "3. Running DSS initialization..."
+
+if [ "$RESET" = true ]; then
+  "$DSS_ROOT/scripts/dss-init.sh" --reset
+else
+  "$DSS_ROOT/scripts/dss-init.sh"
+fi
+
+echo ""
+
+# ============================================================================
+# STEP 4: Start Development Servers
+# ============================================================================
+if [ "$SKIP_SERVERS" = false ]; then
+  log_step "4. Starting development servers..."
+
+  # Kill existing processes
+  pkill -f "vite.*admin-ui" 2>/dev/null || true
+  pkill -f "storybook.*6006" 2>/dev/null || true
+  sleep 1
+
+  # Start admin-ui (Vite)
+  cd "$DSS_ROOT/admin-ui"
+  nohup npm run dev > /tmp/dss-admin-ui.log 2>&1 &
+  VITE_PID=$!
+  log_info "admin-ui starting (PID: $VITE_PID)..."
+
+  # Start Storybook
+  nohup npm run storybook > /tmp/dss-storybook.log 2>&1 &
+  SB_PID=$!
+  log_info "Storybook starting (PID: $SB_PID)..."
+
+  cd "$DSS_ROOT"
+
+  # Wait for servers
+  sleep 5
+
+  # Check status
+  if curl -s -o /dev/null -w "" http://localhost:3456 2>/dev/null; then
+    log_ok "admin-ui running on http://localhost:3456"
+  else
+    log_warn "admin-ui not responding yet (check /tmp/dss-admin-ui.log)"
+  fi
+
+  if curl -s -o /dev/null -w "" http://localhost:6006 2>/dev/null; then
+    log_ok "Storybook running on http://localhost:6006"
+  else
+    log_warn "Storybook not responding yet (check /tmp/dss-storybook.log)"
+  fi
+
+  echo ""
+else
+  log_step "4. Skipping servers (--skip-servers)"
+  echo ""
+fi
+
+# ============================================================================
+# SUMMARY
+# ============================================================================
+echo "╔══════════════════════════════════════════════════════════════╗"
+echo "║                    DSS SETUP COMPLETE                        ║"
+echo "╚══════════════════════════════════════════════════════════════╝"
+echo ""
+echo "  Services:"
+echo "    admin-ui:   http://localhost:3456"
+echo "    Storybook:  http://localhost:6006"
+echo ""
+echo "  Logs:"
+echo "    /tmp/dss-admin-ui.log"
+echo "    /tmp/dss-storybook.log"
+echo ""
+echo "  Next: Restart Claude Code to load DSS MCP server"
+echo ""
diff --git a/scripts/figma-sync.py b/scripts/figma-sync.py
new file mode 100755
index 0000000..4d9b036
--- /dev/null
+++ b/scripts/figma-sync.py
@@ -0,0 +1,1105 @@
+#!/usr/bin/env python3
+"""
+DSS Intelligent Figma Sync
+
+4-Layer Pipeline Architecture:
+  1. API Layer      - Rate-limited Figma API access with caching
+  2. Validation     - Design linting and contract enforcement
+  3. Extraction     - Variables, Styles, Components extraction
+  4. Translation    - Figma → DSS canonical format with W3C tokens
+
+Features:
+  - Exponential backoff rate limiting with request queue
+  - lastModified caching to minimize API calls
+  - Figma Variables extraction (colors, spacing, breakpoints)
+  - Style extraction (typography, effects)
+  - Component variant classification (visual props vs interaction states)
+  - W3C Design Token format output
+  - Design contract validation
+
+Usage: python3 scripts/figma-sync.py [--file-key KEY] [--force] [--verbose]
+"""
+
+import sys
+import os
+import json
+import asyncio
+import time
+import hashlib
+import re
+from pathlib import Path
+from datetime import datetime, timedelta
+from dataclasses import dataclass, field, asdict
+from typing import Dict, List, Optional, Any, Set
+from enum import Enum
+import aiohttp
+
+# =============================================================================
+# CONFIGURATION
+# =============================================================================
+
+DSS_ROOT = Path(__file__).parent.parent
+CACHE_DIR = DSS_ROOT / ".dss/cache"
+TOKENS_DIR = DSS_ROOT / ".dss/data/_system/tokens"
+COMPONENTS_DIR = DSS_ROOT / ".dss/components"
+SKINS_DIR = DSS_ROOT / ".dss/skins"
+
+# Rate limiting
+MAX_REQUESTS_PER_MINUTE = 30
+INITIAL_BACKOFF_SECONDS = 2
+MAX_BACKOFF_SECONDS = 120
+MAX_RETRIES = 5
+
+# Caching
+CACHE_TTL_HOURS = 24
+
+# Variant classification
+VISUAL_PROPS = {"Size", "Variant", "Roundness", "Type", "Icon", "Orientation", "Layout"}
+INTERACTION_STATES = {"State", "Hover", "Focused", "Pressed", "Active", "Disabled"}
+BOOLEAN_PROPS = {"Checked?", "Selected", "Open", "Expanded", "Loading", "Flip Icon"}
+
+# Design contract - required naming patterns
+VALID_NAME_PATTERN = re.compile(r'^[A-Z][a-zA-Z0-9 /-]*$')
+INVALID_NAME_PATTERNS = [
+    re.compile(r'^Property \d+$'),
+    re.compile(r'^Frame \d+$'),
+    re.compile(r'^Group \d+$'),
+    re.compile(r'^Component \d+$'),
+]
+
+
+# =============================================================================
+# DATA CLASSES
+# =============================================================================
+
+class TokenType(Enum):
+    COLOR = "color"
+    SPACING = "dimension"
+    TYPOGRAPHY = "typography"
+    SHADOW = "shadow"
+    BORDER = "border"
+    OPACITY = "number"
+    DURATION = "duration"
+    CUBIC_BEZIER = "cubicBezier"
+
+
+@dataclass
+class W3CToken:
+    """W3C Design Token format"""
+    value: Any
+    type: str
+    description: str = ""
+    extensions: Dict = field(default_factory=dict)
+
+    def to_dict(self) -> Dict:
+        result = {
+            "$value": self.value,
+            "$type": self.type,
+        }
+        if self.description:
+            result["$description"] = self.description
+        if self.extensions:
+            result["$extensions"] = self.extensions
+        return result
+
+
+@dataclass
+class ValidationIssue:
+    """Design validation issue"""
+    severity: str  # error, warning, info
+    component: str
+    message: str
+    suggestion: str = ""
+
+
+@dataclass
+class SyncManifest:
+    """Cache manifest for tracking sync state"""
+    file_key: str
+    last_modified: str
+    synced_at: str
+    node_hashes: Dict[str, str] = field(default_factory=dict)
+    extracted_tokens: int = 0
+    extracted_components: int = 0
+    validation_issues: int = 0
+
+
+# =============================================================================
+# RATE LIMITER
+# =============================================================================
+
+class RateLimiter:
+    """Exponential backoff rate limiter with request queue"""
+
+    def __init__(self, max_per_minute: int = MAX_REQUESTS_PER_MINUTE):
+        self.max_per_minute = max_per_minute
+        self.requests: List[float] = []
+        self.backoff_until: float = 0
+        self.consecutive_429s: int = 0
+        self._lock = asyncio.Lock()
+
+    async def acquire(self):
+        """Wait for rate limit slot"""
+        async with self._lock:
+            now = time.time()
+
+            # Check if in backoff period
+            if now < self.backoff_until:
+                wait_time = self.backoff_until - now
+                print(f"  [RATE] Backoff: waiting {wait_time:.1f}s")
+                await asyncio.sleep(wait_time)
+                now = time.time()
+
+            # Clean old requests (older than 1 minute)
+            self.requests = [t for t in self.requests if now - t < 60]
+
+            # Wait if at limit
+            if len(self.requests) >= self.max_per_minute:
+                oldest = self.requests[0]
+                wait_time = 60 - (now - oldest) + 0.1
+                if wait_time > 0:
+                    print(f"  [RATE] Limit reached: waiting {wait_time:.1f}s")
+                    await asyncio.sleep(wait_time)
+                    now = time.time()
+                    self.requests = [t for t in self.requests if now - t < 60]
+
+            self.requests.append(now)
+
+    def handle_429(self):
+        """Handle rate limit response with exponential backoff"""
+        self.consecutive_429s += 1
+        backoff = min(
+            INITIAL_BACKOFF_SECONDS * (2 ** self.consecutive_429s),
+            MAX_BACKOFF_SECONDS
+        )
+        self.backoff_until = time.time() + backoff
+        print(f"  [RATE] 429 received: backoff {backoff}s (attempt {self.consecutive_429s})")
+        return backoff
+
+    def reset_backoff(self):
+        """Reset backoff after successful request"""
+        self.consecutive_429s = 0
+
+
+# =============================================================================
+# FIGMA API CLIENT
+# =============================================================================
+
+class IntelligentFigmaClient:
+    """Figma API client with caching and rate limiting"""
+
+    def __init__(self, token: str, verbose: bool = False):
+        self.token = token
+        self.verbose = verbose
+        self.rate_limiter = RateLimiter()
+        self.base_url = "https://api.figma.com/v1"
+        self._session: Optional[aiohttp.ClientSession] = None
+
+    async def __aenter__(self):
+        self._session = aiohttp.ClientSession(
+            headers={"X-Figma-Token": self.token}
+        )
+        return self
+
+    async def __aexit__(self, *args):
+        if self._session:
+            await self._session.close()
+
+    async def _request(self, endpoint: str, params: Dict = None) -> Dict:
+        """Make rate-limited API request with retries"""
+        url = f"{self.base_url}/{endpoint}"
+
+        for attempt in range(MAX_RETRIES):
+            await self.rate_limiter.acquire()
+
+            try:
+                if self.verbose:
+                    print(f"  [API] GET {endpoint}")
+
+                async with self._session.get(url, params=params) as resp:
+                    if resp.status == 429:
+                        backoff = self.rate_limiter.handle_429()
+                        if attempt < MAX_RETRIES - 1:
+                            await asyncio.sleep(backoff)
+                            continue
+                        raise Exception(f"Rate limit exceeded after {MAX_RETRIES} retries")
+
+                    self.rate_limiter.reset_backoff()
+
+                    if resp.status != 200:
+                        text = await resp.text()
+                        raise Exception(f"API error {resp.status}: {text[:200]}")
+
+                    return await resp.json()
+
+            except aiohttp.ClientError as e:
+                if attempt < MAX_RETRIES - 1:
+                    wait = INITIAL_BACKOFF_SECONDS * (2 ** attempt)
+                    print(f"  [API] Connection error, retry in {wait}s: {e}")
+                    await asyncio.sleep(wait)
+                    continue
+                raise
+
+        raise Exception(f"Failed after {MAX_RETRIES} attempts")
+
+    async def get_file(self, file_key: str) -> Dict:
+        """Get full Figma file"""
+        return await self._request(f"files/{file_key}")
+
+    async def get_file_meta(self, file_key: str) -> Dict:
+        """Get file metadata (lightweight, for caching check)"""
+        return await self._request(f"files/{file_key}", {"depth": 1})
+
+    async def get_file_variables(self, file_key: str) -> Dict:
+        """Get Figma variables (colors, spacing, etc.)"""
+        return await self._request(f"files/{file_key}/variables/local")
+
+    async def get_file_styles(self, file_key: str) -> Dict:
+        """Get published styles"""
+        return await self._request(f"files/{file_key}/styles")
+
+    async def get_file_components(self, file_key: str) -> Dict:
+        """Get components and component sets"""
+        data = await self._request(f"files/{file_key}/components")
+        return data
+
+
+# =============================================================================
+# CACHE MANAGER
+# =============================================================================
+
+class CacheManager:
+    """Manages sync cache and incremental updates"""
+
+    def __init__(self, cache_dir: Path = CACHE_DIR):
+        self.cache_dir = cache_dir
+        self.cache_dir.mkdir(parents=True, exist_ok=True)
+        self.manifest_path = cache_dir / "figma-sync-manifest.json"
+
+    def load_manifest(self, file_key: str) -> Optional[SyncManifest]:
+        """Load cached manifest for file"""
+        if not self.manifest_path.exists():
+            return None
+
+        try:
+            with open(self.manifest_path) as f:
+                data = json.load(f)
+
+            if file_key not in data:
+                return None
+
+            entry = data[file_key]
+            return SyncManifest(
+                file_key=entry.get("file_key", file_key),
+                last_modified=entry.get("last_modified", ""),
+                synced_at=entry.get("synced_at", ""),
+                node_hashes=entry.get("node_hashes", {}),
+                extracted_tokens=entry.get("extracted_tokens", 0),
+                extracted_components=entry.get("extracted_components", 0),
+                validation_issues=entry.get("validation_issues", 0)
+            )
+        except (json.JSONDecodeError, KeyError):
+            return None
+
+    def save_manifest(self, manifest: SyncManifest):
+        """Save manifest to cache"""
+        data = {}
+        if self.manifest_path.exists():
+            try:
+                with open(self.manifest_path) as f:
+                    data = json.load(f)
+            except json.JSONDecodeError:
+                data = {}
+
+        data[manifest.file_key] = asdict(manifest)
+
+        with open(self.manifest_path, "w") as f:
+            json.dump(data, f, indent=2)
+
+    def should_sync(self, file_key: str, remote_modified: str) -> bool:
+        """Check if sync is needed based on cache"""
+        manifest = self.load_manifest(file_key)
+
+        if not manifest:
+            return True
+
+        # Check if remote is newer
+        if manifest.last_modified != remote_modified:
+            return True
+
+        # Check cache TTL
+        try:
+            synced = datetime.fromisoformat(manifest.synced_at.replace("Z", "+00:00"))
+            if datetime.now(synced.tzinfo) - synced > timedelta(hours=CACHE_TTL_HOURS):
+                return True
+        except (ValueError, TypeError):
+            return True
+
+        return False
+
+
+# =============================================================================
+# DESIGN VALIDATOR
+# =============================================================================
+
+class DesignValidator:
+    """Validates Figma design against DSS contract"""
+
+    def __init__(self):
+        self.issues: List[ValidationIssue] = []
+
+    def validate_component_name(self, name: str) -> bool:
+        """Check if component name follows conventions"""
+        for pattern in INVALID_NAME_PATTERNS:
+            if pattern.match(name):
+                return False
+        return True
+
+    def validate_variant_props(self, component_name: str, variant_props: Dict) -> List[ValidationIssue]:
+        """Validate variant property naming"""
+        issues = []
+
+        for prop_name, values in variant_props.items():
+            # Check for auto-generated names
+            if not self.validate_component_name(prop_name):
+                issues.append(ValidationIssue(
+                    severity="error",
+                    component=component_name,
+                    message=f"Invalid variant property name: '{prop_name}'",
+                    suggestion="Use PascalCase names like 'Size', 'Variant', 'State'"
+                ))
+
+            # Check values
+            for value in values if isinstance(values, list) else [values]:
+                if isinstance(value, str) and not self.validate_component_name(value):
+                    issues.append(ValidationIssue(
+                        severity="warning",
+                        component=component_name,
+                        message=f"Invalid variant value: '{value}' in {prop_name}",
+                        suggestion="Use PascalCase values like 'Large', 'Primary', 'Hover'"
+                    ))
+
+        return issues
+
+    def validate_component(self, component: Dict) -> List[ValidationIssue]:
+        """Validate a component set"""
+        issues = []
+        name = component.get("name", "Unknown")
+
+        # Check component name
+        if not self.validate_component_name(name):
+            issues.append(ValidationIssue(
+                severity="error",
+                component=name,
+                message=f"Invalid component name: '{name}'",
+                suggestion="Rename to PascalCase (e.g., 'Button', 'InputField')"
+            ))
+
+        # Check variant properties
+        variant_props = component.get("variant_dimensions", {})
+        issues.extend(self.validate_variant_props(name, variant_props))
+
+        self.issues.extend(issues)
+        return issues
+
+    def get_report(self) -> Dict:
+        """Generate validation report"""
+        errors = [i for i in self.issues if i.severity == "error"]
+        warnings = [i for i in self.issues if i.severity == "warning"]
+
+        return {
+            "total_issues": len(self.issues),
+            "errors": len(errors),
+            "warnings": len(warnings),
+            "issues": [asdict(i) for i in self.issues],
+            "valid": len(errors) == 0
+        }
+
+
+# =============================================================================
+# TOKEN EXTRACTORS
+# =============================================================================
+
+class VariableExtractor:
+    """Extracts tokens from Figma Variables"""
+
+    def __init__(self, verbose: bool = False):
+        self.verbose = verbose
+
+    def extract(self, variables_data: Dict) -> Dict[str, W3CToken]:
+        """Extract variables as W3C tokens"""
+        tokens = {}
+
+        meta = variables_data.get("meta", {})
+        variables = meta.get("variables", {})
+        collections = meta.get("variableCollections", {})
+
+        if self.verbose:
+            print(f"  [VAR] Found {len(variables)} variables in {len(collections)} collections")
+
+        for var_id, var in variables.items():
+            name = var.get("name", "")
+            resolved_type = var.get("resolvedType", "")
+
+            # Get collection for namespacing
+            collection_id = var.get("variableCollectionId", "")
+            collection = collections.get(collection_id, {})
+            collection_name = collection.get("name", "").lower().replace(" ", "-")
+
+            # Build token path
+            token_path = f"{collection_name}.{name}".replace("/", ".")
+            token_path = self._sanitize_path(token_path)
+
+            # Get value (use first mode)
+            values_by_mode = var.get("valuesByMode", {})
+            modes = collection.get("modes", [])
+
+            if not values_by_mode or not modes:
+                continue
+
+            first_mode_id = modes[0].get("modeId") if modes else None
+            value = values_by_mode.get(first_mode_id)
+
+            if value is None:
+                continue
+
+            # Handle different value types
+            token = self._create_token(name, resolved_type, value, var_id)
+            if token:
+                tokens[token_path] = token
+
+        return tokens
+
+    def _sanitize_path(self, path: str) -> str:
+        """Sanitize token path"""
+        return path.lower().replace(" ", "-").replace("--", "-").strip("-.")
+
+    def _create_token(self, name: str, resolved_type: str, value: Any, var_id: str) -> Optional[W3CToken]:
+        """Create W3C token from Figma variable"""
+        extensions = {"figma": {"variableId": var_id}}
+
+        if resolved_type == "COLOR":
+            if isinstance(value, dict):
+                # Check if it's a reference
+                if "id" in value:
+                    # Variable alias - preserve reference
+                    return W3CToken(
+                        value=f"{{var:{value['id']}}}",
+                        type="color",
+                        description=f"Alias to {value.get('id', '')}",
+                        extensions={**extensions, "alias": True}
+                    )
+                else:
+                    # Direct color value
+                    css_color = self._rgba_to_css(value)
+                    return W3CToken(
+                        value=css_color,
+                        type="color",
+                        extensions=extensions
+                    )
+
+        elif resolved_type == "FLOAT":
+            if isinstance(value, (int, float)):
+                # Determine if spacing/dimension based on name
+                token_type = "dimension" if any(
+                    x in name.lower() for x in ["spacing", "size", "width", "height", "radius", "gap"]
+                ) else "number"
+
+                return W3CToken(
+                    value=f"{value}px" if token_type == "dimension" else value,
+                    type=token_type,
+                    extensions=extensions
+                )
+
+        elif resolved_type == "STRING":
+            return W3CToken(
+                value=str(value),
+                type="string",
+                extensions=extensions
+            )
+
+        return None
+
+    def _rgba_to_css(self, color: Dict) -> str:
+        """Convert Figma RGBA to CSS"""
+        r = int(color.get("r", 0) * 255)
+        g = int(color.get("g", 0) * 255)
+        b = int(color.get("b", 0) * 255)
+        a = round(color.get("a", 1), 3)
+
+        if a == 1:
+            return f"#{r:02x}{g:02x}{b:02x}"
+        return f"rgba({r}, {g}, {b}, {a})"
+
+
+class StyleExtractor:
+    """Extracts tokens from Figma Styles"""
+
+    def __init__(self, verbose: bool = False):
+        self.verbose = verbose
+
+    def extract(self, file_data: Dict) -> Dict[str, W3CToken]:
+        """Extract styles as W3C tokens"""
+        tokens = {}
+
+        styles = file_data.get("styles", {})
+        doc = file_data.get("document", {})
+
+        by_type = {"TEXT": [], "FILL": [], "EFFECT": [], "GRID": []}
+        for style_id, style in styles.items():
+            st = style.get("styleType", "OTHER")
+            if st in by_type:
+                by_type[st].append({"id": style_id, **style})
+
+        if self.verbose:
+            print(f"  [STY] TEXT: {len(by_type['TEXT'])}, FILL: {len(by_type['FILL'])}, EFFECT: {len(by_type['EFFECT'])}")
+
+        # Extract typography
+        for ts in by_type["TEXT"]:
+            node = self._find_styled_node(doc, ts["id"])
+            if node and node.get("style"):
+                name = self._sanitize_name(ts["name"])
+                style_props = node["style"]
+
+                tokens[f"typography.{name}"] = W3CToken(
+                    value={
+                        "fontFamily": style_props.get("fontFamily", "Inter"),
+                        "fontWeight": style_props.get("fontWeight", 400),
+                        "fontSize": f"{round(style_props.get('fontSize', 16))}px",
+                        "lineHeight": f"{round(style_props.get('lineHeightPx', 24))}px",
+                        "letterSpacing": f"{round(style_props.get('letterSpacing', 0), 2)}px"
+                    },
+                    type="typography",
+                    extensions={"figma": {"styleId": ts["id"]}}
+                )
+
+        # Extract effects (shadows)
+        for es in by_type["EFFECT"]:
+            node = self._find_styled_node(doc, es["id"])
+            if node and node.get("effects"):
+                name = self._sanitize_name(es["name"])
+                css_shadow = self._effects_to_css(node["effects"])
+
+                tokens[f"shadow.{name}"] = W3CToken(
+                    value=css_shadow,
+                    type="shadow",
+                    extensions={"figma": {"styleId": es["id"]}}
+                )
+
+        # Extract fill colors
+        for fs in by_type["FILL"]:
+            node = self._find_styled_node(doc, fs["id"])
+            if node and node.get("fills"):
+                name = self._sanitize_name(fs["name"])
+                fills = node["fills"]
+
+                if fills and fills[0].get("type") == "SOLID":
+                    color = fills[0].get("color", {})
+                    css_color = self._rgba_to_css(color)
+
+                    tokens[f"color.{name}"] = W3CToken(
+                        value=css_color,
+                        type="color",
+                        extensions={"figma": {"styleId": fs["id"]}}
+                    )
+
+        return tokens
+
+    def _find_styled_node(self, node: Dict, target_style_id: str, depth: int = 0) -> Optional[Dict]:
+        """Find node using a style"""
+        if depth > 20:
+            return None
+
+        for role, sid in node.get("styles", {}).items():
+            if sid == target_style_id:
+                return node
+
+        for child in node.get("children", []):
+            result = self._find_styled_node(child, target_style_id, depth + 1)
+            if result:
+                return result
+
+        return None
+
+    def _sanitize_name(self, name: str) -> str:
+        """Sanitize style name"""
+        return name.lower().replace("/", ".").replace(" ", "-").replace("--", "-")
+
+    def _rgba_to_css(self, color: Dict) -> str:
+        """Convert Figma RGBA to CSS"""
+        r = int(color.get("r", 0) * 255)
+        g = int(color.get("g", 0) * 255)
+        b = int(color.get("b", 0) * 255)
+        a = round(color.get("a", 1), 3)
+
+        if a == 1:
+            return f"#{r:02x}{g:02x}{b:02x}"
+        return f"rgba({r}, {g}, {b}, {a})"
+
+    def _effects_to_css(self, effects: List[Dict]) -> str:
+        """Convert Figma effects to CSS box-shadow"""
+        shadows = []
+        for effect in effects:
+            if not effect.get("visible", True):
+                continue
+
+            etype = effect.get("type", "")
+            if etype in ("DROP_SHADOW", "INNER_SHADOW"):
+                color = self._rgba_to_css(effect.get("color", {}))
+                offset = effect.get("offset", {})
+                x = offset.get("x", 0)
+                y = offset.get("y", 0)
+                radius = effect.get("radius", 0)
+                spread = effect.get("spread", 0)
+
+                prefix = "inset " if etype == "INNER_SHADOW" else ""
+                shadows.append(f"{prefix}{x}px {y}px {radius}px {spread}px {color}")
+
+        return ", ".join(shadows) if shadows else "none"
+
+
+class ComponentExtractor:
+    """Extracts components with intelligent variant classification"""
+
+    def __init__(self, validator: DesignValidator, verbose: bool = False):
+        self.validator = validator
+        self.verbose = verbose
+
+    def extract(self, file_data: Dict) -> Dict:
+        """Extract components with variant classification"""
+        component_sets = file_data.get("componentSets", {})
+        components = file_data.get("components", {})
+
+        registry = {
+            "file_name": file_data.get("name", "Unknown"),
+            "extracted_at": datetime.now().isoformat(),
+            "component_count": 0,
+            "components": {}
+        }
+
+        # Build component set map
+        set_map = {}
+        for set_id, set_data in component_sets.items():
+            set_name = set_data.get("name", "Unknown")
+            set_map[set_id] = {
+                "id": set_id,
+                "name": set_name,
+                "key": set_data.get("key", ""),
+                "description": set_data.get("description", ""),
+                "variants": [],
+                "variant_dimensions": {},
+                "props": {},  # Visual props for Storybook
+                "states": {}  # Interaction states (CSS only)
+            }
+
+        # Assign components to sets and extract variants
+        for comp_id, comp_data in components.items():
+            set_id = comp_data.get("componentSetId")
+            if not set_id or set_id not in set_map:
+                continue
+
+            variant_name = comp_data.get("name", "")
+            variant_props = self._parse_variant_name(variant_name)
+
+            set_map[set_id]["variants"].append({
+                "id": comp_id,
+                "name": variant_name,
+                "props": variant_props
+            })
+
+            # Build dimensions
+            for prop_name, prop_value in variant_props.items():
+                if prop_name not in set_map[set_id]["variant_dimensions"]:
+                    set_map[set_id]["variant_dimensions"][prop_name] = set()
+                set_map[set_id]["variant_dimensions"][prop_name].add(prop_value)
+
+        # Classify variants and validate
+        for set_id, set_data in set_map.items():
+            # Convert sets to lists
+            for dim_name in set_data["variant_dimensions"]:
+                values = sorted(set_data["variant_dimensions"][dim_name])
+                set_data["variant_dimensions"][dim_name] = values
+
+                # Classify as prop or state
+                if dim_name in VISUAL_PROPS or dim_name in BOOLEAN_PROPS:
+                    set_data["props"][dim_name] = {
+                        "values": values,
+                        "type": "boolean" if dim_name in BOOLEAN_PROPS else "select",
+                        "default": values[0] if values else None
+                    }
+                elif dim_name in INTERACTION_STATES:
+                    set_data["states"][dim_name] = {
+                        "values": values,
+                        "css_pseudo": self._get_css_pseudo(dim_name)
+                    }
+                else:
+                    # Unknown - treat as prop with warning
+                    set_data["props"][dim_name] = {
+                        "values": values,
+                        "type": "select",
+                        "default": values[0] if values else None
+                    }
+
+            # Validate
+            self.validator.validate_component(set_data)
+
+            # Add to registry
+            registry["components"][set_data["name"]] = set_data
+            registry["component_count"] += 1
+
+        if self.verbose:
+            print(f"  [CMP] Extracted {registry['component_count']} component sets")
+
+        return registry
+
+    def _parse_variant_name(self, name: str) -> Dict[str, str]:
+        """Parse 'Prop=Value, Prop2=Value2' format"""
+        props = {}
+        for part in name.split(", "):
+            if "=" in part:
+                key, value = part.split("=", 1)
+                props[key.strip()] = value.strip()
+        return props
+
+    def _get_css_pseudo(self, state_name: str) -> str:
+        """Map state to CSS pseudo-class"""
+        mapping = {
+            "Hover": ":hover",
+            "Focused": ":focus",
+            "Focus": ":focus",
+            "Pressed": ":active",
+            "Active": ":active",
+            "Disabled": ":disabled",
+            "State": ""  # Generic, needs value check
+        }
+        return mapping.get(state_name, "")
+
+
+# =============================================================================
+# TRANSLATION LAYER
+# =============================================================================
+
+class FigmaToDSSTranslator:
+    """Translates Figma tokens to DSS canonical format"""
+
+    # DSS canonical token categories
+    DSS_CATEGORIES = ["color", "spacing", "typography", "shadow", "border", "radius", "motion", "opacity"]
+
+    def __init__(self, verbose: bool = False):
+        self.verbose = verbose
+
+    def translate(self, variable_tokens: Dict, style_tokens: Dict) -> Dict:
+        """Merge and translate tokens to W3C format with DSS structure"""
+        output = {
+            "$schema": "https://design-tokens.org/schema.json",
+            "_meta": {
+                "generator": "dss-figma-sync",
+                "version": "2.0.0",
+                "generated": datetime.now().isoformat()
+            }
+        }
+
+        # Merge tokens (variables take precedence for semantic tokens)
+        all_tokens = {**style_tokens, **variable_tokens}
+
+        # Organize by DSS category
+        categorized = {cat: {} for cat in self.DSS_CATEGORIES}
+
+        for path, token in all_tokens.items():
+            category = path.split(".")[0] if "." in path else "other"
+
+            # Map to DSS category
+            dss_category = self._map_category(category, token.type)
+
+            if dss_category in categorized:
+                # Use rest of path as token name
+                token_name = ".".join(path.split(".")[1:]) if "." in path else path
+                categorized[dss_category][token_name] = token.to_dict()
+
+        # Add to output
+        for category, tokens in categorized.items():
+            if tokens:
+                output[category] = tokens
+
+        return output
+
+    def _map_category(self, figma_category: str, token_type: str) -> str:
+        """Map Figma category to DSS canonical"""
+        category_map = {
+            "color": "color",
+            "colours": "color",
+            "colors": "color",
+            "spacing": "spacing",
+            "space": "spacing",
+            "size": "spacing",
+            "typography": "typography",
+            "text": "typography",
+            "font": "typography",
+            "shadow": "shadow",
+            "elevation": "shadow",
+            "effect": "shadow",
+            "border": "border",
+            "stroke": "border",
+            "radius": "radius",
+            "corner": "radius",
+            "motion": "motion",
+            "animation": "motion",
+            "duration": "motion",
+            "opacity": "opacity",
+        }
+
+        return category_map.get(figma_category.lower(), "color" if token_type == "color" else "spacing")
+
+
+# =============================================================================
+# OUTPUT WRITERS
+# =============================================================================
+
+class OutputWriter:
+    """Writes extraction results to DSS structure"""
+
+    def __init__(self, verbose: bool = False):
+        self.verbose = verbose
+
+    def write_tokens(self, tokens: Dict, output_dir: Path = TOKENS_DIR):
+        """Write W3C tokens to file"""
+        output_dir.mkdir(parents=True, exist_ok=True)
+
+        # Main tokens file
+        tokens_file = output_dir / "figma-tokens.json"
+        with open(tokens_file, "w") as f:
+            json.dump(tokens, f, indent=2)
+        print(f"  [OUT] Tokens: {tokens_file}")
+
+        # Style-dictionary compatible (flat structure)
+        sd_tokens = self._flatten_for_style_dictionary(tokens)
+        sd_file = output_dir / "tokens.json"
+        with open(sd_file, "w") as f:
+            json.dump(sd_tokens, f, indent=2)
+        print(f"  [OUT] Style-dictionary: {sd_file}")
+
+    def write_components(self, components: Dict, output_dir: Path = COMPONENTS_DIR):
+        """Write component registry"""
+        output_dir.mkdir(parents=True, exist_ok=True)
+
+        comp_file = output_dir / "figma-registry.json"
+        with open(comp_file, "w") as f:
+            json.dump(components, f, indent=2)
+        print(f"  [OUT] Components: {comp_file}")
+
+    def write_validation_report(self, report: Dict, output_dir: Path = CACHE_DIR):
+        """Write validation report"""
+        output_dir.mkdir(parents=True, exist_ok=True)
+
+        report_file = output_dir / "figma-lint-report.json"
+        with open(report_file, "w") as f:
+            json.dump(report, f, indent=2)
+        print(f"  [OUT] Validation: {report_file}")
+
+    def _flatten_for_style_dictionary(self, tokens: Dict) -> Dict:
+        """Convert W3C format to style-dictionary format"""
+        result = {}
+
+        for category, cat_tokens in tokens.items():
+            if category.startswith("$") or category.startswith("_"):
+                continue
+
+            result[category] = {}
+            for name, token in cat_tokens.items():
+                if isinstance(token, dict) and "$value" in token:
+                    result[category][name] = {"value": token["$value"]}
+                elif isinstance(token, dict):
+                    result[category][name] = token
+
+        return result
+
+
+# =============================================================================
+# MAIN SYNC ORCHESTRATOR
+# =============================================================================
+
+async def intelligent_sync(file_key: str, token: str, force: bool = False, verbose: bool = False) -> bool:
+    """Main sync orchestration"""
+
+    cache_manager = CacheManager()
+    validator = DesignValidator()
+    writer = OutputWriter(verbose=verbose)
+
+    async with IntelligentFigmaClient(token, verbose=verbose) as client:
+
+        # Step 1: Check cache
+        print("\n[1/5] Checking cache...")
+        try:
+            meta = await client.get_file_meta(file_key)
+            remote_modified = meta.get("lastModified", "")
+            file_name = meta.get("name", "Unknown")
+
+            if not force and not cache_manager.should_sync(file_key, remote_modified):
+                print(f"  [SKIP] File unchanged since last sync")
+                print(f"  Use --force to sync anyway")
+                return True
+
+            print(f"  [OK] File: {file_name}")
+            print(f"  [OK] Modified: {remote_modified}")
+        except Exception as e:
+            print(f"  [ERROR] Failed to check file: {e}")
+            return False
+
+        # Step 2: Fetch data
+        print("\n[2/5] Fetching Figma data...")
+        try:
+            # Parallel fetches
+            file_task = client.get_file(file_key)
+            vars_task = client.get_file_variables(file_key)
+
+            file_data = await file_task
+
+            try:
+                vars_data = await vars_task
+            except Exception as ve:
+                print(f"  [WARN] Variables API unavailable: {ve}")
+                vars_data = {"meta": {"variables": {}, "variableCollections": {}}}
+
+            print(f"  [OK] File fetched")
+            print(f"  [OK] Styles: {len(file_data.get('styles', {}))}")
+            print(f"  [OK] Components: {len(file_data.get('components', {}))}")
+            print(f"  [OK] Variables: {len(vars_data.get('meta', {}).get('variables', {}))}")
+        except Exception as e:
+            print(f"  [ERROR] Failed to fetch: {e}")
+            return False
+
+        # Step 3: Extract tokens
+        print("\n[3/5] Extracting tokens...")
+
+        var_extractor = VariableExtractor(verbose=verbose)
+        style_extractor = StyleExtractor(verbose=verbose)
+        comp_extractor = ComponentExtractor(validator, verbose=verbose)
+
+        variable_tokens = var_extractor.extract(vars_data)
+        style_tokens = style_extractor.extract(file_data)
+        components = comp_extractor.extract(file_data)
+
+        print(f"  [OK] Variable tokens: {len(variable_tokens)}")
+        print(f"  [OK] Style tokens: {len(style_tokens)}")
+        print(f"  [OK] Components: {components['component_count']}")
+
+        # Step 4: Translate to DSS format
+        print("\n[4/5] Translating to DSS format...")
+
+        translator = FigmaToDSSTranslator(verbose=verbose)
+        w3c_tokens = translator.translate(variable_tokens, style_tokens)
+
+        token_count = sum(
+            len(v) for k, v in w3c_tokens.items()
+            if not k.startswith("$") and not k.startswith("_")
+        )
+        print(f"  [OK] W3C tokens: {token_count}")
+
+        # Step 5: Validate and write
+        print("\n[5/5] Writing output...")
+
+        validation_report = validator.get_report()
+
+        writer.write_tokens(w3c_tokens)
+        writer.write_components(components)
+        writer.write_validation_report(validation_report)
+
+        # Update cache manifest
+        manifest = SyncManifest(
+            file_key=file_key,
+            last_modified=remote_modified,
+            synced_at=datetime.now().isoformat(),
+            extracted_tokens=token_count,
+            extracted_components=components["component_count"],
+            validation_issues=validation_report["total_issues"]
+        )
+        cache_manager.save_manifest(manifest)
+
+        # Summary
+        print("\n" + "=" * 60)
+        print("SYNC COMPLETE")
+        print("=" * 60)
+        print(f"  File:       {file_name}")
+        print(f"  Tokens:     {token_count}")
+        print(f"  Components: {components['component_count']}")
+        print(f"  Issues:     {validation_report['errors']} errors, {validation_report['warnings']} warnings")
+
+        if validation_report["errors"] > 0:
+            print("\n  [WARN] Design validation errors found!")
+            print("  Check: .dss/cache/figma-lint-report.json")
+
+        return True
+
+
+# =============================================================================
+# CLI
+# =============================================================================
+
+def load_config():
+    """Load Figma config"""
+    config_path = DSS_ROOT / ".dss/config/figma.json"
+    if config_path.exists():
+        with open(config_path) as f:
+            return json.load(f)
+    return {}
+
+
+def main():
+    import argparse
+
+    parser = argparse.ArgumentParser(description="DSS Intelligent Figma Sync")
+    parser.add_argument("--file-key", help="Figma file key")
+    parser.add_argument("--force", action="store_true", help="Force sync even if cached")
+    parser.add_argument("--verbose", "-v", action="store_true", help="Verbose output")
+    args = parser.parse_args()
+
+    # Get file key
+    file_key = args.file_key
+    if not file_key:
+        config = load_config()
+        uikit = config.get("uikit_reference", {})
+        file_key = uikit.get("file_key")
+
+    if not file_key:
+        print("[ERROR] No Figma file key provided")
+        print("  Usage: python3 scripts/figma-sync.py --file-key KEY")
+        print("  Or add to .dss/config/figma.json")
+        sys.exit(1)
+
+    # Get token
+    token = os.environ.get("FIGMA_TOKEN")
+    if not token:
+        config = load_config()
+        token = config.get("token")
+
+    if not token:
+        print("[ERROR] No Figma token found")
+        print("  Set FIGMA_TOKEN env var or add to .dss/config/figma.json")
+        sys.exit(1)
+
+    print("╔══════════════════════════════════════════════════════════════╗")
+    print("║            DSS INTELLIGENT FIGMA SYNC v2.0                   ║")
+    print("╚══════════════════════════════════════════════════════════════╝")
+    print(f"  File:  {file_key}")
+    print(f"  Token: {token[:10]}...")
+    print(f"  Force: {args.force}")
+
+    # Run sync
+    success = asyncio.run(intelligent_sync(
+        file_key=file_key,
+        token=token,
+        force=args.force,
+        verbose=args.verbose
+    ))
+
+    if success:
+        print("\n[OK] Sync successful!")
+        print("  Next: Run scripts/generate-storybook.py")
+        sys.exit(0)
+    else:
+        print("\n[ERROR] Sync failed")
+        sys.exit(1)
+
+
+if __name__ == "__main__":
+    main()
diff --git a/scripts/generate-storybook.py b/scripts/generate-storybook.py
new file mode 100755
index 0000000..6bc872a
--- /dev/null
+++ b/scripts/generate-storybook.py
@@ -0,0 +1,905 @@
+#!/usr/bin/env python3
+"""
+DSS Storybook Generator
+Generates Storybook stories from DSS tokens and component registry.
+
+Hierarchy:
+  1. Primitives (Foundation) - colors, spacing, typography, radius, shadows
+  2. Semantic Tokens (Design Tokens) - from skin
+  3. Components - from shadcn registry
+
+Usage: python3 scripts/generate-storybook.py [--output PATH] [--skin SKIN]
+
+Default output: admin-ui/src/stories/
+"""
+
+import sys
+import os
+import json
+import argparse
+from pathlib import Path
+from datetime import datetime
+from typing import Dict, Any, List
+
+DSS_ROOT = Path(__file__).parent.parent
+DSS_DATA = DSS_ROOT / ".dss"
+
+
+def load_json(path: Path) -> dict:
+    """Load JSON file, return empty dict if not found"""
+    if not path.exists():
+        return {}
+    with open(path) as f:
+        return json.load(f)
+
+
+def ensure_dir(path: Path):
+    """Ensure directory exists"""
+    path.mkdir(parents=True, exist_ok=True)
+
+
+def generate_color_primitives_story(primitives: dict, output_dir: Path):
+    """Generate story for color primitives (full Tailwind palette)"""
+    colors = primitives.get("color", {})
+    if not colors:
+        return
+
+    # Build organized sections
+    base_section = ""
+    neutral_section = ""
+    semantic_section = ""
+
+    # Base colors
+    base = colors.get("base", {})
+    base_swatches = []
+    for name, data in base.items():
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            border = "border: 1px solid #e5e7eb;" if data["value"] in ["#ffffff", "transparent"] else ""
+            base_swatches.append(f'''
+        <div class="color-swatch">
+          <div class="swatch" style="background: {data['value']}; {border}"></div>
+          <div class="label">{name}</div>
+          <div class="value">{data['value']}</div>
+        </div>''')
+    if base_swatches:
+        base_section = f'''
+      <div class="color-section">
+        <h2>Base</h2>
+        <div class="swatch-row">{''.join(base_swatches)}</div>
+      </div>'''
+
+    # Neutral scales
+    neutrals = colors.get("neutral", {})
+    neutral_palettes = []
+    for scale_name, scale in neutrals.items():
+        if scale_name.startswith("_"):
+            continue
+        if isinstance(scale, dict):
+            shades = []
+            for shade, data in sorted(scale.items(), key=lambda x: int(x[0]) if x[0].isdigit() else 0):
+                if isinstance(data, dict) and "value" in data:
+                    text_color = "#000" if int(shade) < 500 else "#fff"
+                    shades.append(f'''
+          <div class="shade" style="background: {data['value']}; color: {text_color};">
+            <span>{shade}</span>
+          </div>''')
+            if shades:
+                neutral_palettes.append(f'''
+        <div class="color-palette">
+          <h3>{scale_name}</h3>
+          <div class="shades">{''.join(shades)}</div>
+        </div>''')
+    if neutral_palettes:
+        neutral_section = f'''
+      <div class="color-section">
+        <h2>Neutral Scales</h2>
+        <div class="palette-grid">{''.join(neutral_palettes)}</div>
+      </div>'''
+
+    # Semantic scales
+    semantics = colors.get("semantic", {})
+    semantic_palettes = []
+    for scale_name, scale in semantics.items():
+        if scale_name.startswith("_"):
+            continue
+        if isinstance(scale, dict):
+            shades = []
+            for shade, data in sorted(scale.items(), key=lambda x: int(x[0]) if x[0].isdigit() else 0):
+                if isinstance(data, dict) and "value" in data:
+                    text_color = "#000" if int(shade) < 500 else "#fff"
+                    shades.append(f'''
+          <div class="shade" style="background: {data['value']}; color: {text_color};">
+            <span>{shade}</span>
+          </div>''')
+            if shades:
+                semantic_palettes.append(f'''
+        <div class="color-palette">
+          <h3>{scale_name}</h3>
+          <div class="shades">{''.join(shades)}</div>
+        </div>''')
+    if semantic_palettes:
+        semantic_section = f'''
+      <div class="color-section">
+        <h2>Semantic Scales</h2>
+        <div class="palette-grid">{''.join(semantic_palettes)}</div>
+      </div>'''
+
+    story = f'''/**
+ * Color Primitives - Foundation
+ * Full Tailwind color palette organized by category
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Foundation/Colors/Primitives',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'Core color primitives from Tailwind palette. Organized into Base, Neutral, and Semantic scales.'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .color-container {{ font-family: system-ui, sans-serif; }}
+  .color-section {{ margin-bottom: 3rem; }}
+  .color-section h2 {{ font-size: 1.25rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; margin-bottom: 1rem; }}
+  .swatch-row {{ display: flex; flex-wrap: wrap; gap: 1rem; }}
+  .color-swatch {{ text-align: center; }}
+  .swatch {{ width: 80px; height: 80px; border-radius: 8px; margin-bottom: 0.5rem; }}
+  .label {{ font-weight: 500; font-size: 0.875rem; }}
+  .value {{ font-family: monospace; font-size: 0.75rem; color: #6b7280; }}
+  .palette-grid {{ display: flex; flex-wrap: wrap; gap: 2rem; }}
+  .color-palette {{ min-width: 140px; }}
+  .color-palette h3 {{ margin: 0 0 0.5rem; text-transform: capitalize; font-size: 0.875rem; font-weight: 600; }}
+  .shades {{ display: flex; flex-direction: column; border-radius: 8px; overflow: hidden; }}
+  .shade {{ padding: 0.5rem 0.75rem; font-family: monospace; font-size: 0.65rem; }}
+`;
+
+export const AllColors = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="color-container">
+      {base_section}
+      {neutral_section}
+      {semantic_section}
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "ColorPrimitives.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] ColorPrimitives.stories.js")
+
+
+def generate_spacing_story(primitives: dict, output_dir: Path):
+    """Generate story for spacing primitives"""
+    spacing = primitives.get("spacing", {})
+    if not spacing:
+        return
+
+    items = []
+    for name, data in sorted(spacing.items(), key=lambda x: float(x[0]) if x[0].replace('.', '').isdigit() else -1):
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            comment = data.get("_comment", "")
+            items.append(f'''
+      <div class="spacing-item">
+        <div class="bar" style="width: {data['value']};"></div>
+        <div class="info">
+          <span class="name">{name}</span>
+          <span class="value">{data['value']}</span>
+          <span class="comment">{comment}</span>
+        </div>
+      </div>''')
+
+    story = f'''/**
+ * Spacing Primitives - Foundation
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Foundation/Spacing',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'Spacing scale based on 4px grid. Use for margins, padding, and gaps.'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .spacing-grid {{ display: flex; flex-direction: column; gap: 0.25rem; max-width: 600px; }}
+  .spacing-item {{ display: flex; align-items: center; gap: 1rem; }}
+  .bar {{ height: 20px; background: var(--color-primary, #18181b); border-radius: 2px; min-width: 2px; }}
+  .info {{ display: flex; gap: 1rem; font-family: monospace; font-size: 0.75rem; }}
+  .name {{ font-weight: 600; min-width: 32px; }}
+  .value {{ color: #6b7280; min-width: 80px; }}
+  .comment {{ color: #9ca3af; font-size: 0.65rem; }}
+`;
+
+export const SpacingScale = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="spacing-grid">
+      {''.join(items)}
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "Spacing.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] Spacing.stories.js")
+
+
+def generate_typography_story(primitives: dict, resolved: dict, output_dir: Path):
+    """Generate story for typography tokens"""
+    font = primitives.get("font", {})
+    typography = resolved.get("typography", {})
+
+    # Font families
+    families = font.get("family", {})
+    family_samples = []
+    for name, data in families.items():
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            family_samples.append(f'''
+      <div class="font-sample">
+        <div class="sample-text" style="font-family: {data['value']};">
+          The quick brown fox jumps over the lazy dog
+        </div>
+        <div class="meta">
+          <span class="name">{name}</span>
+          <span class="value">{data['value'][:40]}...</span>
+        </div>
+      </div>''')
+
+    # Font sizes
+    sizes = font.get("size", {})
+    size_samples = []
+    for name, data in sorted(sizes.items(), key=lambda x: float(x[0].replace('xl', '').replace('x', '')) if x[0].replace('xl', '').replace('x', '').replace('.', '').isdigit() else 0):
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            size_samples.append(f'''
+      <div class="size-sample">
+        <span class="text" style="font-size: {data['value']};">Aa</span>
+        <span class="name">{name}</span>
+        <span class="value">{data['value']}</span>
+      </div>''')
+
+    # Font weights
+    weights = font.get("weight", {})
+    weight_samples = []
+    for name, data in weights.items():
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            weight_samples.append(f'''
+      <div class="weight-sample">
+        <span class="text" style="font-weight: {data['value']};">Aa</span>
+        <span class="name">{name}</span>
+        <span class="value">{data['value']}</span>
+      </div>''')
+
+    # Typography styles from resolved tokens
+    style_samples = []
+    for name, props in typography.items():
+        if isinstance(props, dict):
+            font_family = props.get("font-family", {}).get("value", "Inter")
+            font_size = props.get("font-size", {}).get("value", "16px")
+            font_weight = props.get("font-weight", {}).get("value", 400)
+            line_height = props.get("line-height", {}).get("value", "1.5")
+
+            style_samples.append(f'''
+      <div class="style-sample">
+        <div class="text" style="font-family: {font_family}; font-size: {font_size}; font-weight: {font_weight}; line-height: {line_height};">
+          The quick brown fox
+        </div>
+        <div class="meta">
+          <span class="name">{name}</span>
+          <span class="props">{font_size} / {font_weight}</span>
+        </div>
+      </div>''')
+
+    story = f'''/**
+ * Typography - Foundation
+ * Font families, sizes, weights, and composed styles
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Foundation/Typography',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'Typography primitives and composed text styles.'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .typo-container {{ font-family: system-ui, sans-serif; }}
+  .section {{ margin-bottom: 3rem; }}
+  .section h2 {{ font-size: 1.25rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; margin-bottom: 1rem; }}
+  .font-sample {{ margin-bottom: 1.5rem; }}
+  .sample-text {{ font-size: 1.5rem; margin-bottom: 0.25rem; }}
+  .meta {{ font-size: 0.75rem; font-family: monospace; }}
+  .meta .name {{ font-weight: 600; margin-right: 1rem; }}
+  .meta .value {{ color: #6b7280; }}
+  .size-grid, .weight-grid {{ display: flex; flex-wrap: wrap; gap: 1.5rem; }}
+  .size-sample, .weight-sample {{ text-align: center; min-width: 60px; }}
+  .size-sample .text {{ display: block; margin-bottom: 0.25rem; }}
+  .weight-sample .text {{ display: block; margin-bottom: 0.25rem; font-size: 1.5rem; }}
+  .name {{ font-size: 0.75rem; font-weight: 500; display: block; }}
+  .value {{ font-size: 0.65rem; color: #6b7280; font-family: monospace; }}
+  .props {{ color: #6b7280; font-family: monospace; }}
+  .style-sample {{ margin-bottom: 1rem; border-bottom: 1px solid #f3f4f6; padding-bottom: 1rem; }}
+  .style-sample .text {{ margin-bottom: 0.25rem; color: var(--color-foreground, #18181b); }}
+`;
+
+export const FontFamilies = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Font Families</h2>
+        {''.join(family_samples)}
+      </div>
+    </div>
+  `
+}};
+
+export const FontSizes = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Font Sizes</h2>
+        <div class="size-grid">{''.join(size_samples)}</div>
+      </div>
+    </div>
+  `
+}};
+
+export const FontWeights = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Font Weights</h2>
+        <div class="weight-grid">{''.join(weight_samples)}</div>
+      </div>
+    </div>
+  `
+}};
+
+export const TextStyles = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="typo-container">
+      <div class="section">
+        <h2>Composed Text Styles</h2>
+        {''.join(style_samples)}
+      </div>
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "Typography.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] Typography.stories.js")
+
+
+def generate_shadows_story(primitives: dict, resolved: dict, output_dir: Path):
+    """Generate story for shadow tokens"""
+    shadows = primitives.get("shadow", {})
+    effects = resolved.get("effect", {})
+
+    # Combine both sources
+    all_shadows = {}
+    for name, data in shadows.items():
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            all_shadows[name] = data["value"]
+
+    for name, data in effects.items():
+        if isinstance(data, dict) and "value" in data and "shadow" in name:
+            all_shadows[name] = data["value"]
+
+    items = []
+    for name, value in all_shadows.items():
+        items.append(f'''
+      <div class="shadow-card">
+        <div class="box" style="box-shadow: {value};"></div>
+        <div class="name">{name}</div>
+        <div class="value">{value[:50]}{"..." if len(value) > 50 else ""}</div>
+      </div>''')
+
+    story = f'''/**
+ * Shadows - Foundation
+ * Box shadow scale
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Foundation/Effects/Shadows',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'Box shadow tokens for elevation and depth.'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .shadows-grid {{ display: flex; flex-wrap: wrap; gap: 2rem; padding: 2rem; background: #f9fafb; }}
+  .shadow-card {{ text-align: center; }}
+  .box {{ width: 120px; height: 80px; background: white; border-radius: 8px; margin-bottom: 0.5rem; }}
+  .name {{ font-size: 0.75rem; font-weight: 500; }}
+  .value {{ font-size: 0.6rem; color: #6b7280; font-family: monospace; max-width: 120px; word-wrap: break-word; }}
+`;
+
+export const AllShadows = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="shadows-grid">
+      {''.join(items)}
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "Shadows.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] Shadows.stories.js")
+
+
+def generate_radius_story(primitives: dict, output_dir: Path):
+    """Generate story for border radius tokens"""
+    radius = primitives.get("radius", {})
+    if not radius:
+        return
+
+    items = []
+    for name, data in radius.items():
+        if name.startswith("_"):
+            continue
+        if isinstance(data, dict) and "value" in data:
+            comment = data.get("_comment", "")
+            items.append(f'''
+      <div class="radius-item">
+        <div class="box" style="border-radius: {data['value']};"></div>
+        <div class="name">{name}</div>
+        <div class="value">{data['value']}</div>
+        <div class="comment">{comment}</div>
+      </div>''')
+
+    story = f'''/**
+ * Border Radius - Foundation
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Foundation/Radius',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'Border radius scale for consistent rounded corners.'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .radius-grid {{ display: flex; flex-wrap: wrap; gap: 2rem; }}
+  .radius-item {{ text-align: center; }}
+  .box {{ width: 80px; height: 80px; background: var(--color-primary, #18181b); margin-bottom: 0.5rem; }}
+  .name {{ font-weight: 500; font-size: 0.875rem; }}
+  .value {{ font-family: monospace; font-size: 0.75rem; color: #6b7280; }}
+  .comment {{ font-size: 0.65rem; color: #9ca3af; }}
+`;
+
+export const RadiusScale = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="radius-grid">
+      {''.join(items)}
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "Radius.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] Radius.stories.js")
+
+
+def generate_semantic_colors_story(resolved: dict, output_dir: Path):
+    """Generate story for semantic color tokens"""
+    colors = resolved.get("color", {})
+    if not colors:
+        return
+
+    # Group by semantic category
+    groups = {
+        "Surface": [],
+        "Primary": [],
+        "Secondary": [],
+        "Accent": [],
+        "Muted": [],
+        "Destructive": [],
+        "Other": []
+    }
+
+    for name, data in colors.items():
+        if isinstance(data, dict) and "value" in data:
+            value = data["value"]
+            comment = data.get("comment", "")
+            card = f'''
+        <div class="token-card">
+          <div class="swatch" style="background: {value};"></div>
+          <div class="name">{name}</div>
+          <div class="value">{value}</div>
+          <div class="comment">{comment}</div>
+        </div>'''
+
+            if any(x in name for x in ["background", "foreground", "card", "popover"]):
+                groups["Surface"].append(card)
+            elif "primary" in name:
+                groups["Primary"].append(card)
+            elif "secondary" in name:
+                groups["Secondary"].append(card)
+            elif "accent" in name:
+                groups["Accent"].append(card)
+            elif "muted" in name:
+                groups["Muted"].append(card)
+            elif "destructive" in name:
+                groups["Destructive"].append(card)
+            else:
+                groups["Other"].append(card)
+
+    sections = []
+    for group_name, cards in groups.items():
+        if cards:
+            sections.append(f'''
+      <div class="token-group">
+        <h3>{group_name}</h3>
+        <div class="token-row">{''.join(cards)}</div>
+      </div>''')
+
+    story = f'''/**
+ * Semantic Colors - Design Tokens
+ * Resolved color tokens for light theme
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Tokens/Semantic Colors',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'Semantic color tokens mapped from primitives. Use these in components via CSS variables.'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .semantic-colors {{ display: flex; flex-direction: column; gap: 2rem; }}
+  .token-group h3 {{ margin: 0 0 1rem; font-size: 1rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; }}
+  .token-row {{ display: flex; flex-wrap: wrap; gap: 1rem; }}
+  .token-card {{ text-align: center; }}
+  .swatch {{ width: 80px; height: 60px; border-radius: 8px; border: 1px solid #e5e7eb; margin-bottom: 0.5rem; }}
+  .name {{ font-size: 0.75rem; font-weight: 500; }}
+  .value {{ font-family: monospace; font-size: 0.65rem; color: #6b7280; }}
+  .comment {{ font-size: 0.6rem; color: #9ca3af; max-width: 80px; }}
+`;
+
+export const LightTheme = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="semantic-colors">
+      {''.join(sections)}
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "SemanticColors.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] SemanticColors.stories.js")
+
+
+def generate_component_stories(registry: dict, output_dir: Path):
+    """Generate stories for shadcn components from registry"""
+    components = registry.get("components", {})
+    categories = registry.get("categories", {})
+
+    if not components:
+        print("  [SKIP] No components in registry")
+        return
+
+    # Generate a story file per category
+    for cat_id, cat_data in categories.items():
+        cat_name = cat_data.get("name", cat_id.title())
+        cat_desc = cat_data.get("description", "")
+        cat_components = cat_data.get("components", [])
+
+        component_cards = []
+        for comp_id in cat_components:
+            comp = components.get(comp_id, {})
+            if not comp:
+                continue
+
+            name = comp.get("name", comp_id)
+            desc = comp.get("description", "")
+            variants = comp.get("variants", {})
+            radix = comp.get("radixPrimitive", "")
+            deps = comp.get("dependencies", [])
+
+            variant_badges = ""
+            if variants:
+                for var_name, var_values in variants.items():
+                    badges = " ".join([f'<span class="badge">{v}</span>' for v in var_values[:4]])
+                    variant_badges += f'<div class="variant-row"><span class="var-name">{var_name}:</span> {badges}</div>'
+
+            radix_badge = f'<span class="radix-badge">{radix}</span>' if radix else ""
+            deps_text = ", ".join(deps[:3]) if deps else ""
+
+            component_cards.append(f'''
+        <div class="component-card">
+          <div class="card-header">
+            <h3>{name}</h3>
+            {radix_badge}
+          </div>
+          <p class="description">{desc}</p>
+          <div class="variants">{variant_badges}</div>
+          {f'<div class="deps">deps: {deps_text}</div>' if deps_text else ''}
+        </div>''')
+
+        story = f'''/**
+ * {cat_name}
+ * {cat_desc}
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Components/{cat_name}',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: '{cat_desc}'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .component-grid {{ display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }}
+  .component-card {{
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 1rem;
+    background: white;
+  }}
+  .card-header {{
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    margin-bottom: 0.5rem;
+  }}
+  .card-header h3 {{ margin: 0; font-size: 1rem; }}
+  .radix-badge {{
+    font-size: 0.6rem;
+    background: #dbeafe;
+    color: #1d4ed8;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    font-family: monospace;
+  }}
+  .description {{ font-size: 0.8rem; color: #6b7280; margin: 0 0 0.75rem; }}
+  .variants {{ margin-bottom: 0.5rem; }}
+  .variant-row {{ font-size: 0.7rem; margin-bottom: 0.25rem; }}
+  .var-name {{ font-weight: 500; margin-right: 0.25rem; }}
+  .badge {{
+    display: inline-block;
+    background: #f3f4f6;
+    padding: 0.125rem 0.375rem;
+    border-radius: 4px;
+    margin-right: 0.25rem;
+    font-family: monospace;
+    font-size: 0.65rem;
+  }}
+  .deps {{ font-size: 0.65rem; color: #9ca3af; font-family: monospace; }}
+`;
+
+export const Overview = {{
+  name: 'Component Catalog',
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="component-grid">
+      {''.join(component_cards)}
+    </div>
+  `
+}};
+'''
+
+        # Create safe filename
+        filename = f"Components{cat_name.replace(' ', '')}.stories.js"
+        with open(output_dir / filename, "w") as f:
+            f.write(story)
+        print(f"  [OK] {filename} ({len(cat_components)} components)")
+
+
+def generate_overview_story(output_dir: Path):
+    """Generate overview/introduction story"""
+    story = f'''/**
+ * Design System Overview
+ * @generated {datetime.now().isoformat()}
+ */
+export default {{
+  title: 'Overview',
+  tags: ['autodocs'],
+  parameters: {{
+    docs: {{
+      description: {{
+        component: 'DSS Design System - Token documentation and component library'
+      }}
+    }}
+  }}
+}};
+
+const styles = `
+  .overview {{ max-width: 800px; font-family: system-ui, sans-serif; }}
+  .overview h1 {{ font-size: 2rem; margin-bottom: 0.5rem; }}
+  .overview .subtitle {{ color: #6b7280; margin-bottom: 2rem; }}
+  .overview h2 {{ font-size: 1.25rem; margin-top: 2rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; }}
+  .overview ul {{ padding-left: 1.5rem; }}
+  .overview li {{ margin: 0.5rem 0; }}
+  .overview code {{ background: #f3f4f6; padding: 0.125rem 0.375rem; border-radius: 4px; font-size: 0.875rem; }}
+  .layer {{ display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem; background: #f9fafb; border-radius: 8px; margin: 0.5rem 0; }}
+  .layer-num {{ width: 24px; height: 24px; background: #18181b; color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 600; }}
+  .stats {{ display: flex; gap: 1rem; margin: 1rem 0; }}
+  .stat {{ background: #f9fafb; padding: 1rem; border-radius: 8px; text-align: center; }}
+  .stat-value {{ font-size: 2rem; font-weight: 700; color: #18181b; }}
+  .stat-label {{ font-size: 0.75rem; color: #6b7280; }}
+`;
+
+export const Introduction = {{
+  render: () => `
+    <style>${{styles}}</style>
+    <div class="overview">
+      <h1>DSS Design System</h1>
+      <p class="subtitle">Token-driven design system with 3-layer architecture</p>
+
+      <div class="stats">
+        <div class="stat">
+          <div class="stat-value">22</div>
+          <div class="stat-label">Color Scales</div>
+        </div>
+        <div class="stat">
+          <div class="stat-value">59</div>
+          <div class="stat-label">Components</div>
+        </div>
+        <div class="stat">
+          <div class="stat-value">6</div>
+          <div class="stat-label">Categories</div>
+        </div>
+      </div>
+
+      <h2>Architecture</h2>
+      <div class="layer">
+        <span class="layer-num">1</span>
+        <strong>Core Primitives</strong> - Raw Tailwind values (colors, spacing, fonts)
+      </div>
+      <div class="layer">
+        <span class="layer-num">2</span>
+        <strong>Skin</strong> - Semantic mapping (primary, secondary, etc.)
+      </div>
+      <div class="layer">
+        <span class="layer-num">3</span>
+        <strong>Theme</strong> - Brand overrides
+      </div>
+
+      <h2>Navigation</h2>
+      <ul>
+        <li><strong>Foundation</strong> - Core primitives (colors, spacing, typography, radius, shadows)</li>
+        <li><strong>Tokens</strong> - Semantic design tokens from skin</li>
+        <li><strong>Components</strong> - 59 shadcn/ui components organized by category</li>
+      </ul>
+
+      <h2>Component Categories</h2>
+      <ul>
+        <li><strong>Form</strong> - Button, Input, Select, Checkbox, etc.</li>
+        <li><strong>Data Display</strong> - Table, Badge, Avatar, Chart, etc.</li>
+        <li><strong>Feedback</strong> - Alert, Toast, Progress, Spinner, etc.</li>
+        <li><strong>Navigation</strong> - Tabs, Breadcrumb, Sidebar, etc.</li>
+        <li><strong>Overlay</strong> - Dialog, Sheet, Dropdown, Tooltip, etc.</li>
+        <li><strong>Layout</strong> - Card, Separator, Scroll Area, etc.</li>
+      </ul>
+
+      <h2>Usage</h2>
+      <p>Import tokens CSS in your project:</p>
+      <pre><code>import '.dss/data/_system/themes/tokens.css';</code></pre>
+      <p>Use CSS variables in your styles:</p>
+      <pre><code>color: var(--color-primary);
+background: var(--color-background);</code></pre>
+    </div>
+  `
+}};
+'''
+
+    with open(output_dir / "Overview.stories.js", "w") as f:
+        f.write(story)
+    print(f"  [OK] Overview.stories.js")
+
+
+def main():
+    parser = argparse.ArgumentParser(description="Generate Storybook stories from DSS tokens")
+    parser.add_argument("--output", default="admin-ui/src/stories",
+                        help="Output directory for stories")
+    parser.add_argument("--skin", default="shadcn", help="Skin to use")
+    args = parser.parse_args()
+
+    print("=" * 60)
+    print("DSS STORYBOOK GENERATOR")
+    print("=" * 60)
+    print("")
+
+    # Determine output directory
+    output_dir = Path(args.output)
+    if not output_dir.is_absolute():
+        output_dir = DSS_ROOT / output_dir
+
+    ensure_dir(output_dir)
+    print(f"[INFO] Output: {output_dir}")
+
+    # Load token sources
+    primitives = load_json(DSS_DATA / "core" / "primitives.json")
+    skin = load_json(DSS_DATA / "skins" / args.skin / "tokens.json")
+    resolved = load_json(DSS_DATA / "data" / "_system" / "tokens" / "tokens.json")
+    registry = load_json(DSS_DATA / "components" / "shadcn-registry.json")
+
+    print(f"[INFO] Core primitives: {len(primitives)} categories")
+    print(f"[INFO] Skin: {args.skin}")
+    print(f"[INFO] Resolved tokens: {sum(len(v) if isinstance(v, dict) else 0 for v in resolved.values())} tokens")
+    print(f"[INFO] Component registry: {len(registry.get('components', {}))} components")
+    print("")
+
+    print("[STEP] Generating Foundation stories...")
+    generate_overview_story(output_dir)
+    generate_color_primitives_story(primitives, output_dir)
+    generate_spacing_story(primitives, output_dir)
+    generate_typography_story(primitives, resolved, output_dir)
+    generate_radius_story(primitives, output_dir)
+    generate_shadows_story(primitives, resolved, output_dir)
+
+    print("")
+    print("[STEP] Generating Token stories...")
+    generate_semantic_colors_story(resolved, output_dir)
+
+    print("")
+    print("[STEP] Generating Component stories...")
+    generate_component_stories(registry, output_dir)
+
+    print("")
+    story_count = len(list(output_dir.glob("*.stories.js")))
+    print(f"[OK] Generated {story_count} story files")
+    print(f"[OK] Run: cd admin-ui && npm run storybook")
+
+
+if __name__ == "__main__":
+    main()
diff --git a/scripts/regenerate-core-hashes.sh b/scripts/regenerate-core-hashes.sh
new file mode 100755
index 0000000..35530d3
--- /dev/null
+++ b/scripts/regenerate-core-hashes.sh
@@ -0,0 +1,44 @@
+#!/bin/bash
+# Regenerate DSS Core Structure Hashes
+# Called after successful Figma sync to update hash manifest
+#
+# Usage: scripts/regenerate-core-hashes.sh
+# This script should ONLY be called by the Figma sync pipeline
+
+set -e
+
+HASH_FILE=".dss/core-hashes.sha256"
+
+echo "Regenerating DSS core hashes..."
+
+{
+  echo "# DSS Core Structure Hashes"
+  echo "# Generated: $(date -Iseconds)"
+  echo "# Source: Figma sync pipeline"
+  echo "# DO NOT EDIT MANUALLY"
+  echo ""
+  echo "# Format: SHA256  filepath"
+
+  # Hash schema files
+  for f in .dss/schema/*.json; do
+    [ -f "$f" ] && sha256sum "$f"
+  done
+
+  # Hash skin files
+  for f in dss-claude-plugin/core/skins/*.json; do
+    [ -f "$f" ] && sha256sum "$f"
+  done
+
+  # Hash core tokens
+  [ -f "dss/core_tokens/tokens.json" ] && sha256sum "dss/core_tokens/tokens.json"
+
+  # Hash _system output if exists
+  if [ -d ".dss/data/_system" ]; then
+    find .dss/data/_system -type f -name "*.json" -o -name "*.css" -o -name "*.scss" 2>/dev/null | while read f; do
+      sha256sum "$f"
+    done
+  fi
+} > "$HASH_FILE"
+
+echo "Hash manifest updated: $HASH_FILE"
+echo "Files hashed: $(grep -c "^[a-f0-9]" "$HASH_FILE")"
diff --git a/scripts/resolve-tokens.py b/scripts/resolve-tokens.py
new file mode 100755
index 0000000..ddfe57f
--- /dev/null
+++ b/scripts/resolve-tokens.py
@@ -0,0 +1,272 @@
+#!/usr/bin/env python3
+"""
+DSS Token Resolver - 3-Layer Cascade
+Merges tokens from Core → Skin → Theme into a single style-dictionary input.
+
+Usage: python3 scripts/resolve-tokens.py [--skin SKIN] [--theme THEME] [--output PATH]
+
+Default: --skin shadcn --theme default --output .dss/data/_system/tokens/tokens.json
+"""
+
+import sys
+import os
+import json
+import re
+import argparse
+from pathlib import Path
+from datetime import datetime
+from typing import Dict, Any
+
+DSS_ROOT = Path(__file__).parent.parent
+DSS_DATA = DSS_ROOT / ".dss"
+
+# Primitive path aliases - map shorthand refs to full primitive paths
+# The translation dictionary maps: {color.white} → color.base.white
+PRIMITIVE_ALIASES = {
+    # Base colors
+    "color.white": "color.base.white",
+    "color.black": "color.base.black",
+    "color.transparent": "color.base.transparent",
+}
+
+# Generate aliases for neutral color scales (zinc, slate, gray, etc.)
+NEUTRAL_SCALES = ["slate", "gray", "zinc", "neutral", "stone"]
+SEMANTIC_SCALES = ["red", "orange", "amber", "yellow", "lime", "green", "emerald",
+                   "teal", "cyan", "sky", "blue", "indigo", "violet", "purple",
+                   "fuchsia", "pink", "rose"]
+SCALE_VALUES = ["50", "100", "200", "300", "400", "500", "600", "700", "800", "900", "950"]
+
+for scale in NEUTRAL_SCALES:
+    for val in SCALE_VALUES:
+        # color.zinc.50 → color.neutral.zinc.50
+        PRIMITIVE_ALIASES[f"color.{scale}.{val}"] = f"color.neutral.{scale}.{val}"
+
+for scale in SEMANTIC_SCALES:
+    for val in SCALE_VALUES:
+        # color.red.500 → color.semantic.red.500
+        PRIMITIVE_ALIASES[f"color.{scale}.{val}"] = f"color.semantic.{scale}.{val}"
+
+
+def load_json(path: Path) -> dict:
+    """Load JSON file, return empty dict if not found"""
+    if not path.exists():
+        return {}
+    with open(path) as f:
+        return json.load(f)
+
+
+def deep_merge(base: dict, override: dict) -> dict:
+    """Deep merge override into base, returning new dict"""
+    result = base.copy()
+    for key, value in override.items():
+        if key.startswith("_"):
+            continue  # Skip metadata keys
+        if key in result and isinstance(result[key], dict) and isinstance(value, dict):
+            result[key] = deep_merge(result[key], value)
+        else:
+            result[key] = value
+    return result
+
+
+def resolve_references(tokens: dict, primitives: dict) -> dict:
+    """
+    Resolve token references like {color.zinc.500} using primitives.
+    Uses translation dictionary (PRIMITIVE_ALIASES) to map shorthand paths.
+    Works recursively through the token structure.
+    """
+    ref_pattern = re.compile(r'\{([^}]+)\}')
+    unresolved = []
+
+    def get_nested(obj: dict, path: str) -> Any:
+        """Get nested value from dict using dot notation"""
+        parts = path.split(".")
+        current = obj
+        for part in parts:
+            if isinstance(current, dict) and part in current:
+                current = current[part]
+            else:
+                return None
+        # If we found a token object with 'value', return the value
+        if isinstance(current, dict) and "value" in current:
+            return current["value"]
+        return current
+
+    def resolve_value(value: Any) -> Any:
+        """Resolve references in a value"""
+        if not isinstance(value, str):
+            return value
+
+        def replacer(match):
+            ref_path = match.group(1)
+
+            # First: try direct lookup in primitives
+            resolved = get_nested(primitives, ref_path)
+            if resolved is not None:
+                return str(resolved)
+
+            # Second: try using translation dictionary (alias mapping)
+            aliased_path = PRIMITIVE_ALIASES.get(ref_path)
+            if aliased_path:
+                resolved = get_nested(primitives, aliased_path)
+                if resolved is not None:
+                    return str(resolved)
+
+            # Third: try in tokens themselves (for self-references)
+            resolved = get_nested(tokens, ref_path)
+            if resolved is not None:
+                return str(resolved)
+
+            # Track unresolved for debugging
+            if ref_path not in unresolved:
+                unresolved.append(ref_path)
+
+            # Return original if not found
+            return match.group(0)
+
+        return ref_pattern.sub(replacer, value)
+
+    def resolve_obj(obj: Any) -> Any:
+        """Recursively resolve references in object"""
+        if isinstance(obj, dict):
+            result = {}
+            for key, value in obj.items():
+                if key.startswith("_"):
+                    continue  # Skip metadata
+                if key == "value":
+                    result[key] = resolve_value(value)
+                else:
+                    result[key] = resolve_obj(value)
+            return result
+        elif isinstance(obj, list):
+            return [resolve_obj(item) for item in obj]
+        else:
+            return obj
+
+    resolved = resolve_obj(tokens)
+
+    # Report unresolved references
+    if unresolved:
+        print(f"[WARN] {len(unresolved)} unresolved token references:")
+        for ref in unresolved[:10]:  # Show first 10
+            alias = PRIMITIVE_ALIASES.get(ref, "no alias")
+            print(f"  - {{{ref}}} (alias: {alias})")
+        if len(unresolved) > 10:
+            print(f"  ... and {len(unresolved) - 10} more")
+
+    return resolved
+
+
+def resolve_tokens(
+    skin_name: str = "shadcn",
+    theme_name: str = "default"
+) -> Dict[str, Any]:
+    """
+    Resolve tokens through the 3-layer cascade:
+    1. Core primitives (base values)
+    2. Skin tokens (semantic mappings)
+    3. Theme overrides (brand customization)
+    """
+    # Load each layer
+    primitives = load_json(DSS_DATA / "core" / "primitives.json")
+    skin = load_json(DSS_DATA / "skins" / skin_name / "tokens.json")
+    theme = load_json(DSS_DATA / "themes" / f"{theme_name}.json")
+
+    # Report what we're loading
+    print(f"[INFO] Resolving tokens:")
+    print(f"  Core: {len(primitives)} categories")
+    print(f"  Skin: {skin_name}")
+    print(f"  Theme: {theme_name}")
+
+    # Start with skin as base (it references primitives)
+    merged = {}
+
+    # Copy skin tokens
+    for category, tokens in skin.items():
+        if category.startswith("_"):
+            continue
+        merged[category] = tokens.copy() if isinstance(tokens, dict) else tokens
+
+    # Override with theme tokens
+    for category, tokens in theme.items():
+        if category.startswith("_"):
+            continue
+        if category in merged:
+            merged[category] = deep_merge(merged[category], tokens)
+        else:
+            merged[category] = tokens
+
+    # Resolve all references using primitives
+    resolved = resolve_references(merged, primitives)
+
+    # Clean up internal metadata
+    def clean_tokens(obj):
+        if isinstance(obj, dict):
+            return {
+                k: clean_tokens(v)
+                for k, v in obj.items()
+                if not k.startswith("_")
+            }
+        return obj
+
+    resolved = clean_tokens(resolved)
+
+    return resolved
+
+
+def main():
+    parser = argparse.ArgumentParser(description="Resolve DSS 3-layer token cascade")
+    parser.add_argument("--skin", default="shadcn", help="Skin to use (default: shadcn)")
+    parser.add_argument("--theme", default="default", help="Theme to use (default: default)")
+    parser.add_argument("--output", default=".dss/data/_system/tokens/tokens.json",
+                        help="Output path for resolved tokens")
+    parser.add_argument("--dry-run", action="store_true", help="Print tokens without saving")
+    args = parser.parse_args()
+
+    print("=" * 60)
+    print("DSS TOKEN RESOLVER - 3-Layer Cascade")
+    print("=" * 60)
+    print("")
+
+    # Resolve tokens
+    tokens = resolve_tokens(args.skin, args.theme)
+
+    # Count tokens
+    total = 0
+    for category, items in tokens.items():
+        if isinstance(items, dict):
+            total += len(items)
+
+    print(f"\n[OK] Resolved {total} tokens")
+
+    if args.dry_run:
+        print("\n[DRY RUN] Resolved tokens:")
+        print(json.dumps(tokens, indent=2))
+    else:
+        # Save to output path
+        output_path = Path(args.output)
+        if not output_path.is_absolute():
+            output_path = DSS_ROOT / output_path
+
+        output_path.parent.mkdir(parents=True, exist_ok=True)
+        with open(output_path, "w") as f:
+            json.dump(tokens, f, indent=2)
+        print(f"[OK] Saved to {output_path}")
+
+        # Also save metadata
+        meta_path = output_path.parent / "resolved-meta.json"
+        with open(meta_path, "w") as f:
+            json.dump({
+                "resolved_at": datetime.now().isoformat(),
+                "skin": args.skin,
+                "theme": args.theme,
+                "token_count": total,
+                "layers": ["core/primitives", f"skins/{args.skin}", f"themes/{args.theme}"]
+            }, f, indent=2)
+
+    print("")
+    print("[OK] Token resolution complete!")
+    print("  Next: Run style-dictionary build")
+
+
+if __name__ == "__main__":
+    main()
diff --git a/scripts/setup-mcp.sh b/scripts/setup-mcp.sh
deleted file mode 100755
index 67a867a..0000000
--- a/scripts/setup-mcp.sh
+++ /dev/null
@@ -1,27 +0,0 @@
-#!/bin/bash
-# Generate .mcp.json with absolute paths for current setup
-
-DSS_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
-
-cat > "$DSS_ROOT/.mcp.json" << EOF
-{
-  "\$schema": "https://raw.githubusercontent.com/anthropics/claude-code/main/schemas/mcp-servers.schema.json",
-  "mcpServers": {
-    "dss": {
-      "command": "$DSS_ROOT/venv/bin/python3",
-      "args": ["$DSS_ROOT/dss-claude-plugin/servers/dss-mcp-server.py"],
-      "env": {
-        "PYTHONPATH": "$DSS_ROOT:$DSS_ROOT/dss-claude-plugin",
-        "DSS_HOME": "$DSS_ROOT/.dss",
-        "DSS_DATABASE": "$DSS_ROOT/.dss/dss.db",
-        "DSS_CACHE": "$DSS_ROOT/.dss/cache",
-        "DSS_BASE_PATH": "$DSS_ROOT"
-      },
-      "description": "Design System Server MCP - local development"
-    }
-  }
-}
-EOF
-
-echo "Generated .mcp.json for: $DSS_ROOT"
-echo "Restart Claude Code to load the DSS MCP server."
diff --git a/scripts/validate-theme.py b/scripts/validate-theme.py
new file mode 100755
index 0000000..523338e
--- /dev/null
+++ b/scripts/validate-theme.py
@@ -0,0 +1,278 @@
+#!/usr/bin/env python3
+"""
+DSS Theme Validation Script
+Validates that themes only override tokens defined in the skin contract.
+
+Usage: python3 scripts/validate-theme.py [--theme THEME_NAME] [--skin SKIN_NAME]
+
+Defaults to validating all themes against the skin contract.
+"""
+
+import sys
+import os
+import json
+from pathlib import Path
+from typing import Dict, List, Set, Tuple
+
+DSS_ROOT = Path(__file__).parent.parent
+DSS_DATA = DSS_ROOT / ".dss"
+
+
+def load_json(path: Path) -> dict:
+    """Load JSON file"""
+    if not path.exists():
+        return {}
+    with open(path) as f:
+        return json.load(f)
+
+
+def get_contract_tokens(contract: dict) -> Dict[str, Set[str]]:
+    """Extract required token names from contract by category"""
+    required = contract.get("required_tokens", {})
+    result = {}
+    for category, data in required.items():
+        if isinstance(data, dict) and "required" in data:
+            result[category] = set(data["required"])
+    return result
+
+
+def get_theme_tokens(theme: dict) -> Dict[str, Set[str]]:
+    """Extract token names from theme by category"""
+    result = {}
+    for key, value in theme.items():
+        if key.startswith("_"):
+            continue
+        if isinstance(value, dict):
+            # Check if it's a token (has 'value' key) or a category
+            if "value" in value:
+                # Single token at root level
+                if "root" not in result:
+                    result["root"] = set()
+                result["root"].add(key)
+            else:
+                # Category with nested tokens
+                tokens = set()
+                for token_name, token_data in value.items():
+                    if isinstance(token_data, dict):
+                        tokens.add(token_name)
+                if tokens:
+                    result[key] = tokens
+    return result
+
+
+def get_skin_tokens(skin: dict) -> Dict[str, Set[str]]:
+    """Extract token names from skin by category"""
+    return get_theme_tokens(skin)  # Same structure
+
+
+def validate_theme(
+    theme_path: Path,
+    contract_path: Path,
+    skin_path: Path = None
+) -> Tuple[bool, List[str], List[str]]:
+    """
+    Validate a theme against the skin contract.
+
+    Returns: (is_valid, errors, warnings)
+    """
+    errors = []
+    warnings = []
+
+    contract = load_json(contract_path)
+    theme = load_json(theme_path)
+
+    if not contract:
+        errors.append(f"Contract not found: {contract_path}")
+        return False, errors, warnings
+
+    if not theme:
+        errors.append(f"Theme not found: {theme_path}")
+        return False, errors, warnings
+
+    contract_tokens = get_contract_tokens(contract)
+    theme_tokens = get_theme_tokens(theme)
+
+    # Load skin if provided for additional context
+    skin_tokens = {}
+    if skin_path and skin_path.exists():
+        skin = load_json(skin_path)
+        skin_tokens = get_skin_tokens(skin)
+
+    # Check each category in the theme
+    for category, tokens in theme_tokens.items():
+        # Handle dark mode variants
+        base_category = category.replace("-dark", "")
+
+        if base_category not in contract_tokens:
+            # Category not in contract - check if skin provides it
+            if base_category in skin_tokens:
+                warnings.append(
+                    f"Category '{category}' not in contract but exists in skin. "
+                    f"Consider adding to contract for stability."
+                )
+            else:
+                errors.append(
+                    f"Category '{category}' is not defined in the skin contract. "
+                    f"Theme should only override contract-defined tokens."
+                )
+            continue
+
+        # Check each token in the category
+        contract_category = contract_tokens[base_category]
+        for token in tokens:
+            if token not in contract_category:
+                # Token not in contract
+                if skin_tokens.get(base_category) and token in skin_tokens[base_category]:
+                    warnings.append(
+                        f"Token '{category}.{token}' exists in skin but not in contract. "
+                        f"May break on skin updates."
+                    )
+                else:
+                    errors.append(
+                        f"Token '{category}.{token}' is not in the skin contract. "
+                        f"Valid tokens: {sorted(contract_category)}"
+                    )
+
+    is_valid = len(errors) == 0
+    return is_valid, errors, warnings
+
+
+def validate_skin(
+    skin_path: Path,
+    contract_path: Path
+) -> Tuple[bool, List[str], List[str]]:
+    """
+    Validate that a skin provides all required contract tokens.
+
+    Returns: (is_valid, errors, warnings)
+    """
+    errors = []
+    warnings = []
+
+    contract = load_json(contract_path)
+    skin = load_json(skin_path)
+
+    if not contract:
+        errors.append(f"Contract not found: {contract_path}")
+        return False, errors, warnings
+
+    if not skin:
+        errors.append(f"Skin not found: {skin_path}")
+        return False, errors, warnings
+
+    contract_tokens = get_contract_tokens(contract)
+    skin_tokens = get_skin_tokens(skin)
+
+    # Check all required categories exist
+    for category, required in contract_tokens.items():
+        if category not in skin_tokens:
+            errors.append(
+                f"Skin missing required category: '{category}'. "
+                f"Required tokens: {sorted(required)}"
+            )
+            continue
+
+        # Check all required tokens exist
+        skin_category = skin_tokens[category]
+        missing = required - skin_category
+        if missing:
+            errors.append(
+                f"Skin missing required tokens in '{category}': {sorted(missing)}"
+            )
+
+        # Note extra tokens (not an error, just info)
+        extra = skin_category - required
+        if extra:
+            warnings.append(
+                f"Skin has extra tokens in '{category}' (OK): {sorted(extra)}"
+            )
+
+    is_valid = len(errors) == 0
+    return is_valid, errors, warnings
+
+
+def main():
+    import argparse
+
+    parser = argparse.ArgumentParser(description="Validate DSS themes and skins")
+    parser.add_argument("--theme", help="Theme name to validate (default: all)")
+    parser.add_argument("--skin", help="Skin name to validate (default: shadcn)")
+    parser.add_argument("--validate-skin", action="store_true", help="Validate skin against contract")
+    parser.add_argument("--quiet", "-q", action="store_true", help="Only show errors")
+    args = parser.parse_args()
+
+    contract_path = DSS_DATA / "schema" / "skin-contract.json"
+
+    print("=" * 60)
+    print("DSS THEME/SKIN VALIDATION")
+    print("=" * 60)
+
+    all_valid = True
+
+    # Validate skin if requested
+    if args.validate_skin or args.skin:
+        skin_name = args.skin or "shadcn"
+        skin_path = DSS_DATA / "skins" / skin_name / "tokens.json"
+
+        print(f"\n[SKIN] Validating: {skin_name}")
+        print("-" * 40)
+
+        is_valid, errors, warnings = validate_skin(skin_path, contract_path)
+
+        if errors:
+            all_valid = False
+            for err in errors:
+                print(f"  [ERROR] {err}")
+
+        if warnings and not args.quiet:
+            for warn in warnings:
+                print(f"  [WARN] {warn}")
+
+        if is_valid:
+            print(f"  [OK] Skin '{skin_name}' provides all contract tokens")
+
+    # Validate themes
+    themes_dir = DSS_DATA / "themes"
+    skin_path = DSS_DATA / "skins" / (args.skin or "shadcn") / "tokens.json"
+
+    if args.theme:
+        themes = [args.theme]
+    else:
+        themes = [
+            p.stem for p in themes_dir.glob("*.json")
+            if not p.stem.startswith("_")
+        ] if themes_dir.exists() else []
+
+    for theme_name in themes:
+        theme_path = themes_dir / f"{theme_name}.json"
+
+        print(f"\n[THEME] Validating: {theme_name}")
+        print("-" * 40)
+
+        is_valid, errors, warnings = validate_theme(
+            theme_path, contract_path, skin_path
+        )
+
+        if errors:
+            all_valid = False
+            for err in errors:
+                print(f"  [ERROR] {err}")
+
+        if warnings and not args.quiet:
+            for warn in warnings:
+                print(f"  [WARN] {warn}")
+
+        if is_valid:
+            print(f"  [OK] Theme '{theme_name}' is valid")
+
+    print("\n" + "=" * 60)
+    if all_valid:
+        print("[OK] All validations passed!")
+        sys.exit(0)
+    else:
+        print("[FAIL] Validation errors found")
+        sys.exit(1)
+
+
+if __name__ == "__main__":
+    main()