diff --git a/package-lock.json b/package-lock.json
index 83ceee4c..844e418a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -24,29 +24,25 @@
         "@radix-ui/react-popover": "1.0.3",
         "@radix-ui/react-scroll-area": "^1.0.2",
         "@radix-ui/react-separator": "^1.0.1",
-        "@tailwindcss/nesting": "^0.0.0-insiders.565cd3e",
         "@tanstack/react-query": "^4.24.10",
         "@tauri-apps/api": "^1.2.0",
         "classnames": "^2.3.2",
         "codemirror": "^6.0.1",
         "framer-motion": "^9.0.4",
-        "lodash": "^4.17.21",
         "parse-color": "^1.0.0",
-        "parse-json": "^6.0.2",
         "react": "^18.2.0",
-        "react-color": "^2.19.3",
         "react-dom": "^18.2.0",
         "react-helmet-async": "^1.3.0",
         "react-router-dom": "^6.8.1"
       },
       "devDependencies": {
+        "@preact/preset-vite": "^2.5.0",
+        "@tailwindcss/nesting": "^0.0.0-insiders.565cd3e",
         "@tauri-apps/cli": "^1.2.2",
-        "@types/lodash": "^4.14.191",
         "@types/node": "^18.7.10",
         "@types/parse-color": "^1.0.1",
         "@types/parse-json": "^4.0.0",
         "@types/react": "^18.0.15",
-        "@types/react-color": "^3.0.6",
         "@types/react-dom": "^18.0.6",
         "@typescript-eslint/eslint-plugin": "^5.52.0",
         "@typescript-eslint/parser": "^5.52.0",
@@ -86,6 +82,7 @@
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz",
       "integrity": "sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==",
+      "dev": true,
       "dependencies": {
         "@babel/highlight": "^7.18.6"
       },
@@ -160,6 +157,18 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/helper-annotate-as-pure": {
+      "version": "7.18.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.18.6.tgz",
+      "integrity": "sha512-duORpUiYrEpzKIop6iNbjnwKLAKnJ47csTyRACyEmWj0QdUrm5aqNJGHSSEQSUAvNW0ojX0dOmK9dZduvkfeXA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/types": "^7.18.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/helper-compilation-targets": {
       "version": "7.20.7",
       "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.20.7.tgz",
@@ -290,6 +299,7 @@
       "version": "7.19.1",
       "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.19.1.tgz",
       "integrity": "sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==",
+      "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
@@ -321,6 +331,7 @@
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.18.6.tgz",
       "integrity": "sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==",
+      "dev": true,
       "dependencies": {
         "@babel/helper-validator-identifier": "^7.18.6",
         "chalk": "^2.0.0",
@@ -342,6 +353,55 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/plugin-syntax-jsx": {
+      "version": "7.18.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.18.6.tgz",
+      "integrity": "sha512-6mmljtAedFGTWu2p/8WIORGwy+61PLgOMPOdazc7YoJ9ZCWUyFy3A6CpPkRKLKD1ToAesxX8KGEViAiLo9N+7Q==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.18.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx": {
+      "version": "7.21.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.21.0.tgz",
+      "integrity": "sha512-6OAWljMvQrZjR2DaNhVfRz6dkCAVV+ymcLUmaf8bccGOHn2v5rHJK3tTpij0BuhdYWP4LLaqj5lwcdlpAAPuvg==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.18.6",
+        "@babel/helper-module-imports": "^7.18.6",
+        "@babel/helper-plugin-utils": "^7.20.2",
+        "@babel/plugin-syntax-jsx": "^7.18.6",
+        "@babel/types": "^7.21.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-development": {
+      "version": "7.18.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.18.6.tgz",
+      "integrity": "sha512-SA6HEjwYFKF7WDjWcMcMGUimmw/nhNRDWxr+KaLSCrkD/LMDBvWRmHAYgE1HDeF8KUuI8OAu+RT6EOtKxSW2qA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/plugin-transform-react-jsx": "^7.18.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
     "node_modules/@babel/plugin-transform-react-jsx-self": {
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.18.6.tgz",
@@ -419,9 +479,9 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.20.7",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.20.7.tgz",
-      "integrity": "sha512-69OnhBxSSgK0OzTJai4kyPDiKTIe3j+ctaHdIGVbRahTLAT7L3R9oeXHC2aVSuGYt3cVnoAMDmOCgJ2yaiLMvg==",
+      "version": "7.21.2",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.21.2.tgz",
+      "integrity": "sha512-3wRZSs7jiFaB8AjxiiD+VqN5DTG2iRvJGQ+qYFrs/654lg6kGTQWIOFjlBo5RaXuAZjBmP3+OQH4dmhqiiyYxw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-string-parser": "^7.19.4",
@@ -1051,14 +1111,6 @@
       "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
       "dev": true
     },
-    "node_modules/@icons/material": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
-      "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw==",
-      "peerDependencies": {
-        "react": "*"
-      }
-    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
@@ -1303,6 +1355,64 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@preact/preset-vite": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/@preact/preset-vite/-/preset-vite-2.5.0.tgz",
+      "integrity": "sha512-BUhfB2xQ6ex0yPkrT1Z3LbfPzjpJecOZwQ/xJrXGFSZD84+ObyS//41RdEoQCMWsM0t7UHGaujUxUBub7WM1Jw==",
+      "dev": true,
+      "dependencies": {
+        "@babel/plugin-transform-react-jsx": "^7.14.9",
+        "@babel/plugin-transform-react-jsx-development": "^7.16.7",
+        "@prefresh/vite": "^2.2.8",
+        "@rollup/pluginutils": "^4.1.1",
+        "babel-plugin-transform-hook-names": "^1.0.2",
+        "debug": "^4.3.1",
+        "kolorist": "^1.2.10",
+        "resolve": "^1.20.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "7.x",
+        "vite": "2.x || 3.x || 4.x"
+      }
+    },
+    "node_modules/@prefresh/babel-plugin": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/@prefresh/babel-plugin/-/babel-plugin-0.4.4.tgz",
+      "integrity": "sha512-/EvgIFMDL+nd20WNvMO0JQnzIl1EJPgmSaSYrZUww7A+aSdKsi37aL07TljrZR1cBMuzFxcr4xvqsUQLFJEukw==",
+      "dev": true
+    },
+    "node_modules/@prefresh/core": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/@prefresh/core/-/core-1.4.1.tgz",
+      "integrity": "sha512-og1vaBj3LMJagVncNrDb37Gqc0cWaUcDbpVt5hZtsN4i2Iwzd/5hyTsDHvlMirhSym3wL9ihU0Xa2VhSaOue7g==",
+      "dev": true,
+      "peerDependencies": {
+        "preact": "^10.0.0"
+      }
+    },
+    "node_modules/@prefresh/utils": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@prefresh/utils/-/utils-1.1.3.tgz",
+      "integrity": "sha512-Mb9abhJTOV4yCfkXrMrcgFiFT7MfNOw8sDa+XyZBdq/Ai2p4Zyxqsb3EgHLOEdHpMj6J9aiZ54W8H6FTam1u+A==",
+      "dev": true
+    },
+    "node_modules/@prefresh/vite": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/@prefresh/vite/-/vite-2.2.9.tgz",
+      "integrity": "sha512-1ERBF85Ja9/lkrfaltmo4Gca7R2ClQPSHHDDysFgfvPzHmLUeyB0x9WHwhwov/AA1DnyPhsfYT54z3yQd8XrgA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/core": "^7.9.6",
+        "@prefresh/babel-plugin": "0.4.4",
+        "@prefresh/core": "^1.3.3",
+        "@prefresh/utils": "^1.1.2",
+        "@rollup/pluginutils": "^4.1.0"
+      },
+      "peerDependencies": {
+        "preact": "^10.4.0",
+        "vite": ">=2.0.0-beta.3"
+      }
+    },
     "node_modules/@radix-ui/number": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@radix-ui/number/-/number-1.0.0.tgz",
@@ -1761,6 +1871,19 @@
         "node": ">=14"
       }
     },
+    "node_modules/@rollup/pluginutils": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.1.tgz",
+      "integrity": "sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==",
+      "dev": true,
+      "dependencies": {
+        "estree-walker": "^2.0.1",
+        "picomatch": "^2.2.2"
+      },
+      "engines": {
+        "node": ">= 8.0.0"
+      }
+    },
     "node_modules/@swc/core": {
       "version": "1.3.35",
       "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.3.35.tgz",
@@ -1951,6 +2074,7 @@
       "version": "0.0.0-insiders.565cd3e",
       "resolved": "https://registry.npmjs.org/@tailwindcss/nesting/-/nesting-0.0.0-insiders.565cd3e.tgz",
       "integrity": "sha512-WhHoFBx19TnH/c+xLwT/sxei6+4RpdfiyG3MYXfmLaMsADmVqBkF7B6lDalgZD9YdM459MF7DtxVbWkOrV7IaQ==",
+      "dev": true,
       "dependencies": {
         "postcss-nested": "^5.0.5"
       },
@@ -1962,6 +2086,7 @@
       "version": "5.0.6",
       "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-5.0.6.tgz",
       "integrity": "sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==",
+      "dev": true,
       "dependencies": {
         "postcss-selector-parser": "^6.0.6"
       },
@@ -2223,12 +2348,6 @@
       "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==",
       "dev": true
     },
