From 3a9f3c507ddd32bc75367c0a1242da7190cf7d88 Mon Sep 17 00:00:00 2001
From: Carlos Santos <4a.santos@gmail.com>
Date: Thu, 8 May 2025 15:21:00 +0200
Subject: [PATCH] webcomponent: integrate PostCSS with Rollup and add error
 handling in OpenViduMeet component

- Added rollup-plugin-postcss to handle CSS imports in the project.
- Updated rollup.config.js to include PostCSS plugin for CSS injection and minification.
- Created a new styles.css file for component styling.
- Enhanced OpenViduMeet component to manage iframe loading states and display error messages.
- Implemented cleanup method in EventsManager to remove event listeners.
- Added TypeScript declaration for CSS module imports.
---
 frontend/webcomponent/package-lock.json       | 1277 +++++++++++++++++
 frontend/webcomponent/package.json            |    1 +
 frontend/webcomponent/rollup.config.js        |   56 +-
 .../webcomponent/src/assets/css/styles.css    |   36 +
 .../src/components/EventsManager.ts           |    4 +
 .../src/components/OpenViduMeet.ts            |  103 +-
 frontend/webcomponent/src/css.d.ts            |    4 +
 7 files changed, 1459 insertions(+), 22 deletions(-)
 create mode 100644 frontend/webcomponent/src/assets/css/styles.css
 create mode 100644 frontend/webcomponent/src/css.d.ts

diff --git a/frontend/webcomponent/package-lock.json b/frontend/webcomponent/package-lock.json
index 0868c5f..47e8bf3 100644
--- a/frontend/webcomponent/package-lock.json
+++ b/frontend/webcomponent/package-lock.json
@@ -24,6 +24,7 @@
 				"jest-environment-jsdom": "^29.7.0",
 				"playwright": "^1.50.1",
 				"rollup": "^4.34.8",
+				"rollup-plugin-postcss": "^4.0.2",
 				"ts-jest": "^29.2.5",
 				"ts-jest-resolver": "^2.0.1",
 				"ts-node": "^10.9.2",
@@ -1696,6 +1697,16 @@
 				"node": ">= 10"
 			}
 		},
+		"node_modules/@trysound/sax": {
+			"version": "0.2.0",
+			"resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
+			"integrity": "sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": ">=10.13.0"
+			}
+		},
 		"node_modules/@tsconfig/node10": {
 			"version": "1.0.11",
 			"resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz",
@@ -2573,6 +2584,13 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/boolbase": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+			"integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
+			"dev": true,
+			"license": "ISC"
+		},
 		"node_modules/brace-expansion": {
 			"version": "2.0.1",
 			"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
@@ -2756,6 +2774,19 @@
 				"node": ">=6"
 			}
 		},
+		"node_modules/caniuse-api": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-3.0.0.tgz",
+			"integrity": "sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.0.0",
+				"caniuse-lite": "^1.0.0",
+				"lodash.memoize": "^4.1.2",
+				"lodash.uniq": "^4.5.0"
+			}
+		},
 		"node_modules/caniuse-lite": {
 			"version": "1.0.30001700",
 			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001700.tgz",
@@ -2880,6 +2911,13 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/colord": {
+			"version": "2.9.3",
+			"resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz",
+			"integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/combined-stream": {
 			"version": "1.0.8",
 			"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -2914,6 +2952,16 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/concat-with-sourcemaps": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/concat-with-sourcemaps/-/concat-with-sourcemaps-1.1.0.tgz",
+			"integrity": "sha512-4gEjHJFT9e+2W/77h/DS5SGUgwDaOwprX8L/gl5+3ixnzkVJJsZWDSelmN3Oilw3LNDZjZV0yqH1hLG3k6nghg==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"source-map": "^0.6.1"
+			}
+		},
 		"node_modules/convert-source-map": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -2965,6 +3013,168 @@
 				"node": ">= 8"
 			}
 		},
