From 8328dfa4cc077cfc9c2154d3184e232f69feefe9 Mon Sep 17 00:00:00 2001
From: shafin-deriv <shafin@regentmarkets.com>
Date: Thu, 25 Jul 2024 11:24:12 +0800
Subject: [PATCH 1/4] chore: change scss files to only import variables mixins
 when necessary

---
 .stylelintrc.cjs                              |   4 +
 package-lock.json                             | 629 ++----------------
 package.json                                  |   6 +-
 rsbuild.config.ts                             |  16 +-
 .../bot-notification-messages.scss            |   4 +
 .../bot-notification/bot-notification.scss    |   2 +
 .../contract-result-overlay.scss              |   9 +
 src/components/flyout/flyout.scss             |  38 +-
 src/components/journal/journal.scss           |  24 +
 src/components/layout/footer/footer.scss      |   2 +
 src/components/load-modal/load-modal.scss     |   4 +
 src/components/run-panel/run-panel.scss       |   2 +
 src/components/shared/styles/constants.scss   | 242 -------
 src/components/shared/styles/devices.scss     |  62 --
 src/components/shared/styles/fonts.scss       |  73 --
 .../shared/styles/google-fonts.scss           |   3 -
 .../shared/styles/inline-icons.scss           |  34 -
 src/components/shared/styles/mixins.scss      | 315 ---------
 src/components/shared/styles/reset.scss       | 147 ----
 src/components/shared/styles/themes.scss      | 361 ----------
 src/components/shared_ui/button/button.scss   |  44 ++
 .../sass/contract-card-dialog.scss            |   3 +
 .../contract-card/contract-card.scss          |   3 +
 .../result-overlay/result-overlay.scss        |  11 +-
 .../currency-badge/currency-badge.scss        |   2 +
 .../shared_ui/data-list/data-list.scss        |  13 +
 src/components/shared_ui/dialog/dialog.scss   |  19 +-
 src/components/shared_ui/drawer/drawer.scss   |  15 +
 src/components/shared_ui/field/field.scss     |   8 +
 .../shared_ui/input-field/input-field.scss    |  29 +
 src/components/shared_ui/loading/loading.scss |   8 +
 .../mobile-dialog/mobile-dialog.scss          |  19 +-
 src/components/shared_ui/modal/modal.scss     |   3 +
 .../shared_ui/page-overlay/page-overlay.scss  |  15 +-
 src/components/shared_ui/popover/popover.scss |  13 +-
 .../progress-bar-tracker.scss                 |   2 +
 .../progress-slider/progress-slider.scss      |  24 +
 .../shared_ui/radio-group/radio-group.scss    |  12 +
 .../select-native/select-native.scss          |  21 +-
 src/components/shared_ui/tabs/tabs.scss       |  30 +-
 .../themed-scrollbars/themed-scrollbars.scss  |  11 +
 src/components/shared_ui/tooltip/tooltip.scss |  29 +-
 src/components/summary/summary-card.scss      |  13 +
 src/components/summary/summary.scss           |   9 +
 .../trade-animation/trade-animation.scss      |   4 +
 src/components/transactions/transactions.scss |  31 +
 .../form-wrappers/strategy-accordion.scss     |   4 +-
 .../parts/loss-threshold-warning-dialog.scss  |   7 +-
 .../quick-strategy/quick-strategy.scss        |  47 +-
 src/pages/bot-builder/toolbar/toolbar.scss    |  24 +-
 src/pages/bot-builder/workspace.scss          |   3 +
 src/pages/chart/chart-modal/chart-modal.scss  |   6 +-
 src/pages/chart/chart.scss                    |  14 +
 src/pages/dashboard/dashboard.scss            |   2 +
 .../load-bot-preview/delete-dialog.scss       |   6 +
 .../dashboard/load-bot-preview/index.scss     |  10 +-
 .../load-bot-preview/save-modal.scss          |   9 +-
 src/pages/main/main.scss                      |  28 +-
 .../quick-strategy-content/index.scss         |   3 +
 src/pages/tutorials/tutorials.scss            |  63 +-
 src/styles/index.scss                         |   1 +
 61 files changed, 729 insertions(+), 1866 deletions(-)
 delete mode 100644 src/components/shared/styles/constants.scss
 delete mode 100644 src/components/shared/styles/devices.scss
 delete mode 100644 src/components/shared/styles/fonts.scss
 delete mode 100644 src/components/shared/styles/google-fonts.scss
 delete mode 100644 src/components/shared/styles/inline-icons.scss
 delete mode 100644 src/components/shared/styles/mixins.scss
 delete mode 100644 src/components/shared/styles/reset.scss
 delete mode 100644 src/components/shared/styles/themes.scss

diff --git a/.stylelintrc.cjs b/.stylelintrc.cjs
index c67e7fad..8401454f 100644
--- a/.stylelintrc.cjs
+++ b/.stylelintrc.cjs
@@ -8,6 +8,7 @@ module.exports = {
         'color-no-invalid-hex': true,
         'declaration-block-no-duplicate-properties': [true, { ignore: ['consecutive-duplicates'] }],
         'declaration-block-no-shorthand-property-overrides': true,
+        'declaration-block-no-redundant-longhand-properties': null,
         'font-family-name-quotes': 'always-unless-keyword',
         'function-calc-no-unspaced-operator': true,
         'function-name-case': 'lower',
@@ -23,6 +24,7 @@ module.exports = {
             },
         ],
         'selector-class-pattern': null,
+        'selector-id-pattern': null,
         'selector-pseudo-element-colon-notation': 'single',
         'selector-pseudo-element-no-unknown': true,
         'selector-type-case': 'lower',
@@ -32,6 +34,8 @@ module.exports = {
         'time-min-milliseconds': 100,
         'unit-allowed-list': ['fr', 'px', 'em', 'rem', '%', 'svh', 'vw', 'vh', 'deg', 'ms', 's', 'dpcm'],
         'value-keyword-case': 'lower',
+        'scss/at-extend-no-missing-placeholder': null,
+        'custom-property-pattern': null,
     },
     extends: ['stylelint-config-standard-scss'],
     ignoreFiles: ['packages/*/dist/**/*.css'],
diff --git a/package-lock.json b/package-lock.json
index 2ad6fe66..919988a5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -74,9 +74,9 @@
                 "@commitlint/config-conventional": "^17.1.0",
                 "@deriv-com/eslint-config-deriv": "^2.1.0-beta.3",
                 "@jest/globals": "^29.7.0",
-                "@rsbuild/core": "^1.0.1-beta.0",
-                "@rsbuild/plugin-react": "^1.0.1-beta.1",
-                "@rsbuild/plugin-sass": "^1.0.1-beta.1",
+                "@rsbuild/core": "^1.0.1-beta.4",
+                "@rsbuild/plugin-react": "^1.0.1-beta.4",
+                "@rsbuild/plugin-sass": "^1.0.1-beta.4",
                 "@testing-library/dom": "^10.3.1",
                 "@testing-library/jest-dom": "^6.4.6",
                 "@testing-library/react": "^16.0.0",
@@ -4452,28 +4452,16 @@
                 "node": ">=14.0.0"
             }
         },
-        "node_modules/@rollup/rollup-linux-x64-gnu": {
-            "version": "4.18.1",
-            "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.18.1.tgz",
-            "integrity": "sha512-7O5u/p6oKUFYjRbZkL2FLbwsyoJAjyeXHCU3O4ndvzg2OFO2GinFPSJFGbiwFDaCFc+k7gs9CF243PwdPQFh5g==",
-            "cpu": [
-                "x64"
-            ],
-            "optional": true,
-            "os": [
-                "linux"
-            ]
-        },
         "node_modules/@rsbuild/core": {
-            "version": "1.0.1-beta.1",
-            "resolved": "https://registry.npmjs.org/@rsbuild/core/-/core-1.0.1-beta.1.tgz",
-            "integrity": "sha512-EfpuGomQIv9Hzu0A0S3WAHwwDblLQVR0QjSfkoTG9e7VhgHOoAAL4FRENGH1JRUB/veVY45oaaT1OWGjnng9dw==",
+            "version": "1.0.1-beta.4",
+            "resolved": "https://registry.npmjs.org/@rsbuild/core/-/core-1.0.1-beta.4.tgz",
+            "integrity": "sha512-mjtmZIrlNf8nHuTDIwazk/4HFkXmjg/A5CwGsl77GeCp8ciI5D2q5ZSKvFfLTOIFAWWpno3pOLT8bBR1Co9YKw==",
             "dev": true,
             "dependencies": {
-                "@rspack/core": "1.0.0-alpha.3",
-                "@rspack/lite-tapable": "1.0.0-alpha.3",
+                "@rspack/core": "1.0.0-alpha.5",
+                "@rspack/lite-tapable": "1.0.0-alpha.5",
                 "@swc/helpers": "0.5.11",
-                "caniuse-lite": "^1.0.30001640",
+                "caniuse-lite": "^1.0.30001643",
                 "core-js": "~3.37.1",
                 "postcss": "^8.4.39"
             },
@@ -4523,26 +4511,26 @@
             }
         },
         "node_modules/@rsbuild/core/node_modules/@rspack/binding": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding/-/binding-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-S/JjBWr8PE/l7+2xsk1m77CZnKwQNk+39uIsvHQhoRs+DL9SUDjjkUO4yqjCw6ZUGqEaTv4U/TL9TAmbrTth7g==",
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding/-/binding-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-CTrYz0Kgv+3k0sBXbY/MruciFVr2Qd+r3r/VEAVT4N0qhKporsubs1J49vLU2VXun1PBfZ3+3sBknjo5AlA0vw==",
             "dev": true,
             "optionalDependencies": {
-                "@rspack/binding-darwin-arm64": "1.0.0-alpha.3",
-                "@rspack/binding-darwin-x64": "1.0.0-alpha.3",
-                "@rspack/binding-linux-arm64-gnu": "1.0.0-alpha.3",
-                "@rspack/binding-linux-arm64-musl": "1.0.0-alpha.3",
-                "@rspack/binding-linux-x64-gnu": "1.0.0-alpha.3",
-                "@rspack/binding-linux-x64-musl": "1.0.0-alpha.3",
-                "@rspack/binding-win32-arm64-msvc": "1.0.0-alpha.3",
-                "@rspack/binding-win32-ia32-msvc": "1.0.0-alpha.3",
-                "@rspack/binding-win32-x64-msvc": "1.0.0-alpha.3"
+                "@rspack/binding-darwin-arm64": "1.0.0-alpha.5",
+                "@rspack/binding-darwin-x64": "1.0.0-alpha.5",
+                "@rspack/binding-linux-arm64-gnu": "1.0.0-alpha.5",
+                "@rspack/binding-linux-arm64-musl": "1.0.0-alpha.5",
+                "@rspack/binding-linux-x64-gnu": "1.0.0-alpha.5",
+                "@rspack/binding-linux-x64-musl": "1.0.0-alpha.5",
+                "@rspack/binding-win32-arm64-msvc": "1.0.0-alpha.5",
+                "@rspack/binding-win32-ia32-msvc": "1.0.0-alpha.5",
+                "@rspack/binding-win32-x64-msvc": "1.0.0-alpha.5"
             }
         },
         "node_modules/@rsbuild/core/node_modules/@rspack/binding-darwin-arm64": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-darwin-arm64/-/binding-darwin-arm64-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-PZLdp0tgoti/skzIMijNr2jedKa8LGbhtPs6a0jgIuLY1g0fj/aL3LLGMo4rwoy/zGXeZf40PIJQB8b+w0qt7g==",
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-darwin-arm64/-/binding-darwin-arm64-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-ogpsxEjqwsn4aeeS0wyUnxuH8yXKTa2+BfxM7aSQILq4MNUVH0MqZ9dn0HAaGfQ3hdUhIqE3Gld6spdQCrgtHQ==",
             "cpu": [
                 "arm64"
             ],
@@ -4552,119 +4540,15 @@
                 "darwin"
             ]
         },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-darwin-x64": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-darwin-x64/-/binding-darwin-x64-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-NrNfjzsWo3kFh37tpCxNw75xuSGHdGCHIRCjKnvxHQ46aB+Y2wiOdGgSk7SnZHsRWpZyDFw3aBJCayiXlfgdTw==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "darwin"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-arm64-gnu": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-EjzyZWZSjo02ReGUzQPt8sY1hEx2V9lEbg1cqgnE1NpSOS77ratNoAvS3gAzXL6NGWRhYrIH2yaN+6OB9olt/g==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-arm64-musl": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-HJQ52KWNnMOFqbXhaIHTAr54ES5LSunJF6SLnIMgElReC39WvUNDmHhCA5yPebkXgY2SDrLIKDmqxouZmYWulQ==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-x64-gnu": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-VcpKLI2AZmFOTec8C9YJTdMrgZMrgsQkMeQzTY1uOQuIaAaNCuPBFRdlJaRSTAG0t4aaxaVfR1c3JY8GITacfA==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-x64-musl": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-FypR+RqONTvrgX+SI8sJqhVqv8uhTdq3OHew4ZaL3VN0dp2thmpMX5cJ+XQAsU414OLRTgREU9go2j78n7kvUA==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-win32-arm64-msvc": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-aAGQE2TJOhlK6jGYXZyon0JKTP5t2o51/exsSzyH6BSqFce/Qd5w1fqgm6FONTuosrwaBxHSz1pprNq6vx87kA==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-win32-ia32-msvc": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-OouAliQG6dONL9B+Jy237fhs6bScloAT3uphkDumsiAmH1926MYeSKhsmYU4j8b352iGtZVXaH/wR5svLTUCVQ==",
-            "cpu": [
-                "ia32"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ]
-        },
-        "node_modules/@rsbuild/core/node_modules/@rspack/binding-win32-x64-msvc": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-CLh3p5a15wPQE8zOyBjBjVBrbdaDvAfacXkmCQK4I6lBc3HetkJNyjS8Fntf1CV9sWgJhwABUWHn7kMQeLY9RQ==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ]
-        },
         "node_modules/@rsbuild/core/node_modules/@rspack/core": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/core/-/core-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-TcZZNMpyTjEIBP4zMCpLwXBiATEQ2QG3jKsV+mq55ZGKfqd/l86Zr3SboF15GOQip1wDHlSpA1bvrT18f9h0sw==",
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/core/-/core-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-3nddnCqwnz91KprvMlqBDURYJ1GkT5IqCl+os05i2ce4Vk3zQmzvv8d/X8l/49CrDCOLrwyyuS3bKwca8aWdcg==",
             "dev": true,
             "dependencies": {
                 "@module-federation/runtime-tools": "0.2.3",
-                "@rspack/binding": "1.0.0-alpha.3",
-                "@rspack/lite-tapable": "1.0.0-alpha.3",
+                "@rspack/binding": "1.0.0-alpha.5",
+                "@rspack/lite-tapable": "1.0.0-alpha.5",
                 "caniuse-lite": "^1.0.30001616"
             },
             "engines": {
@@ -4679,13 +4563,30 @@
                 }
             }
         },
+        "node_modules/@rsbuild/plugin-basic-ssl": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/@rsbuild/plugin-basic-ssl/-/plugin-basic-ssl-1.1.0.tgz",
+            "integrity": "sha512-MqNYK3Yqnht6YNpIzYKReNAjiZZPblNui9pDVe256VmOQq9Wrj6VRpC+pgOQurYw7UwG8C9LHDFdZlmdCqDuYg==",
+            "dev": true,
+            "dependencies": {
+                "selfsigned": "^2.4.1"
+            },
+            "peerDependencies": {
+                "@rsbuild/core": "0.x || 1.x"
+            },
+            "peerDependenciesMeta": {
+                "@rsbuild/core": {
+                    "optional": true
+                }
+            }
+        },
         "node_modules/@rsbuild/plugin-react": {
-            "version": "1.0.1-beta.1",
-            "resolved": "https://registry.npmjs.org/@rsbuild/plugin-react/-/plugin-react-1.0.1-beta.1.tgz",
-            "integrity": "sha512-IhaEeu/zSwMByqGjMImqFKvd6LTxhU1avteaUvdIe8qfhfZC32p7ZR3ANImMMImHN/PqsSQsX+ScCa5oL0zjsw==",
+            "version": "1.0.1-beta.4",
+            "resolved": "https://registry.npmjs.org/@rsbuild/plugin-react/-/plugin-react-1.0.1-beta.4.tgz",
+            "integrity": "sha512-CIn56QLBZpS+4+zRFehDdW+1iHwi+M8omztCwzYbvkWwtz7XwGGjgnoRrw4FW+vCCW+n6PzIlOQiTZsOGrP3Fg==",
             "dev": true,
             "dependencies": {
-                "@rspack/plugin-react-refresh": "1.0.0-alpha.3",
+                "@rspack/plugin-react-refresh": "1.0.0-alpha.5",
                 "react-refresh": "^0.14.2"
             },
             "peerDependencies": {
@@ -4693,16 +4594,16 @@
             }
         },
         "node_modules/@rsbuild/plugin-sass": {
-            "version": "1.0.1-beta.1",
-            "resolved": "https://registry.npmjs.org/@rsbuild/plugin-sass/-/plugin-sass-1.0.1-beta.1.tgz",
-            "integrity": "sha512-pZlkIabEZ9RFBvguaah+/FQ08fIsF1WSF8gIphAk/+Cw9ZV0uVODpkxkdg82l9ui3zRSr7a5R0Iss2a7dFOERg==",
+            "version": "1.0.1-beta.4",
+            "resolved": "https://registry.npmjs.org/@rsbuild/plugin-sass/-/plugin-sass-1.0.1-beta.4.tgz",
+            "integrity": "sha512-waB0povubXIeiCa+POtDZaWbm0Tzc+UXUuHOComlsGWw7goYWKiJ978NKww8txjA1vfR0O1bDRpRpRudYex1XQ==",
             "dev": true,
             "dependencies": {
                 "deepmerge": "^4.3.1",
                 "loader-utils": "^2.0.4",
                 "postcss": "^8.4.39",
                 "reduce-configs": "^1.0.0",
-                "sass-embedded": "^1.77.5"
+                "sass-embedded": "^1.77.8"
             },
             "peerDependencies": {
                 "@rsbuild/core": "^1.0.1-beta.0"
@@ -4750,118 +4651,6 @@
             ],
             "peer": true
         },
-        "node_modules/@rspack/binding-darwin-x64": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-darwin-x64/-/binding-darwin-x64-0.7.5.tgz",
-            "integrity": "sha512-teLK0TB1x0CsvaaiCopsFx4EvJe+/Hljwii6R7C9qOZs5zSOfbT/LQ202eA0sAGodCncARCGaXVrsekbrRYqeA==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-linux-arm64-gnu": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-0.7.5.tgz",
-            "integrity": "sha512-/24UytJXrK+7CsucDb30GCKYIJ8nG6ceqbJyOtsJv9zeArNLHkxrYGSyjHJIpQfwVN17BPP4RNOi+yIZ3ZgDyA==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-linux-arm64-musl": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-musl/-/binding-linux-arm64-musl-0.7.5.tgz",
-            "integrity": "sha512-6RcxG42mLM01Pa6UYycACu/Nu9qusghAPUJumb8b8x5TRIDEtklYC5Ck6Rmagm+8E0ucMude2E/D4rMdIFcS3A==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-linux-x64-gnu": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-gnu/-/binding-linux-x64-gnu-0.7.5.tgz",
-            "integrity": "sha512-R0Lu4CJN2nWMW7WzPBuCIju80cQPpcaqwKJDj/quwQySpJJZ6c5qGwB8mntqjxIzZDrNH6u0OkpiUTbvWZj8ww==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-linux-x64-musl": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-musl/-/binding-linux-x64-musl-0.7.5.tgz",
-            "integrity": "sha512-dDgi/ThikMy1m4llxPeEXDCA2I8F8ezFS/eCPLZGU2/J1b4ALwDjuRsMmo+VXSlFCKgIt98V6h1woeg7nu96yg==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-win32-arm64-msvc": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-0.7.5.tgz",
-            "integrity": "sha512-nEF4cUdLfgEK6FrgJSJhUlr2/7LY1tmqBNQCFsCjtDtUkQbJIEo1b8edT94G9tJcQoFE4cD+Re30yBYbQO2Thg==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-win32-ia32-msvc": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-0.7.5.tgz",
-            "integrity": "sha512-hEcHRwJIzpZsePr+5x6V/7TGhrPXhSZYG4sIhsrem1za9W+qqCYYLZ7KzzbRODU07QaAH2RxjcA1bf8F2QDYAQ==",
-            "cpu": [
-                "ia32"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "peer": true
-        },
-        "node_modules/@rspack/binding-win32-x64-msvc": {
-            "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-x64-msvc/-/binding-win32-x64-msvc-0.7.5.tgz",
-            "integrity": "sha512-PpVpP6J5/2b4T10hzSUwjLvmdpAOj3ozARl1Nrf/lsbYwhiXivoB8Gvoy/xe/Xpgr732Dk9VCeeW8rreWOOUVQ==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "peer": true
-        },
         "node_modules/@rspack/core": {
             "version": "0.7.5",
             "resolved": "https://registry.npmjs.org/@rspack/core/-/core-0.7.5.tgz",
@@ -4889,18 +4678,18 @@
             }
         },
         "node_modules/@rspack/lite-tapable": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/lite-tapable/-/lite-tapable-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-oQJ1iYxfBHcuutAva2HP1dqi9Aka/70PB3Vbq4nI+iAhHErtzaRslI/OcqhEbbmBgYf+Xu6g5vvN6Gxfq69gag==",
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/lite-tapable/-/lite-tapable-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-B1fNL3en1ohK+QybgjM45PpqcmAmr2LTRUhGvarwouNcj845vjq5clYPqUfFVC0goLmsqx+pt7r+TvpP0Yk67A==",
             "dev": true,
             "engines": {
                 "node": ">=16.0.0"
             }
         },
         "node_modules/@rspack/plugin-react-refresh": {
-            "version": "1.0.0-alpha.3",
-            "resolved": "https://registry.npmjs.org/@rspack/plugin-react-refresh/-/plugin-react-refresh-1.0.0-alpha.3.tgz",
-            "integrity": "sha512-gYPKkON3uhdj33J5tO+Z31JknAKeWeBVlTyDFz/2w+eIj8V1CIsAgeYO13mednPxVjfy1Tw8Qg7hfUnnVBoRFw==",
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/plugin-react-refresh/-/plugin-react-refresh-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-qyTYh1CsHQOjh6hxKIpiWgH18uwNj4+renv5U5nDIHixz7b8f96PYIP+Ptc9BnNklkc4BivF2RHpSNTsYeZ3fQ==",
             "dev": true,
             "dependencies": {
                 "error-stack-parser": "^2.0.6",
@@ -7447,9 +7236,9 @@
             }
         },
         "node_modules/caniuse-lite": {
-            "version": "1.0.30001641",
-            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001641.tgz",
-            "integrity": "sha512-Phv5thgl67bHYo1TtMY/MurjkHhV4EDaCosezRXgZ8jzA/Ub+wjxAvbGvjoFENStinwi5kCyOYV3mi5tOGykwA==",
+            "version": "1.0.30001643",
+            "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001643.tgz",
+            "integrity": "sha512-ERgWGNleEilSrHM6iUz/zJNSQTP8Mr21wDWpdgvRwcTXGAq6jMtOUPP4dqFPTdKqZ2wKTdtB+uucZ3MRpAUSmg==",
             "funding": [
                 {
                     "type": "opencollective",
@@ -18785,82 +18574,6 @@
                 "sass-embedded-win32-x64": "1.77.8"
             }
         },
-        "node_modules/sass-embedded-android-arm": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.77.8.tgz",
-            "integrity": "sha512-GpGL7xZ7V1XpFbnflib/NWbM0euRzineK0iwoo31/ntWKAXGj03iHhGzkSiOwWSFcXgsJJi3eRA5BTmBvK5Q+w==",
-            "cpu": [
-                "arm"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "android"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-android-arm64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.77.8.tgz",
-            "integrity": "sha512-EmWHLbEx0Zo/f/lTFzMeH2Du+/I4RmSRlEnERSUKQWVp3aBSO04QDvdxfFezgQ+2Yt/ub9WMqBpma9P/8MPsLg==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "android"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-android-ia32": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-android-ia32/-/sass-embedded-android-ia32-1.77.8.tgz",
-            "integrity": "sha512-+GjfJ3lDezPi4dUUyjQBxlNKXNa+XVWsExtGvVNkv1uKyaOxULJhubVo2G6QTJJU0esJdfeXf5Ca5/J0ph7+7w==",
-            "cpu": [
-                "ia32"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "android"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-android-x64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.77.8.tgz",
-            "integrity": "sha512-YZbFDzGe5NhaMCygShqkeCWtzjhkWxGVunc7ULR97wmxYPQLPeVyx7XFQZc84Aj0lKAJBJS4qRZeqphMqZEJsQ==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "android"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
         "node_modules/sass-embedded-darwin-arm64": {
             "version": "1.77.8",
             "resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.77.8.tgz",
@@ -18880,222 +18593,6 @@
                 "node": ">=14.0.0"
             }
         },
-        "node_modules/sass-embedded-darwin-x64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.77.8.tgz",
-            "integrity": "sha512-/VWZQtcWIOek60Zj6Sxk6HebXA1Qyyt3sD8o5qwbTgZnKitB1iEBuNunyGoAgMNeUz2PRd6rVki6hvbas9hQ6w==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-arm": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.77.8.tgz",
-            "integrity": "sha512-2edZMB6jf0whx3T0zlgH+p131kOEmWp+I4wnKj7ZMUeokiY4Up05d10hSvb0Q63lOrSjFAWu6P5/pcYUUx8arQ==",
-            "cpu": [
-                "arm"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-arm64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.77.8.tgz",
-            "integrity": "sha512-6iIOIZtBFa2YfMsHqOb3qake3C9d/zlKxjooKKnTSo+6g6z+CLTzMXe1bOfayb7yxeenElmFoK1k54kWD/40+g==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-ia32": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-ia32/-/sass-embedded-linux-ia32-1.77.8.tgz",
-            "integrity": "sha512-63GsFFHWN5yRLTWiSef32TM/XmjhCBx1DFhoqxmj+Yc6L9Z1h0lDHjjwdG6Sp5XTz5EmsaFKjpDgnQTP9hJX3Q==",
-            "cpu": [
-                "ia32"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-musl-arm": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.77.8.tgz",
-            "integrity": "sha512-nFkhSl3uu9btubm+JBW7uRglNVJ8W8dGfzVqh3fyQJKS1oyBC3vT3VOtfbT9YivXk28wXscSHpqXZwY7bUuopA==",
-            "cpu": [
-                "arm"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-musl-arm64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.77.8.tgz",
-            "integrity": "sha512-j8cgQxNWecYK+aH8ESFsyam/Q6G+9gg8eJegiRVpA9x8yk3ykfHC7UdQWwUcF22ZcuY4zegrjJx8k+thsgsOVA==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-musl-ia32": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-ia32/-/sass-embedded-linux-musl-ia32-1.77.8.tgz",
-            "integrity": "sha512-oWveMe+8TFlP8WBWPna/+Ec5TV0CE+PxEutyi0ltSruBds2zxRq9dPVOqrpPcDN9QUx50vNZC0Afgch0aQEd0g==",
-            "cpu": [
-                "ia32"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-musl-x64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.77.8.tgz",
-            "integrity": "sha512-2NtRpMXHeFo9kaYxuZ+Ewwo39CE7BTS2JDfXkTjZTZqd8H+8KC53eBh516YQnn2oiqxSiKxm7a6pxbxGZGwXOQ==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-linux-x64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.77.8.tgz",
-            "integrity": "sha512-ND5qZLWUCpOn7LJfOf0gLSZUWhNIysY+7NZK1Ctq+pM6tpJky3JM5I1jSMplNxv5H3o8p80n0gSm+fcjsEFfjQ==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-win32-arm64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.77.8.tgz",
-            "integrity": "sha512-7L8zT6xzEvTYj86MvUWnbkWYCNQP+74HvruLILmiPPE+TCgOjgdi750709BtppVJGGZSs40ZuN6mi/YQyGtwXg==",
-            "cpu": [
-                "arm64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass.bat"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-win32-ia32": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-win32-ia32/-/sass-embedded-win32-ia32-1.77.8.tgz",
-            "integrity": "sha512-7Buh+4bP0WyYn6XPbthkIa3M2vtcR8QIsFVg3JElVlr+8Ng19jqe0t0SwggDgbMX6AdQZC+Wj4F1BprZSok42A==",
-            "cpu": [
-                "ia32"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass.bat"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
-        "node_modules/sass-embedded-win32-x64": {
-            "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.77.8.tgz",
-            "integrity": "sha512-rZmLIx4/LLQm+4GW39sRJW0MIlDqmyV0fkRzTmhFP5i/wVC7cuj8TUubPHw18rv2rkHFfBZKZJTCkPjCS5Z+SA==",
-            "cpu": [
-                "x64"
-            ],
-            "dev": true,
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "bin": {
-                "sass": "dart-sass/sass.bat"
-            },
-            "engines": {
-                "node": ">=14.0.0"
-            }
-        },
         "node_modules/sass-embedded/node_modules/has-flag": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
diff --git a/package.json b/package.json
index 94e496d0..ad29cbdc 100644
--- a/package.json
+++ b/package.json
@@ -83,9 +83,9 @@
         "@commitlint/config-conventional": "^17.1.0",
         "@deriv-com/eslint-config-deriv": "^2.1.0-beta.3",
         "@jest/globals": "^29.7.0",
-        "@rsbuild/core": "^1.0.1-beta.0",
-        "@rsbuild/plugin-react": "^1.0.1-beta.1",
-        "@rsbuild/plugin-sass": "^1.0.1-beta.1",
+        "@rsbuild/core": "^1.0.1-beta.4",
+        "@rsbuild/plugin-react": "^1.0.1-beta.4",
+        "@rsbuild/plugin-sass": "^1.0.1-beta.4",
         "@testing-library/dom": "^10.3.1",
         "@testing-library/jest-dom": "^6.4.6",
         "@testing-library/react": "^16.0.0",
diff --git a/rsbuild.config.ts b/rsbuild.config.ts
index fcc68972..f599d03a 100644
--- a/rsbuild.config.ts
+++ b/rsbuild.config.ts
@@ -9,14 +9,12 @@ export default defineConfig({
         pluginSass({
             sassLoaderOptions: {
                 sourceMap: true,
-                additionalData: `
-                    @import "${path.resolve(__dirname, 'src/components/shared/styles/constants.scss')}";
-                    @import "${path.resolve(__dirname, 'src/components/shared/styles/mixins.scss')}";
-                    @import "${path.resolve(__dirname, 'src/components/shared/styles/fonts.scss')}";
-                    @import "${path.resolve(__dirname, 'src/components/shared/styles/inline-icons.scss')}";
-                    @import "${path.resolve(__dirname, 'src/components/shared/styles/devices.scss')}";
-                `,
+                sassOptions: {
+                    includePaths: [path.resolve(__dirname, 'src')],
+                },
+                // additionalData: `@use "${path.resolve(__dirname, 'src/components/shared/styles')}" as *;`,
             },
+            exclude: /node_modules/,
         }),
         pluginReact(),
     ],
@@ -55,6 +53,10 @@ export default defineConfig({
     },
     server: {
         port: 8443,
+        compress: true,
+    },
+    dev: {
+        hmr: true,
     },
     tools: {
         rspack: {
diff --git a/src/components/bot-notification-messages/bot-notification-messages.scss b/src/components/bot-notification-messages/bot-notification-messages.scss
index 083c9417..c6fae528 100644
--- a/src/components/bot-notification-messages/bot-notification-messages.scss
+++ b/src/components/bot-notification-messages/bot-notification-messages.scss
@@ -1,3 +1,5 @@
+@use './../shared/styles/mixins' as *;
+
 .notifications-container {
     position: absolute;
     top: 6.5rem;
@@ -10,6 +12,7 @@
             transform 0.3s ease,
             opacity 0.25s linear;
     }
+
     &__dashboard {
         .notification-messages {
             transform: translate3d(calc(-42.7rem), 0, 0);
@@ -19,6 +22,7 @@
             }
         }
     }
+
     &--panel-open {
         .notification-messages {
             transform: translate3d(calc(-36.5rem), 0, 0);
diff --git a/src/components/bot-notification/bot-notification.scss b/src/components/bot-notification/bot-notification.scss
index 33b9e9dd..7588398a 100644
--- a/src/components/bot-notification/bot-notification.scss
+++ b/src/components/bot-notification/bot-notification.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/devices' as *;
+
 .Toastify {
     &__toast {
         background: var(--icon-black-plus);
diff --git a/src/components/contract-result-overlay/contract-result-overlay.scss b/src/components/contract-result-overlay/contract-result-overlay.scss
index 74ef1637..e5307e75 100644
--- a/src/components/contract-result-overlay/contract-result-overlay.scss
+++ b/src/components/contract-result-overlay/contract-result-overlay.scss
@@ -1,7 +1,11 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 @keyframes animate-fade-in {
     0% {
         opacity: 0;
     }
+
     100% {
         opacity: 1;
     }
@@ -22,6 +26,7 @@
     z-index: 2;
     background-color: var(--overlay-inside-dialog);
     animation: animate-fade-in 0.3s;
+
     @include flex-center;
 
     &:hover {
@@ -31,14 +36,17 @@
             opacity: 0;
         }
     }
+
     &-caption {
         display: flex;
         align-items: center;
         transition: opacity 0.25s linear;
     }
+
     &-icon {
         margin-left: 10px;
     }
+
     &--won {
         background-image: $COLOR_LIGHT_GREEN_GRADIENT; // TODO: Update when gradients are added.
 
@@ -46,6 +54,7 @@
             color: var(--text-profit-success);
         }
     }
+
     &--lost {
         background-image: $COLOR_LIGHT_RED_GRADIENT; // TODO: Update when gradients are added.
 
diff --git a/src/components/flyout/flyout.scss b/src/components/flyout/flyout.scss
index 73031f74..0a58fddc 100644
--- a/src/components/flyout/flyout.scss
+++ b/src/components/flyout/flyout.scss
@@ -1,7 +1,10 @@
+@use 'components/shared/styles/constants' as *;
+
 @keyframes fade-in {
     0% {
         opacity: 0;
     }
+
     100% {
         opacity: 1;
     }
@@ -33,6 +36,7 @@
             animation: fade-in 0.3s;
         }
     }
+
     &__content {
         overflow: auto;
         height: calc(100% - 64px);
@@ -40,6 +44,7 @@
         .dc-themed-scrollbars {
             padding: 5px 25px;
         }
+
         &-disclaimer {
             display: flex;
             justify-content: space-around;
@@ -54,11 +59,13 @@
                 color: $color-black-1;
                 width: 324px;
             }
+
             &-icon {
                 padding-top: 0.8rem;
             }
         }
     }
+
     &__block-workspace {
         &--top {
             margin-bottom: $default-margin;
@@ -66,23 +73,27 @@
 
         &--center {
             margin-top: 0.6em;
+
             .injectionDiv {
                 height: 100%;
             }
         }
+
         &__header {
             display: flex;
         }
     }
+
     &__button {
         &-new {
             width: 20%;
             height: 4rem !important;
             font-size: var(--text-size-xs);
             font-weight: bold;
-            border-top-left-radius: 0rem !important;
-            border-bottom-left-radius: 0rem !important;
+            border-top-left-radius: 0 !important;
+            border-bottom-left-radius: 0 !important;
         }
+
         &-add {
             color: var(--general-main-1);
 
@@ -90,6 +101,7 @@
                 display: none !important;
             }
         }
+
         &-back {
             padding: 0 15px;
             align-self: center;
@@ -99,10 +111,12 @@
             svg {
                 vertical-align: middle;
             }
+
             &:focus {
                 outline: none;
             }
         }
+
         &-next,
         &-previous {
             margin-inline-start: 1em;
@@ -111,6 +125,7 @@
             display: flex;
         }
     }
+
     &__item {
         line-height: 1.3em;
         font-size: var(--text-size-xs);
@@ -118,21 +133,25 @@
         &:not(:last-of-type) {
             margin-bottom: 30px;
         }
+
         &-header {
             display: flex;
             margin-top: $default-margin;
             margin-bottom: 10px;
         }
+
         &-buttons {
             margin-inline-start: auto;
             align-self: center;
         }
+
         &-info {
             cursor: pointer;
             font-weight: bold;
             display: block;
             color: $COLOR_RED;
         }
+
         &-description {
             font-size: var(--text-size-xs);
             margin-bottom: 1em;
@@ -140,16 +159,19 @@
             color: var(--text-general);
         }
     }
+
     &__image {
         width: 100%;
         height: auto;
         border-radius: 0.5em;
     }
+
     &__video {
         width: 100%;
         height: 20vh;
         border-radius: 0.5em;
     }
+
     &__help {
         padding: 0;
         height: 100%;
@@ -160,6 +182,7 @@
             display: flex;
             background-color: var(--general-section-1);
         }
+
         &-content {
             padding: 1.5em;
             font-size: 0.8em;
@@ -170,9 +193,11 @@
                 margin-bottom: 0.8em;
             }
         }
+
         &-title {
             align-self: center;
         }
+
         &-footer {
             display: flex;
             justify-content: flex-end;
@@ -180,6 +205,7 @@
             border-top: solid 0.1em var(--general-section-1);
         }
     }
+
     &__search {
         padding: 0;
         visibility: visible;
@@ -194,6 +220,7 @@
                 align-self: center;
             }
         }
+
         &-empty {
             padding: 25px 0;
         }
@@ -201,6 +228,7 @@
             height: calc(100% - 60px);
         }
     }
+
     &__normal {
         visibility: visible;
 
@@ -208,15 +236,17 @@
             height: 100%;
         }
     }
+
     &__input {
         width: 80% !important;
         height: 4rem;
-        border-top-right-radius: 0rem !important;
-        border-bottom-right-radius: 0rem !important;
+        border-top-right-radius: 0 !important;
+        border-bottom-right-radius: 0 !important;
         border: solid 1px $color-grey-5 !important;
         display: inline-block !important;
         margin-top: 3.3rem;
     }
+
     &__hr {
         height: 2px;
         width: 100%;
diff --git a/src/components/journal/journal.scss b/src/components/journal/journal.scss
index 81a0697e..69e2d56d 100644
--- a/src/components/journal/journal.scss
+++ b/src/components/journal/journal.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 /**
  * @define journal
  */
@@ -11,15 +14,19 @@
         &__header {
             padding: 0.8rem;
         }
+
         &__icon {
             align-self: center;
         }
+
         &__message {
             margin: 0 auto;
+
             & .dc-text {
                 line-height: var(--text-lh-xxl);
             }
         }
+
         &__list {
             list-style-type: disc;
             margin-left: 20px;
@@ -30,18 +37,21 @@
             }
         }
     }
+
     &__item {
         padding: 16px;
 
         &-list {
             height: calc(100% - 7.2rem);
         }
+
         &-content {
             > * {
                 width: 100%;
             }
         }
     }
+
     &__data-list {
         .ReactVirtualized__Grid__innerScrollContainer {
             > div:nth-child(even) {
@@ -49,6 +59,7 @@
             }
         }
     }
+
     &-tools {
         &__container {
             display: flex;
@@ -59,6 +70,7 @@
 
             &-filter {
                 @include flex-center(flex-end);
+
                 cursor: pointer;
                 flex: 1;
 
@@ -72,6 +84,7 @@
             }
         }
     }
+
     &__text {
         font-size: var(--text-size-xxs);
         line-height: 1.5;
@@ -82,33 +95,41 @@
         &-date {
             display: inline;
         }
+
         &-datetime {
             color: var(--text-less-prominent);
             font-size: var(--text-size--xxxs);
             margin-top: 6px;
         }
+
         &--error {
             color: var(--status-danger);
         }
+
         &--warn {
             color: var(--status-warning);
         }
+
         &--info {
             color: var(--status-info);
         }
+
         &--success {
             color: var(--status-success);
         }
+
         &--bold {
             font-weight: bold;
         }
     }
+
     &__loader {
         width: 350px;
         height: 9.2rem;
 
         &--mobile {
             @extend .journal__loader;
+
             width: 100vw;
         }
     }
@@ -133,16 +154,19 @@
         opacity: 1;
         transform: translate3d(0, 0, 0);
     }
+
     &--enter,
     &--exit {
         opacity: 0;
         transform: translate3d(0, -20px, 0);
     }
+
     &__input {
         .input-wrapper__input {
             border: 1px solid var(--border-normal);
         }
     }
+
     &__button {
         margin-top: 0.8rem;
 
diff --git a/src/components/layout/footer/footer.scss b/src/components/layout/footer/footer.scss
index 4e8244be..9d57e07d 100644
--- a/src/components/layout/footer/footer.scss
+++ b/src/components/layout/footer/footer.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 .app-footer {
     height: 3.6rem;
     display: flex;
diff --git a/src/components/load-modal/load-modal.scss b/src/components/load-modal/load-modal.scss
index cbcafb81..7c5ae28e 100644
--- a/src/components/load-modal/load-modal.scss
+++ b/src/components/load-modal/load-modal.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 #modal_root {
     .load-strategy {
         &__recent {
@@ -13,6 +15,7 @@
 
             &__empty {
                 @include flex-center;
+
                 align-items: center;
                 flex-direction: column;
 
@@ -116,6 +119,7 @@
 
                 &-location {
                     @include flex-center(flex-start);
+
                     width: 100%;
                     word-break: break-word;
                     color: var(--text-general);
diff --git a/src/components/run-panel/run-panel.scss b/src/components/run-panel/run-panel.scss
index ad76334f..563e8fba 100644
--- a/src/components/run-panel/run-panel.scss
+++ b/src/components/run-panel/run-panel.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 /**
 * @define -panel
 **/
diff --git a/src/components/shared/styles/constants.scss b/src/components/shared/styles/constants.scss
deleted file mode 100644
index 035748e3..00000000
--- a/src/components/shared/styles/constants.scss
+++ /dev/null
@@ -1,242 +0,0 @@
-/* ------------------------------------*
- *  # Constants
- *------------------------------------ */
-
-/* stylelint-disable color-no-hex */
-
-/* COLOR PALETTE */
-
-/* colors */
-$color-black: #0e0e0e;
-$color-black-1: #333;
-$color-black-3: #151717;
-$color-black-4: #1d1f20;
-$color-black-5: #242828;
-$color-black-6: #3e3e3e;
-$color-black-7: #000;
-$color-black-8: #323738;
-$color-black-9: #5c5c5c;
-$color-blue: #377cfc;
-$color-blue-1: #0dc2e7;
-$color-blue-2: #2a3052;
-$color-blue-3: #0796e0;
-$color-blue-4: #0677af;
-$color-blue-5: #dfeaff;
-$color-blue-6: #92b8ff;
-$color-blue-7: #182130;
-$color-blue-8: #e6f5ff;
-$color-brown: #664407;
-$color-green: #85acb0;
-$color-green-1: #4bb4b3;
-$color-green-2: #3d9494;
-$color-green-3: #00a79e;
-$color-green-4: #008079;
-$color-green-5: #4bb4b329;
-$color-green-6: #17eabd;
-$color-green-7: #e8fdf8;
-$color-green-8: #cedddf;
-$color-grey: #c2c2c2;
-$color-grey-1: #999;
-$color-grey-2: #f2f3f4;
-$color-grey-3: #eaeced;
-$color-grey-4: #e6e9e9;
-$color-grey-5: #d6dadb;
-$color-grey-6: #d6d6d6;
-$color-grey-7: #6e6e6e;
-$color-grey-8: #d7d7d7;
-$color_grey-9: #868686;
-$color-grey-10: #919191;
-$color-grey-11: #fafafa;
-$color-grey-12: #f5f7fa;
-$color-grey-13: #2e2e2e;
-$color-grey-14: #e2e5e7;
-$color-orange: #ff6444;
-$color-purple: #722fe4;
-$color-red: #ff444f;
-$color-red-1: #ec3f3f;
-$color-red-2: #cc2e3d;
-$color-red-3: #a32430;
-$color-red-4: #d33636;
-$color-red-5: #eb3e48;
-$color-red-6: #ec3f3f29;
-$color-red-7: #ffe1e3;
-$color-red-8: #661b20;
-$color-red-9: #b33037;
-$color-red-10: #ff444f;
-$color-red-11: #fce3e3;
-$color-violet: #4a3871;
-$color-white: #fff;
-$color-yellow: #ffad3a;
-$color-yellow-1: #b3760d;
-$color-yellow-2: #ffa912;
-$color-yellow-3: rgb(255 173 58 / 16%);
-
-/* status colors */
-$color-status-warning: rgb(255 173 58 / 16%);
-$color-status-information: rgb(55 124 252 / 16%);
-$color-status-announcement: rgb(75 180 179 / 16%);
-$color-status-error: rgb(236 63 63 / 16%);
-
-/* alpha colors */
-$alpha-color-black-1: transparentize($color-black-7, 0.28);
-$alpha-color-black-2: transparentize($color-black, 0.04);
-$alpha-color-black-3: transparentize($color-black-7, 0.92);
-$alpha-color-black-4: transparentize($color-black-7, 0.84);
-$alpha-color-black-5: transparentize($color-black-7, 0.16);
-$alpha-color-black-6: transparentize($color-black-7, 0.36);
-$alpha-color-black-7: transparentize($color-black, 0.5);
-$alpha-color-blue-1: transparentize($color-blue, 0.84);
-$alpha-color-blue-2: transparentize($color-blue-3, 0.84);
-$alpha-color-blue-3: transparentize($color-blue, 0.92);
-$alpha-color-white-1: transparentize($color-white, 0.04);
-$alpha-color-white-2: transparentize($color-white, 0.84);
-$alpha-color-white-3: transparentize($color-white, 0.92);
-$alpha-color-white-4: transparentize($color-white, 0.3);
-$alpha-color-red-1: transparentize($color-red, 0.92);
-$alpha-color-red-2: transparentize($color-red, 0.84);
-$alpha-color-red-3: transparentize($color-red, 0.76);
-$alpha-color-green-1: transparentize($color-green-1, 0.08);
-$alpha-color-green-2: transparentize($color-green-3, 0.08);
-$alpha-color-yellow-1: transparentize($color-yellow, 0.84);
-
-/* gradient colors */
-$gradient-color-green-1: linear-gradient(to top, $color-white, transparentize($color-green-1, 0.84));
-$gradient-color-green-2: linear-gradient(to top, $color-black, transparentize($color-green-3, 0.84));
-$gradient-color-red-1: linear-gradient(to top, $color-white, transparentize($color-red, 0.84));
-$gradient-color-red-2: linear-gradient(to top, $color-black, transparentize($color-red, 0.84));
-$contract-gradient-color-red-1: linear-gradient(to top, $color-white 85%, transparentize($color-red, 0.84));
-$contract-gradient-color-red-2: linear-gradient(to top, $color-black 85%, transparentize($color-red, 0.84));
-$gradient-color-white: linear-gradient(to right, transparentize($color-white, 1) -5%, $color-white 71%);
-$gradient-color-black: linear-gradient(to right, transparentize($color-black, 1) -5%, $color-black 71%);
-$gradient-color-purple: linear-gradient(274.73deg, #5a205d 3.82%, #7f3883 88.49%);
-$gradient-color-blue: linear-gradient(274.73deg, #1a205e 3.82%, #122d96 88.49%);
-$gradient-color-orange: linear-gradient(90deg, #eb001b 0%, #f79e1b 100%);
-$gradient-color-black-2: linear-gradient(274.73deg, #464750 3.82%, #0e0f11 88.49%);
-$gradient-color-orange-2: linear-gradient(90deg, #f89e32 0%, #f7931b 103.12%);
-$gradient-color-blue-2: linear-gradient(90deg, #3d83cf 0%, #2775ca 100%);
-$gradient-color-green-3: linear-gradient(90deg, #98cc53 0%, #8dc640 100%);
-$gradient-color-blue-3: linear-gradient(90deg, #1a77ac 0%, #0068a3 100%);
-$gradient-color-orange-3: linear-gradient(90deg, #ff7635 0%, #ff671f 100%);
-$gradient-color-orange-4: linear-gradient(90deg, #f36938 0%, #f25822 100%);
-$gradient-color-blue-4: linear-gradient(90deg, #1a8fff 0%, #0083ff 100%);
-$gradient-color-red-3: linear-gradient(90deg, #ff444f 0%, #211d1e 95.22%);
-$gradient-color-red-4: linear-gradient(90deg, #ff6444 0%, #ff444f 100%);
-$gradient-color-black-3: linear-gradient(58.51deg, #061828 28.06%, #1a3c60 93.51%);
-$gradient-color-black-4: linear-gradient(274.25deg, #333 9.01%, #5c5b5b 103.31%);
-$gradient-color-black-5: linear-gradient(180deg, rgb(0 0 0 / 0%) 50%, rgb(0 0 0 / 16%) 100%);
-$gradient-color-white-2: linear-gradient(180deg, rgb(255 255 255 / 0%) 50%, rgb(255 255 255 / 16%) 100%);
-$gradient-color-blue-5: linear-gradient(90deg, #00a8af 0%, #04cfd8 104.41%);
-$gradient-color-gold: linear-gradient(90deg, #f7931a 0%, #ffc71b 104.41%);
-$gradient-color-green-4: linear-gradient(90deg, #1db193 0%, #09da7a 104.41%);
-
-/* Preserve legacy variables */
-
-/* Primary */
-
-$COLOR_BLACK: #000;
-$COLOR_BLACK_2: #1d1f20;
-$COLOR_BLACK_3: #0e0e0e;
-$COLOR_GREEN_1: #39b19d;
-$COLOR_GREEN_2: #2d9f93;
-$COLOR_GREEN_3: #21ce99;
-$COLOR_GREEN_4: #00a79e;
-$COLOR_GREEN_5: #4bb4b3;
-$COLOR_ORANGE: #f93;
-$COLOR_DARK_ORANGE: #ff8802;
-$COLOR_PURPLE: #4f60ae;
-$COLOR_RED: #e31c4b;
-$COLOR_RED_2: #cc2e3d;
-$COLOR_RED_3: #ec3f3f;
-$COLOR_CORAL_RED: #ff444f;
-$COLOR_SKY_BLUE: #2196f3;
-$COLOR_WHITE: #fff;
-$COLOR_BLUE: #1c5ae3;
-
-// Light theme
-$COLOR_LIGHT_BLACK_1: rgb(0 0 0 / 80%);
-$COLOR_LIGHT_BLACK_2: rgb(0 0 0 / 40%);
-$COLOR_LIGHT_BLACK_3: rgb(0 0 0 / 16%);
-$COLOR_LIGHT_BLACK_3_SOLID_1: #d6d6d6;
-$COLOR_LIGHT_BLACK_3_SOLID_2: #b3b3b3;
-$COLOR_LIGHT_BLACK_4: rgb(0 0 0 / 4%);
-$COLOR_LIGHT_BLACK_4_SOLID: #f4f4f6;
-$COLOR_LIGHT_GRAY_1: #999cac;
-$COLOR_LIGHT_GRAY_2: rgb(153 156 172 / 32%);
-$COLOR_LIGHT_GRAY_3: #eaeced;
-$COLOR_LIGHT_GRAY_4: #6e6e6e;
-$COLOR_LIGHT_GRAY_5: #c2c2c2;
-$COLOR_LIGHT_GRAY_6: #f2f3f4;
-$COLOR_LIGHT_GREEN_GRADIENT: linear-gradient(to top, rgb(255 255 255 / 0%), rgb(0 148 117 / 16%));
-$COLOR_LIGHT_RED_GRADIENT: linear-gradient(to top, rgb(255 255 255 / 0%), rgb(227 28 75 / 16%));
-$COLOR_LIGHT_WHITE_GRADIENT: linear-gradient(to right, rgb(255 255 255 / 100%), rgb(255 255 255 / 0%));
-
-// Dark theme
-$COLOR_DARK_BLACK_GRADIENT: linear-gradient(to right, rgb(16 19 32 / 100%), rgb(16 19 32 / 0%));
-$COLOR_DARK_BLUE_1: #0b0e18;
-$COLOR_DARK_BLUE_2: #101320;
-$COLOR_DARK_BLUE_3: #191c31;
-$COLOR_DARK_BLUE_4: #202641;
-$COLOR_DARK_BLUE_5: #2a3052;
-$COLOR_DARK_BLUE_6: #555975;
-$COLOR_DARK_BLUE_7: #7f8397;
-$COLOR_DARK_BLUE_8: rgb(127 131 151 / 30%);
-$COLOR_DARK_GREEN_GRADIENT: linear-gradient(to top, rgb(16 19 32 / 0%), rgb(0 148 117 / 16%));
-$COLOR_DARK_RED_GRADIENT: linear-gradient(to top, rgb(16 19 32 / 0%), rgb(227 28 75 / 16%));
-$COLOR_DARK_GRAY_1: #282a37;
-$COLOR_DARK_GRAY_2: #303342;
-$COLOR_DARK_GRAY_3: #555975;
-$COLOR_DARK_GRAY_4: #999;
-/* stylelint-enable color-no-hex */
-
-$BORDER_RADIUS: 4px;
-$BORDER_RADIUS_2: 8px;
-$MAX_CONTAINER_WIDTH: 1440px;
-$POSITIONS_DRAWER_WIDTH: 240px;
-$POSITIONS_DRAWER_MARGIN: 8px;
-$HEADER_HEIGHT: 48px;
-$FOOTER_HEIGHT: 36px;
-$MOBILE_HEADER_HEIGHT: 40px;
-$MOBILE_HEADER_HEIGHT_DASHBOARD: 48px;
-$MOBILE_WRAPPER_HEADER_HEIGHT: 40px;
-$MOBILE_WRAPPER_FOOTER_HEIGHT: 70px;
-$SIDEBAR_WIDTH: 240px;
-
-/* Wallet gradient background */
-$gradient-airtm: linear-gradient(90deg, #1a8fff 0%, #0083ff 100%);
-$gradient-banxa: linear-gradient(90deg, #000 0%, #4ac0ba 96.35%);
-$gradient-bitcoin: linear-gradient(90deg, #f89e32 0%, #f7931b 103.12%);
-$gradient-credit: linear-gradient(274.73deg, #464750 3.82%, #0e0f11 88.49%);
-$gradient-dp2p: linear-gradient(90deg, #ff444f 0%, #211d1e 95.22%);
-$gradient-fasapay: linear-gradient(90deg, #f6931c 0%, #4873ac 95.22%);
-$gradient-jeton: linear-gradient(90deg, #ff7635 0%, #ff671f 100%);
-$gradient-mastercard: linear-gradient(90deg, #eb001b 0%, #f79e1b 100%);
-$gradient-neteller: linear-gradient(90deg, #98cc53 0%, #8dc640 100%);
-$gradient-paylivre: linear-gradient(90deg, #352caa 0%, #9a6bfc 100%);
-$gradient-paysafe: linear-gradient(90deg, #e3001b 0%, #008ac9 100%);
-$gradient-perfectmoney: linear-gradient(90deg, #f12c2c 0%, #ef1515 100%);
-$gradient-skrill: linear-gradient(274.73deg, #5a205d 3.82%, #7f3883 88.49%);
-$gradient-sticpay: linear-gradient(90deg, #f36938 0%, #f25822 100%);
-$gradient-virtual: linear-gradient(90deg, #ff6444 0%, #ff444f 100%);
-$gradient-visa: linear-gradient(274.73deg, #1a205e 3.82%, #122d96 88.49%);
-$gradient-webmoney: linear-gradient(90deg, #1a77ac 0%, #0068a3 100%);
-
-/* App Cards gradient background */
-$gradient-virtual: linear-gradient(274.25deg, #333 9.01%, #5c5b5b 103.31%);
-$gradient-virtual-swap-free: linear-gradient(58.51deg, #061828 28.06%, #1a3c60 93.51%);
-
-/* Wallets */
-$ready-banner-bg-color: #e2f3f3;
-$ready-banner-tick-bg-color: #4ab4b3;
-$wallet-demo-bg-color: #fff8f9;
-$wallet-dark-demo-bg-color: #140506;
-$wallet-demo-divider-color: #fff0f1;
-$wallet-box-shadow:
-    0 12px 16px -4px rgb(14 14 14 / 8%),
-    0 4px 6px -2px rgb(14 14 14 / 3%);
-$btn-shadow:
-    0 24px 24px 0 rgb(0 0 0 / 8%),
-    0 0 24px 0 rgb(0 0 0 / 8%);
-$tablet-width: 768px;
-$desktop-width: 1024px;
-$min-desktop-width: 1280px;
-$max-mobile-width: 767px;
diff --git a/src/components/shared/styles/devices.scss b/src/components/shared/styles/devices.scss
deleted file mode 100644
index 5b2749a4..00000000
--- a/src/components/shared/styles/devices.scss
+++ /dev/null
@@ -1,62 +0,0 @@
-/**
- * Define Breakpoints here.
- */
-$mobile-width: 320px;
-$tablet-width: 768px;
-$desktop-width: 1024px;
-
-@mixin tablet {
-    @media (min-width: #{$tablet-width}) and (max-width: #{$desktop-width - 1px}) {
-        @content;
-    }
-}
-
-@mixin desktop {
-    @media (min-width: #{$desktop-width}) {
-        @content;
-    }
-}
-
-@mixin tablet-down {
-    @media (max-width: #{$tablet-width}) {
-        @content;
-    }
-}
-
-@mixin tablet-up {
-    @media (min-width: #{$tablet-width}) {
-        @content;
-    }
-}
-
-@mixin mobile-up {
-    @media (min-width: #{$mobile-width}) {
-        @content;
-    }
-}
-
-@mixin mobile {
-    @media (min-width: #{$mobile-width}) and (max-width: #{$tablet-width - 1}) {
-        @content;
-    }
-}
-
-@mixin mobile-landscape {
-    @media only screen and (min-width: #{$mobile-width}) and (max-width: #{$desktop-width - 1}) and (orientation: landscape) {
-        @content;
-    }
-}
-
-@mixin touch-device {
-    // add css interaction media query to detect touch devices
-    // refer to: https://caniuse.com/#feat=css-media-interaction
-    @media (pointer: coarse) {
-        @content;
-    }
-}
-
-@mixin mobile-tablet-mix {
-    @media (min-width: #{$mobile-width}) and (max-width: #{$desktop-width - 1px}) {
-        @content;
-    }
-}
diff --git a/src/components/shared/styles/fonts.scss b/src/components/shared/styles/fonts.scss
deleted file mode 100644
index d0f599dd..00000000
--- a/src/components/shared/styles/fonts.scss
+++ /dev/null
@@ -1,73 +0,0 @@
-/*
-    Constants
-*/
-$FONT_STACK: 'IBM Plex Sans', sans-serif;
-$BASE_FONT_SIZE: 10px;
-
-/*
-    Variables
-*/
-$FONT_SIZES: (
-    'xheading' 3.2rem,
-    'heading' 3rem,
-    'large' 2.8rem,
-    'title' 1.6rem,
-    'paragraph' 1.4rem,
-    'small' 1.2rem,
-    'xsmall' 1rem,
-    'xxsmall' 0.8rem,
-    'xxxsmall' 0.6rem
-);
-
-$FONT_COLORS: (
-    'active' var(--text-colored-background),
-    'prominent' var(--text-prominent),
-    'black' var(--text-general),
-    'grey' var(--text-less-prominent),
-    'disabled' var(--text-disabled),
-    'green' var(--text-profit-success),
-    'red' var(--text-loss-danger)
-);
-
-$FONT_WEIGHTS: ('bold' 700, 'semibold' 500, 'normal' 400, 'light' 300);
-
-$TEXT_ALIGN: ('center' center, 'left' start, 'right' end);
-
-$LINEHEIGHTS: (
-    'large': 1.75,
-    'medium': 1.5,
-    'small': 1.25,
-    'xsmall': 1.4,
-);
-
-/*
- * Generate typefaces key-value pair of variable name and config
- * Example:
-   --paragraph-center-bold-black: (14px, center, bold, black)
- */
-@function generate-typefaces() {
-    $typeface_list: ();
-    @each $fontsize_name, $size in $FONT_SIZES {
-        @each $textalign_name, $text_align in $TEXT_ALIGN {
-            @each $color_name, $color in $FONT_COLORS {
-                @each $fontweight_name, $weight in $FONT_WEIGHTS {
-                    $key: --#{$fontsize_name}-#{$textalign_name}-#{$fontweight_name}-#{$color_name};
-                    $val: ($size, $text_align, $weight, $color);
-                    $typeface: (
-                        $key: $val,
-                    );
-                    $typeface_list: map-merge($typeface_list, $typeface);
-                }
-            }
-        }
-    }
-    // @debug $typeface_list; /* uncomment to debug */
-    @return $typeface_list;
-}
-
-/*
-    List of all typefaces variables in the format: --$FONT_SIZES-$TEXT_ALIGN-$FONT_WEIGHTS-COLORS.
-    See $FONT_SIZES, $TEXT_ALIGN, $FONT_WEIGHTS, $COLORS maps above for references.
-    Variables name example: --title-center-semibold-red
- */
-$TYPEFACES_LIST: generate-typefaces();
diff --git a/src/components/shared/styles/google-fonts.scss b/src/components/shared/styles/google-fonts.scss
deleted file mode 100644
index 2a301512..00000000
--- a/src/components/shared/styles/google-fonts.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-@at-root {
-    @import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:300,400,500,700&display=swap&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese');
-}
diff --git a/src/components/shared/styles/inline-icons.scss b/src/components/shared/styles/inline-icons.scss
deleted file mode 100644
index cde7c339..00000000
--- a/src/components/shared/styles/inline-icons.scss
+++ /dev/null
@@ -1,34 +0,0 @@
-/*
-    to use styles without modifier class on .inline-icon
-    use @extend
-
-    e.g. style icon on parent hover:
-        a:hover .inline-icon {
-            @extend %inline-icon-active;
-        }
-*/
-
-%inline-icon {
-    @include colorIcon(var(--text-general), none);
-
-    &.active,
-    &-active {
-        @include colorIcon(var(--text-prominent), none);
-    }
-    &.disabled,
-    &-disabled {
-        @include colorIcon(var(--text-disabled), none);
-    }
-    &.white,
-    &-white {
-        @include colorIcon(var(--text-prominent));
-    }
-    &.border_hover_color,
-    &-border_hover_color {
-        @include colorIcon(var(--text-prominent));
-    }
-    &.secondary,
-    &-secondary {
-        @include colorIcon(var(--text-less-prominent));
-    }
-}
diff --git a/src/components/shared/styles/mixins.scss b/src/components/shared/styles/mixins.scss
deleted file mode 100644
index 040d7b14..00000000
--- a/src/components/shared/styles/mixins.scss
+++ /dev/null
@@ -1,315 +0,0 @@
-@import './themes';
-@import './devices';
-@import './fonts';
-
-/* ------------------------------------*
- *  # SASS Mixins and Functions
- *------------------------------------ */
-
-/*
- * SASS interpolation
- */
-// Requires the calc-interpolation function which can also be used independently
-@function calc-interpolation($min-screen, $min-value, $max-screen, $max-value) {
-    $a: ($max-value - $min-value) / ($max-screen - $min-screen);
-    $b: $min-value - $a * $min-screen;
-    $sign: '+';
-
-    @if $b < 0 {
-        $sign: '-';
-        $b: abs($b);
-    }
-
-    @return calc(#{$a * 100}vw #{$sign} #{$b});
-}
-
-@mixin interpolate($properties, $min-screen, $max-screen, $min-value, $max-value) {
-    & {
-        @each $property in $properties {
-            #{$property}: $min-value;
-        }
-
-        @media screen and (min-width: $min-screen) {
-            @each $property in $properties {
-                #{$property}: calc-interpolation($min-screen, $min-value, $max-screen, $max-value);
-            }
-        }
-
-        @media screen and (min-width: $max-screen) {
-            @each $property in $properties {
-                #{$property}: $max-value;
-            }
-        }
-    }
-}
-
-/*
- * PX to EM
- * @param $px - px value to be converted
- * @param $base - base font size (in `em`)
- * Note: 'em' values are calculate based on the element font-size
- *       to properly converts 'px' to 'em', please pass in the element font-size with it
- * Usage example:
-    padding: em(16px, 1.6em); // font-size in 'em'
- */
-@function em($px, $base: $BASE_FONT_SIZE) {
-    $list: ();
-
-    @if length($px) != 1 {
-        @for $i from 1 through length($px) {
-            $val_em: (nth($px, $i) / $base) * 1em;
-            $list: append($list, $val_em, space);
-        }
-
-        @return $list;
-    } @else {
-        @return ($px / $base) * 1em;
-    }
-}
-
-/*
- * Set property by passing a property name, and values.
- * @param $property name - padding, margin etc.
- * @param $values        - values in `px` (space separated for multiple values)
- * @param $font-size     - base font-size in `em`
- * Usage example:
-   @include toEm(padding, 8px 16px 8px, 1.6em);
- */
-@mixin toEm($property, $values, $font-size: $BASE_FONT_SIZE) {
-    #{$property}: em($values, $font-size);
-}
-
-/*
- * Generate typefaces key-value pair of variable name and config
- * Example:
-   --paragraph-center-bold-black: (14px, center, bold, black)
- */
-@function generate-typefaces() {
-    $typeface_list: ();
-
-    @each $fontsize_name, $size in $FONT_SIZES {
-        @each $textalign_name, $text_align in $TEXT_ALIGN {
-            @each $color_name, $color in $FONT_COLORS {
-                @each $fontweight_name, $weight in $FONT_WEIGHTS {
-                    $key: --#{$fontsize_name}-#{$textalign_name}-#{$fontweight_name}-#{$color_name};
-                    $val: ($size, $text_align, $weight, $color);
-                    $typeface: (
-                        $key: $val,
-                    );
-                    $typeface_list: map-merge($typeface_list, $typeface);
-                }
-            }
-        }
-    }
-
-    // @debug $typeface_list; /* uncomment to debug */
-    @return $typeface_list;
-}
-
-/*
- * Sets font-size, font-weight, color, text-transform, text-align and line-height
- * Usage example:
-   @include setTypeface(16px, bold, black, uppercase);
- */
-@mixin setTypeface($size, $align, $weight, $colour, $tt) {
-    @if $size {
-        font-size: $size;
-    }
-
-    @if $colour {
-        color: $colour;
-    }
-
-    @if $weight {
-        font-weight: $weight;
-    }
-
-    @if $tt {
-        text-transform: $tt;
-    }
-
-    @if $align {
-        text-align: $align;
-    }
-
-    @if $size == 1.6rem {
-        line-height: map-get($map: $LINEHEIGHTS, $key: 'large');
-    } @else if $size == 1.4rem {
-        line-height: map-get($map: $LINEHEIGHTS, $key: 'medium');
-    } @else if $size == 1.2rem {
-        line-height: map-get($map: $LINEHEIGHTS, $key: 'small');
-    } @else if $size == 1rem {
-        line-height: map-get($map: $LINEHEIGHTS, $key: 'xsmall');
-    } @else {
-        line-height: unset;
-    }
-}
-
-/*
- * Set typefaces by passing a typeface variable name
- * @param $var   - typeface variable
- * @param $tt    - text-transform property
- * @param $align - text-align property
- * Usage example:
-   @include typeface(--paragraph-bold-black, uppercase, center);
- */
-@mixin typeface($var, $tt: none) {
-    $typeface_config: map-get(
-        $map: $TYPEFACES_LIST,
-        $key: $var,
-    );
-    $size: nth($typeface_config, 1); // font-size
-    $align: nth($typeface_config, 2); // text-align
-    $weight: nth($typeface_config, 3); // font-weight
-    $color: nth($typeface_config, 4); // color
-
-    @include setTypeface($size, $align, $weight, $color, $tt);
-}
-
-/*
- * Range Slider Thumb styling is set here
- */
-@mixin thumbStyle() {
-    appearance: none;
-    width: 1em;
-    height: 1em;
-    border-radius: 100%;
-    border: 0;
-    cursor: pointer;
-    transition: box-shadow 0.2s;
-    box-shadow: 0 0 0 0 rgb(0 0 0 / 0%);
-
-    &:hover {
-        box-shadow: 0 0 0 0.5em var(--state-hover);
-    }
-}
-
-/*
- * SVG icons colors
- */
-@mixin colorIcon($colors...) {
-    @for $i from 1 through length($colors) {
-        /* postcss-bem-linter: ignore */
-        .color#{$i}-fill {
-            fill: nth($colors, $i);
-        }
-
-        /* postcss-bem-linter: ignore */
-        .color#{$i}-stroke {
-            stroke: nth($colors, $i);
-        }
-    }
-}
-
-/*
- * Bar Spinner Animation
- * @param $count    - number of bars
- * @param $duration - duration of animation
- * @param $phase    - each bar phase change delay
- * Usage example:
-   @include createBarspinnerAnimation(5, 1.2s, 0,1);
- */
-@mixin createBarspinnerAnimation($count, $duration, $phase) {
-    animation: sk-stretchdelay $duration infinite ease-in-out;
-
-    @for $i from 1 through $count {
-        &--#{$i} {
-            animation-delay: -$duration + (($i - 1) * $phase);
-        }
-    }
-}
-
-/*
- * Tooltip colors
- * @param $color - color property
- * Usage example:
-   @include tooltipColor($COLOR_RED);
- */
-@mixin tooltipColor($color) {
-    &:before {
-        background: $color;
-    }
-
-    &:after,
-    &[data-tooltip-pos='top']:after {
-        border-top-color: $color;
-    }
-
-    &[data-tooltip-pos='right']:after {
-        border-top-color: transparent;
-        border-right-color: $color;
-    }
-
-    &[data-tooltip-pos='left']:after {
-        border-top-color: transparent;
-        border-left-color: $color;
-    }
-
-    &[data-tooltip-pos='bottom']:after {
-        border-top-color: transparent;
-        border-bottom-color: $color;
-    }
-}
-
-/*
- * Convert Tooltip colors
- * @param $color - css color property
- * Usage example:
-   @include convertTooltipColor(var(--status-default));
- */
-@mixin convertTooltipColor($color) {
-    &:before {
-        background: $color;
-    }
-
-    &:after,
-    &[data-tooltip-pos='top']:after {
-        border-top-color: $color;
-    }
-
-    &[data-tooltip-pos='right']:after {
-        border-top-color: transparent;
-        border-right-color: $color;
-    }
-
-    &[data-tooltip-pos='left']:after {
-        border-top-color: transparent;
-        border-left-color: $color;
-    }
-
-    &[data-tooltip-pos='bottom']:after {
-        border-top-color: transparent;
-        border-bottom-color: $color;
-    }
-}
-
-@mixin flex-center($justify-content: center, $align-items: center) {
-    display: flex;
-    align-items: $align-items;
-    justify-content: $justify-content;
-    @content;
-}
-
-/*
- * Check if the page is in RTL mode
- * Usage example:
-   @include is-RTL { left: 0 };
- */
-@mixin is-RTL() {
-    html[dir='rtl'] & {
-        @content;
-    }
-}
-
-/* RTL Language Mixin */
-@mixin rtl {
-    [dir='rtl'] & {
-        @content;
-    }
-}
-
-@mixin mobile-or-tablet-screen {
-    @media (max-width: #{$min-desktop-width - 1}) {
-        @content;
-    }
-}
diff --git a/src/components/shared/styles/reset.scss b/src/components/shared/styles/reset.scss
deleted file mode 100644
index 86ccca18..00000000
--- a/src/components/shared/styles/reset.scss
+++ /dev/null
@@ -1,147 +0,0 @@
-/*------------------------------------*
- *  # Reset SCSS
- *  - to make browsers render all elements more consistently
- *  - Reference:  https://github.com/AdamMarsden/simple-typography/blob/master/_reset.scss
- *------------------------------------*/
-
-/* stylelint-disable */
-html,
-body,
-div,
-span,
-applet,
-object,
-iframe,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-big,
-cite,
-code,
-del,
-dfn,
-em,
-img,
-ins,
-kbd,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-b,
-u,
-i,
-center,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-fieldset,
-form,
-label,
-legend,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td,
-article,
-aside,
-canvas,
-details,
-embed,
-figure,
-figcaption,
-footer,
-header,
-hgroup,
-input,
-menu,
-nav,
-output,
-ruby,
-section,
-summary,
-time,
-mark,
-audio,
-video {
-    margin: 0;
-    padding: 0;
-    border: 0;
-    font: inherit;
-    vertical-align: baseline;
-}
-/* HTML5 display-role reset for older browsers */
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-menu,
-nav,
-section {
-    display: block;
-}
-
-html {
-    height: 100%;
-    font-size: 10px;
-}
-
-body {
-    line-height: 1;
-    height: 100%;
-}
-
-ol,
-ul {
-    list-style: none;
-}
-
-blockquote,
-q {
-    quotes: none;
-}
-
-blockquote:before,
-blockquote:after,
-q:before,
-q:after {
-    content: '';
-    content: none;
-}
-
-table {
-    border-collapse: collapse;
-    border-spacing: 0;
-}
-
-strong {
-    font-weight: bold;
-}
-/* stylelint-enable */
diff --git a/src/components/shared/styles/themes.scss b/src/components/shared/styles/themes.scss
deleted file mode 100644
index f92d1a58..00000000
--- a/src/components/shared/styles/themes.scss
+++ /dev/null
@@ -1,361 +0,0 @@
-@import './constants.scss';
-
-:host,
-:root {
-    // Text sizes
-    --text-size-xxxxs: 0.8rem;
-    --text-size-xxxs: 1rem;
-    --text-size-xxs: 1.2rem;
-    --text-size-xs: 1.4rem;
-    --text-size-s: 1.6rem;
-    --text-size-xsm: 1.8rem;
-    --text-size-sm: 2rem;
-    --text-size-m: 2.4rem;
-    --text-size-l: 3.2rem;
-    --text-size-xl: 4.8rem;
-    --text-size-xxl: 6.4rem;
-
-    //Line Height
-    --text-lh-xxs: 1;
-    --text-lh-xs: 1.25;
-    --text-lh-s: 1.4;
-    --text-lh-m: 1.5;
-    --text-lh-l: 1.75;
-    --text-lh-xl: 2;
-    --text-lh-xxl: 2.4;
-
-    //Font Weight
-    --text-weight-lighter: lighter;
-    --text-weight-normal: normal;
-    --text-weight-bold: bold;
-    --text-weight-bolder: bolder;
-
-    //Text Align
-    --text-align-left: start;
-    --text-align-right: right;
-    --text-align-center: center;
-
-    // Brand primary colors
-    --brand-white: #{$color-white};
-    --brand-dark-grey: #{$color-black};
-    --brand-red-coral: #{$color-red};
-    --brand-orange: #{$color-orange};
-    // Brand secondary colors
-    --brand-secondary: #{$color-green};
-
-    // Wallet gradient background
-    --wallet-airtm: #{$gradient-airtm};
-    --wallet-banxa: #{$gradient-banxa};
-    --wallet-bitcoin: #{$gradient-bitcoin};
-    --wallet-credit: #{$gradient-credit};
-    --wallet-dp2p: #{$gradient-dp2p};
-    --wallet-fasapay: #{$gradient-fasapay};
-    --wallet-jeton: #{$gradient-jeton};
-    --wallet-mastercard: #{$gradient-mastercard};
-    --wallet-neteller: #{$gradient-neteller};
-    --wallet-paylivre: #{$gradient-paylivre};
-    --wallet-paysafe: #{$gradient-paysafe};
-    --wallet-perfectmoney: #{gradient-perfectmoney};
-    --wallet-skrill: #{$gradient-skrill};
-    --wallet-sticpay: #{$gradient-sticpay};
-    --wallet-virtual: #{$gradient-virtual};
-    --wallet-visa: #{$gradient-visa};
-    --wallet-webmoney: #{$gradient-webmoney};
-
-    // App Cards gradient background
-    --app-card-virtual: #{$gradient-virtual};
-    --app-card-virtual-swap-free: #{$gradient-virtual-swap-free};
-
-    .theme--light {
-        // General
-        --general-main-1: #{$color-white};
-        --general-main-2: #{$color-white};
-        --general-main-3: #{$color-grey-1};
-        --general-main-4: #{$alpha-color-white-4};
-        --general-section-1: #{$color-grey-2};
-        --general-section-2: #{$color-grey-2};
-        --general-section-3: #{$color-grey-11};
-        --general-section-4: #{$color-grey-12};
-        --general-section-5: #{$color-grey-2};
-        --general-section-6: #{$color-grey-2};
-        --general-disabled: #{$color-grey-3};
-        --general-hover: #{$color-grey-4};
-        --general-active: #{$color-grey-5};
-        // Icons and Texts
-        --text-general: #{$color-black-1};
-        --text-primary: #{$color-grey-1};
-        --text-less-prominent: #{$color-grey-1};
-        --text-prominent: #{$color-black-1};
-        --text-disabled: #{$color-grey-1};
-        --text-disabled-1: #{$color-grey-6};
-        --text-loss-danger: #{$color-red-1};
-        --text-profit-success: #{$color-green-1};
-        --text-warning: #{$color-yellow};
-        --text-red: #{$color-red};
-        --text-green: #{$color-green-6};
-        --text-blue: #{$color-blue-3};
-        --text-info-blue: #{$color-blue};
-        --text-info-blue-background: #{$color-blue-5};
-        --text-colored-background: #{$color-white};
-        --icon-light-background: #{$color-black-9};
-        --icon-dark-background: #{$color-white};
-        --icon-grey-background: #{$color-grey-2};
-        --icon-black-plus: #{$color-black-7};
-        --text-status-info-blue: #{$color-blue};
-        --text-hint: #{$color-black-1};
-        // Purchase
-        --purchase-main-1: #{$color-green-1};
-        --purchase-section-1: #{$color-green-2};
-        --purchase-main-2: #{$color-red-1};
-        --purchase-section-2: #{$color-red-4};
-        --purchase-disabled-main: #{$color-grey-3};
-        --purchase-disabled-section: #{$color-grey-4};
-        // Buttons
-        --button-primary-default: var(--brand-red-coral);
-        --button-secondary-default: #{$color-grey-1};
-        --button-tertiary-default: transparent;
-        --button-primary-light-default: #{$alpha-color-red-2};
-        --button-primary-hover: #{$color-red-5};
-        --button-secondary-hover: #{$alpha-color-black-3};
-        --button-tertiary-hover: #{$alpha-color-red-1};
-        --button-primary-light-hover: #{$alpha-color-red-3};
-        --button-toggle-primary: #{$color-blue-3};
-        --button-toggle-secondary: #{$color-grey-5};
-        --button-toggle-alternate: #{$color-white};
-        // Overlay
-        --overlay-outside-dialog: #{$alpha-color-black-1};
-        --overlay-inside-dialog: #{$alpha-color-white-1};
-        // Shadow
-        --shadow-menu: #{$alpha-color-black-4};
-        --shadow-menu-2: #{$alpha-color-black-4};
-        --shadow-drop: #{$alpha-color-black-3};
-        --shadow-box: #{$COLOR_LIGHT_BLACK_2};
-        // States
-        --state-normal: #{$color-white};
-        --state-hover: #{$color-grey-4};
-        --state-active: #{$color-grey-5};
-        --state-disabled: #{$color-grey-3};
-        --checkbox-disabled-grey: #{$color-grey-6};
-        --sidebar-tab: #{$color-grey-6};
-        // Border
-        --border-normal: #{$color-grey-5};
-        --border-normal-1: #{$color-grey-5};
-        --border-normal-2: #{$color-grey-5};
-        --border-normal-3: #{$color-grey-6};
-        --border-hover: #{$color-grey-1};
-        --border-hover-1: #{$color-black-9};
-        --border-active: var(--brand-secondary);
-        --border-disabled: #{$color-grey-3};
-        --border-divider: #{$color-grey-2};
-        // Fill
-        --fill-normal: #{$color-white};
-        --fill-normal-1: #{$color-grey};
-        --fill-hover: #{$color-grey-1};
-        --fill-active: var(--brand-secondary);
-        --fill-disabled: #{$color-grey-3};
-        // Status
-        --status-default: #{$color-grey-3};
-        --status-adjustment: #{$color-grey-1};
-        --status-danger: #{$color-red-1};
-        --status-success: #{$color-green-1};
-        --status-warning: #{$color-yellow};
-        --status-warning-transparent: #{$alpha-color-yellow-1};
-        --status-transfer: #{$color-orange};
-        --status-info: #{$color-blue};
-        --status-colored-background: #{$color-white};
-        --status-alert-background: #{$color-yellow-3};
-        // Dashboard
-        --dashboard-swap-free: #{$gradient-color-black-3};
-        --dashboard-app: #{$gradient-color-black-4};
-        // Payment methods
-        --payment-skrill: #{$gradient-color-purple};
-        --payment-visa: #{$gradient-color-blue};
-        --payment-mastercard: #{$gradient-color-orange};
-        --payment-credit-and-debit: #{$gradient-color-black-2};
-        --payment-bitcoin: #{$gradient-color-orange-2};
-        --payment-usd-coin: #{$gradient-color-blue-2};
-        --payment-neteller: #{$gradient-color-green-3};
-        --payment-webmoney: #{$gradient-color-blue-3};
-        --payment-jeton: #{$gradient-color-orange-3};
-        --payment-sticpay: #{$gradient-color-orange-4};
-        --payment-airtm: #{$gradient-color-blue-4};
-        --payment-dp2p: #{$gradient-color-red-3};
-        --payment-deriv: #{$gradient-color-red-4};
-        // Transparentize
-        --transparent-success: #{$alpha-color-green-1};
-        --transparent-info: #{$alpha-color-blue-1};
-        --transparent-hint: #{$alpha-color-blue-3};
-        --transparent-danger: #{$alpha-color-red-2};
-        --transparent-correct-message: #{$color-green-5};
-        --transparent-fake-message: #{$color-red-6};
-        /* TODO: change to styleguide later */
-        // Gradient
-        --gradient-success: #{$gradient-color-green-1};
-        --gradient-danger: #{$gradient-color-red-1};
-        --contract-gradient-danger: #{$contract-gradient-color-red-1};
-        --gradient-right-edge: #{$gradient-color-white};
-        --gradient-blue: #{$gradient-color-blue-5};
-        --gradient-gold: #{$gradient-color-gold};
-        --gradient-green: #{$gradient-color-green-4};
-        // Badge
-        --badge-white: #{$color-white};
-        --badge-blue: #{$color-blue-4};
-        --badge-violet: #{$color-blue-2};
-        --badge-green: #{$color-green-3};
-        //TradersHub Banner
-        --traders-hub-banner-border-color: #{$color-grey-4};
-        // wallets
-        --wallets-banner-ready-bg-color: #{$ready-banner-bg-color};
-        --wallets-banner-ready-tick-bg-color: #{$ready-banner-tick-bg-color};
-        --wallets-banner-border-color: #{$color-grey-4};
-        --wallets-banner-dot-color: #{$color-grey-6};
-        --wallets-banner-active-dot-color: #{$color-red};
-        --wallets-card-active-gradient-background: #{$gradient-color-black-5};
-        --wallet-demo-bg-color: #{$wallet-demo-bg-color};
-        --wallet-demo-divider-color: #{$wallet-demo-divider-color};
-        --wallet-eu-disclaimer: #{$color-grey-4};
-        --wallet-box-shadow: #{$wallet-box-shadow};
-        // Demo view
-        --demo-text-color-1: #{$color-grey};
-        --demo-text-color-2: #{$color-white};
-        // Header
-        --header-background-mt5: #{$color-blue-8};
-        --header-background-others: #{$color-green-7};
-    }
-    .theme--dark {
-        // General
-        --general-main-1: #{$color-black};
-        --general-main-2: #{$color-black-3};
-        --general-main-3: #{$color-black-4};
-        --general-main-4: #{$alpha-color-black-7};
-        --general-section-1: #{$color-black-3};
-        --general-section-2: #{$color-black};
-        --general-section-3: #{$color-black-5};
-        // @TODO: get color from design
-        --general-section-4: #{$color-black-5};
-        --general-section-5: #{$color-black-5};
-        --general-section-6: #{$color-grey-7};
-        --general-disabled: #{$color-black-4};
-        --general-hover: #{$color-black-5};
-        --general-active: #{$color-black-8};
-        // Icons and Texts
-        --text-prominent: #{$color-white};
-        --text-general: #{$color-grey};
-        --text-less-prominent: #{$color-grey-7};
-        --text-primary: #{$color-grey-1};
-        --text-disabled: #{$color-black-6};
-        --text-disabled-1: #{$color-black-6};
-        --text-profit-success: #{$color-green-3};
-        --text-loss-danger: #{$color-red-2};
-        --text-red: #{$color-red};
-        --text-colored-background: #{$color-white};
-        --text-info-blue: #{$color-blue-6};
-        --text-info-blue-background: #{$color-blue-7};
-        --text-status-info-blue: #{$color-blue};
-        --text-hint: #{$color-grey};
-        --icon-light-background: #{$color-black-9};
-        --icon-dark-background: #{$color-white};
-        --icon-grey-background: #{$color-black-1};
-        --icon-black-plus: #{$color-white};
-        // Purchase
-        --purchase-main-1: #{$color-green-3};
-        --purchase-section-1: #{$color-green-4};
-        --purchase-main-2: #{$color-red-2};
-        --purchase-section-2: #{$color-red-3};
-        --purchase-disabled-main: #{$color-black-4};
-        --purchase-disabled-section: #{$color-black};
-        --button-primary-default: var(--brand-red-coral);
-        --button-secondary-default: #{$color-grey-7};
-        --button-tertiary-default: transparent;
-        --button-primary-light-default: #{$alpha-color-red-2};
-        --button-primary-hover: #{$color-red-5};
-        --button-secondary-hover: #{$alpha-color-white-3};
-        --button-tertiary-hover: #{$alpha-color-red-1};
-        --button-primary-light-hover: #{$alpha-color-red-3};
-        --button-toggle-primary: #{$color-blue-3};
-        --button-toggle-secondary: #{$color-black-8};
-        --button-toggle-alternate: #{$color-black-8};
-        // Overlay
-        --overlay-outside-dialog: #{$alpha-color-black-1};
-        --overlay-inside-dialog: #{$alpha-color-black-2};
-        // Shadow
-        --shadow-menu: #{$alpha-color-black-5};
-        --shadow-menu-2: #{$alpha-color-black-1};
-        --shadow-drop: #{$alpha-color-black-6};
-        --shadow-box: #{$COLOR_DARK_GRAY_3};
-        // States
-        --state-normal: #{$color-black};
-        --state-hover: #{$color-black-5};
-        --state-active: #{$color-black-8};
-        --state-disabled: #{$color-black-4};
-        --checkbox-disabled-grey: #{$color-grey-6};
-        --sidebar-tab: #{$color-grey-7};
-        // Border
-        --border-normal: #{$color-black-8};
-        --border-normal-1: #{$color-grey-5};
-        --border-normal-2: #{$color-grey-1};
-        --border-normal-3: #{$color-grey-7};
-        --border-hover: #{$color-grey-7};
-        --border-hover-1: #{$color-black-9};
-        --border-active: var(--brand-secondary);
-        --border-disabled: #{$color-black-4};
-        --border-divider: #{$color-grey-13};
-        // Fill
-        --fill-normal: #{$color-black};
-        --fill-normal-1: #{$color-black-1};
-        --fill-hover: #{$color-grey-7};
-        --fill-active: var(--brand-secondary);
-        --fill-disabled: #{$color-black-4};
-        // Status
-        --status-default: #{$color-grey-3};
-        --status-adjustment: #{$color-grey-1};
-        --status-danger: #{$color-red-2};
-        --status-warning: #{$color-yellow};
-        --status-warning-transparent: #{$alpha-color-yellow-1};
-        --status-success: #{$color-green-3};
-        --status-transfer: #{$color-orange};
-        --status-info: #{$color-blue};
-        --status-colored-background: #{$color-white};
-        --status-alert-background: #{$color-yellow-3};
-        // Transparentize
-        --transparent-success: #{$alpha-color-green-2};
-        --transparent-info: #{$alpha-color-blue-1};
-        --transparent-hint: #{$alpha-color-blue-1};
-        --transparent-danger: #{$alpha-color-red-2};
-        --transparent-correct-message: #{$color-green-5};
-        --transparent-fake-message: #{$color-red-6};
-        /* TODO: change to styleguide later */
-        // Gradient
-        --gradient-success: #{$gradient-color-green-2};
-        --gradient-danger: #{$gradient-color-red-2};
-        --contract-gradient-danger: #{$contract-gradient-color-red-2};
-        --gradient-right-edge: #{$gradient-color-black};
-        --gradient-blue: #{$gradient-color-blue-5};
-        --gradient-gold: #{$gradient-color-gold};
-        --gradient-green: #{$gradient-color-green-4};
-        // Badge
-        --badge-white: #{$color-white};
-        --badge-blue: #{$color-blue-4};
-        --badge-violet: #{$color-blue-2};
-        --badge-green: #{$color-green-3};
-        //TradersHub Banner
-        --traders-hub-banner-border-color: #{$color-black-5};
-        // wallets
-        --wallets-banner-ready-bg-color: #{$ready-banner-bg-color};
-        --wallets-banner-ready-tick-bg-color: #{$ready-banner-tick-bg-color};
-        --wallets-banner-border-color: #{$color-grey-4};
-        --wallets-banner-dot-color: #{$color-grey-6};
-        --wallets-banner-active-dot-color: #{$color-red};
-        --wallets-card-active-gradient-background: #{$gradient-color-white-2};
-        --wallet-demo-bg-color: #{$wallet-dark-demo-bg-color};
-        --wallet-demo-divider-color: #{$color-black-8};
-        --wallet-eu-disclaimer: #{$color-grey-4};
-        --wallet-box-shadow: #{$wallet-box-shadow};
-        // Demo view
-        --demo-text-color-1: #{$color-black-1};
-        --demo-text-color-2: #{$color-black-1};
-        // Header
-        --header-background-mt5: #{$color-blue-8};
-        --header-background-others: #{$color-green-7};
-    }
-}
diff --git a/src/components/shared_ui/button/button.scss b/src/components/shared_ui/button/button.scss
index 166223ac..09451739 100644
--- a/src/components/shared_ui/button/button.scss
+++ b/src/components/shared_ui/button/button.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 :root {
     --button-primary-default: #ff444f;
     --text-colored-background: #fff;
@@ -24,6 +26,7 @@
     user-select: none;
     -webkit-touch-callout: none;
     -webkit-tap-highlight-color: transparent;
+
     /*
      * Text will be transformed to sentence case in JS
      * text-transform is declared in .dc-btn instead of .dc-btn__text
@@ -35,13 +38,16 @@
         height: auto;
         padding: 0.8rem 2.5rem;
     }
+
     &__text,
     &__icon {
         display: flex;
         pointer-events: none;
     }
+
     &__icon {
         @include typeface(--paragraph-center-bold-black, unset);
+
         color: var(--text-general);
         padding-right: 0.8rem;
         pointer-events: none;
@@ -50,12 +56,15 @@
             padding-right: 0;
         }
     }
+
     &:not([disabled]):hover {
         text-decoration: none;
     }
+
     &__rounded {
         border-radius: 24px;
     }
+
     &--plus {
         width: 2.4rem;
         height: 2.4rem !important;
@@ -65,17 +74,21 @@
         background-repeat: no-repeat;
         background-position: center;
     }
+
     &--circle {
         height: 3.2rem;
         width: 3.2rem !important;
         border-radius: 50%;
     }
+
     &--circular {
         border-radius: 100px;
     }
+
     &--transparent {
         background: transparent;
     }
+
     &--primary {
         background: var(--button-primary-default);
         color: var(--text-colored-background);
@@ -83,14 +96,17 @@
         &:hover:not([disabled]) {
             background: var(--button-primary-hover);
         }
+
         &:active:not([disabled]) {
             background: var(--button-primary-default);
         }
+
         &:disabled,
         &[disabled] {
             opacity: 0.32;
             cursor: not-allowed !important;
         }
+
         .dc-btn__text,
         .dc-btn__icon {
             color: var(--text-colored-background);
@@ -102,20 +118,24 @@
             &:hover:not([disabled]) {
                 background: var(--button-primary-light-hover);
             }
+
             &:active:not([disabled]) {
                 background: var(--button-primary-light-default);
             }
+
             &:disabled,
             &[disabled] {
                 opacity: 0.32;
                 cursor: not-allowed !important;
             }
+
             .dc-btn__text,
             .dc-btn__icon {
                 color: var(--brand-red-coral);
             }
         }
     }
+
     &--secondary {
         background: transparent;
         border: 1px solid var(--button-secondary-default);
@@ -123,38 +143,46 @@
         &:hover:not([disabled]) {
             background: var(--button-secondary-hover);
         }
+
         &:active:not([disabled]) {
             border: 1px solid var(--button-secondary-default);
         }
+
         &:disabled,
         &[disabled] {
             opacity: 0.32;
             cursor: not-allowed !important;
         }
+
         .dc-btn__text,
         .dc-btn__icon {
             color: var(--text-prominent);
         }
     }
+
     &--tertiary {
         background: var(--button-tertiary-default);
 
         &:hover:not([disabled]) {
             background: var(--button-tertiary-hover);
         }
+
         &:active:not([disabled]) {
             background: var(--button-tertiary-default);
         }
+
         .dc-btn__text,
         .dc-btn__icon {
             color: var(--brand-red-coral);
         }
+
         &:disabled,
         &[disabled] {
             opacity: 0.32;
             cursor: not-allowed !important;
         }
     }
+
     &--alternate {
         background: var(--button-tertiary-default);
         border: 2px solid var(--button-primary-default);
@@ -172,6 +200,7 @@
             color: var(--brand-red-coral);
         }
     }
+
     /* TODO: confirm this button with designer are we still using this? */
     &--green {
         background: var(--status-success);
@@ -179,19 +208,24 @@
         &:hover:not([disabled]) {
             background: var(--transparent-success);
         }
+
         &:active:not([disabled]) {
             background: var(--status-success);
         }
+
         .dc-btn__text,
         .dc-btn__icon {
             color: var(--text-colored-background);
         }
     }
+
     &--black {
         background: var(--button-get-started-bg);
+
         &:hover:not([disabled]) {
             opacity: 0.7;
         }
+
         &:active:not([disabled]) {
             opacity: 0.7;
         }
@@ -201,6 +235,7 @@
             color: var(--general-main-1);
         }
     }
+
     &__small {
         height: 2.4rem;
         min-width: 4.8rem;
@@ -210,6 +245,7 @@
             font-size: 1.2rem;
         }
     }
+
     &__medium {
         height: 3.2rem;
         min-width: 5.6rem;
@@ -219,6 +255,7 @@
             font-size: 1.4rem;
         }
     }
+
     &__large {
         height: 4rem;
         min-width: 6.4rem;
@@ -228,10 +265,12 @@
             font-size: 1.4rem;
         }
     }
+
     &__wide {
         width: 100%;
         height: 4rem;
     }
+
     &__effect:focus:not(:active):after {
         content: '';
         position: absolute;
@@ -246,6 +285,7 @@
         animation-fill-mode: forwards;
         display: block;
     }
+
     &__group {
         white-space: nowrap;
 
@@ -253,10 +293,13 @@
             margin-left: 8px;
         }
     }
+
     &__button-group {
         border-radius: 0 4px 4px 0;
     }
+
     /* TODO: confirm this button with designer are we still using this? */
+
     /* postcss-bem-linter: ignore */
     .initial-loader--btn {
         background-color: unset;
@@ -265,6 +308,7 @@
         .initial-loader__barspinner--rect {
             background-color: var(--text-colored-background);
         }
+
         /* postcss-bem-linter: ignore */
         .barspinner {
             margin: 0.6rem 4px 0 -4px;
diff --git a/src/components/shared_ui/contract-card/contract-card-items/sass/contract-card-dialog.scss b/src/components/shared_ui/contract-card/contract-card-items/sass/contract-card-dialog.scss
index 2363ff0b..b7d5ad62 100644
--- a/src/components/shared_ui/contract-card/contract-card-items/sass/contract-card-dialog.scss
+++ b/src/components/shared_ui/contract-card/contract-card-items/sass/contract-card-dialog.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 /** @define dc-contract-card-dialog; weak */
 .dc-contract-card-dialog {
     position: fixed;
diff --git a/src/components/shared_ui/contract-card/contract-card.scss b/src/components/shared_ui/contract-card/contract-card.scss
index a59f0790..3e6121a9 100644
--- a/src/components/shared_ui/contract-card/contract-card.scss
+++ b/src/components/shared_ui/contract-card/contract-card.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .dc-contract-card {
     box-sizing: border-box;
     border-radius: $BORDER_RADIUS;
diff --git a/src/components/shared_ui/contract-card/result-overlay/result-overlay.scss b/src/components/shared_ui/contract-card/result-overlay/result-overlay.scss
index db1bb372..2f14fb99 100644
--- a/src/components/shared_ui/contract-card/result-overlay/result-overlay.scss
+++ b/src/components/shared_ui/contract-card/result-overlay/result-overlay.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/devices' as *;
+
 /** @define dc-result */
 .dc-result {
     &__content {
@@ -7,6 +9,7 @@
         flex-direction: column;
         gap: 0.4rem;
     }
+
     &__caption {
         text-transform: capitalize;
         font-size: 1.4em;
@@ -20,9 +23,11 @@
         &--won {
             color: var(--text-profit-success);
         }
+
         &--lost {
             color: var(--text-loss-danger);
         }
+
         &-wrapper {
             cursor: pointer;
             width: 100%;
@@ -35,14 +40,17 @@
             justify-content: center;
             align-items: center;
         }
+
         @include mobile {
             pointer-events: none;
         }
     }
+
     &__close-btn {
         position: absolute;
         top: 2px;
-        /*rtl:ignore*/
+
+        /* rtl:ignore */
         right: 8px;
         cursor: pointer;
         visibility: visible;
@@ -54,6 +62,7 @@
             color: var(--text-general);
         }
     }
+
     &__positions-overlay {
         max-width: 218px;
     }
diff --git a/src/components/shared_ui/currency-badge/currency-badge.scss b/src/components/shared_ui/currency-badge/currency-badge.scss
index ad40ade5..779728a7 100644
--- a/src/components/shared_ui/currency-badge/currency-badge.scss
+++ b/src/components/shared_ui/currency-badge/currency-badge.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/constants' as *;
+
 /** @define .dc-currency-badge */
 .dc-currency-badge {
     align-self: flex-start;
diff --git a/src/components/shared_ui/data-list/data-list.scss b/src/components/shared_ui/data-list/data-list.scss
index 7de0e18b..c12a426f 100644
--- a/src/components/shared_ui/data-list/data-list.scss
+++ b/src/components/shared_ui/data-list/data-list.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/devices' as *;
+
 /** @define data-list; weak */
 .data-list {
     position: relative;
@@ -14,6 +16,7 @@
             height: 100%;
         }
     }
+
     &__footer {
         width: 100%;
         background: var(--general-main-1);
@@ -22,6 +25,7 @@
         align-items: center;
         position: relative;
     }
+
     &__item {
         height: inherit;
 
@@ -31,10 +35,12 @@
             -webkit-touch-callout: none;
             -webkit-tap-highlight-color: transparent;
         }
+
         @include mobile {
             border-radius: $BORDER_RADIUS;
         }
     }
+
     &__row {
         display: flex;
         flex-direction: row;
@@ -44,11 +50,13 @@
         > * {
             flex: 1;
         }
+
         &-content {
             font-size: 1.4rem;
             line-height: 2rem;
             color: var(--text-general);
         }
+
         &-cell {
             &--amount {
                 display: flex;
@@ -57,6 +65,7 @@
                 flex: none;
             }
         }
+
         &-title {
             font-size: 1.4rem;
             font-weight: bold;
@@ -67,6 +76,7 @@
                 font-size: 1.2rem;
             }
         }
+
         &-divider {
             margin: 0 1.6rem;
 
@@ -76,13 +86,16 @@
                 border-top: 1px solid var(--general-main-1);
             }
         }
+
         &--wrapper:not(.data-list__item--dynamic-height-wrapper) {
             height: 100%;
         }
+
         &--timer {
             flex: none;
         }
     }
+
     &__desc {
         &--wrapper {
             height: inherit;
diff --git a/src/components/shared_ui/dialog/dialog.scss b/src/components/shared_ui/dialog/dialog.scss
index 07c4a6a9..41b9dab5 100644
--- a/src/components/shared_ui/dialog/dialog.scss
+++ b/src/components/shared_ui/dialog/dialog.scss
@@ -1,5 +1,7 @@
-/** @define dc-dialog */
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/devices' as *;
 
+/** @define dc-dialog */
 .dc-dialog {
     width: 100vw;
     height: 100vh;
@@ -37,6 +39,7 @@
                 opacity: 0;
             }
         }
+
         &--enter-done {
             opacity: 1;
 
@@ -45,10 +48,12 @@
                 opacity: 1;
             }
         }
+
         &--has-portal {
             background-color: transparent;
         }
     }
+
     &__dialog {
         max-width: 560px;
         max-height: 338px;
@@ -68,6 +73,7 @@
             transform 0.25s cubic-bezier(0.25, 0.1, 0.1, 0.25),
             opacity 0.25s cubic-bezier(0.25, 0.1, 0.1, 0.25);
     }
+
     &__header {
         &-wrapper {
             width: 100%;
@@ -75,17 +81,21 @@
             justify-content: space-between;
             align-items: center;
             margin-bottom: 1rem;
+
             &--end {
                 justify-content: flex-end;
             }
         }
+
         &--title {
             align-self: flex-start;
         }
+
         &--close {
             cursor: pointer;
         }
     }
+
     &__content {
         align-self: flex-start;
         margin-bottom: 2.4rem;
@@ -96,25 +106,30 @@
         .dc-input__label {
             background-color: var(--general-main-2);
         }
+
         &--centered {
             align-self: center;
         }
     }
+
     &__footer {
         display: flex;
         justify-content: flex-end;
         align-items: center;
         width: 100%;
+
         @include mobile {
             flex-wrap: wrap;
             align-items: flex-start;
         }
     }
+
     &__button {
         margin-left: 0.8rem;
         height: 4rem;
         min-width: 6.4rem;
         border-width: 2px;
+
         @include mobile {
             &:not(:last-child) {
                 margin-bottom: 1rem;
@@ -123,7 +138,7 @@
     }
 }
 
-@media screen and (max-width: 560px) {
+@media screen and (width <= 560px) {
     .dc-dialog {
         &__dialog {
             min-width: auto;
diff --git a/src/components/shared_ui/drawer/drawer.scss b/src/components/shared_ui/drawer/drawer.scss
index 1d9cbaac..86f1688f 100644
--- a/src/components/shared_ui/drawer/drawer.scss
+++ b/src/components/shared_ui/drawer/drawer.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/devices' as *;
+
 /** @define dc-drawer */
 // TODO: [fix-dc-bundle] Fix import issue with Deriv Component stylesheets (app should take precedence, and not repeat)
 .dc-drawer {
@@ -13,6 +15,7 @@
         flex-direction: row-reverse;
         right: calc(100vw - 16px);
     }
+
     &--right {
         display: flex;
         flex-direction: row;
@@ -24,6 +27,7 @@
         height: calc(100% - 10.1rem) !important;
         top: calc(100% - 9.8rem) !important;
     }
+
     &__container {
         display: flex;
         flex-direction: column;
@@ -33,6 +37,7 @@
         &--left {
             padding-right: $toggler-width;
         }
+
         &--right {
             padding-left: $toggler-width;
         }
@@ -41,16 +46,19 @@
             height: calc(100% - 3.6rem);
         }
     }
+
     &__header {
         border-bottom: 1px solid var(--general-section-1);
         line-height: 40px;
         font-weight: 700;
         font-size: 1.6em;
     }
+
     &__content {
         flex-grow: 1;
         overflow: auto;
     }
+
     &__footer {
         background-color: var(--general-main-2);
         border-top: 1px solid var(--general-section-1);
@@ -59,6 +67,7 @@
         font-size: 1.6em;
         align-items: center;
     }
+
     &__toggle {
         align-items: center;
         border-left: 1px solid var(--border-disabled);
@@ -78,11 +87,14 @@
             background-color: var(--general-main-1);
             border-top: solid 1px var(--general-section-1);
         }
+
         &-icon {
             transition: 0.25s ease;
+
             &--left {
                 transform: rotate(0);
             }
+
             &--right {
                 transform: rotate(180deg);
             }
@@ -93,10 +105,12 @@
                 transform: rotate(0);
             }
         }
+
         &--open > &-icon {
             &--left {
                 transform: rotate(180deg);
             }
+
             &--right {
                 transform: rotate(0);
             }
@@ -106,6 +120,7 @@
             }
         }
     }
+
     &--open {
         @include mobile {
             transform: translateY(calc(-100% + 3.6rem));
diff --git a/src/components/shared_ui/field/field.scss b/src/components/shared_ui/field/field.scss
index 055627c5..c187181a 100644
--- a/src/components/shared_ui/field/field.scss
+++ b/src/components/shared_ui/field/field.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .dc-field {
     position: absolute;
     top: 4.1rem;
@@ -7,13 +10,18 @@
 
     &--error {
         padding-left: 1.1rem;
+
         @include typeface(--small-left-normal-red);
+
         line-height: 1;
     }
+
     &--warn {
         padding-left: 1.2rem;
         padding-top: 0.4rem;
+
         @include typeface(--small-left-normal-black);
+
         color: $color-grey-1;
     }
 }
diff --git a/src/components/shared_ui/input-field/input-field.scss b/src/components/shared_ui/input-field/input-field.scss
index 2ba5a21a..65345acc 100644
--- a/src/components/shared_ui/input-field/input-field.scss
+++ b/src/components/shared_ui/input-field/input-field.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 /** @define dc-input-field; weak */
 .dc-input-field {
     margin: 0.8rem 0 0;
@@ -5,12 +8,14 @@
 
     &__label {
         @include typeface(--paragraph-left-normal-black);
+
         color: var(--text-general);
         margin-bottom: 0.2rem;
         display: inline-block;
         text-align: center;
         width: 100%;
     }
+
     & .inline-icon {
         position: absolute;
         top: 8px;
@@ -18,6 +23,7 @@
         z-index: 1;
         cursor: pointer;
     }
+
     &__helper {
         @include typeface(--small-left-light-grey);
     }
@@ -34,6 +40,7 @@ button.dc-input-wrapper {
             display: none;
         }
     }
+
     &__button {
         position: absolute !important;
         z-index: 1;
@@ -53,10 +60,12 @@ button.dc-input-wrapper {
             /* rtl:ignore */
             right: 2px;
         }
+
         &--decrement {
             /* rtl:ignore */
             left: 2px;
         }
+
         &:hover {
             background: var(--state-hover);
             cursor: pointer;
@@ -65,19 +74,23 @@ button.dc-input-wrapper {
                 @extend .input-hover;
             }
         }
+
         &:disabled:hover {
             cursor: not-allowed;
             background: transparent;
         }
     }
+
     &__icon {
         // TODO: fix check if necessary
         // @extend %inline-icon;
     }
+
     &--disabled {
         pointer-events: none;
         color: var(--text-disabled);
     }
+
     &--inline {
         display: flex;
         justify-content: space-between;
@@ -88,6 +101,7 @@ button.dc-input-wrapper {
 /** @define input */
 .input {
     @include typeface(--paragraph-center-normal-black);
+
     list-style: none;
     position: relative;
     display: inline-block;
@@ -117,14 +131,17 @@ button.dc-input-wrapper {
             box-shadow: none;
             border-color: var(--brand-red-coral);
         }
+
         &:hover {
             border-color: var(--border-hover);
         }
+
         &:focus {
             border-radius: 0;
             box-shadow: none;
             border-color: var(--border-active);
         }
+
         &:checked {
             background: var(--brand-red-coral);
             border-color: var(--brand-red-coral);
@@ -132,18 +149,22 @@ button.dc-input-wrapper {
             &:after {
                 display: inline-block;
             }
+
             &:hover {
                 border-color: var(--brand-red-coral);
             }
         }
+
         &::-ms-check {
             // IE/EDGE support
             background: transparent;
             border-color: transparent;
             color: $COLOR_WHITE;
         }
+
         &:after {
             @include typeface(--small-left-normal-active);
+
             content: 'L';
             transform: scaleX(-1) rotate(-40deg);
             position: absolute;
@@ -152,19 +173,24 @@ button.dc-input-wrapper {
             display: none;
         }
     }
+
     &:not([type='range']) {
         touch-action: manipulation;
     }
+
     &[readonly] {
         cursor: pointer;
     }
+
     &::placeholder {
         border-color: var(--border-normal);
     }
+
     &:hover,
     &-hover {
         border-color: var(--border-hover);
     }
+
     &:active,
     &:focus {
         outline: 0;
@@ -172,14 +198,17 @@ button.dc-input-wrapper {
         border-color: var(--border-active);
         color: var(--text-prominent);
     }
+
     &--has-inline-prefix {
         padding-right: 40px !important;
         border-radius: $BORDER_RADIUS !important;
     }
+
     &--error {
         color: $COLOR_RED;
         border: 1px solid $COLOR_RED !important;
     }
+
     &:disabled {
         color: var(--text-disabled);
     }
diff --git a/src/components/shared_ui/loading/loading.scss b/src/components/shared_ui/loading/loading.scss
index 58778e54..86e302a8 100644
--- a/src/components/shared_ui/loading/loading.scss
+++ b/src/components/shared_ui/loading/loading.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 /** @define barspinner */
 .barspinner {
     margin: auto;
@@ -11,8 +14,10 @@
         height: 60%;
         width: 0.6rem;
         display: inline-block;
+
         @include createBarspinnerAnimation(5, 1.2s, 0.1);
     }
+
     &--dark .barspinner__rect {
         background-color: var(--brand-secondary);
     }
@@ -24,6 +29,7 @@
     100% {
         transform: scaleY(1);
     }
+
     20% {
         transform: scaleY(2);
     }
@@ -46,10 +52,12 @@
         @include desktop {
             height: calc(100vh - #{$HEADER_HEIGHT} - #{$FOOTER_HEIGHT});
         }
+
         @include mobile {
             height: calc(100vh - #{$MOBILE_HEADER_HEIGHT});
         }
     }
+
     &__barspinner {
         margin: 5rem auto;
 
diff --git a/src/components/shared_ui/mobile-dialog/mobile-dialog.scss b/src/components/shared_ui/mobile-dialog/mobile-dialog.scss
index 791a97dc..7f052fc4 100644
--- a/src/components/shared_ui/mobile-dialog/mobile-dialog.scss
+++ b/src/components/shared_ui/mobile-dialog/mobile-dialog.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/constants' as *;
+
 /** @define dc-mobile-dialog; weak */
 .dc-mobile-dialog {
     box-sizing: border-box;
@@ -12,6 +14,7 @@
     opacity: 0;
     pointer-events: none;
     background: var(--fill-normal);
+
     // transform here would break fixed header
 
     &--enter,
@@ -22,10 +25,12 @@
         & .dc-mobile-dialog__content {
             transform: scale(0);
         }
+
         & .dc-mobile-dialog__header {
             transform: translateY(-100%);
         }
     }
+
     &--enter-done {
         opacity: 1;
         pointer-events: auto;
@@ -33,10 +38,12 @@
         & .dc-mobile-dialog__content {
             transform: scale(1);
         }
+
         & .dc-mobile-dialog__header {
             transform: translateY(0);
         }
     }
+
     &__content {
         margin-top: 0.4rem;
         box-sizing: border-box;
@@ -49,10 +56,12 @@
         &--is-full-height {
             height: calc(100% - 0.4rem);
         }
+
         > div {
             height: 100%;
         }
     }
+
     &__header {
         box-sizing: border-box;
         display: flex;
@@ -70,11 +79,13 @@
         transition-delay: 0.2s;
         border-bottom: 1px solid var(--border-disabled);
     }
+
     &__container {
         &--has-scroll {
             overflow-x: hidden;
             overflow-y: auto;
         }
+
         &--has-info-banner {
             .dc-mobile-dialog {
                 &__header {
@@ -89,6 +100,7 @@
                         z-index: 4;
                         background: var(--fill-normal);
                         width: 100%;
+
                         // transparent border ensures children's margins contribute to height:
                         border-bottom: 0.01rem solid transparent;
 
@@ -111,6 +123,7 @@
                         }
                     }
                 }
+
                 &__content {
                     margin-top: unset;
                     padding-top: unset;
@@ -118,20 +131,24 @@
             }
         }
     }
+
     &__footer {
         position: fixed;
         width: 100%;
-        bottom: 0px;
+        bottom: 0;
         z-index: 4;
     }
+
     &__title {
         padding: 1.2rem 1.2rem 1.2rem 0.4rem;
         margin: 0;
     }
+
     &__close-btn-icon {
         margin: 1.2rem 0.4rem;
         width: 1.6rem;
         height: 1.6rem;
+
         /* postcss-bem-linter: ignore */
         --fill-color1: var(--text-prominent) !important;
     }
diff --git a/src/components/shared_ui/modal/modal.scss b/src/components/shared_ui/modal/modal.scss
index 3e8c89f5..b23ca51c 100644
--- a/src/components/shared_ui/modal/modal.scss
+++ b/src/components/shared_ui/modal/modal.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 @mixin mobile-screen {
     @media (max-width: #{$max-mobile-width}) {
         @content;
diff --git a/src/components/shared_ui/page-overlay/page-overlay.scss b/src/components/shared_ui/page-overlay/page-overlay.scss
index 4916f45f..ff03c2fd 100644
--- a/src/components/shared_ui/page-overlay/page-overlay.scss
+++ b/src/components/shared_ui/page-overlay/page-overlay.scss
@@ -1,5 +1,5 @@
-@import './../../shared/styles/constants.scss';
-@import './../../shared/styles/devices.scss';
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/devices' as *;
 
 .dc-page-overlay {
     &-portal {
@@ -17,18 +17,21 @@
             top: $MOBILE_HEADER_HEIGHT;
         }
     }
+
     &--enter,
     &--exit {
         transform: translateY(50px);
         opacity: 0;
         pointer-events: none;
     }
+
     &--enter-done {
         transform: translateY(0);
         opacity: 1;
         pointer-events: auto;
         z-index: 9;
     }
+
     &__header {
         position: sticky;
         top: 0;
@@ -49,6 +52,7 @@
                 font-size: 1.6rem;
             }
         }
+
         &-close {
             cursor: pointer;
             height: 16px;
@@ -58,10 +62,12 @@
             & .dc-icon {
                 --fill-color1: var(--text-prominent);
             }
+
             @include mobile {
                 right: 1.2rem;
             }
         }
+
         &-wrapper {
             width: 100%;
             display: flex;
@@ -72,6 +78,7 @@
                 padding: 0;
             }
         }
+
         @include mobile {
             height: 4rem;
             z-index: 3;
@@ -79,6 +86,7 @@
             margin: 0;
         }
     }
+
     &__content {
         padding: 2.4rem 0 0;
         display: flex;
@@ -88,11 +96,13 @@
             min-width: 256px;
             margin-left: 2.4rem;
         }
+
         @include mobile {
             flex: 1;
             padding: 0;
         }
     }
+
     &__header-wrapper,
     &__content {
         max-width: 1232px;
@@ -103,6 +113,7 @@
             width: 100%;
         }
     }
+
     @include mobile {
         display: flex;
         flex-direction: column;
diff --git a/src/components/shared_ui/popover/popover.scss b/src/components/shared_ui/popover/popover.scss
index de5e48ba..af48b87c 100644
--- a/src/components/shared_ui/popover/popover.scss
+++ b/src/components/shared_ui/popover/popover.scss
@@ -1,10 +1,14 @@
+@use 'components/shared/styles/mixins' as *;
+
 .dc-popover {
     &__wrapper {
         position: relative;
     }
+
     &__container {
         position: absolute;
-        /*rtl:ignore*/
+
+        /* rtl:ignore */
         left: 0;
         top: 0;
         width: 280px;
@@ -13,6 +17,7 @@
             position: relative;
         }
     }
+
     &__target {
         // &__icon .info {
         //     @extend .dc-icon--secondary;
@@ -38,8 +43,10 @@
             transform: translateY(-65%);
         }
     }
+
     &__bubble {
         @include typeface(--small-center-normal-active, none);
+
         cursor: help;
         position: relative;
         padding: 0.8rem;
@@ -56,15 +63,18 @@
             margin-right: 0.7em;
             padding-top: 3px;
         }
+
         &__text {
             flex-grow: 2;
             direction: ltr;
         }
+
         &--error {
             direction: ltr;
             background-color: var(--status-danger);
         }
     }
+
     &__trade-params {
         @include mobile {
             max-width: calc(100vw - 6.7rem);
@@ -76,6 +86,7 @@
 .accu-info-display__popover {
     max-width: 28rem;
 }
+
 .accu-info-display__popover {
     @include mobile {
         max-width: 33rem;
diff --git a/src/components/shared_ui/progress-bar-tracker/progress-bar-tracker.scss b/src/components/shared_ui/progress-bar-tracker/progress-bar-tracker.scss
index 63a08088..b720e4d4 100644
--- a/src/components/shared_ui/progress-bar-tracker/progress-bar-tracker.scss
+++ b/src/components/shared_ui/progress-bar-tracker/progress-bar-tracker.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/constants' as *;
+
 .dc-progress-bar-tracker {
     display: flex;
     justify-content: center;
diff --git a/src/components/shared_ui/progress-slider/progress-slider.scss b/src/components/shared_ui/progress-slider/progress-slider.scss
index 55222391..6367bd41 100644
--- a/src/components/shared_ui/progress-slider/progress-slider.scss
+++ b/src/components/shared_ui/progress-slider/progress-slider.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/constants' as *;
+
 /** @define dc-progress-slider */
 // Progress Slider
 .dc-progress-slider {
@@ -12,6 +14,7 @@
         border-bottom: 1px solid var(--general-section-6);
         margin: 0.4rem 0 0.8rem;
     }
+
     &__track {
         background: var(--text-disabled);
         position: relative;
@@ -20,6 +23,7 @@
         width: 100%;
         border-radius: #{$BORDER_RADIUS * 2};
     }
+
     &__ticks {
         position: relative;
 
@@ -32,6 +36,7 @@
             flex-direction: row;
             justify-content: space-evenly;
         }
+
         &-step {
             height: 6px;
             width: 100%;
@@ -51,31 +56,38 @@
                 width: 100%;
                 background-color: var(--brand-secondary);
             }
+
             &--marked:before {
                 transform: scale3d(1, 1, 1);
             }
+
             &:first-child {
                 margin-left: 0;
             }
+
             &:last-child {
                 margin-right: 0;
             }
+
             &:first-child,
             &:first-child:before {
                 border-top-left-radius: $BORDER_RADIUS;
                 border-bottom-left-radius: $BORDER_RADIUS;
             }
+
             &:last-child,
             &:last-child:before {
                 border-top-right-radius: $BORDER_RADIUS;
                 border-bottom-right-radius: $BORDER_RADIUS;
             }
         }
+
         &-caption {
             display: flex;
             justify-content: space-between;
         }
     }
+
     &__line {
         background: var(--state-hover);
         position: absolute;
@@ -89,16 +101,20 @@
         &--ticks {
             height: 2px;
         }
+
         &--green {
             background: var(--status-success) !important;
         }
+
         &--yellow {
             background: var(--status-warning) !important;
         }
+
         &--red {
             background: var(--status-danger) !important;
         }
     }
+
     &__infinite-loader {
         position: relative;
         height: 4px;
@@ -123,37 +139,45 @@
                 bottom: 0;
                 will-change: left, right;
             }
+
             &:before {
                 animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
             }
+
             &:after {
                 animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
                 animation-delay: 1.15s;
             }
         }
+
         @keyframes indeterminate {
             0% {
                 left: -35%;
                 right: 100%;
             }
+
             60% {
                 left: 100%;
                 right: -90%;
             }
+
             100% {
                 left: 100%;
                 right: -90%;
             }
         }
+
         @keyframes indeterminate-short {
             0% {
                 left: -200%;
                 right: 100%;
             }
+
             60% {
                 left: 107%;
                 right: -8%;
             }
+
             100% {
                 left: 107%;
                 right: -8%;
diff --git a/src/components/shared_ui/radio-group/radio-group.scss b/src/components/shared_ui/radio-group/radio-group.scss
index 54ce0a77..633e6a18 100644
--- a/src/components/shared_ui/radio-group/radio-group.scss
+++ b/src/components/shared_ui/radio-group/radio-group.scss
@@ -1,21 +1,29 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .dc-radio-group {
     display: flex;
     margin-top: 16px;
     flex-direction: row;
     align-items: center;
+
     &__input {
         display: none;
     }
+
     &__item {
         display: flex;
+
         @include typeface(--paragraph-left-normal-prominent);
 
         cursor: pointer;
         color: var(--text-general);
     }
+
     &__item:not(:last-child) {
         margin-right: 16px;
     }
+
     &__circle {
         border: 2px solid var(--text-general);
         border-radius: 50%;
@@ -29,18 +37,22 @@
         &--disabled {
             border-color: var(--border-disabled);
         }
+
         &--selected {
             border-width: 4px;
             border-color: var(--brand-red-coral);
         }
+
         &--error {
             border-color: var(--text-less-prominent);
         }
     }
+
     &__label {
         &--disabled {
             color: var(--text-disabled);
         }
+
         &--error {
             color: var(--text-loss-danger);
         }
diff --git a/src/components/shared_ui/select-native/select-native.scss b/src/components/shared_ui/select-native/select-native.scss
index b297aab9..0ab318dc 100644
--- a/src/components/shared_ui/select-native/select-native.scss
+++ b/src/components/shared_ui/select-native/select-native.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/constants' as *;
+
 .dc-select-native {
     width: 100%;
     position: relative;
@@ -10,6 +12,7 @@
             width: 40px;
         }
     }
+
     &__container {
         border: 1px solid var(--border-normal);
         border-radius: $BORDER_RADIUS;
@@ -19,6 +22,7 @@
         &:hover:not(.dc-input--disabled) {
             border-color: var(--border-hover);
         }
+
         &:focus-within {
             border-color: var(--brand-secondary);
 
@@ -26,26 +30,32 @@
                 border-color: var(--brand-secondary);
             }
         }
+
         &--error {
             border-color: var(--brand-red-coral) !important;
         }
+
         &--disabled {
             border-color: var(--general-disabled);
         }
     }
+
     &__wrapper {
         height: 38px;
 
         .dc-input {
-            margin-bottom: 0px;
+            margin-bottom: 0;
         }
     }
+
     &__arrow {
         position: absolute;
         right: 1.3rem;
         top: 1.3rem;
+
         --fill-color1: var(--text-less-prominent);
     }
+
     &__display {
         height: 38px;
         width: 100%;
@@ -67,6 +77,7 @@
             line-height: 3.8rem;
         }
     }
+
     &__placeholder {
         position: absolute;
         left: 1.1rem;
@@ -90,6 +101,7 @@
             color: var(--text-general);
             max-width: 100%;
         }
+
         &--hide-top-placeholder {
             transform: translate(0, -1.8rem) scale(0.75);
             color: var(--text-general);
@@ -97,6 +109,7 @@
             display: none;
         }
     }
+
     &__picker {
         opacity: 0;
         width: 100%;
@@ -105,25 +118,31 @@
         top: 0;
         position: absolute;
     }
+
     &--disabled {
         .dc-select-native__display-text {
             color: var(--text-less-prominent);
         }
+
         .dc-select-native__placeholder:not(.dc-select-native__placeholder--has-value) {
             color: var(--text-less-prominent);
         }
+
         .dc-icon {
             --fill-color1: var(--text-less-prominent);
         }
     }
+
     &--error {
         .dc-select-native__placeholder {
             color: var(--brand-red-coral);
         }
     }
+
     &__hint {
         margin-left: 1.2rem;
     }
+
     &__suffix-icon {
         position: absolute;
         left: 11px;
diff --git a/src/components/shared_ui/tabs/tabs.scss b/src/components/shared_ui/tabs/tabs.scss
index e0208ee6..576b8686 100644
--- a/src/components/shared_ui/tabs/tabs.scss
+++ b/src/components/shared_ui/tabs/tabs.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/devices' as *;
+
 .dc-tabs {
     position: relative;
     display: grid;
@@ -5,6 +7,7 @@
     &--top {
         grid-template-rows: auto 1fr;
     }
+
     &--100vw {
         width: 100vw;
     }
@@ -14,6 +17,7 @@
         line-height: 38px;
         display: flex;
         position: relative;
+
         @include mobile {
             justify-content: center;
         }
@@ -30,10 +34,12 @@
         &--top {
             order: 0;
         }
+
         &--bottom {
             order: 1;
             border-top: 2px solid var(--general-section-1);
         }
+
         &--center {
             justify-content: center;
             width: fit-content;
@@ -43,11 +49,13 @@
                 padding: 0 2.2rem;
             }
         }
+
         &--fit-content {
             @include mobile {
                 width: fit-content;
             }
         }
+
         &--header-fit-content {
             width: fit-content;
 
@@ -56,13 +64,16 @@
                 justify-content: space-evenly;
             }
         }
+
         &:not(&--header-fit-content) {
             justify-content: center;
         }
+
         &--full-width {
             width: 100vw;
         }
     }
+
     &__item {
         list-style: none;
         font-size: 14px;
@@ -76,6 +87,7 @@
             margin-top: -2rem;
             vertical-align: middle;
         }
+
         &__icon {
             padding-right: 0.7rem;
 
@@ -84,12 +96,15 @@
                 padding-top: 0.5rem;
             }
         }
+
         &--header-fit-content {
-            padding: 0px 29px;
+            padding: 0 29px;
         }
+
         &--is-hidden {
             display: none;
         }
+
         &--is-scrollable-and-active {
             position: relative;
 
@@ -102,14 +117,17 @@
                 width: 100%;
             }
         }
+
         &:not(.dc-tabs__active) {
             cursor: pointer;
             color: var(--text-general);
         }
+
         &:not(&--header-fit-content) {
             width: var(--tab-width);
         }
     }
+
     &__active {
         font-weight: 700;
         color: var(--text-prominent);
@@ -118,9 +136,11 @@
     &__active-line {
         display: block;
         position: absolute;
-        /*rtl:begin:ignore*/
+
+        /* rtl:begin:ignore */
         left: 0;
-        /*rtl:end:ignore*/
+
+        /* rtl:end:ignore */
         height: 2px;
         background: var(--brand-red-coral);
         transition: all ease-in-out 0.3s;
@@ -128,17 +148,21 @@
         &--top {
             bottom: -2px;
         }
+
         &--bottom {
             top: -2px;
         }
+
         &--is-hidden {
             display: none;
         }
+
         &--fit-content {
             @include mobile {
                 width: 120px;
             }
         }
+
         &:not(&--header-fit-content) {
             width: var(--tab-width);
         }
diff --git a/src/components/shared_ui/themed-scrollbars/themed-scrollbars.scss b/src/components/shared_ui/themed-scrollbars/themed-scrollbars.scss
index eb61dcef..dcf4ce1f 100644
--- a/src/components/shared_ui/themed-scrollbars/themed-scrollbars.scss
+++ b/src/components/shared_ui/themed-scrollbars/themed-scrollbars.scss
@@ -1,9 +1,12 @@
+@use 'components/shared/styles/devices' as *;
+
 /** @define dc-themed-scrollbars */
 .dc-themed-scrollbars {
     overflow-y: auto;
     overflow-x: hidden;
     position: relative;
     scroll-behavior: smooth;
+
     /* Firefox only */
     scrollbar-color: var(--state-active) var(--general-main-1);
     scrollbar-width: thin;
@@ -12,20 +15,24 @@
         &::-webkit-scrollbar-thumb {
             display: none;
         }
+
         &--is-hovered {
             &::-webkit-scrollbar-thumb {
                 display: unset;
             }
         }
     }
+
     &--has-horizontal {
         overflow-x: auto;
     }
+
     &--hidden-scrollbar {
         &::-webkit-scrollbar {
             display: none !important;
         }
     }
+
     &--only-horizontal {
         overflow-y: hidden;
         overflow-x: auto;
@@ -35,6 +42,7 @@
             overflow-x: overlay;
         }
     }
+
     &-wrapper {
         display: flex;
         justify-content: space-between;
@@ -55,15 +63,18 @@
             }
         }
     }
+
     &::-webkit-scrollbar {
         width: 5px;
         height: 5px;
         background-color: transparent;
         border-radius: 10px;
     }
+
     &::-webkit-scrollbar-track {
         background-color: transparent;
     }
+
     &::-webkit-scrollbar-thumb {
         border-radius: 10px;
         background-color: var(--state-active);
diff --git a/src/components/shared_ui/tooltip/tooltip.scss b/src/components/shared_ui/tooltip/tooltip.scss
index 96f04867..9ec1faea 100644
--- a/src/components/shared_ui/tooltip/tooltip.scss
+++ b/src/components/shared_ui/tooltip/tooltip.scss
@@ -1,8 +1,12 @@
-/*rtl:begin:ignore*/
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
+/* rtl:begin:ignore */
 .dc-tooltip {
     text-decoration: none;
     font-size: inherit;
     color: var(--text-prominent);
+
     @include tooltipColor(var(--status-default));
 
     &__balloon-icon {
@@ -19,9 +23,11 @@
             opacity: 1;
         }
     }
+
     &[data-tooltip] {
         cursor: initial;
         display: block;
+
         @include convertTooltipColor(var(--status-default));
 
         &:hover:after,
@@ -30,6 +36,7 @@
             pointer-events: auto;
             transform: translate(-50%, 0);
         }
+
         &:before,
         &:after {
             opacity: 0;
@@ -42,8 +49,10 @@
             transform: translate(-50%, 1em);
             transform-origin: top;
         }
+
         &:before {
             @include typeface(--small-left-normal-active, none);
+
             line-height: 1.5;
             text-decoration: none;
             letter-spacing: normal;
@@ -55,6 +64,7 @@
             width: 220px;
             max-width: 280px;
         }
+
         &:after {
             border: solid transparent;
             content: '';
@@ -65,6 +75,7 @@
             border-width: 6px;
             margin-bottom: -2px;
         }
+
         &[data-tooltip-pos='right'] {
             &:before,
             &:after {
@@ -73,14 +84,17 @@
                 top: 50%;
                 transform: translate(-1em, -50%);
             }
+
             &:before {
                 margin-left: 1em;
             }
+
             &:hover:after,
             &:hover:before {
                 transform: translate(0, -50%);
             }
         }
+
         &[data-tooltip-pos='left'] {
             &:before,
             &:after {
@@ -90,15 +104,18 @@
                 top: 50%;
                 transform: translate(1em, -50%);
             }
+
             &:before {
-                /*rtl:ignore*/
+                /* rtl:ignore */
                 margin-right: 1em;
             }
+
             &:hover:after,
             &:hover:before {
                 transform: translate(0, -50%);
             }
         }
+
         &[data-tooltip-pos='bottom'] {
             &:before,
             &:after {
@@ -107,21 +124,25 @@
                 top: 100%;
                 transform: translate(-50%, -1em);
             }
+
             &:before {
                 margin-top: 1.1em;
             }
+
             &:hover:after,
             &:hover:before {
                 transform: translate(-50%, 0);
             }
         }
     }
+
     &--with-label[data-tooltip] {
         &:before,
         &:after {
             margin-top: 1em;
         }
     }
+
     &--error[data-tooltip] {
         @include convertTooltipColor(var(--status-danger));
 
@@ -134,11 +155,13 @@
                 pointer-events: auto;
                 transform: translate(0, -50%);
             }
+
             &:before {
                 width: 180px;
             }
         }
     }
+
     &--error-secondary[data-tooltip] {
         @include convertTooltipColor(var(--status-danger));
 
@@ -156,4 +179,4 @@
     }
 }
 
-/*rtl:end:ignore*/
+/* rtl:end:ignore */
diff --git a/src/components/summary/summary-card.scss b/src/components/summary/summary-card.scss
index 351db29b..c0460207 100644
--- a/src/components/summary/summary-card.scss
+++ b/src/components/summary/summary-card.scss
@@ -1,9 +1,13 @@
+@use 'components/shared/styles/devices' as *;
+
 .db-summary-card {
     $contract-card: &;
+
     box-sizing: border-box;
     display: flex;
     flex-direction: column;
     position: relative;
+
     @include desktop {
         width: 100%;
     }
@@ -21,14 +25,17 @@
         text-align: center;
         line-height: 2rem;
         padding: 0 3rem;
+
         & .dc-text {
             text-align: center;
         }
     }
+
     &--is-loading {
         background-color: inherit;
         border: 1px solid var(--general-main-1);
     }
+
     &--completed {
         border: 1px solid var(--general-main-1);
 
@@ -36,23 +43,29 @@
             border: 1px solid var(--border-disabled);
         }
     }
+
     .dc-contract-card {
         padding: 1.6rem 1.6rem 0.8rem;
     }
+
     .dc-contract-card__grid-underlying-trade {
         grid-template-columns: 1.5fr 1fr;
     }
+
     .dc-contract-card-items-wrapper {
         grid-template-columns: 1.5fr 1fr;
         margin-top: 0.8rem;
     }
+
     &--mobile {
         .dc-contract-card {
             padding: 1.5rem 3.4rem;
         }
+
         .dc-contract-card__grid-underlying-trade--mobile {
             grid-template-columns: 1fr 1.25fr;
         }
+
         .dc-contract-card-items-wrapper {
             grid-template-columns: 1fr 1fr;
         }
diff --git a/src/components/summary/summary.scss b/src/components/summary/summary.scss
index b1ff7dfd..11413f2b 100644
--- a/src/components/summary/summary.scss
+++ b/src/components/summary/summary.scss
@@ -1,8 +1,12 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .summary {
     display: flex;
     align-items: center;
     flex-direction: column;
     background-color: var(--general-section-2);
+
     @include desktop {
         height: inherit;
     }
@@ -34,14 +38,18 @@
         &-title {
             height: 18px;
             margin-bottom: 4px;
+
             @include typeface(--small-center-bold-black, none);
         }
+
         &-content {
             height: 18px;
             margin-bottom: 4px;
+
             @include typeface(--small-center-normal-black, none);
         }
     }
+
     &__amount {
         @include typeface(--small-center-normal-black, none);
 
@@ -49,6 +57,7 @@
             font-weight: bold;
             color: var(--text-profit-success);
         }
+
         &--negative {
             font-weight: bold;
             color: var(--text-loss-danger);
diff --git a/src/components/trade-animation/trade-animation.scss b/src/components/trade-animation/trade-animation.scss
index 64e8e98d..f55744f6 100644
--- a/src/components/trade-animation/trade-animation.scss
+++ b/src/components/trade-animation/trade-animation.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/devices' as *;
+
 @keyframes animate-progress {
     0% {
         width: 0%;
@@ -187,6 +190,7 @@
                         animation: animate-circle 0.8s infinite;
                         animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
                         background-color: var(--status-success);
+
                         // transform: translate(-50%, -50%);
                         // z-index: 1;
                     }
diff --git a/src/components/transactions/transactions.scss b/src/components/transactions/transactions.scss
index 5ad4a235..89794bd7 100644
--- a/src/components/transactions/transactions.scss
+++ b/src/components/transactions/transactions.scss
@@ -1,6 +1,9 @@
+@use 'components/shared/styles/mixins' as *;
+
 .transactions {
     $transaction: &;
     $grid-template-columns: 0.8fr 1fr 1.1fr;
+
     flex-direction: column;
 
     .download__container {
@@ -31,21 +34,26 @@
         &__header {
             padding: 0.8rem;
         }
+
         &__icon-box {
             display: flex;
             justify-content: center;
             margin-top: 0.3rem;
         }
+
         &__icon {
             align-self: center;
         }
+
         &__message {
             margin: 0 auto;
             margin-bottom: 2rem;
+
             & .dc-text {
                 line-height: var(--text-lh-xxl);
             }
         }
+
         &__list {
             list-style-type: disc;
             margin-left: 2rem;
@@ -54,11 +62,14 @@
             color: var(--text-less-prominent);
         }
     }
+
     &__header {
         border-bottom: 1px solid var(--general-section-1);
         width: 100%;
         display: grid;
+
         @include typeface(--small-left-bold-black, none);
+
         grid-template-columns: $grid-template-columns;
         grid-template-areas: 'type spot profit';
         padding: 1.2rem 1.6rem; // Equal l+r with transaction__item padding.
@@ -74,12 +85,14 @@
                 @if $item == 'spot' {
                     text-align: start;
                 }
+
                 @if $item == 'profit' {
                     text-align: end;
                 }
             }
         }
     }
+
     &__content {
         height: calc(100% - 11rem);
 
@@ -87,13 +100,16 @@
             height: calc(100% - 4.2rem);
         }
     }
+
     &__scrollbar {
         height: 100%;
+
         & .dc-themed-scrollbars {
             height: 100%;
             width: 100%;
         }
     }
+
     &__item {
         display: grid;
         font-size: 12px;
@@ -102,6 +118,7 @@
         grid-template-rows: auto auto;
         grid-template-areas: ('trade-type entry-spot stake' 'trade-type exit-spot  profit');
         padding: 0.8rem 0;
+
         @include rtl {
             direction: rtl;
         }
@@ -135,6 +152,7 @@
             @if $item == 'exit-spot' or $item == 'entry-spot' or $item == 'trade-type' {
                 justify-content: flex-start;
             }
+
             @if $item == 'stake' or $item == 'profit' {
                 justify-content: flex-end;
             }
@@ -150,28 +168,35 @@
             background-color: var(--general-section-2);
         }
     }
+
     &__item-wrapper + &__divider {
         border-top: none;
     }
+
     &__divider + &__item-wrapper {
         border-top: none;
     }
+
     &__loader {
         &-text {
             width: 7.2rem;
             height: 1rem;
         }
+
         &-container {
             @include flex-center;
+
             width: 2.4rem;
             height: 2.4rem;
             margin-right: 0.4rem;
         }
+
         &-icon {
             width: 2.4rem;
             height: 2.4rem;
         }
     }
+
     &__icon {
         margin-right: 0.8rem;
         max-height: 1.6rem;
@@ -179,11 +204,13 @@
         min-height: 1.6rem;
         min-width: 1.6rem;
     }
+
     &__cell {
         display: flex;
         align-items: center;
         color: var(--text-general);
     }
+
     &__profit {
         &--win {
             color: var(--text-profit-success);
@@ -192,6 +219,7 @@
                 content: '+';
             }
         }
+
         &--loss {
             color: var(--text-loss-danger);
 
@@ -200,6 +228,7 @@
             }
         }
     }
+
     &__info {
         &-header {
             font-weight: bold;
@@ -210,8 +239,10 @@
         &-title {
             @include typeface(--xsmall-left-normal-black, none);
         }
+
         &-item {
             @include typeface(--small-left-bold-black, none);
+
             &:not(:last-of-type) {
                 margin-bottom: 0.8rem;
             }
diff --git a/src/pages/bot-builder/quick-strategy/form-wrappers/strategy-accordion.scss b/src/pages/bot-builder/quick-strategy/form-wrappers/strategy-accordion.scss
index 007a8092..ea21d24a 100644
--- a/src/pages/bot-builder/quick-strategy/form-wrappers/strategy-accordion.scss
+++ b/src/pages/bot-builder/quick-strategy/form-wrappers/strategy-accordion.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/devices' as *;
+
 .dbot-accordion {
     width: 100%;
 
@@ -9,7 +12,6 @@
         background-color: transparent;
         border: none;
         outline: none;
-
         padding-left: 0;
 
         @include mobile {
diff --git a/src/pages/bot-builder/quick-strategy/parts/loss-threshold-warning-dialog.scss b/src/pages/bot-builder/quick-strategy/parts/loss-threshold-warning-dialog.scss
index 10038f38..41039cb1 100644
--- a/src/pages/bot-builder/quick-strategy/parts/loss-threshold-warning-dialog.scss
+++ b/src/pages/bot-builder/quick-strategy/parts/loss-threshold-warning-dialog.scss
@@ -1,8 +1,10 @@
+@use 'components/shared/styles/devices' as *;
+
 .loss-threshold-warning-dialog {
     &__body-text {
         font-size: 1.5rem;
         line-height: 18px;
-        margin: 12px 0px;
+        margin: 12px 0;
         margin-bottom: 22px;
         color: var(--text-general);
     }
@@ -13,6 +15,7 @@
                 max-width: 90%;
             }
         }
+
         &__footer {
             @include mobile {
                 display: flex;
@@ -20,11 +23,13 @@
                 flex-wrap: unset;
             }
         }
+
         &__button:not(:last-child) {
             @include mobile {
                 margin-right: 6px;
             }
         }
+
         &__button {
             @include mobile {
                 margin-left: 6px;
diff --git a/src/pages/bot-builder/quick-strategy/quick-strategy.scss b/src/pages/bot-builder/quick-strategy/quick-strategy.scss
index 2cdde9b2..61cd6035 100644
--- a/src/pages/bot-builder/quick-strategy/quick-strategy.scss
+++ b/src/pages/bot-builder/quick-strategy/quick-strategy.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 .qs {
     --sidebar-width: 24rem;
     --footer-height: 7.2rem;
@@ -10,12 +12,13 @@
     --input-action-width: 4.6rem;
     --group-outer-padding: 1.6rem;
 
-    @include mobile() {
+    @include mobile {
         --select-height: 4rem;
         --input-height: 3.4rem;
         --footer-height: 4.2rem;
         --input-action-height: 3rem;
         --input-action-width: 3rem;
+
         width: 100%;
     }
 
@@ -26,10 +29,12 @@
 
     &__head {
         @include flex-center(space-between);
+
         border-bottom: 1px solid var(--border-divider);
 
         &__title {
             @extend .x-center;
+
             padding: 0 2.4rem;
             height: var(--header-height);
             background-color: var(--general-section-1);
@@ -50,11 +55,11 @@
     &__body {
         display: flex;
 
-        @include desktop() {
+        @include desktop {
             height: 72rem;
         }
 
-        @include mobile() {
+        @include mobile {
             display: block;
         }
 
@@ -100,28 +105,30 @@
             position: relative;
             padding: 0.8rem;
 
-            @include mobile() {
+            @include mobile {
                 width: 100%;
                 padding: 0;
             }
 
             &__head {
                 @include flex-center;
+
                 padding-bottom: 1rem;
 
-                @include mobile() {
+                @include mobile {
                     padding: 0 1.6rem 1.6rem;
                     margin-top: 1.6rem;
                 }
 
                 &__tabs {
                     @extend .x-center;
+
                     background-color: var(--general-section-1);
                     padding: 0.4rem;
                     border-radius: 0.6rem;
                     height: 4rem;
 
-                    @include mobile() {
+                    @include mobile {
                         width: 100%;
                     }
 
@@ -133,7 +140,7 @@
                         border-radius: 0.4rem;
                         user-select: none;
 
-                        @include mobile() {
+                        @include mobile {
                             min-width: auto;
                             width: 50%;
                         }
@@ -174,7 +181,7 @@
             &__form {
                 padding: 0 2.4rem;
 
-                @include mobile() {
+                @include mobile {
                     padding: 0 1.6rem;
                 }
 
@@ -195,7 +202,9 @@
             &__footer {
                 height: var(--footer-height);
                 border-top: 1px solid var(--border-divider);
+
                 @include flex-center(flex-end);
+
                 padding: 1.6rem 2.4rem;
                 background-color: var(--general-main-1);
 
@@ -213,17 +222,18 @@
     &__form {
         &__container {
             min-height: 10rem;
+
             // to overwrite the height of the ThemedScrollbar
             max-height: calc(100vh - 23rem) !important;
 
-            @include desktop() {
+            @include desktop {
                 height: calc(100vh - 16rem) !important;
             }
 
             margin-bottom: 1rem;
             overflow-y: auto;
 
-            @include mobile() {
+            @include mobile {
                 margin-bottom: 0;
                 max-height: calc(100% - 12.2rem) !important;
             }
@@ -231,7 +241,7 @@
             &--no-footer {
                 max-height: 100% !important;
 
-                @include mobile() {
+                @include mobile {
                     max-height: calc(100% - 8rem) !important;
                 }
             }
@@ -354,7 +364,7 @@
                 display: flex;
                 flex-direction: row-reverse;
 
-                @include mobile() {
+                @include mobile {
                     top: -2.8rem;
                     right: 4rem;
                 }
@@ -383,7 +393,7 @@
                 height: 2.4rem;
                 width: 2.4rem;
 
-                @include mobile() {
+                @include mobile {
                     top: 50%;
                     left: 0;
                     transform: translateY(-50%);
@@ -477,6 +487,7 @@
 
     .seddle-actions {
         @include flex-center;
+
         position: absolute;
         background: transparent;
         border: none;
@@ -516,10 +527,11 @@
 
             &__leading-icon {
                 @extend .seddle-actions;
+
                 left: 0.3rem;
                 color: var(--text-general);
 
-                @include mobile() {
+                @include mobile {
                     left: 0.2rem;
                 }
 
@@ -535,10 +547,11 @@
 
             &__trailing-icon {
                 @extend .seddle-actions;
+
                 right: 0.3rem;
                 color: var(--text-general);
 
-                @include mobile() {
+                @include mobile {
                     right: 0.2rem;
                 }
 
@@ -570,6 +583,7 @@
 
     &__input-label {
         @extend .x-center;
+
         height: var(--input-height);
 
         &__wrapper {
@@ -582,6 +596,7 @@
 
         &__container {
             @extend .x-center;
+
             height: calc(var(--input-height) - 0.5rem);
             width: 100%;
 
@@ -597,7 +612,7 @@
             .dc-toggle-switch__label {
                 width: 4.6rem;
                 padding: 0 0.2rem;
-                background: var(--core-color-opacity-black-200, rgba(0, 0, 0, 0.16));
+                background: var(--core-color-opacity-black-200, rgb(0 0 0 / 16%));
                 margin-right: 0;
             }
         }
diff --git a/src/pages/bot-builder/toolbar/toolbar.scss b/src/pages/bot-builder/toolbar/toolbar.scss
index c7be7562..4d4f310d 100644
--- a/src/pages/bot-builder/toolbar/toolbar.scss
+++ b/src/pages/bot-builder/toolbar/toolbar.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .toolbar {
     height: 5.6rem;
     display: flex;
@@ -17,6 +20,7 @@
         overflow-x: auto;
         width: fit-content;
         padding: 0;
+
         &::-webkit-scrollbar {
             display: none;
         }
@@ -25,7 +29,9 @@
         scrollbar-width: none;
         z-index: 0;
     }
+
     z-index: 1;
+
     &__btn {
         background-color: var(--button-primary-default) !important;
 
@@ -33,6 +39,7 @@
             display: flex;
             justify-content: center;
             height: calc(5.6rem - 1.6rem) !important;
+
             @include desktop {
                 width: 22rem;
                 margin-bottom: 1rem;
@@ -41,14 +48,17 @@
             & .dc-btn__icon {
                 padding-right: 0.4rem;
             }
+
             > * {
                 align-self: center;
             }
+
             &-text {
                 @include typeface(--title-center-bold-active, none);
             }
         }
     }
+
     &__section {
         display: flex;
 
@@ -68,6 +78,7 @@
             }
         }
     }
+
     &__icon {
         cursor: pointer;
         border: none;
@@ -80,38 +91,46 @@
             margin: 1.2rem;
         }
     }
+
     &__group {
         display: flex;
         border-radius: $BORDER_RADIUS;
         border: solid 1px var(--border-normal);
         height: 4rem;
+
         &-btn {
             padding: 0 1.2rem;
             height: 4rem;
+
             @include mobile {
                 padding: 0;
                 height: fit-content;
                 flex-direction: column;
                 border: none;
+
                 .dc-popover {
                     &__target {
                         width: 4rem;
                     }
                 }
             }
+
             > * {
                 align-self: center;
             }
         }
     }
+
     &__animation {
         width: 35rem;
     }
+
     &__dialog {
         &-text--second {
             margin-top: 2.4rem;
         }
     }
+
     &__wrapper {
         @include mobile {
             background-color: var(--general-main-1);
@@ -121,8 +140,8 @@
             scrollbar-width: none;
             height: calc(100% - 5rem);
             box-shadow:
-                0 1.2rem 1.6rem rgba(14, 14, 14, 0.08),
-                0 0.4rem 0.6rem rgba(14, 14, 14, 0.03);
+                0 1.2rem 1.6rem rgb(14 14 14 / 8%),
+                0 0.4rem 0.6rem rgb(14 14 14 / 3%);
         }
     }
 }
@@ -131,6 +150,7 @@
     0% {
         transform: rotate(0deg);
     }
+
     100% {
         transform: rotate(360deg);
     }
diff --git a/src/pages/bot-builder/workspace.scss b/src/pages/bot-builder/workspace.scss
index 8e3df06b..02f4d846 100644
--- a/src/pages/bot-builder/workspace.scss
+++ b/src/pages/bot-builder/workspace.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/devices' as *;
+
 #scratch_div {
     position: relative;
     width: calc(100vw - 3.2rem);
diff --git a/src/pages/chart/chart-modal/chart-modal.scss b/src/pages/chart/chart-modal/chart-modal.scss
index 85a3e5a5..8ccf2dad 100644
--- a/src/pages/chart/chart-modal/chart-modal.scss
+++ b/src/pages/chart/chart-modal/chart-modal.scss
@@ -1,16 +1,20 @@
+@use 'components/shared/styles/mixins' as *;
+
 #id-charts--disabled {
     color: var(--fill-normal-1);
-    stroke-opacity: 30%;
+    stroke-opacity: 0.3;
     pointer-events: none;
 }
 
 .chart-modal-dialog {
     --modal-height: calc(100% - 54px);
+
     height: var(--modal-height);
     max-height: var(--modal-height);
     padding: 0 0.8rem;
     z-index: 999;
     transition: opacity 0.25s cubic-bezier(0.25, 0.1, 0.1, 0.25);
+
     @include flex-center;
 
     .dashboard__chart-wrapper--modal {
diff --git a/src/pages/chart/chart.scss b/src/pages/chart/chart.scss
index dcbab1aa..e75024bc 100644
--- a/src/pages/chart/chart.scss
+++ b/src/pages/chart/chart.scss
@@ -1,7 +1,10 @@
+@use 'components/shared/styles/mixins' as *;
+
 .bot {
     &__chart-container {
         position: relative;
         top: 0;
+
         &-wrapper {
             position: absolute;
             top: 0;
@@ -21,6 +24,7 @@
                 &.ciq-disabled {
                     display: none;
                 }
+
                 @include mobile {
                     min-width: 17rem;
                     max-width: 26rem;
@@ -29,6 +33,7 @@
                     .cq-menu-btn {
                         padding: 0.2rem;
                     }
+
                     .cq-symbol-select-btn {
                         margin: 0.2rem;
 
@@ -36,9 +41,11 @@
                             transform: scale(1);
                             margin-left: auto;
                         }
+
                         .cq-symbol {
                             font-size: 1.2rem;
                         }
+
                         .cq-chart-price {
                             display: none;
                         }
@@ -73,6 +80,7 @@
                     border-radius: 50%;
                     margin: 0.8rem;
                     opacity: 0.75;
+
                     @include flex-center;
 
                     &__menu {
@@ -80,12 +88,14 @@
                             top: 0.8rem;
                             left: 0.8rem;
                         }
+
                         & > .ic-icon {
                             top: 0.6rem;
                         }
                     }
                 }
             }
+
             .app-contents .ciq-menu {
                 margin: 0;
             }
@@ -95,6 +105,7 @@
     .smartcharts-mobile {
         .cq-context {
             z-index: 99;
+
             .sc-mcd__category:last-child {
                 margin-bottom: 3rem !important;
             }
@@ -103,10 +114,13 @@
         & .cq-chart-title .cq-menu-dropdown {
             position: fixed;
             height: 100% !important;
+
             .sc-dialog {
                 height: 100% !important;
+
                 &__body {
                     height: inherit !important;
+
                     .sc-mcd {
                         height: inherit !important;
                         min-width: auto !important;
diff --git a/src/pages/dashboard/dashboard.scss b/src/pages/dashboard/dashboard.scss
index f8f35cda..ca29669d 100644
--- a/src/pages/dashboard/dashboard.scss
+++ b/src/pages/dashboard/dashboard.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 .bot-dashboard {
     position: relative;
     height: calc(100vh - 8.4rem);
diff --git a/src/pages/dashboard/load-bot-preview/delete-dialog.scss b/src/pages/dashboard/load-bot-preview/delete-dialog.scss
index 649996fe..f1adf6e9 100644
--- a/src/pages/dashboard/load-bot-preview/delete-dialog.scss
+++ b/src/pages/dashboard/load-bot-preview/delete-dialog.scss
@@ -1,16 +1,22 @@
+@use 'components/shared/styles/mixins' as *;
+
 .dc-dialog__delete-strategy--delete {
     .dc-dialog {
         &__footer {
             @include mobile {
                 flex-wrap: unset;
+
                 @include flex-center(flex-end, flex-start);
+
                 width: 100%;
 
                 button {
                     flex-basis: unset;
+
                     &:first-child {
                         margin-right: 1rem;
                     }
+
                     margin-bottom: unset;
                 }
             }
diff --git a/src/pages/dashboard/load-bot-preview/index.scss b/src/pages/dashboard/load-bot-preview/index.scss
index 72127813..86731d64 100644
--- a/src/pages/dashboard/load-bot-preview/index.scss
+++ b/src/pages/dashboard/load-bot-preview/index.scss
@@ -1,6 +1,9 @@
-@import './google-drive';
-@import './delete-dialog';
-@import './save-modal';
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
+// @import './google-drive';
+// @import './delete-dialog';
+// @import './save-modal';
 
 .load-strategy {
     &__wrapper {
@@ -479,6 +482,7 @@
             img {
                 width: 1.6rem;
             }
+
             @include mobile {
                 padding: 0;
             }
diff --git a/src/pages/dashboard/load-bot-preview/save-modal.scss b/src/pages/dashboard/load-bot-preview/save-modal.scss
index 69b87e21..ae204982 100644
--- a/src/pages/dashboard/load-bot-preview/save-modal.scss
+++ b/src/pages/dashboard/load-bot-preview/save-modal.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .dc-modal {
     $save-modal: 'modal--save';
 
@@ -38,7 +41,7 @@ div.radio-group {
     &__save-type {
         display: flex;
         justify-content: center;
-        margin: 8% 0px;
+        margin: 8% 0;
 
         .dc-radio {
             &-group {
@@ -146,8 +149,8 @@ div.radio-group {
 
         & .modal__footer {
             position: fixed;
-            bottom: 0px;
-            left: 0px;
+            bottom: 0;
+            left: 0;
             display: flex;
             flex-direction: row;
             justify-content: flex-end;
diff --git a/src/pages/main/main.scss b/src/pages/main/main.scss
index c99cdab1..9a07b6e1 100644
--- a/src/pages/main/main.scss
+++ b/src/pages/main/main.scss
@@ -1,3 +1,6 @@
+@use 'components/shared/styles/constants' as *;
+@use 'components/shared/styles/mixins' as *;
+
 .run-panel {
     // fix for the RTL issue on tab active line
     .dc-tabs__active-line {
@@ -11,6 +14,7 @@
     width: 100%;
     height: calc(100vh - 9rem);
     padding: 1.6rem;
+
     @include mobile {
         height: calc(100vh - 6rem);
         padding: 0;
@@ -23,15 +27,15 @@
         width: 100%;
 
         &--active {
-            //css for onboard tour overlay
+            // css for onboard tour overlay
             &:before {
                 content: '';
                 position: fixed;
                 left: 0;
-                top: 0px;
+                top: 0;
                 width: 100%;
                 height: 100%;
-                background: rgba(0, 0, 0, 0.72);
+                background: rgb(0 0 0 / 72%);
                 opacity: 0.7;
                 z-index: 100;
             }
@@ -89,6 +93,7 @@
 
                     &--no-result {
                         @include flex-center;
+
                         flex-direction: column;
                         justify-content: flex-start;
                         height: 100vh;
@@ -97,9 +102,11 @@
                         svg {
                             margin-bottom: 2.4rem;
                         }
+
                         h1 {
                             margin-bottom: 0.8rem;
                         }
+
                         span {
                             word-break: break-word;
                             text-align: center;
@@ -126,6 +133,7 @@
                 height: 4.8rem;
                 padding: 0 2.4rem;
                 width: auto;
+
                 @include flex-center;
 
                 svg {
@@ -136,6 +144,7 @@
 
                     @include mobile {
                         margin-inline-end: 0.2rem;
+
                         // gave this -ve margin becaues we cannot
                         // overwrite the default core padding which
                         // will make the icon bigger
@@ -251,6 +260,7 @@
             width: 40rem;
         }
     }
+
     &__toolbox {
         position: absolute;
         top: 0;
@@ -303,6 +313,7 @@
             }
         }
     }
+
     &__run-strategy-wrapper {
         @include desktop {
             position: absolute;
@@ -404,7 +415,7 @@
     }
 
     &__steps {
-        @media (max-height: 730px) {
+        @media (height <= 730px) {
             max-height: 40vh;
             overflow-y: auto;
         }
@@ -454,7 +465,7 @@
 .joyride-content {
     font-size: 1.4rem;
 
-    @media (max-height: 790px) {
+    @media (height <= 790px) {
         max-height: 46vh;
         overflow-y: auto;
     }
@@ -510,6 +521,7 @@
 
 .dbot-slider {
     @include flex-center(flex-start);
+
     flex-direction: column;
     position: fixed;
     left: 0;
@@ -632,7 +644,9 @@
             &__progress-bar {
                 width: 50%;
                 margin-bottom: unset;
+
                 @include flex-center(flex-start);
+
                 margin-inline-start: 1rem;
 
                 .progress-bar-circle {
@@ -669,8 +683,8 @@
 }
 
 .dbot-tour-blink {
-    -webkit-animation: blink 1.25s infinite;
-    -moz-animation: blink 1.25s ease-in infinite;
+    animation: blink 1.25s infinite;
+    animation: blink 1.25s ease-in infinite;
     animation: blink 1.25s ease-in infinite;
     border-radius: $BORDER-RADIUS * 12.5;
     height: 2.5rem !important;
diff --git a/src/pages/tutorials/quick-strategy-content/index.scss b/src/pages/tutorials/quick-strategy-content/index.scss
index fdc7c095..21d55e1b 100644
--- a/src/pages/tutorials/quick-strategy-content/index.scss
+++ b/src/pages/tutorials/quick-strategy-content/index.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/devices' as *;
+
 .tutorials-quick-strategy {
     &__title {
         margin-bottom: 1.6rem;
@@ -91,6 +93,7 @@
             &.formula {
                 width: unset;
                 margin: 1.5rem 0.5rem;
+
                 img {
                     height: 100%;
                     width: auto;
diff --git a/src/pages/tutorials/tutorials.scss b/src/pages/tutorials/tutorials.scss
index 9f30391d..c127f1e1 100644
--- a/src/pages/tutorials/tutorials.scss
+++ b/src/pages/tutorials/tutorials.scss
@@ -1,3 +1,5 @@
+@use 'components/shared/styles/mixins' as *;
+
 .tutorials-wrap {
     .no-search {
         display: flex;
@@ -5,6 +7,7 @@
         width: 100%;
         word-break: break-all;
     }
+
     .dc-dialog {
         &__dialog {
             width: 80vw;
@@ -15,6 +18,7 @@
             border-radius: 0;
             position: relative;
             z-index: 1;
+
             @include mobile {
                 width: 94%;
                 height: auto;
@@ -41,47 +45,59 @@
             display: none;
         }
     }
+
     &--placeholder {
         width: 28rem;
     }
+
     &--tour {
         cursor: pointer;
     }
+
     &__group {
         margin-bottom: 5.2rem;
+
         &__guides {
             display: flex;
             margin-top: 2.4rem;
+
             @include mobile {
                 display: unset;
             }
         }
+
         &__title {
             @include mobile {
                 margin-bottom: 1.4rem;
             }
         }
+
         &__nosearch {
             @extend .no-search;
         }
+
         &__cards {
             display: flex;
             text-align: center;
             flex-direction: column;
             margin-inline-end: 2.4rem;
+
             @include mobile {
                 flex-direction: row;
                 width: auto;
+
                 span {
                     text-align: start;
                     width: 100%;
                 }
             }
         }
+
         @include mobile {
             flex-direction: column;
             margin-bottom: 2.2rem;
         }
+
         &:last-child {
             margin-bottom: 0;
         }
@@ -89,25 +105,30 @@
 
     &__placeholder {
         @include flex-center;
+
         background: var(--checkbox-disabled-grey);
         margin-bottom: 0.8rem;
         margin-inline-end: 2.4rem;
         height: 16rem;
         width: 28rem;
         background-size: 100% 100%;
+
         &__description {
             width: 28rem;
+
             @include mobile {
                 text-align: start;
                 width: calc(100% - 14.8rem);
             }
         }
+
         @include mobile {
             height: 8.7rem;
             width: 14.8rem;
             margin: 0;
             margin-inline-end: 0.8rem;
         }
+
         &__tours {
             height: 13.5rem;
             background-size: contain;
@@ -115,6 +136,7 @@
             margin-inline-end: 0.8rem;
             width: 21.5rem;
             cursor: pointer;
+
             @include mobile {
                 height: 8.7rem;
                 width: 14.8rem;
@@ -123,19 +145,23 @@
 
         &__button-group {
             @include flex-center;
+
             width: 20rem;
             height: 7rem;
             border-radius: 1rem;
             cursor: pointer;
-            background-color: rgba(0, 0, 0, 0.5);
+            background-color: rgb(0 0 0 / 50%);
+
             &--play {
                 filter: invert(1);
             }
+
             @include mobile {
                 height: 6rem;
                 width: 8rem;
             }
         }
+
         &--disabled {
             pointer-events: none;
         }
@@ -150,6 +176,7 @@
         &__nosearch {
             @extend .no-search;
         }
+
         &__content {
             width: 85%;
 
@@ -157,26 +184,33 @@
                 width: 100%;
             }
         }
+
         .dc-accordion {
             &__item {
                 border: unset;
                 border-bottom: 0.1rem solid var(--general-section-1);
+
                 &:last-child {
                     margin-bottom: 2rem;
                 }
+
                 &-header {
                     @include flex-center(space-between);
                 }
+
                 &-content {
                     .loss-control {
                         width: 80%;
+
                         @include mobile {
                             width: 100%;
                         }
                     }
+
                     img {
                         width: 45%;
                     }
+
                     @include mobile {
                         width: 100%;
 
@@ -187,6 +221,7 @@
                 }
             }
         }
+
         &__header {
             margin: 0 0 1rem 0.5rem;
         }
@@ -195,6 +230,7 @@
 
 .tour-dialog {
     transition: unset;
+
     .dc-dialog__dialog {
         transform: unset;
         opacity: unset;
@@ -204,6 +240,7 @@
             width: 90vw;
             padding: 1.6rem;
         }
+
         @include tablet {
             width: 90vw;
             padding: 1.6rem;
@@ -245,12 +282,14 @@
 .tutorials-wrapper {
     width: 100%;
     background: var(--general-main-1);
+
     .dc-tabs {
         &__wrapper {
             padding: 1.6rem 0.8rem;
 
             &__group {
                 @include flex-center;
+
                 width: 22.5rem;
                 position: relative;
                 padding: 1.6rem 0.8rem;
@@ -262,6 +301,7 @@
                     inset-inline-start: 1.8rem;
                     z-index: 1;
                 }
+
                 .close-icon {
                     cursor: pointer;
                     position: absolute;
@@ -304,6 +344,7 @@
                         height: unset;
                     }
                 }
+
                 &__content {
                     margin: -6.5rem 2.4rem;
                     width: 100%;
@@ -313,14 +354,18 @@
                     .tutorials-wrap {
                         margin-bottom: 3rem;
                     }
+
                     &--no-result {
                         @include flex-center(flex-start);
+
                         flex-direction: column;
                         height: 100vh;
                         margin: unset;
+
                         svg {
                             margin-bottom: 2.4rem;
                         }
+
                         &__title,
                         &__content {
                             margin-bottom: 0.8rem;
@@ -332,10 +377,12 @@
 
                 &--top {
                     display: flex;
+
                     @include mobile {
                         height: calc(100vh - 22rem);
                     }
                 }
+
                 &__list {
                     width: 22.5rem;
                     display: flex;
@@ -355,6 +402,7 @@
                         &:first-child {
                             margin-top: -7.2rem;
                         }
+
                         .tutorials-guide:nth-child(1),
                         .tutorials-faq:nth-child(2),
                         .tutorials-qs-guide:nth-child(3) {
@@ -369,10 +417,12 @@
 
                 &__item {
                     width: 100% !important;
+
                     &--top {
                         &:first-child {
                             margin-top: 7.5rem;
                         }
+
                         &:nth-last-child(2) {
                             display: none;
                         }
@@ -399,28 +449,35 @@
     padding: 1.6rem;
     overflow-x: hidden;
     overflow-y: auto;
+
     &__select {
         height: 4rem;
         margin-bottom: 1.5rem;
+
         @include flex-center;
+
         @include mobile {
             .dc-select-native {
                 position: relative;
                 margin-inline-end: 17px;
                 transition: all 0.3s;
             }
+
             &--show-search {
                 .dc-select-native {
                     width: 0;
                     margin: 0;
                     visibility: hidden;
                 }
+
                 .dc-tabs__wrapper__group__search-input {
                     width: 100%;
                 }
+
                 .arrow-left-bold {
                     display: block;
                 }
+
                 .close-icon {
                     display: block;
                     cursor: pointer;
@@ -428,6 +485,7 @@
                     inset-inline-end: 2.5rem;
                     z-index: 1;
                 }
+
                 .dc-select-native__display,
                 .dc-select-native__picker,
                 .search-icon {
@@ -440,10 +498,12 @@
                     width: 0;
                     display: none;
                 }
+
                 .arrow-left-bold,
                 .close-icon {
                     display: none;
                 }
+
                 .search-icon {
                     display: block;
                 }
@@ -458,6 +518,7 @@
         @include mobile {
             height: calc(var(--vh) - 280px);
             overflow: auto;
+
             .tutorials-wrap {
                 margin-bottom: 2rem;
             }
diff --git a/src/styles/index.scss b/src/styles/index.scss
index aad16bf7..a0534aa6 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -1,3 +1,4 @@
+@use 'components/shared/styles/themes' as *;
 @import 'https://fonts.googleapis.com/css?family=IBM+Plex+Sans:300,400,500,700&display=swap&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese';
 @import './icon';
 

From 9d274b7f8da444a4c4d96d7c2f9c55315c65e2aa Mon Sep 17 00:00:00 2001
From: shafin-deriv <shafin@regentmarkets.com>
Date: Thu, 25 Jul 2024 11:35:06 +0800
Subject: [PATCH 2/4] chore: change scss files to only import variables mixins
 when necessary

---
 .stylelintrc.cjs                              |   2 +
 src/components/shared/styles/_constants.scss  | 238 +++++++++++
 src/components/shared/styles/_devices.scss    |  64 +++
 src/components/shared/styles/_fonts.scss      |  71 ++++
 .../shared/styles/_google-fonts.scss          |   3 +
 src/components/shared/styles/_index.scss      |   5 +
 .../shared/styles/_inline-icons.scss          |  38 ++
 src/components/shared/styles/_mixins.scss     | 314 ++++++++++++++
 src/components/shared/styles/_reset.scss      | 147 +++++++
 src/components/shared/styles/_themes.scss     | 397 ++++++++++++++++++
 10 files changed, 1279 insertions(+)
 create mode 100644 src/components/shared/styles/_constants.scss
 create mode 100644 src/components/shared/styles/_devices.scss
 create mode 100644 src/components/shared/styles/_fonts.scss
 create mode 100644 src/components/shared/styles/_google-fonts.scss
 create mode 100644 src/components/shared/styles/_index.scss
 create mode 100644 src/components/shared/styles/_inline-icons.scss
 create mode 100644 src/components/shared/styles/_mixins.scss
 create mode 100644 src/components/shared/styles/_reset.scss
 create mode 100644 src/components/shared/styles/_themes.scss

diff --git a/.stylelintrc.cjs b/.stylelintrc.cjs
index 8401454f..32d19b3d 100644
--- a/.stylelintrc.cjs
+++ b/.stylelintrc.cjs
@@ -17,6 +17,7 @@ module.exports = {
         'no-invalid-double-slash-comments': true,
         'number-max-precision': 3,
         'no-descending-specificity': null,
+        'no-invalid-position-at-import-rule': null,
         'selector-pseudo-class-no-unknown': [
             true,
             {
@@ -35,6 +36,7 @@ module.exports = {
         'unit-allowed-list': ['fr', 'px', 'em', 'rem', '%', 'svh', 'vw', 'vh', 'deg', 'ms', 's', 'dpcm'],
         'value-keyword-case': 'lower',
         'scss/at-extend-no-missing-placeholder': null,
+        'scss/percent-placeholder-pattern': null,
         'custom-property-pattern': null,
     },
     extends: ['stylelint-config-standard-scss'],
diff --git a/src/components/shared/styles/_constants.scss b/src/components/shared/styles/_constants.scss
new file mode 100644
index 00000000..39e9277e
--- /dev/null
+++ b/src/components/shared/styles/_constants.scss
@@ -0,0 +1,238 @@
+/* ------------------------------------*
+ *  # Constants
+ *------------------------------------ */
+
+/* stylelint-disable color-no-hex */
+
+/* COLOR PALETTE */
+
+/* colors */
+$color-black: #0e0e0e;
+$color-black-1: #333;
+$color-black-3: #151717;
+$color-black-4: #1d1f20;
+$color-black-5: #242828;
+$color-black-6: #3e3e3e;
+$color-black-7: #000;
+$color-black-8: #323738;
+$color-black-9: #5c5c5c;
+$color-blue: #377cfc;
+$color-blue-1: #0dc2e7;
+$color-blue-2: #2a3052;
+$color-blue-3: #0796e0;
+$color-blue-4: #0677af;
+$color-blue-5: #dfeaff;
+$color-blue-6: #92b8ff;
+$color-blue-7: #182130;
+$color-blue-8: #e6f5ff;
+$color-brown: #664407;
+$color-green: #85acb0;
+$color-green-1: #4bb4b3;
+$color-green-2: #3d9494;
+$color-green-3: #00a79e;
+$color-green-4: #008079;
+$color-green-5: #4bb4b329;
+$color-green-6: #17eabd;
+$color-green-7: #e8fdf8;
+$color-green-8: #cedddf;
+$color-grey: #c2c2c2;
+$color-grey-1: #999;
+$color-grey-2: #f2f3f4;
+$color-grey-3: #eaeced;
+$color-grey-4: #e6e9e9;
+$color-grey-5: #d6dadb;
+$color-grey-6: #d6d6d6;
+$color-grey-7: #6e6e6e;
+$color-grey-8: #d7d7d7;
+$color_grey-9: #868686;
+$color-grey-10: #919191;
+$color-grey-11: #fafafa;
+$color-grey-12: #f5f7fa;
+$color-grey-13: #2e2e2e;
+$color-grey-14: #e2e5e7;
+$color-orange: #ff6444;
+$color-purple: #722fe4;
+$color-red: #ff444f;
+$color-red-1: #ec3f3f;
+$color-red-2: #cc2e3d;
+$color-red-3: #a32430;
+$color-red-4: #d33636;
+$color-red-5: #eb3e48;
+$color-red-6: #ec3f3f29;
+$color-red-7: #ffe1e3;
+$color-red-8: #661b20;
+$color-red-9: #b33037;
+$color-red-10: #ff444f;
+$color-red-11: #fce3e3;
+$color-violet: #4a3871;
+$color-white: #fff;
+$color-yellow: #ffad3a;
+$color-yellow-1: #b3760d;
+$color-yellow-2: #ffa912;
+$color-yellow-3: rgb(255 173 58 / 16%);
+
+/* status colors */
+$color-status-warning: rgb(255 173 58 / 16%);
+$color-status-information: rgb(55 124 252 / 16%);
+$color-status-announcement: rgb(75 180 179 / 16%);
+$color-status-error: rgb(236 63 63 / 16%);
+
+/* alpha colors */
+$alpha-color-black-1: transparentize($color-black-7, 0.28);
+$alpha-color-black-2: transparentize($color-black, 0.04);
+$alpha-color-black-3: transparentize($color-black-7, 0.92);
+$alpha-color-black-4: transparentize($color-black-7, 0.84);
+$alpha-color-black-5: transparentize($color-black-7, 0.16);
+$alpha-color-black-6: transparentize($color-black-7, 0.36);
+$alpha-color-black-7: transparentize($color-black, 0.5);
+$alpha-color-blue-1: transparentize($color-blue, 0.84);
+$alpha-color-blue-2: transparentize($color-blue-3, 0.84);
+$alpha-color-blue-3: transparentize($color-blue, 0.92);
+$alpha-color-white-1: transparentize($color-white, 0.04);
+$alpha-color-white-2: transparentize($color-white, 0.84);
+$alpha-color-white-3: transparentize($color-white, 0.92);
+$alpha-color-white-4: transparentize($color-white, 0.3);
+$alpha-color-red-1: transparentize($color-red, 0.92);
+$alpha-color-red-2: transparentize($color-red, 0.84);
+$alpha-color-red-3: transparentize($color-red, 0.76);
+$alpha-color-green-1: transparentize($color-green-1, 0.08);
+$alpha-color-green-2: transparentize($color-green-3, 0.08);
+$alpha-color-yellow-1: transparentize($color-yellow, 0.84);
+
+/* gradient colors */
+$gradient-color-green-1: linear-gradient(to top, $color-white, transparentize($color-green-1, 0.84));
+$gradient-color-green-2: linear-gradient(to top, $color-black, transparentize($color-green-3, 0.84));
+$gradient-color-red-1: linear-gradient(to top, $color-white, transparentize($color-red, 0.84));
+$gradient-color-red-2: linear-gradient(to top, $color-black, transparentize($color-red, 0.84));
+$contract-gradient-color-red-1: linear-gradient(to top, $color-white 85%, transparentize($color-red, 0.84));
+$contract-gradient-color-red-2: linear-gradient(to top, $color-black 85%, transparentize($color-red, 0.84));
+$gradient-color-white: linear-gradient(to right, transparentize($color-white, 1) -5%, $color-white 71%);
+$gradient-color-black: linear-gradient(to right, transparentize($color-black, 1) -5%, $color-black 71%);
+$gradient-color-purple: linear-gradient(274.73deg, #5a205d 3.82%, #7f3883 88.49%);
+$gradient-color-blue: linear-gradient(274.73deg, #1a205e 3.82%, #122d96 88.49%);
+$gradient-color-orange: linear-gradient(90deg, #eb001b 0%, #f79e1b 100%);
+$gradient-color-black-2: linear-gradient(274.73deg, #464750 3.82%, #0e0f11 88.49%);
+$gradient-color-orange-2: linear-gradient(90deg, #f89e32 0%, #f7931b 103.12%);
+$gradient-color-blue-2: linear-gradient(90deg, #3d83cf 0%, #2775ca 100%);
+$gradient-color-green-3: linear-gradient(90deg, #98cc53 0%, #8dc640 100%);
+$gradient-color-blue-3: linear-gradient(90deg, #1a77ac 0%, #0068a3 100%);
+$gradient-color-orange-3: linear-gradient(90deg, #ff7635 0%, #ff671f 100%);
+$gradient-color-orange-4: linear-gradient(90deg, #f36938 0%, #f25822 100%);
+$gradient-color-blue-4: linear-gradient(90deg, #1a8fff 0%, #0083ff 100%);
+$gradient-color-red-3: linear-gradient(90deg, #ff444f 0%, #211d1e 95.22%);
+$gradient-color-red-4: linear-gradient(90deg, #ff6444 0%, #ff444f 100%);
+$gradient-color-black-3: linear-gradient(58.51deg, #061828 28.06%, #1a3c60 93.51%);
+$gradient-color-black-4: linear-gradient(274.25deg, #333 9.01%, #5c5b5b 103.31%);
+$gradient-color-black-5: linear-gradient(180deg, rgb(0 0 0 / 0%) 50%, rgb(0 0 0 / 16%) 100%);
+$gradient-color-white-2: linear-gradient(180deg, rgb(255 255 255 / 0%) 50%, rgb(255 255 255 / 16%) 100%);
+$gradient-color-blue-5: linear-gradient(90deg, #00a8af 0%, #04cfd8 104.41%);
+$gradient-color-gold: linear-gradient(90deg, #f7931a 0%, #ffc71b 104.41%);
+$gradient-color-green-4: linear-gradient(90deg, #1db193 0%, #09da7a 104.41%);
+
+/* Preserve legacy variables */
+
+/* Primary */
+
+$COLOR_BLACK: #000;
+$COLOR_BLACK_2: #1d1f20;
+$COLOR_BLACK_3: #0e0e0e;
+$COLOR_GREEN_1: #39b19d;
+$COLOR_GREEN_2: #2d9f93;
+$COLOR_GREEN_3: #21ce99;
+$COLOR_GREEN_4: #00a79e;
+$COLOR_GREEN_5: #4bb4b3;
+$COLOR_ORANGE: #f93;
+$COLOR_DARK_ORANGE: #ff8802;
+$COLOR_PURPLE: #4f60ae;
+$COLOR_RED: #e31c4b;
+$COLOR_RED_2: #cc2e3d;
+$COLOR_RED_3: #ec3f3f;
+$COLOR_CORAL_RED: #ff444f;
+$COLOR_SKY_BLUE: #2196f3;
+$COLOR_WHITE: #fff;
+$COLOR_BLUE: #1c5ae3;
+
+// Light theme
+$COLOR_LIGHT_BLACK_1: rgb(0 0 0 / 80%);
+$COLOR_LIGHT_BLACK_2: rgb(0 0 0 / 40%);
+$COLOR_LIGHT_BLACK_3: rgb(0 0 0 / 16%);
+$COLOR_LIGHT_BLACK_3_SOLID_1: #d6d6d6;
+$COLOR_LIGHT_BLACK_3_SOLID_2: #b3b3b3;
+$COLOR_LIGHT_BLACK_4: rgb(0 0 0 / 4%);
+$COLOR_LIGHT_BLACK_4_SOLID: #f4f4f6;
+$COLOR_LIGHT_GRAY_1: #999cac;
+$COLOR_LIGHT_GRAY_2: rgb(153 156 172 / 32%);
+$COLOR_LIGHT_GRAY_3: #eaeced;
+$COLOR_LIGHT_GRAY_4: #6e6e6e;
+$COLOR_LIGHT_GRAY_5: #c2c2c2;
+$COLOR_LIGHT_GRAY_6: #f2f3f4;
+$COLOR_LIGHT_GREEN_GRADIENT: linear-gradient(to top, rgb(255 255 255 / 0%), rgb(0 148 117 / 16%));
+$COLOR_LIGHT_RED_GRADIENT: linear-gradient(to top, rgb(255 255 255 / 0%), rgb(227 28 75 / 16%));
+$COLOR_LIGHT_WHITE_GRADIENT: linear-gradient(to right, rgb(255 255 255 / 100%), rgb(255 255 255 / 0%));
+
+// Dark theme
+$COLOR_DARK_BLACK_GRADIENT: linear-gradient(to right, rgb(16 19 32 / 100%), rgb(16 19 32 / 0%));
+$COLOR_DARK_BLUE_1: #0b0e18;
+$COLOR_DARK_BLUE_2: #101320;
+$COLOR_DARK_BLUE_3: #191c31;
+$COLOR_DARK_BLUE_4: #202641;
+$COLOR_DARK_BLUE_5: #2a3052;
+$COLOR_DARK_BLUE_6: #555975;
+$COLOR_DARK_BLUE_7: #7f8397;
+$COLOR_DARK_BLUE_8: rgb(127 131 151 / 30%);
+$COLOR_DARK_GREEN_GRADIENT: linear-gradient(to top, rgb(16 19 32 / 0%), rgb(0 148 117 / 16%));
+$COLOR_DARK_RED_GRADIENT: linear-gradient(to top, rgb(16 19 32 / 0%), rgb(227 28 75 / 16%));
+$COLOR_DARK_GRAY_1: #282a37;
+$COLOR_DARK_GRAY_2: #303342;
+$COLOR_DARK_GRAY_3: #555975;
+$COLOR_DARK_GRAY_4: #999;
+/* stylelint-enable color-no-hex */
+
+$BORDER_RADIUS: 4px;
+$BORDER_RADIUS_2: 8px;
+$MAX_CONTAINER_WIDTH: 1440px;
+$POSITIONS_DRAWER_WIDTH: 240px;
+$POSITIONS_DRAWER_MARGIN: 8px;
+$HEADER_HEIGHT: 48px;
+$FOOTER_HEIGHT: 36px;
+$MOBILE_HEADER_HEIGHT: 40px;
+$MOBILE_HEADER_HEIGHT_DASHBOARD: 48px;
+$MOBILE_WRAPPER_HEADER_HEIGHT: 40px;
+$MOBILE_WRAPPER_FOOTER_HEIGHT: 70px;
+$SIDEBAR_WIDTH: 240px;
+
+/* Wallet gradient background */
+$gradient-airtm: linear-gradient(90deg, #1a8fff 0%, #0083ff 100%);
+$gradient-banxa: linear-gradient(90deg, #000 0%, #4ac0ba 96.35%);
+$gradient-bitcoin: linear-gradient(90deg, #f89e32 0%, #f7931b 103.12%);
+$gradient-credit: linear-gradient(274.73deg, #464750 3.82%, #0e0f11 88.49%);
+$gradient-dp2p: linear-gradient(90deg, #ff444f 0%, #211d1e 95.22%);
+$gradient-fasapay: linear-gradient(90deg, #f6931c 0%, #4873ac 95.22%);
+$gradient-jeton: linear-gradient(90deg, #ff7635 0%, #ff671f 100%);
+$gradient-mastercard: linear-gradient(90deg, #eb001b 0%, #f79e1b 100%);
+$gradient-neteller: linear-gradient(90deg, #98cc53 0%, #8dc640 100%);
+$gradient-paylivre: linear-gradient(90deg, #352caa 0%, #9a6bfc 100%);
+$gradient-paysafe: linear-gradient(90deg, #e3001b 0%, #008ac9 100%);
+$gradient-perfectmoney: linear-gradient(90deg, #f12c2c 0%, #ef1515 100%);
+$gradient-skrill: linear-gradient(274.73deg, #5a205d 3.82%, #7f3883 88.49%);
+$gradient-sticpay: linear-gradient(90deg, #f36938 0%, #f25822 100%);
+$gradient-virtual: linear-gradient(90deg, #ff6444 0%, #ff444f 100%);
+$gradient-visa: linear-gradient(274.73deg, #1a205e 3.82%, #122d96 88.49%);
+$gradient-webmoney: linear-gradient(90deg, #1a77ac 0%, #0068a3 100%);
+
+/* App Cards gradient background */
+$gradient-virtual: linear-gradient(274.25deg, #333 9.01%, #5c5b5b 103.31%);
+$gradient-virtual-swap-free: linear-gradient(58.51deg, #061828 28.06%, #1a3c60 93.51%);
+
+/* Wallets */
+$ready-banner-bg-color: #e2f3f3;
+$ready-banner-tick-bg-color: #4ab4b3;
+$wallet-demo-bg-color: #fff8f9;
+$wallet-dark-demo-bg-color: #140506;
+$wallet-demo-divider-color: #fff0f1;
+$wallet-box-shadow:
+    0 12px 16px -4px rgb(14 14 14 / 8%),
+    0 4px 6px -2px rgb(14 14 14 / 3%);
+$btn-shadow:
+    0 24px 24px 0 rgb(0 0 0 / 8%),
+    0 0 24px 0 rgb(0 0 0 / 8%);
diff --git a/src/components/shared/styles/_devices.scss b/src/components/shared/styles/_devices.scss
new file mode 100644
index 00000000..15f4f87d
--- /dev/null
+++ b/src/components/shared/styles/_devices.scss
@@ -0,0 +1,64 @@
+/**
+ * Define Breakpoints here.
+ */
+$mobile-width: 320px;
+$tablet-width: 768px;
+$desktop-width: 1024px;
+$min-desktop-width: 1280px;
+$max-mobile-width: 767px;
+
+@mixin tablet {
+    @media (min-width: #{$tablet-width}) and (max-width: #{$desktop-width - 1px}) {
+        @content;
+    }
+}
+
+@mixin desktop {
+    @media (min-width: #{$desktop-width}) {
+        @content;
+    }
+}
+
+@mixin tablet-down {
+    @media (max-width: #{$tablet-width}) {
+        @content;
+    }
+}
+
+@mixin tablet-up {
+    @media (min-width: #{$tablet-width}) {
+        @content;
+    }
+}
+
+@mixin mobile-up {
+    @media (min-width: #{$mobile-width}) {
+        @content;
+    }
+}
+
+@mixin mobile {
+    @media (min-width: #{$mobile-width}) and (max-width: #{$tablet-width - 1}) {
+        @content;
+    }
+}
+
+@mixin mobile-landscape {
+    @media only screen and (min-width: #{$mobile-width}) and (max-width: #{$desktop-width - 1}) and (orientation: landscape) {
+        @content;
+    }
+}
+
+@mixin touch-device {
+    // add css interaction media query to detect touch devices
+    // refer to: https://caniuse.com/#feat=css-media-interaction
+    @media (pointer: coarse) {
+        @content;
+    }
+}
+
+@mixin mobile-tablet-mix {
+    @media (min-width: #{$mobile-width}) and (max-width: #{$desktop-width - 1px}) {
+        @content;
+    }
+}
diff --git a/src/components/shared/styles/_fonts.scss b/src/components/shared/styles/_fonts.scss
new file mode 100644
index 00000000..72037662
--- /dev/null
+++ b/src/components/shared/styles/_fonts.scss
@@ -0,0 +1,71 @@
+/*
+    Constants
+*/
+$FONT_STACK: 'IBM Plex Sans', sans-serif;
+$BASE_FONT_SIZE: 10px;
+
+/*
+    Variables
+*/
+$FONT_SIZES: (
+    'xheading' 3.2rem,
+    'heading' 3rem,
+    'large' 2.8rem,
+    'title' 1.6rem,
+    'paragraph' 1.4rem,
+    'small' 1.2rem,
+    'xsmall' 1rem,
+    'xxsmall' 0.8rem,
+    'xxxsmall' 0.6rem
+);
+$FONT_COLORS: (
+    'active' var(--text-colored-background),
+    'prominent' var(--text-prominent),
+    'black' var(--text-general),
+    'grey' var(--text-less-prominent),
+    'disabled' var(--text-disabled),
+    'green' var(--text-profit-success),
+    'red' var(--text-loss-danger)
+);
+$FONT_WEIGHTS: ('bold' 700, 'semibold' 500, 'normal' 400, 'light' 300);
+$TEXT_ALIGN: ('center' center, 'left' start, 'right' end);
+$LINEHEIGHTS: (
+    'large': 1.75,
+    'medium': 1.5,
+    'small': 1.25,
+    'xsmall': 1.4,
+);
+
+/*
+ * Generate typefaces key-value pair of variable name and config
+ * Example:
+   --paragraph-center-bold-black: (14px, center, bold, black)
+ */
+@function generate-typefaces() {
+    $typeface_list: ();
+
+    @each $fontsize_name, $size in $FONT_SIZES {
+        @each $textalign_name, $text_align in $TEXT_ALIGN {
+            @each $color_name, $color in $FONT_COLORS {
+                @each $fontweight_name, $weight in $FONT_WEIGHTS {
+                    $key: --#{$fontsize_name}-#{$textalign_name}-#{$fontweight_name}-#{$color_name};
+                    $val: ($size, $text_align, $weight, $color);
+                    $typeface: (
+                        $key: $val,
+                    );
+                    $typeface_list: map-merge($typeface_list, $typeface);
+                }
+            }
+        }
+    }
+
+    // @debug $typeface_list; /* uncomment to debug */
+    @return $typeface_list;
+}
+
+/*
+    List of all typefaces variables in the format: --$FONT_SIZES-$TEXT_ALIGN-$FONT_WEIGHTS-COLORS.
+    See $FONT_SIZES, $TEXT_ALIGN, $FONT_WEIGHTS, $COLORS maps above for references.
+    Variables name example: --title-center-semibold-red
+ */
+$TYPEFACES_LIST: generate-typefaces();
diff --git a/src/components/shared/styles/_google-fonts.scss b/src/components/shared/styles/_google-fonts.scss
new file mode 100644
index 00000000..ae155222
--- /dev/null
+++ b/src/components/shared/styles/_google-fonts.scss
@@ -0,0 +1,3 @@
+@at-root {
+    @import 'https://fonts.googleapis.com/css?family=IBM+Plex+Sans:300,400,500,700&display=swap&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese';
+}
diff --git a/src/components/shared/styles/_index.scss b/src/components/shared/styles/_index.scss
new file mode 100644
index 00000000..70af3823
--- /dev/null
+++ b/src/components/shared/styles/_index.scss
@@ -0,0 +1,5 @@
+// @import './constants';
+// @forward './mixins';
+// @forward './fonts';
+// @forward './inline-icons';
+// @forward './devices';
diff --git a/src/components/shared/styles/_inline-icons.scss b/src/components/shared/styles/_inline-icons.scss
new file mode 100644
index 00000000..b5e762b2
--- /dev/null
+++ b/src/components/shared/styles/_inline-icons.scss
@@ -0,0 +1,38 @@
+/*
+    to use styles without modifier class on .inline-icon
+    use @extend
+
+    e.g. style icon on parent hover:
+        a:hover .inline-icon {
+            @extend %inline-icon-active;
+        }
+*/
+
+%inline-icon {
+    @include colorIcon(var(--text-general), none);
+
+    &.active,
+    &-active {
+        @include colorIcon(var(--text-prominent), none);
+    }
+
+    &.disabled,
+    &-disabled {
+        @include colorIcon(var(--text-disabled), none);
+    }
+
+    &.white,
+    &-white {
+        @include colorIcon(var(--text-prominent));
+    }
+
+    &.border_hover_color,
+    &-border_hover_color {
+        @include colorIcon(var(--text-prominent));
+    }
+
+    &.secondary,
+    &-secondary {
+        @include colorIcon(var(--text-less-prominent));
+    }
+}
diff --git a/src/components/shared/styles/_mixins.scss b/src/components/shared/styles/_mixins.scss
new file mode 100644
index 00000000..89d8646c
--- /dev/null
+++ b/src/components/shared/styles/_mixins.scss
@@ -0,0 +1,314 @@
+@import './devices';
+@import './fonts';
+
+/* ------------------------------------*
+ *  # SASS Mixins and Functions
+ *------------------------------------ */
+
+/*
+ * SASS interpolation
+ */
+// Requires the calc-interpolation function which can also be used independently
+@function calc-interpolation($min-screen, $min-value, $max-screen, $max-value) {
+    $a: ($max-value - $min-value) / ($max-screen - $min-screen);
+    $b: $min-value - $a * $min-screen;
+    $sign: '+';
+
+    @if $b < 0 {
+        $sign: '-';
+        $b: abs($b);
+    }
+
+    @return calc(#{$a * 100}vw #{$sign} #{$b});
+}
+
+@mixin interpolate($properties, $min-screen, $max-screen, $min-value, $max-value) {
+    & {
+        @each $property in $properties {
+            #{$property}: $min-value;
+        }
+
+        @media screen and (min-width: $min-screen) {
+            @each $property in $properties {
+                #{$property}: calc-interpolation($min-screen, $min-value, $max-screen, $max-value);
+            }
+        }
+
+        @media screen and (min-width: $max-screen) {
+            @each $property in $properties {
+                #{$property}: $max-value;
+            }
+        }
+    }
+}
+
+/*
+ * PX to EM
+ * @param $px - px value to be converted
+ * @param $base - base font size (in `em`)
+ * Note: 'em' values are calculate based on the element font-size
+ *       to properly converts 'px' to 'em', please pass in the element font-size with it
+ * Usage example:
+    padding: em(16px, 1.6em); // font-size in 'em'
+ */
+@function em($px, $base: $BASE_FONT_SIZE) {
+    $list: ();
+
+    @if length($px) != 1 {
+        @for $i from 1 through length($px) {
+            $val_em: (nth($px, $i) / $base) * 1em;
+            $list: append($list, $val_em, space);
+        }
+
+        @return $list;
+    } @else {
+        @return ($px / $base) * 1em;
+    }
+}
+
+/*
+ * Set property by passing a property name, and values.
+ * @param $property name - padding, margin etc.
+ * @param $values        - values in `px` (space separated for multiple values)
+ * @param $font-size     - base font-size in `em`
+ * Usage example:
+   @include toEm(padding, 8px 16px 8px, 1.6em);
+ */
+@mixin toEm($property, $values, $font-size: $BASE_FONT_SIZE) {
+    #{$property}: em($values, $font-size);
+}
+
+/*
+ * Generate typefaces key-value pair of variable name and config
+ * Example:
+   --paragraph-center-bold-black: (14px, center, bold, black)
+ */
+@function generate-typefaces() {
+    $typeface_list: ();
+
+    @each $fontsize_name, $size in $FONT_SIZES {
+        @each $textalign_name, $text_align in $TEXT_ALIGN {
+            @each $color_name, $color in $FONT_COLORS {
+                @each $fontweight_name, $weight in $FONT_WEIGHTS {
+                    $key: --#{$fontsize_name}-#{$textalign_name}-#{$fontweight_name}-#{$color_name};
+                    $val: ($size, $text_align, $weight, $color);
+                    $typeface: (
+                        $key: $val,
+                    );
+                    $typeface_list: map-merge($typeface_list, $typeface);
+                }
+            }
+        }
+    }
+
+    // @debug $typeface_list; /* uncomment to debug */
+    @return $typeface_list;
+}
+
+/*
+ * Sets font-size, font-weight, color, text-transform, text-align and line-height
+ * Usage example:
+   @include setTypeface(16px, bold, black, uppercase);
+ */
+@mixin setTypeface($size, $align, $weight, $colour, $tt) {
+    @if $size {
+        font-size: $size;
+    }
+
+    @if $colour {
+        color: $colour;
+    }
+
+    @if $weight {
+        font-weight: $weight;
+    }
+
+    @if $tt {
+        text-transform: $tt;
+    }
+
+    @if $align {
+        text-align: $align;
+    }
+
+    @if $size == 1.6rem {
+        line-height: map-get($map: $LINEHEIGHTS, $key: 'large');
+    } @else if $size == 1.4rem {
+        line-height: map-get($map: $LINEHEIGHTS, $key: 'medium');
+    } @else if $size == 1.2rem {
+        line-height: map-get($map: $LINEHEIGHTS, $key: 'small');
+    } @else if $size == 1rem {
+        line-height: map-get($map: $LINEHEIGHTS, $key: 'xsmall');
+    } @else {
+        line-height: unset;
+    }
+}
+
+/*
+ * Set typefaces by passing a typeface variable name
+ * @param $var   - typeface variable
+ * @param $tt    - text-transform property
+ * @param $align - text-align property
+ * Usage example:
+   @include typeface(--paragraph-bold-black, uppercase, center);
+ */
+@mixin typeface($var, $tt: none) {
+    $typeface_config: map-get(
+        $map: $TYPEFACES_LIST,
+        $key: $var,
+    );
+    $size: nth($typeface_config, 1); // font-size
+    $align: nth($typeface_config, 2); // text-align
+    $weight: nth($typeface_config, 3); // font-weight
+    $color: nth($typeface_config, 4); // color
+
+    @include setTypeface($size, $align, $weight, $color, $tt);
+}
+
+/*
+ * Range Slider Thumb styling is set here
+ */
+@mixin thumbStyle() {
+    appearance: none;
+    width: 1em;
+    height: 1em;
+    border-radius: 100%;
+    border: 0;
+    cursor: pointer;
+    transition: box-shadow 0.2s;
+    box-shadow: 0 0 0 0 rgb(0 0 0 / 0%);
+
+    &:hover {
+        box-shadow: 0 0 0 0.5em var(--state-hover);
+    }
+}
+
+/*
+ * SVG icons colors
+ */
+@mixin colorIcon($colors...) {
+    @for $i from 1 through length($colors) {
+        /* postcss-bem-linter: ignore */
+        .color#{$i}-fill {
+            fill: nth($colors, $i);
+        }
+
+        /* postcss-bem-linter: ignore */
+        .color#{$i}-stroke {
+            stroke: nth($colors, $i);
+        }
+    }
+}
+
+/*
+ * Bar Spinner Animation
+ * @param $count    - number of bars
+ * @param $duration - duration of animation
+ * @param $phase    - each bar phase change delay
+ * Usage example:
+   @include createBarspinnerAnimation(5, 1.2s, 0,1);
+ */
+@mixin createBarspinnerAnimation($count, $duration, $phase) {
+    animation: sk-stretchdelay $duration infinite ease-in-out;
+
+    @for $i from 1 through $count {
+        &--#{$i} {
+            animation-delay: -$duration + (($i - 1) * $phase);
+        }
+    }
+}
+
+/*
+ * Tooltip colors
+ * @param $color - color property
+ * Usage example:
+   @include tooltipColor($COLOR_RED);
+ */
+@mixin tooltipColor($color) {
+    &:before {
+        background: $color;
+    }
+
+    &:after,
+    &[data-tooltip-pos='top']:after {
+        border-top-color: $color;
+    }
+
+    &[data-tooltip-pos='right']:after {
+        border-top-color: transparent;
+        border-right-color: $color;
+    }
+
+    &[data-tooltip-pos='left']:after {
+        border-top-color: transparent;
+        border-left-color: $color;
+    }
+
+    &[data-tooltip-pos='bottom']:after {
+        border-top-color: transparent;
+        border-bottom-color: $color;
+    }
+}
+
+/*
+ * Convert Tooltip colors
+ * @param $color - css color property
+ * Usage example:
+   @include convertTooltipColor(var(--status-default));
+ */
+@mixin convertTooltipColor($color) {
+    &:before {
+        background: $color;
+    }
+
+    &:after,
+    &[data-tooltip-pos='top']:after {
+        border-top-color: $color;
+    }
+
+    &[data-tooltip-pos='right']:after {
+        border-top-color: transparent;
+        border-right-color: $color;
+    }
+
+    &[data-tooltip-pos='left']:after {
+        border-top-color: transparent;
+        border-left-color: $color;
+    }
+
+    &[data-tooltip-pos='bottom']:after {
+        border-top-color: transparent;
+        border-bottom-color: $color;
+    }
+}
+
+@mixin flex-center($justify-content: center, $align-items: center) {
+    display: flex;
+    align-items: $align-items;
+    justify-content: $justify-content;
+    @content;
+}
+
+/*
+ * Check if the page is in RTL mode
+ * Usage example:
+   @include is-RTL { left: 0 };
+ */
+@mixin is-RTL() {
+    html[dir='rtl'] & {
+        @content;
+    }
+}
+
+/* RTL Language Mixin */
+@mixin rtl {
+    [dir='rtl'] & {
+        @content;
+    }
+}
+
+@mixin mobile-or-tablet-screen {
+    @media (max-width: #{$min-desktop-width - 1}) {
+        @content;
+    }
+}
diff --git a/src/components/shared/styles/_reset.scss b/src/components/shared/styles/_reset.scss
new file mode 100644
index 00000000..88f5cd37
--- /dev/null
+++ b/src/components/shared/styles/_reset.scss
@@ -0,0 +1,147 @@
+/* ------------------------------------*
+ *  # Reset SCSS
+ *  - to make browsers render all elements more consistently
+ *  - Reference:  https://github.com/AdamMarsden/simple-typography/blob/master/_reset.scss
+ *------------------------------------ */
+
+/* stylelint-disable */
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+input,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font: inherit;
+    vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+    display: block;
+}
+
+html {
+    height: 100%;
+    font-size: 10px;
+}
+
+body {
+    line-height: 1;
+    height: 100%;
+}
+
+ol,
+ul {
+    list-style: none;
+}
+
+blockquote,
+q {
+    quotes: none;
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+    content: '';
+    content: none;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+strong {
+    font-weight: bold;
+}
+/* stylelint-enable */
diff --git a/src/components/shared/styles/_themes.scss b/src/components/shared/styles/_themes.scss
new file mode 100644
index 00000000..46e41e89
--- /dev/null
+++ b/src/components/shared/styles/_themes.scss
@@ -0,0 +1,397 @@
+@import './constants';
+
+:host,
+:root {
+    // Text sizes
+    --text-size-xxxxs: 0.8rem;
+    --text-size-xxxs: 1rem;
+    --text-size-xxs: 1.2rem;
+    --text-size-xs: 1.4rem;
+    --text-size-s: 1.6rem;
+    --text-size-xsm: 1.8rem;
+    --text-size-sm: 2rem;
+    --text-size-m: 2.4rem;
+    --text-size-l: 3.2rem;
+    --text-size-xl: 4.8rem;
+    --text-size-xxl: 6.4rem;
+
+    // Line Height
+    --text-lh-xxs: 1;
+    --text-lh-xs: 1.25;
+    --text-lh-s: 1.4;
+    --text-lh-m: 1.5;
+    --text-lh-l: 1.75;
+    --text-lh-xl: 2;
+    --text-lh-xxl: 2.4;
+
+    // Font Weight
+    --text-weight-lighter: lighter;
+    --text-weight-normal: normal;
+    --text-weight-bold: bold;
+    --text-weight-bolder: bolder;
+
+    // Text Align
+    --text-align-left: start;
+    --text-align-right: right;
+    --text-align-center: center;
+
+    // Brand primary colors
+    --brand-white: #{$color-white};
+    --brand-dark-grey: #{$color-black};
+    --brand-red-coral: #{$color-red};
+    --brand-orange: #{$color-orange};
+
+    // Brand secondary colors
+    --brand-secondary: #{$color-green};
+
+    // Wallet gradient background
+    --wallet-airtm: #{$gradient-airtm};
+    --wallet-banxa: #{$gradient-banxa};
+    --wallet-bitcoin: #{$gradient-bitcoin};
+    --wallet-credit: #{$gradient-credit};
+    --wallet-dp2p: #{$gradient-dp2p};
+    --wallet-fasapay: #{$gradient-fasapay};
+    --wallet-jeton: #{$gradient-jeton};
+    --wallet-mastercard: #{$gradient-mastercard};
+    --wallet-neteller: #{$gradient-neteller};
+    --wallet-paylivre: #{$gradient-paylivre};
+    --wallet-paysafe: #{$gradient-paysafe};
+    --wallet-perfectmoney: #{gradient-perfectmoney};
+    --wallet-skrill: #{$gradient-skrill};
+    --wallet-sticpay: #{$gradient-sticpay};
+    --wallet-virtual: #{$gradient-virtual};
+    --wallet-visa: #{$gradient-visa};
+    --wallet-webmoney: #{$gradient-webmoney};
+
+    // App Cards gradient background
+    --app-card-virtual: #{$gradient-virtual};
+    --app-card-virtual-swap-free: #{$gradient-virtual-swap-free};
+
+    .theme--light {
+        // General
+        --general-main-1: #{$color-white};
+        --general-main-2: #{$color-white};
+        --general-main-3: #{$color-grey-1};
+        --general-main-4: #{$alpha-color-white-4};
+        --general-section-1: #{$color-grey-2};
+        --general-section-2: #{$color-grey-2};
+        --general-section-3: #{$color-grey-11};
+        --general-section-4: #{$color-grey-12};
+        --general-section-5: #{$color-grey-2};
+        --general-section-6: #{$color-grey-2};
+        --general-disabled: #{$color-grey-3};
+        --general-hover: #{$color-grey-4};
+        --general-active: #{$color-grey-5};
+
+        // Icons and Texts
+        --text-general: #{$color-black-1};
+        --text-primary: #{$color-grey-1};
+        --text-less-prominent: #{$color-grey-1};
+        --text-prominent: #{$color-black-1};
+        --text-disabled: #{$color-grey-1};
+        --text-disabled-1: #{$color-grey-6};
+        --text-loss-danger: #{$color-red-1};
+        --text-profit-success: #{$color-green-1};
+        --text-warning: #{$color-yellow};
+        --text-red: #{$color-red};
+        --text-green: #{$color-green-6};
+        --text-blue: #{$color-blue-3};
+        --text-info-blue: #{$color-blue};
+        --text-info-blue-background: #{$color-blue-5};
+        --text-colored-background: #{$color-white};
+        --icon-light-background: #{$color-black-9};
+        --icon-dark-background: #{$color-white};
+        --icon-grey-background: #{$color-grey-2};
+        --icon-black-plus: #{$color-black-7};
+        --text-status-info-blue: #{$color-blue};
+        --text-hint: #{$color-black-1};
+
+        // Purchase
+        --purchase-main-1: #{$color-green-1};
+        --purchase-section-1: #{$color-green-2};
+        --purchase-main-2: #{$color-red-1};
+        --purchase-section-2: #{$color-red-4};
+        --purchase-disabled-main: #{$color-grey-3};
+        --purchase-disabled-section: #{$color-grey-4};
+
+        // Buttons
+        --button-primary-default: var(--brand-red-coral);
+        --button-secondary-default: #{$color-grey-1};
+        --button-tertiary-default: transparent;
+        --button-primary-light-default: #{$alpha-color-red-2};
+        --button-primary-hover: #{$color-red-5};
+        --button-secondary-hover: #{$alpha-color-black-3};
+        --button-tertiary-hover: #{$alpha-color-red-1};
+        --button-primary-light-hover: #{$alpha-color-red-3};
+        --button-toggle-primary: #{$color-blue-3};
+        --button-toggle-secondary: #{$color-grey-5};
+        --button-toggle-alternate: #{$color-white};
+
+        // Overlay
+        --overlay-outside-dialog: #{$alpha-color-black-1};
+        --overlay-inside-dialog: #{$alpha-color-white-1};
+
+        // Shadow
+        --shadow-menu: #{$alpha-color-black-4};
+        --shadow-menu-2: #{$alpha-color-black-4};
+        --shadow-drop: #{$alpha-color-black-3};
+        --shadow-box: #{$COLOR_LIGHT_BLACK_2};
+
+        // States
+        --state-normal: #{$color-white};
+        --state-hover: #{$color-grey-4};
+        --state-active: #{$color-grey-5};
+        --state-disabled: #{$color-grey-3};
+        --checkbox-disabled-grey: #{$color-grey-6};
+        --sidebar-tab: #{$color-grey-6};
+
+        // Border
+        --border-normal: #{$color-grey-5};
+        --border-normal-1: #{$color-grey-5};
+        --border-normal-2: #{$color-grey-5};
+        --border-normal-3: #{$color-grey-6};
+        --border-hover: #{$color-grey-1};
+        --border-hover-1: #{$color-black-9};
+        --border-active: var(--brand-secondary);
+        --border-disabled: #{$color-grey-3};
+        --border-divider: #{$color-grey-2};
+
+        // Fill
+        --fill-normal: #{$color-white};
+        --fill-normal-1: #{$color-grey};
+        --fill-hover: #{$color-grey-1};
+        --fill-active: var(--brand-secondary);
+        --fill-disabled: #{$color-grey-3};
+
+        // Status
+        --status-default: #{$color-grey-3};
+        --status-adjustment: #{$color-grey-1};
+        --status-danger: #{$color-red-1};
+        --status-success: #{$color-green-1};
+        --status-warning: #{$color-yellow};
+        --status-warning-transparent: #{$alpha-color-yellow-1};
+        --status-transfer: #{$color-orange};
+        --status-info: #{$color-blue};
+        --status-colored-background: #{$color-white};
+        --status-alert-background: #{$color-yellow-3};
+
+        // Dashboard
+        --dashboard-swap-free: #{$gradient-color-black-3};
+        --dashboard-app: #{$gradient-color-black-4};
+
+        // Payment methods
+        --payment-skrill: #{$gradient-color-purple};
+        --payment-visa: #{$gradient-color-blue};
+        --payment-mastercard: #{$gradient-color-orange};
+        --payment-credit-and-debit: #{$gradient-color-black-2};
+        --payment-bitcoin: #{$gradient-color-orange-2};
+        --payment-usd-coin: #{$gradient-color-blue-2};
+        --payment-neteller: #{$gradient-color-green-3};
+        --payment-webmoney: #{$gradient-color-blue-3};
+        --payment-jeton: #{$gradient-color-orange-3};
+        --payment-sticpay: #{$gradient-color-orange-4};
+        --payment-airtm: #{$gradient-color-blue-4};
+        --payment-dp2p: #{$gradient-color-red-3};
+        --payment-deriv: #{$gradient-color-red-4};
+
+        // Transparentize
+        --transparent-success: #{$alpha-color-green-1};
+        --transparent-info: #{$alpha-color-blue-1};
+        --transparent-hint: #{$alpha-color-blue-3};
+        --transparent-danger: #{$alpha-color-red-2};
+        --transparent-correct-message: #{$color-green-5};
+        --transparent-fake-message: #{$color-red-6};
+
+        /* TODO: change to styleguide later */
+        // Gradient
+        --gradient-success: #{$gradient-color-green-1};
+        --gradient-danger: #{$gradient-color-red-1};
+        --contract-gradient-danger: #{$contract-gradient-color-red-1};
+        --gradient-right-edge: #{$gradient-color-white};
+        --gradient-blue: #{$gradient-color-blue-5};
+        --gradient-gold: #{$gradient-color-gold};
+        --gradient-green: #{$gradient-color-green-4};
+
+        // Badge
+        --badge-white: #{$color-white};
+        --badge-blue: #{$color-blue-4};
+        --badge-violet: #{$color-blue-2};
+        --badge-green: #{$color-green-3};
+
+        // TradersHub Banner
+        --traders-hub-banner-border-color: #{$color-grey-4};
+
+        // wallets
+        --wallets-banner-ready-bg-color: #{$ready-banner-bg-color};
+        --wallets-banner-ready-tick-bg-color: #{$ready-banner-tick-bg-color};
+        --wallets-banner-border-color: #{$color-grey-4};
+        --wallets-banner-dot-color: #{$color-grey-6};
+        --wallets-banner-active-dot-color: #{$color-red};
+        --wallets-card-active-gradient-background: #{$gradient-color-black-5};
+        --wallet-demo-bg-color: #{$wallet-demo-bg-color};
+        --wallet-demo-divider-color: #{$wallet-demo-divider-color};
+        --wallet-eu-disclaimer: #{$color-grey-4};
+        --wallet-box-shadow: #{$wallet-box-shadow};
+
+        // Demo view
+        --demo-text-color-1: #{$color-grey};
+        --demo-text-color-2: #{$color-white};
+
+        // Header
+        --header-background-mt5: #{$color-blue-8};
+        --header-background-others: #{$color-green-7};
+    }
+
+    .theme--dark {
+        // General
+        --general-main-1: #{$color-black};
+        --general-main-2: #{$color-black-3};
+        --general-main-3: #{$color-black-4};
+        --general-main-4: #{$alpha-color-black-7};
+        --general-section-1: #{$color-black-3};
+        --general-section-2: #{$color-black};
+        --general-section-3: #{$color-black-5};
+
+        // @TODO: get color from design
+        --general-section-4: #{$color-black-5};
+        --general-section-5: #{$color-black-5};
+        --general-section-6: #{$color-grey-7};
+        --general-disabled: #{$color-black-4};
+        --general-hover: #{$color-black-5};
+        --general-active: #{$color-black-8};
+
+        // Icons and Texts
+        --text-prominent: #{$color-white};
+        --text-general: #{$color-grey};
+        --text-less-prominent: #{$color-grey-7};
+        --text-primary: #{$color-grey-1};
+        --text-disabled: #{$color-black-6};
+        --text-disabled-1: #{$color-black-6};
+        --text-profit-success: #{$color-green-3};
+        --text-loss-danger: #{$color-red-2};
+        --text-red: #{$color-red};
+        --text-colored-background: #{$color-white};
+        --text-info-blue: #{$color-blue-6};
+        --text-info-blue-background: #{$color-blue-7};
+        --text-status-info-blue: #{$color-blue};
+        --text-hint: #{$color-grey};
+        --icon-light-background: #{$color-black-9};
+        --icon-dark-background: #{$color-white};
+        --icon-grey-background: #{$color-black-1};
+        --icon-black-plus: #{$color-white};
+
+        // Purchase
+        --purchase-main-1: #{$color-green-3};
+        --purchase-section-1: #{$color-green-4};
+        --purchase-main-2: #{$color-red-2};
+        --purchase-section-2: #{$color-red-3};
+        --purchase-disabled-main: #{$color-black-4};
+        --purchase-disabled-section: #{$color-black};
+        --button-primary-default: var(--brand-red-coral);
+        --button-secondary-default: #{$color-grey-7};
+        --button-tertiary-default: transparent;
+        --button-primary-light-default: #{$alpha-color-red-2};
+        --button-primary-hover: #{$color-red-5};
+        --button-secondary-hover: #{$alpha-color-white-3};
+        --button-tertiary-hover: #{$alpha-color-red-1};
+        --button-primary-light-hover: #{$alpha-color-red-3};
+        --button-toggle-primary: #{$color-blue-3};
+        --button-toggle-secondary: #{$color-black-8};
+        --button-toggle-alternate: #{$color-black-8};
+
+        // Overlay
+        --overlay-outside-dialog: #{$alpha-color-black-1};
+        --overlay-inside-dialog: #{$alpha-color-black-2};
+
+        // Shadow
+        --shadow-menu: #{$alpha-color-black-5};
+        --shadow-menu-2: #{$alpha-color-black-1};
+        --shadow-drop: #{$alpha-color-black-6};
+        --shadow-box: #{$COLOR_DARK_GRAY_3};
+
+        // States
+        --state-normal: #{$color-black};
+        --state-hover: #{$color-black-5};
+        --state-active: #{$color-black-8};
+        --state-disabled: #{$color-black-4};
+        --checkbox-disabled-grey: #{$color-grey-6};
+        --sidebar-tab: #{$color-grey-7};
+
+        // Border
+        --border-normal: #{$color-black-8};
+        --border-normal-1: #{$color-grey-5};
+        --border-normal-2: #{$color-grey-1};
+        --border-normal-3: #{$color-grey-7};
+        --border-hover: #{$color-grey-7};
+        --border-hover-1: #{$color-black-9};
+        --border-active: var(--brand-secondary);
+        --border-disabled: #{$color-black-4};
+        --border-divider: #{$color-grey-13};
+
+        // Fill
+        --fill-normal: #{$color-black};
+        --fill-normal-1: #{$color-black-1};
+        --fill-hover: #{$color-grey-7};
+        --fill-active: var(--brand-secondary);
+        --fill-disabled: #{$color-black-4};
+
+        // Status
+        --status-default: #{$color-grey-3};
+        --status-adjustment: #{$color-grey-1};
+        --status-danger: #{$color-red-2};
+        --status-warning: #{$color-yellow};
+        --status-warning-transparent: #{$alpha-color-yellow-1};
+        --status-success: #{$color-green-3};
+        --status-transfer: #{$color-orange};
+        --status-info: #{$color-blue};
+        --status-colored-background: #{$color-white};
+        --status-alert-background: #{$color-yellow-3};
+
+        // Transparentize
+        --transparent-success: #{$alpha-color-green-2};
+        --transparent-info: #{$alpha-color-blue-1};
+        --transparent-hint: #{$alpha-color-blue-1};
+        --transparent-danger: #{$alpha-color-red-2};
+        --transparent-correct-message: #{$color-green-5};
+        --transparent-fake-message: #{$color-red-6};
+
+        /* TODO: change to styleguide later */
+        // Gradient
+        --gradient-success: #{$gradient-color-green-2};
+        --gradient-danger: #{$gradient-color-red-2};
+        --contract-gradient-danger: #{$contract-gradient-color-red-2};
+        --gradient-right-edge: #{$gradient-color-black};
+        --gradient-blue: #{$gradient-color-blue-5};
+        --gradient-gold: #{$gradient-color-gold};
+        --gradient-green: #{$gradient-color-green-4};
+
+        // Badge
+        --badge-white: #{$color-white};
+        --badge-blue: #{$color-blue-4};
+        --badge-violet: #{$color-blue-2};
+        --badge-green: #{$color-green-3};
+
+        // TradersHub Banner
+        --traders-hub-banner-border-color: #{$color-black-5};
+
+        // wallets
+        --wallets-banner-ready-bg-color: #{$ready-banner-bg-color};
+        --wallets-banner-ready-tick-bg-color: #{$ready-banner-tick-bg-color};
+        --wallets-banner-border-color: #{$color-grey-4};
+        --wallets-banner-dot-color: #{$color-grey-6};
+        --wallets-banner-active-dot-color: #{$color-red};
+        --wallets-card-active-gradient-background: #{$gradient-color-white-2};
+        --wallet-demo-bg-color: #{$wallet-dark-demo-bg-color};
+        --wallet-demo-divider-color: #{$color-black-8};
+        --wallet-eu-disclaimer: #{$color-grey-4};
+        --wallet-box-shadow: #{$wallet-box-shadow};
+
+        // Demo view
+        --demo-text-color-1: #{$color-black-1};
+        --demo-text-color-2: #{$color-black-1};
+
+        // Header
+        --header-background-mt5: #{$color-blue-8};
+        --header-background-others: #{$color-green-7};
+    }
+}

From c7d98b3f0d1c9460f7c5ad05db4c73a13d046682 Mon Sep 17 00:00:00 2001
From: shafin-deriv <shafin@regentmarkets.com>
Date: Thu, 25 Jul 2024 11:36:50 +0800
Subject: [PATCH 3/4] chore: revert to old beta

---
 package.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index ad29cbdc..dace8451 100644
--- a/package.json
+++ b/package.json
@@ -83,9 +83,9 @@
         "@commitlint/config-conventional": "^17.1.0",
         "@deriv-com/eslint-config-deriv": "^2.1.0-beta.3",
         "@jest/globals": "^29.7.0",
-        "@rsbuild/core": "^1.0.1-beta.4",
-        "@rsbuild/plugin-react": "^1.0.1-beta.4",
-        "@rsbuild/plugin-sass": "^1.0.1-beta.4",
+        "@rsbuild/core": "^1.0.1-beta.1",
+        "@rsbuild/plugin-react": "^1.0.1-beta.1",
+        "@rsbuild/plugin-sass": "^1.0.1-beta.1",
         "@testing-library/dom": "^10.3.1",
         "@testing-library/jest-dom": "^6.4.6",
         "@testing-library/react": "^16.0.0",

From a89cbb16a71ccc773fbca353ca355413d0af4fc1 Mon Sep 17 00:00:00 2001
From: shafin-deriv <shafin@regentmarkets.com>
Date: Thu, 25 Jul 2024 11:39:11 +0800
Subject: [PATCH 4/4] chore: revert to old beta

---
 package-lock.json | 2282 +++++++++++++++++++++++++++++++--------------
 1 file changed, 1561 insertions(+), 721 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 919988a5..dc136522 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -74,9 +74,9 @@
                 "@commitlint/config-conventional": "^17.1.0",
                 "@deriv-com/eslint-config-deriv": "^2.1.0-beta.3",
                 "@jest/globals": "^29.7.0",
-                "@rsbuild/core": "^1.0.1-beta.4",
-                "@rsbuild/plugin-react": "^1.0.1-beta.4",
-                "@rsbuild/plugin-sass": "^1.0.1-beta.4",
+                "@rsbuild/core": "^1.0.1-beta.1",
+                "@rsbuild/plugin-react": "^1.0.1-beta.1",
+                "@rsbuild/plugin-sass": "^1.0.1-beta.1",
                 "@testing-library/dom": "^10.3.1",
                 "@testing-library/jest-dom": "^6.4.6",
                 "@testing-library/react": "^16.0.0",
@@ -163,28 +163,28 @@
             }
         },
         "node_modules/@babel/compat-data": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.24.7.tgz",
-            "integrity": "sha512-qJzAIcv03PyaWqxRgO4mSU3lihncDT296vnyuE2O8uA4w3UHWI4S3hgeZd1L8W1Bft40w9JxJ2b412iDUFFRhw==",
+            "version": "7.24.9",
+            "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.24.9.tgz",
+            "integrity": "sha512-e701mcfApCJqMMueQI0Fb68Amflj83+dvAvHawoBpAz+GDjCIyGHzNwnefjsWJ3xiYAqqiQFoWbspGYBdb2/ng==",
             "engines": {
                 "node": ">=6.9.0"
             }
         },
         "node_modules/@babel/core": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.7.tgz",
-            "integrity": "sha512-nykK+LEK86ahTkX/3TgauT0ikKoNCfKHEaZYTUVupJdTLzGNvrblu4u6fa7DhZONAltdf8e662t/abY8idrd/g==",
+            "version": "7.24.9",
+            "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.9.tgz",
+            "integrity": "sha512-5e3FI4Q3M3Pbr21+5xJwCv6ZT6KmGkI0vw3Tozy5ODAQFTIWe37iT8Cr7Ice2Ntb+M3iSKCEWMB1MBgKrW3whg==",
             "dependencies": {
                 "@ampproject/remapping": "^2.2.0",
                 "@babel/code-frame": "^7.24.7",
-                "@babel/generator": "^7.24.7",
-                "@babel/helper-compilation-targets": "^7.24.7",
-                "@babel/helper-module-transforms": "^7.24.7",
-                "@babel/helpers": "^7.24.7",
-                "@babel/parser": "^7.24.7",
+                "@babel/generator": "^7.24.9",
+                "@babel/helper-compilation-targets": "^7.24.8",
+                "@babel/helper-module-transforms": "^7.24.9",
+                "@babel/helpers": "^7.24.8",
+                "@babel/parser": "^7.24.8",
                 "@babel/template": "^7.24.7",
-                "@babel/traverse": "^7.24.7",
-                "@babel/types": "^7.24.7",
+                "@babel/traverse": "^7.24.8",
+                "@babel/types": "^7.24.9",
                 "convert-source-map": "^2.0.0",
                 "debug": "^4.1.0",
                 "gensync": "^1.0.0-beta.2",
@@ -200,9 +200,9 @@
             }
         },
         "node_modules/@babel/eslint-parser": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.24.7.tgz",
-            "integrity": "sha512-SO5E3bVxDuxyNxM5agFv480YA2HO6ohZbGxbazZdIk3KQOPOGVNw6q78I9/lbviIf95eq6tPozeYnJLbjnC8IA==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.24.8.tgz",
+            "integrity": "sha512-nYAikI4XTGokU2QX7Jx+v4rxZKhKivaQaREZjuW3mrJrbdWJ5yUfohnoUULge+zEEaKjPYNxhoRgUKktjXtbwA==",
             "dev": true,
             "peer": true,
             "dependencies": {
@@ -219,11 +219,11 @@
             }
         },
         "node_modules/@babel/generator": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.24.7.tgz",
-            "integrity": "sha512-oipXieGC3i45Y1A41t4tAqpnEZWgB/lC6Ehh6+rOviR5XWpTtMmLN+fGjz9vOiNRt0p6RtO6DtD0pdU3vpqdSA==",
+            "version": "7.24.10",
+            "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.24.10.tgz",
+            "integrity": "sha512-o9HBZL1G2129luEUlG1hB4N/nlYNWHnpwlND9eOMclRqqu1YDy2sSYVCFUZwl8I1Gxh+QSRrP2vD7EpUmFVXxg==",
             "dependencies": {
-                "@babel/types": "^7.24.7",
+                "@babel/types": "^7.24.9",
                 "@jridgewell/gen-mapping": "^0.3.5",
                 "@jridgewell/trace-mapping": "^0.3.25",
                 "jsesc": "^2.5.1"
@@ -258,13 +258,13 @@
             }
         },
         "node_modules/@babel/helper-compilation-targets": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.24.7.tgz",
-            "integrity": "sha512-ctSdRHBi20qWOfy27RUb4Fhp07KSJ3sXcuSvTrXrc4aG8NSYDo1ici3Vhg9bg69y5bj0Mr1lh0aeEgTvc12rMg==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.24.8.tgz",
+            "integrity": "sha512-oU+UoqCHdp+nWVDkpldqIQL/i/bvAv53tRqLG/s+cOXxe66zOYLU7ar/Xs3LdmBihrUMEUhwu6dMZwbNOYDwvw==",
             "dependencies": {
-                "@babel/compat-data": "^7.24.7",
-                "@babel/helper-validator-option": "^7.24.7",
-                "browserslist": "^4.22.2",
+                "@babel/compat-data": "^7.24.8",
+                "@babel/helper-validator-option": "^7.24.8",
+                "browserslist": "^4.23.1",
                 "lru-cache": "^5.1.1",
                 "semver": "^6.3.1"
             },
@@ -273,15 +273,15 @@
             }
         },
         "node_modules/@babel/helper-create-class-features-plugin": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.24.7.tgz",
-            "integrity": "sha512-kTkaDl7c9vO80zeX1rJxnuRpEsD5tA81yh11X1gQo+PhSti3JS+7qeZo9U4RHobKRiFPKaGK3svUAeb8D0Q7eg==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.24.8.tgz",
+            "integrity": "sha512-4f6Oqnmyp2PP3olgUMmOwC3akxSm5aBYraQ6YDdKy7NcAMkDECHWG0DEnV6M2UAkERgIBhYt8S27rURPg7SxWA==",
             "dev": true,
             "dependencies": {
                 "@babel/helper-annotate-as-pure": "^7.24.7",
                 "@babel/helper-environment-visitor": "^7.24.7",
                 "@babel/helper-function-name": "^7.24.7",
-                "@babel/helper-member-expression-to-functions": "^7.24.7",
+                "@babel/helper-member-expression-to-functions": "^7.24.8",
                 "@babel/helper-optimise-call-expression": "^7.24.7",
                 "@babel/helper-replace-supers": "^7.24.7",
                 "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
@@ -363,13 +363,13 @@
             }
         },
         "node_modules/@babel/helper-member-expression-to-functions": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.24.7.tgz",
-            "integrity": "sha512-LGeMaf5JN4hAT471eJdBs/GK1DoYIJ5GCtZN/EsL6KUiiDZOvO/eKE11AMZJa2zP4zk4qe9V2O/hxAmkRc8p6w==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.24.8.tgz",
+            "integrity": "sha512-LABppdt+Lp/RlBxqrh4qgf1oEH/WxdzQNDJIu5gC/W1GyvPVrOBiItmmM8wan2fm4oYqFuFfkXmlGpLQhPY8CA==",
             "dev": true,
             "dependencies": {
-                "@babel/traverse": "^7.24.7",
-                "@babel/types": "^7.24.7"
+                "@babel/traverse": "^7.24.8",
+                "@babel/types": "^7.24.8"
             },
             "engines": {
                 "node": ">=6.9.0"
@@ -388,9 +388,9 @@
             }
         },
         "node_modules/@babel/helper-module-transforms": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.24.7.tgz",
-            "integrity": "sha512-1fuJEwIrp+97rM4RWdO+qrRsZlAeL1lQJoPqtCYWv0NL115XM93hIH4CSRln2w52SqvmY5hqdtauB6QFCDiZNQ==",
+            "version": "7.24.9",
+            "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.24.9.tgz",
+            "integrity": "sha512-oYbh+rtFKj/HwBQkFlUzvcybzklmVdVV3UU+mN7n2t/q3yGHbuVdNxyFvSBO1tfvjyArpHNcWMAzsSPdyI46hw==",
             "dependencies": {
                 "@babel/helper-environment-visitor": "^7.24.7",
                 "@babel/helper-module-imports": "^7.24.7",
@@ -418,9 +418,9 @@
             }
         },
         "node_modules/@babel/helper-plugin-utils": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.7.tgz",
-            "integrity": "sha512-Rq76wjt7yz9AAc1KnlRKNAi/dMSVWgDRx43FHoJEbcYU6xOWaE2dVPwcdTukJrjxS65GITyfbvEYHvkirZ6uEg==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.8.tgz",
+            "integrity": "sha512-FFWx5142D8h2Mgr/iPVGH5G7w6jDn4jUSpZTyDnQO0Yn7Ks2Kuz6Pci8H6MPCoUJegd/UZQ3tAvfLCxQSnWWwg==",
             "dev": true,
             "engines": {
                 "node": ">=6.9.0"
@@ -497,9 +497,9 @@
             }
         },
         "node_modules/@babel/helper-string-parser": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.7.tgz",
-            "integrity": "sha512-7MbVt6xrwFQbunH2DNQsAP5sTGxfqQtErvBIvIMi6EQnbgUOuVYanvREcmFrOPhoXBrTtjhhP+lW+o5UfK+tDg==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz",
+            "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==",
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -513,9 +513,9 @@
             }
         },
         "node_modules/@babel/helper-validator-option": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.24.7.tgz",
-            "integrity": "sha512-yy1/KvjhV/ZCL+SM7hBrvnZJ3ZuT9OuZgIJAGpPEToANvc3iM6iDvBnRjtElWibHU6n8/LPR/EjX9EtIEYO3pw==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.24.8.tgz",
+            "integrity": "sha512-xb8t9tD1MHLungh/AIoWYN+gVHaB9kwlu8gffXGSt3FFEIT7RjS+xWbc2vUD1UTZdIpKj/ab3rdqJ7ufngyi2Q==",
             "engines": {
                 "node": ">=6.9.0"
             }
@@ -536,12 +536,12 @@
             }
         },
         "node_modules/@babel/helpers": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.24.7.tgz",
-            "integrity": "sha512-NlmJJtvcw72yRJRcnCmGvSi+3jDEg8qFu3z0AFoymmzLx5ERVWyzd9kVXr7Th9/8yIJi2Zc6av4Tqz3wFs8QWg==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.24.8.tgz",
+            "integrity": "sha512-gV2265Nkcz7weJJfvDoAEVzC1e2OTDpkGbEsebse8koXUJUXPsCMi7sRo/+SPMuMZ9MtUPnGwITTnQnU5YjyaQ==",
             "dependencies": {
                 "@babel/template": "^7.24.7",
-                "@babel/types": "^7.24.7"
+                "@babel/types": "^7.24.8"
             },
             "engines": {
                 "node": ">=6.9.0"
@@ -562,9 +562,9 @@
             }
         },
         "node_modules/@babel/parser": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.7.tgz",
-            "integrity": "sha512-9uUYRm6OqQrCqQdG1iCBwBPZgN8ciDBro2nIOFaiRz1/BCxaI7CNvQbDHvsArAC7Tw9Hda/B3U+6ui9u4HWXPw==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.8.tgz",
+            "integrity": "sha512-WzfbgXOkGzZiXXCqk43kKwZjzwx4oulxZi3nq2TYL9mOjQv6kYwul9mz6ID36njuL7Xkp6nJEfok848Zj10j/w==",
             "bin": {
                 "parser": "bin/babel-parser.js"
             },
@@ -1232,16 +1232,16 @@
             }
         },
         "node_modules/@babel/plugin-transform-classes": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.24.7.tgz",
-            "integrity": "sha512-CFbbBigp8ln4FU6Bpy6g7sE8B/WmCmzvivzUC6xDAdWVsjYTXijpuuGJmYkAaoWAzcItGKT3IOAbxRItZ5HTjw==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.24.8.tgz",
+            "integrity": "sha512-VXy91c47uujj758ud9wx+OMgheXm4qJfyhj1P18YvlrQkNOSrwsteHk+EFS3OMGfhMhpZa0A+81eE7G4QC+3CA==",
             "dev": true,
             "dependencies": {
                 "@babel/helper-annotate-as-pure": "^7.24.7",
-                "@babel/helper-compilation-targets": "^7.24.7",
+                "@babel/helper-compilation-targets": "^7.24.8",
                 "@babel/helper-environment-visitor": "^7.24.7",
                 "@babel/helper-function-name": "^7.24.7",
-                "@babel/helper-plugin-utils": "^7.24.7",
+                "@babel/helper-plugin-utils": "^7.24.8",
                 "@babel/helper-replace-supers": "^7.24.7",
                 "@babel/helper-split-export-declaration": "^7.24.7",
                 "globals": "^11.1.0"
@@ -1270,12 +1270,12 @@
             }
         },
         "node_modules/@babel/plugin-transform-destructuring": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.24.7.tgz",
-            "integrity": "sha512-19eJO/8kdCQ9zISOf+SEUJM/bAUIsvY3YDnXZTupUCQ8LgrWnsG/gFB9dvXqdXnRXMAM8fvt7b0CBKQHNGy1mw==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.24.8.tgz",
+            "integrity": "sha512-36e87mfY8TnRxc7yc6M9g9gOB7rKgSahqkIKwLpz4Ppk2+zC2Cy1is0uwtuSG6AE4zlTOUa+7JGz9jCJGLqQFQ==",
             "dev": true,
             "dependencies": {
-                "@babel/helper-plugin-utils": "^7.24.7"
+                "@babel/helper-plugin-utils": "^7.24.8"
             },
             "engines": {
                 "node": ">=6.9.0"
@@ -1475,13 +1475,13 @@
             }
         },
         "node_modules/@babel/plugin-transform-modules-commonjs": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.24.7.tgz",
-            "integrity": "sha512-iFI8GDxtevHJ/Z22J5xQpVqFLlMNstcLXh994xifFwxxGslr2ZXXLWgtBeLctOD63UFDArdvN6Tg8RFw+aEmjQ==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.24.8.tgz",
+            "integrity": "sha512-WHsk9H8XxRs3JXKWFiqtQebdh9b/pTk4EgueygFzYlTKAg0Ud985mSevdNjdXdFBATSKVJGQXP1tv6aGbssLKA==",
             "dev": true,
             "dependencies": {
-                "@babel/helper-module-transforms": "^7.24.7",
-                "@babel/helper-plugin-utils": "^7.24.7",
+                "@babel/helper-module-transforms": "^7.24.8",
+                "@babel/helper-plugin-utils": "^7.24.8",
                 "@babel/helper-simple-access": "^7.24.7"
             },
             "engines": {
@@ -1639,12 +1639,12 @@
             }
         },
         "node_modules/@babel/plugin-transform-optional-chaining": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.24.7.tgz",
-            "integrity": "sha512-tK+0N9yd4j+x/4hxF3F0e0fu/VdcxU18y5SevtyM/PCFlQvXbR0Zmlo2eBrKtVipGNFzpq56o8WsIIKcJFUCRQ==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.24.8.tgz",
+            "integrity": "sha512-5cTOLSMs9eypEy8JUVvIKOu6NgvbJMnpG62VpIHrTmROdQ+L5mDAaI40g25k5vXti55JWNX5jCkq3HZxXBQANw==",
             "dev": true,
             "dependencies": {
-                "@babel/helper-plugin-utils": "^7.24.7",
+                "@babel/helper-plugin-utils": "^7.24.8",
                 "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
                 "@babel/plugin-syntax-optional-chaining": "^7.8.3"
             },
@@ -1877,12 +1877,12 @@
             }
         },
         "node_modules/@babel/plugin-transform-typeof-symbol": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.24.7.tgz",
-            "integrity": "sha512-VtR8hDy7YLB7+Pet9IarXjg/zgCMSF+1mNS/EQEiEaUPoFXCVsHG64SIxcaaI2zJgRiv+YmgaQESUfWAdbjzgg==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.24.8.tgz",
+            "integrity": "sha512-adNTUpDCVnmAE58VEqKlAA6ZBlNkMnWD0ZcW76lyNFN3MJniyGFZfNwERVk8Ap56MCnXztmDr19T4mPTztcuaw==",
             "dev": true,
             "dependencies": {
-                "@babel/helper-plugin-utils": "^7.24.7"
+                "@babel/helper-plugin-utils": "^7.24.8"
             },
             "engines": {
                 "node": ">=6.9.0"
@@ -1892,14 +1892,14 @@
             }
         },
         "node_modules/@babel/plugin-transform-typescript": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.24.7.tgz",
-            "integrity": "sha512-iLD3UNkgx2n/HrjBesVbYX6j0yqn/sJktvbtKKgcaLIQ4bTTQ8obAypc1VpyHPD2y4Phh9zHOaAt8e/L14wCpw==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.24.8.tgz",
+            "integrity": "sha512-CgFgtN61BbdOGCP4fLaAMOPkzWUh6yQZNMr5YSt8uz2cZSSiQONCQFWqsE4NeVfOIhqDOlS9CR3WD91FzMeB2Q==",
             "dev": true,
             "dependencies": {
                 "@babel/helper-annotate-as-pure": "^7.24.7",
-                "@babel/helper-create-class-features-plugin": "^7.24.7",
-                "@babel/helper-plugin-utils": "^7.24.7",
+                "@babel/helper-create-class-features-plugin": "^7.24.8",
+                "@babel/helper-plugin-utils": "^7.24.8",
                 "@babel/plugin-syntax-typescript": "^7.24.7"
             },
             "engines": {
@@ -1973,15 +1973,15 @@
             }
         },
         "node_modules/@babel/preset-env": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.24.7.tgz",
-            "integrity": "sha512-1YZNsc+y6cTvWlDHidMBsQZrZfEFjRIo/BZCT906PMdzOyXtSLTgqGdrpcuTDCXyd11Am5uQULtDIcCfnTc8fQ==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.24.8.tgz",
+            "integrity": "sha512-vObvMZB6hNWuDxhSaEPTKCwcqkAIuDtE+bQGn4XMXne1DSLzFVY8Vmj1bm+mUQXYNN8NmaQEO+r8MMbzPr1jBQ==",
             "dev": true,
             "dependencies": {
-                "@babel/compat-data": "^7.24.7",
-                "@babel/helper-compilation-targets": "^7.24.7",
-                "@babel/helper-plugin-utils": "^7.24.7",
-                "@babel/helper-validator-option": "^7.24.7",
+                "@babel/compat-data": "^7.24.8",
+                "@babel/helper-compilation-targets": "^7.24.8",
+                "@babel/helper-plugin-utils": "^7.24.8",
+                "@babel/helper-validator-option": "^7.24.8",
                 "@babel/plugin-bugfix-firefox-class-in-computed-class-key": "^7.24.7",
                 "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.24.7",
                 "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.24.7",
@@ -2012,9 +2012,9 @@
                 "@babel/plugin-transform-block-scoping": "^7.24.7",
                 "@babel/plugin-transform-class-properties": "^7.24.7",
                 "@babel/plugin-transform-class-static-block": "^7.24.7",
-                "@babel/plugin-transform-classes": "^7.24.7",
+                "@babel/plugin-transform-classes": "^7.24.8",
                 "@babel/plugin-transform-computed-properties": "^7.24.7",
-                "@babel/plugin-transform-destructuring": "^7.24.7",
+                "@babel/plugin-transform-destructuring": "^7.24.8",
                 "@babel/plugin-transform-dotall-regex": "^7.24.7",
                 "@babel/plugin-transform-duplicate-keys": "^7.24.7",
                 "@babel/plugin-transform-dynamic-import": "^7.24.7",
@@ -2027,7 +2027,7 @@
                 "@babel/plugin-transform-logical-assignment-operators": "^7.24.7",
                 "@babel/plugin-transform-member-expression-literals": "^7.24.7",
                 "@babel/plugin-transform-modules-amd": "^7.24.7",
-                "@babel/plugin-transform-modules-commonjs": "^7.24.7",
+                "@babel/plugin-transform-modules-commonjs": "^7.24.8",
                 "@babel/plugin-transform-modules-systemjs": "^7.24.7",
                 "@babel/plugin-transform-modules-umd": "^7.24.7",
                 "@babel/plugin-transform-named-capturing-groups-regex": "^7.24.7",
@@ -2037,7 +2037,7 @@
                 "@babel/plugin-transform-object-rest-spread": "^7.24.7",
                 "@babel/plugin-transform-object-super": "^7.24.7",
                 "@babel/plugin-transform-optional-catch-binding": "^7.24.7",
-                "@babel/plugin-transform-optional-chaining": "^7.24.7",
+                "@babel/plugin-transform-optional-chaining": "^7.24.8",
                 "@babel/plugin-transform-parameters": "^7.24.7",
                 "@babel/plugin-transform-private-methods": "^7.24.7",
                 "@babel/plugin-transform-private-property-in-object": "^7.24.7",
@@ -2048,7 +2048,7 @@
                 "@babel/plugin-transform-spread": "^7.24.7",
                 "@babel/plugin-transform-sticky-regex": "^7.24.7",
                 "@babel/plugin-transform-template-literals": "^7.24.7",
-                "@babel/plugin-transform-typeof-symbol": "^7.24.7",
+                "@babel/plugin-transform-typeof-symbol": "^7.24.8",
                 "@babel/plugin-transform-unicode-escapes": "^7.24.7",
                 "@babel/plugin-transform-unicode-property-regex": "^7.24.7",
                 "@babel/plugin-transform-unicode-regex": "^7.24.7",
@@ -2057,7 +2057,7 @@
                 "babel-plugin-polyfill-corejs2": "^0.4.10",
                 "babel-plugin-polyfill-corejs3": "^0.10.4",
                 "babel-plugin-polyfill-regenerator": "^0.6.1",
-                "core-js-compat": "^3.31.0",
+                "core-js-compat": "^3.37.1",
                 "semver": "^6.3.1"
             },
             "engines": {
@@ -2139,9 +2139,9 @@
             "dev": true
         },
         "node_modules/@babel/runtime": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.7.tgz",
-            "integrity": "sha512-UwgBRMjJP+xv857DCngvqXI3Iq6J4v0wXmwc6sapg+zyhbwmQX67LUEFrkK5tbyJ30jGuG3ZvWpBiB9LCy1kWw==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.8.tgz",
+            "integrity": "sha512-5F7SDGs1T72ZczbRwbGO9lQi0NLjQxzl6i4lJxLxfW9U5UluCSyEJeniWvnhl3/euNiqQVbo8zruhsDfid0esA==",
             "dependencies": {
                 "regenerator-runtime": "^0.14.0"
             },
@@ -2163,18 +2163,18 @@
             }
         },
         "node_modules/@babel/traverse": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.24.7.tgz",
-            "integrity": "sha512-yb65Ed5S/QAcewNPh0nZczy9JdYXkkAbIsEo+P7BE7yO3txAY30Y/oPa3QkQ5It3xVG2kpKMg9MsdxZaO31uKA==",
+            "version": "7.24.8",
+            "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.24.8.tgz",
+            "integrity": "sha512-t0P1xxAPzEDcEPmjprAQq19NWum4K0EQPjMwZQZbHt+GiZqvjCHjj755Weq1YRPVzBI+3zSfvScfpnuIecVFJQ==",
             "dependencies": {
                 "@babel/code-frame": "^7.24.7",
-                "@babel/generator": "^7.24.7",
+                "@babel/generator": "^7.24.8",
                 "@babel/helper-environment-visitor": "^7.24.7",
                 "@babel/helper-function-name": "^7.24.7",
                 "@babel/helper-hoist-variables": "^7.24.7",
                 "@babel/helper-split-export-declaration": "^7.24.7",
-                "@babel/parser": "^7.24.7",
-                "@babel/types": "^7.24.7",
+                "@babel/parser": "^7.24.8",
+                "@babel/types": "^7.24.8",
                 "debug": "^4.3.1",
                 "globals": "^11.1.0"
             },
@@ -2183,11 +2183,11 @@
             }
         },
         "node_modules/@babel/types": {
-            "version": "7.24.7",
-            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.24.7.tgz",
-            "integrity": "sha512-XEFXSlxiG5td2EJRe8vOmRbaXVgfcBlszKujvVmWIK/UpywWljQCfzAv3RQCGujWQ1RD4YYWEAqDXfuJiy8f5Q==",
+            "version": "7.24.9",
+            "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.24.9.tgz",
+            "integrity": "sha512-xm8XrMKz0IlUdocVbYJe0Z9xEgidU7msskG8BbhnTPK/HZ2z/7FP7ykqPgrUH+C+r414mNfNWam1f2vqOjqjYQ==",
             "dependencies": {
-                "@babel/helper-string-parser": "^7.24.7",
+                "@babel/helper-string-parser": "^7.24.8",
                 "@babel/helper-validator-identifier": "^7.24.7",
                 "to-fast-properties": "^2.0.0"
             },
@@ -2805,9 +2805,9 @@
             }
         },
         "node_modules/@deriv-com/analytics": {
-            "version": "1.8.0",
-            "resolved": "https://registry.npmjs.org/@deriv-com/analytics/-/analytics-1.8.0.tgz",
-            "integrity": "sha512-zH4292rOjH6forMCi1EmdpuSjakkBroedix9fj/zqDEb66DjFC3x+CHrdsr0o2vcJFwTlhVrFZkEyGkeDa6klw==",
+            "version": "1.10.1",
+            "resolved": "https://registry.npmjs.org/@deriv-com/analytics/-/analytics-1.10.1.tgz",
+            "integrity": "sha512-ly0UTkrHUJQ2zI4qkGJs/vGAT+eIjPQ+jXOd/V8Rmj1md7SDagz1HPg7F3/hZZINwI3LC69NO9yQcygwwGiSWw==",
             "dependencies": {
                 "@growthbook/growthbook": "^1.0.1",
                 "@rudderstack/analytics-js": "^3.5.1"
@@ -2818,9 +2818,9 @@
             }
         },
         "node_modules/@deriv-com/api-hooks": {
-            "version": "1.3.7",
-            "resolved": "https://registry.npmjs.org/@deriv-com/api-hooks/-/api-hooks-1.3.7.tgz",
-            "integrity": "sha512-5XomMS9zOG3wSgEl5oA4N0gCr9pI/hRCIMgoUVP2D9fThTS6K9iHVv/aWieJKx0esF8lYQx5zaLDYTwxqX0u/g==",
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/@deriv-com/api-hooks/-/api-hooks-1.4.0.tgz",
+            "integrity": "sha512-xUMpTA4t8Qnv8G9zwoJtOVClVPFuA8Yt1JKuwwI4ROdD2xi5P4d+HUp4D1Le5RziF57j2/ZXF3byVLXcte01zA==",
             "dependencies": {
                 "@deriv-com/utils": "^0.0.28",
                 "@deriv/api-types": "^1.0.985",
@@ -2831,6 +2831,11 @@
                 "@rollup/rollup-linux-x64-gnu": "^4.18.0"
             }
         },
+        "node_modules/@deriv-com/api-hooks/node_modules/@deriv-com/utils": {
+            "version": "0.0.28",
+            "resolved": "https://registry.npmjs.org/@deriv-com/utils/-/utils-0.0.28.tgz",
+            "integrity": "sha512-JJayPckG5ajwZjJ0H3VYe9GXcTpMY7oNOkMRiqwv14dtcsMTsYow9cVs3vfbiL4U59WGQBGMkkbh0EwSjYVrvQ=="
+        },
         "node_modules/@deriv-com/eslint-config-deriv": {
             "version": "2.1.0-beta.3",
             "resolved": "https://registry.npmjs.org/@deriv-com/eslint-config-deriv/-/eslint-config-deriv-2.1.0-beta.3.tgz",
@@ -2882,9 +2887,9 @@
             }
         },
         "node_modules/@deriv-com/ui": {
-            "version": "1.29.2",
-            "resolved": "https://registry.npmjs.org/@deriv-com/ui/-/ui-1.29.2.tgz",
-            "integrity": "sha512-mbYMaLj30P6g/9FarP9EVMdXQGf8yR2c2aUKg8awLMJ2x+BsO7CxE1LLWPWQAHCSyzdNWR9NxyF09SLwd3n1jQ==",
+            "version": "1.29.9",
+            "resolved": "https://registry.npmjs.org/@deriv-com/ui/-/ui-1.29.9.tgz",
+            "integrity": "sha512-11rxCG5eSn3huaf+dqqMUzRhNogHu+Qv9NNlJdXiwdHzNt2X7NGtrNpAtB669yjjtdt11ImwFQsN6BIPJg6DeA==",
             "dependencies": {
                 "@popperjs/core": "^2.11.8",
                 "@types/react-modal": "^3.16.3",
@@ -2895,14 +2900,14 @@
             }
         },
         "node_modules/@deriv-com/utils": {
-            "version": "0.0.28",
-            "resolved": "https://registry.npmjs.org/@deriv-com/utils/-/utils-0.0.28.tgz",
-            "integrity": "sha512-JJayPckG5ajwZjJ0H3VYe9GXcTpMY7oNOkMRiqwv14dtcsMTsYow9cVs3vfbiL4U59WGQBGMkkbh0EwSjYVrvQ=="
+            "version": "0.0.30",
+            "resolved": "https://registry.npmjs.org/@deriv-com/utils/-/utils-0.0.30.tgz",
+            "integrity": "sha512-ZOpIfnQN4N1dM/JHSpQFzz+0jRW5mefy2BpzvFnvMBtp/IVY6+2Uw304cAIBuz56sKnTPP1FTBW7ndRuJDKpMQ=="
         },
         "node_modules/@deriv/api-types": {
-            "version": "1.0.1167",
-            "resolved": "https://registry.npmjs.org/@deriv/api-types/-/api-types-1.0.1167.tgz",
-            "integrity": "sha512-BlAWV9VggrRKjc0Urs3uNWkK89Ph9wK6ojr8iqBKYQuc/sVYAblv1a9gGvROUvFFGjjalr0nqmlf9iuoDKyvQQ=="
+            "version": "1.0.1350",
+            "resolved": "https://registry.npmjs.org/@deriv/api-types/-/api-types-1.0.1350.tgz",
+            "integrity": "sha512-UZHzZBlse6QEraeBgQxZYdhKUWbtqS4f+w9LfZiHUgPNYSVPzmFvEl61H0VgV4Pp5lqAM7iQF7+MhV0uA5P0ZA=="
         },
         "node_modules/@deriv/deriv-api": {
             "version": "1.0.15",
@@ -2915,9 +2920,9 @@
             }
         },
         "node_modules/@deriv/deriv-charts": {
-            "version": "2.1.24",
-            "resolved": "https://registry.npmjs.org/@deriv/deriv-charts/-/deriv-charts-2.1.24.tgz",
-            "integrity": "sha512-lIHQ2ZutUxk0MutQWzNZ80N8HumtDDxti5VD1ExJZ1u1HWbRmM9Iyl+jdbee1FmRnqIzEXLenW6M2X7LFPEDkA==",
+            "version": "2.1.25",
+            "resolved": "https://registry.npmjs.org/@deriv/deriv-charts/-/deriv-charts-2.1.25.tgz",
+            "integrity": "sha512-b0uhTCqfk6M5okl5JCuexNTs1YUAXVAgripn9sDaXrfUGcg/uhbI/g0+zmPlts+018SqaWvXYt9ysJhQN2MGbg==",
             "dependencies": {
                 "@types/lodash.set": "^4.3.7",
                 "@welldone-software/why-did-you-render": "^3.3.8",
@@ -3127,6 +3132,12 @@
                 "url": "https://github.com/sponsors/epoberezkin"
             }
         },
+        "node_modules/@eslint/eslintrc/node_modules/argparse": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+            "dev": true
+        },
         "node_modules/@eslint/eslintrc/node_modules/brace-expansion": {
             "version": "1.1.11",
             "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -3152,6 +3163,18 @@
                 "url": "https://github.com/sponsors/sindresorhus"
             }
         },
+        "node_modules/@eslint/eslintrc/node_modules/js-yaml": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
+            "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+            "dev": true,
+            "dependencies": {
+                "argparse": "^2.0.1"
+            },
+            "bin": {
+                "js-yaml": "bin/js-yaml.js"
+            }
+        },
         "node_modules/@eslint/eslintrc/node_modules/json-schema-traverse": {
             "version": "0.4.1",
             "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -3342,15 +3365,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/@istanbuljs/load-nyc-config/node_modules/argparse": {
-            "version": "1.0.10",
-            "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
-            "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
-            "dev": true,
-            "dependencies": {
-                "sprintf-js": "~1.0.2"
-            }
-        },
         "node_modules/@istanbuljs/load-nyc-config/node_modules/camelcase": {
             "version": "5.3.1",
             "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
@@ -3373,19 +3387,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/@istanbuljs/load-nyc-config/node_modules/js-yaml": {
-            "version": "3.14.1",
-            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz",
-            "integrity": "sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==",
-            "dev": true,
-            "dependencies": {
-                "argparse": "^1.0.7",
-                "esprima": "^4.0.0"
-            },
-            "bin": {
-                "js-yaml": "bin/js-yaml.js"
-            }
-        },
         "node_modules/@istanbuljs/load-nyc-config/node_modules/locate-path": {
             "version": "5.0.0",
             "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
@@ -3626,6 +3627,38 @@
                 "node": ">=8"
             }
         },
+        "node_modules/@jest/core/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/@jest/core/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/@jest/core/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/@jest/core/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -3695,15 +3728,6 @@
                 "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
             }
         },
-        "node_modules/@jest/fake-timers/node_modules/@sinonjs/fake-timers": {
-            "version": "10.3.0",
-            "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
-            "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
-            "dev": true,
-            "dependencies": {
-                "@sinonjs/commons": "^3.0.0"
-            }
-        },
         "node_modules/@jest/globals": {
             "version": "29.7.0",
             "resolved": "https://registry.npmjs.org/@jest/globals/-/globals-29.7.0.tgz",
@@ -3880,9 +3904,9 @@
             }
         },
         "node_modules/@jest/reporters/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -4055,19 +4079,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/@jest/transform/node_modules/write-file-atomic": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-4.0.2.tgz",
-            "integrity": "sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==",
-            "dev": true,
-            "dependencies": {
-                "imurmurhash": "^0.1.4",
-                "signal-exit": "^3.0.7"
-            },
-            "engines": {
-                "node": "^12.13.0 || ^14.15.0 || >=16.0.0"
-            }
-        },
         "node_modules/@jest/types": {
             "version": "29.6.3",
             "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz",
@@ -4452,6 +4463,18 @@
                 "node": ">=14.0.0"
             }
         },
+        "node_modules/@rollup/rollup-linux-x64-gnu": {
+            "version": "4.19.0",
+            "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.19.0.tgz",
+            "integrity": "sha512-HBndjQLP8OsdJNSxpNIN0einbDmRFg9+UQeZV1eiYupIRuZsDEoeGU43NQsS34Pp166DtwQOnpcbV/zQxM+rWA==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ]
+        },
         "node_modules/@rsbuild/core": {
             "version": "1.0.1-beta.4",
             "resolved": "https://registry.npmjs.org/@rsbuild/core/-/core-1.0.1-beta.4.tgz",
@@ -4540,6 +4563,110 @@
                 "darwin"
             ]
         },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-darwin-x64": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-darwin-x64/-/binding-darwin-x64-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-fcMVZJQVo9zJ+7YEqkMms+FlAkMOxTfI98sS+XxKC2M/UWDKdMdl7nyhobH+eEhH/eP0Yww6ikEWqF9r3MUsew==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "darwin"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-arm64-gnu": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-UZC2TScOVWVqICiinGWSYdYPAYcn8F/2L+8sbA6NAwSZo0mzH+LaRr6nZRdW2z7y+lELVDQG8UniMxXjoXjVjg==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-arm64-musl": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-uvrqKqNmj60eCze5ZLxod3nFyDBtDz+OeoSO3T5GU9VRv8XKtd4xJbmm4Nz3A14GOWWfGgGr1cYwQBIGBZActA==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-x64-gnu": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-7P5EnCsQmbLrYnCXJ1P8NF7/FCOpvOHaoNlReDZnut2HRppsUJXMnH3lQucq/sdS3djZ4RdG3sBMcTA3OEALwg==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-linux-x64-musl": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-RGj1cZLURjY8RG+t8qG2OB9ruqKQvM0M+JMhwhel57CYW9Ge9zZY+ReEhrdtYjW32KxVvuqtt2e7RhhKibK75w==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-win32-arm64-msvc": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-7u/LLEcDcBS5slSsAS9h23sTJNbJ+TUMy7GR91X7ySkqJ0VIR6tzml7+JqFxdPcBGXSszonGbcUupYy3nVzLCQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "win32"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-win32-ia32-msvc": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-HpP7Ptekbv/rQgV253UY+DXSIULINv49JbTBKB2PeBn9ra+Ec4vKPKlQtqIfoPStXEGSmA727nqFQ+VE581P4A==",
+            "cpu": [
+                "ia32"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "win32"
+            ]
+        },
+        "node_modules/@rsbuild/core/node_modules/@rspack/binding-win32-x64-msvc": {
+            "version": "1.0.0-alpha.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.0-alpha.5.tgz",
+            "integrity": "sha512-t04ipYUTzigLtl6z7R78ytrAlK/oJWAwDUEVblyTtyJ/RwKfREUcS/8dkMx431Ia4Y0Icz6AVNf4avbYCoREyQ==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "win32"
+            ]
+        },
         "node_modules/@rsbuild/core/node_modules/@rspack/core": {
             "version": "1.0.0-alpha.5",
             "resolved": "https://registry.npmjs.org/@rspack/core/-/core-1.0.0-alpha.5.tgz",
@@ -4563,23 +4690,6 @@
                 }
             }
         },
-        "node_modules/@rsbuild/plugin-basic-ssl": {
-            "version": "1.1.0",
-            "resolved": "https://registry.npmjs.org/@rsbuild/plugin-basic-ssl/-/plugin-basic-ssl-1.1.0.tgz",
-            "integrity": "sha512-MqNYK3Yqnht6YNpIzYKReNAjiZZPblNui9pDVe256VmOQq9Wrj6VRpC+pgOQurYw7UwG8C9LHDFdZlmdCqDuYg==",
-            "dev": true,
-            "dependencies": {
-                "selfsigned": "^2.4.1"
-            },
-            "peerDependencies": {
-                "@rsbuild/core": "0.x || 1.x"
-            },
-            "peerDependenciesMeta": {
-                "@rsbuild/core": {
-                    "optional": true
-                }
-            }
-        },
         "node_modules/@rsbuild/plugin-react": {
             "version": "1.0.1-beta.4",
             "resolved": "https://registry.npmjs.org/@rsbuild/plugin-react/-/plugin-react-1.0.1-beta.4.tgz",
@@ -4609,15 +4719,6 @@
                 "@rsbuild/core": "^1.0.1-beta.0"
             }
         },
-        "node_modules/@rsbuild/plugin-sass/node_modules/deepmerge": {
-            "version": "4.3.1",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
-            "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
         "node_modules/@rspack/binding": {
             "version": "0.7.5",
             "resolved": "https://registry.npmjs.org/@rspack/binding/-/binding-0.7.5.tgz",
@@ -4651,32 +4752,144 @@
             ],
             "peer": true
         },
-        "node_modules/@rspack/core": {
+        "node_modules/@rspack/binding-darwin-x64": {
             "version": "0.7.5",
-            "resolved": "https://registry.npmjs.org/@rspack/core/-/core-0.7.5.tgz",
-            "integrity": "sha512-zVTe4WCyc3qsLPattosiDYZFeOzaJ32/BYukPP2I1VJtCVFa+PxGVRPVZhSoN6fXw5oy48yHg9W9v1T8CaEFhw==",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-darwin-x64/-/binding-darwin-x64-0.7.5.tgz",
+            "integrity": "sha512-teLK0TB1x0CsvaaiCopsFx4EvJe+/Hljwii6R7C9qOZs5zSOfbT/LQ202eA0sAGodCncARCGaXVrsekbrRYqeA==",
+            "cpu": [
+                "x64"
+            ],
             "dev": true,
             "optional": true,
-            "peer": true,
-            "dependencies": {
-                "@module-federation/runtime-tools": "0.1.6",
-                "@rspack/binding": "0.7.5",
-                "caniuse-lite": "^1.0.30001616",
-                "tapable": "2.2.1",
-                "webpack-sources": "3.2.3"
-            },
-            "engines": {
-                "node": ">=16.0.0"
-            },
-            "peerDependencies": {
-                "@swc/helpers": ">=0.5.1"
-            },
-            "peerDependenciesMeta": {
-                "@swc/helpers": {
-                    "optional": true
-                }
-            }
-        },
+            "os": [
+                "darwin"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-linux-arm64-gnu": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-0.7.5.tgz",
+            "integrity": "sha512-/24UytJXrK+7CsucDb30GCKYIJ8nG6ceqbJyOtsJv9zeArNLHkxrYGSyjHJIpQfwVN17BPP4RNOi+yIZ3ZgDyA==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-linux-arm64-musl": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-arm64-musl/-/binding-linux-arm64-musl-0.7.5.tgz",
+            "integrity": "sha512-6RcxG42mLM01Pa6UYycACu/Nu9qusghAPUJumb8b8x5TRIDEtklYC5Ck6Rmagm+8E0ucMude2E/D4rMdIFcS3A==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-linux-x64-gnu": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-gnu/-/binding-linux-x64-gnu-0.7.5.tgz",
+            "integrity": "sha512-R0Lu4CJN2nWMW7WzPBuCIju80cQPpcaqwKJDj/quwQySpJJZ6c5qGwB8mntqjxIzZDrNH6u0OkpiUTbvWZj8ww==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-linux-x64-musl": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-linux-x64-musl/-/binding-linux-x64-musl-0.7.5.tgz",
+            "integrity": "sha512-dDgi/ThikMy1m4llxPeEXDCA2I8F8ezFS/eCPLZGU2/J1b4ALwDjuRsMmo+VXSlFCKgIt98V6h1woeg7nu96yg==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-win32-arm64-msvc": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-0.7.5.tgz",
+            "integrity": "sha512-nEF4cUdLfgEK6FrgJSJhUlr2/7LY1tmqBNQCFsCjtDtUkQbJIEo1b8edT94G9tJcQoFE4cD+Re30yBYbQO2Thg==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-win32-ia32-msvc": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-0.7.5.tgz",
+            "integrity": "sha512-hEcHRwJIzpZsePr+5x6V/7TGhrPXhSZYG4sIhsrem1za9W+qqCYYLZ7KzzbRODU07QaAH2RxjcA1bf8F2QDYAQ==",
+            "cpu": [
+                "ia32"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/binding-win32-x64-msvc": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/binding-win32-x64-msvc/-/binding-win32-x64-msvc-0.7.5.tgz",
+            "integrity": "sha512-PpVpP6J5/2b4T10hzSUwjLvmdpAOj3ozARl1Nrf/lsbYwhiXivoB8Gvoy/xe/Xpgr732Dk9VCeeW8rreWOOUVQ==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "peer": true
+        },
+        "node_modules/@rspack/core": {
+            "version": "0.7.5",
+            "resolved": "https://registry.npmjs.org/@rspack/core/-/core-0.7.5.tgz",
+            "integrity": "sha512-zVTe4WCyc3qsLPattosiDYZFeOzaJ32/BYukPP2I1VJtCVFa+PxGVRPVZhSoN6fXw5oy48yHg9W9v1T8CaEFhw==",
+            "dev": true,
+            "optional": true,
+            "peer": true,
+            "dependencies": {
+                "@module-federation/runtime-tools": "0.1.6",
+                "@rspack/binding": "0.7.5",
+                "caniuse-lite": "^1.0.30001616",
+                "tapable": "2.2.1",
+                "webpack-sources": "3.2.3"
+            },
+            "engines": {
+                "node": ">=16.0.0"
+            },
+            "peerDependencies": {
+                "@swc/helpers": ">=0.5.1"
+            },
+            "peerDependenciesMeta": {
+                "@swc/helpers": {
+                    "optional": true
+                }
+            }
+        },
         "node_modules/@rspack/lite-tapable": {
             "version": "1.0.0-alpha.5",
             "resolved": "https://registry.npmjs.org/@rspack/lite-tapable/-/lite-tapable-1.0.0-alpha.5.tgz",
@@ -4705,9 +4918,9 @@
             }
         },
         "node_modules/@rudderstack/analytics-js": {
-            "version": "3.6.1",
-            "resolved": "https://registry.npmjs.org/@rudderstack/analytics-js/-/analytics-js-3.6.1.tgz",
-            "integrity": "sha512-8RNvrgSbWi/UcafMyLuNOTad0FBrGJnLSnyxQ2eZCZzDsJOaY4Ws5nTQPwmhuC1kT/RRZJQNWIslHY/wQqnx0A=="
+            "version": "3.7.6",
+            "resolved": "https://registry.npmjs.org/@rudderstack/analytics-js/-/analytics-js-3.7.6.tgz",
+            "integrity": "sha512-KMnWdRDKYID+VsQAy3KVXV6mjb1FhJ0SdmkZ5obaPVUUVmJKKAwMqGME8ZXeKaZRaLEgoDNXzoQhWCqTEqkM0A=="
         },
         "node_modules/@sinclair/typebox": {
             "version": "0.27.8",
@@ -4736,10 +4949,10 @@
             }
         },
         "node_modules/@sinonjs/fake-timers": {
-            "version": "11.2.2",
-            "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-11.2.2.tgz",
-            "integrity": "sha512-G2piCSxQ7oWOxwGSAyFHfPIsyeJGXYtc6mFbnFA+kRXkiEnTl8c/8jul2S329iFBnDI9HGoeWWAZvuvOkZccgw==",
-            "peer": true,
+            "version": "10.3.0",
+            "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
+            "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
+            "dev": true,
             "dependencies": {
                 "@sinonjs/commons": "^3.0.0"
             }
@@ -4944,20 +5157,20 @@
             }
         },
         "node_modules/@tanstack/query-core": {
-            "version": "5.50.1",
-            "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.50.1.tgz",
-            "integrity": "sha512-lpfhKPrJlyV2DSVcQb/HuozH3Av3kws4ge22agx+lNGpFkS4vLZ7St0l3GLwlAD+bqB+qXGex3JdRKUNtMviEQ==",
+            "version": "5.51.9",
+            "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.51.9.tgz",
+            "integrity": "sha512-HsAwaY5J19MD18ykZDS3aVVh+bAt0i7m6uQlFC2b77DLV9djo+xEN7MWQAQQTR8IM+7r/zbozTQ7P0xr0bHuew==",
             "funding": {
                 "type": "github",
                 "url": "https://github.com/sponsors/tannerlinsley"
             }
         },
         "node_modules/@tanstack/react-query": {
-            "version": "5.50.1",
-            "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.50.1.tgz",
-            "integrity": "sha512-s0DW3rVBDPReDDovUjVqItVa3R2nPfUANK9nqGvarO2DwTiY9U4EBTsqizMxItRCoGgK5apeM7D3mxlHrSKpdQ==",
+            "version": "5.51.11",
+            "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.51.11.tgz",
+            "integrity": "sha512-4Kq2x0XpDlpvSnaLG+8pHNH60zEc3mBvb3B2tOMDjcPCi/o+Du3p/9qpPLwJOTliVxxPJAP27fuIhLrsRdCr7A==",
             "dependencies": {
-                "@tanstack/query-core": "5.50.1"
+                "@tanstack/query-core": "5.51.9"
             },
             "funding": {
                 "type": "github",
@@ -4968,9 +5181,9 @@
             }
         },
         "node_modules/@testing-library/dom": {
-            "version": "10.3.1",
-            "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.3.1.tgz",
-            "integrity": "sha512-q/WL+vlXMpC0uXDyfsMtc1rmotzLV8Y0gq6q1gfrrDjQeHoeLrqHbxdPvPNAh1i+xuJl7+BezywcXArz7vLqKQ==",
+            "version": "10.4.0",
+            "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz",
+            "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==",
             "dev": true,
             "dependencies": {
                 "@babel/code-frame": "^7.10.4",
@@ -5044,38 +5257,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/@testing-library/dom/node_modules/pretty-format": {
-            "version": "27.5.1",
-            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
-            "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
-            "dev": true,
-            "dependencies": {
-                "ansi-regex": "^5.0.1",
-                "ansi-styles": "^5.0.0",
-                "react-is": "^17.0.1"
-            },
-            "engines": {
-                "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
-            }
-        },
-        "node_modules/@testing-library/dom/node_modules/pretty-format/node_modules/ansi-styles": {
-            "version": "5.2.0",
-            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-            "dev": true,
-            "engines": {
-                "node": ">=10"
-            },
-            "funding": {
-                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-            }
-        },
-        "node_modules/@testing-library/dom/node_modules/react-is": {
-            "version": "17.0.2",
-            "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
-            "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
-            "dev": true
-        },
         "node_modules/@testing-library/dom/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -5089,9 +5270,9 @@
             }
         },
         "node_modules/@testing-library/jest-dom": {
-            "version": "6.4.6",
-            "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.4.6.tgz",
-            "integrity": "sha512-8qpnGVincVDLEcQXWaHOf6zmlbwTKc6Us6PPu4CRnPXCzo2OGBS5cwgMMOWdxDpEz1mkbvXHpEy99M5Yvt682w==",
+            "version": "6.4.8",
+            "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.4.8.tgz",
+            "integrity": "sha512-JD0G+Zc38f5MBHA4NgxQMR5XtO5Jx9g86jqturNTt2WUfRmLDIY7iKkWHDCCTiDuFMre6nxAD5wHw9W5kI4rGw==",
             "dev": true,
             "dependencies": {
                 "@adobe/css-tools": "^4.4.0",
@@ -5107,30 +5288,6 @@
                 "node": ">=14",
                 "npm": ">=6",
                 "yarn": ">=1"
-            },
-            "peerDependencies": {
-                "@jest/globals": ">= 28",
-                "@types/bun": "latest",
-                "@types/jest": ">= 28",
-                "jest": ">= 28",
-                "vitest": ">= 0.32"
-            },
-            "peerDependenciesMeta": {
-                "@jest/globals": {
-                    "optional": true
-                },
-                "@types/bun": {
-                    "optional": true
-                },
-                "@types/jest": {
-                    "optional": true
-                },
-                "jest": {
-                    "optional": true
-                },
-                "vitest": {
-                    "optional": true
-                }
             }
         },
         "node_modules/@testing-library/jest-dom/node_modules/ansi-styles": {
@@ -5364,9 +5521,9 @@
             }
         },
         "node_modules/@types/eslint": {
-            "version": "8.56.10",
-            "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.10.tgz",
-            "integrity": "sha512-Shavhk87gCtY2fhXDctcfS3e6FdxWkCx1iUZ9eEUbh7rTqlZT0/IzOkCOVt0fCjcFuZ9FPYfuezTBImfHCDBGQ==",
+            "version": "9.6.0",
+            "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.0.tgz",
+            "integrity": "sha512-gi6WQJ7cHRgZxtkQEoyHMppPjq9Kxo5Tjn2prSKDSmZrCz8TZ3jSRCeTJm+WoM+oB0WG37bRqLzaaU3q7JypGg==",
             "dev": true,
             "dependencies": {
                 "@types/estree": "*",
@@ -5492,6 +5649,38 @@
                 "pretty-format": "^29.0.0"
             }
         },
+        "node_modules/@types/jest/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/@types/jest/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/@types/jest/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/@types/jsdom": {
             "version": "20.0.1",
             "resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-20.0.1.tgz",
@@ -5517,9 +5706,9 @@
             "peer": true
         },
         "node_modules/@types/lodash": {
-            "version": "4.17.6",
-            "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.6.tgz",
-            "integrity": "sha512-OpXEVoCKSS3lQqjx9GGGOapBeuW5eUboYHRlHP9urXPX25IKZ6AnP5ZRxtVf63iieUbsHxLn8NQ5Nlftc6yzAA=="
+            "version": "4.17.7",
+            "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.7.tgz",
+            "integrity": "sha512-8wTvZawATi/lsmNu10/j2hk1KEP0IvjubqPE3cu1Xz7xfXXt5oCq3SNUz4fMIP4XGF9Ky+Ue2tBA3hcS7LSBlA=="
         },
         "node_modules/@types/lodash.set": {
             "version": "4.3.9",
@@ -5711,9 +5900,9 @@
             "dev": true
         },
         "node_modules/@types/ws": {
-            "version": "8.5.10",
-            "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.10.tgz",
-            "integrity": "sha512-vmQSUcfalpIq0R9q7uTo2lXs6eGIpt9wtnLdMv9LVpIjCA/+ufZRozlVoVelIYixx1ugCBKDhn89vnsEGOCx9A==",
+            "version": "8.5.11",
+            "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.11.tgz",
+            "integrity": "sha512-4+q7P5h3SpJxaBft0Dzpbr6lmMaqh0Jr2tbhJZ/luAwvD7ohSCniYkwz/pLxuT2h0EOa6QADgJj1Ko+TzRfZ+w==",
             "dev": true,
             "dependencies": {
                 "@types/node": "*"
@@ -5770,9 +5959,9 @@
             }
         },
         "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -5895,9 +6084,9 @@
             }
         },
         "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -5932,9 +6121,9 @@
             }
         },
         "node_modules/@typescript-eslint/utils/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -6295,15 +6484,15 @@
             }
         },
         "node_modules/ajv": {
-            "version": "8.16.0",
-            "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.16.0.tgz",
-            "integrity": "sha512-F0twR8U1ZU67JIEtekUcLkXkoO5mMMmgGD8sK/xUFzJ805jxHQl92hImFAqqXMyMYjSPOyUPAwHYhB72g5sTXw==",
+            "version": "8.17.1",
+            "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
+            "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
             "dev": true,
             "dependencies": {
                 "fast-deep-equal": "^3.1.3",
+                "fast-uri": "^3.0.1",
                 "json-schema-traverse": "^1.0.0",
-                "require-from-string": "^2.0.2",
-                "uri-js": "^4.4.1"
+                "require-from-string": "^2.0.2"
             },
             "funding": {
                 "type": "github",
@@ -6414,9 +6603,13 @@
             "dev": true
         },
         "node_modules/argparse": {
-            "version": "2.0.1",
-            "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
-            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q=="
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+            "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+            "dev": true,
+            "dependencies": {
+                "sprintf-js": "~1.0.2"
+            }
         },
         "node_modules/aria-query": {
             "version": "5.3.0",
@@ -6590,18 +6783,6 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
-        "node_modules/array.prototype.toreversed": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/array.prototype.toreversed/-/array.prototype.toreversed-1.1.2.tgz",
-            "integrity": "sha512-wwDCoT4Ck4Cz7sLtgUmzR5UV3YF5mFHUlbChCzZBQZ+0m2cl/DH3tKgvphv1nKgFsJ48oCSg6p91q2Vm0I/ZMA==",
-            "dev": true,
-            "dependencies": {
-                "call-bind": "^1.0.2",
-                "define-properties": "^1.2.0",
-                "es-abstract": "^1.22.1",
-                "es-shim-unscopables": "^1.0.0"
-            }
-        },
         "node_modules/array.prototype.tosorted": {
             "version": "1.1.4",
             "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.4.tgz",
@@ -7918,6 +8099,22 @@
                 "typescript": ">=4"
             }
         },
+        "node_modules/cosmiconfig/node_modules/argparse": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q=="
+        },
+        "node_modules/cosmiconfig/node_modules/js-yaml": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
+            "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+            "dependencies": {
+                "argparse": "^2.0.1"
+            },
+            "bin": {
+                "js-yaml": "bin/js-yaml.js"
+            }
+        },
         "node_modules/crc-32": {
             "version": "1.2.2",
             "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
@@ -8129,9 +8326,9 @@
             }
         },
         "node_modules/css-loader/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -8378,9 +8575,9 @@
             }
         },
         "node_modules/dayjs": {
-            "version": "1.11.11",
-            "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.11.tgz",
-            "integrity": "sha512-okzr3f11N6WuqYtZSvm+F776mB41wRZMhKP+hc34YdW+KmtYYK9iqvHSwo2k9FEH3fhGXvOPV6yz2IcSrfRUDg=="
+            "version": "1.11.12",
+            "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.12.tgz",
+            "integrity": "sha512-Rt2g+nTbLlDWZTwwrIXjy9MeiZmSDI375FvZs72ngxx8PDC6YXOeR3q5LAuPzjZQxhiWdRKac7RKV+YyQYfYIg=="
         },
         "node_modules/debounce": {
             "version": "2.1.0",
@@ -8449,10 +8646,18 @@
             "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA=="
         },
         "node_modules/dedent": {
-            "version": "0.7.0",
-            "resolved": "https://registry.npmjs.org/dedent/-/dedent-0.7.0.tgz",
-            "integrity": "sha512-Q6fKUPqnAHAyhiUgFU7BUzLiv0kd8saH9al7tnu5Q/okj6dnupxyTgFIBjVzJATdfIAm9NAsvXNzjaKa+bxVyA==",
-            "dev": true
+            "version": "1.5.3",
+            "resolved": "https://registry.npmjs.org/dedent/-/dedent-1.5.3.tgz",
+            "integrity": "sha512-NHQtfOOW68WD8lgypbLA5oT+Bt0xXJhiYvoR6SmmNXZfpzOGXwdKWmcwG8N7PwVVWV3eF/68nmD9BaJSsTBhyQ==",
+            "dev": true,
+            "peerDependencies": {
+                "babel-plugin-macros": "^3.1.0"
+            },
+            "peerDependenciesMeta": {
+                "babel-plugin-macros": {
+                    "optional": true
+                }
+            }
         },
         "node_modules/deep-diff": {
             "version": "1.0.2",
@@ -8478,9 +8683,9 @@
             "dev": true
         },
         "node_modules/deepmerge": {
-            "version": "2.2.1",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
-            "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
+            "version": "4.3.1",
+            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
+            "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
             "engines": {
                 "node": ">=0.10.0"
             }
@@ -8992,9 +9197,9 @@
             }
         },
         "node_modules/electron-to-chromium": {
-            "version": "1.4.823",
-            "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.823.tgz",
-            "integrity": "sha512-4h+oPeAiGQOHFyUJOqpoEcPj/xxlicxBzOErVeYVMMmAiXUXsGpsFd0QXBMaUUbnD8hhSfLf9uw+MlsoIA7j5w=="
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.1.tgz",
+            "integrity": "sha512-FKbOCOQ5QRB3VlIbl1LZQefWIYwszlBloaXcY2rbfpu9ioJnNh3TK03YtIDKDo3WKBi8u+YV4+Fn2CkEozgf4w=="
         },
         "node_modules/emittery": {
             "version": "0.13.1",
@@ -9041,9 +9246,9 @@
             }
         },
         "node_modules/enhanced-resolve": {
-            "version": "5.17.0",
-            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.17.0.tgz",
-            "integrity": "sha512-dwDPwZL0dmye8Txp2gzFmA6sxALaSvdRDjPH0viLcKrtlOL3tw62nWWweVD1SdILDTJrbrL6tdWVN58Wo6U3eA==",
+            "version": "5.17.1",
+            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.17.1.tgz",
+            "integrity": "sha512-LMHl3dXhTcfv8gM4kEzIUeTQ+7fpdA0l2tUf34BddXPkz2A5xJ5L/Pchd5BL6rdccM9QGvu0sWZzK1Z1t4wwyg==",
             "dev": true,
             "dependencies": {
                 "graceful-fs": "^4.2.4",
@@ -9819,9 +10024,9 @@
             }
         },
         "node_modules/eslint-plugin-deprecation/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "peer": true,
             "bin": {
@@ -10083,9 +10288,9 @@
             }
         },
         "node_modules/eslint-plugin-jest/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -10111,13 +10316,13 @@
             }
         },
         "node_modules/eslint-plugin-prettier": {
-            "version": "5.1.3",
-            "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.1.3.tgz",
-            "integrity": "sha512-C9GCVAs4Eq7ZC/XFQHITLiHJxQngdtraXaM+LoUFoFp/lHNl2Zn8f3WQbe9HvTBBQ9YnKFB0/2Ajdqwo5D1EAw==",
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.2.1.tgz",
+            "integrity": "sha512-gH3iR3g4JfF+yYPaJYkN7jEl9QbweL/YfkoRlNnuIEHEz1vHVlCmWOS+eGGiRuzHQXdJFCOTxRgvju9b8VUmrw==",
             "dev": true,
             "dependencies": {
                 "prettier-linter-helpers": "^1.0.0",
-                "synckit": "^0.8.6"
+                "synckit": "^0.9.1"
             },
             "engines": {
                 "node": "^14.18.0 || >=16.0.0"
@@ -10141,35 +10346,35 @@
             }
         },
         "node_modules/eslint-plugin-react": {
-            "version": "7.34.3",
-            "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.34.3.tgz",
-            "integrity": "sha512-aoW4MV891jkUulwDApQbPYTVZmeuSyFrudpbTAQuj5Fv8VL+o6df2xIGpw8B0hPjAaih1/Fb0om9grCdyFYemA==",
+            "version": "7.35.0",
+            "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.35.0.tgz",
+            "integrity": "sha512-v501SSMOWv8gerHkk+IIQBkcGRGrO2nfybfj5pLxuJNFTPxxA3PSryhXTK+9pNbtkggheDdsC0E9Q8CuPk6JKA==",
             "dev": true,
             "dependencies": {
                 "array-includes": "^3.1.8",
                 "array.prototype.findlast": "^1.2.5",
                 "array.prototype.flatmap": "^1.3.2",
-                "array.prototype.toreversed": "^1.1.2",
                 "array.prototype.tosorted": "^1.1.4",
                 "doctrine": "^2.1.0",
                 "es-iterator-helpers": "^1.0.19",
                 "estraverse": "^5.3.0",
+                "hasown": "^2.0.2",
                 "jsx-ast-utils": "^2.4.1 || ^3.0.0",
                 "minimatch": "^3.1.2",
                 "object.entries": "^1.1.8",
                 "object.fromentries": "^2.0.8",
-                "object.hasown": "^1.1.4",
                 "object.values": "^1.2.0",
                 "prop-types": "^15.8.1",
                 "resolve": "^2.0.0-next.5",
                 "semver": "^6.3.1",
-                "string.prototype.matchall": "^4.0.11"
+                "string.prototype.matchall": "^4.0.11",
+                "string.prototype.repeat": "^1.0.0"
             },
             "engines": {
                 "node": ">=4"
             },
             "peerDependencies": {
-                "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8"
+                "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7"
             }
         },
         "node_modules/eslint-plugin-react-hooks": {
@@ -10185,9 +10390,9 @@
             }
         },
         "node_modules/eslint-plugin-react-refresh": {
-            "version": "0.4.8",
-            "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.8.tgz",
-            "integrity": "sha512-MIKAclwaDFIiYtVBLzDdm16E+Ty4GwhB6wZlCAG1R3Ur+F9Qbo6PRxpA5DK7XtDgm+WlCoAY2WxAwqhmIDHg6Q==",
+            "version": "0.4.9",
+            "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.9.tgz",
+            "integrity": "sha512-QK49YrBAo5CLNLseZ7sZgvgTy21E6NEw22eZqc4teZfH8pxV3yXc9XXOYfUI6JNpw7mfHNkAeWtBxrTyykB6HA==",
             "dev": true,
             "peerDependencies": {
                 "eslint": ">=7"
@@ -10390,9 +10595,9 @@
             }
         },
         "node_modules/eslint-plugin-testing-library/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "peer": true,
             "bin": {
@@ -10466,6 +10671,17 @@
                 "webpack": "^5.0.0"
             }
         },
+        "node_modules/eslint-webpack-plugin/node_modules/@types/eslint": {
+            "version": "8.56.11",
+            "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.11.tgz",
+            "integrity": "sha512-sVBpJMf7UPo/wGecYOpk2aQya2VUGeHhe38WG7/mN5FufNSubf5VT9Uh9Uyp8/eLJpu1/tuhJ/qTo4mhSB4V4Q==",
+            "dev": true,
+            "peer": true,
+            "dependencies": {
+                "@types/estree": "*",
+                "@types/json-schema": "*"
+            }
+        },
         "node_modules/eslint-webpack-plugin/node_modules/schema-utils": {
             "version": "4.2.0",
             "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.2.0.tgz",
@@ -10517,6 +10733,12 @@
                 "url": "https://github.com/chalk/ansi-styles?sponsor=1"
             }
         },
+        "node_modules/eslint/node_modules/argparse": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+            "dev": true
+        },
         "node_modules/eslint/node_modules/brace-expansion": {
             "version": "1.1.11",
             "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -10625,14 +10847,26 @@
                 "node": ">=8"
             }
         },
-        "node_modules/eslint/node_modules/json-schema-traverse": {
-            "version": "0.4.1",
-            "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-            "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
-            "dev": true
-        },
-        "node_modules/eslint/node_modules/minimatch": {
-            "version": "3.1.2",
+        "node_modules/eslint/node_modules/js-yaml": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
+            "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+            "dev": true,
+            "dependencies": {
+                "argparse": "^2.0.1"
+            },
+            "bin": {
+                "js-yaml": "bin/js-yaml.js"
+            }
+        },
+        "node_modules/eslint/node_modules/json-schema-traverse": {
+            "version": "0.4.1",
+            "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+            "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+            "dev": true
+        },
+        "node_modules/eslint/node_modules/minimatch": {
+            "version": "3.1.2",
             "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
             "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
             "dev": true,
@@ -10958,6 +11192,12 @@
             "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
             "dev": true
         },
+        "node_modules/fast-uri": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.0.1.tgz",
+            "integrity": "sha512-MWipKbbYiYI0UC7cl8m/i/IWTqfC8YXsqjzybjddLsFjStroQzsHXkc73JutMvBiXmOvapk+axIl79ig5t55Bw==",
+            "dev": true
+        },
         "node_modules/fastest-levenshtein": {
             "version": "1.0.16",
             "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz",
@@ -11241,6 +11481,14 @@
                 "react": ">=16.8.0"
             }
         },
+        "node_modules/formik/node_modules/deepmerge": {
+            "version": "2.2.1",
+            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
+            "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
         "node_modules/forwarded": {
             "version": "0.2.0",
             "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
@@ -11445,9 +11693,9 @@
             }
         },
         "node_modules/get-tsconfig": {
-            "version": "4.7.5",
-            "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.7.5.tgz",
-            "integrity": "sha512-ZCuZCnlqNzjb4QprAzXKdpp/gh6KTxSJuw3IBsPnV/7fV4NxC9ckB+vPTt8w7fJA0TaSD7c55BR47JD6MEDyDw==",
+            "version": "4.7.6",
+            "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.7.6.tgz",
+            "integrity": "sha512-ZAqrLlu18NbDdRaHq+AKXzAmqIUPswPWKUchfytdAjiRFnCe5ojG2bstg6mRiZabkKfCoL/e98pbBELIV/YCeA==",
             "dev": true,
             "peer": true,
             "dependencies": {
@@ -12181,9 +12429,9 @@
             "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ=="
         },
         "node_modules/immutable": {
-            "version": "4.3.6",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz",
-            "integrity": "sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==",
+            "version": "4.3.7",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.7.tgz",
+            "integrity": "sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==",
             "dev": true
         },
         "node_modules/import-fresh": {
@@ -12210,9 +12458,9 @@
             }
         },
         "node_modules/import-local": {
-            "version": "3.1.0",
-            "resolved": "https://registry.npmjs.org/import-local/-/import-local-3.1.0.tgz",
-            "integrity": "sha512-ASB07uLtnDs1o6EHjKpX34BKYDSqnFerfTOJL2HvMqF70LnxpjkzDB8J44oT9pu4AMPkQwf8jl6szgvNd2tRIg==",
+            "version": "3.2.0",
+            "resolved": "https://registry.npmjs.org/import-local/-/import-local-3.2.0.tgz",
+            "integrity": "sha512-2SPlun1JUPWoM6t3F0dw0FkCF/jWY8kttcY4f599GLTSjh2OCuuhdTkJQsEcZzBqbXZGKMK2OqW1oZsjtf/gQA==",
             "dev": true,
             "dependencies": {
                 "pkg-dir": "^4.2.0",
@@ -12400,9 +12648,9 @@
             }
         },
         "node_modules/is-core-module": {
-            "version": "2.14.0",
-            "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.14.0.tgz",
-            "integrity": "sha512-a5dFJih5ZLYlRtDc0dZWP7RiKr6xIKzmn/oAYCDvdLThadVgyJwlaoQPmRtMSpz+rk0OGAgIu+TcM9HUF0fk1A==",
+            "version": "2.15.0",
+            "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.0.tgz",
+            "integrity": "sha512-Dd+Lb2/zvk9SKy1TGCt1wFJFo/MWBPMX5x7KcvLajWTGuomczdQX61PvY5yK6SVACwpoexWo81IfFyoKY2QnTA==",
             "dev": true,
             "dependencies": {
                 "hasown": "^2.0.2"
@@ -12919,9 +13167,9 @@
             }
         },
         "node_modules/istanbul-lib-report/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -12983,15 +13231,12 @@
             }
         },
         "node_modules/jackspeak": {
-            "version": "3.4.2",
-            "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.2.tgz",
-            "integrity": "sha512-qH3nOSj8q/8+Eg8LUPOq3C+6HWkpUioIjDsq1+D4zY91oZvpPttw8GwtF1nReRYKXl+1AORyFqtm2f5Q1SB6/Q==",
+            "version": "3.4.3",
+            "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
+            "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
             "dependencies": {
                 "@isaacs/cliui": "^8.0.2"
             },
-            "engines": {
-                "node": "14 >=14.21 || 16 >=16.20 || >=18"
-            },
             "funding": {
                 "url": "https://github.com/sponsors/isaacs"
             },
@@ -13000,9 +13245,9 @@
             }
         },
         "node_modules/jake": {
-            "version": "10.9.1",
-            "resolved": "https://registry.npmjs.org/jake/-/jake-10.9.1.tgz",
-            "integrity": "sha512-61btcOHNnLnsOdtLgA5efqQWjnSi/vow5HbI7HMdKKWqvrKR1bLK3BPlJn9gcSaP2ewuamUSMB5XEy76KUIS2w==",
+            "version": "10.9.2",
+            "resolved": "https://registry.npmjs.org/jake/-/jake-10.9.2.tgz",
+            "integrity": "sha512-2P4SQ0HrLQ+fw6llpLnOaGAvN2Zu6778SJMrCUwns4fOoG9ayrTiZk3VV8sCPkVZF8ab0zksVpS8FDY5pRCNBA==",
             "dev": true,
             "dependencies": {
                 "async": "^3.2.3",
@@ -13229,20 +13474,6 @@
             "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
             "dev": true
         },
-        "node_modules/jest-circus/node_modules/dedent": {
-            "version": "1.5.3",
-            "resolved": "https://registry.npmjs.org/dedent/-/dedent-1.5.3.tgz",
-            "integrity": "sha512-NHQtfOOW68WD8lgypbLA5oT+Bt0xXJhiYvoR6SmmNXZfpzOGXwdKWmcwG8N7PwVVWV3eF/68nmD9BaJSsTBhyQ==",
-            "dev": true,
-            "peerDependencies": {
-                "babel-plugin-macros": "^3.1.0"
-            },
-            "peerDependenciesMeta": {
-                "babel-plugin-macros": {
-                    "optional": true
-                }
-            }
-        },
         "node_modules/jest-circus/node_modules/has-flag": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
@@ -13252,6 +13483,38 @@
                 "node": ">=8"
             }
         },
+        "node_modules/jest-circus/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-circus/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-circus/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-circus/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -13471,15 +13734,6 @@
             "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
             "dev": true
         },
-        "node_modules/jest-config/node_modules/deepmerge": {
-            "version": "4.3.1",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
-            "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
-            "dev": true,
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
         "node_modules/jest-config/node_modules/glob": {
             "version": "7.2.3",
             "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
@@ -13522,6 +13776,38 @@
                 "node": "*"
             }
         },
+        "node_modules/jest-config/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-config/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-config/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-config/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -13607,6 +13893,38 @@
                 "node": ">=8"
             }
         },
+        "node_modules/jest-diff/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-diff/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-diff/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-diff/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -13705,6 +14023,38 @@
                 "node": ">=8"
             }
         },
+        "node_modules/jest-each/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-each/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-each/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-each/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -13910,6 +14260,38 @@
                 "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
             }
         },
+        "node_modules/jest-leak-detector/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-leak-detector/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-leak-detector/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-matcher-utils": {
             "version": "29.7.0",
             "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-29.7.0.tgz",
@@ -13983,6 +14365,38 @@
                 "node": ">=8"
             }
         },
+        "node_modules/jest-matcher-utils/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-matcher-utils/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-matcher-utils/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-matcher-utils/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -14073,35 +14487,67 @@
                 "node": ">=8"
             }
         },
-        "node_modules/jest-message-util/node_modules/supports-color": {
-            "version": "7.2.0",
-            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-            "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-            "dev": true,
-            "dependencies": {
-                "has-flag": "^4.0.0"
-            },
-            "engines": {
-                "node": ">=8"
-            }
-        },
-        "node_modules/jest-mock": {
+        "node_modules/jest-message-util/node_modules/pretty-format": {
             "version": "29.7.0",
-            "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-29.7.0.tgz",
-            "integrity": "sha512-ITOMZn+UkYS4ZFh83xYAOzWStloNzJFO2s8DWrE4lhtGD+AorgnbkiKERe4wQVBydIGPx059g6riW5Btp6Llnw==",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
             "dev": true,
             "dependencies": {
-                "@jest/types": "^29.6.3",
-                "@types/node": "*",
-                "jest-util": "^29.7.0"
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
             },
             "engines": {
                 "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
             }
         },
-        "node_modules/jest-pnp-resolver": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.3.tgz",
+        "node_modules/jest-message-util/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-message-util/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
+        "node_modules/jest-message-util/node_modules/supports-color": {
+            "version": "7.2.0",
+            "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+            "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+            "dev": true,
+            "dependencies": {
+                "has-flag": "^4.0.0"
+            },
+            "engines": {
+                "node": ">=8"
+            }
+        },
+        "node_modules/jest-mock": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-29.7.0.tgz",
+            "integrity": "sha512-ITOMZn+UkYS4ZFh83xYAOzWStloNzJFO2s8DWrE4lhtGD+AorgnbkiKERe4wQVBydIGPx059g6riW5Btp6Llnw==",
+            "dev": true,
+            "dependencies": {
+                "@jest/types": "^29.6.3",
+                "@types/node": "*",
+                "jest-util": "^29.7.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-pnp-resolver": {
+            "version": "1.2.3",
+            "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.3.tgz",
             "integrity": "sha512-+3NpwQEnRoIBtx4fyhblQDPgJI0H1IEIkX7ShLUjPGA7TtUTvI1oiKi3SR4oBR0hQhQR80l4WAe5RrXBwWMA8w==",
             "dev": true,
             "engines": {
@@ -14318,16 +14764,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/jest-runner/node_modules/source-map-support": {
-            "version": "0.5.13",
-            "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
-            "integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
-            "dev": true,
-            "dependencies": {
-                "buffer-from": "^1.0.0",
-                "source-map": "^0.6.0"
-            }
-        },
         "node_modules/jest-runner/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -14474,15 +14910,6 @@
                 "node": "*"
             }
         },
-        "node_modules/jest-runtime/node_modules/strip-bom": {
-            "version": "4.0.0",
-            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-4.0.0.tgz",
-            "integrity": "sha512-3xurFv5tEgii33Zi8Jtp55wEIILR9eh34FAW00PZf+JnSsTmV/ioewSgQl97JHvgjoRGwPShsWm+IdrxB35d0w==",
-            "dev": true,
-            "engines": {
-                "node": ">=8"
-            }
-        },
         "node_modules/jest-runtime/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -14584,10 +15011,42 @@
                 "node": ">=8"
             }
         },
+        "node_modules/jest-snapshot/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-snapshot/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-snapshot/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-snapshot/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -14776,6 +15235,38 @@
                 "node": ">=8"
             }
         },
+        "node_modules/jest-validate/node_modules/pretty-format": {
+            "version": "29.7.0",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
+            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "dev": true,
+            "dependencies": {
+                "@jest/schemas": "^29.6.3",
+                "ansi-styles": "^5.0.0",
+                "react-is": "^18.0.0"
+            },
+            "engines": {
+                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+            }
+        },
+        "node_modules/jest-validate/node_modules/pretty-format/node_modules/ansi-styles": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+            "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+            "dev": true,
+            "engines": {
+                "node": ">=10"
+            },
+            "funding": {
+                "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+            }
+        },
+        "node_modules/jest-validate/node_modules/react-is": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "dev": true
+        },
         "node_modules/jest-validate/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -14930,11 +15421,13 @@
             "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
         },
         "node_modules/js-yaml": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
-            "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+            "version": "3.14.1",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz",
+            "integrity": "sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==",
+            "dev": true,
             "dependencies": {
-                "argparse": "^2.0.1"
+                "argparse": "^1.0.7",
+                "esprima": "^4.0.0"
             },
             "bin": {
                 "js-yaml": "bin/js-yaml.js"
@@ -15137,9 +15630,9 @@
             }
         },
         "node_modules/known-css-properties": {
-            "version": "0.31.0",
-            "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.31.0.tgz",
-            "integrity": "sha512-sBPIUGTNF0czz0mwGGUoKKJC8Q7On1GPbCSFPfyEsfHb2DyBG0Y4QtV+EVWpINSaiGKZblDNuF5AezxSgOhesQ==",
+            "version": "0.34.0",
+            "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.34.0.tgz",
+            "integrity": "sha512-tBECoUqNFbyAY4RrbqsBQqDFpGXAEbdD5QKr8kACx3+rnArmuuR22nKQWKazvp07N9yjTyDZaw/20UIH8tL9DQ==",
             "dev": true
         },
         "node_modules/launch-editor": {
@@ -15343,6 +15836,12 @@
                 "node": ">=10"
             }
         },
+        "node_modules/lint-staged/node_modules/dedent": {
+            "version": "0.7.0",
+            "resolved": "https://registry.npmjs.org/dedent/-/dedent-0.7.0.tgz",
+            "integrity": "sha512-Q6fKUPqnAHAyhiUgFU7BUzLiv0kd8saH9al7tnu5Q/okj6dnupxyTgFIBjVzJATdfIAm9NAsvXNzjaKa+bxVyA==",
+            "dev": true
+        },
         "node_modules/lint-staged/node_modules/execa": {
             "version": "4.1.0",
             "resolved": "https://registry.npmjs.org/execa/-/execa-4.1.0.tgz",
@@ -15912,9 +16411,9 @@
             }
         },
         "node_modules/memfs": {
-            "version": "4.9.3",
-            "resolved": "https://registry.npmjs.org/memfs/-/memfs-4.9.3.tgz",
-            "integrity": "sha512-bsYSSnirtYTWi1+OPMFb0M048evMKyUYe0EbtuGQgq6BVQM1g1W8/KIUJCCvjgI/El0j6Q4WsmMiBwLUBSw8LA==",
+            "version": "4.9.4",
+            "resolved": "https://registry.npmjs.org/memfs/-/memfs-4.9.4.tgz",
+            "integrity": "sha512-Xlj8b2rU11nM6+KU6wC7cuWcHQhVINWCUgdPS4Ar9nPxLaOya3RghqK7ALyDW2QtGebYAYs6uEdEVnwPVT942A==",
             "dev": true,
             "dependencies": {
                 "@jsonjoy.com/json-pack": "^1.0.3",
@@ -16157,9 +16656,9 @@
             }
         },
         "node_modules/mobx": {
-            "version": "6.13.0",
-            "resolved": "https://registry.npmjs.org/mobx/-/mobx-6.13.0.tgz",
-            "integrity": "sha512-1laWODrBWmB7mDJ8EClCjUQTyLwJ0ydJgE4FtK7t9r3JnjXgc9OhmYs2P4RtHrY1co5+4T6cKP2UswX2SU29mA==",
+            "version": "6.13.1",
+            "resolved": "https://registry.npmjs.org/mobx/-/mobx-6.13.1.tgz",
+            "integrity": "sha512-ekLRxgjWJr8hVxj9ZKuClPwM/iHckx3euIJ3Np7zLVNtqJvfbbq7l370W/98C8EabdQ1pB5Jd3BbDWxJPNnaOg==",
             "funding": {
                 "type": "opencollective",
                 "url": "https://opencollective.com/mobx"
@@ -16317,11 +16816,14 @@
                 "path-to-regexp": "^6.2.1"
             }
         },
-        "node_modules/nise/node_modules/path-to-regexp": {
-            "version": "6.2.2",
-            "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.2.2.tgz",
-            "integrity": "sha512-GQX3SSMokngb36+whdpRXE+3f9V8UzyAorlYvOGx87ufGHehNTn5lCxrKtLyZ4Yl/wEKnNnr98ZzOwwDZV5ogw==",
-            "peer": true
+        "node_modules/nise/node_modules/@sinonjs/fake-timers": {
+            "version": "11.2.2",
+            "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-11.2.2.tgz",
+            "integrity": "sha512-G2piCSxQ7oWOxwGSAyFHfPIsyeJGXYtc6mFbnFA+kRXkiEnTl8c/8jul2S329iFBnDI9HGoeWWAZvuvOkZccgw==",
+            "peer": true,
+            "dependencies": {
+                "@sinonjs/commons": "^3.0.0"
+            }
         },
         "node_modules/no-case": {
             "version": "3.0.4",
@@ -16348,9 +16850,9 @@
             "dev": true
         },
         "node_modules/node-releases": {
-            "version": "2.0.14",
-            "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
-            "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw=="
+            "version": "2.0.18",
+            "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz",
+            "integrity": "sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g=="
         },
         "node_modules/normalize-package-data": {
             "version": "3.0.3",
@@ -16368,9 +16870,9 @@
             }
         },
         "node_modules/normalize-package-data/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -16428,9 +16930,9 @@
             }
         },
         "node_modules/nwsapi": {
-            "version": "2.2.10",
-            "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.10.tgz",
-            "integrity": "sha512-QK0sRs7MKv0tKe1+5uZIQk/C8XGza4DAnztJG8iD+TpJIORARrCxczA738awHrZoHeTjSSoHqao2teO0dC/gFQ=="
+            "version": "2.2.12",
+            "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.12.tgz",
+            "integrity": "sha512-qXDmcVlZV4XRtKFzddidpfVP4oMSGhga+xdMc25mv8kaLUHtgzCDhUxkrN8exkGdTlLNaXj7CV3GtON7zuGZ+w=="
         },
         "node_modules/object-assign": {
             "version": "4.1.1",
@@ -16525,23 +17027,6 @@
                 "node": ">= 0.4"
             }
         },
-        "node_modules/object.hasown": {
-            "version": "1.1.4",
-            "resolved": "https://registry.npmjs.org/object.hasown/-/object.hasown-1.1.4.tgz",
-            "integrity": "sha512-FZ9LZt9/RHzGySlBARE3VF+gE26TxR38SdmqOqliuTnl9wrKulaQs+4dee1V+Io8VfxqzAfHu6YuRgUy8OHoTg==",
-            "dev": true,
-            "dependencies": {
-                "define-properties": "^1.2.1",
-                "es-abstract": "^1.23.2",
-                "es-object-atoms": "^1.0.0"
-            },
-            "engines": {
-                "node": ">= 0.4"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/ljharb"
-            }
-        },
         "node_modules/object.values": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.0.tgz",
@@ -16846,6 +17331,12 @@
             "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
             "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ=="
         },
+        "node_modules/path-to-regexp": {
+            "version": "6.2.2",
+            "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.2.2.tgz",
+            "integrity": "sha512-GQX3SSMokngb36+whdpRXE+3f9V8UzyAorlYvOGx87ufGHehNTn5lCxrKtLyZ4Yl/wEKnNnr98ZzOwwDZV5ogw==",
+            "peer": true
+        },
         "node_modules/path-type": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
@@ -17008,9 +17499,9 @@
             }
         },
         "node_modules/postcss": {
-            "version": "8.4.39",
-            "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.39.tgz",
-            "integrity": "sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==",
+            "version": "8.4.40",
+            "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.40.tgz",
+            "integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==",
             "dev": true,
             "funding": [
                 {
@@ -17136,9 +17627,9 @@
             }
         },
         "node_modules/postcss-resolve-nested-selector": {
-            "version": "0.1.1",
-            "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz",
-            "integrity": "sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw==",
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.4.tgz",
+            "integrity": "sha512-R6vHqZWgVnTAPq0C+xjyHfEZqfIYboCBVSy24MjxEDm+tIh1BU4O6o7DP7AA7kHzf136d+Qc5duI4tlpHjixDw==",
             "dev": true
         },
         "node_modules/postcss-safe-parser": {
@@ -17194,9 +17685,9 @@
             }
         },
         "node_modules/postcss-selector-parser": {
-            "version": "6.1.0",
-            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz",
-            "integrity": "sha512-UMz42UD0UY0EApS0ZL9o1XnLhSTtvvvLe5Dc2H2O56fvRZi+KulDyf5ctDhhtYJBGKStV2FL1fy6253cmLgqVQ==",
+            "version": "6.1.1",
+            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz",
+            "integrity": "sha512-b4dlw/9V8A71rLIDsSwVmak9z2DuBUB7CA1/wSdelNEzqsjoSPeADTWNO09lpH49Diy3/JIZ2bSPB1dI3LJCHg==",
             "dev": true,
             "dependencies": {
                 "cssesc": "^3.0.0",
@@ -17231,9 +17722,9 @@
             }
         },
         "node_modules/prettier": {
-            "version": "3.3.2",
-            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.2.tgz",
-            "integrity": "sha512-rAVeHYMcv8ATV5d508CFdn+8/pHPpXeIid1DdrPwXnaAdH7cqjVbpJaT5eq4yRAFU/lsbwYwSF/n5iNrdJHPQA==",
+            "version": "3.3.3",
+            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
+            "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
             "dev": true,
             "bin": {
                 "prettier": "bin/prettier.cjs"
@@ -17268,17 +17759,17 @@
             }
         },
         "node_modules/pretty-format": {
-            "version": "29.7.0",
-            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-            "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
+            "version": "27.5.1",
+            "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
+            "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
             "dev": true,
             "dependencies": {
-                "@jest/schemas": "^29.6.3",
+                "ansi-regex": "^5.0.1",
                 "ansi-styles": "^5.0.0",
-                "react-is": "^18.0.0"
+                "react-is": "^17.0.1"
             },
             "engines": {
-                "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+                "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
             }
         },
         "node_modules/pretty-format/node_modules/ansi-styles": {
@@ -17294,9 +17785,9 @@
             }
         },
         "node_modules/pretty-format/node_modules/react-is": {
-            "version": "18.3.1",
-            "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-            "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+            "version": "17.0.2",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
+            "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
             "dev": true
         },
         "node_modules/process-nextick-args": {
@@ -17636,14 +18127,6 @@
             "resolved": "https://registry.npmjs.org/@gilbarbara/deep-equal/-/deep-equal-0.1.2.tgz",
             "integrity": "sha512-jk+qzItoEb0D0xSSmrKDDzf9sheQj/BAPxlgNxgmOaA3mxpUa6ndJLYGZKsJnIVEQSD8zcTbyILz7I0HcnBCRA=="
         },
-        "node_modules/react-floater/node_modules/deepmerge": {
-            "version": "4.3.1",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
-            "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
         "node_modules/react-floater/node_modules/is-lite": {
             "version": "0.8.2",
             "resolved": "https://registry.npmjs.org/is-lite/-/is-lite-0.8.2.tgz",
@@ -17694,18 +18177,10 @@
                 "react-dom": "15 - 18"
             }
         },
-        "node_modules/react-joyride/node_modules/deepmerge": {
-            "version": "4.3.1",
-            "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
-            "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
-            "engines": {
-                "node": ">=0.10.0"
-            }
-        },
         "node_modules/react-joyride/node_modules/type-fest": {
-            "version": "4.21.0",
-            "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.21.0.tgz",
-            "integrity": "sha512-ADn2w7hVPcK6w1I0uWnM//y1rLXZhzB9mr0a3OirzclKF1Wp6VzevUmzz/NRAWunOT6E8HrnpGY7xOfc6K57fA==",
+            "version": "4.23.0",
+            "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.23.0.tgz",
+            "integrity": "sha512-ZiBujro2ohr5+Z/hZWHESLz3g08BBdrdLMieYFULJO+tWc437sn8kQsWLJoZErY8alNhxre9K4p3GURAG11n+w==",
             "engines": {
                 "node": ">=16"
             },
@@ -18461,133 +18936,425 @@
                 "tslib": "^2.1.0"
             }
         },
-        "node_modules/safe-array-concat": {
-            "version": "1.1.2",
-            "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
-            "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
+        "node_modules/safe-array-concat": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
+            "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
+            "dev": true,
+            "dependencies": {
+                "call-bind": "^1.0.7",
+                "get-intrinsic": "^1.2.4",
+                "has-symbols": "^1.0.3",
+                "isarray": "^2.0.5"
+            },
+            "engines": {
+                "node": ">=0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/safe-buffer": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+            "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+            "dev": true,
+            "funding": [
+                {
+                    "type": "github",
+                    "url": "https://github.com/sponsors/feross"
+                },
+                {
+                    "type": "patreon",
+                    "url": "https://www.patreon.com/feross"
+                },
+                {
+                    "type": "consulting",
+                    "url": "https://feross.org/support"
+                }
+            ]
+        },
+        "node_modules/safe-regex-test": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
+            "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
+            "dev": true,
+            "dependencies": {
+                "call-bind": "^1.0.6",
+                "es-errors": "^1.3.0",
+                "is-regex": "^1.1.4"
+            },
+            "engines": {
+                "node": ">= 0.4"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/ljharb"
+            }
+        },
+        "node_modules/safer-buffer": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+            "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+        },
+        "node_modules/sass": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.8.tgz",
+            "integrity": "sha512-4UHg6prsrycW20fqLGPShtEvo/WyHRVRHwOP4DzkUrObWoWI05QBSfzU71TVB7PFaL104TwNaHpjlWXAZbQiNQ==",
+            "dev": true,
+            "dependencies": {
+                "chokidar": ">=3.0.0 <4.0.0",
+                "immutable": "^4.0.0",
+                "source-map-js": ">=0.6.2 <2.0.0"
+            },
+            "bin": {
+                "sass": "sass.js"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.77.8.tgz",
+            "integrity": "sha512-WGXA6jcaoBo5Uhw0HX/s6z/sl3zyYQ7ZOnLOJzqwpctFcFmU4L07zn51e2VSkXXFpQZFAdMZNqOGz/7h/fvcRA==",
+            "dev": true,
+            "dependencies": {
+                "@bufbuild/protobuf": "^1.0.0",
+                "buffer-builder": "^0.2.0",
+                "immutable": "^4.0.0",
+                "rxjs": "^7.4.0",
+                "supports-color": "^8.1.1",
+                "varint": "^6.0.0"
+            },
+            "engines": {
+                "node": ">=16.0.0"
+            },
+            "optionalDependencies": {
+                "sass-embedded-android-arm": "1.77.8",
+                "sass-embedded-android-arm64": "1.77.8",
+                "sass-embedded-android-ia32": "1.77.8",
+                "sass-embedded-android-x64": "1.77.8",
+                "sass-embedded-darwin-arm64": "1.77.8",
+                "sass-embedded-darwin-x64": "1.77.8",
+                "sass-embedded-linux-arm": "1.77.8",
+                "sass-embedded-linux-arm64": "1.77.8",
+                "sass-embedded-linux-ia32": "1.77.8",
+                "sass-embedded-linux-musl-arm": "1.77.8",
+                "sass-embedded-linux-musl-arm64": "1.77.8",
+                "sass-embedded-linux-musl-ia32": "1.77.8",
+                "sass-embedded-linux-musl-x64": "1.77.8",
+                "sass-embedded-linux-x64": "1.77.8",
+                "sass-embedded-win32-arm64": "1.77.8",
+                "sass-embedded-win32-ia32": "1.77.8",
+                "sass-embedded-win32-x64": "1.77.8"
+            }
+        },
+        "node_modules/sass-embedded-android-arm": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.77.8.tgz",
+            "integrity": "sha512-GpGL7xZ7V1XpFbnflib/NWbM0euRzineK0iwoo31/ntWKAXGj03iHhGzkSiOwWSFcXgsJJi3eRA5BTmBvK5Q+w==",
+            "cpu": [
+                "arm"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-android-arm64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.77.8.tgz",
+            "integrity": "sha512-EmWHLbEx0Zo/f/lTFzMeH2Du+/I4RmSRlEnERSUKQWVp3aBSO04QDvdxfFezgQ+2Yt/ub9WMqBpma9P/8MPsLg==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-android-ia32": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-android-ia32/-/sass-embedded-android-ia32-1.77.8.tgz",
+            "integrity": "sha512-+GjfJ3lDezPi4dUUyjQBxlNKXNa+XVWsExtGvVNkv1uKyaOxULJhubVo2G6QTJJU0esJdfeXf5Ca5/J0ph7+7w==",
+            "cpu": [
+                "ia32"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-android-x64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.77.8.tgz",
+            "integrity": "sha512-YZbFDzGe5NhaMCygShqkeCWtzjhkWxGVunc7ULR97wmxYPQLPeVyx7XFQZc84Aj0lKAJBJS4qRZeqphMqZEJsQ==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-darwin-arm64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.77.8.tgz",
+            "integrity": "sha512-aifgeVRNE+i43toIkDFFJc/aPLMo0PJ5s5hKb52U+oNdiJE36n65n2L8F/8z3zZRvCa6eYtFY2b7f1QXR3B0LA==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-darwin-x64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.77.8.tgz",
+            "integrity": "sha512-/VWZQtcWIOek60Zj6Sxk6HebXA1Qyyt3sD8o5qwbTgZnKitB1iEBuNunyGoAgMNeUz2PRd6rVki6hvbas9hQ6w==",
+            "cpu": [
+                "x64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-linux-arm": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.77.8.tgz",
+            "integrity": "sha512-2edZMB6jf0whx3T0zlgH+p131kOEmWp+I4wnKj7ZMUeokiY4Up05d10hSvb0Q63lOrSjFAWu6P5/pcYUUx8arQ==",
+            "cpu": [
+                "arm"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-linux-arm64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.77.8.tgz",
+            "integrity": "sha512-6iIOIZtBFa2YfMsHqOb3qake3C9d/zlKxjooKKnTSo+6g6z+CLTzMXe1bOfayb7yxeenElmFoK1k54kWD/40+g==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-linux-ia32": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-ia32/-/sass-embedded-linux-ia32-1.77.8.tgz",
+            "integrity": "sha512-63GsFFHWN5yRLTWiSef32TM/XmjhCBx1DFhoqxmj+Yc6L9Z1h0lDHjjwdG6Sp5XTz5EmsaFKjpDgnQTP9hJX3Q==",
+            "cpu": [
+                "ia32"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-linux-musl-arm": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.77.8.tgz",
+            "integrity": "sha512-nFkhSl3uu9btubm+JBW7uRglNVJ8W8dGfzVqh3fyQJKS1oyBC3vT3VOtfbT9YivXk28wXscSHpqXZwY7bUuopA==",
+            "cpu": [
+                "arm"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-linux-musl-arm64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.77.8.tgz",
+            "integrity": "sha512-j8cgQxNWecYK+aH8ESFsyam/Q6G+9gg8eJegiRVpA9x8yk3ykfHC7UdQWwUcF22ZcuY4zegrjJx8k+thsgsOVA==",
+            "cpu": [
+                "arm64"
+            ],
+            "dev": true,
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/sass-embedded-linux-musl-ia32": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-ia32/-/sass-embedded-linux-musl-ia32-1.77.8.tgz",
+            "integrity": "sha512-oWveMe+8TFlP8WBWPna/+Ec5TV0CE+PxEutyi0ltSruBds2zxRq9dPVOqrpPcDN9QUx50vNZC0Afgch0aQEd0g==",
+            "cpu": [
+                "ia32"
+            ],
             "dev": true,
-            "dependencies": {
-                "call-bind": "^1.0.7",
-                "get-intrinsic": "^1.2.4",
-                "has-symbols": "^1.0.3",
-                "isarray": "^2.0.5"
-            },
+            "optional": true,
+            "os": [
+                "linux"
+            ],
             "engines": {
-                "node": ">=0.4"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/ljharb"
+                "node": ">=14.0.0"
             }
         },
-        "node_modules/safe-buffer": {
-            "version": "5.2.1",
-            "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-            "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+        "node_modules/sass-embedded-linux-musl-x64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.77.8.tgz",
+            "integrity": "sha512-2NtRpMXHeFo9kaYxuZ+Ewwo39CE7BTS2JDfXkTjZTZqd8H+8KC53eBh516YQnn2oiqxSiKxm7a6pxbxGZGwXOQ==",
+            "cpu": [
+                "x64"
+            ],
             "dev": true,
-            "funding": [
-                {
-                    "type": "github",
-                    "url": "https://github.com/sponsors/feross"
-                },
-                {
-                    "type": "patreon",
-                    "url": "https://www.patreon.com/feross"
-                },
-                {
-                    "type": "consulting",
-                    "url": "https://feross.org/support"
-                }
-            ]
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">=14.0.0"
+            }
         },
-        "node_modules/safe-regex-test": {
-            "version": "1.0.3",
-            "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
-            "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
+        "node_modules/sass-embedded-linux-x64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.77.8.tgz",
+            "integrity": "sha512-ND5qZLWUCpOn7LJfOf0gLSZUWhNIysY+7NZK1Ctq+pM6tpJky3JM5I1jSMplNxv5H3o8p80n0gSm+fcjsEFfjQ==",
+            "cpu": [
+                "x64"
+            ],
             "dev": true,
-            "dependencies": {
-                "call-bind": "^1.0.6",
-                "es-errors": "^1.3.0",
-                "is-regex": "^1.1.4"
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass"
             },
             "engines": {
-                "node": ">= 0.4"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/ljharb"
+                "node": ">=14.0.0"
             }
         },
-        "node_modules/safer-buffer": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-            "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
-        },
-        "node_modules/sass": {
-            "version": "1.77.7",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.7.tgz",
-            "integrity": "sha512-9ywH75cO+rLjbrZ6en3Gp8qAMwPGBapFtlsMJoDTkcMU/bSe5a6cjKVUn5Jr4Gzg5GbP3HE8cm+02pLCgcoMow==",
+        "node_modules/sass-embedded-win32-arm64": {
+            "version": "1.77.8",
+            "resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.77.8.tgz",
+            "integrity": "sha512-7L8zT6xzEvTYj86MvUWnbkWYCNQP+74HvruLILmiPPE+TCgOjgdi750709BtppVJGGZSs40ZuN6mi/YQyGtwXg==",
+            "cpu": [
+                "arm64"
+            ],
             "dev": true,
-            "dependencies": {
-                "chokidar": ">=3.0.0 <4.0.0",
-                "immutable": "^4.0.0",
-                "source-map-js": ">=0.6.2 <2.0.0"
-            },
+            "optional": true,
+            "os": [
+                "win32"
+            ],
             "bin": {
-                "sass": "sass.js"
+                "sass": "dart-sass/sass.bat"
             },
             "engines": {
                 "node": ">=14.0.0"
             }
         },
-        "node_modules/sass-embedded": {
+        "node_modules/sass-embedded-win32-ia32": {
             "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.77.8.tgz",
-            "integrity": "sha512-WGXA6jcaoBo5Uhw0HX/s6z/sl3zyYQ7ZOnLOJzqwpctFcFmU4L07zn51e2VSkXXFpQZFAdMZNqOGz/7h/fvcRA==",
+            "resolved": "https://registry.npmjs.org/sass-embedded-win32-ia32/-/sass-embedded-win32-ia32-1.77.8.tgz",
+            "integrity": "sha512-7Buh+4bP0WyYn6XPbthkIa3M2vtcR8QIsFVg3JElVlr+8Ng19jqe0t0SwggDgbMX6AdQZC+Wj4F1BprZSok42A==",
+            "cpu": [
+                "ia32"
+            ],
             "dev": true,
-            "dependencies": {
-                "@bufbuild/protobuf": "^1.0.0",
-                "buffer-builder": "^0.2.0",
-                "immutable": "^4.0.0",
-                "rxjs": "^7.4.0",
-                "supports-color": "^8.1.1",
-                "varint": "^6.0.0"
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "bin": {
+                "sass": "dart-sass/sass.bat"
             },
             "engines": {
-                "node": ">=16.0.0"
-            },
-            "optionalDependencies": {
-                "sass-embedded-android-arm": "1.77.8",
-                "sass-embedded-android-arm64": "1.77.8",
-                "sass-embedded-android-ia32": "1.77.8",
-                "sass-embedded-android-x64": "1.77.8",
-                "sass-embedded-darwin-arm64": "1.77.8",
-                "sass-embedded-darwin-x64": "1.77.8",
-                "sass-embedded-linux-arm": "1.77.8",
-                "sass-embedded-linux-arm64": "1.77.8",
-                "sass-embedded-linux-ia32": "1.77.8",
-                "sass-embedded-linux-musl-arm": "1.77.8",
-                "sass-embedded-linux-musl-arm64": "1.77.8",
-                "sass-embedded-linux-musl-ia32": "1.77.8",
-                "sass-embedded-linux-musl-x64": "1.77.8",
-                "sass-embedded-linux-x64": "1.77.8",
-                "sass-embedded-win32-arm64": "1.77.8",
-                "sass-embedded-win32-ia32": "1.77.8",
-                "sass-embedded-win32-x64": "1.77.8"
+                "node": ">=14.0.0"
             }
         },
-        "node_modules/sass-embedded-darwin-arm64": {
+        "node_modules/sass-embedded-win32-x64": {
             "version": "1.77.8",
-            "resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.77.8.tgz",
-            "integrity": "sha512-aifgeVRNE+i43toIkDFFJc/aPLMo0PJ5s5hKb52U+oNdiJE36n65n2L8F/8z3zZRvCa6eYtFY2b7f1QXR3B0LA==",
+            "resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.77.8.tgz",
+            "integrity": "sha512-rZmLIx4/LLQm+4GW39sRJW0MIlDqmyV0fkRzTmhFP5i/wVC7cuj8TUubPHw18rv2rkHFfBZKZJTCkPjCS5Z+SA==",
             "cpu": [
-                "arm64"
+                "x64"
             ],
             "dev": true,
             "optional": true,
             "os": [
-                "darwin"
+                "win32"
             ],
             "bin": {
-                "sass": "dart-sass/sass"
+                "sass": "dart-sass/sass.bat"
             },
             "engines": {
                 "node": ">=14.0.0"
@@ -19168,6 +19935,15 @@
                 "sinon": ">=4.0.0"
             }
         },
+        "node_modules/sinon/node_modules/@sinonjs/fake-timers": {
+            "version": "11.2.2",
+            "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-11.2.2.tgz",
+            "integrity": "sha512-G2piCSxQ7oWOxwGSAyFHfPIsyeJGXYtc6mFbnFA+kRXkiEnTl8c/8jul2S329iFBnDI9HGoeWWAZvuvOkZccgw==",
+            "peer": true,
+            "dependencies": {
+                "@sinonjs/commons": "^3.0.0"
+            }
+        },
         "node_modules/sinon/node_modules/has-flag": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
@@ -19311,9 +20087,9 @@
             }
         },
         "node_modules/source-map-support": {
-            "version": "0.5.21",
-            "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
-            "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
+            "version": "0.5.13",
+            "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
+            "integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
             "dev": true,
             "dependencies": {
                 "buffer-from": "^1.0.0",
@@ -19526,6 +20302,16 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
+        "node_modules/string.prototype.repeat": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/string.prototype.repeat/-/string.prototype.repeat-1.0.0.tgz",
+            "integrity": "sha512-0u/TldDbKD8bFCQ/4f5+mNRrXwZ8hg2w7ZR8wa16e8z9XpePWl3eGEcUD0OXpEH/VJH/2G3gjUtR3ZOiBe2S/w==",
+            "dev": true,
+            "dependencies": {
+                "define-properties": "^1.1.3",
+                "es-abstract": "^1.17.5"
+            }
+        },
         "node_modules/string.prototype.trim": {
             "version": "1.2.9",
             "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
@@ -19622,12 +20408,12 @@
             }
         },
         "node_modules/strip-bom": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-            "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-4.0.0.tgz",
+            "integrity": "sha512-3xurFv5tEgii33Zi8Jtp55wEIILR9eh34FAW00PZf+JnSsTmV/ioewSgQl97JHvgjoRGwPShsWm+IdrxB35d0w==",
             "dev": true,
             "engines": {
-                "node": ">=4"
+                "node": ">=8"
             }
         },
         "node_modules/strip-final-newline": {
@@ -19673,9 +20459,9 @@
             }
         },
         "node_modules/stylelint": {
-            "version": "16.6.1",
-            "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.6.1.tgz",
-            "integrity": "sha512-yNgz2PqWLkhH2hw6X9AweV9YvoafbAD5ZsFdKN9BvSDVwGvPh+AUIrn7lYwy1S7IHmtFin75LLfX1m0D2tHu8Q==",
+            "version": "16.7.0",
+            "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.7.0.tgz",
+            "integrity": "sha512-Q1ATiXlz+wYr37a7TGsfvqYn2nSR3T/isw3IWlZQzFzCNoACHuGBb6xBplZXz56/uDRJHIygxjh7jbV/8isewA==",
             "dev": true,
             "funding": [
                 {
@@ -19688,9 +20474,9 @@
                 }
             ],
             "dependencies": {
-                "@csstools/css-parser-algorithms": "^2.6.3",
-                "@csstools/css-tokenizer": "^2.3.1",
-                "@csstools/media-query-list-parser": "^2.1.11",
+                "@csstools/css-parser-algorithms": "^2.7.1",
+                "@csstools/css-tokenizer": "^2.4.1",
+                "@csstools/media-query-list-parser": "^2.1.13",
                 "@csstools/selector-specificity": "^3.1.1",
                 "@dual-bundle/import-meta-resolve": "^4.1.0",
                 "balanced-match": "^2.0.0",
@@ -19698,7 +20484,7 @@
                 "cosmiconfig": "^9.0.0",
                 "css-functions-list": "^3.2.2",
                 "css-tree": "^2.3.1",
-                "debug": "^4.3.4",
+                "debug": "^4.3.5",
                 "fast-glob": "^3.3.2",
                 "fastest-levenshtein": "^1.0.16",
                 "file-entry-cache": "^9.0.0",
@@ -19709,13 +20495,13 @@
                 "ignore": "^5.3.1",
                 "imurmurhash": "^0.1.4",
                 "is-plain-object": "^5.0.0",
-                "known-css-properties": "^0.31.0",
+                "known-css-properties": "^0.34.0",
                 "mathml-tag-names": "^2.1.3",
                 "meow": "^13.2.0",
                 "micromatch": "^4.0.7",
                 "normalize-path": "^3.0.0",
                 "picocolors": "^1.0.1",
-                "postcss": "^8.4.38",
+                "postcss": "^8.4.39",
                 "postcss-resolve-nested-selector": "^0.1.1",
                 "postcss-safe-parser": "^7.0.0",
                 "postcss-selector-parser": "^6.1.0",
@@ -19952,9 +20738,9 @@
             }
         },
         "node_modules/stylelint-scss": {
-            "version": "6.4.0",
-            "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.4.0.tgz",
-            "integrity": "sha512-1BKRzh2TW38hZm/IWdvBVjlJRERB2zTiwm1xaOeDtUEmEKfxYMNr9THBQQtBV8wGxal/sN+TRsF7v9A5sqGI1A==",
+            "version": "6.4.1",
+            "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.4.1.tgz",
+            "integrity": "sha512-+clI2bQC2FPOt06ZwUlXZZ95IO2C5bKTP0GLN1LNQPVvISfSNcgMKv/VTwym1mK9vnqhHbOk8lO4rj4nY7L9pw==",
             "dev": true,
             "dependencies": {
                 "known-css-properties": "^0.34.0",
@@ -19970,12 +20756,6 @@
                 "stylelint": "^16.0.2"
             }
         },
-        "node_modules/stylelint-scss/node_modules/known-css-properties": {
-            "version": "0.34.0",
-            "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.34.0.tgz",
-            "integrity": "sha512-tBECoUqNFbyAY4RrbqsBQqDFpGXAEbdD5QKr8kACx3+rnArmuuR22nKQWKazvp07N9yjTyDZaw/20UIH8tL9DQ==",
-            "dev": true
-        },
         "node_modules/stylelint-selector-bem-pattern": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/stylelint-selector-bem-pattern/-/stylelint-selector-bem-pattern-4.0.0.tgz",
@@ -20006,6 +20786,12 @@
                 "url": "https://github.com/chalk/ansi-regex?sponsor=1"
             }
         },
+        "node_modules/stylelint/node_modules/argparse": {
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+            "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+            "dev": true
+        },
         "node_modules/stylelint/node_modules/balanced-match": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-2.0.0.tgz",
@@ -20072,6 +20858,18 @@
                 "node": ">=8"
             }
         },
+        "node_modules/stylelint/node_modules/js-yaml": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
+            "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+            "dev": true,
+            "dependencies": {
+                "argparse": "^2.0.1"
+            },
+            "bin": {
+                "js-yaml": "bin/js-yaml.js"
+            }
+        },
         "node_modules/stylelint/node_modules/meow": {
             "version": "13.2.0",
             "resolved": "https://registry.npmjs.org/meow/-/meow-13.2.0.tgz",
@@ -20084,6 +20882,18 @@
                 "url": "https://github.com/sponsors/sindresorhus"
             }
         },
+        "node_modules/stylelint/node_modules/signal-exit": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+            "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+            "dev": true,
+            "engines": {
+                "node": ">=14"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/isaacs"
+            }
+        },
         "node_modules/stylelint/node_modules/strip-ansi": {
             "version": "7.1.0",
             "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
@@ -20124,6 +20934,19 @@
                 "node": ">=14.18"
             }
         },
+        "node_modules/stylelint/node_modules/write-file-atomic": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.1.tgz",
+            "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==",
+            "dev": true,
+            "dependencies": {
+                "imurmurhash": "^0.1.4",
+                "signal-exit": "^4.0.1"
+            },
+            "engines": {
+                "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
+            }
+        },
         "node_modules/supports-color": {
             "version": "5.5.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -20196,9 +21019,9 @@
             "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw=="
         },
         "node_modules/synckit": {
-            "version": "0.8.8",
-            "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.8.8.tgz",
-            "integrity": "sha512-HwOKAP7Wc5aRGYdKH+dw0PRRpbO841v2DENBtjnR5HFWoiNByAl7vrx3p0G/rCyYXQsrxqtX48TImFtPcIHSpQ==",
+            "version": "0.9.1",
+            "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.9.1.tgz",
+            "integrity": "sha512-7gr8p9TQP6RAHusBOSLs46F4564ZrjV8xFmw5zCmgmhGUcw2hxsShhJ6CEiHQMgPDwAQ1fWHPM0ypc4RMAig4A==",
             "dev": true,
             "dependencies": {
                 "@pkgr/core": "^0.1.0",
@@ -20287,9 +21110,9 @@
             }
         },
         "node_modules/terser": {
-            "version": "5.31.1",
-            "resolved": "https://registry.npmjs.org/terser/-/terser-5.31.1.tgz",
-            "integrity": "sha512-37upzU1+viGvuFtBo9NPufCb9dwM0+l9hMxYyWfBA+fbwrPqNJAhbZ6W47bBFnZHKHTUBnMvi87434qq+qnxOg==",
+            "version": "5.31.3",
+            "resolved": "https://registry.npmjs.org/terser/-/terser-5.31.3.tgz",
+            "integrity": "sha512-pAfYn3NIZLyZpa83ZKigvj6Rn9c/vd5KfYGX7cN1mnzqgDcxWvrU5ZtAfIKhEXz9nRecw4z3LXkjaq96/qZqAA==",
             "dev": true,
             "dependencies": {
                 "@jridgewell/source-map": "^0.3.3",
@@ -20431,6 +21254,16 @@
             "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
             "dev": true
         },
+        "node_modules/terser/node_modules/source-map-support": {
+            "version": "0.5.21",
+            "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
+            "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
+            "dev": true,
+            "dependencies": {
+                "buffer-from": "^1.0.0",
+                "source-map": "^0.6.0"
+            }
+        },
         "node_modules/test-exclude": {
             "version": "6.0.0",
             "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-6.0.0.tgz",
@@ -20674,13 +21507,13 @@
             }
         },
         "node_modules/ts-jest": {
-            "version": "29.2.2",
-            "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-29.2.2.tgz",
-            "integrity": "sha512-sSW7OooaKT34AAngP6k1VS669a0HdLxkQZnlC7T76sckGCokXFnvJ3yRlQZGRTAoV5K19HfSgCiSwWOSIfcYlg==",
+            "version": "29.2.3",
+            "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-29.2.3.tgz",
+            "integrity": "sha512-yCcfVdiBFngVz9/keHin9EnsrQtQtEu3nRykNy9RVp+FiPFFbPJ3Sg6Qg4+TkmH0vMP5qsTKgXSsk80HRwvdgQ==",
             "dev": true,
             "dependencies": {
                 "bs-logger": "0.x",
-                "ejs": "^3.0.0",
+                "ejs": "^3.1.10",
                 "fast-json-stable-stringify": "2.x",
                 "jest-util": "^29.0.0",
                 "json5": "^2.2.3",
@@ -20722,9 +21555,9 @@
             }
         },
         "node_modules/ts-jest/node_modules/semver": {
-            "version": "7.6.2",
-            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-            "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+            "version": "7.6.3",
+            "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+            "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
             "dev": true,
             "bin": {
                 "semver": "bin/semver.js"
@@ -20879,6 +21712,15 @@
                 "node": ">=8"
             }
         },
+        "node_modules/tsconfig-paths-webpack-plugin/node_modules/strip-bom": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+            "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
+            "dev": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
         "node_modules/tsconfig-paths-webpack-plugin/node_modules/supports-color": {
             "version": "7.2.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -20918,6 +21760,16 @@
                 "json5": "lib/cli.js"
             }
         },
+        "node_modules/tsconfig-paths/node_modules/strip-bom": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+            "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
+            "dev": true,
+            "peer": true,
+            "engines": {
+                "node": ">=4"
+            }
+        },
         "node_modules/tslib": {
             "version": "2.6.3",
             "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
@@ -21063,9 +21915,9 @@
             }
         },
         "node_modules/typescript": {
-            "version": "5.5.3",
-            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.3.tgz",
-            "integrity": "sha512-/hreyEujaB0w76zKo6717l3L0o/qEUtRgdvUBvlkhoWeOVMjMuHNHk0BRBzikzuGDqNmPQbg5ifMEqsHLiIUcQ==",
+            "version": "5.5.4",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.4.tgz",
+            "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==",
             "devOptional": true,
             "bin": {
                 "tsc": "bin/tsc",
@@ -21422,9 +22274,9 @@
             }
         },
         "node_modules/webpack": {
-            "version": "5.92.1",
-            "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.92.1.tgz",
-            "integrity": "sha512-JECQ7IwJb+7fgUFBlrJzbyu3GEuNBcdqr1LD7IbSzwkSmIevTm8PF+wej3Oxuz/JFBUZ6O1o43zsPkwm1C4TmA==",
+            "version": "5.93.0",
+            "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.93.0.tgz",
+            "integrity": "sha512-Y0m5oEY1LRuwly578VqluorkXbvXKh7U3rLoQCEO04M97ScRr44afGVkI0FQFsXzysk5OgFAxjZAb9rsGQVihA==",
             "dev": true,
             "dependencies": {
                 "@types/eslint-scope": "^3.7.3",
@@ -21532,9 +22384,9 @@
             }
         },
         "node_modules/webpack-dev-middleware": {
-            "version": "7.2.1",
-            "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-7.2.1.tgz",
-            "integrity": "sha512-hRLz+jPQXo999Nx9fXVdKlg/aehsw1ajA9skAneGmT03xwmyuhvF93p6HUKKbWhXdcERtGTzUCtIQr+2IQegrA==",
+            "version": "7.3.0",
+            "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-7.3.0.tgz",
+            "integrity": "sha512-xD2qnNew+F6KwOGZR7kWdbIou/ud7cVqLEXeK1q0nHcNsX/u7ul/fSdlOTX4ntSL5FNFy7ZJJXbf0piF591JYw==",
             "dev": true,
             "dependencies": {
                 "colorette": "^2.0.10",
@@ -22047,28 +22899,16 @@
             "dev": true
         },
         "node_modules/write-file-atomic": {
-            "version": "5.0.1",
-            "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.1.tgz",
-            "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==",
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-4.0.2.tgz",
+            "integrity": "sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==",
             "dev": true,
             "dependencies": {
                 "imurmurhash": "^0.1.4",
-                "signal-exit": "^4.0.1"
+                "signal-exit": "^3.0.7"
             },
             "engines": {
-                "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
-            }
-        },
-        "node_modules/write-file-atomic/node_modules/signal-exit": {
-            "version": "4.1.0",
-            "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-            "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-            "dev": true,
-            "engines": {
-                "node": ">=14"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/isaacs"
+                "node": "^12.13.0 || ^14.15.0 || >=16.0.0"
             }
         },
         "node_modules/ws": {