-    "node_modules/@types/lodash": {
-      "version": "4.14.191",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.191.tgz",
-      "integrity": "sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ==",
-      "dev": true
-    },
     "node_modules/@types/node": {
       "version": "18.13.0",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-18.13.0.tgz",
@@ -2264,16 +2383,6 @@
         "csstype": "^3.0.2"
       }
     },
-    "node_modules/@types/react-color": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-3.0.6.tgz",
-      "integrity": "sha512-OzPIO5AyRmLA7PlOyISlgabpYUa3En74LP8mTMa0veCA719SvYQov4WLMsHvCgXP+L+KI9yGhYnqZafVGG0P4w==",
-      "dev": true,
-      "dependencies": {
-        "@types/react": "*",
-        "@types/reactcss": "*"
-      }
-    },
     "node_modules/@types/react-dom": {
       "version": "18.0.11",
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz",
@@ -2283,15 +2392,6 @@
         "@types/react": "*"
       }
     },
-    "node_modules/@types/reactcss": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.6.tgz",
-      "integrity": "sha512-qaIzpCuXNWomGR1Xq8SCFTtF4v8V27Y6f+b9+bzHiv087MylI/nTCqqdChNeWS7tslgROmYB7yeiruWX7WnqNg==",
-      "dev": true,
-      "dependencies": {
-        "@types/react": "*"
-      }
-    },
     "node_modules/@types/scheduler": {
       "version": "0.16.2",
       "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
@@ -2751,6 +2851,7 @@
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
       "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+      "dev": true,
       "dependencies": {
         "color-convert": "^1.9.0"
       },
@@ -2972,6 +3073,15 @@
         "deep-equal": "^2.0.5"
       }
     },
+    "node_modules/babel-plugin-transform-hook-names": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-hook-names/-/babel-plugin-transform-hook-names-1.0.2.tgz",
+      "integrity": "sha512-5gafyjyyBTTdX/tQQ0hRgu4AhNHG/hqWi0ZZmg2xvs2FgRkJXzDNKBZCyoYqgFkovfDrgM8OoKg8karoUvWeCw==",
+      "dev": true,
+      "peerDependencies": {
+        "@babel/core": "^7.12.10"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -3115,6 +3225,7 @@
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
       "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+      "dev": true,
       "dependencies": {
         "ansi-styles": "^3.2.1",
         "escape-string-regexp": "^1.0.5",
@@ -3269,6 +3380,7 @@
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
       "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "dev": true,
       "dependencies": {
         "color-name": "1.1.3"
       }
@@ -3276,7 +3388,8 @@
     "node_modules/color-name": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
+      "dev": true
     },
     "node_modules/concat-map": {
       "version": "0.0.1",
@@ -3425,6 +3538,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
       "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+      "dev": true,
       "bin": {
         "cssesc": "bin/cssesc"
       },
@@ -3630,14 +3744,6 @@
       "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
       "dev": true
     },
-    "node_modules/error-ex": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
-      "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
-      "dependencies": {
-        "is-arrayish": "^0.2.1"
-      }
-    },
     "node_modules/es-abstract": {
       "version": "1.21.1",
       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.21.1.tgz",
@@ -3795,6 +3901,7 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
       "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+      "dev": true,
       "engines": {
         "node": ">=0.8.0"
       }
@@ -4308,6 +4415,12 @@
         "node": ">=4.0"
       }
     },
+    "node_modules/estree-walker": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
+      "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
+      "dev": true
+    },
     "node_modules/esutils": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@@ -4712,6 +4825,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
       "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
+      "dev": true,
       "engines": {
         "node": ">=4"
       }
@@ -4874,11 +4988,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg=="
-    },
     "node_modules/is-bigint": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
@@ -5213,11 +5322,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/json-parse-even-better-errors": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w=="
-    },
     "node_modules/json-schema-traverse": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -5261,6 +5365,12 @@
         "node": ">=4.0"
       }
     },
+    "node_modules/kolorist": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.7.0.tgz",
+      "integrity": "sha512-ymToLHqL02udwVdbkowNpzjFd6UzozMtshPQKVi5k1EjKRqKqBrOnE9QbLEb0/pV76SAiIT13hdL8R6suc+f3g==",
+      "dev": true
+    },
     "node_modules/language-subtag-registry": {
       "version": "0.3.22",
       "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.22.tgz",
@@ -5298,14 +5408,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/lines-and-columns": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-2.0.3.tgz",
-      "integrity": "sha512-cNOjgCnLB+FnvWWtyRTzmB3POJ+cXxTA81LoW7u8JdmhfXzriropYwpjShnz1QLLWsQwY7nIxoDmcPTwphDK9w==",
-      "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
-      }
-    },
     "node_modules/local-pkg": {
       "version": "0.4.3",
       "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.4.3.tgz",
@@ -5336,12 +5438,8 @@
     "node_modules/lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
-    },
-    "node_modules/lodash-es": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
-      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "dev": true
     },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
@@ -5390,11 +5488,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/material-colors": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
-      "integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg=="
-    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -5472,6 +5565,7 @@
       "version": "3.3.4",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz",
       "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==",
+      "dev": true,
       "bin": {
         "nanoid": "bin/nanoid.cjs"
       },
@@ -5726,23 +5820,6 @@
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-0.5.3.tgz",
       "integrity": "sha512-RwBeO/B/vZR3dfKL1ye/vx8MHZ40ugzpyfeVG5GsiuGnrlMWe2o8wxBbLCpw9CsxV+wHuzYlCiWnybrIA0ling=="
     },
-    "node_modules/parse-json": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-6.0.2.tgz",
-      "integrity": "sha512-SA5aMiaIjXkAiBrW/yPgLgQAQg42f7K3ACO+2l/zOvtQBwX58DMUsFJXelW2fx3yMBmWOVkR6j1MGsdSbCA4UA==",
-      "dependencies": {
-        "@babel/code-frame": "^7.16.0",
-        "error-ex": "^1.3.2",
-        "json-parse-even-better-errors": "^2.3.1",
-        "lines-and-columns": "^2.0.2"
-      },
-      "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -5803,7 +5880,8 @@
     "node_modules/picocolors": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
+      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
+      "dev": true
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
@@ -5841,6 +5919,7 @@
       "version": "8.4.21",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
       "integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==",
+      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -5968,6 +6047,7 @@
       "version": "6.0.11",
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz",
       "integrity": "sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==",
+      "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -5982,6 +6062,17 @@
       "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
       "dev": true
     },
+    "node_modules/preact": {
+      "version": "10.13.0",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.13.0.tgz",
+      "integrity": "sha512-ERdIdUpR6doqdaSIh80hvzebHB7O6JxycOhyzAeLEchqOq/4yueslQbfnPwXaNhAYacFTyCclhwkEbOumT0tHw==",
+      "dev": true,
+      "peer": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/preact"
+      }
+    },
     "node_modules/prelude-ls": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -6100,23 +6191,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/react-color": {
-      "version": "2.19.3",
-      "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.19.3.tgz",
-      "integrity": "sha512-LEeGE/ZzNLIsFWa1TMe8y5VYqr7bibneWmvJwm1pCn/eNmrabWDh659JSPn9BuaMpEfU83WTOJfnCcjDZwNQTA==",
-      "dependencies": {
-        "@icons/material": "^0.2.4",
-        "lodash": "^4.17.15",
-        "lodash-es": "^4.17.15",
-        "material-colors": "^1.2.1",
-        "prop-types": "^15.5.10",
-        "reactcss": "^1.2.0",
-        "tinycolor2": "^1.4.1"
-      },
-      "peerDependencies": {
-        "react": "*"
-      }
-    },
     "node_modules/react-dom": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz",
@@ -6276,14 +6350,6 @@
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz",
       "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg=="
     },
-    "node_modules/reactcss": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
-      "integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
-      "dependencies": {
-        "lodash": "^4.0.1"
-      }
-    },
     "node_modules/read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -6601,6 +6667,7 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
       "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -6768,6 +6835,7 @@
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
       "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+      "dev": true,
       "dependencies": {
         "has-flag": "^3.0.0"
       },
@@ -6846,11 +6914,6 @@
       "integrity": "sha512-iyziEiyFxX4kyxSp+MtY1oCH/lvjH3PxFN8PGCDeqcZWAJ/i+9y+nL85w99PxVzrIvew/GSkSbDYtiGVa85Afg==",
       "dev": true
     },
-    "node_modules/tinycolor2": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz",
-      "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw=="
-    },
     "node_modules/tinypool": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-0.3.1.tgz",
@@ -7135,7 +7198,8 @@
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+      "dev": true
     },
     "node_modules/uuid": {
       "version": "9.0.0",
@@ -7572,6 +7636,7 @@
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz",
       "integrity": "sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==",
+      "dev": true,
       "requires": {
         "@babel/highlight": "^7.18.6"
       }
@@ -7629,6 +7694,15 @@
         }
       }
     },