+		"node_modules/css-declaration-sorter": {
+			"version": "6.4.1",
+			"resolved": "https://registry.npmjs.org/css-declaration-sorter/-/css-declaration-sorter-6.4.1.tgz",
+			"integrity": "sha512-rtdthzxKuyq6IzqX6jEcIzQF/YqccluefyCYheovBOLhFT/drQA9zj/UbRAa9J7C0o6EG6u3E6g+vKkay7/k3g==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": "^10 || ^12 || >=14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.0.9"
+			}
+		},
+		"node_modules/css-select": {
+			"version": "4.3.0",
+			"resolved": "https://registry.npmjs.org/css-select/-/css-select-4.3.0.tgz",
+			"integrity": "sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==",
+			"dev": true,
+			"license": "BSD-2-Clause",
+			"dependencies": {
+				"boolbase": "^1.0.0",
+				"css-what": "^6.0.1",
+				"domhandler": "^4.3.1",
+				"domutils": "^2.8.0",
+				"nth-check": "^2.0.1"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/fb55"
+			}
+		},
+		"node_modules/css-tree": {
+			"version": "1.1.3",
+			"resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.1.3.tgz",
+			"integrity": "sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"mdn-data": "2.0.14",
+				"source-map": "^0.6.1"
+			},
+			"engines": {
+				"node": ">=8.0.0"
+			}
+		},
+		"node_modules/css-what": {
+			"version": "6.1.0",
+			"resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz",
+			"integrity": "sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==",
+			"dev": true,
+			"license": "BSD-2-Clause",
+			"engines": {
+				"node": ">= 6"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/fb55"
+			}
+		},
+		"node_modules/cssesc": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+			"integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+			"dev": true,
+			"license": "MIT",
+			"bin": {
+				"cssesc": "bin/cssesc"
+			},
+			"engines": {
+				"node": ">=4"
+			}
+		},
+		"node_modules/cssnano": {
+			"version": "5.1.15",
+			"resolved": "https://registry.npmjs.org/cssnano/-/cssnano-5.1.15.tgz",
+			"integrity": "sha512-j+BKgDcLDQA+eDifLx0EO4XSA56b7uut3BQFH+wbSaSTuGLuiyTa/wbRYthUXX8LC9mLg+WWKe8h+qJuwTAbHw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"cssnano-preset-default": "^5.2.14",
+				"lilconfig": "^2.0.3",
+				"yaml": "^1.10.2"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/cssnano"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/cssnano-preset-default": {
+			"version": "5.2.14",
+			"resolved": "https://registry.npmjs.org/cssnano-preset-default/-/cssnano-preset-default-5.2.14.tgz",
+			"integrity": "sha512-t0SFesj/ZV2OTylqQVOrFgEh5uanxbO6ZAdeCrNsUQ6fVuXwYTxJPNAGvGTxHbD68ldIJNec7PyYZDBrfDQ+6A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"css-declaration-sorter": "^6.3.1",
+				"cssnano-utils": "^3.1.0",
+				"postcss-calc": "^8.2.3",
+				"postcss-colormin": "^5.3.1",
+				"postcss-convert-values": "^5.1.3",
+				"postcss-discard-comments": "^5.1.2",
+				"postcss-discard-duplicates": "^5.1.0",
+				"postcss-discard-empty": "^5.1.1",
+				"postcss-discard-overridden": "^5.1.0",
+				"postcss-merge-longhand": "^5.1.7",
+				"postcss-merge-rules": "^5.1.4",
+				"postcss-minify-font-values": "^5.1.0",
+				"postcss-minify-gradients": "^5.1.1",
+				"postcss-minify-params": "^5.1.4",
+				"postcss-minify-selectors": "^5.2.1",
+				"postcss-normalize-charset": "^5.1.0",
+				"postcss-normalize-display-values": "^5.1.0",
+				"postcss-normalize-positions": "^5.1.1",
+				"postcss-normalize-repeat-style": "^5.1.1",
+				"postcss-normalize-string": "^5.1.0",
+				"postcss-normalize-timing-functions": "^5.1.0",
+				"postcss-normalize-unicode": "^5.1.1",
+				"postcss-normalize-url": "^5.1.0",
+				"postcss-normalize-whitespace": "^5.1.1",
+				"postcss-ordered-values": "^5.1.3",
+				"postcss-reduce-initial": "^5.1.2",
+				"postcss-reduce-transforms": "^5.1.0",
+				"postcss-svgo": "^5.1.0",
+				"postcss-unique-selectors": "^5.1.1"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/cssnano-utils": {
+			"version": "3.1.0",
+			"resolved": "https://registry.npmjs.org/cssnano-utils/-/cssnano-utils-3.1.0.tgz",
+			"integrity": "sha512-JQNR19/YZhz4psLX/rQ9M83e3z2Wf/HdJbryzte4a3NSuafyp9w/I4U+hx5C2S9g41qlstH7DEWnZaaj83OuEA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/csso": {
+			"version": "4.2.0",
+			"resolved": "https://registry.npmjs.org/csso/-/csso-4.2.0.tgz",
+			"integrity": "sha512-wvlcdIbf6pwKEk7vHj8/Bkc0B4ylXZruLvOgs9doS5eOsOpuodOV2zJChSpkp+pRpYQLQMeF04nr3Z68Sta9jA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"css-tree": "^1.1.2"
+			},
+			"engines": {
+				"node": ">=8.0.0"
+			}
+		},
 		"node_modules/cssom": {
 			"version": "0.5.0",
 			"resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz",
@@ -3212,6 +3422,44 @@
 				"node": ">=6.0.0"
 			}
 		},
+		"node_modules/dom-serializer": {
+			"version": "1.4.1",
+			"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz",
+			"integrity": "sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"domelementtype": "^2.0.1",
+				"domhandler": "^4.2.0",
+				"entities": "^2.0.0"
+			},
+			"funding": {
+				"url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
+			}
+		},
+		"node_modules/dom-serializer/node_modules/entities": {
+			"version": "2.2.0",
+			"resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+			"integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+			"dev": true,
+			"license": "BSD-2-Clause",
+			"funding": {
+				"url": "https://github.com/fb55/entities?sponsor=1"
+			}
+		},
+		"node_modules/domelementtype": {
+			"version": "2.3.0",
+			"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
+			"integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/fb55"
+				}
+			],
+			"license": "BSD-2-Clause"
+		},
 		"node_modules/domexception": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/domexception/-/domexception-4.0.0.tgz",
@@ -3226,6 +3474,37 @@
 				"node": ">=12"
 			}
 		},
+		"node_modules/domhandler": {
+			"version": "4.3.1",
+			"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.3.1.tgz",
+			"integrity": "sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==",
+			"dev": true,
+			"license": "BSD-2-Clause",
+			"dependencies": {
+				"domelementtype": "^2.2.0"
+			},
+			"engines": {
+				"node": ">= 4"
+			},
+			"funding": {
+				"url": "https://github.com/fb55/domhandler?sponsor=1"
+			}
+		},
+		"node_modules/domutils": {
+			"version": "2.8.0",
+			"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz",
+			"integrity": "sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==",
+			"dev": true,
+			"license": "BSD-2-Clause",
+			"dependencies": {
+				"dom-serializer": "^1.0.1",
+				"domelementtype": "^2.2.0",
+				"domhandler": "^4.2.0"
+			},
+			"funding": {
+				"url": "https://github.com/fb55/domutils?sponsor=1"
+			}
+		},
 		"node_modules/dunder-proto": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -3991,6 +4270,13 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/eventemitter3": {
+			"version": "4.0.7",
+			"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
+			"integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/execa": {
 			"version": "5.1.1",
 			"resolved": "https://registry.npmjs.org/execa/-/execa-5.1.1.tgz",
@@ -4313,6 +4599,16 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/generic-names": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/generic-names/-/generic-names-4.0.0.tgz",
+			"integrity": "sha512-ySFolZQfw9FoDb3ed9d80Cm9f0+r7qj+HJkWjeD9RBfpxEVTlVhol+gvaQB/78WbwYfbnNh8nWHHBSlg072y6A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"loader-utils": "^3.2.0"
+			}
+		},
 		"node_modules/gensync": {
 			"version": "1.0.0-beta.2",
 			"resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -4724,6 +5020,26 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/icss-replace-symbols": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+			"integrity": "sha512-chIaY3Vh2mh2Q3RGXttaDIzeiPvaVXJ+C4DAh/w3c37SKZ/U6PGMmuicR2EQQp9bKG8zLMCl7I+PtIoOOPp8Gg==",
+			"dev": true,
+			"license": "ISC"
+		},
+		"node_modules/icss-utils": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
+			"integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": "^10 || ^12 || >= 14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.1.0"
+			}
+		},
 		"node_modules/identity-obj-proxy": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/identity-obj-proxy/-/identity-obj-proxy-3.0.0.tgz",
