From 2021431e2f553c02c3b35369ceb9e328cbf91ab6 Mon Sep 17 00:00:00 2001
From: Lucy <12953208+elvece@users.noreply.github.com>
Date: Thu, 21 Mar 2024 14:23:28 -0400
Subject: [PATCH] Update/marketplace (#2575)

* make category link generic

* fix ai category display and svg icons

* fix markdown display and ansi module; cleanup

* convert tailwindcss to scss in marketplace menu component

* convert tailwindcss to scss in marketplace categories component

* convert tailwindcss to scss in marketplace item component

* update launch icon to taiga icon

* convert tailwindcss to scss in marketplace search component + cleanup

* convert tailwindcss to scss in marketplace release notes component + cleanup

* convert tailwindcss to scss in marketplace about component + cleanup

* convert tailwindcss to scss in marketplace additional component

* convert tailwindcss to scss in marketplace dependencies component + misc style fixes

* convert tailwindcss to scss in marketplace hero component + misc style fixes

* convert tailwindcss to scss in marketplace screenshots component

* convert tailwindcss to scss in portal marketplace components

* remove the rest of tailwindscss and fix reset styles

* bump shared and marketplace package versions

* misc style + build fixes

* sync package lock

* fix markdown + cleanup

* fix markdown margins and git hash size

* fix mobile zindex for hero and mobile changing categories routing link
---
 web/package-lock.json                         | 720 +++++++-----------
 web/package.json                              |   1 -
 web/projects/marketplace/package.json         |   3 +-
 .../src/components/menu/menu.component.html   | 139 ++--
 .../components/menu/menu.component.module.ts  |   3 +
 .../src/components/menu/menu.component.scss   | 218 +++++-
 .../list/categories/categories.component.html |  21 +-
 .../list/categories/categories.component.scss |  47 +-
 .../list/categories/categories.component.ts   |  26 +-
 .../list/categories/categories.module.ts      |   4 +-
 .../src/pages/list/item/item.component.html   |  26 +-
 .../src/pages/list/item/item.component.scss   |  91 +++
 .../src/pages/list/item/item.component.ts     |   1 +
 .../src/pages/list/item/item.module.ts        |   3 +-
 .../pages/list/search/search.component.html   |  29 +-
 .../pages/list/search/search.component.scss   |  32 +
 .../src/pages/list/search/search.module.ts    |   3 +-
 .../release-notes.component.html              |  31 +-
 .../release-notes.component.scss              |  66 ++
 .../src/pages/show/about/about.component.html |  14 +-
 .../src/pages/show/about/about.component.scss |  31 +
 .../additional-link.component.html            |  10 +-
 .../additional-link.component.module.ts       |   4 +-
 .../additional-link.component.scss            |  13 +
 .../show/additional/additional.component.html | 120 ++-
 .../show/additional/additional.component.scss |  56 ++
 .../show/additional/additional.module.ts      |   3 +-
 .../dependencies/dependencies.component.html  |  21 +-
 .../dependencies/dependencies.component.scss  |  73 ++
 .../src/pages/show/hero/hero.component.ts     | 129 +++-
 .../show/screenshots/screenshots.component.ts |  74 +-
 web/projects/marketplace/tailwind.config.js   |  11 -
 web/projects/shared/package.json              |   2 +-
 .../initializing/initializing.component.ts    |   4 +-
 .../markdown/markdown.component.scss          |  11 +
 web/projects/shared/src/util/convert-ansi.ts  |   2 +-
 web/projects/shared/styles/shared.scss        |  74 +-
 web/projects/shared/styles/variables.scss     |  51 +-
 .../components/controls.component.ts          |   1 -
 .../marketplace/components/menu.component.ts  |  21 +-
 .../components/notification.component.ts      |  13 +-
 .../marketplace/components/tile.component.ts  |  25 +-
 .../marketplace/marketplace.component.ts      | 108 ++-
 .../marketplace/modals/preview.component.ts   |  73 +-
 .../ui/src/app/services/api/api.fixures.ts    |   2 +-
 .../services/api/embassy-mock-api.service.ts  |   7 +-
 web/projects/ui/src/styles.scss               |   3 -
 web/projects/ui/tailwind.config.js            |  25 -
 48 files changed, 1606 insertions(+), 839 deletions(-)
 create mode 100644 web/projects/marketplace/src/pages/list/item/item.component.scss
 delete mode 100644 web/projects/marketplace/tailwind.config.js
 delete mode 100644 web/projects/ui/tailwind.config.js

diff --git a/web/package-lock.json b/web/package-lock.json
index b21618108..f2c372b95 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -56,7 +56,6 @@
         "pbkdf2": "^3.1.2",
         "rxjs": "^7.5.6",
         "swiper": "^8.2.4",
-        "tailwindcss": "^3.3.3",
         "ts-matches": "^5.2.1",
         "tslib": "^2.3.0",
         "uuid": "^8.3.2",
@@ -113,16 +112,24 @@
         "rxjs": ">=7.0.0"
       }
     },
-    "../sdk/dist": {},
-    "node_modules/@alloc/quick-lru": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
-      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
-      "engines": {
-        "node": ">=10"
+    "../sdk/dist": {
+      "name": "@start9labs/start-sdk",
+      "version": "0.4.0-rev0.lib0.rc8.beta10",
+      "license": "MIT",
+      "dependencies": {
+        "@iarna/toml": "^2.2.5",
+        "isomorphic-fetch": "^3.0.0",
+        "ts-matches": "^5.4.1",
+        "yaml": "^2.2.2"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+      "devDependencies": {
+        "@types/jest": "^29.4.0",
+        "jest": "^29.4.3",
+        "prettier": "^3.2.5",
+        "ts-jest": "^29.0.5",
+        "ts-node": "^10.9.1",
+        "tsx": "^4.7.1",
+        "typescript": "^5.0.4"
       }
     },
     "node_modules/@ampproject/remapping": {
@@ -139,12 +146,12 @@
       }
     },
     "node_modules/@angular-devkit/architect": {
-      "version": "0.1703.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1703.0.tgz",
-      "integrity": "sha512-2X2cswI4TIwtQxCe5U9f4jeiDjAb8r89XLpU0QwEHyZyWx02uhYHO3FDMJq/NxCS95IUAQOBGBhbD4ey4Hl9cQ==",
+      "version": "0.1703.1",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1703.1.tgz",
+      "integrity": "sha512-vkfvURv7O+3fHMTE9K+yUEiFS0v4JNYKsDP0LE1ChH5Ocy0bJXGcH2Cyz2W8qdJGDG/tKe41VzvOLpu88Xv3zQ==",
       "devOptional": true,
       "dependencies": {
-        "@angular-devkit/core": "17.3.0",
+        "@angular-devkit/core": "17.3.1",
         "rxjs": "7.8.1"
       },
       "engines": {
@@ -154,15 +161,15 @@
       }
     },
     "node_modules/@angular-devkit/build-angular": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-17.3.0.tgz",
-      "integrity": "sha512-mC70mZK/liITM4VlGL6hmYPkVsZwAb+X3TxwodBl/g8p/sYijDhK/4QJHzmcHTxLYQQS6nS5CUcr9ARQFkGN2w==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-17.3.1.tgz",
+      "integrity": "sha512-e+hZvLVH5AvHCFbVtKRd5oJeFsEmjg7kK1V6hsVxH4YE2f2x399TSr+AGxwV+R3jnjZ67ujIeXXd0Uuf1RwcSg==",
       "dev": true,
       "dependencies": {
         "@ampproject/remapping": "2.3.0",
-        "@angular-devkit/architect": "0.1703.0",
-        "@angular-devkit/build-webpack": "0.1703.0",
-        "@angular-devkit/core": "17.3.0",
+        "@angular-devkit/architect": "0.1703.1",
+        "@angular-devkit/build-webpack": "0.1703.1",
+        "@angular-devkit/core": "17.3.1",
         "@babel/core": "7.24.0",
         "@babel/generator": "7.23.6",
         "@babel/helper-annotate-as-pure": "7.22.5",
@@ -173,7 +180,7 @@
         "@babel/preset-env": "7.24.0",
         "@babel/runtime": "7.24.0",
         "@discoveryjs/json-ext": "0.5.7",
-        "@ngtools/webpack": "17.3.0",
+        "@ngtools/webpack": "17.3.1",
         "@vitejs/plugin-basic-ssl": "1.1.0",
         "ansi-colors": "4.1.3",
         "autoprefixer": "10.4.18",
@@ -313,6 +320,43 @@
         "ajv": "^6.9.1"
       }
     },
+    "node_modules/@angular-devkit/build-angular/node_modules/autoprefixer": {
+      "version": "10.4.18",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.18.tgz",
+      "integrity": "sha512-1DKbDfsr6KUElM6wg+0zRNkB/Q7WcKYAaK+pzXn+Xqmszm/5Xa9coeNdtP88Vi+dPzZnMjhge8GIV49ZQkDa+g==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/autoprefixer"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "dependencies": {
+        "browserslist": "^4.23.0",
+        "caniuse-lite": "^1.0.30001591",
+        "fraction.js": "^4.3.7",
+        "normalize-range": "^0.1.2",
+        "picocolors": "^1.0.0",
+        "postcss-value-parser": "^4.2.0"
+      },
+      "bin": {
+        "autoprefixer": "bin/autoprefixer"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
     "node_modules/@angular-devkit/build-angular/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",
@@ -419,12 +463,12 @@
       }
     },
     "node_modules/@angular-devkit/build-webpack": {
-      "version": "0.1703.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1703.0.tgz",
-      "integrity": "sha512-IEaLzV5lolURJhMKM4naW6pYTDjI5E8I+97o/kbSa0yakvGOBwg7yRmfc54T1M0Z4nmifPsj4OVRGhBaa6dgXA==",
+      "version": "0.1703.1",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1703.1.tgz",
+      "integrity": "sha512-nVUzewX8RCzaEPQZ1JQpE42wpsYchKQwfXUSCkoUsuCMB2c6zuEz0Jt94nzJg3UjSEEV4ZqCH8v5MDOvB49Rlw==",
       "dev": true,
       "dependencies": {
-        "@angular-devkit/architect": "0.1703.0",
+        "@angular-devkit/architect": "0.1703.1",
         "rxjs": "7.8.1"
       },
       "engines": {
@@ -438,9 +482,9 @@
       }
     },
     "node_modules/@angular-devkit/core": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-17.3.0.tgz",
-      "integrity": "sha512-ldErhMYq8rcFOhWQ0syQdLy6IYb/LL0erigj7gCMOf59oJgM7B13o/ZTOCvyJttUZ9IP0HB98Gi3epEuJ30VLg==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-17.3.1.tgz",
+      "integrity": "sha512-EP7zwqBEaOPuBJwzKmh2abfgNFITGX178BOyTG6zTymeMzEbrvy2OdeQXSslkJ/RGLCpx60GT+0CFW7wGlQR6Q==",
       "dependencies": {
         "ajv": "8.12.0",
         "ajv-formats": "2.1.1",
@@ -464,11 +508,11 @@
       }
     },
     "node_modules/@angular-devkit/schematics": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-17.3.0.tgz",
-      "integrity": "sha512-EW4Y8W/KTlvvT2fw3bh9hY7quDF2b9EaF+KftEqoDRWYbw0tlF8hWIdlfA6JxQC12d6uefh3kDNj5am0Il2oNQ==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-17.3.1.tgz",
+      "integrity": "sha512-c3tp5zC5zp6XpK9w8wJf3d4Dyw9BNbmg/VEoXtePGivp4hzks6zuMAFknNRwdK7roOlH0HyM5No4WUZHBFpOmw==",
       "dependencies": {
-        "@angular-devkit/core": "17.3.0",
+        "@angular-devkit/core": "17.3.1",
         "jsonc-parser": "3.2.1",
         "magic-string": "0.30.8",
         "ora": "5.4.1",
@@ -481,9 +525,9 @@
       }
     },
     "node_modules/@angular/animations": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-17.3.0.tgz",
-      "integrity": "sha512-H7R3c2E479CPpaX6bU84F8u4JV+IFEfM8BUOgrbcI9tF16m6C2eJbl8IqNuW0yADuTarRSlOT7TW0qyrmcxhRw==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-17.3.1.tgz",
+      "integrity": "sha512-2TZ0M5J0IizhHpb404DeqArlv8Ki9BFz5ZUuET2uFROpKW8IMDCht8fSrn/DKHpjB9lvzPUhNFaRxNWEY6klnA==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -491,13 +535,13 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/core": "17.3.0"
+        "@angular/core": "17.3.1"
       }
     },
     "node_modules/@angular/cdk": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-17.3.0.tgz",
-      "integrity": "sha512-/RIEzP7D3wCGgk2FEvSWTvcKMa+4L7djMF6ZnOKqU6CiJLX3Ksr3+RXqXuiVkdVZBoRXEWRofS/DYEai+nIW8A==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-17.3.1.tgz",
+      "integrity": "sha512-pHSN+KlCmdo2u9jY7Yxsry/ZK+EcjOYGzdwxXxcKragMzm7etY3BJiTl4N+qZRuV6cJlMj2PRkij8ABi/HQdEA==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -511,15 +555,15 @@
       }
     },
     "node_modules/@angular/cli": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-17.3.0.tgz",
-      "integrity": "sha512-xwxlimNP4MECkdzjc0+m7lGxighcH0ncAfEo9yUo+r+4EFalB/Q7DAQPIU1xkbBk8iJwcFhGFAnS1IeLur15kQ==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-17.3.1.tgz",
+      "integrity": "sha512-IVnnbRi53BZvZ3LE0PCfFefoB2uHlO1sHtilZf/xCpdV4E1Mkz0/hHln5CRHwAXErdSiY57VoMsF5tffxAfaBQ==",
       "devOptional": true,
       "dependencies": {
-        "@angular-devkit/architect": "0.1703.0",
-        "@angular-devkit/core": "17.3.0",
-        "@angular-devkit/schematics": "17.3.0",
-        "@schematics/angular": "17.3.0",
+        "@angular-devkit/architect": "0.1703.1",
+        "@angular-devkit/core": "17.3.1",
+        "@angular-devkit/schematics": "17.3.1",
+        "@schematics/angular": "17.3.1",
         "@yarnpkg/lockfile": "1.1.0",
         "ansi-colors": "4.1.3",
         "ini": "4.1.2",
@@ -545,9 +589,9 @@
       }
     },
     "node_modules/@angular/common": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/common/-/common-17.3.0.tgz",
-      "integrity": "sha512-JnS6jbLl2RxsvGFUOBGeoyviNLEjZKRhn3uK4Ein3DENPv0BeSFMjif9Dp4ReUCnqoD4QQVG0X/r1GFaqHn2pw==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/common/-/common-17.3.1.tgz",
+      "integrity": "sha512-HyUTJ4RxhE3bOmFRV6Fv2y01ixbrUb8Hd4MxPm8REbNMGKsWCfXhR3FfxFL18Sc03SAF+o0Md0wwekjFKTNKfQ==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -555,14 +599,14 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/core": "17.3.0",
+        "@angular/core": "17.3.1",
         "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
     "node_modules/@angular/compiler": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-17.3.0.tgz",
-      "integrity": "sha512-lZBD5mFq7SzFJydZwW2jvnQGmtcU1s3e548hl4MSZpRgt13m5UmBQKbyMOvVN2WxKvWKlmDlywsAJlMSXepYig==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-17.3.1.tgz",
+      "integrity": "sha512-8qqlWPGZEyD2FY5losOW3Aocro+lFysPDzsf0LHgQUM6Ub1b+pq4jUOjH6w0vzaxG3TfxkgzOQ9aNdWtSV67Rg==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -570,7 +614,7 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/core": "17.3.0"
+        "@angular/core": "17.3.1"
       },
       "peerDependenciesMeta": {
         "@angular/core": {
@@ -579,9 +623,9 @@
       }
     },
     "node_modules/@angular/compiler-cli": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-17.3.0.tgz",
-      "integrity": "sha512-ewo+pb0QUC69Ey15z4vPteoBeO81HitqplysOoeXbyVBjMnKmZl3343wx7ukgcI97lmj4d38d1r4AnIoO5n/Vw==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-17.3.1.tgz",
+      "integrity": "sha512-xLV9KU+zOpe57/2rQ59ku21EaStNpLSlR9+qkDYf8JR09fB+W9vY3UYbpi5RjHxAFIZBM5D9SFQjjll8rch26g==",
       "dev": true,
       "dependencies": {
         "@babel/core": "7.23.9",
@@ -602,7 +646,7 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/compiler": "17.3.0",
+        "@angular/compiler": "17.3.1",
         "typescript": ">=5.2 <5.5"
       }
     },
