diff --git a/design/icon-picker-sezioni.pen b/design/icon-picker-sezioni.pen
new file mode 100644
index 00000000..a359f74f
--- /dev/null
+++ b/design/icon-picker-sezioni.pen
@@ -0,0 +1,382 @@
+{
+  "version": "2.8",
+  "children": [
+    {
+      "type": "frame",
+      "id": "ips01",
+      "x": 0,
+      "y": 0,
+      "name": "Icon Picker — Full Grid (280+ icons)",
+      "theme": { "Mode": "Light" },
+      "clip": true,
+      "width": 320,
+      "height": 480,
+      "fill": "$--background",
+      "layout": "vertical",
+      "padding": [12, 12],
+      "gap": 8,
+      "children": [
+        {
+          "type": "text",
+          "id": "ips02",
+          "content": "COLOR",
+          "fontSize": 10,
+          "fontWeight": 400,
+          "fontFamily": "IBM Plex Mono",
+          "textTransform": "uppercase",
+          "fill": "$--muted-foreground"
+        },
+        {
+          "type": "frame",
+          "id": "ips03",
+          "name": "colorRow",
+          "layout": "horizontal",
+          "gap": 8,
+          "children": [
+            { "type": "ellipse", "id": "ips03a", "fill": "#E53E3E", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03b", "fill": "#D9730D", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03c", "fill": "#D69E2E", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03d", "fill": "#38A169", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03e", "fill": "#155DFF", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03f", "fill": "#805AD5", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03g", "fill": "#319795", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips03h", "fill": "#D53F8C", "width": 24, "height": 24 }
+          ]
+        },
+        {
+          "type": "text",
+          "id": "ips04",
+          "content": "ICON",
+          "fontSize": 10,
+          "fontWeight": 400,
+          "fontFamily": "IBM Plex Mono",
+          "textTransform": "uppercase",
+          "fill": "$--muted-foreground"
+        },
+        {
+          "type": "frame",
+          "id": "ips05",
+          "name": "searchField",
+          "width": "fill_container",
+          "height": 28,
+          "fill": "$--background",
+          "stroke": { "align": "inside", "thickness": 1, "fill": "$--border" },
+          "cornerRadius": 4,
+          "layout": "horizontal",
+          "alignItems": "center",
+          "padding": [0, 8],
+          "gap": 6,
+          "children": [
+            {
+              "type": "text",
+              "id": "ips05a",
+              "content": "🔍",
+              "fontSize": 12
+            },
+            {
+              "type": "text",
+              "id": "ips05b",
+              "content": "Search icons…",
+              "fontSize": 12,
+              "fill": "$--muted-foreground"
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "ips06",
+          "name": "iconGrid",
+          "width": "fill_container",
+          "height": 300,
+          "layout": "horizontal",
+          "wrap": true,
+          "gap": 4,
+          "overflow": "scroll",
+          "children": [
+            { "type": "frame", "id": "ig01", "width": 30, "height": 30, "cornerRadius": 4, "fill": "$--muted", "children": [{ "type": "text", "id": "igl01", "content": "📄", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig02", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl02", "content": "🔧", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig03", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl03", "content": "⚗️", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig04", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl04", "content": "🎯", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig05", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl05", "content": "🏠", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig06", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl06", "content": "⭐", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig07", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl07", "content": "📚", "fontSize": 14 }] },
+            { "type": "frame", "id": "ig08", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "igl08", "content": "✈️", "fontSize": 14 }] },
+            {
+              "type": "text",
+              "id": "ig09",
+              "content": "… 280+ icons in scrollable grid",
+              "fontSize": 10,
+              "fill": "$--muted-foreground",
+              "width": "fill_container",
+              "textAlign": "center"
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "ips07",
+          "name": "doneRow",
+          "width": "fill_container",
+          "layout": "horizontal",
+          "justifyContent": "flex-end",
+          "children": [
+            {
+              "type": "text",
+              "id": "ips07a",
+              "content": "Done",
+              "fontSize": 12,
+              "fontWeight": 500,
+              "fill": "$--muted-foreground"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "frame",
+      "id": "ips10",
+      "x": 360,
+      "y": 0,
+      "name": "Icon Picker — Search 'book' filtered",
+      "theme": { "Mode": "Light" },
+      "clip": true,
+      "width": 320,
+      "height": 340,
+      "fill": "$--background",
+      "layout": "vertical",
+      "padding": [12, 12],
+      "gap": 8,
+      "children": [
+        {
+          "type": "text",
+          "id": "ips11",
+          "content": "COLOR",
+          "fontSize": 10,
+          "fontWeight": 400,
+          "fontFamily": "IBM Plex Mono",
+          "textTransform": "uppercase",
+          "fill": "$--muted-foreground"
+        },
+        {
+          "type": "frame",
+          "id": "ips12",
+          "name": "colorRow",
+          "layout": "horizontal",
+          "gap": 8,
+          "children": [
+            { "type": "ellipse", "id": "ips12a", "fill": "#E53E3E", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12b", "fill": "#D9730D", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12c", "fill": "#D69E2E", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12d", "fill": "#38A169", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12e", "fill": "#155DFF", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12f", "fill": "#805AD5", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12g", "fill": "#319795", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips12h", "fill": "#D53F8C", "width": 24, "height": 24 }
+          ]
+        },
+        {
+          "type": "text",
+          "id": "ips13",
+          "content": "ICON",
+          "fontSize": 10,
+          "fontWeight": 400,
+          "fontFamily": "IBM Plex Mono",
+          "textTransform": "uppercase",
+          "fill": "$--muted-foreground"
+        },
+        {
+          "type": "frame",
+          "id": "ips14",
+          "name": "searchField",
+          "width": "fill_container",
+          "height": 28,
+          "fill": "$--background",
+          "stroke": { "align": "inside", "thickness": 1, "fill": "#155DFF" },
+          "cornerRadius": 4,
+          "layout": "horizontal",
+          "alignItems": "center",
+          "padding": [0, 8],
+          "gap": 6,
+          "children": [
+            {
+              "type": "text",
+              "id": "ips14a",
+              "content": "🔍",
+              "fontSize": 12
+            },
+            {
+              "type": "text",
+              "id": "ips14b",
+              "content": "book",
+              "fontSize": 12,
+              "fill": "$--foreground"
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "ips15",
+          "name": "filteredIconGrid",
+          "width": "fill_container",
+          "layout": "horizontal",
+          "wrap": true,
+          "gap": 4,
+          "children": [
+            { "type": "frame", "id": "fg01", "width": 30, "height": 30, "cornerRadius": 4, "fill": "rgba(21,93,255,0.1)", "children": [{ "type": "text", "id": "fgl01", "content": "📖", "fontSize": 14 }] },
+            { "type": "frame", "id": "fg02", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "fgl02", "content": "📕", "fontSize": 14 }] },
+            { "type": "frame", "id": "fg03", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "fgl03", "content": "🔖", "fontSize": 14 }] },
+            { "type": "frame", "id": "fg04", "width": 30, "height": 30, "cornerRadius": 4, "fill": "transparent", "children": [{ "type": "text", "id": "fgl04", "content": "📚", "fontSize": 14 }] },
+            {
+              "type": "text",
+              "id": "fg05",
+              "content": "book, book-bookmark, book-open, bookmark, books",
+              "fontSize": 10,
+              "fill": "$--muted-foreground",
+              "width": "fill_container"
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "ips16",
+          "name": "doneRow",
+          "width": "fill_container",
+          "layout": "horizontal",
+          "justifyContent": "flex-end",
+          "children": [
+            {
+              "type": "text",
+              "id": "ips16a",
+              "content": "Done",
+              "fontSize": 12,
+              "fontWeight": 500,
+              "fill": "$--muted-foreground"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "frame",
+      "id": "ips20",
+      "x": 720,
+      "y": 0,
+      "name": "Icon Picker — Empty State (no results)",
+      "theme": { "Mode": "Light" },
+      "clip": true,
+      "width": 320,
+      "height": 300,
+      "fill": "$--background",
+      "layout": "vertical",
+      "padding": [12, 12],
+      "gap": 8,
+      "children": [
+        {
+          "type": "text",
+          "id": "ips21",
+          "content": "COLOR",
+          "fontSize": 10,
+          "fontWeight": 400,
+          "fontFamily": "IBM Plex Mono",
+          "textTransform": "uppercase",
+          "fill": "$--muted-foreground"
+        },
+        {
+          "type": "frame",
+          "id": "ips22",
+          "name": "colorRow",
+          "layout": "horizontal",
+          "gap": 8,
+          "children": [
+            { "type": "ellipse", "id": "ips22a", "fill": "#E53E3E", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22b", "fill": "#D9730D", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22c", "fill": "#D69E2E", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22d", "fill": "#38A169", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22e", "fill": "#155DFF", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22f", "fill": "#805AD5", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22g", "fill": "#319795", "width": 24, "height": 24 },
+            { "type": "ellipse", "id": "ips22h", "fill": "#D53F8C", "width": 24, "height": 24 }
+          ]
+        },
+        {
+          "type": "text",
+          "id": "ips23",
+          "content": "ICON",
+          "fontSize": 10,
+          "fontWeight": 400,
+          "fontFamily": "IBM Plex Mono",
+          "textTransform": "uppercase",
+          "fill": "$--muted-foreground"
+        },
+        {
+          "type": "frame",
+          "id": "ips24",
+          "name": "searchField",
+          "width": "fill_container",
+          "height": 28,
+          "fill": "$--background",
+          "stroke": { "align": "inside", "thickness": 1, "fill": "#155DFF" },
+          "cornerRadius": 4,
+          "layout": "horizontal",
+          "alignItems": "center",
+          "padding": [0, 8],
+          "gap": 6,
+          "children": [
+            {
+              "type": "text",
+              "id": "ips24a",
+              "content": "🔍",
+              "fontSize": 12
+            },
+            {
+              "type": "text",
+              "id": "ips24b",
+              "content": "zzzznotfound",
+              "fontSize": 12,
+              "fill": "$--foreground"
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "ips25",
+          "name": "emptyState",
+          "width": "fill_container",
+          "height": 80,
+          "layout": "vertical",
+          "alignItems": "center",
+          "justifyContent": "center",
+          "children": [
+            {
+              "type": "text",
+              "id": "ips25a",
+              "content": "No icons found",
+              "fontSize": 12,
+              "fill": "$--muted-foreground",
+              "textAlign": "center"
+            }
+          ]
+        },
+        {
+          "type": "frame",
+          "id": "ips26",
+          "name": "doneRow",
+          "width": "fill_container",
+          "layout": "horizontal",
+          "justifyContent": "flex-end",
+          "children": [
+            {
+              "type": "text",
+              "id": "ips26a",
+              "content": "Done",
+              "fontSize": 12,
+              "fontWeight": 500,
+              "fill": "$--muted-foreground"
+            }
+          ]
+        }
+      ]
+    }
+  ],
+  "variables": {}
+}