@@ -4747,6 +5063,19 @@
 				"node": ">= 4"
 			}
 		},
+		"node_modules/import-cwd": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-3.0.0.tgz",
+			"integrity": "sha512-4pnzH16plW+hgvRECbDWpQl3cqtvSofHWh44met7ESfZ8UZOWWddm8hEyDTqREJ9RbYHY8gi8DqmaelApoOGMg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"import-from": "^3.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/import-fresh": {
 			"version": "3.3.1",
 			"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
@@ -4764,6 +5093,29 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/import-from": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/import-from/-/import-from-3.0.0.tgz",
+			"integrity": "sha512-CiuXOFFSzkU5x/CR0+z7T91Iht4CXgfCxVOFRhh2Zyhg5wOpWvvDLQUsWl+gcN+QscYBjez8hDCt85O7RLDttQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"resolve-from": "^5.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/import-from/node_modules/resolve-from": {
+			"version": "5.0.0",
+			"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-5.0.0.tgz",
+			"integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/import-local": {
 			"version": "3.2.0",
 			"resolved": "https://registry.npmjs.org/import-local/-/import-local-3.2.0.tgz",
@@ -6235,6 +6587,16 @@
 				"node": ">= 0.8.0"
 			}
 		},
+		"node_modules/lilconfig": {
+			"version": "2.1.0",
+			"resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
+			"integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/lines-and-columns": {
 			"version": "1.2.4",
 			"resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
@@ -6242,6 +6604,16 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/loader-utils": {
+			"version": "3.3.1",
+			"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-3.3.1.tgz",
+			"integrity": "sha512-FMJTLMXfCLMLfJxcX9PFqX5qD88Z5MRGaZCVzfuqeZSPsyiBzs+pahDQjbIWz2QIzPZz0NX9Zy4FX3lmK6YHIg==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 12.13.0"
+			}
+		},
 		"node_modules/locate-path": {
 			"version": "6.0.0",
 			"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -6258,6 +6630,13 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/lodash.camelcase": {
+			"version": "4.3.0",
+			"resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
+			"integrity": "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/lodash.memoize": {
 			"version": "4.1.2",
 			"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@@ -6272,6 +6651,13 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/lodash.uniq": {
+			"version": "4.5.0",
+			"resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
+			"integrity": "sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/lru-cache": {
 			"version": "5.1.1",
 			"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
@@ -6335,6 +6721,13 @@
 				"node": ">= 0.4"
 			}
 		},
+		"node_modules/mdn-data": {
+			"version": "2.0.14",
+			"resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz",
+			"integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==",
+			"dev": true,
+			"license": "CC0-1.0"
+		},
 		"node_modules/merge-stream": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -6446,6 +6839,26 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/nanoid": {
+			"version": "3.3.11",
+			"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
+			"integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/ai"
+				}
+			],
+			"license": "MIT",
+			"peer": true,
+			"bin": {
+				"nanoid": "bin/nanoid.cjs"
+			},
+			"engines": {
+				"node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+			}
+		},
 		"node_modules/natural-compare": {
 			"version": "1.4.0",
 			"resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
@@ -6477,6 +6890,19 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/normalize-url": {
+			"version": "6.1.0",
+			"resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-6.1.0.tgz",
+			"integrity": "sha512-DlL+XwOy3NxAQ8xuC0okPgK46iuVNAK01YN7RueYBqqFeGsBjV9XmCAzAdgt+667bCl5kPh9EqKKDwnaPG1I7A==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=10"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
 		"node_modules/npm-run-path": {
 			"version": "4.0.1",
 			"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
@@ -6490,6 +6916,19 @@
 				"node": ">=8"
 			}
 		},
+		"node_modules/nth-check": {
+			"version": "2.1.1",
+			"resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
+			"integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==",
+			"dev": true,
+			"license": "BSD-2-Clause",
+			"dependencies": {
+				"boolbase": "^1.0.0"
+			},
+			"funding": {
+				"url": "https://github.com/fb55/nth-check?sponsor=1"
+			}
+		},
 		"node_modules/nwsapi": {
 			"version": "2.2.16",
 			"resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.16.tgz",
@@ -6663,6 +7102,16 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/p-finally": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
+			"integrity": "sha512-LICb2p9CB7FS+0eR1oqWnHhp0FljGLZCWBE9aix0Uye9W8LTQPwMTYVGWQWIw9RdQiDg4+epXQODwIYJtSJaow==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=4"
+			}
+		},
 		"node_modules/p-limit": {
 			"version": "3.1.0",
 			"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
@@ -6695,6 +7144,36 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/p-queue": {
+			"version": "6.6.2",
+			"resolved": "https://registry.npmjs.org/p-queue/-/p-queue-6.6.2.tgz",
+			"integrity": "sha512-RwFpb72c/BhQLEXIZ5K2e+AhgNVmIejGlTgiB9MzZ0e93GRvqZ7uSi0dvRF7/XIXDeNkra2fNHBxTyPDGySpjQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"eventemitter3": "^4.0.4",
+				"p-timeout": "^3.2.0"
+			},
+			"engines": {
+				"node": ">=8"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
+		"node_modules/p-timeout": {
+			"version": "3.2.0",
+			"resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-3.2.0.tgz",
+			"integrity": "sha512-rhIwUycgwwKcP9yTOOFK/AKsAopjjCakVqLHePO3CC6Mir1Z99xT+R63jZxAT5lFZLa2inS5h+ZS2GvR99/FBg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"p-finally": "^1.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/p-try": {
 			"version": "2.2.0",
 			"resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
@@ -6807,6 +7286,19 @@
 				"url": "https://github.com/sponsors/jonschlinkert"
 			}
 		},
+		"node_modules/pify": {
+			"version": "5.0.0",
+			"resolved": "https://registry.npmjs.org/pify/-/pify-5.0.0.tgz",
+			"integrity": "sha512-eW/gHNMlxdSP6dmG6uJip6FXN0EQBwm2clYYd8Wul42Cwu/DK8HEftzsapcNdYe2MfLiIwZqsDk2RDEsTE79hA==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=10"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
 		"node_modules/pirates": {
 			"version": "4.0.6",
 			"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
@@ -6944,6 +7436,630 @@
 				"node": ">= 0.4"
 			}
 		},