@@ -652,9 +696,9 @@
       }
     },
     "node_modules/@angular/core": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/core/-/core-17.3.0.tgz",
-      "integrity": "sha512-umwsNFl/wEMTCUVvNl5iieEgHA+ESxSMcjedZGFWNGnpUxKTgYFYNG41/1wNZfPrS0+uRPHuYU9IHD+NR2s/Rw==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/core/-/core-17.3.1.tgz",
+      "integrity": "sha512-Qf3/sgkXS1LHwOTtqAVYprySrn0YpPIZqerPc0tK+hyQfwAz5BQlpcBhbH8RWKlfCY8eO0cqo/j0+e8DQOgYfg==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -667,9 +711,9 @@
       }
     },
     "node_modules/@angular/forms": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-17.3.0.tgz",
-      "integrity": "sha512-TnLOake1fQCmmGEOZbTjP2gbKerZ/bfEMuiFfoe7R2rUvKl4xHGAHp99bqf7bUyAbB8ZgmPZc9/VHrrts8UNyA==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-17.3.1.tgz",
+      "integrity": "sha512-HndsO90k67sFHzd+sII+rhAUksffBvquFuAUCc6QR9WVjILxVg2fY7oBidgS1gKNqu0mptPG0GvuORnaW/0gSg==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -677,25 +721,25 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/common": "17.3.0",
-        "@angular/core": "17.3.0",
-        "@angular/platform-browser": "17.3.0",
+        "@angular/common": "17.3.1",
+        "@angular/core": "17.3.1",
+        "@angular/platform-browser": "17.3.1",
         "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
     "node_modules/@angular/language-service": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-17.3.0.tgz",
-      "integrity": "sha512-h4bwuyeAmZkoeCM/KvhWW+p2xjKiVt4GfSWZsIuW5ilfJt7hmkUFGyu0ABCjt6fiNQRrS2tvBZdXxk+A+zX8KQ==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-17.3.1.tgz",
+      "integrity": "sha512-awC+KHwIRXZ7biQz0Q7q+UZuuyeWHcxjxyQtvv0n1jwwyRpUo8WAXcduKRxl/wMOrxfZkB/tpGcd1/Eeql9CCw==",
       "dev": true,
       "engines": {
         "node": "^18.13.0 || >=20.9.0"
       }
     },
     "node_modules/@angular/platform-browser": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-17.3.0.tgz",
-      "integrity": "sha512-sIquvbq04KMOdpk1VdVFt7kVhOk/Rk+hI3M4raarMK5EbZ16nLYzpqjc2OZetUpKy6LB/FemClgNUShj9NlrqA==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-17.3.1.tgz",
+      "integrity": "sha512-8ABAL8PElSGzkIparVwifsU0NSu0DdqnWYw9YvLhhZQ6lOuWbG+dTUo/DXzmWhA6ezQWJGNakEZPJJytFIIy+A==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -703,9 +747,9 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/animations": "17.3.0",
-        "@angular/common": "17.3.0",
-        "@angular/core": "17.3.0"
+        "@angular/animations": "17.3.1",
+        "@angular/common": "17.3.1",
+        "@angular/core": "17.3.1"
       },
       "peerDependenciesMeta": {
         "@angular/animations": {
@@ -714,9 +758,9 @@
       }
     },
     "node_modules/@angular/platform-browser-dynamic": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-17.3.0.tgz",
-      "integrity": "sha512-oX5AG0aSjmB89SyJZGyabr6uwfWd7yJM+krcrzHxFbVhvDCwdi9G+B0ADmaUn1shaXDseOFiLpo3R/oagd2fTA==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-17.3.1.tgz",
+      "integrity": "sha512-ACW/npNaDxUNQtEomjjv/KIBY8jHEinePff5qosnAxLE0IpA4qE9eDp36zG35xoJqrPJPYjXbZCBRqqrzM7U7Q==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -724,19 +768,19 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/common": "17.3.0",
-        "@angular/compiler": "17.3.0",
-        "@angular/core": "17.3.0",
-        "@angular/platform-browser": "17.3.0"
+        "@angular/common": "17.3.1",
+        "@angular/compiler": "17.3.1",
+        "@angular/core": "17.3.1",
+        "@angular/platform-browser": "17.3.1"
       }
     },
     "node_modules/@angular/pwa": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/pwa/-/pwa-17.3.0.tgz",
-      "integrity": "sha512-rksOM2ii0nrjZd92RmksVIx94iSdd62yzXu7Jiyi5/0Az+lY2nVU+IxVmPr1lNomWG2DsK5VK+FOPhur6JZjaQ==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/pwa/-/pwa-17.3.1.tgz",
+      "integrity": "sha512-3GbhNoYRdZyuhqySjE613KxAe9ha/jowuMhXQ5EUOuhP7arIxBuo8frKoIneRSQhqMZbGRgzF4md806lujeSTQ==",
       "dependencies": {
-        "@angular-devkit/schematics": "17.3.0",
-        "@schematics/angular": "17.3.0",
+        "@angular-devkit/schematics": "17.3.1",
+        "@schematics/angular": "17.3.1",
         "parse5-html-rewriting-stream": "7.0.0"
       },
       "engines": {
@@ -754,9 +798,9 @@
       }
     },
     "node_modules/@angular/router": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/router/-/router-17.3.0.tgz",
-      "integrity": "sha512-OBMAfjaSfEdEYqfYsAemDvknYZV69ABFf06hhduNLhB5QgbPrZCbNptnlrCPx4YDrzcANj2hrcyAmAVNTk8Giw==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/router/-/router-17.3.1.tgz",
+      "integrity": "sha512-H6H7lY9i5Ppu0SFwwpeWqJbCFw8cILOj8Rd1+AGoCN5m3ivPtjD2Ltz62PI2zZkqx+WhQdk19l61Wm3oRqg70A==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -764,16 +808,16 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/common": "17.3.0",
-        "@angular/core": "17.3.0",
-        "@angular/platform-browser": "17.3.0",
+        "@angular/common": "17.3.1",
+        "@angular/core": "17.3.1",
+        "@angular/platform-browser": "17.3.1",
         "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
     "node_modules/@angular/service-worker": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@angular/service-worker/-/service-worker-17.3.0.tgz",