+    "@babel/helper-annotate-as-pure": {
+      "version": "7.18.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.18.6.tgz",
+      "integrity": "sha512-duORpUiYrEpzKIop6iNbjnwKLAKnJ47csTyRACyEmWj0QdUrm5aqNJGHSSEQSUAvNW0ojX0dOmK9dZduvkfeXA==",
+      "dev": true,
+      "requires": {
+        "@babel/types": "^7.18.6"
+      }
+    },
     "@babel/helper-compilation-targets": {
       "version": "7.20.7",
       "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.20.7.tgz",
@@ -7725,7 +7799,8 @@
     "@babel/helper-validator-identifier": {
       "version": "7.19.1",
       "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.19.1.tgz",
-      "integrity": "sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w=="
+      "integrity": "sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==",
+      "dev": true
     },
     "@babel/helper-validator-option": {
       "version": "7.18.6",
@@ -7748,6 +7823,7 @@
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.18.6.tgz",
       "integrity": "sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==",
+      "dev": true,
       "requires": {
         "@babel/helper-validator-identifier": "^7.18.6",
         "chalk": "^2.0.0",
@@ -7760,6 +7836,37 @@
       "integrity": "sha512-DI4a1oZuf8wC+oAJA9RW6ga3Zbe8RZFt7kD9i4qAspz3I/yHet1VvC3DiSy/fsUvv5pvJuNPh0LPOdCcqinDPg==",
       "dev": true
     },
+    "@babel/plugin-syntax-jsx": {
+      "version": "7.18.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.18.6.tgz",
+      "integrity": "sha512-6mmljtAedFGTWu2p/8WIORGwy+61PLgOMPOdazc7YoJ9ZCWUyFy3A6CpPkRKLKD1ToAesxX8KGEViAiLo9N+7Q==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-plugin-utils": "^7.18.6"
+      }
+    },
+    "@babel/plugin-transform-react-jsx": {
+      "version": "7.21.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.21.0.tgz",
+      "integrity": "sha512-6OAWljMvQrZjR2DaNhVfRz6dkCAVV+ymcLUmaf8bccGOHn2v5rHJK3tTpij0BuhdYWP4LLaqj5lwcdlpAAPuvg==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-annotate-as-pure": "^7.18.6",
+        "@babel/helper-module-imports": "^7.18.6",
+        "@babel/helper-plugin-utils": "^7.20.2",
+        "@babel/plugin-syntax-jsx": "^7.18.6",
+        "@babel/types": "^7.21.0"
+      }
+    },
+    "@babel/plugin-transform-react-jsx-development": {
+      "version": "7.18.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.18.6.tgz",
+      "integrity": "sha512-SA6HEjwYFKF7WDjWcMcMGUimmw/nhNRDWxr+KaLSCrkD/LMDBvWRmHAYgE1HDeF8KUuI8OAu+RT6EOtKxSW2qA==",
+      "dev": true,
+      "requires": {
+        "@babel/plugin-transform-react-jsx": "^7.18.6"
+      }
+    },
     "@babel/plugin-transform-react-jsx-self": {
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.18.6.tgz",
@@ -7816,9 +7923,9 @@
       }
     },
     "@babel/types": {
-      "version": "7.20.7",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.20.7.tgz",
-      "integrity": "sha512-69OnhBxSSgK0OzTJai4kyPDiKTIe3j+ctaHdIGVbRahTLAT7L3R9oeXHC2aVSuGYt3cVnoAMDmOCgJ2yaiLMvg==",
+      "version": "7.21.2",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.21.2.tgz",
+      "integrity": "sha512-3wRZSs7jiFaB8AjxiiD+VqN5DTG2iRvJGQ+qYFrs/654lg6kGTQWIOFjlBo5RaXuAZjBmP3+OQH4dmhqiiyYxw==",
       "dev": true,
       "requires": {
         "@babel/helper-string-parser": "^7.19.4",
@@ -8207,12 +8314,6 @@
       "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
       "dev": true
     },
-    "@icons/material": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
-      "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw==",
-      "requires": {}
-    },
     "@jridgewell/gen-mapping": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
@@ -8446,6 +8547,54 @@
         "fastq": "^1.6.0"
       }
     },
+    "@preact/preset-vite": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/@preact/preset-vite/-/preset-vite-2.5.0.tgz",
+      "integrity": "sha512-BUhfB2xQ6ex0yPkrT1Z3LbfPzjpJecOZwQ/xJrXGFSZD84+ObyS//41RdEoQCMWsM0t7UHGaujUxUBub7WM1Jw==",
+      "dev": true,
+      "requires": {
+        "@babel/plugin-transform-react-jsx": "^7.14.9",
+        "@babel/plugin-transform-react-jsx-development": "^7.16.7",
+        "@prefresh/vite": "^2.2.8",
+        "@rollup/pluginutils": "^4.1.1",
+        "babel-plugin-transform-hook-names": "^1.0.2",
+        "debug": "^4.3.1",
+        "kolorist": "^1.2.10",
+        "resolve": "^1.20.0"
+      }
+    },
+    "@prefresh/babel-plugin": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/@prefresh/babel-plugin/-/babel-plugin-0.4.4.tgz",
+      "integrity": "sha512-/EvgIFMDL+nd20WNvMO0JQnzIl1EJPgmSaSYrZUww7A+aSdKsi37aL07TljrZR1cBMuzFxcr4xvqsUQLFJEukw==",
+      "dev": true
+    },
+    "@prefresh/core": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/@prefresh/core/-/core-1.4.1.tgz",
+      "integrity": "sha512-og1vaBj3LMJagVncNrDb37Gqc0cWaUcDbpVt5hZtsN4i2Iwzd/5hyTsDHvlMirhSym3wL9ihU0Xa2VhSaOue7g==",
+      "dev": true,
+      "requires": {}
+    },
+    "@prefresh/utils": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@prefresh/utils/-/utils-1.1.3.tgz",
+      "integrity": "sha512-Mb9abhJTOV4yCfkXrMrcgFiFT7MfNOw8sDa+XyZBdq/Ai2p4Zyxqsb3EgHLOEdHpMj6J9aiZ54W8H6FTam1u+A==",
+      "dev": true
+    },
+    "@prefresh/vite": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/@prefresh/vite/-/vite-2.2.9.tgz",
+      "integrity": "sha512-1ERBF85Ja9/lkrfaltmo4Gca7R2ClQPSHHDDysFgfvPzHmLUeyB0x9WHwhwov/AA1DnyPhsfYT54z3yQd8XrgA==",
+      "dev": true,
+      "requires": {
+        "@babel/core": "^7.9.6",
+        "@prefresh/babel-plugin": "0.4.4",
+        "@prefresh/core": "^1.3.3",
+        "@prefresh/utils": "^1.1.2",
+        "@rollup/pluginutils": "^4.1.0"
+      }
+    },
     "@radix-ui/number": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@radix-ui/number/-/number-1.0.0.tgz",
@@ -8803,6 +8952,16 @@
       "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.3.2.tgz",
       "integrity": "sha512-t54ONhl/h75X94SWsHGQ4G/ZrCEguKSRQr7DrjTciJXW0YU1QhlwYeycvK5JgkzlxmvrK7wq1NB/PLtHxoiDcA=="
     },
+    "@rollup/pluginutils": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.1.tgz",
+      "integrity": "sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==",
+      "dev": true,
+      "requires": {
+        "estree-walker": "^2.0.1",
+        "picomatch": "^2.2.2"
+      }
+    },
     "@swc/core": {
       "version": "1.3.35",
       "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.3.35.tgz",
@@ -8895,6 +9054,7 @@
       "version": "0.0.0-insiders.565cd3e",
       "resolved": "https://registry.npmjs.org/@tailwindcss/nesting/-/nesting-0.0.0-insiders.565cd3e.tgz",
       "integrity": "sha512-WhHoFBx19TnH/c+xLwT/sxei6+4RpdfiyG3MYXfmLaMsADmVqBkF7B6lDalgZD9YdM459MF7DtxVbWkOrV7IaQ==",
+      "dev": true,
       "requires": {
         "postcss-nested": "^5.0.5"
       },
@@ -8903,6 +9063,7 @@
           "version": "5.0.6",
           "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-5.0.6.tgz",
           "integrity": "sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==",
+          "dev": true,
           "requires": {
             "postcss-selector-parser": "^6.0.6"
           }
@@ -9035,12 +9196,6 @@
       "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==",
       "dev": true
     },
-    "@types/lodash": {
-      "version": "4.14.191",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.191.tgz",
-      "integrity": "sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ==",
-      "dev": true
-    },
     "@types/node": {
       "version": "18.13.0",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-18.13.0.tgz",
@@ -9076,16 +9231,6 @@
         "csstype": "^3.0.2"
       }
     },
-    "@types/react-color": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-3.0.6.tgz",
-      "integrity": "sha512-OzPIO5AyRmLA7PlOyISlgabpYUa3En74LP8mTMa0veCA719SvYQov4WLMsHvCgXP+L+KI9yGhYnqZafVGG0P4w==",
-      "dev": true,
-      "requires": {
-        "@types/react": "*",
-        "@types/reactcss": "*"
-      }
-    },
     "@types/react-dom": {
       "version": "18.0.11",
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz",
@@ -9095,15 +9240,6 @@
         "@types/react": "*"
       }
     },