+		"node_modules/postcss": {
+			"version": "8.5.3",
+			"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
+			"integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
+			"dev": true,
+			"funding": [
+				{
+					"type": "opencollective",
+					"url": "https://opencollective.com/postcss/"
+				},
+				{
+					"type": "tidelift",
+					"url": "https://tidelift.com/funding/github/npm/postcss"
+				},
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/ai"
+				}
+			],
+			"license": "MIT",
+			"peer": true,
+			"dependencies": {
+				"nanoid": "^3.3.8",
+				"picocolors": "^1.1.1",
+				"source-map-js": "^1.2.1"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14"
+			}
+		},
+		"node_modules/postcss-calc": {
+			"version": "8.2.4",
+			"resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-8.2.4.tgz",
+			"integrity": "sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-selector-parser": "^6.0.9",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.2"
+			}
+		},
+		"node_modules/postcss-colormin": {
+			"version": "5.3.1",
+			"resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-5.3.1.tgz",
+			"integrity": "sha512-UsWQG0AqTFQmpBegeLLc1+c3jIqBNB0zlDGRWR+dQ3pRKJL1oeMzyqmH3o2PIfn9MBdNrVPWhDbT769LxCTLJQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"caniuse-api": "^3.0.0",
+				"colord": "^2.9.1",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-convert-values": {
+			"version": "5.1.3",
+			"resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-5.1.3.tgz",
+			"integrity": "sha512-82pC1xkJZtcJEfiLw6UXnXVXScgtBrjlO5CBmuDQc+dlb88ZYheFsjTn40+zBVi3DkfF7iezO0nJUPLcJK3pvA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-discard-comments": {
+			"version": "5.1.2",
+			"resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-5.1.2.tgz",
+			"integrity": "sha512-+L8208OVbHVF2UQf1iDmRcbdjJkuBF6IS29yBDSiWUIzpYaAhtNl6JYnYm12FnkeCwQqF5LeklOu6rAqgfBZqQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-discard-duplicates": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-5.1.0.tgz",
+			"integrity": "sha512-zmX3IoSI2aoenxHV6C7plngHWWhUOV3sP1T8y2ifzxzbtnuhk1EdPwm0S1bIUNaJ2eNbWeGLEwzw8huPD67aQw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-discard-empty": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-5.1.1.tgz",
+			"integrity": "sha512-zPz4WljiSuLWsI0ir4Mcnr4qQQ5e1Ukc3i7UfE2XcrwKK2LIPIqE5jxMRxO6GbI3cv//ztXDsXwEWT3BHOGh3A==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-discard-overridden": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-5.1.0.tgz",
+			"integrity": "sha512-21nOL7RqWR1kasIVdKs8HNqQJhFxLsyRfAnUDm4Fe4t4mCWL9OJiHvlHPjcd8zc5Myu89b/7wZDnOSjFgeWRtw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-load-config": {
+			"version": "3.1.4",
+			"resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-3.1.4.tgz",
+			"integrity": "sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"lilconfig": "^2.0.5",
+				"yaml": "^1.10.2"
+			},
+			"engines": {
+				"node": ">= 10"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/postcss/"
+			},
+			"peerDependencies": {
+				"postcss": ">=8.0.9",
+				"ts-node": ">=9.0.0"
+			},
+			"peerDependenciesMeta": {
+				"postcss": {
+					"optional": true
+				},
+				"ts-node": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/postcss-merge-longhand": {
+			"version": "5.1.7",
+			"resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-5.1.7.tgz",
+			"integrity": "sha512-YCI9gZB+PLNskrK0BB3/2OzPnGhPkBEwmwhfYk1ilBHYVAZB7/tkTHFBAnCrvBBOmeYyMYw3DMjT55SyxMBzjQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0",
+				"stylehacks": "^5.1.1"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-merge-rules": {
+			"version": "5.1.4",
+			"resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-5.1.4.tgz",
+			"integrity": "sha512-0R2IuYpgU93y9lhVbO/OylTtKMVcHb67zjWIfCiKR9rWL3GUk1677LAqD/BcHizukdZEjT8Ru3oHRoAYoJy44g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"caniuse-api": "^3.0.0",
+				"cssnano-utils": "^3.1.0",
+				"postcss-selector-parser": "^6.0.5"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-minify-font-values": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-5.1.0.tgz",
+			"integrity": "sha512-el3mYTgx13ZAPPirSVsHqFzl+BBBDrXvbySvPGFnQcTI4iNslrPaFq4muTkLZmKlGk4gyFAYUBMH30+HurREyA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-minify-gradients": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-5.1.1.tgz",
+			"integrity": "sha512-VGvXMTpCEo4qHTNSa9A0a3D+dxGFZCYwR6Jokk+/3oB6flu2/PnPXAh2x7x52EkY5xlIHLm+Le8tJxe/7TNhzw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"colord": "^2.9.1",
+				"cssnano-utils": "^3.1.0",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-minify-params": {
+			"version": "5.1.4",
+			"resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-5.1.4.tgz",
+			"integrity": "sha512-+mePA3MgdmVmv6g+30rn57USjOGSAyuxUmkfiWpzalZ8aiBkdPYjXWtHuwJGm1v5Ojy0Z0LaSYhHaLJQB0P8Jw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"cssnano-utils": "^3.1.0",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-minify-selectors": {
+			"version": "5.2.1",
+			"resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-5.2.1.tgz",
+			"integrity": "sha512-nPJu7OjZJTsVUmPdm2TcaiohIwxP+v8ha9NehQ2ye9szv4orirRU3SDdtUmKH+10nzn0bAyOXZ0UEr7OpvLehg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-selector-parser": "^6.0.5"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-modules": {
+			"version": "4.3.1",
+			"resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-4.3.1.tgz",
+			"integrity": "sha512-ItUhSUxBBdNamkT3KzIZwYNNRFKmkJrofvC2nWab3CPKhYBQ1f27XXh1PAPE27Psx58jeelPsxWB/+og+KEH0Q==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"generic-names": "^4.0.0",
+				"icss-replace-symbols": "^1.1.0",
+				"lodash.camelcase": "^4.3.0",
+				"postcss-modules-extract-imports": "^3.0.0",
+				"postcss-modules-local-by-default": "^4.0.0",
+				"postcss-modules-scope": "^3.0.0",
+				"postcss-modules-values": "^4.0.0",
+				"string-hash": "^1.1.1"
+			},
+			"peerDependencies": {
+				"postcss": "^8.0.0"
+			}
+		},
+		"node_modules/postcss-modules-extract-imports": {
+			"version": "3.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz",
+			"integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": "^10 || ^12 || >= 14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.1.0"
+			}
+		},
+		"node_modules/postcss-modules-local-by-default": {
+			"version": "4.2.0",
+			"resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.2.0.tgz",
+			"integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"icss-utils": "^5.0.0",
+				"postcss-selector-parser": "^7.0.0",
+				"postcss-value-parser": "^4.1.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >= 14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.1.0"
+			}
+		},
+		"node_modules/postcss-modules-local-by-default/node_modules/postcss-selector-parser": {
+			"version": "7.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz",
+			"integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"cssesc": "^3.0.0",
+				"util-deprecate": "^1.0.2"
+			},
+			"engines": {
+				"node": ">=4"
+			}
+		},
+		"node_modules/postcss-modules-scope": {
+			"version": "3.2.1",
+			"resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz",
+			"integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"postcss-selector-parser": "^7.0.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >= 14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.1.0"
+			}
+		},
+		"node_modules/postcss-modules-scope/node_modules/postcss-selector-parser": {
+			"version": "7.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz",
+			"integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"cssesc": "^3.0.0",
+				"util-deprecate": "^1.0.2"
+			},
+			"engines": {
+				"node": ">=4"
+			}
+		},
+		"node_modules/postcss-modules-values": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz",
+			"integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==",
+			"dev": true,
+			"license": "ISC",
+			"dependencies": {
+				"icss-utils": "^5.0.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >= 14"
+			},
+			"peerDependencies": {
+				"postcss": "^8.1.0"
+			}
+		},
+		"node_modules/postcss-normalize-charset": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-5.1.0.tgz",
+			"integrity": "sha512-mSgUJ+pd/ldRGVx26p2wz9dNZ7ji6Pn8VWBajMXFf8jk7vUoSrZ2lt/wZR7DtlZYKesmZI680qjr2CeFF2fbUg==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-display-values": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-display-values/-/postcss-normalize-display-values-5.1.0.tgz",
+			"integrity": "sha512-WP4KIM4o2dazQXWmFaqMmcvsKmhdINFblgSeRgn8BJ6vxaMyaJkwAzpPpuvSIoG/rmX3M+IrRZEz2H0glrQNEA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-positions": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-positions/-/postcss-normalize-positions-5.1.1.tgz",
+			"integrity": "sha512-6UpCb0G4eofTCQLFVuI3EVNZzBNPiIKcA1AKVka+31fTVySphr3VUgAIULBhxZkKgwLImhzMR2Bw1ORK+37INg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-repeat-style": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-repeat-style/-/postcss-normalize-repeat-style-5.1.1.tgz",
+			"integrity": "sha512-mFpLspGWkQtBcWIRFLmewo8aC3ImN2i/J3v8YCFUwDnPu3Xz4rLohDO26lGjwNsQxB3YF0KKRwspGzE2JEuS0g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-string": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-string/-/postcss-normalize-string-5.1.0.tgz",
+			"integrity": "sha512-oYiIJOf4T9T1N4i+abeIc7Vgm/xPCGih4bZz5Nm0/ARVJ7K6xrDlLwvwqOydvyL3RHNf8qZk6vo3aatiw/go3w==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-timing-functions": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-timing-functions/-/postcss-normalize-timing-functions-5.1.0.tgz",
+			"integrity": "sha512-DOEkzJ4SAXv5xkHl0Wa9cZLF3WCBhF3o1SKVxKQAa+0pYKlueTpCgvkFAHfk+Y64ezX9+nITGrDZeVGgITJXjg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-unicode": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-unicode/-/postcss-normalize-unicode-5.1.1.tgz",
+			"integrity": "sha512-qnCL5jzkNUmKVhZoENp1mJiGNPcsJCs1aaRmURmeJGES23Z/ajaln+EPTD+rBeNkSryI+2WTdW+lwcVdOikrpA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-url": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-5.1.0.tgz",
+			"integrity": "sha512-5upGeDO+PVthOxSmds43ZeMeZfKH+/DKgGRD7TElkkyS46JXAUhMzIKiCa7BabPeIy3AQcTkXwVVN7DbqsiCew==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"normalize-url": "^6.0.1",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-normalize-whitespace": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-normalize-whitespace/-/postcss-normalize-whitespace-5.1.1.tgz",
+			"integrity": "sha512-83ZJ4t3NUDETIHTa3uEg6asWjSBYL5EdkVB0sDncx9ERzOKBVJIUeDO9RyA9Zwtig8El1d79HBp0JEi8wvGQnA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-ordered-values": {
+			"version": "5.1.3",
+			"resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-5.1.3.tgz",
+			"integrity": "sha512-9UO79VUhPwEkzbb3RNpqqghc6lcYej1aveQteWY+4POIwlqkYE21HKWaLDF6lWNuqCobEAyTovVhtI32Rbv2RQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"cssnano-utils": "^3.1.0",
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-reduce-initial": {
+			"version": "5.1.2",
+			"resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-5.1.2.tgz",
+			"integrity": "sha512-dE/y2XRaqAi6OvjzD22pjTUQ8eOfc6m/natGHgKFBK9DxFmIm69YmaRVQrGgFlEfc1HePIurY0TmDeROK05rIg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"caniuse-api": "^3.0.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-reduce-transforms": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-5.1.0.tgz",
+			"integrity": "sha512-2fbdbmgir5AvpW9RLtdONx1QoYG2/EtqpNQbFASDlixBbAYuTcJ0dECwlqNqH7VbaUnEnh8SrxOe2sRIn24XyQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-selector-parser": {
+			"version": "6.1.2",
+			"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
+			"integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"cssesc": "^3.0.0",
+				"util-deprecate": "^1.0.2"
+			},
+			"engines": {
+				"node": ">=4"
+			}
+		},
+		"node_modules/postcss-svgo": {
+			"version": "5.1.0",
+			"resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-5.1.0.tgz",
+			"integrity": "sha512-D75KsH1zm5ZrHyxPakAxJWtkyXew5qwS70v56exwvw542d9CRtTo78K0WeFxZB4G7JXKKMbEZtZayTGdIky/eA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-value-parser": "^4.2.0",
+				"svgo": "^2.7.0"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"node_modules/postcss-unique-selectors": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-5.1.1.tgz",
+			"integrity": "sha512-5JiODlELrz8L2HwxfPnhOWZYWDxVHWL83ufOv84NrcgipI7TaeRsatAhK4Tr2/ZiYldpK/wBvw5BD3qfaK96GA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"postcss-selector-parser": "^6.0.5"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
+		"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==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/prelude-ls": {
 			"version": "1.2.1",
 			"resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -6982,6 +8098,16 @@
 				"url": "https://github.com/chalk/ansi-styles?sponsor=1"
 			}
 		},