-      "integrity": "sha512-kpwuK3aaUrVm1T2YS4Vq7IFBAEW3H83Xyl9KVSpRbdUOEAJjG9hgiPBVz/iu0W1j0T9JkS2GJt/3vP3OW5Tkhg==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@angular/service-worker/-/service-worker-17.3.1.tgz",
+      "integrity": "sha512-hXTlsOc8MCXimrl7XkJ5wscZ5ETI5F5AgRK1WsBrmKfM2uppcY5hzJDPcDlZgec40wb2WfLEdzzkipZFp2tr1Q==",
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -784,8 +828,8 @@
         "node": "^18.13.0 || >=20.9.0"
       },
       "peerDependencies": {
-        "@angular/common": "17.3.0",
-        "@angular/core": "17.3.0"
+        "@angular/common": "17.3.1",
+        "@angular/core": "17.3.1"
       }
     },
     "node_modules/@babel/code-frame": {
@@ -2541,7 +2585,7 @@
       "version": "0.8.1",
       "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz",
       "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
-      "devOptional": true,
+      "dev": true,
       "dependencies": {
         "@jridgewell/trace-mapping": "0.3.9"
       },
@@ -2553,7 +2597,7 @@
       "version": "0.3.9",
       "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz",
       "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==",
-      "devOptional": true,
+      "dev": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.0.3",
         "@jridgewell/sourcemap-codec": "^1.4.10"
@@ -3478,6 +3522,7 @@
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
       "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+      "devOptional": true,
       "dependencies": {
         "string-width": "^5.1.2",
         "string-width-cjs": "npm:string-width@^4.2.0",
@@ -3494,6 +3539,7 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
       "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
+      "devOptional": true,
       "engines": {
         "node": ">=12"
       },
@@ -3505,6 +3551,7 @@
       "version": "6.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
       "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+      "devOptional": true,
       "engines": {
         "node": ">=12"
       },
@@ -3515,12 +3562,14 @@
     "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
       "version": "9.2.2",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
-      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg=="
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "devOptional": true
     },
     "node_modules/@isaacs/cliui/node_modules/string-width": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
       "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "devOptional": true,
       "dependencies": {
         "eastasianwidth": "^0.2.0",
         "emoji-regex": "^9.2.2",
@@ -3537,6 +3586,7 @@
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
       "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "devOptional": true,
       "dependencies": {
         "ansi-regex": "^6.0.1"
       },
@@ -3551,6 +3601,7 @@
       "version": "8.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
       "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "devOptional": true,
       "dependencies": {
         "ansi-styles": "^6.1.0",
         "string-width": "^5.0.1",
@@ -3620,6 +3671,7 @@
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
       "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
+      "dev": true,
       "dependencies": {
         "@jridgewell/set-array": "^1.2.1",
         "@jridgewell/sourcemap-codec": "^1.4.10",
@@ -3633,6 +3685,7 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
       "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
@@ -3641,6 +3694,7 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
       "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
+      "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
@@ -3664,6 +3718,7 @@
       "version": "0.3.25",
       "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
       "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
+      "dev": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
         "@jridgewell/sourcemap-codec": "^1.4.14"
@@ -3777,9 +3832,9 @@
       }
     },
     "node_modules/@ngtools/webpack": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-17.3.0.tgz",
-      "integrity": "sha512-wNTCDPPEtjP4mxYerLVLCMwOCTEOD2HqZMVXD8pJbarrGPMuoyglUZuqNSIS5KVqR+fFez6JEUnMvC3QSqf58w==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-17.3.1.tgz",
+      "integrity": "sha512-6qRYFN6DqogZK0ZFrSlhg1OsIWm3lL3m+/Ixoj6/MLLjDBrTtHqmI93vg6P1EKYTH4fWChL7jtv7iS/LSZubgw==",
       "dev": true,
       "engines": {
         "node": "^18.13.0 || >=20.9.0",
@@ -3796,6 +3851,7 @@
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
       "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
+      "devOptional": true,
       "dependencies": {
         "@nodelib/fs.stat": "2.0.5",
         "run-parallel": "^1.1.9"
@@ -3808,6 +3864,7 @@
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
       "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
+      "devOptional": true,
       "engines": {
         "node": ">= 8"
       }
@@ -3816,6 +3873,7 @@
       "version": "1.2.8",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
       "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
+      "devOptional": true,
       "dependencies": {
         "@nodelib/fs.scandir": "2.1.5",
         "fastq": "^1.6.0"
@@ -4036,6 +4094,7 @@
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
       "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+      "dev": true,
       "optional": true,
       "engines": {
         "node": ">=14"
@@ -4327,12 +4386,12 @@
       "dev": true
     },
     "node_modules/@schematics/angular": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-17.3.0.tgz",
-      "integrity": "sha512-QqugP4Uyxk966VaUb/Jk5LQ5rE1BV4v2TmniPZtN3GZ6MDkpvPnFvlysvoq6y+7uiRhCLiT1DsBIwc9vXz3vWA==",
+      "version": "17.3.1",
+      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-17.3.1.tgz",
+      "integrity": "sha512-B3TkpjDjZhxX+tUc2ySEHU33x82Da0sssq/EMqQ1PQBHeRMa0ecyCeExjFEs2y57ZuC+QeVTaUt+TW45lLSjQw==",
       "dependencies": {
-        "@angular-devkit/core": "17.3.0",
-        "@angular-devkit/schematics": "17.3.0",
+        "@angular-devkit/core": "17.3.1",
+        "@angular-devkit/schematics": "17.3.1",
         "jsonc-parser": "3.2.1"
       },
       "engines": {
@@ -4708,25 +4767,25 @@
       "version": "1.0.9",
       "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz",
       "integrity": "sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/@tsconfig/node12": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz",
       "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/@tsconfig/node14": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz",
       "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/@tsconfig/node16": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz",
       "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/@tufjs/canonical-json": {
       "version": "2.0.0",
@@ -4915,7 +4974,7 @@
       "version": "18.19.26",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.26.tgz",
       "integrity": "sha512-+wiMJsIwLOYCvUqSdKTrfkS8mpTp+MPINe6+Np4TAGFWWRWiBQ5kSq9nZGCSPkzx9mvT+uEukzpX4MOSCydcvw==",
-      "devOptional": true,
+      "dev": true,
       "dependencies": {
         "undici-types": "~5.26.4"
       }
@@ -5244,7 +5303,7 @@
       "version": "8.11.3",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
       "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
-      "devOptional": true,
+      "dev": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -5265,7 +5324,7 @@
       "version": "8.3.2",
       "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz",
       "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==",
-      "devOptional": true,
+      "dev": true,
       "engines": {
         "node": ">=0.4.0"
       }
@@ -5435,15 +5494,11 @@
         "node": ">=8.0.0"
       }
     },
-    "node_modules/any-promise": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A=="
-    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
       "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "devOptional": true,
       "dependencies": {
         "normalize-path": "^3.0.0",
         "picomatch": "^2.0.4"
@@ -5456,6 +5511,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "devOptional": true,
       "engines": {
         "node": ">=8.6"
       },
@@ -5464,9 +5520,10 @@
       }
     },
     "node_modules/arg": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
-      "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg=="
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
+      "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
+      "dev": true
     },
     "node_modules/argparse": {
       "version": "2.0.1",
@@ -5543,9 +5600,9 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.4.18",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.18.tgz",
-      "integrity": "sha512-1DKbDfsr6KUElM6wg+0zRNkB/Q7WcKYAaK+pzXn+Xqmszm/5Xa9coeNdtP88Vi+dPzZnMjhge8GIV49ZQkDa+g==",
+      "version": "10.4.19",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.19.tgz",
+      "integrity": "sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==",
       "dev": true,
       "funding": [
         {
@@ -5563,7 +5620,7 @@
       ],
       "dependencies": {
         "browserslist": "^4.23.0",
-        "caniuse-lite": "^1.0.30001591",
+        "caniuse-lite": "^1.0.30001599",
         "fraction.js": "^4.3.7",
         "normalize-range": "^0.1.2",
         "picocolors": "^1.0.0",
@@ -5695,7 +5752,8 @@
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+      "devOptional": true
     },
     "node_modules/base64-js": {
       "version": "1.5.1",
@@ -5743,6 +5801,7 @@
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
       "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+      "devOptional": true,
       "engines": {
         "node": ">=8"
       },
@@ -5857,6 +5916,7 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
       "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "devOptional": true,
       "dependencies": {
         "balanced-match": "^1.0.0"
       }
@@ -5865,6 +5925,7 @@
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
       "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+      "devOptional": true,
       "dependencies": {
         "fill-range": "^7.0.1"
       },
@@ -6031,14 +6092,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/camelcase-css": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
-      "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001599",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001599.tgz",
@@ -6097,6 +6150,7 @@
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
       "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
+      "devOptional": true,
       "dependencies": {
         "anymatch": "~3.1.2",
         "braces": "~3.0.2",
@@ -6663,7 +6717,7 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
       "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/critters": {
       "version": "0.0.22",
@@ -6771,6 +6825,7 @@
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
       "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
+      "devOptional": true,
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -6847,6 +6902,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"
       },
@@ -7105,16 +7161,11 @@
       "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==",
       "dev": true
     },
-    "node_modules/didyoumean": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
-      "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw=="
-    },
     "node_modules/diff": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
       "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
-      "devOptional": true,
+      "dev": true,
       "engines": {
         "node": ">=0.3.1"
       }
@@ -7136,11 +7187,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/dlv": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
-      "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
-    },
     "node_modules/dns-packet": {
       "version": "5.6.1",
       "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
@@ -7215,9 +7261,9 @@
       }
     },
     "node_modules/dompurify": {
-      "version": "2.4.8",
-      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.4.8.tgz",
-      "integrity": "sha512-O90eQdAQOiLZoE9pEgPz3JfqXh5yrhJHv0/LzOv3wWFLTWUqAKaISD1aWASQTLshLM+jziuSerbtUESKK8Jibw=="
+      "version": "2.4.9",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.4.9.tgz",
+      "integrity": "sha512-iHtnxYMotKgOTvxIqq677JsKHvCOkAFqj9x8Mek2zdeHW1XjuFKwjpmZeMaXQRQ8AbJZDbcRz/+r1QhwvFtmQg=="
     },
     "node_modules/domutils": {
       "version": "3.1.0",
@@ -7281,7 +7327,8 @@
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
-      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA=="
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+      "devOptional": true
     },
     "node_modules/ee-first": {
       "version": "1.1.1",
@@ -7290,9 +7337,9 @@
       "dev": true
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.712",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.712.tgz",
-      "integrity": "sha512-ncfPC8UnGIyGFrPE03J5Xn6yTZ6R+clkcZbuG1PJbjAaZBFS4Kn3UKfzu8eilzru6SfC8TPsHuwv0p0eYVu+ww==",
+      "version": "1.4.713",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.713.tgz",
+      "integrity": "sha512-vDarADhwntXiULEdmWd77g2dV6FrNGa8ecAC29MZ4TwPut2fvosD0/5sJd1qWNNe8HcJFAC+F5Lf9jW1NPtWmw==",
       "dev": true
     },
     "node_modules/elementtree": {
@@ -7689,9 +7736,9 @@
       "devOptional": true
     },
     "node_modules/express": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.19.0.tgz",
-      "integrity": "sha512-/ERliX0l7UuHEgAy7HU2FRsiz3ScIKNl/iwnoYzHTJC0Sqj3ctWDD3MQ9CbUEfjshvxXImWaeukD0Xo7a2lWLA==",
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.19.1.tgz",
+      "integrity": "sha512-K4w1/Bp7y8iSiVObmCrtq8Cs79XjJc/RU2YYkZQ7wpUu5ZyZ7MtPHkqoMz4pf+mgXfNvo2qft8D9OnrH2ABk9w==",
       "dev": true,
       "dependencies": {
         "accepts": "~1.3.8",
@@ -7783,6 +7830,7 @@
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
       "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
+      "devOptional": true,
       "dependencies": {
         "@nodelib/fs.stat": "^2.0.2",
         "@nodelib/fs.walk": "^1.2.3",
@@ -7821,6 +7869,7 @@
       "version": "1.17.1",
       "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
       "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
+      "devOptional": true,
       "dependencies": {
         "reusify": "^1.0.4"
       }
@@ -7865,6 +7914,7 @@
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
       "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+      "devOptional": true,
       "dependencies": {
         "to-regex-range": "^5.0.1"
       },
@@ -7981,6 +8031,7 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
       "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==",
+      "devOptional": true,
       "dependencies": {
         "cross-spawn": "^7.0.0",
         "signal-exit": "^4.0.1"
@@ -7996,6 +8047,7 @@
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
       "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "devOptional": true,
       "engines": {
         "node": ">=14"
       },
@@ -8101,6 +8153,7 @@
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
       "hasInstallScript": true,
       "optional": true,
       "os": [
@@ -8151,6 +8204,7 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
       "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "devOptional": true,
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -8273,6 +8327,7 @@
       "version": "10.3.10",
       "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz",
       "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==",
+      "devOptional": true,
       "dependencies": {
         "foreground-child": "^3.1.0",
         "jackspeak": "^2.3.5",
@@ -8294,6 +8349,7 @@
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
       "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "devOptional": true,
       "dependencies": {
         "is-glob": "^4.0.1"
       },
@@ -8436,6 +8492,7 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
       "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+      "devOptional": true,
       "dependencies": {
         "function-bind": "^1.1.2"
       },
@@ -9147,6 +9204,7 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
       "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "devOptional": true,
       "dependencies": {
         "binary-extensions": "^2.0.0"
       },
@@ -9173,6 +9231,7 @@
       "version": "2.13.1",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
       "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==",
+      "devOptional": true,
       "dependencies": {
         "hasown": "^2.0.0"
       },
@@ -9199,6 +9258,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
       "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "devOptional": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -9215,6 +9275,7 @@
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
       "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "devOptional": true,
       "dependencies": {
         "is-extglob": "^2.1.1"
       },
@@ -9246,6 +9307,7 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
       "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "devOptional": true,
       "engines": {
         "node": ">=0.12.0"
       }
@@ -9327,7 +9389,8 @@
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+      "devOptional": true
     },
     "node_modules/isobject": {
       "version": "3.0.1",
@@ -9376,6 +9439,7 @@
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.3.6.tgz",
       "integrity": "sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==",
+      "devOptional": true,
       "dependencies": {
         "@isaacs/cliui": "^8.0.2"
       },
@@ -9431,6 +9495,7 @@
       "version": "1.21.0",
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
       "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==",
+      "dev": true,
       "bin": {
         "jiti": "bin/jiti.js"
       }
@@ -9683,6 +9748,7 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
       "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
+      "dev": true,
       "engines": {
         "node": ">=10"
       }
@@ -9690,7 +9756,8 @@
     "node_modules/lines-and-columns": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
-      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="
+      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
+      "dev": true
     },
     "node_modules/lint-staged": {
       "version": "13.3.0",
@@ -10335,7 +10402,7 @@
       "version": "1.3.6",
       "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
       "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/make-fetch-happen": {
       "version": "13.0.0",
@@ -10417,6 +10484,7 @@
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
       "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
+      "devOptional": true,
       "engines": {
         "node": ">= 8"
       }
@@ -10434,6 +10502,7 @@
       "version": "4.0.5",
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
       "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
+      "devOptional": true,
       "dependencies": {
         "braces": "^3.0.2",
         "picomatch": "^2.3.1"
@@ -10446,6 +10515,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "devOptional": true,
       "engines": {
         "node": ">=8.6"
       },
@@ -10528,6 +10598,7 @@
       "version": "9.0.3",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
       "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+      "devOptional": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -10551,6 +10622,7 @@
       "version": "7.0.4",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz",
       "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==",
+      "devOptional": true,
       "engines": {
         "node": ">=16 || 14 >=14.17"
       }
@@ -10836,20 +10908,11 @@
         "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
       }
     },
-    "node_modules/mz": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
-      "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
-      "dependencies": {
-        "any-promise": "^1.0.0",
-        "object-assign": "^4.0.1",
-        "thenify-all": "^1.0.0"
-      }
-    },
     "node_modules/nanoid": {
       "version": "3.3.7",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
       "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
+      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -11306,6 +11369,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
       "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "devOptional": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -11451,22 +11515,6 @@
         "url": "https://github.com/fb55/nth-check?sponsor=1"
       }
     },
-    "node_modules/object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/object-hash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
-      "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/object-inspect": {
       "version": "1.13.1",
       "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
@@ -12026,6 +12074,7 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
       "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+      "devOptional": true,
       "engines": {
         "node": ">=8"
       }
@@ -12033,12 +12082,14 @@
     "node_modules/path-parse": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "devOptional": true
     },
     "node_modules/path-scurry": {
       "version": "1.10.1",
       "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.1.tgz",
       "integrity": "sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==",
+      "devOptional": true,
       "dependencies": {
         "lru-cache": "^9.1.1 || ^10.0.0",
         "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
@@ -12054,6 +12105,7 @@
       "version": "10.2.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.2.0.tgz",
       "integrity": "sha512-2bIM8x+VAf6JT4bKAljS1qUWgMsqZRPGJS6FSahIMPVvctcNhyVp7AJu7quxOW9jwkryBReKZY5tY5JYv2n/7Q==",
+      "devOptional": true,
       "engines": {
         "node": "14 || >=16.14"
       }
@@ -12091,7 +12143,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": "4.0.1",
@@ -12126,14 +12179,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/pirates": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
-      "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/piscina": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/piscina/-/piscina-4.4.0.tgz",
@@ -12258,9 +12303,10 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.37",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.37.tgz",
-      "integrity": "sha512-7iB/v/r7Woof0glKLH8b1SPHrsX7uhdO+Geb41QpF/+mWZHU3uxxSlN+UXGVit1PawOYDToO+AbZzhBzWRDwbQ==",
+      "version": "8.4.38",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
+      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
+      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -12284,96 +12330,6 @@
         "node": "^10 || ^12 || >=14"
       }
     },
-    "node_modules/postcss-import": {
-      "version": "15.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
-      "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
-      "dependencies": {
-        "postcss-value-parser": "^4.0.0",
-        "read-cache": "^1.0.0",
-        "resolve": "^1.1.7"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      },
-      "peerDependencies": {
-        "postcss": "^8.0.0"
-      }
-    },
-    "node_modules/postcss-js": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz",
-      "integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==",
-      "dependencies": {
-        "camelcase-css": "^2.0.1"
-      },
-      "engines": {
-        "node": "^12 || ^14 || >= 16"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
-      "peerDependencies": {
-        "postcss": "^8.4.21"
-      }
-    },
-    "node_modules/postcss-load-config": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
-      "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==",
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/postcss/"
-        },
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "dependencies": {
-        "lilconfig": "^3.0.0",
-        "yaml": "^2.3.4"
-      },
-      "engines": {
-        "node": ">= 14"
-      },
-      "peerDependencies": {
-        "postcss": ">=8.0.9",
-        "ts-node": ">=9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "postcss": {
-          "optional": true
-        },
-        "ts-node": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/postcss-load-config/node_modules/lilconfig": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.1.tgz",
-      "integrity": "sha512-O18pf7nyvHTckunPWCV1XUNXU1piu01y2b7ATJ0ppkUkk8ocqVWBrYjJBCwHDjD/ZWcfyrA0P4gKhzWGi5EINQ==",
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/antonk52"
-      }
-    },
-    "node_modules/postcss-load-config/node_modules/yaml": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.4.1.tgz",
-      "integrity": "sha512-pIXzoImaqmfOrL7teGUBt/T7ZDnyeGBWyXQBvOVhLkWLN37GXv8NMLK406UY6dS51JfcQHsmcW5cJ441bHg6Lg==",
-      "bin": {
-        "yaml": "bin.mjs"
-      },
-      "engines": {
-        "node": ">= 14"
-      }
-    },
     "node_modules/postcss-loader": {
       "version": "8.1.1",
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-8.1.1.tgz",
@@ -12496,28 +12452,11 @@
         "postcss": "^8.1.0"
       }
     },
-    "node_modules/postcss-nested": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.1.tgz",
-      "integrity": "sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==",
-      "dependencies": {
-        "postcss-selector-parser": "^6.0.11"
-      },
-      "engines": {
-        "node": ">=12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
-      "peerDependencies": {
-        "postcss": "^8.2.14"
-      }
-    },
     "node_modules/postcss-selector-parser": {
       "version": "6.0.16",
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.16.tgz",
       "integrity": "sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw==",
+      "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -12529,7 +12468,8 @@
     "node_modules/postcss-value-parser": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
-      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
+      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
+      "dev": true
     },
     "node_modules/prelude-ls": {
       "version": "1.1.2",
@@ -12849,6 +12789,7 @@
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
       "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
+      "devOptional": true,
       "funding": [
         {
           "type": "github",
@@ -12980,22 +12921,6 @@
         "url": "https://opencollective.com/webpack"
       }
     },
-    "node_modules/read-cache": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
-      "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
-      "dependencies": {
-        "pify": "^2.3.0"
-      }
-    },
-    "node_modules/read-cache/node_modules/pify": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/read-package-json": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-7.0.0.tgz",
@@ -13041,6 +12966,7 @@
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
       "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "devOptional": true,
       "dependencies": {
         "picomatch": "^2.2.1"
       },
@@ -13052,6 +12978,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "devOptional": true,
       "engines": {
         "node": ">=8.6"
       },
@@ -13173,6 +13100,7 @@
       "version": "1.22.8",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
       "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
+      "devOptional": true,
       "dependencies": {
         "is-core-module": "^2.13.0",
         "path-parse": "^1.0.7",
@@ -13280,6 +13208,7 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
       "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
+      "devOptional": true,
       "engines": {
         "iojs": ">=1.0.0",
         "node": ">=0.10.0"
@@ -13417,6 +13346,7 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
       "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
+      "devOptional": true,
       "funding": [
         {
           "type": "github",
@@ -13823,6 +13753,7 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
       "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+      "devOptional": true,
       "dependencies": {
         "shebang-regex": "^3.0.0"
       },
@@ -13834,6 +13765,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+      "devOptional": true,
       "engines": {
         "node": ">=8"
       }
@@ -14024,6 +13956,7 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
       "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -14263,6 +14196,7 @@
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "devOptional": true,
       "dependencies": {
         "emoji-regex": "^8.0.0",
         "is-fullwidth-code-point": "^3.0.0",
@@ -14288,6 +14222,7 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "devOptional": true,
       "dependencies": {
         "ansi-regex": "^5.0.1"
       },
@@ -14307,35 +14242,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/sucrase": {
-      "version": "3.35.0",
-      "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
-      "integrity": "sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==",
-      "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.2",
-        "commander": "^4.0.0",
-        "glob": "^10.3.10",
-        "lines-and-columns": "^1.1.6",
-        "mz": "^2.7.0",
-        "pirates": "^4.0.1",
-        "ts-interface-checker": "^0.1.9"
-      },
-      "bin": {
-        "sucrase": "bin/sucrase",
-        "sucrase-node": "bin/sucrase-node"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      }
-    },
-    "node_modules/sucrase/node_modules/commander": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
-      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/superagent": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/superagent/-/superagent-5.3.1.tgz",
@@ -14403,6 +14309,7 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
       "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
+      "devOptional": true,
       "engines": {
         "node": ">= 0.4"
       },
@@ -14442,53 +14349,6 @@
         "node": ">=0.10"
       }
     },
-    "node_modules/tailwindcss": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.1.tgz",
-      "integrity": "sha512-qAYmXRfk3ENzuPBakNK0SRrUDipP8NQnEY6772uDhflcQz5EhRdD7JNZxyrFHVQNCwULPBn6FNPp9brpO7ctcA==",
-      "dependencies": {
-        "@alloc/quick-lru": "^5.2.0",
-        "arg": "^5.0.2",
-        "chokidar": "^3.5.3",
-        "didyoumean": "^1.2.2",
-        "dlv": "^1.1.3",
-        "fast-glob": "^3.3.0",
-        "glob-parent": "^6.0.2",
-        "is-glob": "^4.0.3",
-        "jiti": "^1.19.1",
-        "lilconfig": "^2.1.0",
-        "micromatch": "^4.0.5",
-        "normalize-path": "^3.0.0",
-        "object-hash": "^3.0.0",
-        "picocolors": "^1.0.0",
-        "postcss": "^8.4.23",
-        "postcss-import": "^15.1.0",
-        "postcss-js": "^4.0.1",
-        "postcss-load-config": "^4.0.1",
-        "postcss-nested": "^6.0.1",
-        "postcss-selector-parser": "^6.0.11",
-        "resolve": "^1.22.2",
-        "sucrase": "^3.32.0"
-      },
-      "bin": {
-        "tailwind": "lib/cli.js",
-        "tailwindcss": "lib/cli.js"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      }
-    },
-    "node_modules/tailwindcss/node_modules/glob-parent": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dependencies": {
-        "is-glob": "^4.0.3"
-      },
-      "engines": {
-        "node": ">=10.13.0"
-      }
-    },
     "node_modules/tapable": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
@@ -14722,25 +14582,6 @@
       "resolved": "https://registry.npmjs.org/text-mask-core/-/text-mask-core-5.1.2.tgz",
       "integrity": "sha512-VfkCMdmRRZqXgQZFlDMiavm3hzsMzBM23CxHZsaeAYg66ZhXCNJWrFmnJwNy8KF9f74YvAUAuQenxsMCfuvhUw=="
     },
-    "node_modules/thenify": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
-      "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
-      "dependencies": {
-        "any-promise": "^1.0.0"
-      }
-    },
-    "node_modules/thenify-all": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
-      "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==",
-      "dependencies": {
-        "thenify": ">= 3.1.0 < 4"
-      },
-      "engines": {
-        "node": ">=0.8"
-      }
-    },
     "node_modules/through": {
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
@@ -14778,6 +14619,7 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
       "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "devOptional": true,
       "dependencies": {
         "is-number": "^7.0.0"
       },
@@ -14812,11 +14654,6 @@
         "tree-kill": "cli.js"
       }
     },
-    "node_modules/ts-interface-checker": {
-      "version": "0.1.13",
-      "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
-      "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA=="
-    },
     "node_modules/ts-matches": {
       "version": "5.4.1",
       "resolved": "https://registry.npmjs.org/ts-matches/-/ts-matches-5.4.1.tgz",
@@ -14836,7 +14673,7 @@
       "version": "10.9.2",
       "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz",
       "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==",
-      "devOptional": true,
+      "dev": true,
       "dependencies": {
         "@cspotcode/source-map-support": "^0.8.0",
         "@tsconfig/node10": "^1.0.7",
@@ -14875,12 +14712,6 @@
         }
       }
     },
-    "node_modules/ts-node/node_modules/arg": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
-      "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
-      "devOptional": true
-    },
     "node_modules/tslib": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