-    "@types/reactcss": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.6.tgz",
-      "integrity": "sha512-qaIzpCuXNWomGR1Xq8SCFTtF4v8V27Y6f+b9+bzHiv087MylI/nTCqqdChNeWS7tslgROmYB7yeiruWX7WnqNg==",
-      "dev": true,
-      "requires": {
-        "@types/react": "*"
-      }
-    },
     "@types/scheduler": {
       "version": "0.16.2",
       "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
@@ -9419,6 +9555,7 @@
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
       "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+      "dev": true,
       "requires": {
         "color-convert": "^1.9.0"
       }
@@ -9572,6 +9709,13 @@
         "deep-equal": "^2.0.5"
       }
     },
+    "babel-plugin-transform-hook-names": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-hook-names/-/babel-plugin-transform-hook-names-1.0.2.tgz",
+      "integrity": "sha512-5gafyjyyBTTdX/tQQ0hRgu4AhNHG/hqWi0ZZmg2xvs2FgRkJXzDNKBZCyoYqgFkovfDrgM8OoKg8karoUvWeCw==",
+      "dev": true,
+      "requires": {}
+    },
     "balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -9668,6 +9812,7 @@
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
       "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+      "dev": true,
       "requires": {
         "ansi-styles": "^3.2.1",
         "escape-string-regexp": "^1.0.5",
@@ -9779,6 +9924,7 @@
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
       "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "dev": true,
       "requires": {
         "color-name": "1.1.3"
       }
@@ -9786,7 +9932,8 @@
     "color-name": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
+      "dev": true
     },
     "concat-map": {
       "version": "0.0.1",
@@ -9898,7 +10045,8 @@
     "cssesc": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
-      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg=="
+      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+      "dev": true
     },
     "csstype": {
       "version": "3.1.1",
@@ -10053,14 +10201,6 @@
       "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
       "dev": true
     },
-    "error-ex": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
-      "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
-      "requires": {
-        "is-arrayish": "^0.2.1"
-      }
-    },
     "es-abstract": {
       "version": "1.21.1",
       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.21.1.tgz",
@@ -10189,7 +10329,8 @@
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg=="
+      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+      "dev": true
     },
     "eslint": {
       "version": "8.34.0",
@@ -10579,6 +10720,12 @@
       "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
       "dev": true
     },
+    "estree-walker": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
+      "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
+      "dev": true
+    },
     "esutils": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@@ -10879,7 +11026,8 @@
     "has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-      "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw=="
+      "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
+      "dev": true
     },
     "has-property-descriptors": {
       "version": "1.0.0",
@@ -10994,11 +11142,6 @@
         "is-typed-array": "^1.1.10"
       }
     },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg=="
-    },
     "is-bigint": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
@@ -11224,11 +11367,6 @@
       "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
       "dev": true
     },
-    "json-parse-even-better-errors": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w=="
-    },
     "json-schema-traverse": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -11263,6 +11401,12 @@
         "object.assign": "^4.1.3"
       }
     },
+    "kolorist": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.7.0.tgz",
+      "integrity": "sha512-ymToLHqL02udwVdbkowNpzjFd6UzozMtshPQKVi5k1EjKRqKqBrOnE9QbLEb0/pV76SAiIT13hdL8R6suc+f3g==",
+      "dev": true
+    },
     "language-subtag-registry": {
       "version": "0.3.22",
       "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.22.tgz",
@@ -11294,11 +11438,6 @@
       "integrity": "sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==",
       "dev": true
     },
-    "lines-and-columns": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-2.0.3.tgz",
-      "integrity": "sha512-cNOjgCnLB+FnvWWtyRTzmB3POJ+cXxTA81LoW7u8JdmhfXzriropYwpjShnz1QLLWsQwY7nIxoDmcPTwphDK9w=="
-    },
     "local-pkg": {
       "version": "0.4.3",
       "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.4.3.tgz",
@@ -11317,12 +11456,8 @@
     "lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
-    },
-    "lodash-es": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
-      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "dev": true
     },
     "lodash.merge": {
       "version": "4.6.2",
@@ -11365,11 +11500,6 @@
         "@jridgewell/sourcemap-codec": "^1.4.13"
       }
     },
-    "material-colors": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
-      "integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg=="
-    },
     "merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -11430,7 +11560,8 @@
     "nanoid": {
       "version": "3.3.4",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz",
-      "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw=="
+      "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==",
+      "dev": true
     },
     "natural-compare": {
       "version": "1.4.0",
@@ -11615,17 +11746,6 @@
         }
       }
     },
-    "parse-json": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-6.0.2.tgz",
-      "integrity": "sha512-SA5aMiaIjXkAiBrW/yPgLgQAQg42f7K3ACO+2l/zOvtQBwX58DMUsFJXelW2fx3yMBmWOVkR6j1MGsdSbCA4UA==",
-      "requires": {
-        "@babel/code-frame": "^7.16.0",
-        "error-ex": "^1.3.2",
-        "json-parse-even-better-errors": "^2.3.1",
-        "lines-and-columns": "^2.0.2"
-      }
-    },
     "path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -11671,7 +11791,8 @@
     "picocolors": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
+      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
+      "dev": true
     },
     "picomatch": {
       "version": "2.3.1",
@@ -11700,6 +11821,7 @@
       "version": "8.4.21",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
       "integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==",
+      "dev": true,
       "requires": {
         "nanoid": "^3.3.4",
         "picocolors": "^1.0.0",
@@ -11759,6 +11881,7 @@
       "version": "6.0.11",
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz",
       "integrity": "sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==",
+      "dev": true,
       "requires": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -11770,6 +11893,13 @@
       "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
       "dev": true
     },
+    "preact": {
+      "version": "10.13.0",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.13.0.tgz",
+      "integrity": "sha512-ERdIdUpR6doqdaSIh80hvzebHB7O6JxycOhyzAeLEchqOq/4yueslQbfnPwXaNhAYacFTyCclhwkEbOumT0tHw==",
+      "dev": true,
+      "peer": true
+    },
     "prelude-ls": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -11843,20 +11973,6 @@
         "loose-envify": "^1.1.0"
       }
     },
-    "react-color": {
-      "version": "2.19.3",
-      "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.19.3.tgz",
-      "integrity": "sha512-LEeGE/ZzNLIsFWa1TMe8y5VYqr7bibneWmvJwm1pCn/eNmrabWDh659JSPn9BuaMpEfU83WTOJfnCcjDZwNQTA==",
-      "requires": {
-        "@icons/material": "^0.2.4",
-        "lodash": "^4.17.15",
-        "lodash-es": "^4.17.15",
-        "material-colors": "^1.2.1",
-        "prop-types": "^15.5.10",
-        "reactcss": "^1.2.0",
-        "tinycolor2": "^1.4.1"
-      }
-    },
     "react-dom": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz",
@@ -11963,14 +12079,6 @@
         }
       }
     },
-    "reactcss": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
-      "integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
-      "requires": {
-        "lodash": "^4.0.1"
-      }
-    },
     "read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -12191,7 +12299,8 @@
     "source-map-js": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw=="
+      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "dev": true
     },
     "spawn-command": {
       "version": "0.0.2-1",
@@ -12324,6 +12433,7 @@
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
       "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+      "dev": true,
       "requires": {
         "has-flag": "^3.0.0"
       }
@@ -12385,11 +12495,6 @@
       "integrity": "sha512-iyziEiyFxX4kyxSp+MtY1oCH/lvjH3PxFN8PGCDeqcZWAJ/i+9y+nL85w99PxVzrIvew/GSkSbDYtiGVa85Afg==",
       "dev": true
     },
-    "tinycolor2": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz",
-      "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw=="
-    },
     "tinypool": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-0.3.1.tgz",