+		"node_modules/promise.series": {
+			"version": "0.2.0",
+			"resolved": "https://registry.npmjs.org/promise.series/-/promise.series-0.2.0.tgz",
+			"integrity": "sha512-VWQJyU2bcDTgZw8kpfBpB/ejZASlCrzwz5f2hjb/zlujOEB4oeiAhHygAWq8ubsX2GVkD4kCU5V2dwOTaCY5EQ==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.12"
+			}
+		},
 		"node_modules/prompts": {
 			"version": "2.4.2",
 			"resolved": "https://registry.npmjs.org/prompts/-/prompts-2.4.2.tgz",
@@ -7286,6 +8412,51 @@
 				"fsevents": "~2.3.2"
 			}
 		},
+		"node_modules/rollup-plugin-postcss": {
+			"version": "4.0.2",
+			"resolved": "https://registry.npmjs.org/rollup-plugin-postcss/-/rollup-plugin-postcss-4.0.2.tgz",
+			"integrity": "sha512-05EaY6zvZdmvPUDi3uCcAQoESDcYnv8ogJJQRp6V5kZ6J6P7uAVJlrTZcaaA20wTH527YTnKfkAoPxWI/jPp4w==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"chalk": "^4.1.0",
+				"concat-with-sourcemaps": "^1.1.0",
+				"cssnano": "^5.0.1",
+				"import-cwd": "^3.0.0",
+				"p-queue": "^6.6.2",
+				"pify": "^5.0.0",
+				"postcss-load-config": "^3.0.0",
+				"postcss-modules": "^4.0.0",
+				"promise.series": "^0.2.0",
+				"resolve": "^1.19.0",
+				"rollup-pluginutils": "^2.8.2",
+				"safe-identifier": "^0.4.2",
+				"style-inject": "^0.3.0"
+			},
+			"engines": {
+				"node": ">=10"
+			},
+			"peerDependencies": {
+				"postcss": "8.x"
+			}
+		},
+		"node_modules/rollup-pluginutils": {
+			"version": "2.8.2",
+			"resolved": "https://registry.npmjs.org/rollup-pluginutils/-/rollup-pluginutils-2.8.2.tgz",
+			"integrity": "sha512-EEp9NhnUkwY8aif6bxgovPHMoMoNr2FulJziTndpt5H9RdwC47GSGuII9XxpSdzVGM0GWrNPHV6ie1LTNJPaLQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"estree-walker": "^0.6.1"
+			}
+		},
+		"node_modules/rollup-pluginutils/node_modules/estree-walker": {
+			"version": "0.6.1",
+			"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-0.6.1.tgz",
+			"integrity": "sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/run-parallel": {
 			"version": "1.2.0",
 			"resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@@ -7352,6 +8523,13 @@
 			],
 			"license": "MIT"
 		},