@@ -15114,10 +14945,10 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.2.tgz",
-      "integrity": "sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==",
-      "devOptional": true,
+      "version": "5.4.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.3.tgz",
+      "integrity": "sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==",
+      "dev": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -15139,7 +14970,7 @@
       "version": "5.26.5",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
       "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/unicode-canonical-property-names-ecmascript": {
       "version": "2.0.0",
@@ -15296,7 +15127,7 @@
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz",
       "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/validate-npm-package-license": {
       "version": "3.0.4",
@@ -16216,6 +16047,7 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
       "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+      "devOptional": true,
       "dependencies": {
         "isexe": "^2.0.0"
       },
@@ -16396,6 +16228,7 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
       "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "devOptional": true,
       "dependencies": {
         "ansi-styles": "^4.0.0",
         "string-width": "^4.1.0",
@@ -16412,6 +16245,7 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "devOptional": true,
       "dependencies": {
         "color-convert": "^2.0.1"
       },
@@ -16426,6 +16260,7 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "devOptional": true,
       "dependencies": {
         "color-name": "~1.1.4"
       },
@@ -16436,7 +16271,8 @@
     "node_modules/wrap-ansi-cjs/node_modules/color-name": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "devOptional": true
     },
     "node_modules/wrap-ansi/node_modules/ansi-styles": {
       "version": "4.3.0",
@@ -16574,7 +16410,7 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
       "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
-      "devOptional": true,
+      "dev": true,
       "engines": {
         "node": ">=6"
       }
diff --git a/web/package.json b/web/package.json
index 5b7c1b9ad..7915c8d2c 100644
--- a/web/package.json
+++ b/web/package.json
@@ -78,7 +78,6 @@
     "pbkdf2": "^3.1.2",
     "rxjs": "^7.5.6",
     "swiper": "^8.2.4",
-    "tailwindcss": "^3.3.3",
     "ts-matches": "^5.2.1",
     "tslib": "^2.3.0",
     "uuid": "^8.3.2",
diff --git a/web/projects/marketplace/package.json b/web/projects/marketplace/package.json
index 8df1f559b..7c628694b 100644
--- a/web/projects/marketplace/package.json
+++ b/web/projects/marketplace/package.json
@@ -1,13 +1,12 @@
 {
   "name": "@start9labs/marketplace",
-  "version": "0.3.16",
+  "version": "0.3.19",
   "peerDependencies": {
     "@angular/common": ">=13.2.0",
     "@angular/core": ">=13.2.0",
     "@start9labs/shared": ">=0.3.2",
     "@taiga-ui/cdk": ">=3.0.0",
     "@tinkoff/ng-dompurify": ">=4.0.0",
-    "tailwindcss": "^3.3.2",
     "fuse.js": "^6.4.6"
   },
   "dependencies": {
diff --git a/web/projects/marketplace/src/components/menu/menu.component.html b/web/projects/marketplace/src/components/menu/menu.component.html
index 84170e4c1..47468205d 100644
--- a/web/projects/marketplace/src/components/menu/menu.component.html
+++ b/web/projects/marketplace/src/components/menu/menu.component.html
@@ -1,34 +1,24 @@
-<header
-  class="header overflow-hidden w-full fixed sm:w-[34vw] md:w-[28vw] lg:w-[22vw] 2xl:w-[280px] sm:bg-zinc-700/90 sm:backdrop-blur-2xl sm:min-h-screen overflow-y-auto flex flex-col sm:py-6 sm:after:block sm:after:absolute sm:after:top-0 sm:after:bottom-0 sm:after:right-0 sm:after:w-0.5 after:h-[calc(100vh - 20px)] sm:after:bg-gradient-to-b from-zinc-700 to-zinc-400"
->
+<header>
   <ng-container *tuiLet="store$ | async as store">
-    <div class="hidden sm:flex flex-col mx-6 pb-3 items-center">
-      <div
-        class="mb-3 rounded-full"
+    <div class="title">
+      <store-icon
         [class.tui-skeleton]="!store"
         [class.tui-skeleton_rounded]="!store"
-      >
-        <store-icon
-          size="64px"
-          [url]="store?.url || ''"
-          [marketplace]="iconConfig"
-        ></store-icon>
-      </div>
-      <h1
-        class="font-semibold text-2xl text-zinc-100 text-center mb-3"
-        [class.tui-skeleton]="!store"
-      >
+        size="64px"
+        [url]="store?.url || ''"
+        [marketplace]="iconConfig"
+      ></store-icon>
+      <h1 [class.tui-skeleton]="!store">
         {{ store?.info?.name || 'Loading store' }}
       </h1>
       <!-- change registry modal -->
       <ng-content select="[slot=desktop]"></ng-content>
     </div>
     <!-- mobile nav -->
-    <div class="sm:hidden bg-zinc-700/90 backdrop-blur-3xl">
-      <div class="flex justify-between items-center py-4 px-4 w-[100vw]">
+    <div class="nav-mobile">
+      <div class="nav-mobile-bar">
         <!-- mobile search -->
         <marketplace-search
-          class="max-w-fit"
           [(query)]="query"
           (queryChange)="onQueryChange($event)"
         ></marketplace-search>
@@ -43,101 +33,78 @@
         >
           <store-icon
             size="48px"
+            [style.height]="'48px'"
+            [style.border-radius]="'100%'"
             [url]="store?.url || ''"
             [marketplace]="iconConfig"
-            class="rounded-full"
             [class.tui-skeleton]="!store"
             [class.tui-skeleton_rounded]="!store"
           ></store-icon>
           <nav
             *tuiSidebar="open; direction: 'right'; autoWidth: true"
-            class="bg-zinc-700/90 h-screen w-[70vw]"
+            class="nav-mobile-sidebar divide-bar"
           >
-            <div class="flex flex-col divide-y divide-zinc-500 h-full">
-              <div class="flex items-center p-4">
-                <h1
-                  class="font-semibold text-xl text-zinc-200 flex-grow"
-                  [class.tui-skeleton]="!store"
-                >
-                  {{ store?.info?.name }}
-                </h1>
-                <button
-                  [style.--tui-padding]="0"
-                  class="place-self-end"
-                  tuiButton
-                  type="button"
-                  appearance="icon"
-                  icon="tuiIconClose"
-                  (tuiActiveZoneChange)="toggleMenu($event)"
-                  (click)="toggleMenu(false)"
-                ></button>
-              </div>
-              <!-- change registry modal -->
-              <ng-content select="[slot=mobile]"></ng-content>
-              <div
-                class="flex flex-col justify-between divide-y divide-zinc-500 h-full"
+            <div class="nav-mobile-sidebar-top">
+              <h1 [class.tui-skeleton]="!store">
+                {{ store?.info?.name }}
+              </h1>
+              <button
+                [style.--tui-padding]="0"
+                tuiButton
+                type="button"
+                appearance="icon"
+                icon="tuiIconClose"
+                (tuiActiveZoneChange)="toggleMenu($event)"
+                (click)="toggleMenu(false)"
+              ></button>
+            </div>
+            <!-- change registry modal -->
+            <ng-content select="[slot=mobile]"></ng-content>
+            <div class="nav-mobile-sidebar-bottom divide-bar">
+              <marketplace-categories
+                [categories]="store?.info?.categories"
+                [category]="query ? '' : category"
+                (categoryChange)="onCategoryChange($event); toggleMenu(false)"
+              ></marketplace-categories>
+              <a
+                target="_blank"
+                href="https://github.com/Start9Labs/service-pipeline#readme"
               >
-                <marketplace-categories
-                  [categories]="store?.info?.categories"
-                  [category]="query ? '' : category"
-                  (categoryChange)="onCategoryChange($event); toggleMenu(false)"
-                  class="grow pt-5 pl-5 pr-5"
-                ></marketplace-categories>
-                <a
-                  class="flex relative gap-2 hover:no-underline p-5"
-                  target="_blank"
-                  href="https://github.com/Start9Labs/service-pipeline#readme"
-                >
-                  <img
-                    alt="Launch icon"
-                    width="24"
-                    height="24"
-                    class="opacity-70 invert"
-                    src="svg/rocket-outline.svg"
-                  />
-                  <span
-                    class="text-base text-zinc-50 text-ellipsis overflow-hidden whitespace-nowrap"
-                  >
-                    Launch your project
-                  </span>
-                </a>
-              </div>
+                <!-- @TODO need rocket icon -->
+                <tui-icon
+                  tuiAppearance="icon"
+                  icon="tuiIconExternalLinkLarge"
+                ></tui-icon>
+                <span>Launch your project</span>
+              </a>
             </div>
           </nav>
         </button>
       </div>
     </div>
     <!-- desktop nav -->
-    <nav class="hidden sm:flex grow flex-col py-3 px-4">
+    <nav class="nav-desktop">
       <!-- desktop search -->
       <marketplace-search
-        class="place-self-center md:pb-8"
         [query]="query"
         (queryChange)="onQueryChange($event)"
       ></marketplace-search>
-      <div class="flex grow flex-col justify-between">
+      <div class="nav-desktop-container">
         <marketplace-categories
           [categories]="store?.info?.categories"
           [category]="query ? '' : category"
           (categoryChange)="onCategoryChange($event)"
         ></marketplace-categories>
         <a
-          class="flex gap-2 p-2 hover:no-underline sm:hover:bg-[#222428] hover:cursor-pointer sm:w-[120%] z-50 rounded-l-lg ease-in-out delay-75 duration-300"
           target="_blank"
           href="https://github.com/Start9Labs/service-pipeline#readme"
         >
-          <img
-            alt="Rocket Icon"
-            width="24"
-            height="24"
-            class="opacity-70 invert"
-            src="svg/rocket-outline.svg"
-          />
-          <span
-            class="text-base text-zinc-50 text-ellipsis overflow-hidden whitespace-nowrap"
-          >
-            Launch your project
-          </span>
+          <!-- @TODO need rocket icon -->
+          <tui-icon
+            tuiAppearance="icon"
+            icon="tuiIconExternalLinkLarge"
+          ></tui-icon>
+          <span>Launch your project</span>
         </a>
       </div>
     </nav>
diff --git a/web/projects/marketplace/src/components/menu/menu.component.module.ts b/web/projects/marketplace/src/components/menu/menu.component.module.ts
index c5c9b1361..c4c6e314e 100644
--- a/web/projects/marketplace/src/components/menu/menu.component.module.ts
+++ b/web/projects/marketplace/src/components/menu/menu.component.module.ts
@@ -9,6 +9,7 @@ import { TuiSidebarModule } from '@taiga-ui/addon-mobile'
 import { SearchModule } from '../../pages/list/search/search.module'
 import { CategoriesModule } from '../../pages/list/categories/categories.module'
 import { StoreIconComponentModule } from '../store-icon/store-icon.component.module'
+import { TuiAppearanceModule, TuiIconModule } from '@taiga-ui/experimental'
 
 @NgModule({
   imports: [
@@ -23,6 +24,8 @@ import { StoreIconComponentModule } from '../store-icon/store-icon.component.mod
     CategoriesModule,
     StoreIconComponentModule,
     TuiLetModule,
+    TuiAppearanceModule,
+    TuiIconModule,
   ],
   declarations: [MenuComponent],
   exports: [MenuComponent],
diff --git a/web/projects/marketplace/src/components/menu/menu.component.scss b/web/projects/marketplace/src/components/menu/menu.component.scss
index 7a7508b00..9a013c478 100644
--- a/web/projects/marketplace/src/components/menu/menu.component.scss
+++ b/web/projects/marketplace/src/components/menu/menu.component.scss
@@ -1,13 +1,229 @@
 @import '@taiga-ui/core/styles/taiga-ui-local';
 
-.header {
+header {
   @include scrollbar-hidden();
 
   max-height: 100%;
   // TODO: Theme
   background: #373a3f;
+  overflow: hidden;
+  width: 100%;
+  position: fixed;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  z-index: 10;
 
   @media screen and (min-width: 640px) {
     width: 15rem;
+    background-color: rgb(var(--tw-color-zinc-700) / 0.9);
+    backdrop-filter: blur(40px);
+    min-height: calc(100vh - var(--portal-header-height));
+    padding: 1.5rem 0;
+
+    &::after {
+      display: block;
+      position: absolute;
+      top: 0px;
+      bottom: 0px;
+      right: 0px;
+      width: 0.125rem;
+      content: '';
+      background-image: linear-gradient(
+        to bottom,
+        rgb(var(--tw-color-zinc-700)),
+        rgb(var(--tw-color-zinc-400))
+      );
+    }
   }
 }
+
+.title {
+  display: none;
+
+  @media (min-width: 640px) {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-left: 1.5rem;
+    margin-right: 1.5rem;
+    padding-bottom: 0.75rem;
+  }
+
+  store-icon {
+    margin-bottom: 0.75rem;
+    border-radius: 100%;
+    height: 64px;
+  }
+
+  h1 {
+    font-weight: 600;
+    font-size: 1.5rem;
+    line-height: 2rem;
+    color: rgb(244 244 245);
+    text-align: center;
+    margin-bottom: 0.75rem;
+  }
+}
+
+.nav {
+  &-desktop {
+    display: none;
+    padding: 0.75rem 1rem;
+
+    marketplace-search {
+      place-self: center;
+      padding-bottom: 2rem;
+    }
+
+    @media (min-width: 640px) {
+      display: flex;
+      flex-grow: 1;
+      flex-direction: column;
+    }
+
+    &-container {
+      display: flex;
+      flex-grow: 1;
+      flex-direction: column;
+      justify-content: space-between;
+
+      a {
+        display: flex;
+        gap: 0.5rem;
+        padding: 0.5rem;
+        z-index: 50;
+        border-top-left-radius: 0.5rem;
+        border-bottom-left-radius: 0.5rem;
+        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+        transition-delay: 75ms;
+        transition-duration: 300ms;
+
+        &:hover {
+          text-decoration-line: none;
+          cursor: pointer;
+        }
+
+        img {
+          opacity: 0.7;
+          filter: invert(100%);
+        }
+
+        span {
+          font-size: 1rem;
+          line-height: 1.5rem;
+          color: rgb(250 250 250);
+          text-overflow: ellipsis;
+          overflow: hidden;
+          white-space: nowrap;
+        }
+        @media (min-width: 640px) {
+          width: 120%;
+
+          &:hover {
+            background-color: rgb(34 36 40);
+          }
+        }
+      }
+    }
+  }
+
+  &-mobile {
+    @media (min-width: 640px) {
+      display: none;
+    }
+
+    &-bar {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 1rem;
+      width: 100vw;
+
+      marketplace-search {
+        max-width: fit-content;
+      }
+    }
+
+    &-sidebar {
+      background-color: rgb(var(--tw-color-zinc-700) / 0.9);
+      height: calc(100vh - var(--portal-header-height));
+      width: 70vw;
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+
+      &-top {
+        display: flex;
+        align-items: center;
+        padding: 1rem;
+        border-bottom: 1px solid rgb(113 113 122);
+
+        h1 {
+          font-weight: 600;
+          font-size: 1.25rem;
+          line-height: 1.75rem;
+          color: rgb(228 228 231);
+          flex-grow: 1;
+        }
+
+        button {
+          place-self: end;
+        }
+      }
+
+      &-bottom {
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        border-top: 1px solid rgb(113 113 122);
+        height: 100%;
+
+        marketplace-categories {
+          flex-grow: 1;
+          padding: 1.25rem 1.25rem 0px 1.25rem;
+        }
+
+        a {
+          display: flex;
+          position: relative;
+          gap: 0.5rem;
+          padding: 1.25rem;
+
+          &:hover {
+            text-decoration-line: none;
+          }
+
+          img {
+            opacity: 0.7;
+            filter: invert(100%);
+          }
+
+          span {
+            font-size: 1rem;
+            line-height: 1.5rem;
+            color: rgb(250 250 250);
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+          }
+        }
+      }
+
+      .divide-bar > * + * {
+        border-top-width: 1px;
+        border-bottom-width: 0px;
+        border-color: rgb(113 113 122);
+      }
+    }
+  }
+}
+
+*,
+::before,
+::after {
+  box-sizing: border-box;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgb(var(--tw-color-gray-200) / 1);
+}
diff --git a/web/projects/marketplace/src/pages/list/categories/categories.component.html b/web/projects/marketplace/src/pages/list/categories/categories.component.html
index e5344ae42..b50152e8f 100644
--- a/web/projects/marketplace/src/pages/list/categories/categories.component.html
+++ b/web/projects/marketplace/src/pages/list/categories/categories.component.html
@@ -1,28 +1,25 @@
 <button
   *ngFor="let cat of categories || ['', '', '', '', '', '']"
-  class="flex relative gap-2 hover:no-underline hover:cursor-pointer sm:hover:bg-[#222428] sm:hover:opacity-90 sm:w-[120%] rounded-l-lg ease-in-out delay-75 duration-300 mb-5 sm:p-2 sm:mb-3 z-50"
-  routerLink="/marketplace"
+  routerLink="../"
   (click)="switchCategory(cat)"
   [class.category_selected]="cat === category"
 >
   <div
-    class="relative flex"
+    class="category-wrapper"
     [class.tui-skeleton]="!categories"
     [class.tui-skeleton_rounded]="!categories"
   >
-    <img
-      alt="Category Icon"
-      width="24"
-      height="24"
-      class="opacity-70 invert"
-      src="/svg/{{ determineIcon(cat) }}.svg"
-    />
+    <tui-icon tuiAppearance="icon" icon="{{ determineIcon(cat) }}"></tui-icon>
   </div>
   <span
-    class="text-base text-zinc-50 text-ellipsis overflow-hidden whitespace-nowrap"
+    class="category-title"
     [class.tui-skeleton]="!categories"
     [class.tui-skeleton_rounded]="!categories"
   >
-    {{ (cat | titlecase) || 'loading category...' }}
+    {{
+      cat === 'ai'
+        ? (cat | uppercase)
+        : (cat | titlecase) || 'loading category...'
+    }}
   </span>
 </button>
diff --git a/web/projects/marketplace/src/pages/list/categories/categories.component.scss b/web/projects/marketplace/src/pages/list/categories/categories.component.scss
index 7850ab3e4..57b9b6e61 100644
--- a/web/projects/marketplace/src/pages/list/categories/categories.component.scss
+++ b/web/projects/marketplace/src/pages/list/categories/categories.component.scss
@@ -9,4 +9,49 @@
     background-color: #222428;
     opacity: 90;
   }
-}
\ No newline at end of file
+}
+
+button {
+  display: flex;
+  position: relative;
+  gap: 0.5rem;
+  border-top-left-radius: 0.5rem;
+  border-bottom-left-radius: 0.5rem;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-delay: 75ms;
+  transition-duration: 300ms;
+  margin-bottom: 1.25rem;
+  z-index: 50;
+
+  &:hover {
+    text-decoration-line: none;
+    cursor: pointer;
+  }
+
+  @media (min-width: 640px) {
+    width: 120%;
+    padding: 0.5rem;
+    margin-bottom: 0.75rem;
+
+    &:hover {
+      background-color: rgb(34 36 40);
+      opacity: 0.9;
+    }
+  }
+}
+
+.category {
+  &-wrapper {
+    position: relative;
+    display: flex;
+  }
+
+  &-title {
+    font-size: 1rem;
+    line-height: 1.5rem;
+    color: rgb(250 250 250);
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+}
diff --git a/web/projects/marketplace/src/pages/list/categories/categories.component.ts b/web/projects/marketplace/src/pages/list/categories/categories.component.ts
index 761ffa386..66bbeafea 100644
--- a/web/projects/marketplace/src/pages/list/categories/categories.component.ts
+++ b/web/projects/marketplace/src/pages/list/categories/categories.component.ts
@@ -30,27 +30,31 @@ export class CategoriesComponent {
   determineIcon(category: string): string {
     switch (category.toLowerCase()) {
       case 'all':
-        return 'apps-outline'
+        return 'tuiIconGridLarge'
       case 'bitcoin':
-        return 'logo-bitcoin'
+        // @TODO need bitcoin icon
+        return 'tuiIconBoldLarge'
+      case 'messaging':
       case 'communications':
-        return 'chatbubbles-outline'
+        return 'tuiIconMessageCircleLarge'
       case 'data':
-        return 'document-outline'
+        return 'tuiIconFileTextLarge'
       case 'developer tools':
-        return 'code-slash-outline'
+        return 'tuiIconTableSplitLarge'
       case 'featured':
-        return 'star-outline'
+        return 'tuiIconStarLarge'
       case 'lightning':
-        return 'flash-outline'
+        return 'tuiIconZapLarge'
       case 'media':
-        return 'play-outline'
+        return 'tuiIconPlayCircleLarge'
       case 'networking':
-        return 'globe-outline'
+        return 'tuiIconGlobeLarge'
       case 'social':
-        return 'people-outline'
+        return 'tuiIconUsersLarge'
+      case 'ai':
+        return 'tuiIconCpuLarge'
       default:
-        return 'cube-outline'
+        return 'tuiIconBoxLarge'
     }
   }
 }
diff --git a/web/projects/marketplace/src/pages/list/categories/categories.module.ts b/web/projects/marketplace/src/pages/list/categories/categories.module.ts
index 567a16467..27aeccee1 100644
--- a/web/projects/marketplace/src/pages/list/categories/categories.module.ts
+++ b/web/projects/marketplace/src/pages/list/categories/categories.module.ts
@@ -2,9 +2,11 @@ import { CommonModule } from '@angular/common'
 import { NgModule } from '@angular/core'
 
 import { CategoriesComponent } from './categories.component'
+import { TuiAppearanceModule, TuiIconModule } from '@taiga-ui/experimental'
+import { RouterModule } from '@angular/router'
 
 @NgModule({
-  imports: [CommonModule],
+  imports: [RouterModule, CommonModule, TuiAppearanceModule, TuiIconModule],
   declarations: [CategoriesComponent],
   exports: [CategoriesComponent],
 })
diff --git a/web/projects/marketplace/src/pages/list/item/item.component.html b/web/projects/marketplace/src/pages/list/item/item.component.html
index f3b507125..8bc43b753 100644
--- a/web/projects/marketplace/src/pages/list/item/item.component.html
+++ b/web/projects/marketplace/src/pages/list/item/item.component.html
@@ -1,32 +1,24 @@
-<div
-  class="h-full relative rounded-3xl pt-20 pb-10 px-8 gap-4 shadow-lg hover:scale-90 transition duration-500 ease-in-out min-w-[300px]"
->
+<div class="item-container box-shadow-lg">
   <!-- color background -->
-  <div
-    class="overflow-hidden absolute w-full h-full top-0 left-0 -z-50 rounded-3xl bg-zinc-800"
-  >
+  <div class="background">
     <img
-      [src]="'data:image/png;base64,' + pkg.icon | trustUrl"
-      class="absolute object-cover pointer-events-none w-[150%] h-[150%] max-w-[200%] blur-[100px]"
+      [src]="pkg | mimeType | trustUrl"
       alt="{{ pkg.manifest.title }} Icon"
     />
   </div>
   <!-- darkening overlay -->
-  <div
-    class="overflow-hidden absolute w-full h-full top-0 left-0 -z-50 rounded-3xl bg-zinc-800 opacity-40"
-  ></div>
+  <div class="overlay"></div>
   <!-- icon -->
   <img
-    [src]="'data:image/png;base64,' + pkg.icon | trustUrl"
-    class="w-[5.5rem] h-[5.5rem] pointer-events-none absolute -top-10 rounded-full object-cover shadow-lg z-10"
+    [src]="pkg | mimeType | trustUrl"
+    class="icon box-shadow-lg"
     alt="{{ pkg.manifest.title }} Icon"
-    style="transform: none"
   />
-  <div class="mt-3 text-zinc-5 mix-blend-plus-lighter">
-    <span class="block text-2xl font-medium line-clamp-1 mb-1">
+  <div class="detail">
+    <span class="detail-title">
       {{ pkg.manifest.title }}
     </span>
-    <span class="block text-base h-12 line-clamp-2">
+    <span class="detail-description">
       {{ pkg.manifest.description.short }}
     </span>
   </div>
diff --git a/web/projects/marketplace/src/pages/list/item/item.component.scss b/web/projects/marketplace/src/pages/list/item/item.component.scss
new file mode 100644
index 000000000..2276a8acc
--- /dev/null
+++ b/web/projects/marketplace/src/pages/list/item/item.component.scss
@@ -0,0 +1,91 @@
+.item-container {
+  height: 100%;
+  position: relative;
+  min-width: 300px;
+  border-radius: 1.5rem;
+  padding: 5rem 2rem 2rem 2.5rem;
+  gap: 1rem;
+  transition-property: transform;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 500ms;
+
+  &:hover {
+    transform: scaleX(0.9) scaleY(0.9);
+  }
+}
+
+.background {
+  overflow: hidden;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0px;
+  left: 0px;
+  z-index: -50;
+  border-radius: 1.5rem;
+  background-color: rgb(39 39 42);
+
+  img {
+    position: absolute;
+    object-fit: cover;
+    pointer-events: none;
+    width: 150%;
+    height: 150%;
+    max-width: 200%;
+    filter: blur(100px);
+  }
+}
+
+.overlay {
+  overflow: hidden;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0px;
+  left: 0px;
+  border-radius: 1.5rem;
+  background-color: rgb(39 39 42);
+  opacity: 0.4;
+}
+
+.icon {
+  width: 5.5rem;
+  height: 5.5rem;
+  pointer-events: none;
+  position: absolute;
+  top: -2.5rem;
+  border-radius: 9999px;
+  object-fit: cover;
+  z-index: 10;
+  backdrop-filter: blur(24px);
+  background-color: rgb(0 0 0 / 0.5);
+  transform: none;
+}
+
+.detail {
+  margin-top: 0.75rem;
+  mix-blend-mode: plus-lighter;
+
+  &-title {
+    display: block;
+    font-size: 1.5rem;
+    line-height: 2rem;
+    margin-bottom: 0.25rem;
+    font-weight: 500;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+  }
+
+  &-description {
+    display: block;
+    font-size: 1rem;
+    line-height: 1.5rem;
+    height: 3rem;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+}
diff --git a/web/projects/marketplace/src/pages/list/item/item.component.ts b/web/projects/marketplace/src/pages/list/item/item.component.ts
index d6d924acb..e1e4544b0 100644
--- a/web/projects/marketplace/src/pages/list/item/item.component.ts
+++ b/web/projects/marketplace/src/pages/list/item/item.component.ts
@@ -4,6 +4,7 @@ import { MarketplacePkg } from '../../../types'
 @Component({
   selector: 'marketplace-item',
   templateUrl: 'item.component.html',
+  styleUrls: ['item.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ItemComponent {
diff --git a/web/projects/marketplace/src/pages/list/item/item.module.ts b/web/projects/marketplace/src/pages/list/item/item.module.ts
index c466ac2af..5dc7ae327 100644
--- a/web/projects/marketplace/src/pages/list/item/item.module.ts
+++ b/web/projects/marketplace/src/pages/list/item/item.module.ts
@@ -3,10 +3,11 @@ import { NgModule } from '@angular/core'
 import { RouterModule } from '@angular/router'
 import { SharedPipesModule } from '@start9labs/shared'
 import { ItemComponent } from './item.component'
+import { MimeTypePipeModule } from '../../../pipes/mime-type.pipe'
 
 @NgModule({
   declarations: [ItemComponent],
   exports: [ItemComponent],
-  imports: [CommonModule, RouterModule, SharedPipesModule],
+  imports: [CommonModule, RouterModule, SharedPipesModule, MimeTypePipeModule],
 })
 export class ItemModule {}
diff --git a/web/projects/marketplace/src/pages/list/search/search.component.html b/web/projects/marketplace/src/pages/list/search/search.component.html
index 93e70f791..e901583d2 100644
--- a/web/projects/marketplace/src/pages/list/search/search.component.html
+++ b/web/projects/marketplace/src/pages/list/search/search.component.html
@@ -1,20 +1,11 @@
-<div class="text-zinc-100 bg-zinc-500 px-3 rounded-full">
-  <div class="relative flex items-center">
-    <img
-      alt="Search icon"
-      width="24"
-      height="24"
-      class="invert"
-      src="svg/search.svg"
-    />
-    <input
-      type="text"
-      name="search"
-      class="mt-1 bg-transparent placeholder-zinc-300 focus:outline-none px-3 py-2"
-      placeholder="Search..."
-      autocomplete="off"
-      [ngModel]="query"
-      (ngModelChange)="onModelChange($event)"
-    />
-  </div>
+<div class="search-box">
+  <tui-svg src="tuiIconSearchLarge"></tui-svg>
+  <input
+    type="text"
+    name="search"
+    placeholder="Search..."
+    autocomplete="off"
+    [ngModel]="query"
+    (ngModelChange)="onModelChange($event)"
+  />
 </div>
diff --git a/web/projects/marketplace/src/pages/list/search/search.component.scss b/web/projects/marketplace/src/pages/list/search/search.component.scss
index e69de29bb..8f07a43d5 100644
--- a/web/projects/marketplace/src/pages/list/search/search.component.scss
+++ b/web/projects/marketplace/src/pages/list/search/search.component.scss
@@ -0,0 +1,32 @@
+.search-box {
+  color: rgb(244 244 245);
+  background-color: rgb(113 113 122);
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+  border-radius: 9999px;
+  position: relative;
+  display: flex;
+  align-items: center;
+
+  input {
+    margin-top: 0.25rem;
+    background-color: transparent;
+    padding: 0.5rem 0.75rem;
+    &::placeholder {
+      color: rgb(212 212 216);
+    }
+    &:focus {
+      outline: 2px solid transparent;
+      outline-offset: 2px;
+    }
+  }
+
+  *,
+  ::before,
+  ::after {
+    box-sizing: border-box;
+    border-width: 0;
+    border-style: solid;
+    border-color: rgb(var(--tw-color-gray-200) / 1);
+  }
+}
diff --git a/web/projects/marketplace/src/pages/list/search/search.module.ts b/web/projects/marketplace/src/pages/list/search/search.module.ts
index ea60b4fb2..c5fc43f21 100644
--- a/web/projects/marketplace/src/pages/list/search/search.module.ts
+++ b/web/projects/marketplace/src/pages/list/search/search.module.ts
@@ -2,9 +2,10 @@ import { CommonModule } from '@angular/common'
 import { NgModule } from '@angular/core'
 import { FormsModule } from '@angular/forms'
 import { SearchComponent } from './search.component'
+import { TuiSvgModule } from '@taiga-ui/core'
 
 @NgModule({
-  imports: [FormsModule, CommonModule],
+  imports: [FormsModule, CommonModule, TuiSvgModule],
   declarations: [SearchComponent],
   exports: [SearchComponent],
 })
diff --git a/web/projects/marketplace/src/pages/release-notes/release-notes.component.html b/web/projects/marketplace/src/pages/release-notes/release-notes.component.html
index b4d6baa79..635dacd0b 100644
--- a/web/projects/marketplace/src/pages/release-notes/release-notes.component.html
+++ b/web/projects/marketplace/src/pages/release-notes/release-notes.component.html
@@ -1,24 +1,21 @@
-<div
-  class="rounded-xl bg-gradient-to-bl from-zinc-400/75 to-zinc-600 p-px shadow-lg shadow-zinc-400/10 mt-6"
->
-  <div class="bg-zinc-800 rounded-xl p-7 grid grid-flow-row items-center gap-6">
-    <div class="block">
-      <h3 class="text-lg font-bold small-caps">What's new</h3>
-      <p
-        *ngIf="pkg['published-at'] as published"
-        class="text-base font-light mb-1 text-zinc-300"
-      >
+<div class="background-border box-shadow-lg shadow-color-light">
+  <div class="box-container">
+    <div class="box-container-title">
+      <h3 class="small-caps">What's new</h3>
+      <p *ngIf="pkg['published-at'] as published">
         <span class="small-caps">Latest Release</span>
         &nbsp;-&nbsp;
-        <span class="text-sm">{{ published | date: 'medium' }}</span>
+        <span class="box-container-title-date">
+          {{ published | date: 'medium' }}
+        </span>
       </p>
     </div>
-    <div class="flex flex-wrap justify-between gap-6">
-      <div class="text-base">
+    <div class="box-container-details">
+      <div class="box-container-details-version">
         <p>Version {{ pkg.manifest.version }}</p>
         <p
           safeLinks
-          class="flex-wrap mt-1"
+          class="box-container-details-notes"
           [innerHTML]="pkg.manifest['release-notes'] | markdown | dompurify"
         ></p>
       </div>
@@ -27,7 +24,6 @@
         type="button"
         appearance="secondary"
         size="m"
-        class="mt-3 place-self-end sm:place-self-start md:place-self-start lg:place-self-end"
         (click)="showReleaseNotes(template)"
       >
         Previous releases
@@ -39,11 +35,12 @@
 <ng-template #template let-observer>
   <ng-container *ngIf="notes$ | async as notes; else loading">
     <tui-accordion
-      class="max-w-lg"
+      class="max-width-lg"
+      style="max-width: 32rem"
       [closeOthers]="false"
       *ngFor="let note of notes | keyvalue: asIsOrder"
     >
-      <tui-accordion-item class="my-1">
+      <tui-accordion-item style="margin: 0.25rem 0">
         {{ note.key | displayEmver }}
         <ng-template tuiAccordionItemContent>
           <p safeLinks [innerHTML]="note.value | markdown | dompurify"></p>
diff --git a/web/projects/marketplace/src/pages/release-notes/release-notes.component.scss b/web/projects/marketplace/src/pages/release-notes/release-notes.component.scss
index e69de29bb..22964eb1f 100644
--- a/web/projects/marketplace/src/pages/release-notes/release-notes.component.scss
+++ b/web/projects/marketplace/src/pages/release-notes/release-notes.component.scss
@@ -0,0 +1,66 @@
+.box-container {
+  background-color: rgb(39 39 42);
+  border-radius: 0.75rem;
+  padding: 1.75rem;
+  display: grid;
+  grid-auto-flow: row;
+  align-items: center;
+  gap: 1.5rem;
+
+  &-title {
+    display: block;
+
+    h3 {
+      font-size: 1.125rem;
+      line-height: 1.75rem;
+      font-weight: 700;
+    }
+
+    p {
+      font-size: 1rem;
+      line-height: 1.5rem;
+      font-weight: 300;
+      margin-bottom: 0.25rem;
+      color: rgb(212 212 216);
+    }
+
+    &-date {
+      font-size: 0.875rem;
+      line-height: 1.25rem;
+    }
+  }
+
+  &-details {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    gap: 1.5rem;
+
+    &-version {
+      font-size: 1rem;
+      line-height: 1.5rem;
+    }
+
+    &-notes {
+      flex-wrap: wrap;
+      margin-top: 0.25rem;
+    }
+
+    button {
+      margin-top: 0.75rem;
+      place-self: end;
+
+      // @media (min-width: 640px) {
+      //   place-self: start;
+      // }
+
+      @media (min-width: 768px) {
+        place-self: start;
+      }
+
+      @media (min-width: 1024px) {
+        place-self: end;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/web/projects/marketplace/src/pages/show/about/about.component.html b/web/projects/marketplace/src/pages/show/about/about.component.html
index 0096aeb9c..8624104e8 100644
--- a/web/projects/marketplace/src/pages/show/about/about.component.html
+++ b/web/projects/marketplace/src/pages/show/about/about.component.html
@@ -1,18 +1,16 @@
-<div
-  class="rounded-xl bg-gradient-to-bl from-zinc-400/75 to-zinc-600 p-px shadow-lg shadow-zinc-400/10"
->
-  <div class="lg:col-span-5 xl:col-span-4 bg-zinc-800 rounded-xl p-7">
-    <h2 class="text-lg font-bold small-caps pb-3">Description</h2>
-    <p class="text-base mb-3">
+<div class="background-border box-shadow-lg shadow-color-light">
+  <div class="box-container">
+    <h2 class="additional-detail-title">Description</h2>
+    <p>
       {{ pkg.manifest.description.long }}
     </p>
     <ng-container *ngIf="pkg.manifest.replaces as replaces">
       <div *ngIf="replaces.length">
-        <h2 class="text-lg font-bold small-caps pb-3">Intended to replace</h2>
+        <h2 class="replaces">Intended to replace</h2>
         <tui-tag
           *ngFor="let app; index as i; of: replaces"
           size="l"
-          [class]="i > 0 ? 'ml-1.5 mt-2' : 'mt-2'"
+          [class]="i > 0 ? 'tag-margin-full' : 'tag-margin-empty'"
           [value]="app"
         ></tui-tag>
       </div>
diff --git a/web/projects/marketplace/src/pages/show/about/about.component.scss b/web/projects/marketplace/src/pages/show/about/about.component.scss
index e69de29bb..972fbbe84 100644
--- a/web/projects/marketplace/src/pages/show/about/about.component.scss
+++ b/web/projects/marketplace/src/pages/show/about/about.component.scss
@@ -0,0 +1,31 @@
+.box-container {
+  background-color: rgb(39 39 42);
+  border-radius: 0.75rem;
+  padding: 1.75rem;
+
+  @media (min-width: 1024px) {
+    grid-column: span 5 / span 5;
+  }
+  @media (min-width: 1280px) {
+    grid-column: span 4 / span 4;
+  }
+
+  p {
+    font-size: 1rem;
+    line-height: 1.5rem;
+    margin-bottom: 0.75rem;
+  }
+}
+
+.tag-margin-full {
+  margin-left: 0.375rem;
+  margin-top: 0.5rem;
+}
+
+.tag-margin-empty {
+  margin-top: 0.5rem;
+}
+
+.replaces {
+  font-weight: 600;
+}
\ No newline at end of file
diff --git a/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.html b/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.html
index a38949a00..668f090bd 100644
--- a/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.html
+++ b/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.html
@@ -1,12 +1,8 @@
 <a [href]="url" target="_blank" rel="noreferrer">
-  <div class="flex justify-between items-center">
-    <label [tuiLabel]="label" class="hover:cursor-pointer">
+  <div class="link-container">
+    <label [tuiLabel]="label">
       <tui-line-clamp [content]="url" [linesLimit]="1"></tui-line-clamp>
     </label>
-    <img
-      alt="Open Icon"
-      class="block opacity-70 invert w-4"
-      src="svg/open-outline.svg"
-    />
+    <tui-svg src="tuiIconExternalLinkLarge"></tui-svg>
   </div>
 </a>
diff --git a/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.module.ts b/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.module.ts
index 2e1257040..aaee3d5f0 100644
--- a/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.module.ts
+++ b/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.module.ts
@@ -1,11 +1,11 @@
 import { CommonModule } from '@angular/common'
 import { NgModule } from '@angular/core'
 import { AdditionalLinkComponent } from './additional-link.component'
-import { TuiLabelModule } from '@taiga-ui/core'
+import { TuiLabelModule, TuiSvgModule } from '@taiga-ui/core'
 import { TuiLineClampModule } from '@taiga-ui/kit'
 
 @NgModule({
-  imports: [CommonModule, TuiLabelModule, TuiLineClampModule],
+  imports: [CommonModule, TuiLabelModule, TuiLineClampModule, TuiSvgModule],
   declarations: [AdditionalLinkComponent],
   exports: [AdditionalLinkComponent],
 })
diff --git a/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.scss b/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.scss
index e69de29bb..71974e31a 100644
--- a/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.scss
+++ b/web/projects/marketplace/src/pages/show/additional/additional-link/additional-link.component.scss
@@ -0,0 +1,13 @@
+.link-container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  label:hover {
+    cursor: pointer;
+  }
+
+  tui-svg {
+    opacity: 0.7;
+  }
+}
diff --git a/web/projects/marketplace/src/pages/show/additional/additional.component.html b/web/projects/marketplace/src/pages/show/additional/additional.component.html
index 14a6cbba3..511772365 100644
--- a/web/projects/marketplace/src/pages/show/additional/additional.component.html
+++ b/web/projects/marketplace/src/pages/show/additional/additional.component.html
@@ -1,127 +1,93 @@
-<div
-  class="rounded-xl bg-gradient-to-bl from-zinc-400/75 to-zinc-600 p-px shadow-lg shadow-zinc-400/10"
->
-  <div class="bg-zinc-800 rounded-xl p-7">
-    <h2 class="text-lg font-bold small-caps pb-3">Information</h2>
-    <div class="grid grid-flow-row divide-y divide-zinc-500">
+<div class="background-border shadow-color-light box-shadow-lg">
+  <div class="box-container">
+    <h2 class="additional-detail-title">Information</h2>
+    <div class="detail-container">
       <!-- git hash -->
       <div
         *ngIf="pkg.manifest['git-hash'] as gitHash; else noHash"
         button
         detail="false"
-        class="py-3 px-1 flex flex-wrap justify-between items-center"
+        class="detail-container-item item-padding item-copy"
         (click)="copyService.copy(gitHash)"
       >
-        <label tuiLabel="Git Hash">{{ gitHash }}</label>
-        <img
-          alt="Copy Icon"
-          class="block opacity-70 invert w-4 hover:cursor-copy"
-          src="svg/copy-outline.svg"
-        />
+        <label class="git-hash-label" tuiLabel="Git Hash">{{ gitHash }}</label>
+        <tui-svg src="tuiIconCopyLarge"></tui-svg>
       </div>
       <ng-template #noHash>
-        <div class="py-3 px-1">
+        <div class="item-padding">
           <label tuiLabel="Git Hash">Unknown</label>
         </div>
       </ng-template>
       <!-- license -->
       <div
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
+        class="detail-container-item item-padding item-pointer"
         (click)="presentModalMd('License')"
       >
-        <div class="flex flex-wrap justify-between items-center">
-          <label tuiLabel="License" class="hover:cursor-pointer">
-            {{ pkg.manifest.license }}
-          </label>
-          <img
-            alt="Open Icon"
-            class="block opacity-70 invert w-4"
-            src="svg/chevron-forward.svg"
-          />
-        </div>
+        <label tuiLabel="License">
+          {{ pkg.manifest.license }}
+        </label>
+        <tui-svg src="tuiIconChevronRightLarge"></tui-svg>
       </div>
       <!-- instructions -->
       <div
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
+        class="detail-container-item item-padding item-pointer"
         (click)="presentModalMd('Instructions')"
       >
-        <div class="flex flex-wrap justify-between items-center">
-          <label tuiLabel="Instructions" class="hover:cursor-pointer">
-            Click to view instructions
-          </label>
-          <img
-            alt="Open Icon"
-            class="block opacity-70 invert w-4"
-            src="svg/chevron-forward.svg"
-          />
-        </div>
+        <label tuiLabel="Instructions">Click to view instructions</label>
+        <tui-svg src="tuiIconChevronRightLarge"></tui-svg>
       </div>
-
       <!-- versions -->
       <div
+        class="detail-container-item item-padding item-pointer"
         (click)="presentAlertVersions(version)"
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
       >
-        <div class="flex flex-wrap justify-between items-center">
-          <label tuiLabel="Other versions" class="hover:cursor-pointer">
-            Click to view other versions
-          </label>
-          <img
-            alt="Open Icon"
-            class="block opacity-70 invert w-4"
-            src="svg/chevron-forward.svg"
-          />
-        </div>
-        <ng-template #version let-data="data" let-completeWith="completeWith">
-          <tui-radio-list
-            class="radio"
-            size="l"
-            [items]="data.items"
-            [itemContent]="displayEmver | tuiStringifyContent"
-            [(ngModel)]="data.value"
-          ></tui-radio-list>
-          <footer class="buttons">
-            <button
-              tuiButton
-              appearance="secondary"
-              (click)="completeWith(null)"
-            >
-              Cancel
-            </button>
-            <button
-              tuiButton
-              appearance="secondary"
-              (click)="completeWith(data.value)"
-            >
-              Ok
-            </button>
-          </footer>
-        </ng-template>
+        <label tuiLabel="Other versions">Click to view other versions</label>
+        <tui-svg src="tuiIconChevronRightLarge"></tui-svg>
       </div>
+      <ng-template #version let-data="data" let-completeWith="completeWith">
+        <tui-radio-list
+          size="l"
+          [items]="data.items"
+          [itemContent]="displayEmver | tuiStringifyContent"
+          [(ngModel)]="data.value"
+        ></tui-radio-list>
+        <footer class="buttons">
+          <button tuiButton appearance="secondary" (click)="completeWith(null)">
+            Cancel
+          </button>
+          <button
+            tuiButton
+            appearance="secondary"
+            (click)="completeWith(data.value)"
+          >
+            Ok
+          </button>
+        </footer>
+      </ng-template>
       <!-- links -->
       <marketplace-additional-link
         [url]="pkg.manifest['marketing-site']"
         *ngIf="pkg.manifest['marketing-site']"
         label="Marketing Site"
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
+        class="item-padding item-pointer"
       ></marketplace-additional-link>
       <marketplace-additional-link
         [url]="pkg.manifest['upstream-repo']"
         *ngIf="pkg.manifest['upstream-repo']"
         label="Source Repository"
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
+        class="item-padding item-pointer"
       ></marketplace-additional-link>
       <marketplace-additional-link
         [url]="pkg.manifest['wrapper-repo']"
         *ngIf="pkg.manifest['wrapper-repo']"
         label="Wrapper Repository"
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
+        class="item-padding item-pointer"
       ></marketplace-additional-link>
       <marketplace-additional-link
         [url]="pkg.manifest['support-site']"
         *ngIf="pkg.manifest['support-site']"
         label="Support Site"
-        class="py-3 px-1 hover:bg-zinc-500/10 hover:cursor-pointer"
+        class="item-padding item-pointer"
       ></marketplace-additional-link>
     </div>
   </div>
diff --git a/web/projects/marketplace/src/pages/show/additional/additional.component.scss b/web/projects/marketplace/src/pages/show/additional/additional.component.scss
index e69de29bb..d4607d6e1 100644
--- a/web/projects/marketplace/src/pages/show/additional/additional.component.scss
+++ b/web/projects/marketplace/src/pages/show/additional/additional.component.scss
@@ -0,0 +1,56 @@
+.box-container {
+  background-color: rgb(39 39 42);
+  border-radius: 0.75rem;
+  padding: 1.75rem;
+}
+
+.detail-container {
+  display: grid;
+  grid-auto-flow: row;
+
+  & > * + * {
+    border-top-width: 1px;
+    border-bottom-width: 0px;
+    border-color: rgb(113 113 122);
+  }
+
+  &-item {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    align-items: center;
+  }
+}
+
+.item {
+  &-padding {
+    padding: 0.75rem 0.25rem;
+  }
+
+  &-pointer:hover {
+    cursor: pointer;
+    background-color: rgb(113 113 122 / 0.1);
+  }
+
+  &-copy:hover {
+    cursor: copy;
+    background-color: rgb(113 113 122 / 0.1);
+  }
+}
+
+::ng-deep .t-text {
+  font-weight: 600;
+}
+
+*,
+::before,
+::after {
+  box-sizing: border-box;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgb(var(--tw-color-gray-200) / 1);
+}
+
+.git-hash-label {
+  font-size: 0.73rem;
+}
\ No newline at end of file
diff --git a/web/projects/marketplace/src/pages/show/additional/additional.module.ts b/web/projects/marketplace/src/pages/show/additional/additional.module.ts
index e84ac26b7..56414ed66 100644
--- a/web/projects/marketplace/src/pages/show/additional/additional.module.ts
+++ b/web/projects/marketplace/src/pages/show/additional/additional.module.ts
@@ -6,7 +6,7 @@ import {
   TuiStringifyContentPipeModule,
 } from '@taiga-ui/kit'
 import { FormsModule } from '@angular/forms'
-import { TuiButtonModule, TuiLabelModule } from '@taiga-ui/core'
+import { TuiButtonModule, TuiLabelModule, TuiSvgModule } from '@taiga-ui/core'
 import { AdditionalLinkModule } from './additional-link/additional-link.component.module'
 
 @NgModule({
@@ -18,6 +18,7 @@ import { AdditionalLinkModule } from './additional-link/additional-link.componen
     TuiButtonModule,
     TuiLabelModule,
     AdditionalLinkModule,
+    TuiSvgModule,
   ],
   declarations: [AdditionalComponent],
   exports: [AdditionalComponent],
diff --git a/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.html b/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.html
index d2b86b1c1..a11f7f65e 100644
--- a/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.html
+++ b/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.html
@@ -1,14 +1,9 @@
-<div
-  class="bg-zinc-700/40 rounded-xl py-3 px-5 gap-2 drop-shadow-lg hover:bg-zinc-700/70"
->
-  <div class="flex items-center gap-6">
-    <tui-avatar
-      class="w-16 pointer-events-none rounded-full object-cover drop-shadow-lg"
-      [src]="getImage(dep.key)"
-    ></tui-avatar>
-    <div class="mt-3">
-      <div class="flex flex-wrap items-center gap-1 mb-1">
-        <span class="block text-base font-medium text-zinc-50/90 line-clamp-1">
+<div class="outer-container">
+  <div class="inner-container">
+    <tui-avatar class="dep-img" [src]="getImage(dep.key)"></tui-avatar>
+    <div class="wrapper-margin">
+      <div class="inner-container-title">
+        <span>
           {{ getTitle(dep.key) }}
         </span>
         <p>
@@ -19,10 +14,10 @@
           </ng-container>
         </p>
       </div>
-      <span class="text-sm text-zinc-50/70 line-clamp-1">
+      <span class="inner-container-version">
         {{ dep.value.version | displayEmver }}
       </span>
-      <span class="text-sm text-zinc-50/70 h-11 line-clamp-2">
+      <span class="inner-container-description">
         {{ dep.value.description }}
       </span>
     </div>
diff --git a/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.scss b/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.scss
index e69de29bb..0faf44d98 100644
--- a/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.scss
+++ b/web/projects/marketplace/src/pages/show/dependencies/dependencies.component.scss
@@ -0,0 +1,73 @@
+.outer-container {
+  background-color: rgb(63 63 70 / 0.4);
+  border-radius: 0.75rem;
+  padding: 0.75rem 1.25rem;
+  gap: 0.5rem;
+  filter: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04))
+    drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
+
+  &:hover {
+    background-color: rgb(63 63 70 / 0.7);
+  }
+}
+
+.inner-container {
+  display: flex;
+  align-items: center;
+  gap: 1.5rem;
+
+  &-title {
+    margin-bottom: 0.25rem;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 0.25rem;
+
+    span {
+      display: block;
+      font-size: 1rem;
+      line-height: 1.5rem;
+      font-weight: 500;
+      color: rgb(250 250 250 / 0.9);
+      overflow: hidden;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 1;
+    }
+  }
+
+  &-version {
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+    color: rgb(250 250 250 / 0.7);
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+  }
+
+  &-description {
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+    color: rgb(250 250 250 / 0.7);
+    height: 2.75rem;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+}
+
+::ng-deep .dep-img {
+  width: 4rem;
+  pointer-events: none;
+  border-radius: 9999px;
+  object-fit: cover;
+  filter: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04))
+    drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
+  margin-bottom: 0.75rem;
+}
+
+.wrapper-margin {
+  margin-top: 0.75rem;
+}
diff --git a/web/projects/marketplace/src/pages/show/hero/hero.component.ts b/web/projects/marketplace/src/pages/show/hero/hero.component.ts
index dfc9e1398..f8a82d7cc 100644
--- a/web/projects/marketplace/src/pages/show/hero/hero.component.ts
+++ b/web/projects/marketplace/src/pages/show/hero/hero.component.ts
@@ -7,35 +7,28 @@ import { MimeTypePipeModule } from '../../../pipes/mime-type.pipe'
 @Component({
   selector: 'marketplace-package-hero',
   template: `
-    <div class="flex justify-center mt-10 md:mt-0 z-0">
-      <div
-        class="flex flex-col w-full h-[32vh] xs:h-[26vh] md:min-h-[14rem] relative rounded-3xl pt-16 px-8 shadow-lg"
-      >
+    <div class="outer-container">
+      <div class="inner-container box-shadow-lg">
         <!-- icon -->
         <img
           [src]="pkg | mimeType | trustUrl"
-          class="w-24 h-24 pointer-events-none rounded-full object-cover shadow-lg absolute -top-9 left-7 z-10"
+          class="box-shadow-lg"
           alt="{{ pkg.manifest.title }} Icon"
         />
         <!-- color background -->
-        <div
-          class="overflow-hidden absolute w-full h-full top-0 left-0 rounded-3xl bg-zinc-800"
-        >
+        <div class="color-background">
           <img
             [src]="pkg | mimeType | trustUrl"
-            class="absolute object-cover pointer-events-none w-[200%] h-[200%] max-w-[200%] blur-[100px] saturate-150 rounded-full"
             alt="{{ pkg.manifest.title }} background image"
           />
         </div>
         <!-- background darkening overlay -->
-        <div
-          class="overflow-hidden absolute w-full h-full top-0 left-0 rounded-3xl bg-zinc-700 opacity-70"
-        ></div>
-        <div class="my-4 text-zinc-50 mix-blend-plus-lighter">
-          <h2 class="text-2xl font-medium line-clamp-1 mb-1">
+        <div class="dark-overlay"></div>
+        <div class="inner-container-title">
+          <h2>
             {{ pkg.manifest.title }}
           </h2>
-          <p class="block text-base line-clamp-2">
+          <p>
             {{ pkg.manifest.description.short }}
           </p>
         </div>
@@ -44,7 +37,111 @@ import { MimeTypePipeModule } from '../../../pipes/mime-type.pipe'
       </div>
     </div>
   `,
-  styles: [],
+  styles: [
+    `
+      .outer-container {
+        display: flex;
+        justify-content: center;
+        margin-top: 2.5rem;
+        z-index: 0;
+
+        @media (min-width: 768px) {
+          margin-top: 0px;
+        }
+      }
+
+      .inner-container {
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+        height: 32vh;
+        position: relative;
+        border-radius: 1.5rem;
+        padding: 4rem 2rem 0 2rem;
+
+        @media (min-width: 376px) {
+          height: 26vh;
+        }
+        @media (min-width: 768px) {
+          min-height: 14rem;
+        }
+
+        img {
+          width: 6rem;
+          height: 6rem;
+          pointer-events: none;
+          border-radius: 9999px;
+          object-fit: cover;
+          position: absolute;
+          top: -2.25rem;
+          left: 1.75rem;
+          z-index: 1;
+        }
+
+        .inner-container-title {
+          margin: 1rem 0;
+          color: rgb(250 250 250);
+          mix-blend-mode: plus-lighter;
+          z-index: 1;
+
+          h2 {
+            font-size: 1.5rem;
+            line-height: 2rem;
+            font-weight: 500;
+            overflow: hidden;
+            display: -webkit-box;
+            -webkit-box-orient: vertical;
+            -webkit-line-clamp: 1;
+            margin-bottom: 0.25rem;
+          }
+
+          p {
+            display: block;
+            font-size: 1rem;
+            line-height: 1.5rem;
+            overflow: hidden;
+            display: -webkit-box;
+            -webkit-box-orient: vertical;
+            -webkit-line-clamp: 2;
+          }
+        }
+
+        .color-background {
+          overflow: hidden;
+          position: absolute;
+          width: 100%;
+          height: 100%;
+          top: 0px;
+          left: 0px;
+          z-index: -50;
+          border-radius: 1.5rem;
+          background-color: rgb(39 39 42);
+
+          img {
+            position: absolute;
+            object-fit: cover;
+            pointer-events: none;
+            width: 200%;
+            height: 200%;
+            max-width: 200%;
+            filter: blur(100px) saturate(1.5);
+          }
+        }
+
+        .dark-overlay {
+          overflow: hidden;
+          position: absolute;
+          width: 100%;
+          height: 100%;
+          top: 0px;
+          left: 0px;
+          border-radius: 1.5rem;
+          background-color: rgb(63 63 70);
+          opacity: 0.7;
+        }
+      }
+    `,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [CommonModule, SharedPipesModule, MimeTypePipeModule],
diff --git a/web/projects/marketplace/src/pages/show/screenshots/screenshots.component.ts b/web/projects/marketplace/src/pages/show/screenshots/screenshots.component.ts
index a7d3c4fb2..8566473a3 100644
--- a/web/projects/marketplace/src/pages/show/screenshots/screenshots.component.ts
+++ b/web/projects/marketplace/src/pages/show/screenshots/screenshots.component.ts
@@ -18,11 +18,7 @@ import { PolymorpheusContent } from '@tinkoff/ng-polymorpheus'
 @Component({
   selector: 'marketplace-package-screenshots',
   template: `
-    <div
-      *ngIf="pkg.screenshots"
-      tuiCarouselButtons
-      class="flex items-center content-center m-0 lg:-ml-14 lg:-mr-14 lg:min-h-80 lg:h-80 2xl:h-full"
-    >
+    <div *ngIf="pkg.screenshots" tuiCarouselButtons class="outer-container">
       <button
         tuiIconButton
         appearance="flat"
@@ -35,27 +31,27 @@ import { PolymorpheusContent } from '@tinkoff/ng-polymorpheus'
         #carousel
         [itemsCount]="isMobile ? 1 : 2"
         [(index)]="index"
-        class="overflow-y-hidden overflow-x-scroll carousel overflow-hidden"
+        class="carousel"
       >
         <ng-container *ngFor="let item of pkg.screenshots; let i = index">
           <div
             *tuiItem
             draggable="false"
             [class.item_active]="i === index + 1"
-            class="object-cover overflow-hidden rounded-lg md:rounded-xl border border-zinc-400/30 hover:cursor-pointer shadow-lg shadow-zinc-400/10"
+            class="screenshot-item box-shadow-lg"
           >
             <img
               #template
               alt="Service screenshot"
               src="assets/img/temp/{{ item }}"
-              class="w-full h-full rounded-lg md:rounded-xl"
+              class="screenshot-item-img"
               (click)="presentModalImg(dialogTemplate)"
             />
             <ng-template #dialogTemplate let-observer>
               <img
                 alt="Service screenshot"
                 src="assets/img/temp/{{ item }}"
-                class="rounded-none"
+                class="screenshot-item-img-enlarged"
               />
             </ng-template>
           </div>
@@ -71,7 +67,65 @@ import { PolymorpheusContent } from '@tinkoff/ng-polymorpheus'
       ></button>
     </div>
   `,
-  styles: [],
+  styles: [
+    `
+      .outer-container {
+        display: flex;
+        align-items: center;
+        align-content: center;
+        margin: 0px;
+
+        @media (min-width: 1024px) {
+          margin-left: -3.5rem;
+          margin-right: -3.5rem;
+          min-height: 20rem;
+          height: 20rem;
+        }
+        @media (min-width: 1536px) {
+          height: 100%;
+        }
+      }
+
+      .carousel {
+        overflow-y: hidden;
+        overflow-x: scroll;
+        overflow: hidden;
+      }
+
+      .screenshot-item {
+        --tw-shadow-color: rgb(161 161 170 / 0.1);
+        --tw-shadow: var(--tw-shadow-colored);
+
+        object-fit: cover;
+        overflow: hidden;
+        border-radius: 0.5rem;
+        border-width: 1px;
+        border-color: rgb(161 161 170 / 0.3);
+
+        &:hover {
+          cursor: pointer;
+        }
+
+        @media (min-width: 768px) {
+          border-radius: 0.75rem;
+        }
+
+        .screenshot-item-img {
+          width: 100%;
+          height: 100%;
+          border-radius: 0.5rem;
+
+          @media (min-width: 768px) {
+            border-radius: 0.75rem;
+          }
+
+          .screenshot-item-img-enlarged {
+            border-radius: 0px;
+          }
+        }
+      }
+    `,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [CommonModule, TuiCarouselModule, TuiButtonModule],
diff --git a/web/projects/marketplace/tailwind.config.js b/web/projects/marketplace/tailwind.config.js
deleted file mode 100644
index 470fb582e..000000000
--- a/web/projects/marketplace/tailwind.config.js
+++ /dev/null
@@ -1,11 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: ['./src/**/*.{html,ts}'],
-  theme: {
-    extend: {},
-    fontFamily: {
-      sans: ['Montserrat', 'sans-serif'],
-    },
-  },
-  plugins: [],
-}
diff --git a/web/projects/shared/package.json b/web/projects/shared/package.json
index 77f70e0b7..d4a327209 100644
--- a/web/projects/shared/package.json
+++ b/web/projects/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@start9labs/shared",
-  "version": "0.3.6",
+  "version": "0.3.9",
   "peerDependencies": {
     "@angular/common": "^17.0.6",
     "@angular/core": "^17.0.6",
diff --git a/web/projects/shared/src/components/initializing/initializing.component.ts b/web/projects/shared/src/components/initializing/initializing.component.ts
index 5fc86f85d..6d28baa5d 100644
--- a/web/projects/shared/src/components/initializing/initializing.component.ts
+++ b/web/projects/shared/src/components/initializing/initializing.component.ts
@@ -41,7 +41,7 @@ import { SetupService } from '../../services/setup.service'
       padding: 1rem;
       margin: 1.5rem;
       text-align: center;
-      // TODO: Theme
+      /* TODO: Theme */
       background: #e0e0e0;
       color: #333;
       --tui-clear-inverse: rgba(0, 0, 0, 0.1);
@@ -56,7 +56,7 @@ import { SetupService } from '../../services/setup.service'
       text-align: left;
       overflow: hidden;
       border-radius: 2rem;
-      // TODO: Theme
+      /* TODO: Theme */
       background: #181818;
     }
   `,
diff --git a/web/projects/shared/src/components/markdown/markdown.component.scss b/web/projects/shared/src/components/markdown/markdown.component.scss
index dc3098ef1..590950151 100644
--- a/web/projects/shared/src/components/markdown/markdown.component.scss
+++ b/web/projects/shared/src/components/markdown/markdown.component.scss
@@ -4,4 +4,15 @@
 
 :host ::ng-deep img {
   border-radius: 0 !important;
+}
+
+:host ::ng-deep h1,
+:host ::ng-deep h2,
+:host ::ng-deep h3,
+:host ::ng-deep h4,
+:host ::ng-deep h5,
+:host ::ng-deep h6,
+:host ::ng-deep hr,
+:host ::ng-deep p {
+  margin: revert;
 }
\ No newline at end of file
diff --git a/web/projects/shared/src/util/convert-ansi.ts b/web/projects/shared/src/util/convert-ansi.ts
index 67d934456..f38a97a39 100644
--- a/web/projects/shared/src/util/convert-ansi.ts
+++ b/web/projects/shared/src/util/convert-ansi.ts
@@ -1,7 +1,7 @@
 import { Log } from '../types/api'
 import { toLocalIsoString } from './to-local-iso-string'
+import Convert from 'ansi-to-html'
 
-const Convert = require('ansi-to-html')
 const CONVERT = new Convert({
   bg: 'transparent',
   colors: { 4: 'Cyan' },
diff --git a/web/projects/shared/styles/shared.scss b/web/projects/shared/styles/shared.scss
index 4bcedd0f4..73d206721 100644
--- a/web/projects/shared/styles/shared.scss
+++ b/web/projects/shared/styles/shared.scss
@@ -86,10 +86,12 @@ ion-modal {
 }
 
 .divider {
-  background: linear-gradient(90deg,
-      var(--ion-color-light) 0,
-      var(--ion-color-dark) 50%,
-      var(--ion-color-light) 100%);
+  background: linear-gradient(
+    90deg,
+    var(--ion-color-light) 0,
+    var(--ion-color-dark) 50%,
+    var(--ion-color-light) 100%
+  );
   height: 1px;
 }
 
@@ -112,11 +114,11 @@ ion-modal {
 }
 
 .color-success-shade {
-  color: var(--ion-color-success-shade)
+  color: var(--ion-color-success-shade);
 }
 
 .color-primary-shade {
-  color: var(--ion-color-primary-shade)
+  color: var(--ion-color-primary-shade);
 }
 
 @keyframes ellipsis-dot {
@@ -167,3 +169,63 @@ a {
   gap: 16px;
   margin-top: 24px;
 }
+
+/* marketplace */
+.background-border {
+  border-radius: 0.75rem;
+  background-image: linear-gradient(
+    to bottom left,
+    rgb(161 161 170 / 0.75),
+    #52525b
+  );
+  padding: 1px;
+  margin-top: 1.5rem;
+}
+
+.box-shadow-lg {
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),
+    0 4px 6px -4px var(--tw-shadow-color);
+  box-shadow:
+    0 0 #0000,
+    0 0 #0000,
+    var(--tw-shadow);
+}
+
+.shadow-color-light {
+  --tw-shadow-color: rgb(161 161 170 / 0.1);
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
+.additional-detail-title {
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+  font-weight: 700;
+  padding-bottom: 0.75rem;
+  font-variant: all-small-caps;
+}
+
+.buttons {
+  margin-top: 0.5rem;
+
+  :first-child {
+    margin-right: 0.5rem;
+  }
+}
+
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+p {
+  margin: 0;
+}
\ No newline at end of file
diff --git a/web/projects/shared/styles/variables.scss b/web/projects/shared/styles/variables.scss
index baff4ea61..6a9d364b9 100644
--- a/web/projects/shared/styles/variables.scss
+++ b/web/projects/shared/styles/variables.scss
@@ -86,10 +86,49 @@
   --ion-color-step-900: #e7e7e7;
   --ion-color-step-950: #f3f3f3;
 
-  --alt-red: #FF4961;
-  --alt-orange: #F89248;
-  --alt-yellow: #E5D53E;
-  --alt-green: #3DCF6F;
-  --alt-blue: #00A8A8;
-  --alt-purple: #9747FF;
+  --alt-red: #ff4961;
+  --alt-orange: #f89248;
+  --alt-yellow: #e5d53e;
+  --alt-green: #3dcf6f;
+  --alt-blue: #00a8a8;
+  --alt-purple: #9747ff;
+
+  --portal-header-height: 56px;
+
+  // @TODO rename when make style lib
+  --tw-color-black: 0 0 0;
+  --tw-color-white: 255 255 255;
+  --tw-color-slate-50: 248 250 252;
+  --tw-color-slate-100: 241 245 249;
+  --tw-color-slate-200: 226 232 240;
+  --tw-color-slate-300: 203 213 225;
+  --tw-color-slate-400: 148 163 184;
+  --tw-color-slate-500: 100 116 139;
+  --tw-color-slate-600: 71 85 105;
+  --tw-color-slate-700: 51 65 85;
+  --tw-color-slate-800: 30 41 59;
+  --tw-color-slate-900: 15 23 42;
+  --tw-color-slate-950: 2 6 23;
+  --tw-color-gray-50: 249 250 251;
+  --tw-color-gray-100: 243 244 246;
+  --tw-color-gray-200: 229 231 235;
+  --tw-color-gray-300: 209 213 219;
+  --tw-color-gray-400: 156 163 175;
+  --tw-color-gray-500: 107 114 128;
+  --tw-color-gray-600: 75 85 99;
+  --tw-color-gray-700: 55 65 81;
+  --tw-color-gray-800: 31 41 55;
+  --tw-color-gray-900: 17 24 39;
+  --tw-color-gray-950: 3 7 18;
+  --tw-color-zinc-50: 250 250 250;
+  --tw-color-zinc-100: 244 244 245;
+  --tw-color-zinc-200: 228 228 231;
+  --tw-color-zinc-300: 212 212 216;
+  --tw-color-zinc-400: 161 161 170;
+  --tw-color-zinc-500: 113 113 122;
+  --tw-color-zinc-600: 82 82 91;
+  --tw-color-zinc-700: 63 63 70;
+  --tw-color-zinc-800: 39 39 42;
+  --tw-color-zinc-900: 24 24 27;
+  --tw-color-zinc-950: 9 9 11;
 }
diff --git a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/controls.component.ts b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/controls.component.ts
index c46290d7d..552fe76a5 100644
--- a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/controls.component.ts
+++ b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/controls.component.ts
@@ -31,7 +31,6 @@ import { MarketplaceService } from 'src/app/services/marketplace.service'
 import { hasCurrentDeps } from 'src/app/util/has-deps'
 import { getAllPackages } from 'src/app/util/get-package-data'
 import { dryUpdate } from 'src/app/util/dry-update'
-import { SidebarService } from 'src/app/services/sidebar.service'
 import { MarketplaceAlertsService } from '../services/alerts.service'
 
 @Component({
diff --git a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/menu.component.ts b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/menu.component.ts
index f135ec30d..a900b3a21 100644
--- a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/menu.component.ts
+++ b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/menu.component.ts
@@ -15,21 +15,28 @@ import { MARKETPLACE_REGISTRY } from '../modals/registry.component'
         tuiIconButton
         type="button"
         appearance="icon"
-        icon="tuiIconRepeat"
+        icon="tuiIconRepeatLarge"
         (click)="changeRegistry()"
       >
         Change Registry
       </button>
-      <button
-        slot="mobile"
-        class="flex gap-2 p-5 text-base"
-        (click)="changeRegistry()"
-      >
-        <tui-icon tuiAppearance="icon" icon="tuiIconRepeat"></tui-icon>
+      <button slot="mobile" class="mobile-button" (click)="changeRegistry()">
+        <tui-icon tuiAppearance="icon" icon="tuiIconRepeatLarge"></tui-icon>
         Change Registry
       </button>
     </menu>
   `,
+  styles: [
+    `
+      .mobile-button {
+        display: flex;
+        gap: 0.5rem;
+        padding: 1.25rem;
+        font-size: 1rem;
+        line-height: 1.5rem;
+      }
+    `,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   imports: [MenuModule, TuiButtonModule, TuiIconModule, TuiAppearanceModule],
 })
diff --git a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/notification.component.ts b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/notification.component.ts
index f074ee9e4..463243086 100644
--- a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/notification.component.ts
+++ b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/notification.component.ts
@@ -7,7 +7,11 @@ import { ConfigService } from 'src/app/services/config.service'
   standalone: true,
   selector: 'marketplace-notification',
   template: `
-    <tui-notification [status]="status || 'warning'" icon="" class="m-4">
+    <tui-notification
+      [status]="status || 'warning'"
+      icon=""
+      class="notification-wrapper"
+    >
       @switch (status) {
         @case ('success') {
           Services from this registry are packaged and maintained by the Start9
@@ -48,6 +52,13 @@ import { ConfigService } from 'src/app/services/config.service'
       }
     </tui-notification>
   `,
+  styles: [
+    `
+      .notification-wrapper {
+        margin: 1rem;
+      }
+    `,
+  ],
   imports: [TuiNotificationModule],
 })
 export class MarketplaceNotificationComponent {
diff --git a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/tile.component.ts b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/tile.component.ts
index 04a1acf87..ab3d521bc 100644
--- a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/tile.component.ts
+++ b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/components/tile.component.ts
@@ -30,7 +30,7 @@ import { MarketplaceSidebarService } from '../services/sidebar.service'
           direction: 'right';
           autoWidth: true
         "
-        class="overflow-y-auto max-w-full md:max-w-[30rem]"
+        class="preview-wrapper"
         [pkg]="pkg"
         (tuiActiveZoneChange)="toggle($event)"
       >
@@ -38,7 +38,7 @@ import { MarketplaceSidebarService } from '../services/sidebar.service'
           tuiAutoFocus
           slot="close"
           size="xs"
-          class="place-self-end"
+          class="close-button"
           tuiIconButton
           type="button"
           appearance="icon"
@@ -47,7 +47,7 @@ import { MarketplaceSidebarService } from '../services/sidebar.service'
         ></button>
         <marketplace-controls
           slot="controls"
-          class="flex justify-start gap-2"
+          class="controls-wrapper"
           [pkg]="pkg"
           [localPkg]="pkg.manifest.id | toLocal | async"
         />
@@ -70,6 +70,25 @@ import { MarketplaceSidebarService } from '../services/sidebar.service'
           opacity: 1;
         }
       }
+
+      .preview-wrapper {
+        overflow-y: auto;
+        max-width: 100%;
+
+        @media (min-width: 768px) {
+          max-width: 30rem;
+        }
+      }
+
+      .close-button {
+        place-self: end;
+      }
+
+      .controls-wrapper {
+        display: flex;
+        justify-content: flex-start;
+        gap: 0.5rem;
+      }
     `,
   ],
   changeDetection: ChangeDetectionStrategy.OnPush,
diff --git a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/marketplace.component.ts b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/marketplace.component.ts
index 36bef755d..143a47e0e 100644
--- a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/marketplace.component.ts
+++ b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/marketplace.component.ts
@@ -17,30 +17,26 @@ import { MarketplaceSidebarsComponent } from './components/sidebars.component'
   standalone: true,
   template: `
     <marketplace-menu />
-    <div
-      class="sm:pl-[34vw] md:pl-[28vw] lg:pl-[22vw] 2xl:pl-[280px] min-h-screen flex justify-between overflow-auto scroll-smooth"
-    >
-      <div class="pt-24 sm:pt-3 md:pb-10 md:px-8">
+    <div class="marketplace-content-wrapper">
+      <div class="marketplace-content-inner">
         <marketplace-notification [url]="(details$ | async)?.url || ''" />
-        <div class="mt-8 px-6 mb-10">
-          <h1 class="text-4xl sm:text-5xl font-bold text-zinc-50/80">
+        <div class="title-wrapper">
+          <h1>
             {{ category$ | async | titlecase }}
           </h1>
         </div>
         @if (filtered$ | async; as filtered) {
-          <section
-            class="p-6 md:p-8 grid grid-cols-1 xl:grid-cols-2 2xl:grid-cols-3 gap-16 list-none"
-          >
+          <section class="marketplace-content-list">
             @for (pkg of filtered; track $index) {
               <marketplace-tile
                 [pkg]="pkg"
                 [style.--animation-order]="$index"
-                class="block h-full"
+                class="tile-wrapper"
               />
             }
           </section>
         } @else {
-          <h1 class="text-xl pl-6">
+          <h1 class="loading-text">
             Loading
             <span class="loading-dots"></span>
           </h1>
@@ -58,6 +54,96 @@ import { MarketplaceSidebarsComponent } from './components/sidebars.component'
         background: #18181b url('/assets/img/background.png') no-repeat top
           right;
       }
+
+      ::ng-deep menu {
+        margin: 0;
+        padding: 0;
+      }
+
+      ::ng-deep button {
+        background-color: transparent;
+        background-image: none;
+      }
+
+      .marketplace-content {
+        &-wrapper {
+          display: flex;
+          justify-content: space-between;
+          overflow: auto;
+          scroll-behavior: smooth;
+          min-height: 100vh;
+
+          @media (min-width: 640px) {
+            padding-left: 34vw;
+          }
+          @media (min-width: 768px) {
+            padding-left: 28vw;
+          }
+          @media (min-width: 1024px) {
+            padding-left: 22vw;
+          }
+          @media (min-width: 1536px) {
+            padding-left: 280px;
+          }
+        }
+
+        &-inner {
+          padding-top: 6rem;
+
+          @media (min-width: 640px) {
+            padding-top: 0.75rem;
+          }
+          @media (min-width: 768px) {
+            padding: 0 2rem 2.5rem 2rem;
+          }
+
+          .title-wrapper {
+            margin: 2rem 0 2.5rem 0;
+            padding: 0 1.5rem;
+
+            h1 {
+              font-size: 2.25rem;
+              line-height: 2.5rem;
+              font-weight: 700;
+              color: rgb(250 250 250 / 0.8);
+
+              @media (min-width: 640px) {
+                font-size: 3rem;
+                line-height: 1;
+              }
+            }
+          }
+        }
+
+        &-list {
+          display: grid;
+          grid-template-columns: repeat(1, minmax(0, 1fr));
+          gap: 4rem;
+          list-style-type: none;
+          padding: 1.5rem;
+
+          @media (min-width: 768px) {
+            padding: 2rem;
+          }
+          @media (min-width: 1280px) {
+            grid-template-columns: repeat(2, minmax(0, 1fr));
+          }
+          @media (min-width: 1536px) {
+            grid-template-columns: repeat(3, minmax(0, 1fr));
+          }
+
+          .tile-wrapper {
+            display: block;
+            height: 100%;
+          }
+        }
+      }
+
+      .loading-text {
+        font-size: 1.25rem;
+        line-height: 1.75rem;
+        padding-left: 1.5rem;
+      }
     `,
   ],
   changeDetection: ChangeDetectionStrategy.OnPush,
diff --git a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/modals/preview.component.ts b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/modals/preview.component.ts
index d0f28e631..9fc4ea0cf 100644
--- a/web/projects/ui/src/app/apps/portal/routes/system/marketplace/modals/preview.component.ts
+++ b/web/projects/ui/src/app/apps/portal/routes/system/marketplace/modals/preview.component.ts
@@ -22,7 +22,7 @@ import { Router } from '@angular/router'
 @Component({
   selector: 'marketplace-preview',
   template: `
-    <div class="grid gap-8 p-7 justify-center">
+    <div class="outer-container">
       <ng-content select="[slot=close]" />
       <marketplace-package-hero [pkg]="pkg">
         <ng-content select="[slot=controls]" />
@@ -38,17 +38,13 @@ import { Router } from '@angular/router'
           View more details
         </a>
       }
-      <div class="grid grid-cols-1 gap-x-8">
+      <div class="inner-container">
         <marketplace-about [pkg]="pkg" />
         @if (!(pkg.manifest.dependencies | empty)) {
-          <div
-            class="rounded-xl bg-gradient-to-bl from-zinc-400/75 to-zinc-600 p-px shadow-lg shadow-zinc-400/10 mt-6"
-          >
-            <div class="lg:col-span-5 xl:col-span-4 bg-zinc-800 rounded-xl p-7">
-              <h2 class="text-lg font-bold small-caps my-2 pb-3">
-                Dependencies
-              </h2>
-              <div class="grid grid-row-auto gap-3">
+          <div class="background-border shadow-color-light box-shadow-lg">
+            <div class="dependencies-container">
+              <h2>Dependencies</h2>
+              <div class="dependencies-list">
                 @for (
                   dep of pkg.manifest.dependencies | keyvalue;
                   track $index
@@ -64,11 +60,64 @@ import { Router } from '@angular/router'
           </div>
         }
         <release-notes [pkg]="pkg" />
-        <marketplace-additional class="mt-6" [pkg]="pkg" />
+        <marketplace-additional class="additional-wrapper" [pkg]="pkg" />
       </div>
     </div>
   `,
-  styles: [':host { pointer-events: auto }'],
+  styles: [
+    `
+      :host {
+        pointer-events: auto;
+      }
+
+      .outer-container {
+        display: grid;
+        justify-content: center;
+        gap: 2rem;
+        padding: 1.75rem;
+      }
+
+      .inner-container {
+        display: grid;
+        grid-template-columns: repeat(1, minmax(0, 1fr));
+        column-gap: 2rem;
+      }
+
+      .dependencies {
+        &-container {
+          background-color: rgb(39 39 42);
+          border-radius: 0.75rem;
+          padding: 1.75rem;
+
+          @media (min-width: 1024px) {
+            grid-column: span 5 / span 5;
+          }
+          @media (min-width: 1280px) {
+            grid-column: span 4 / span 4;
+          }
+
+          h2 {
+            font-size: 1.125rem;
+            line-height: 1.75rem;
+            font-weight: 700;
+            margin: 0.5rem 0;
+            padding-bottom: 0.75rem;
+            font-variant: all-small-caps;
+          }
+        }
+
+        &-list {
+          display: grid;
+          grid-auto-rows: auto;
+          gap: 0.75rem;
+        }
+      }
+
+      .additional-wrapper {
+        margin-top: 1.5rem;
+      }
+    `,
+  ],
   standalone: true,
   changeDetection: ChangeDetectionStrategy.OnPush,
   imports: [
diff --git a/web/projects/ui/src/app/services/api/api.fixures.ts b/web/projects/ui/src/app/services/api/api.fixures.ts
index f2bf9cb4e..9ec92a6b3 100644
--- a/web/projects/ui/src/app/services/api/api.fixures.ts
+++ b/web/projects/ui/src/app/services/api/api.fixures.ts
@@ -102,7 +102,7 @@ export module Mock {
       icon: 'icon.png',
     },
     'release-notes':
-      'Dual funded channels! And lots more amazing new features. Also includes several bugfixes and performance enhancements.',
+      '* Dual funded channels! And lots more amazing new features. Also includes several bugfixes and performance enhancements.',
     license: 'MIT',
     'wrapper-repo': 'https://github.com/start9labs/lnd-wrapper',
     'upstream-repo': 'https://github.com/lightningnetwork/lnd',
diff --git a/web/projects/ui/src/app/services/api/embassy-mock-api.service.ts b/web/projects/ui/src/app/services/api/embassy-mock-api.service.ts
index f2bd3218d..9475f9e09 100644
--- a/web/projects/ui/src/app/services/api/embassy-mock-api.service.ts
+++ b/web/projects/ui/src/app/services/api/embassy-mock-api.service.ts
@@ -104,7 +104,8 @@ export class MockApiService extends ApiService {
 
   async getStatic(url: string): Promise<string> {
     await pauseFor(2000)
-    return '' // markdown
+    return `* Test markdown instructions
+* Test markdown instructions with [link](https://start9.com)`
   }
 
   async uploadPackage(guid: string, body: Blob): Promise<void> {
@@ -458,6 +459,7 @@ export class MockApiService extends ApiService {
           'messaging',
           'social',
           'alt coin',
+          'ai',
         ],
       }
       return info
@@ -466,7 +468,8 @@ export class MockApiService extends ApiService {
     } else if (path.startsWith('/package/v0/release-notes')) {
       return Mock.ReleaseNotes
     } else if (path.includes('instructions') || path.includes('license')) {
-      return '' // markdown
+      return `* Test markdown instructions
+* Test markdown instructions with [link](https://start9.com)`
     }
   }
 
diff --git a/web/projects/ui/src/styles.scss b/web/projects/ui/src/styles.scss
index 7af184239..6bb7775c2 100644
--- a/web/projects/ui/src/styles.scss
+++ b/web/projects/ui/src/styles.scss
@@ -1,6 +1,3 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
 @import '@taiga-ui/core/styles/taiga-ui-local';
 
 @font-face {
diff --git a/web/projects/ui/tailwind.config.js b/web/projects/ui/tailwind.config.js
deleted file mode 100644
index 4fab723c2..000000000
--- a/web/projects/ui/tailwind.config.js
+++ /dev/null
@@ -1,25 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: ['./src/**/*.{html,ts}', '../marketplace/src/**/*.{html,ts}'],
-  theme: {
-    extend: {
-      screens: {
-        xs: '376px',
-        '3xl': '1792px',
-        '4xl': '2048px',
-      },
-      colors: {
-        folly: '#FF4961',
-        lime: '#BCFF49',
-        cyan: '#49FFE7',
-        veronica: '#9747ff',
-        tangerine: '#ff8c49',
-        royal: '#4961ff',
-        background: '#222428',
-      },
-    },
-    fontFamily: {
-      sans: ['Montserrat', 'sans-serif'],
-    },
-  },
-}