@@ -12582,7 +12687,8 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+      "dev": true
     },
     "uuid": {
       "version": "9.0.0",
diff --git a/package.json b/package.json
index 2e630aac..21b94b57 100644
--- a/package.json
+++ b/package.json
@@ -31,29 +31,25 @@
     "@radix-ui/react-popover": "1.0.3",
     "@radix-ui/react-scroll-area": "^1.0.2",
     "@radix-ui/react-separator": "^1.0.1",
-    "@tailwindcss/nesting": "^0.0.0-insiders.565cd3e",
     "@tanstack/react-query": "^4.24.10",
     "@tauri-apps/api": "^1.2.0",
     "classnames": "^2.3.2",
     "codemirror": "^6.0.1",
     "framer-motion": "^9.0.4",
-    "lodash": "^4.17.21",
     "parse-color": "^1.0.0",
-    "parse-json": "^6.0.2",
     "react": "^18.2.0",
-    "react-color": "^2.19.3",
     "react-dom": "^18.2.0",
     "react-helmet-async": "^1.3.0",
     "react-router-dom": "^6.8.1"
   },
   "devDependencies": {
+    "@preact/preset-vite": "^2.5.0",
+    "@tailwindcss/nesting": "^0.0.0-insiders.565cd3e",
     "@tauri-apps/cli": "^1.2.2",
-    "@types/lodash": "^4.14.191",
     "@types/node": "^18.7.10",
     "@types/parse-color": "^1.0.1",
     "@types/parse-json": "^4.0.0",
     "@types/react": "^18.0.15",
-    "@types/react-color": "^3.0.6",
     "@types/react-dom": "^18.0.6",
     "@typescript-eslint/eslint-plugin": "^5.52.0",
     "@typescript-eslint/parser": "^5.52.0",
diff --git a/src-web/App.tsx b/src-web/App.tsx
index 2904ae9d..4cea380f 100644
--- a/src-web/App.tsx
+++ b/src-web/App.tsx
@@ -27,13 +27,13 @@ function App() {
 
   return (
     <div className="grid grid-cols-[auto_1fr] h-full text-gray-900 overflow-hidden rounded-[11px]">
-      <Sidebar requests={requests ?? []} workspaceId={workspaceId} activeRequestId={request?.id} />
+      <Sidebar requests={requests ?? []} workspaceId={workspaceId} activeRequestId={p.requestId} />
       {request && (
         <div className="h-full">
           <div className="grid grid-rows-[auto_1fr] h-full overflow-hidden">
             <HStack
               as={WindowDragRegion}
-              className="px-3 bg-background text-gray-900 border-b border-b-gray-200 pt-[1px]"
+              className="px-3 bg-gray-50 text-gray-900 border-b border-b-gray-200 pt-[1px]"
               alignItems="center"
             >
               {request.name}
diff --git a/src-web/components/Dropdown.tsx b/src-web/components/Dropdown.tsx
index a8dd1c4b..e4ea6d47 100644
--- a/src-web/components/Dropdown.tsx
+++ b/src-web/components/Dropdown.tsx
@@ -137,7 +137,7 @@ const DropdownMenuContent = forwardRef<HTMLDivElement, D.DropdownMenuContentProp
         align="start"
         className={classnames(
           className,
-          'bg-background rounded-md shadow-lg p-1.5 border border-gray-200',
+          'bg-gray-50 rounded-md shadow-lg p-1.5 border border-gray-200',
           'overflow-auto m-1',
         )}
         style={styles}
diff --git a/src-web/components/Editor/Editor.css b/src-web/components/Editor/Editor.css
index de167e65..7c028283 100644
--- a/src-web/components/Editor/Editor.css
+++ b/src-web/components/Editor/Editor.css
@@ -144,7 +144,7 @@
 
 /* NOTE: Extra selector required to override default styles */
 .cm-tooltip.cm-tooltip {
-    @apply shadow-lg bg-background rounded overflow-hidden text-gray-900 border border-gray-200 z-50 pointer-events-auto;
+    @apply shadow-lg bg-gray-50 rounded overflow-hidden text-gray-900 border border-gray-200 z-50 pointer-events-auto;
 
     * {
         @apply transition-none;
diff --git a/src-web/components/Editor/Editor.tsx b/src-web/components/Editor/Editor.tsx
index bd5beeaa..9f32add5 100644
--- a/src-web/components/Editor/Editor.tsx
+++ b/src-web/components/Editor/Editor.tsx
@@ -1,194 +1,4 @@
-import { defaultKeymap } from '@codemirror/commands';
-import { Compartment, EditorState } from '@codemirror/state';
-import { keymap, placeholder as placeholderExt, tooltips } from '@codemirror/view';
-import classnames from 'classnames';
-import { EditorView } from 'codemirror';
-import type { HTMLAttributes } from 'react';
-import { useEffect, useMemo, useRef, useState } from 'react';
-import './Editor.css';
-import { baseExtensions, getLanguageExtension, multiLineExtensions } from './extensions';
-import { singleLineExt } from './singleLine';
-
-export interface EditorProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
-  readOnly?: boolean;
-  heightMode?: 'auto' | 'full';
-  contentType?: string;
-  autoFocus?: boolean;
-  valueKey?: string | number;
-  defaultValue?: string;
-  placeholder?: string;
-  tooltipContainer?: HTMLElement;
-  useTemplating?: boolean;
-  onChange?: (value: string) => void;
-  singleLine?: boolean;
-}
-
-export default function Editor({
-  readOnly,
-  heightMode,
-  contentType,
-  autoFocus,
-  placeholder,
-  valueKey,
-  useTemplating,
-  defaultValue,
-  onChange,
-  className,
-  singleLine,
-  ...props
-}: EditorProps) {
-  const [cm, setCm] = useState<{ view: EditorView; langHolder: Compartment } | null>(null);
-  const ref = useRef<HTMLDivElement>(null);
-  const extensions = useMemo(
-    () =>
-      getExtensions({
-        container: ref.current,
-        readOnly,
-        placeholder,
-        singleLine,
-        onChange,
-        contentType,
-        useTemplating,
-      }),
-    [contentType, ref.current],
-  );
-
-  const syncGutterBg = () => {
-    if (ref.current === null) return;
-    if (singleLine) return;
-    const gutterEl = ref.current.querySelector<HTMLDivElement>('.cm-gutters');
-    const classList = className?.split(/\s+/) ?? [];
-    const bgClasses = classList
-      .filter((c) => c.match(/(^|:)?bg-.+/)) // Find bg-* classes
-      .map((c) => c.replace(/^bg-/, '!bg-')) // !important
-      .map((c) => c.replace(/^dark:bg-/, 'dark:!bg-')); // !important
-    if (gutterEl) {
-      gutterEl?.classList.add(...bgClasses);
-    }
-  };
-
-  // Create codemirror instance when ref initializes
-  useEffect(() => {
-    if (ref.current === null) return;
-    // console.log('INIT EDITOR');
-    let view: EditorView | null = null;
-    try {
-      const langHolder = new Compartment();
-      const langExt = getLanguageExtension({ contentType, useTemplating });
-      const state = EditorState.create({
-        doc: `${defaultValue ?? ''}`,
-        extensions: [...extensions, langHolder.of(langExt)],
-      });
-      view = new EditorView({
-        state,
-        parent: ref.current,
-      });
-      setCm({ view, langHolder });
-      syncGutterBg();
-      if (autoFocus && view) view.focus();
-    } catch (e) {
-      console.log('Failed to initialize Codemirror', e);
-    }
-    return () => view?.destroy();
-  }, [ref.current, valueKey]);
-
-  // Update value when valueKey changes
-  // TODO: This would be more efficient but the onChange handler gets fired on update
-  // useEffect(() => {
-  //   if (cm === null) return;
-  //   console.log('NEW DOC', valueKey, defaultValue);
-  //   cm.view.dispatch({
-  //     changes: { from: 0, to: cm.view.state.doc.length, insert: `${defaultValue ?? ''}` },
-  //   });
-  // }, [valueKey]);
-
-  // Update language extension when contentType changes
-  useEffect(() => {
-    if (cm === null) return;
-    // console.log('UPDATE LANG');
-    const ext = getLanguageExtension({ contentType, useTemplating });
-    cm.view.dispatch({ effects: cm.langHolder.reconfigure(ext) });
-  }, [contentType]);
-
-  return (
-    <div
-      ref={ref}
-      dangerouslySetInnerHTML={{ __html: '' }}
-      className={classnames(
-        className,
-        'cm-wrapper text-base bg-background',
-        heightMode === 'auto' ? 'cm-auto-height' : 'cm-full-height',
-        singleLine ? 'cm-singleline' : 'cm-multiline',
-        readOnly && 'cm-readonly',
-      )}
-      {...props}
-    />
-  );
-}
-
-function getExtensions({
-  container,
-  readOnly,
-  singleLine,
-  placeholder,
-  onChange,
-  contentType,
-  useTemplating,
-}: Pick<
-  EditorProps,
-  'singleLine' | 'onChange' | 'contentType' | 'useTemplating' | 'placeholder' | 'readOnly'
-> & { container: HTMLDivElement | null }) {
-  const ext = getLanguageExtension({ contentType, useTemplating });
-
-  // TODO: Ensure tooltips render inside the dialog if we are in one.
-  const parent =
-    container?.closest<HTMLDivElement>('[role="dialog"]') ??
-    document.querySelector<HTMLDivElement>('#cm-portal') ??
-    undefined;
-
-  return [
-    ...baseExtensions,
-    tooltips({ parent }),
-    keymap.of(singleLine ? defaultKeymap.filter((k) => k.key !== 'Enter') : defaultKeymap),
-    ...(singleLine ? [singleLineExt()] : []),
-    ...(!singleLine ? [multiLineExtensions] : []),
-    ...(ext ? [ext] : []),
-    ...(readOnly ? [EditorState.readOnly.of(true)] : []),
-    ...(placeholder ? [placeholderExt(placeholder)] : []),
-
-    ...(singleLine
-      ? [
-          EditorView.domEventHandlers({
-            focus: (e, view) => {
-              // select all text on focus, like a regular input does
-              view.dispatch({ selection: { anchor: 0, head: view.state.doc.length } });
-            },
-            keydown: (e) => {
-              // Submit nearest form on enter if there is one
-              if (e.key === 'Enter') {
-                const el = e.currentTarget as HTMLElement;
-                const form = el.closest('form');
-                form?.dispatchEvent(new Event('submit', { cancelable: true, bubbles: true }));
-              }
-            },
-          }),
-        ]
-      : []),
-
-    // Clear selection on blur
-    EditorView.domEventHandlers({
-      blur: (e, view) => {
-        setTimeout(() => {
-          view.dispatch({ selection: { anchor: 0, head: 0 } });
-        }, 100);
-      },
-    }),
-
-    // Handle onChange
-    EditorView.updateListener.of((update) => {
-      if (typeof onChange === 'function' && update.docChanged) {
-        onChange(update.state.doc.toString());
-      }
-    }),
-  ];
-}
+import type { EditorProps } from './_Editor';
+const { default: Editor } = await import('./_Editor');
+export { Editor };
+export type { EditorProps };
diff --git a/src-web/components/Editor/_Editor.tsx b/src-web/components/Editor/_Editor.tsx
new file mode 100644
index 00000000..01c51a41
--- /dev/null
+++ b/src-web/components/Editor/_Editor.tsx
@@ -0,0 +1,196 @@
+import { defaultKeymap } from '@codemirror/commands';
+import { Compartment, EditorState } from '@codemirror/state';
+import { keymap, placeholder as placeholderExt, tooltips } from '@codemirror/view';
+import classnames from 'classnames';
+import { EditorView } from 'codemirror';
+import type { HTMLAttributes } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
+const { baseExtensions, getLanguageExtension, multiLineExtensions } = await import('./extensions');
+import { singleLineExt } from './singleLine';
+import './Editor.css';
+
+export interface EditorProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+  readOnly?: boolean;
+  heightMode?: 'auto' | 'full';
+  contentType?: string;
+  autoFocus?: boolean;
+  valueKey?: string | number;
+  defaultValue?: string;
+  placeholder?: string;
+  tooltipContainer?: HTMLElement;
+  useTemplating?: boolean;
+  onChange?: (value: string) => void;
+  singleLine?: boolean;
+}
+
+export default function Editor({
+  readOnly,
+  heightMode,
+  contentType,
+  autoFocus,
+  placeholder,
+  valueKey,
+  useTemplating,
+  defaultValue,
+  onChange,
+  className,
+  singleLine,
+  ...props
+}: EditorProps) {
+  const [cm, setCm] = useState<{ view: EditorView; langHolder: Compartment } | null>(null);
+  const ref = useRef<HTMLDivElement>(null);
+  const extensions = useMemo(
+    () =>
+      getExtensions({
+        container: ref.current,
+        readOnly,
+        placeholder,
+        singleLine,
+        onChange,
+        contentType,
+        useTemplating,
+      }),
+    [contentType, ref.current],
+  );
+
+  // Create codemirror instance when ref initializes
+  useEffect(() => {
+    const parent = ref.current;
+    if (parent === null) return;
+
+    // console.log('INIT EDITOR');
+    let view: EditorView | null = null;
+    try {
+      const langHolder = new Compartment();
+      const langExt = getLanguageExtension({ contentType, useTemplating });
+      const state = EditorState.create({
+        doc: `${defaultValue ?? ''}`,
+        extensions: [...extensions, langHolder.of(langExt)],
+      });
+      view = new EditorView({ state, parent });
+      syncGutterBg({ parent, className });
+      setCm({ view, langHolder });
+      if (autoFocus && view) view.focus();
+    } catch (e) {
+      console.log('Failed to initialize Codemirror', e);
+    }
+    return () => view?.destroy();
+  }, [ref.current, valueKey]);
+
+  // Update value when valueKey changes
+  // TODO: This would be more efficient but the onChange handler gets fired on update
+  // useEffect(() => {
+  //   if (cm === null) return;
+  //   console.log('NEW DOC', valueKey, defaultValue);
+  //   cm.view.dispatch({
+  //     changes: { from: 0, to: cm.view.state.doc.length, insert: `${defaultValue ?? ''}` },
+  //   });
+  // }, [valueKey]);
+
+  // Update language extension when contentType changes
+  useEffect(() => {
+    if (cm === null) return;
+    // console.log('UPDATE LANG');
+    const ext = getLanguageExtension({ contentType, useTemplating });
+    cm.view.dispatch({ effects: cm.langHolder.reconfigure(ext) });
+  }, [contentType]);
+
+  return (
+    <div
+      ref={ref}
+      className={classnames(
+        className,
+        'cm-wrapper text-base bg-gray-50',
+        heightMode === 'auto' ? 'cm-auto-height' : 'cm-full-height',
+        singleLine ? 'cm-singleline' : 'cm-multiline',
+        readOnly && 'cm-readonly',
+      )}
+      {...props}
+    />
+  );
+}
+
+function getExtensions({
+  container,
+  readOnly,
+  singleLine,
+  placeholder,
+  onChange,
+  contentType,
+  useTemplating,
+}: Pick<
+  EditorProps,
+  'singleLine' | 'onChange' | 'contentType' | 'useTemplating' | 'placeholder' | 'readOnly'
+> & { container: HTMLDivElement | null }) {
+  const ext = getLanguageExtension({ contentType, useTemplating });
+
+  // TODO: Ensure tooltips render inside the dialog if we are in one.
+  const parent =
+    container?.closest<HTMLDivElement>('[role="dialog"]') ??
+    document.querySelector<HTMLDivElement>('#cm-portal') ??
+    undefined;
+
+  return [
+    ...baseExtensions,
+    tooltips({ parent }),
+    keymap.of(singleLine ? defaultKeymap.filter((k) => k.key !== 'Enter') : defaultKeymap),
+    ...(singleLine ? [singleLineExt()] : []),
+    ...(!singleLine ? [multiLineExtensions] : []),
+    ...(ext ? [ext] : []),
+    ...(readOnly ? [EditorState.readOnly.of(true)] : []),
+    ...(placeholder ? [placeholderExt(placeholder)] : []),
+
+    ...(singleLine
+      ? [
+          EditorView.domEventHandlers({
+            focus: (e, view) => {
+              // select all text on focus, like a regular input does
+              view.dispatch({ selection: { anchor: 0, head: view.state.doc.length } });
+            },
+            keydown: (e) => {
+              // Submit nearest form on enter if there is one
+              if (e.key === 'Enter') {
+                const el = e.currentTarget as HTMLElement;
+                const form = el.closest('form');
+                form?.dispatchEvent(new Event('submit', { cancelable: true, bubbles: true }));
+              }
+            },
+          }),
+        ]
+      : []),
+
+    // Clear selection on blur
+    EditorView.domEventHandlers({
+      blur: (e, view) => {
+        setTimeout(() => {
+          view.dispatch({ selection: { anchor: 0, head: 0 } });
+        }, 100);
+      },
+    }),
+
+    // Handle onChange
+    EditorView.updateListener.of((update) => {
+      if (typeof onChange === 'function' && update.docChanged) {
+        onChange(update.state.doc.toString());
+      }
+    }),
+  ];
+}
+
+const syncGutterBg = ({
+  parent,
+  className = '',
+}: {
+  parent: HTMLDivElement;
+  className?: string;
+}) => {
+  const gutterEl = parent.querySelector<HTMLDivElement>('.cm-gutters');
+  const classList = className?.split(/\s+/) ?? [];
+  const bgClasses = classList
+    .filter((c) => c.match(/(^|:)?bg-.+/)) // Find bg-* classes
+    .map((c) => c.replace(/^bg-/, '!bg-')) // !important
+    .map((c) => c.replace(/^dark:bg-/, 'dark:!bg-')); // !important
+  if (gutterEl) {
+    gutterEl?.classList.add(...bgClasses);
+  }
+};
diff --git a/src-web/components/Editor/autocomplete.ts b/src-web/components/Editor/autocomplete.ts
index 6757ad16..b9f63d85 100644
--- a/src-web/components/Editor/autocomplete.ts
+++ b/src-web/components/Editor/autocomplete.ts
@@ -1,6 +1,6 @@
 import { closeCompletion, startCompletion } from '@codemirror/autocomplete';
 import { EditorView } from 'codemirror';
-import { debounce } from 'lodash';
+import { debounce } from '../../lib/debounce';
 
 /*
  * Debounce autocomplete until user stops typing for `millis` milliseconds.
diff --git a/src-web/components/Input.tsx b/src-web/components/Input.tsx
index 9194a8a0..67f07440 100644
--- a/src-web/components/Input.tsx
+++ b/src-web/components/Input.tsx
@@ -1,7 +1,7 @@
 import classnames from 'classnames';
 import type { InputHTMLAttributes, ReactNode } from 'react';
 import type { EditorProps } from './Editor/Editor';
-import Editor from './Editor/Editor';
+import { Editor } from './Editor/Editor';
 import { HStack, VStack } from './Stacks';
 
 interface Props
diff --git a/src-web/components/RequestPane.tsx b/src-web/components/RequestPane.tsx
index 728e7d52..07aa888e 100644
--- a/src-web/components/RequestPane.tsx
+++ b/src-web/components/RequestPane.tsx
@@ -2,7 +2,7 @@ import classnames from 'classnames';
 import { useRequestUpdate, useSendRequest } from '../hooks/useRequest';
 import type { HttpRequest } from '../lib/models';
 import { Button } from './Button';
-import Editor from './Editor/Editor';
+import { Editor } from './Editor/Editor';
 import { ScrollArea } from './ScrollArea';
 import { HStack } from './Stacks';
 import { UrlBar } from './UrlBar';
diff --git a/src-web/components/ResponsePane.tsx b/src-web/components/ResponsePane.tsx
index 91258a74..fde2d500 100644
--- a/src-web/components/ResponsePane.tsx
+++ b/src-web/components/ResponsePane.tsx
@@ -2,11 +2,12 @@ import classnames from 'classnames';
 import { useEffect, useMemo, useState } from 'react';
 import { useDeleteAllResponses, useDeleteResponse, useResponses } from '../hooks/useResponses';
 import { Dropdown } from './Dropdown';
-import Editor from './Editor/Editor';
+import { Editor } from './Editor/Editor';
 import { Icon } from './Icon';
 import { IconButton } from './IconButton';
 import { HStack } from './Stacks';
 import { StatusColor } from './StatusColor';
+import { Webview } from './Webview';
 
 interface Props {
   requestId: string;
@@ -33,15 +34,6 @@ export function ResponsePane({ requestId, className }: Props) {
     [response],
   );
 
-  const contentForIframe: string | null = useMemo(() => {
-    if (!contentType.includes('html')) return null;
-    if (response == null) return null;
-    if (response.body.includes('<head>')) {
-      return response.body.replace(/<head>/gi, `<head><base href="${response.url}"/>`);
-    }
-    return response.body;
-  }, [response?.body, contentType]);
-
   if (!response) {
     return null;
   }
@@ -119,15 +111,8 @@ export function ResponsePane({ requestId, className }: Props) {
               <div className="p-1">
                 <div className="text-white bg-red-500 px-3 py-2 rounded">{response.error}</div>
               </div>
-            ) : viewMode === 'pretty' && contentForIframe !== null ? (
-              <div className="px-2 pb-2">
-                <iframe
-                  title="Response preview"
-                  srcDoc={contentForIframe}
-                  sandbox="allow-scripts allow-same-origin"
-                  className="h-full w-full rounded-md border border-gray-100/20"
-                />
-              </div>
+            ) : viewMode === 'pretty' ? (
+              <Webview body={response.body} contentType={contentType} url={response.url} />
             ) : response?.body ? (
               <Editor
                 readOnly
diff --git a/src-web/components/Sidebar.tsx b/src-web/components/Sidebar.tsx
index 1ad972e6..99476499 100644
--- a/src-web/components/Sidebar.tsx
+++ b/src-web/components/Sidebar.tsx
@@ -1,7 +1,6 @@
 import classnames from 'classnames';
 import type { HTMLAttributes } from 'react';
 import React, { useState } from 'react';
-import { SketchPicker } from 'react-color';
 import { useRequestCreate } from '../hooks/useRequest';
 import useTheme from '../hooks/useTheme';
 import type { HttpRequest } from '../lib/models';
@@ -21,10 +20,8 @@ interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
 
 export function Sidebar({ className, activeRequestId, workspaceId, requests, ...props }: Props) {
   const createRequest = useRequestCreate({ workspaceId, navigateAfter: true });
-  const { appearance, toggleAppearance, forceSetTheme } = useTheme();
+  const { appearance, toggleAppearance } = useTheme();
   const [open, setOpen] = useState<boolean>(false);
-  const [color, setColor] = useState<string>('blue');
-  const [showPicker, setShowPicker] = useState<boolean>(false);
   return (
     <div
       className={classnames(
@@ -63,17 +60,6 @@ export function Sidebar({ className, activeRequestId, workspaceId, requests, ...
           <IconButton icon={appearance === 'dark' ? 'moon' : 'sun'} onClick={toggleAppearance} />
           <IconButton icon="rows" onClick={() => setOpen(true)} />
         </HStack>
-
-        {showPicker && (
-          <SketchPicker
-            className="fixed z-10 bottom-2 right-2"
-            color={color}
-            onChange={(c) => {
-              setColor(c.hex);
-              forceSetTheme(c.hex);
-            }}
-          />
-        )}
       </VStack>
     </div>
   );
@@ -86,7 +72,12 @@ function SidebarItem({ request, active }: { request: HttpRequest; active: boolea
         color="custom"
         to={`/workspaces/${request.workspaceId}/requests/${request.id}`}
         disabled={active}
-        className={classnames('w-full', active ? 'bg-gray-200/70 text-gray-900' : 'text-gray-600')}
+        className={classnames(
+          'w-full',
+          active
+            ? 'bg-gray-200/70 text-gray-900'
+            : 'text-gray-600 hover:text-gray-800 active:bg-gray-200/50',
+        )}
         size="sm"
         justify="start"
       >
diff --git a/src-web/components/Webview.tsx b/src-web/components/Webview.tsx
new file mode 100644
index 00000000..718ad3db
--- /dev/null
+++ b/src-web/components/Webview.tsx
@@ -0,0 +1,28 @@
+import { useMemo } from 'react';
+
+interface Props {
+  body: string;
+  contentType: string;
+  url: string;
+}
+
+export function Webview({ body, url, contentType }: Props) {
+  const contentForIframe: string | undefined = useMemo(() => {
+    if (!contentType.includes('html')) return;
+    if (body.includes('<head>')) {
+      return body.replace(/<head>/gi, `<head><base href="${url}"/>`);
+    }
+    return body;
+  }, [body, contentType]);
+
+  return (
+    <div className="px-2 pb-2">
+      <iframe
+        title="Response preview"
+        srcDoc={contentForIframe}
+        sandbox="allow-scripts allow-same-origin"
+        className="h-full w-full rounded-md border border-gray-100/20"
+      />
+    </div>
+  );
+}
diff --git a/src-web/hooks/useTheme.ts b/src-web/hooks/useTheme.ts
index edef69ff..ae5ff8eb 100644
--- a/src-web/hooks/useTheme.ts
+++ b/src-web/hooks/useTheme.ts
@@ -1,5 +1,4 @@
 import { useQuery, useQueryClient } from '@tanstack/react-query';
-import { debounce } from 'lodash';
 import { useEffect } from 'react';
 import type { Appearance } from '../lib/theme/window';
 import {
@@ -11,10 +10,6 @@ import {
 
 const appearanceQueryKey = ['theme', 'appearance'];
 
-const forceSetTheme = debounce((gray: string) => {
-  setAppearance(getAppearance(), gray);
-}, 200);
-
 export default function useTheme() {
   const queryClient = useQueryClient();
   const appearance = useQuery({
@@ -38,7 +33,6 @@ export default function useTheme() {
 
   return {
     appearance,
-    forceSetTheme,
     toggleAppearance: handleToggleAppearance,
   };
 }
diff --git a/src-web/lib/debounce.ts b/src-web/lib/debounce.ts
new file mode 100644
index 00000000..a2d44532
--- /dev/null
+++ b/src-web/lib/debounce.ts
@@ -0,0 +1,11 @@
+export function debounce(fn: (...args: any[]) => any, delay: number) {
+  let timer: ReturnType<typeof setTimeout>;
+  const result = function (...args: Parameters<typeof fn>) {
+    clearTimeout(timer);
+    timer = setTimeout(() => fn(...args), delay);
+  };
+  result.cancel = function () {
+    clearTimeout(timer);
+  };
+  return result;
+}
diff --git a/src-web/lib/theme/window.ts b/src-web/lib/theme/window.ts
index 1dcd9a5f..e9d962e4 100644
--- a/src-web/lib/theme/window.ts
+++ b/src-web/lib/theme/window.ts
@@ -8,9 +8,9 @@ const darkTheme: AppTheme = {
   appearance: 'dark',
   layers: {
     root: {
-      blackPoint: 0.3,
+      blackPoint: 0.2,
       colors: {
-        gray: '#656196',
+        gray: '#6b5b98',
         red: '#ee3b3b',
         orange: '#ff9411',
         yellow: '#dcc73b',
@@ -59,15 +59,10 @@ export function toggleAppearance(): Appearance {
   return newAppearance;
 }
 
-export function setAppearance(a?: Appearance, gray?: string) {
+export function setAppearance(a?: Appearance) {
   const appearance = a ?? getPreferredAppearance();
   const theme = appearance === 'dark' ? darkTheme : lightTheme;
 
-  // Hack to update the gray color for a demo
-  if (theme.layers.root && gray) {
-    theme.layers.root.colors.gray = gray;
-  }
-
   document.documentElement.setAttribute('data-appearance', appearance);
   document.documentElement.setAttribute('data-theme', theme.name);
 
diff --git a/src-web/main.css b/src-web/main.css
index d77963fc..bdaa3bc2 100644
--- a/src-web/main.css
+++ b/src-web/main.css
@@ -28,196 +28,5 @@
         --transition-duration: 100ms ease-in-out;
         --color-white: 255 100% 100%;
         --color-black: 255 0% 0%;
-        --color-background: var(--color-gray-50);
-    }
-
-    :root, [data-theme="light"] {
-        /* Colors */
-        --color-green-50: 160 84% 95%;
-        --color-green-100: 160 84% 88%;
-        --color-green-200: 160 84% 76%;
-        --color-green-300: 160 84% 70%;
-        --color-green-400: 160 84% 60%;
-        --color-green-500: 160 84% 50%;
-        --color-green-600: 160 84% 38%;
-        --color-green-700: 160 84% 30%;
-        --color-green-800: 160 84% 20%;
-        --color-green-900: 160 84% 10%;
-
-        --color-blue-50: 217 91% 95%;
-        --color-blue-100: 217 91% 88%;
-        --color-blue-200: 217 91% 76%;
-        --color-blue-300: 217 91% 70%;
-        --color-blue-400: 217 91% 65%;
-        --color-blue-500: 217 91% 58%;
-        --color-blue-600: 217 91% 43%;
-        --color-blue-700: 217 91% 30%;
-        --color-blue-800: 217 91% 20%;
-        --color-blue-900: 217 91% 10%;
-
-        --color-pink-50: 292 84% 95%;
-        --color-pink-100: 292 84% 88%;
-        --color-pink-200: 292 84% 76%;
-        --color-pink-300: 292 84% 70%;
-        --color-pink-400: 292 84% 65%;
-        --color-pink-500: 292 84% 58%;
-        --color-pink-600: 292 84% 43%;
-        --color-pink-700: 292 84% 30%;
-        --color-pink-800: 292 84% 20%;
-        --color-pink-900: 292 84% 10%;
-
-        --color-violet-50: 258 90% 95%;
-        --color-violet-100: 258 90% 88%;
-        --color-violet-200: 258 90% 76%;
-        --color-violet-300: 258 90% 70%;
-        --color-violet-400: 258 90% 65%;
-        --color-violet-500: 258 90% 58%;
-        --color-violet-600: 258 90% 43%;
-        --color-violet-700: 258 90% 30%;
-        --color-violet-800: 258 90% 20%;
-        --color-violet-900: 258 90% 10%;
-
-        --color-red-50: 0 84% 95%;
-        --color-red-100: 0 84% 88%;
-        --color-red-200: 0 84% 76%;
-        --color-red-300: 0 84% 70%;
-        --color-red-400: 0 84% 65%;
-        --color-red-500: 0 84% 58%;
-        --color-red-600: 0 84% 43%;
-        --color-red-700: 0 84% 30%;
-        --color-red-800: 0 84% 20%;
-        --color-red-900: 0 84% 10%;
-
-        --color-orange-50: 25 95% 95%;
-        --color-orange-100: 25 95% 88%;
-        --color-orange-200: 25 95% 76%;
-        --color-orange-300: 25 95% 70%;
-        --color-orange-400: 25 95% 65%;
-        --color-orange-500: 25 95% 58%;
-        --color-orange-600: 25 95% 43%;
-        --color-orange-700: 25 95% 30%;
-        --color-orange-800: 25 95% 20%;
-        --color-orange-900: 25 95% 10%;
-
-        --color-yellow-50: 45 93% 95%;
-        --color-yellow-100: 45 93% 88%;
-        --color-yellow-200: 45 93% 76%;
-        --color-yellow-300: 45 93% 70%;
-        --color-yellow-400: 45 93% 65%;
-        --color-yellow-500: 45 93% 58%;
-        --color-yellow-600: 45 93% 43%;
-        --color-yellow-700: 45 93% 30%;
-        --color-yellow-800: 45 93% 20%;
-        --color-yellow-900: 45 93% 10%;
-
-        --color-gray-25: 217 21% 98%;
-        --color-gray-50: 217 21% 95%;
-        --color-gray-100: 217 21% 88%;
-        --color-gray-200: 217 21% 76%;
-        --color-gray-300: 217 21% 70%;
-        --color-gray-400: 217 21% 65%;
-        --color-gray-500: 217 21% 58%;
-        --color-gray-600: 217 21% 43%;
-        --color-gray-700: 217 21% 30%;
-        --color-gray-800: 217 21% 20%;
-        --color-gray-900: 217 21% 10%;
-
-        /* Border Radius */
-
-        --border-radius-sm: 0.125rem;
-        --border-radius: 0.25rem;
-        --border-radius-md: 0.375rem;
-        --border-radius-lg: 0.5rem;
-    }
-
-    [data-theme="dark"] {
-        --color-green-900: 160 84% 95%;
-        --color-green-800: 160 84% 88%;
-        --color-green-700: 160 84% 76%;
-        --color-green-600: 160 84% 70%;
-        --color-green-500: 160 84% 60%;
-        --color-green-400: 160 84% 50%;
-        --color-green-300: 160 84% 38%;
-        --color-green-200: 160 84% 30%;
-        --color-green-100: 160 84% 20%;
-        --color-green-50: 160 84% 10%;
-
-        --color-blue-900: 217 91% 95%;
-        --color-blue-800: 217 91% 88%;
-        --color-blue-700: 217 91% 76%;
-        --color-blue-600: 217 91% 70%;
-        --color-blue-500: 217 91% 65%;
-        --color-blue-400: 217 91% 58%;
-        --color-blue-300: 217 91% 43%;
-        --color-blue-200: 217 91% 30%;
-        --color-blue-100: 217 91% 20%;
-        --color-blue-50: 217 91% 10%;
-
-        --color-pink-900: 292 84% 95%;
-        --color-pink-800: 292 84% 88%;
-        --color-pink-700: 292 84% 76%;
-        --color-pink-600: 292 84% 70%;
-        --color-pink-500: 292 84% 65%;
-        --color-pink-400: 292 84% 58%;
-        --color-pink-300: 292 84% 43%;
-        --color-pink-200: 292 84% 30%;
-        --color-pink-100: 292 84% 20%;
-        --color-pink-50: 292 84% 10%;
-
-        --color-violet-900: 258 90% 95%;
-        --color-violet-800: 258 90% 88%;
-        --color-violet-700: 258 90% 79%;
-        --color-violet-600: 258 90% 74%;
-        --color-violet-500: 258 90% 70%;
-        --color-violet-400: 258 90% 58%;
-        --color-violet-300: 258 90% 43%;
-        --color-violet-200: 258 90% 30%;
-        --color-violet-100: 258 90% 20%;
-        --color-violet-50: 258 90% 10%;
-
-        --color-red-900: 0 84% 95%;
-        --color-red-800: 0 84% 88%;
-        --color-red-700: 0 84% 76%;
-        --color-red-600: 0 84% 70%;
-        --color-red-500: 0 84% 65%;
-        --color-red-400: 0 84% 58%;
-        --color-red-300: 0 84% 43%;
-        --color-red-200: 0 84% 30%;
-        --color-red-100: 0 84% 20%;
-        --color-red-50: 0 84% 10%;
-
-        --color-orange-900: 25 95% 95%;
-        --color-orange-800: 25 95% 88%;
-        --color-orange-700: 25 95% 76%;
-        --color-orange-600: 25 95% 70%;
-        --color-orange-500: 25 95% 65%;
-        --color-orange-400: 25 95% 58%;
-        --color-orange-300: 25 95% 43%;
-        --color-orange-200: 25 95% 30%;
-        --color-orange-100: 25 95% 20%;
-        --color-orange-50: 25 95% 10%;
-
-        --color-yellow-900: 45 93% 95%;
-        --color-yellow-800: 45 93% 88%;
-        --color-yellow-700: 45 93% 76%;
-        --color-yellow-600: 45 93% 70%;
-        --color-yellow-500: 45 93% 65%;
-        --color-yellow-400: 45 93% 58%;
-        --color-yellow-300: 45 93% 43%;
-        --color-yellow-200: 45 93% 30%;
-        --color-yellow-100: 45 93% 20%;
-        --color-yellow-50: 45 93% 10%;
-
-        --color-gray-900: 217 21% 95%;
-        --color-gray-800: 217 21% 88%;
-        --color-gray-700: 217 21% 76%;
-        --color-gray-600: 217 21% 70%;
-        --color-gray-500: 217 21% 65%;
-        --color-gray-400: 217 21% 58%;
-        --color-gray-300: 217 21% 43%;
-        --color-gray-200: 217 21% 30%;
-        --color-gray-100: 217 21% 25%;
-        --color-gray-50: 217 21% 15%;
-        --color-gray-25: 217 21% 10%;
     }
 }
diff --git a/src-web/main.tsx b/src-web/main.tsx
index d6c36bf9..bd3e0401 100644
--- a/src-web/main.tsx
+++ b/src-web/main.tsx
@@ -1,7 +1,6 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { listen } from '@tauri-apps/api/event';
 import { MotionConfig } from 'framer-motion';
-import init, { greet } from 'hello';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import { HelmetProvider } from 'react-helmet-async';
@@ -21,8 +20,8 @@ import { Workspaces } from './pages/Workspaces';
 setAppearance();
 
 // WASM stuff
-await init();
-greet();
+// await init();
+// greet();
 
 const queryClient = new QueryClient();
 
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index 9dd0f725..27237f61 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -3,12 +3,13 @@ module.exports = {
   darkMode: ["class", "[data-appearance=\"dark\"]"],
   content: [
     "./index.html",
-    "./src-web/**/*.{html,tsx}"
+    "./src-web/**/*.{html,js,jsx,ts,tsx}"
   ],
   theme: {
     extend: {},
     fontFamily: {
-      "mono": ["JetBrains Mono", "Menlo", "monospace"]
+      "mono": ["JetBrains Mono", "Menlo", "monospace"],
+      "sans": ["Inter", "sans-serif"],
     },
     fontSize: {
       sm: "0.9rem",
@@ -19,19 +20,10 @@ module.exports = {
       "4xl": "2.441rem",
       "5xl": "3.052rem"
     },
-    borderRadius: {
-      none: "0px",
-      sm: "var(--border-radius-sm)",
-      DEFAULT: "var(--border-radius)",
-      md: "var(--border-radius-md)",
-      lg: "var(--border-radius-lg)",
-      full: "9999px"
-    },
     colors: {
       transparent: "transparent",
       white: "hsl(0 100% 100% / <alpha-value>)",
       black: "hsl(0 100% 0% / <alpha-value>)",
-      background: "hsl(var(--color-background) / <alpha-value>)",
       placeholder: "hsl(var(--color-gray-400) / <alpha-value>)",
       red: color("red"),
       orange: color("orange"),