+		"node_modules/safe-identifier": {
+			"version": "0.4.2",
+			"resolved": "https://registry.npmjs.org/safe-identifier/-/safe-identifier-0.4.2.tgz",
+			"integrity": "sha512-6pNbSMW6OhAi9j+N8V+U715yBQsaWJ7eyEUaOrawX+isg5ZxhUlV1NipNtgaKHmFGiABwt+ZF04Ii+3Xjkg+8w==",
+			"dev": true,
+			"license": "ISC"
+		},
 		"node_modules/safe-push-apply": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
@@ -7628,6 +8806,17 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/source-map-js": {
+			"version": "1.2.1",
+			"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+			"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+			"dev": true,
+			"license": "BSD-3-Clause",
+			"peer": true,
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
 		"node_modules/source-map-support": {
 			"version": "0.5.13",
 			"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
@@ -7646,6 +8835,14 @@
 			"dev": true,
 			"license": "BSD-3-Clause"
 		},
+		"node_modules/stable": {
+			"version": "0.1.8",
+			"resolved": "https://registry.npmjs.org/stable/-/stable-0.1.8.tgz",
+			"integrity": "sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==",
+			"deprecated": "Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/stack-utils": {
 			"version": "2.0.6",
 			"resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-2.0.6.tgz",
@@ -7669,6 +8866,13 @@
 				"node": ">=8"
 			}
 		},
+		"node_modules/string-hash": {
+			"version": "1.1.3",
+			"resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
+			"integrity": "sha512-kJUvRUFK49aub+a7T1nNE66EJbZBMnBgoC1UbCZ5n6bsZKBRga4KgBRTMn/pFkeCZSYtNeSyMxPDM0AXWELk2A==",
+			"dev": true,
+			"license": "CC0-1.0"
+		},
 		"node_modules/string-length": {
 			"version": "4.0.2",
 			"resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz",
@@ -7806,6 +9010,30 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/style-inject": {
+			"version": "0.3.0",
+			"resolved": "https://registry.npmjs.org/style-inject/-/style-inject-0.3.0.tgz",
+			"integrity": "sha512-IezA2qp+vcdlhJaVm5SOdPPTUu0FCEqfNSli2vRuSIBbu5Nq5UvygTk/VzeCqfLz2Atj3dVII5QBKGZRZ0edzw==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/stylehacks": {
+			"version": "5.1.1",
+			"resolved": "https://registry.npmjs.org/stylehacks/-/stylehacks-5.1.1.tgz",
+			"integrity": "sha512-sBpcd5Hx7G6seo7b1LkpttvTz7ikD0LlH5RmdcBNb6fFR0Fl7LQwHDFr300q4cwUqi+IYrFGmsIHieMBfnN/Bw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"browserslist": "^4.21.4",
+				"postcss-selector-parser": "^6.0.4"
+			},
+			"engines": {
+				"node": "^10 || ^12 || >=14.0"
+			},
+			"peerDependencies": {
+				"postcss": "^8.2.15"
+			}
+		},
 		"node_modules/supports-color": {
 			"version": "7.2.0",
 			"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -7832,6 +9060,38 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/svgo": {
+			"version": "2.8.0",
+			"resolved": "https://registry.npmjs.org/svgo/-/svgo-2.8.0.tgz",
+			"integrity": "sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@trysound/sax": "0.2.0",
+				"commander": "^7.2.0",
+				"css-select": "^4.1.3",
+				"css-tree": "^1.1.3",
+				"csso": "^4.2.0",
+				"picocolors": "^1.0.0",
+				"stable": "^0.1.8"
+			},
+			"bin": {
+				"svgo": "bin/svgo"
+			},
+			"engines": {
+				"node": ">=10.13.0"
+			}
+		},
+		"node_modules/svgo/node_modules/commander": {
+			"version": "7.2.0",
+			"resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
+			"integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
+			"dev": true,
+			"license": "MIT",
+			"engines": {
+				"node": ">= 10"
+			}
+		},
 		"node_modules/symbol-tree": {
 			"version": "3.2.4",
 			"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
@@ -8349,6 +9609,13 @@
 				"requires-port": "^1.0.0"
 			}
 		},
+		"node_modules/util-deprecate": {
+			"version": "1.0.2",
+			"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+			"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/v8-compile-cache-lib": {
 			"version": "3.0.1",
 			"resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz",
@@ -8654,6 +9921,16 @@
 			"dev": true,
 			"license": "ISC"
 		},
+		"node_modules/yaml": {
+			"version": "1.10.2",
+			"resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
+			"integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
+			"dev": true,
+			"license": "ISC",
+			"engines": {
+				"node": ">= 6"
+			}
+		},
 		"node_modules/yargs": {
 			"version": "17.7.2",
 			"resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
diff --git a/frontend/webcomponent/package.json b/frontend/webcomponent/package.json
index 56d9ff2..74cfb08 100644
--- a/frontend/webcomponent/package.json
+++ b/frontend/webcomponent/package.json
@@ -28,6 +28,7 @@
 		"jest-environment-jsdom": "^29.7.0",
 		"playwright": "^1.50.1",
 		"rollup": "^4.34.8",
+		"rollup-plugin-postcss": "^4.0.2",
 		"ts-jest": "^29.2.5",
 		"ts-jest-resolver": "^2.0.1",
 		"ts-node": "^10.9.2",
diff --git a/frontend/webcomponent/rollup.config.js b/frontend/webcomponent/rollup.config.js
index 9946694..bcc850d 100644
--- a/frontend/webcomponent/rollup.config.js
+++ b/frontend/webcomponent/rollup.config.js
@@ -3,21 +3,67 @@ import resolve from '@rollup/plugin-node-resolve'
 import commonjs from '@rollup/plugin-commonjs'
 import typescript from '@rollup/plugin-typescript'
 import terser from '@rollup/plugin-terser'
+import postcss from 'rollup-plugin-postcss'
 import fs from 'fs'
 
+const production = !process.env.ROLLUP_WATCH
+
 export default {
   input: 'src/index.ts',
   output: {
     file: './dist/openvidu-meet.bundle.min.js',
     format: 'iife',
     name: 'OpenViduMeet',
-    sourcemap: true
+    sourcemap: !production
   },
   plugins: [
-    resolve(),
-    commonjs(),
-    typescript({ tsconfig: './tsconfig.json' }),
-    terser(),
+    resolve({
+      // Prioritize modern ES modules
+      mainFields: ['module', 'browser', 'main']
+    }),
+    commonjs({
+      // Optimize CommonJS conversion
+      transformMixedEsModules: true
+    }),
+    postcss({
+      inject: true, // This injects the CSS into the JS bundle
+      minimize: true,
+      // Don't extract CSS to a separate file
+      extract: false
+    }),
+    typescript({
+      tsconfig: './tsconfig.json',
+      declaration: false,
+      sourceMap: !production
+    }),
+    terser({
+      ecma: 2020, // Use modern features when possible
+      compress: {
+        drop_console: production, // Remove console.logs in production
+        drop_debugger: production,
+        pure_getters: true,
+        unsafe: true,
+        passes: 3, // Multiple passes for better minification
+        toplevel: true // Enable top-level variable renaming
+      },
+      // mangle: {
+      //   properties: {
+      //     regex: /^_|^iframe|^error|^load|^allowed|^command|^events/, // Mangle most internal properties
+      //     reserved: [
+      //       'connectedCallback',
+      //       'disconnectedCallback', // Web Component lifecycle methods
+      //       'shadowRoot',
+      //       'attachShadow', // Shadow DOM APIs
+      //       'attributes',
+      //       'setAttribute' // Standard element properties
+      //     ]
+      //   },
+      //   toplevel: true // Enable top-level variable renaming
+      // },
+      format: {
+        comments: false // Remove all comments
+      }
+    }),
     {
       name: 'copy-bundle',
       writeBundle () {
diff --git a/frontend/webcomponent/src/assets/css/styles.css b/frontend/webcomponent/src/assets/css/styles.css
new file mode 100644
index 0000000..6bcec96
--- /dev/null
+++ b/frontend/webcomponent/src/assets/css/styles.css
@@ -0,0 +1,36 @@
+:host {
+	display: block;
+	width: 100%;
+	height: 100%;
+}
+
+iframe {
+	width: 100%;
+	height: 100%;
+	border: none;
+}
+
+.error-container {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	height: 100%;
+	width: 100%;
+	background-color: #f8f8f8;
+	border: 1px solid #e0e0e0;
+	padding: 20px;
+	box-sizing: border-box;
+	text-align: center;
+}
+
+.error-icon {
+	font-size: 48px;
+	margin-bottom: 16px;
+}
+
+.error-message {
+	color: #d32f2f;
+	font-size: 16px;
+	max-width: 80%;
+}
diff --git a/frontend/webcomponent/src/components/EventsManager.ts b/frontend/webcomponent/src/components/EventsManager.ts
index d484705..9f585d9 100644
--- a/frontend/webcomponent/src/components/EventsManager.ts
+++ b/frontend/webcomponent/src/components/EventsManager.ts
@@ -11,6 +11,10 @@ export class EventsManager {
 		window.addEventListener('message', this.handleMessage.bind(this));
 	}
 
+	public cleanup() {
+		window.removeEventListener('message', this.handleMessage);
+	}
+
 	private handleMessage(event: MessageEvent) {
 		const message: OutboundEventMessage = event.data;
 		// Validate message origin (security measure)
diff --git a/frontend/webcomponent/src/components/OpenViduMeet.ts b/frontend/webcomponent/src/components/OpenViduMeet.ts
index 8c31672..f030076 100644
--- a/frontend/webcomponent/src/components/OpenViduMeet.ts
+++ b/frontend/webcomponent/src/components/OpenViduMeet.ts
@@ -2,6 +2,7 @@ import { WebComponentCommand } from '../models/command.model';
 import { InboundCommandMessage } from '../models/message.type';
 import { CommandsManager } from './CommandsManager';
 import { EventsManager } from './EventsManager';
+import styles from '../assets/css/styles.css';
 
 /**
  * The `OpenViduMeet` web component provides an interface for embedding an OpenVidu Meet room within a web page.
@@ -27,7 +28,11 @@ export class OpenViduMeet extends HTMLElement {
 	private iframe: HTMLIFrameElement;
 	private commandsManager: CommandsManager;
 	private eventsManager: EventsManager;
+	//!FIXME: Insecure by default
 	private allowedOrigin: string = '*';
+	private loadTimeout: any;
+	private iframeLoaded = false;
+	private errorMessage: string | null = null;
 
 	constructor() {
 		super();
@@ -52,30 +57,81 @@ export class OpenViduMeet extends HTMLElement {
 		this.updateIframeSrc();
 	}
 
-	private render() {
-		const style = document.createElement('style');
-		style.textContent = `
-		:host {
-			display: block;
-			width: 100%;
-			height: 100%;
+	disconnectedCallback() {
+		// Clean up resources
+		if (this.loadTimeout) {
+			clearTimeout(this.loadTimeout);
 		}
-		  iframe {
-			width: 100%;
-			height: 100%;
-			border: none;
-		  }
-		`;
-		this.shadowRoot?.appendChild(style);
-		this.shadowRoot?.appendChild(this.iframe);
-		this.iframe.onload = () => {
+		this.eventsManager.cleanup();
+	}
+
+	/**
+	 * Renders the Web Component in the shadow DOM
+	 */
+	private render() {
+		// Add styles
+		const styleElement = document.createElement('style');
+		styleElement.textContent = styles;
+		this.shadowRoot?.appendChild(styleElement);
+
+		if (this.errorMessage) {
+			const errorContainer = document.createElement('div');
+			errorContainer.className = 'error-container';
+
+			const errorIcon = document.createElement('div');
+			errorIcon.className = 'error-icon';
+			errorIcon.textContent = '⚠️';
+
+			const errorMessageEl = document.createElement('div');
+			errorMessageEl.className = 'error-message';
+			errorMessageEl.textContent = this.errorMessage;
+
+			errorContainer.appendChild(errorIcon);
+			errorContainer.appendChild(errorMessageEl);
+			this.shadowRoot?.appendChild(errorContainer);
+		} else {
+			// Configure the iframe and Add it to the DOM
+			this.setupIframe();
+			this.shadowRoot?.appendChild(this.iframe);
+		}
+	}
+
+	/**
+	 * Sets up the iframe with error handlers and loading timeout
+	 */
+	private setupIframe() {
+		// Clear any previous timeout
+		if (this.loadTimeout) {
+			clearTimeout(this.loadTimeout);
+		}
+
+		// Reset states
+		this.iframeLoaded = false;
+
+		// Set up load handlers
+		this.iframe.onload = (event: Event) => {
+			console.warn('Iframe loaded', event);
 			const message: InboundCommandMessage = {
 				command: WebComponentCommand.INITIALIZE,
 				payload: { domain: window.location.origin }
 			};
 			this.commandsManager.sendMessage(message);
+			this.iframeLoaded = true;
+			clearTimeout(this.loadTimeout);
+			this.loadTimeout = null;
 			this.iframe.onload = null;
 		};
+		// this.iframe.onload = this.handleIframeLoaded.bind(this);
+		this.iframe.onerror = (event: Event | string) => {
+			console.error('Iframe error:', event);
+			clearTimeout(this.loadTimeout);
+			this.showErrorState('Failed to load meeting');
+		};
+
+		// Set loading timeout
+		this.loadTimeout = setTimeout(() => {
+			if (!this.iframeLoaded) this.showErrorState('Loading timed out');
+		}, 10_000);
 	}
 
 	private updateIframeSrc() {
@@ -99,7 +155,20 @@ export class OpenViduMeet extends HTMLElement {
 		this.iframe.src = url.toString();
 	}
 
-	// Public methods
+	/**
+	 * Shows error state in the component UI
+	 */
+	private showErrorState(message: string) {
+		this.errorMessage = message;
+		// Re-render to show error state
+		while (this.shadowRoot?.firstChild) {
+			this.shadowRoot.removeChild(this.shadowRoot.firstChild);
+		}
+		this.render();
+	}
+
+	// ---- WebComponent Commands ----
+	// These methods send commands to the OpenVidu Meet iframe.
 
 	public endMeeting() {
 		const message: InboundCommandMessage = { command: WebComponentCommand.END_MEETING };
diff --git a/frontend/webcomponent/src/css.d.ts b/frontend/webcomponent/src/css.d.ts
new file mode 100644
index 0000000..1ddc173
--- /dev/null
+++ b/frontend/webcomponent/src/css.d.ts
@@ -0,0 +1,4 @@
+declare module '*.css' {
+	const content: string;
+	export default content;
+  }
\ No newline at end of file