diff --git a/packages/platform-mp/src/lib/platform-mp-base/modify-style.ts b/packages/platform-mp/src/lib/platform-mp-base/modify-style.ts
index 7876dedd6..7653e7d1f 100644
--- a/packages/platform-mp/src/lib/platform-mp-base/modify-style.ts
+++ b/packages/platform-mp/src/lib/platform-mp-base/modify-style.ts
@@ -88,10 +88,7 @@ export default function ensureExtractLoader(
       ruleUses.get('sass-loader').tap(args => {
         return {
           ...args,
-          sourceMap: true,
-          sassOptions: {
-            outputStyle: 'expanded'
-          }
+          sourceMap: true
         };
       });
     }
diff --git a/packages/service/src/bundler/config.ts b/packages/service/src/bundler/config.ts
index f2445292e..04ed0e448 100644
--- a/packages/service/src/bundler/config.ts
+++ b/packages/service/src/bundler/config.ts
@@ -32,11 +32,14 @@ export function createWebpackConfig(
   const dev = mode === 'development';
   let chain: WebpackChain;
 
+  const parcelCss = !!config.experimental.parcelCss;
+
   const srcDirs = [paths.appDir, paths.srcDir, ...(opts.srcDirs || [])];
   if (opts.node) {
     chain = createNodeWebpackChain({
       buildManifestFilename: BUILD_MANIFEST_PATH,
       dev,
+      parcelCss,
       env: config.env,
       mediaFilename: BUILD_MEDIA_PATH,
       name: opts.name,
@@ -51,6 +54,7 @@ export function createWebpackConfig(
       analyze: config.analyze,
       buildManifestFilename: BUILD_MANIFEST_PATH,
       dev,
+      parcelCss,
       env: config.env,
       mediaFilename: BUILD_MEDIA_PATH,
       name: opts.name,
diff --git a/packages/service/src/core/apiTypes.ts b/packages/service/src/core/apiTypes.ts
index 88a92eeb7..c6601dcdf 100644
--- a/packages/service/src/core/apiTypes.ts
+++ b/packages/service/src/core/apiTypes.ts
@@ -139,6 +139,9 @@ export interface UserConfig {
   presets?: IPresetConfig[];
   analyze?: boolean;
   asyncEntry?: boolean;
+  experimental?: {
+    parcelCss?: boolean;
+  };
 }
 
 export interface Config
diff --git a/packages/service/src/core/config/config.ts b/packages/service/src/core/config/config.ts
index e26195cb5..49da29289 100644
--- a/packages/service/src/core/config/config.ts
+++ b/packages/service/src/core/config/config.ts
@@ -38,6 +38,9 @@ const createDefaultConfig: () => UserConfig = () => ({
   apiConfig: {
     prefix: '/api',
     bodyParser: true
+  },
+  experimental: {
+    parcelCss: false
   }
 });
 
diff --git a/packages/toolpack/package.json b/packages/toolpack/package.json
index 48ed746b8..9e3960161 100644
--- a/packages/toolpack/package.json
+++ b/packages/toolpack/package.json
@@ -50,7 +50,10 @@
     "ignore-loader": "0.1.2",
     "loader-utils": "2.0.0",
     "mini-css-extract-plugin": "1.3.9",
+    "css-minimizer-webpack-plugin": "3.4.1",
     "path-browserify": "1.0.1",
+    "@parcel/css": "1.2.0",
+    "browserslist": "4.19.1",
     "postcss": "8.2.3",
     "postcss-flexbugs-fixes": "5.0.2",
     "postcss-loader": "4.1.0",
diff --git a/packages/toolpack/src/webpack/config/base.ts b/packages/toolpack/src/webpack/config/base.ts
index 796bc432f..52d45c8a2 100644
--- a/packages/toolpack/src/webpack/config/base.ts
+++ b/packages/toolpack/src/webpack/config/base.ts
@@ -1,5 +1,6 @@
 import WebpackChain from 'webpack-chain';
 import TerserPlugin from 'terser-webpack-plugin';
+import CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
 import webpack from 'webpack';
 import path from 'path';
 import {
@@ -23,6 +24,7 @@ const resolveLocalLoader = (name: string) =>
 
 export interface BaseOptions {
   dev: boolean;
+  parcelCss: boolean;
   name: string;
   projectRoot: string;
   srcDirs: string[];
@@ -59,6 +61,7 @@ export { WebpackChain };
 
 export function baseWebpackChain({
   dev,
+  parcelCss,
   projectRoot,
   srcDirs,
   mediaFilename,
@@ -85,6 +88,7 @@ export function baseWebpackChain({
     minimize: !dev,
     realContentHash: false
   });
+
   if (!dev) {
     // @ts-ignore
     config.optimization.minimizer('terser').use(TerserPlugin, [
@@ -94,6 +98,14 @@ export function baseWebpackChain({
         terserOptions
       }
     ]);
+    config.optimization.minimizer('cssMinimizer').use(CssMinimizerPlugin, [
+      {
+        // @ts-ignore
+        minify: parcelCss
+          ? CssMinimizerPlugin.parcelCssMinify
+          : CssMinimizerPlugin.cssnanoMinify
+      }
+    ]);
   }
 
   config.output.merge({
@@ -123,13 +135,14 @@ export function baseWebpackChain({
   });
 
   config.resolveLoader.merge({
-    alias: ['shuvi-swc-loader', 'route-component-loader'].reduce(
-      (alias, loader) => {
-        alias[`@shuvi/${loader}`] = resolveLocalLoader(loader);
-        return alias;
-      },
-      {} as Record<string, string>
-    )
+    alias: [
+      'shuvi-swc-loader',
+      'route-component-loader',
+      'parcel-css-loader'
+    ].reduce((alias, loader) => {
+      alias[`@shuvi/${loader}`] = resolveLocalLoader(loader);
+      return alias;
+    }, {} as Record<string, string>)
   });
 
   config.module.set('strictExportPresence', true);
diff --git a/packages/toolpack/src/webpack/config/browser.ts b/packages/toolpack/src/webpack/config/browser.ts
index d9b867665..26cca2f74 100644
--- a/packages/toolpack/src/webpack/config/browser.ts
+++ b/packages/toolpack/src/webpack/config/browser.ts
@@ -162,5 +162,9 @@ export function createBrowserWebpackChain({
     }
   ]);
 
-  return withStyle(chain, { extractCss: !dev, publicPath });
+  return withStyle(chain, {
+    extractCss: !dev,
+    publicPath,
+    parcelCss: baseOptions.parcelCss
+  });
 }
diff --git a/packages/toolpack/src/webpack/config/node.ts b/packages/toolpack/src/webpack/config/node.ts
index da76ec182..d33aec0a7 100644
--- a/packages/toolpack/src/webpack/config/node.ts
+++ b/packages/toolpack/src/webpack/config/node.ts
@@ -66,5 +66,5 @@ export function createNodeWebpackChain({
     }
   ]);
 
-  return withStyle(chain, { ssr: true });
+  return withStyle(chain, { ssr: true, parcelCss: baseOptions.parcelCss });
 }
diff --git a/packages/toolpack/src/webpack/config/parts/style.ts b/packages/toolpack/src/webpack/config/parts/style.ts
index e728e7e15..e8b61c53c 100644
--- a/packages/toolpack/src/webpack/config/parts/style.ts
+++ b/packages/toolpack/src/webpack/config/parts/style.ts
@@ -14,6 +14,7 @@ interface StyleOptions {
   extractCss?: boolean;
   sourceMap?: boolean;
   ssr?: boolean;
+  parcelCss?: boolean;
 }
 
 function getCSSModuleLocalIdent(
@@ -54,11 +55,13 @@ const sassRegex = /\.(scss|sass)$/;
 function ssrCssRule({
   test,
   resourceQuery,
-  scss
+  scss,
+  parcelCss
 }: {
   test: any;
   resourceQuery?: any;
   scss?: boolean;
+  parcelCss?: boolean;
 }): Config.Rule {
   const rule: Config.Rule = new Rule();
   rule.test(test);
@@ -66,23 +69,43 @@ function ssrCssRule({
     rule.resourceQuery(resourceQuery);
   }
 
-  rule
-    .use('css-loader')
-    .loader(require.resolve('css-loader'))
-    .options({
-      sourceMap: false,
-      importLoaders: scss ? 1 : 0,
-      esModule: true,
-      modules: {
-        getLocalIdent: getCSSModuleLocalIdent,
-        exportOnlyLocals: true
-      }
-    });
+  if (parcelCss) {
+    rule
+      .use('parcel-css-loader')
+      .loader('@shuvi/parcel-css-loader')
+      .options({
+        sourceMap: false,
+        importLoaders: scss ? 1 : 0,
+        esModule: true,
+        modules: {
+          exportOnlyLocals: true
+        }
+      });
+  } else {
+    rule
+      .use('css-loader')
+      .loader(require.resolve('css-loader'))
+      .options({
+        sourceMap: false,
+        importLoaders: scss ? 1 : 0,
+        esModule: true,
+        modules: {
+          getLocalIdent: getCSSModuleLocalIdent,
+          exportOnlyLocals: true
+        }
+      });
+  }
 
   if (scss) {
-    rule.use('sass-loader').loader(require.resolve('sass-loader')).options({
-      sourceMap: false
-    });
+    rule
+      .use('sass-loader')
+      .loader(require.resolve('sass-loader'))
+      .options({
+        sourceMap: false,
+        sassOptions: {
+          outputStyle: 'expanded'
+        }
+      });
   }
 
   return rule;
@@ -93,6 +116,7 @@ function cssRule({
   test,
   resourceQuery,
   cssModule,
+  parcelCss,
   extractCss,
   sourceMap,
   scss
@@ -101,6 +125,7 @@ function cssRule({
   test: any;
   resourceQuery?: any;
   cssModule?: boolean;
+  parcelCss?: boolean;
   extractCss?: boolean;
   sourceMap?: boolean;
   scss?: boolean;
@@ -158,45 +183,65 @@ function cssRule({
       });
   }
 
-  rule
-    .use('css-loader')
-    .loader(require.resolve('css-loader'))
-    .options({
-      sourceMap,
-      importLoaders: scss ? 2 : 1,
-      esModule: true,
-      ...(cssModule && {
-        modules: {
-          getLocalIdent: getCSSModuleLocalIdent
-          // exportOnlyLocals: true,
-        }
-      })
-    });
+  if (parcelCss) {
+    rule
+      .use('parcel-css-loader')
+      .loader('@shuvi/parcel-css-loader')
+      .options({
+        sourceMap,
+        importLoaders: scss ? 2 : 1,
+        esModule: true,
+        ...(cssModule && {
+          modules: {}
+        })
+      });
+  } else {
+    rule
+      .use('css-loader')
+      .loader(require.resolve('css-loader'))
+      .options({
+        sourceMap,
+        importLoaders: scss ? 2 : 1,
+        esModule: true,
+        ...(cssModule && {
+          modules: {
+            getLocalIdent: getCSSModuleLocalIdent
+            // exportOnlyLocals: true,
+          }
+        })
+      });
 
-  rule
-    .use('postcss-loader')
-    .loader(require.resolve('postcss-loader'))
-    .options({
-      sourceMap,
-      postcssOptions: {
-        plugins: [
-          // Make Flexbox behave like the spec cross-browser.
-          require('postcss-flexbugs-fixes'),
-          // Run Autoprefixer and compile new CSS features.
-          require('postcss-preset-env')({
-            autoprefixer: {
-              flexbox: 'no-2009'
-            },
-            stage: 3
-          })
-        ]
-      }
-    });
+    rule
+      .use('postcss-loader')
+      .loader(require.resolve('postcss-loader'))
+      .options({
+        sourceMap,
+        postcssOptions: {
+          plugins: [
+            // Make Flexbox behave like the spec cross-browser.
+            require('postcss-flexbugs-fixes'),
+            // Run Autoprefixer and compile new CSS features.
+            require('postcss-preset-env')({
+              autoprefixer: {
+                flexbox: 'no-2009'
+              },
+              stage: 3
+            })
+          ]
+        }
+      });
+  }
 
   if (scss) {
-    rule.use('sass-loader').loader(require.resolve('sass-loader')).options({
-      sourceMap
-    });
+    rule
+      .use('sass-loader')
+      .loader(require.resolve('sass-loader'))
+      .options({
+        sourceMap,
+        sassOptions: {
+          outputStyle: 'expanded'
+        }
+      });
   }
 
   return rule;
@@ -204,7 +249,7 @@ function cssRule({
 
 export function withStyle(
   chain: Config,
-  { extractCss, sourceMap, ssr, publicPath }: StyleOptions
+  { extractCss, sourceMap, ssr, publicPath, parcelCss }: StyleOptions
 ): Config {
   const oneOfs = chain.module.rule('main').oneOfs;
   if (ssr) {
@@ -214,7 +259,8 @@ export function withStyle(
       ssrCssRule({
         test: cssRegex,
         resourceQuery: cssModuleQueryRegex,
-        scss: false
+        scss: false,
+        parcelCss
       }).after('js')
     );
     oneOfs.set(
@@ -223,7 +269,8 @@ export function withStyle(
       ssrCssRule({
         test: sassRegex,
         resourceQuery: cssModuleQueryRegex,
-        scss: true
+        scss: true,
+        parcelCss
       }).after('css-module')
     );
     const ignoreRule: Config.Rule = new Rule();
@@ -254,6 +301,7 @@ export function withStyle(
       test: cssRegex,
       resourceQuery: cssModuleQueryRegex,
       cssModule: true,
+      parcelCss,
       scss: false,
       extractCss,
       sourceMap,
@@ -266,6 +314,7 @@ export function withStyle(
     cssRule({
       test: cssRegex,
       cssModule: false,
+      parcelCss,
       scss: false,
       extractCss,
       sourceMap,
@@ -279,6 +328,7 @@ export function withStyle(
       test: sassRegex,
       resourceQuery: cssModuleQueryRegex,
       cssModule: true,
+      parcelCss,
       scss: true,
       extractCss,
       sourceMap,
@@ -291,6 +341,7 @@ export function withStyle(
     cssRule({
       test: sassRegex,
       cssModule: false,
+      parcelCss,
       scss: true,
       extractCss,
       sourceMap,
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/CssSyntaxError.js b/packages/toolpack/src/webpack/loaders/parcel-css-loader/CssSyntaxError.js
new file mode 100644
index 000000000..52d753c0f
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/CssSyntaxError.js
@@ -0,0 +1,46 @@
+function showSourceCode(source, lineNo, columnNo) {
+  if (!source) return '';
+
+  let lines = source.split(/\r?\n/);
+  let start = Math.max(lineNo - 3, 0);
+  let end = Math.min(lineNo + 2, lines.length);
+
+  let maxWidth = String(end).length;
+
+  return lines
+    .slice(start, end)
+    .map((line, index) => {
+      let number = start + 1 + index;
+      let gutter = ' ' + (' ' + number).slice(-maxWidth) + ' | ';
+      if (number === lineNo) {
+        let spacing =
+          gutter.replace(/\d/g, ' ') +
+          line.slice(0, columnNo - 1).replace(/[^\t]/g, ' ');
+        return '>' + gutter + line + '\n ' + spacing + '^';
+      }
+      return ' ' + gutter + line;
+    })
+    .join('\n');
+}
+
+export default class CssSyntaxError extends Error {
+  constructor(error) {
+    super(error);
+
+    const { source, fileName, loc } = error;
+    const { line, column } = loc;
+
+    this.message = `\n\n${this.message}\n\n`;
+
+    this.message += `${fileName || `<css input>`}`;
+
+    if (typeof line !== 'undefined') {
+      this.message += `(${line}:${column}) \n`;
+    }
+
+    this.message += `\n${showSourceCode(source, line, column)}\n`;
+
+    // We don't need stack https://github.com/postcss/postcss/blob/master/docs/guidelines/runner.md#31-dont-show-js-stack-for-csssyntaxerror
+    this.stack = false;
+  }
+}
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/index.ts b/packages/toolpack/src/webpack/loaders/parcel-css-loader/index.ts
new file mode 100644
index 000000000..ad28cb9bb
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/index.ts
@@ -0,0 +1,410 @@
+import path from 'path';
+import browserslist from 'browserslist';
+import { transform, browserslistToTargets } from '@parcel/css';
+import type { ImportDependency, UrlDependency } from '@parcel/css';
+import type { loader } from 'webpack';
+import CssSyntaxError from './CssSyntaxError';
+import {
+  combineRequests,
+  getExportCode,
+  getImportCode,
+  getParcelCssModuleCode,
+  getPreRequester,
+  isDataUrl,
+  isURLRequestable,
+  normalizeOptions,
+  normalizeUrl,
+  requestify,
+  resolveRequests,
+  shouldUseIcssPlugin,
+  stringifyRequest,
+  normalizeSourceMap
+} from './utils';
+
+const browsersTargets = browserslistToTargets(
+  browserslist('last 1 major versions')
+);
+
+export default async function loader(
+  this: loader.LoaderContext,
+  content: string | Buffer,
+  map?: string
+) {
+  const rawOptions = this.getOptions();
+  const callback = this.async();
+
+  let options;
+
+  try {
+    options = normalizeOptions(rawOptions, this);
+  } catch (error) {
+    callback(error);
+
+    return;
+  }
+
+  let isSupportAbsoluteURL = false;
+
+  // TODO enable by default in the next major release
+  if (
+    this._compilation &&
+    this._compilation.options &&
+    this._compilation.options.experiments &&
+    this._compilation.options.experiments.buildHttp
+  ) {
+    isSupportAbsoluteURL = true;
+  }
+  const isSupportDataURL =
+    options.esModule && Boolean('fsStartTime' in this._compiler);
+
+  const needToUseIcssPlugin = shouldUseIcssPlugin(options);
+
+  let ParcelCssRes;
+  try {
+    ParcelCssRes = transform({
+      filename: path.relative(this.rootContext, this.resourcePath),
+      code: content instanceof Buffer ? content : Buffer.from(content),
+      // minify: this.mode === 'production',
+      cssModules: needToUseIcssPlugin,
+      analyzeDependencies: true,
+      sourceMap: options.sourceMap,
+      drafts: {
+        nesting: true,
+        customMedia: true
+      },
+      pseudoClasses: {},
+      targets: browsersTargets
+    });
+    if (options.sourceMap && map) {
+      ParcelCssRes.map = normalizeSourceMap(map, this.resourcePath);
+    }
+  } catch (error: any) {
+    console.error('-> error', error);
+    callback(error.name === 'SyntaxError' ? new CssSyntaxError(error) : error);
+    return;
+  }
+  const { dependencies = [] } = ParcelCssRes;
+
+  const parcelImportsMap = new Map();
+  const parcelUrlsMap = new Map();
+  const icssMap = new Map();
+  const parcelReplacementsMap = new Map();
+
+  const parcelImports = [];
+  const parcelApis = [];
+  const parcelReplacements = [];
+  const parcelExports = [];
+
+  let hasUrlImportHelper = false;
+
+  for (let index = 0; index < dependencies.length; index++) {
+    const dep = dependencies[index];
+    let { type, url } = dep;
+    const dataUrl = isDataUrl(url);
+    url = normalizeUrl(url, !dataUrl);
+    url = url.trim();
+    if (url.length === 0) {
+      // Empty url - `@import "";` or `@import url();`
+      console.error(
+        "It looks like you didn't end your @import statement correctly. Child nodes are attached to it."
+      );
+      continue;
+    }
+    if (type === 'import') {
+      const { supports, media } = dep as ImportDependency;
+      const { requestable, needResolve } = isURLRequestable(url, {
+        isSupportAbsoluteURL: false,
+        isSupportDataURL: false
+      });
+      let prefix;
+
+      if (requestable && needResolve) {
+        const queryParts = url.split('!');
+
+        if (queryParts.length > 1) {
+          url = queryParts.pop() as string;
+          prefix = queryParts.join('!');
+        }
+      }
+      const resolver = this.getResolve({
+        dependencyType: 'css',
+        conditionNames: ['style'],
+        mainFields: ['css', 'style', 'main', '...'],
+        mainFiles: ['index', '...'],
+        extensions: ['.css', '...'],
+        preferRelative: true
+      });
+      if (needResolve) {
+        const request = requestify(url, this.rootContext);
+        const resolvedUrl = await resolveRequests(resolver, this.context, [
+          ...new Set([request, url])
+        ]);
+
+        if (!resolvedUrl) {
+          continue;
+        }
+
+        if (resolvedUrl === this.resourcePath) {
+          continue;
+        }
+        url = resolvedUrl;
+      }
+      if (!requestable) {
+        parcelApis.push({
+          url,
+          layer: undefined,
+          supports,
+          media,
+          index
+        });
+        continue;
+      }
+      url = prefix ? `${prefix}!${url}` : url;
+      let importName = parcelImportsMap.get(url);
+      if (!importName) {
+        const { size } = parcelImportsMap;
+        importName = `___CSS_LOADER_AT_RULE_IMPORT_${size}___`;
+        parcelImportsMap.set(url, importName);
+        parcelImports.push({
+          type: 'rule_import',
+          importName,
+          url: stringifyRequest(
+            this,
+            combineRequests(getPreRequester(this)(options.importLoaders), url)
+          ),
+          index: size
+        });
+      }
+      parcelApis.push({
+        importName,
+        layer: undefined, // not support
+        supports,
+        media,
+        index
+      });
+    } else if (type === 'url') {
+      const { placeholder } = dep as UrlDependency;
+      const { requestable, needResolve } = isURLRequestable(url, {
+        isSupportAbsoluteURL,
+        isSupportDataURL
+      });
+      // console.log("-> url6 6", url, requestable, needResolve);
+      // Do not traverse inside `url`
+      if (!requestable && !needResolve) {
+        if (!parcelReplacementsMap.get(url)) {
+          parcelReplacementsMap.set(url, placeholder);
+          parcelReplacements.push({
+            placeholder,
+            replacementName: url,
+            hash: undefined,
+            needQuotes: false,
+            isString: true
+          });
+        }
+        continue;
+      }
+      const queryParts = url.split('!');
+
+      let prefix;
+
+      if (queryParts.length > 1) {
+        url = queryParts.pop() as string;
+        prefix = queryParts.join('!');
+      }
+
+      const splittedUrl = url.split(/(\?)?#/);
+      const [pathname, query, hashOrQuery] = splittedUrl;
+
+      let hash = query ? '?' : '';
+      hash += hashOrQuery ? `#${hashOrQuery}` : '';
+
+      const resolver = !options.esModule
+        ? this.getResolve({ mainFiles: [], extensions: [] })
+        : undefined;
+      const request = requestify(pathname, this.rootContext, Boolean(resolver));
+      if (!resolver) {
+        // eslint-disable-next-line consistent-return
+        url = request;
+      } else {
+        const resolvedURL = await resolveRequests(resolver, this.context, [
+          ...new Set([request, url])
+        ]);
+
+        if (resolvedURL) {
+          url = resolvedURL;
+        }
+      }
+
+      if (!hasUrlImportHelper) {
+        parcelImports.push({
+          type: 'get_url_import',
+          importName: '___CSS_LOADER_GET_URL_IMPORT___',
+          url: stringifyRequest(this, require.resolve('./runtime/getUrl.js')),
+          index: -1
+        });
+
+        hasUrlImportHelper = true;
+      }
+
+      url = prefix ? `${prefix}!${url}` : url;
+      let importName = parcelUrlsMap.get(url);
+
+      if (!importName) {
+        importName = `___CSS_LOADER_URL_IMPORT_${parcelUrlsMap.size}___`;
+        parcelUrlsMap.set(url, importName);
+
+        parcelImports.push({
+          // type: 'url',
+          importName,
+          url: stringifyRequest(this, url),
+          index
+        });
+
+        parcelReplacements.push({
+          placeholder,
+          replacementName: `___CSS_LOADER_URL_REPLACEMENT_${index}___`,
+          importName,
+          hash,
+          needQuotes: false,
+          isString: false
+        });
+      }
+    }
+  }
+  if (ParcelCssRes.exports) {
+    const resolver = this.getResolve({
+      dependencyType: 'icss',
+      conditionNames: ['style'],
+      extensions: ['...'],
+      mainFields: ['css', 'style', 'main', '...'],
+      mainFiles: ['index', '...'],
+      preferRelative: true
+    });
+    const exportKeys = Object.keys(ParcelCssRes.exports);
+    for (const exportKey of exportKeys) {
+      const exportItem = ParcelCssRes.exports[exportKey];
+      const { name, composes } = exportItem;
+      let value = name;
+      for (const compose of composes) {
+        const { type } = compose;
+        if (['global', 'local'].includes(type)) {
+          value += ` ${compose.name}`;
+        }
+        if (type === 'dependency') {
+          let url = compose.specifier;
+          let prefix = '';
+
+          const queryParts = url.split('!');
+
+          if (queryParts.length > 1) {
+            url = queryParts.pop() as string;
+            prefix = queryParts.join('!');
+          }
+
+          const request = requestify(normalizeUrl(url, true), this.rootContext);
+          const resolvedUrl = await resolveRequests(resolver, this.context, [
+            ...new Set([url, request])
+          ]);
+
+          if (!resolvedUrl) {
+            continue;
+          }
+          url = resolvedUrl;
+          url = prefix ? `${prefix}!${url}` : url;
+          let importName = icssMap.get(url);
+
+          if (!importName) {
+            const index = icssMap.size;
+            importName = `___CSS_LOADER_ICSS_IMPORT_${index}___`;
+            icssMap.set(url, importName);
+
+            parcelImports.push({
+              type: 'icss_import',
+              importName,
+              url: stringifyRequest(
+                this,
+                combineRequests(
+                  getPreRequester(this)(options.importLoaders),
+                  url
+                )
+              ),
+              icss: true,
+              index
+            });
+
+            parcelApis.push({ importName, dedupe: true, index });
+          }
+
+          const replacementName: string = `___REPLACEMENT_${parcelReplacements.length}_${importName}`;
+
+          parcelReplacements.push({
+            localName: compose.name,
+            replacementName,
+            importName
+          });
+
+          value += ` ${replacementName}`;
+        }
+      }
+      parcelExports.push({
+        name: exportKey,
+        value
+      });
+    }
+  }
+  if (options.modules.exportOnlyLocals !== true) {
+    parcelImports.unshift({
+      type: 'api_import',
+      importName: '___CSS_LOADER_API_IMPORT___',
+      url: stringifyRequest(this, require.resolve('./runtime/api'))
+    });
+
+    if (options.sourceMap) {
+      parcelImports.unshift({
+        importName: '___CSS_LOADER_API_SOURCEMAP_IMPORT___',
+        url: stringifyRequest(this, require.resolve('./runtime/sourceMaps'))
+      });
+    } else {
+      parcelImports.unshift({
+        importName: '___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___',
+        url: stringifyRequest(this, require.resolve('./runtime/noSourceMaps'))
+      });
+    }
+  }
+
+  parcelImportsMap.clear();
+  parcelUrlsMap.clear();
+  icssMap.clear();
+  parcelReplacementsMap.clear();
+
+  const importCode = getImportCode(parcelImports, options);
+
+  let moduleCode;
+
+  try {
+    moduleCode = getParcelCssModuleCode(
+      ParcelCssRes,
+      parcelApis,
+      parcelReplacements,
+      options,
+      this
+    );
+  } catch (error) {
+    callback(error);
+
+    return;
+  }
+  const exportCode = getExportCode(
+    parcelExports,
+    parcelReplacements,
+    needToUseIcssPlugin,
+    options
+  );
+
+  const resultCode = `${importCode}${moduleCode}${exportCode}`;
+
+  callback(null, resultCode);
+}
+
+// accept Buffers instead of strings
+export const raw = true;
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/api.js b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/api.js
new file mode 100644
index 000000000..2de15783f
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/api.js
@@ -0,0 +1,104 @@
+/*
+  MIT License http://www.opensource.org/licenses/mit-license.php
+  Author Tobias Koppers @sokra
+*/
+module.exports = cssWithMappingToString => {
+  const list = [];
+
+  // return the list of modules as css string
+  list.toString = function toString() {
+    return this.map(item => {
+      let content = '';
+
+      const needLayer = typeof item[5] !== 'undefined';
+
+      if (item[4]) {
+        content += `@supports (${item[4]}) {`;
+      }
+
+      if (item[2]) {
+        content += `@media ${item[2]} {`;
+      }
+
+      if (needLayer) {
+        content += `@layer${item[5].length > 0 ? ` ${item[5]}` : ''} {`;
+      }
+
+      content += cssWithMappingToString(item);
+
+      if (needLayer) {
+        content += '}';
+      }
+
+      if (item[2]) {
+        content += '}';
+      }
+
+      if (item[4]) {
+        content += '}';
+      }
+
+      return content;
+    }).join('');
+  };
+
+  // import a list of modules into the list
+  list.i = function i(modules, media, dedupe, supports, layer) {
+    if (typeof modules === 'string') {
+      modules = [[null, modules, undefined]];
+    }
+
+    const alreadyImportedModules = {};
+
+    if (dedupe) {
+      for (let k = 0; k < this.length; k++) {
+        const id = this[k][0];
+
+        if (id != null) {
+          alreadyImportedModules[id] = true;
+        }
+      }
+    }
+
+    for (let k = 0; k < modules.length; k++) {
+      const item = [].concat(modules[k]);
+
+      if (dedupe && alreadyImportedModules[item[0]]) {
+        continue;
+      }
+
+      if (typeof layer !== 'undefined') {
+        if (typeof item[5] === 'undefined') {
+          item[5] = layer;
+        } else {
+          item[1] = `@layer${item[5].length > 0 ? ` ${item[5]}` : ''} {${
+            item[1]
+          }}`;
+          item[5] = layer;
+        }
+      }
+
+      if (media) {
+        if (!item[2]) {
+          item[2] = media;
+        } else {
+          item[1] = `@media ${item[2]} {${item[1]}}`;
+          item[2] = media;
+        }
+      }
+
+      if (supports) {
+        if (!item[4]) {
+          item[4] = `${supports}`;
+        } else {
+          item[1] = `@supports (${item[4]}) {${item[1]}}`;
+          item[4] = supports;
+        }
+      }
+
+      list.push(item);
+    }
+  };
+
+  return list;
+};
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/getUrl.js b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/getUrl.js
new file mode 100644
index 000000000..be6b86000
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/getUrl.js
@@ -0,0 +1,28 @@
+module.exports = (url, options) => {
+  if (!options) {
+    options = {};
+  }
+
+  if (!url) {
+    return url;
+  }
+
+  url = String(url.__esModule ? url.default : url);
+
+  // If url is already wrapped in quotes, remove them
+  if (/^['"].*['"]$/.test(url)) {
+    url = url.slice(1, -1);
+  }
+
+  if (options.hash) {
+    url += options.hash;
+  }
+
+  // Should url be wrapped?
+  // See https://drafts.csswg.org/css-values-3/#urls
+  if (/["'() \t\n]|(%20)/.test(url) || options.needQuotes) {
+    return `"${url.replace(/"/g, '\\"').replace(/\n/g, '\\n')}"`;
+  }
+
+  return url;
+};
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/noSourceMaps.js b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/noSourceMaps.js
new file mode 100644
index 000000000..b6248dd61
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/noSourceMaps.js
@@ -0,0 +1 @@
+module.exports = i => i[1];
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/sourceMaps.js b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/sourceMaps.js
new file mode 100644
index 000000000..fe1f9b3b9
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/runtime/sourceMaps.js
@@ -0,0 +1,24 @@
+module.exports = item => {
+  const content = item[1];
+  const cssMapping = item[3];
+
+  if (!cssMapping) {
+    return content;
+  }
+
+  if (typeof btoa === 'function') {
+    const base64 = btoa(
+      unescape(encodeURIComponent(JSON.stringify(cssMapping)))
+    );
+    const data = `sourceMappingURL=data:application/json;charset=utf-8;base64,${base64}`;
+    const sourceMapping = `/*# ${data} */`;
+
+    const sourceURLs = cssMapping.sources.map(
+      source => `/*# sourceURL=${cssMapping.sourceRoot || ''}${source} */`
+    );
+
+    return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
+  }
+
+  return [content].join('\n');
+};
diff --git a/packages/toolpack/src/webpack/loaders/parcel-css-loader/utils.js b/packages/toolpack/src/webpack/loaders/parcel-css-loader/utils.js
new file mode 100644
index 000000000..f67ed9e20
--- /dev/null
+++ b/packages/toolpack/src/webpack/loaders/parcel-css-loader/utils.js
@@ -0,0 +1,1163 @@
+/*
+  MIT License http://www.opensource.org/licenses/mit-license.php
+  Author Tobias Koppers @sokra
+*/
+import { fileURLToPath } from 'url';
+import path from 'path';
+
+const matchRelativePath = /^\.\.?[/\\]/;
+
+function isAbsolutePath(str) {
+  return path.posix.isAbsolute(str) || path.win32.isAbsolute(str);
+}
+
+function isRelativePath(str) {
+  return matchRelativePath.test(str);
+}
+
+// TODO simplify for the next major release
+function stringifyRequest(loaderContext, request) {
+  if (
+    typeof loaderContext.utils !== 'undefined' &&
+    typeof loaderContext.utils.contextify === 'function'
+  ) {
+    return JSON.stringify(
+      loaderContext.utils.contextify(
+        loaderContext.context || loaderContext.rootContext,
+        request
+      )
+    );
+  }
+
+  const splitted = request.split('!');
+  const { context } = loaderContext;
+
+  return JSON.stringify(
+    splitted
+      .map(part => {
+        // First, separate singlePath from query, because the query might contain paths again
+        const splittedPart = part.match(/^(.*?)(\?.*)/);
+        const query = splittedPart ? splittedPart[2] : '';
+        let singlePath = splittedPart ? splittedPart[1] : part;
+
+        if (isAbsolutePath(singlePath) && context) {
+          singlePath = path.relative(context, singlePath);
+
+          if (isAbsolutePath(singlePath)) {
+            // If singlePath still matches an absolute path, singlePath was on a different drive than context.
+            // In this case, we leave the path platform-specific without replacing any separators.
+            // @see https://github.com/webpack/loader-utils/pull/14
+            return singlePath + query;
+          }
+
+          if (isRelativePath(singlePath) === false) {
+            // Ensure that the relative path starts at least with ./ otherwise it would be a request into the modules directory (like node_modules).
+            singlePath = `./${singlePath}`;
+          }
+        }
+
+        return singlePath.replace(/\\/g, '/') + query;
+      })
+      .join('!')
+  );
+}
+
+// We can't use path.win32.isAbsolute because it also matches paths starting with a forward slash
+const IS_NATIVE_WIN32_PATH = /^[a-z]:[/\\]|^\\\\/i;
+const IS_MODULE_REQUEST = /^[^?]*~/;
+
+function urlToRequest(url, root) {
+  let request;
+
+  if (IS_NATIVE_WIN32_PATH.test(url)) {
+    // absolute windows path, keep it
+    request = url;
+  } else if (typeof root !== 'undefined' && /^\//.test(url)) {
+    request = root + url;
+  } else if (/^\.\.?\//.test(url)) {
+    // A relative url stays
+    request = url;
+  } else {
+    // every other url is threaded like a relative url
+    request = `./${url}`;
+  }
+
+  // A `~` makes the url an module
+  if (IS_MODULE_REQUEST.test(request)) {
+    request = request.replace(IS_MODULE_REQUEST, '');
+  }
+
+  return request;
+}
+
+// eslint-disable-next-line no-useless-escape
+const regexSingleEscape = /[ -,.\/:-@[\]\^`{-~]/;
+const regexExcessiveSpaces =
+  /(^|\\+)?(\\[A-F0-9]{1,6})\x20(?![a-fA-F0-9\x20])/g;
+
+const preserveCamelCase = string => {
+  let result = string;
+  let isLastCharLower = false;
+  let isLastCharUpper = false;
+  let isLastLastCharUpper = false;
+
+  for (let i = 0; i < result.length; i++) {
+    const character = result[i];
+
+    if (isLastCharLower && /[\p{Lu}]/u.test(character)) {
+      result = `${result.slice(0, i)}-${result.slice(i)}`;
+      isLastCharLower = false;
+      isLastLastCharUpper = isLastCharUpper;
+      isLastCharUpper = true;
+      i += 1;
+    } else if (
+      isLastCharUpper &&
+      isLastLastCharUpper &&
+      /[\p{Ll}]/u.test(character)
+    ) {
+      result = `${result.slice(0, i - 1)}-${result.slice(i - 1)}`;
+      isLastLastCharUpper = isLastCharUpper;
+      isLastCharUpper = false;
+      isLastCharLower = true;
+    } else {
+      isLastCharLower =
+        character.toLowerCase() === character &&
+        character.toUpperCase() !== character;
+      isLastLastCharUpper = isLastCharUpper;
+      isLastCharUpper =
+        character.toUpperCase() === character &&
+        character.toLowerCase() !== character;
+    }
+  }
+
+  return result;
+};
+
+function camelCase(input) {
+  let result = input.trim();
+
+  if (result.length === 0) {
+    return '';
+  }
+
+  if (result.length === 1) {
+    return result.toLowerCase();
+  }
+
+  const hasUpperCase = result !== result.toLowerCase();
+
+  if (hasUpperCase) {
+    result = preserveCamelCase(result);
+  }
+
+  return result
+    .replace(/^[_.\- ]+/, '')
+    .toLowerCase()
+    .replace(/[_.\- ]+([\p{Alpha}\p{N}_]|$)/gu, (_, p1) => p1.toUpperCase())
+    .replace(/\d+([\p{Alpha}\p{N}_]|$)/gu, m => m.toUpperCase());
+}
+
+function escape(string) {
+  let output = '';
+  let counter = 0;
+
+  while (counter < string.length) {
+    // eslint-disable-next-line no-plusplus
+    const character = string.charAt(counter++);
+
+    let value;
+
+    // eslint-disable-next-line no-control-regex
+    if (/[\t\n\f\r\x0B]/.test(character)) {
+      const codePoint = character.charCodeAt();
+
+      value = `\\${codePoint.toString(16).toUpperCase()} `;
+    } else if (character === '\\' || regexSingleEscape.test(character)) {
+      value = `\\${character}`;
+    } else {
+      value = character;
+    }
+
+    output += value;
+  }
+
+  const firstChar = string.charAt(0);
+
+  if (/^-[-\d]/.test(output)) {
+    output = `\\-${output.slice(1)}`;
+  } else if (/\d/.test(firstChar)) {
+    output = `\\3${firstChar} ${output.slice(1)}`;
+  }
+
+  // Remove spaces after `\HEX` escapes that are not followed by a hex digit,
+  // since they’re redundant. Note that this is only possible if the escape
+  // sequence isn’t preceded by an odd number of backslashes.
+  output = output.replace(regexExcessiveSpaces, ($0, $1, $2) => {
+    if ($1 && $1.length % 2) {
+      // It’s not safe to remove the space, so don’t.
+      return $0;
+    }
+
+    // Strip the space.
+    return ($1 || '') + $2;
+  });
+
+  return output;
+}
+
+function gobbleHex(str) {
+  const lower = str.toLowerCase();
+  let hex = '';
+  let spaceTerminated = false;
+
+  // eslint-disable-next-line no-undefined
+  for (let i = 0; i < 6 && lower[i] !== undefined; i++) {
+    const code = lower.charCodeAt(i);
+    // check to see if we are dealing with a valid hex char [a-f|0-9]
+    const valid = (code >= 97 && code <= 102) || (code >= 48 && code <= 57);
+    // https://drafts.csswg.org/css-syntax/#consume-escaped-code-point
+    spaceTerminated = code === 32;
+
+    if (!valid) {
+      break;
+    }
+
+    hex += lower[i];
+  }
+
+  if (hex.length === 0) {
+    // eslint-disable-next-line no-undefined
+    return undefined;
+  }
+
+  const codePoint = parseInt(hex, 16);
+
+  const isSurrogate = codePoint >= 0xd800 && codePoint <= 0xdfff;
+  // Add special case for
+  // "If this number is zero, or is for a surrogate, or is greater than the maximum allowed code point"
+  // https://drafts.csswg.org/css-syntax/#maximum-allowed-code-point
+  if (isSurrogate || codePoint === 0x0000 || codePoint > 0x10ffff) {
+    return ['\uFFFD', hex.length + (spaceTerminated ? 1 : 0)];
+  }
+
+  return [
+    String.fromCodePoint(codePoint),
+    hex.length + (spaceTerminated ? 1 : 0)
+  ];
+}
+
+const CONTAINS_ESCAPE = /\\/;
+
+function unescape(str) {
+  const needToProcess = CONTAINS_ESCAPE.test(str);
+
+  if (!needToProcess) {
+    return str;
+  }
+
+  let ret = '';
+
+  for (let i = 0; i < str.length; i++) {
+    if (str[i] === '\\') {
+      const gobbled = gobbleHex(str.slice(i + 1, i + 7));
+
+      // eslint-disable-next-line no-undefined
+      if (gobbled !== undefined) {
+        ret += gobbled[0];
+        i += gobbled[1];
+
+        // eslint-disable-next-line no-continue
+        continue;
+      }
+
+      // Retain a pair of \\ if double escaped `\\\\`
+      // https://github.com/postcss/postcss-selector-parser/commit/268c9a7656fb53f543dc620aa5b73a30ec3ff20e
+      if (str[i + 1] === '\\') {
+        ret += '\\';
+        i += 1;
+
+        // eslint-disable-next-line no-continue
+        continue;
+      }
+
+      // if \\ is at the end of the string retain it
+      // https://github.com/postcss/postcss-selector-parser/commit/01a6b346e3612ce1ab20219acc26abdc259ccefb
+      if (str.length === i + 1) {
+        ret += str[i];
+      }
+
+      // eslint-disable-next-line no-continue
+      continue;
+    }
+
+    ret += str[i];
+  }
+
+  return ret;
+}
+
+function normalizePath(file) {
+  return path.sep === '\\' ? file.replace(/\\/g, '/') : file;
+}
+
+// eslint-disable-next-line no-control-regex
+const filenameReservedRegex = /[<>:"/\\|?*]/g;
+// eslint-disable-next-line no-control-regex
+const reControlChars = /[\u0000-\u001f\u0080-\u009f]/g;
+
+function escapeLocalIdent(localident) {
+  // TODO simplify in the next major release
+  return escape(
+    localident
+      // For `[hash]` placeholder
+      .replace(/^((-?[0-9])|--)/, '_$1')
+      .replace(filenameReservedRegex, '-')
+      .replace(reControlChars, '-')
+      .replace(/\./g, '-')
+  );
+}
+
+function defaultGetLocalIdent(
+  loaderContext,
+  localIdentName,
+  localName,
+  options
+) {
+  const { context, hashSalt } = options;
+  const { resourcePath } = loaderContext;
+  const relativeResourcePath = normalizePath(
+    path.relative(context, resourcePath)
+  );
+
+  // eslint-disable-next-line no-param-reassign
+  options.content = `${relativeResourcePath}\x00${localName}`;
+
+  let { hashFunction, hashDigest, hashDigestLength } = options;
+  const matches = localIdentName.match(
+    /\[(?:([^:\]]+):)?(?:(hash|contenthash|fullhash))(?::([a-z]+\d*))?(?::(\d+))?\]/i
+  );
+
+  if (matches) {
+    const hashName = matches[2] || hashFunction;
+
+    hashFunction = matches[1] || hashFunction;
+    hashDigest = matches[3] || hashDigest;
+    hashDigestLength = matches[4] || hashDigestLength;
+
+    // `hash` and `contenthash` are same in `loader-utils` context
+    // let's keep `hash` for backward compatibility
+
+    // eslint-disable-next-line no-param-reassign
+    localIdentName = localIdentName.replace(
+      /\[(?:([^:\]]+):)?(?:hash|contenthash|fullhash)(?::([a-z]+\d*))?(?::(\d+))?\]/gi,
+      () => (hashName === 'fullhash' ? '[fullhash]' : '[contenthash]')
+    );
+  }
+
+  let localIdentHash = '';
+
+  for (let tier = 0; localIdentHash.length < hashDigestLength; tier++) {
+    // TODO remove this in the next major release
+    const hash =
+      loaderContext.utils &&
+      typeof loaderContext.utils.createHash === 'function'
+        ? loaderContext.utils.createHash(hashFunction)
+        : // eslint-disable-next-line no-underscore-dangle
+          loaderContext._compiler.webpack.util.createHash(hashFunction);
+
+    if (hashSalt) {
+      hash.update(hashSalt);
+    }
+
+    const tierSalt = Buffer.allocUnsafe(4);
+
+    tierSalt.writeUInt32LE(tier);
+
+    hash.update(tierSalt);
+    // TODO: bug in webpack with unicode characters with strings
+    hash.update(Buffer.from(options.content, 'utf8'));
+
+    localIdentHash = (localIdentHash + hash.digest(hashDigest))
+      // Remove all leading digits
+      .replace(/^\d+/, '')
+      // Replace all slashes with underscores (same as in base64url)
+      .replace(/\//g, '_')
+      // Remove everything that is not an alphanumeric or underscore
+      .replace(/[^A-Za-z0-9_]+/g, '')
+      .slice(0, hashDigestLength);
+  }
+
+  // TODO need improve on webpack side, we should allow to pass hash/contentHash without chunk property, also `data` for `getPath` should be looks good without chunk property
+  const ext = path.extname(resourcePath);
+  const base = path.basename(resourcePath);
+  const name = base.slice(0, base.length - ext.length);
+  const data = {
+    filename: path.relative(context, resourcePath),
+    contentHash: localIdentHash,
+    chunk: {
+      name,
+      hash: localIdentHash,
+      contentHash: localIdentHash
+    }
+  };
+
+  // eslint-disable-next-line no-underscore-dangle
+  let result = loaderContext._compilation.getPath(localIdentName, data);
+
+  if (/\[folder\]/gi.test(result)) {
+    const dirname = path.dirname(resourcePath);
+    let directory = normalizePath(
+      path.relative(context, `${dirname + path.sep}_`)
+    );
+
+    directory = directory.substr(0, directory.length - 1);
+
+    let folder = '';
+
+    if (directory.length > 1) {
+      folder = path.basename(directory);
+    }
+
+    result = result.replace(/\[folder\]/gi, () => folder);
+  }
+
+  if (options.regExp) {
+    const match = resourcePath.match(options.regExp);
+
+    if (match) {
+      match.forEach((matched, i) => {
+        result = result.replace(new RegExp(`\\[${i}\\]`, 'ig'), matched);
+      });
+    }
+  }
+
+  return result;
+}
+
+function fixedEncodeURIComponent(str) {
+  return str.replace(/[!'()*]/g, c => `%${c.charCodeAt(0).toString(16)}`);
+}
+
+function isDataUrl(url) {
+  if (/^data:/i.test(url)) {
+    return true;
+  }
+
+  return false;
+}
+
+const NATIVE_WIN32_PATH = /^[A-Z]:[/\\]|^\\\\/i;
+
+function normalizeUrl(url, isStringValue) {
+  let normalizedUrl = url
+    .replace(/^( |\t\n|\r\n|\r|\f)*/g, '')
+    .replace(/( |\t\n|\r\n|\r|\f)*$/g, '');
+
+  if (isStringValue && /\\(\n|\r\n|\r|\f)/.test(normalizedUrl)) {
+    normalizedUrl = normalizedUrl.replace(/\\(\n|\r\n|\r|\f)/g, '');
+  }
+
+  if (NATIVE_WIN32_PATH.test(url)) {
+    try {
+      normalizedUrl = decodeURI(normalizedUrl);
+    } catch (error) {
+      // Ignore
+    }
+
+    return normalizedUrl;
+  }
+
+  normalizedUrl = unescape(normalizedUrl);
+
+  if (isDataUrl(url)) {
+    // Todo fixedEncodeURIComponent is workaround. Webpack resolver shouldn't handle "!" in dataURL
+    return fixedEncodeURIComponent(normalizedUrl);
+  }
+
+  try {
+    normalizedUrl = decodeURI(normalizedUrl);
+  } catch (error) {
+    // Ignore
+  }
+
+  return normalizedUrl;
+}
+
+function requestify(url, rootContext, needToResolveURL = true) {
+  if (needToResolveURL) {
+    if (/^file:/i.test(url)) {
+      return fileURLToPath(url);
+    }
+
+    return url.charAt(0) === '/'
+      ? urlToRequest(url, rootContext)
+      : urlToRequest(url);
+  }
+
+  if (url.charAt(0) === '/' || /^file:/i.test(url)) {
+    return url;
+  }
+
+  // A `~` makes the url an module
+  if (IS_MODULE_REQUEST.test(url)) {
+    return url.replace(IS_MODULE_REQUEST, '');
+  }
+
+  return url;
+}
+
+function getValidLocalName(localName, exportLocalsConvention) {
+  const result = exportLocalsConvention(localName);
+
+  return Array.isArray(result) ? result[0] : result;
+}
+
+const IS_MODULES = /\.module(s)?\.\w+$/i;
+const IS_ICSS = /\.icss\.\w+$/i;
+
+function getModulesOptions(rawOptions, exportType, loaderContext) {
+  if (typeof rawOptions.modules === 'boolean' && rawOptions.modules === false) {
+    return false;
+  }
+
+  const resourcePath =
+    // eslint-disable-next-line no-underscore-dangle
+    (loaderContext._module && loaderContext._module.matchResource) ||
+    loaderContext.resourcePath;
+
+  let auto;
+  let rawModulesOptions;
+
+  if (typeof rawOptions.modules === 'undefined') {
+    rawModulesOptions = {};
+    auto = true;
+  } else if (typeof rawOptions.modules === 'boolean') {
+    rawModulesOptions = {};
+  } else if (typeof rawOptions.modules === 'string') {
+    rawModulesOptions = { mode: rawOptions.modules };
+  } else {
+    rawModulesOptions = rawOptions.modules;
+    ({ auto } = rawModulesOptions);
+  }
+
+  // eslint-disable-next-line no-underscore-dangle
+  const { outputOptions } = loaderContext._compilation;
+  const needNamedExport =
+    exportType === 'css-style-sheet' || exportType === 'string';
+  const modulesOptions = {
+    auto,
+    mode: 'local',
+    exportGlobals: false,
+    localIdentName: '[hash:base64]',
+    localIdentContext: loaderContext.rootContext,
+    localIdentHashSalt: outputOptions.hashSalt,
+    localIdentHashFunction: outputOptions.hashFunction,
+    localIdentHashDigest: outputOptions.hashDigest,
+    localIdentHashDigestLength: outputOptions.hashDigestLength,
+    // eslint-disable-next-line no-undefined
+    localIdentRegExp: undefined,
+    // eslint-disable-next-line no-undefined
+    getLocalIdent: undefined,
+    namedExport: needNamedExport || false,
+    exportLocalsConvention:
+      (rawModulesOptions.namedExport === true || needNamedExport) &&
+      typeof rawModulesOptions.exportLocalsConvention === 'undefined'
+        ? 'camelCaseOnly'
+        : 'asIs',
+    exportOnlyLocals: false,
+    ...rawModulesOptions
+  };
+
+  let exportLocalsConventionType;
+
+  if (typeof modulesOptions.exportLocalsConvention === 'string') {
+    exportLocalsConventionType = modulesOptions.exportLocalsConvention;
+
+    modulesOptions.exportLocalsConvention = name => {
+      switch (exportLocalsConventionType) {
+        case 'camelCase': {
+          return [name, camelCase(name)];
+        }
+        case 'camelCaseOnly': {
+          return camelCase(name);
+        }
+        case 'dashes': {
+          return [name, dashesCamelCase(name)];
+        }
+        case 'dashesOnly': {
+          return dashesCamelCase(name);
+        }
+        case 'asIs':
+        default:
+          return name;
+      }
+    };
+  }
+
+  if (typeof modulesOptions.auto === 'boolean') {
+    const isModules = modulesOptions.auto && IS_MODULES.test(resourcePath);
+
+    let isIcss;
+
+    if (!isModules) {
+      isIcss = IS_ICSS.test(resourcePath);
+
+      if (isIcss) {
+        modulesOptions.mode = 'icss';
+      }
+    }
+
+    if (!isModules && !isIcss) {
+      return false;
+    }
+  } else if (modulesOptions.auto instanceof RegExp) {
+    const isModules = modulesOptions.auto.test(resourcePath);
+
+    if (!isModules) {
+      return false;
+    }
+  } else if (typeof modulesOptions.auto === 'function') {
+    const isModule = modulesOptions.auto(resourcePath);
+
+    if (!isModule) {
+      return false;
+    }
+  }
+
+  if (typeof modulesOptions.mode === 'function') {
+    modulesOptions.mode = modulesOptions.mode(loaderContext.resourcePath);
+  }
+
+  if (needNamedExport) {
+    if (rawOptions.esModule === false) {
+      throw new Error(
+        "The 'exportType' option with the 'css-style-sheet' or 'string' value requires the 'esModules' option to be enabled"
+      );
+    }
+
+    if (modulesOptions.namedExport === false) {
+      throw new Error(
+        "The 'exportType' option with the 'css-style-sheet' or 'string' value requires the 'modules.namedExport' option to be enabled"
+      );
+    }
+  }
+
+  if (modulesOptions.namedExport === true) {
+    if (rawOptions.esModule === false) {
+      throw new Error(
+        "The 'modules.namedExport' option requires the 'esModules' option to be enabled"
+      );
+    }
+
+    if (
+      typeof exportLocalsConventionType === 'string' &&
+      exportLocalsConventionType !== 'camelCaseOnly' &&
+      exportLocalsConventionType !== 'dashesOnly'
+    ) {
+      throw new Error(
+        'The "modules.namedExport" option requires the "modules.exportLocalsConvention" option to be "camelCaseOnly" or "dashesOnly"'
+      );
+    }
+  }
+
+  return modulesOptions;
+}
+
+function normalizeOptions(rawOptions, loaderContext) {
+  const exportType =
+    typeof rawOptions.exportType === 'undefined'
+      ? 'array'
+      : rawOptions.exportType;
+  const modulesOptions = getModulesOptions(
+    rawOptions,
+    exportType,
+    loaderContext
+  );
+
+  return {
+    url: typeof rawOptions.url === 'undefined' ? true : rawOptions.url,
+    import: typeof rawOptions.import === 'undefined' ? true : rawOptions.import,
+    modules: modulesOptions,
+    sourceMap:
+      typeof rawOptions.sourceMap === 'boolean'
+        ? rawOptions.sourceMap
+        : loaderContext.sourceMap,
+    importLoaders:
+      typeof rawOptions.importLoaders === 'string'
+        ? parseInt(rawOptions.importLoaders, 10)
+        : rawOptions.importLoaders,
+    esModule:
+      typeof rawOptions.esModule === 'undefined' ? true : rawOptions.esModule,
+    exportType
+  };
+}
+
+function shouldUseIcssPlugin(options) {
+  return Boolean(options.modules);
+}
+
+const ABSOLUTE_SCHEME = /^[a-z0-9+\-.]+:/i;
+
+function getURLType(source) {
+  if (source[0] === '/') {
+    if (source[1] === '/') {
+      return 'scheme-relative';
+    }
+
+    return 'path-absolute';
+  }
+
+  if (IS_NATIVE_WIN32_PATH.test(source)) {
+    return 'path-absolute';
+  }
+
+  return ABSOLUTE_SCHEME.test(source) ? 'absolute' : 'path-relative';
+}
+
+function normalizeSourceMap(map, resourcePath) {
+  let newMap = map;
+
+  // Some loader emit source map as string
+  // Strip any JSON XSSI avoidance prefix from the string (as documented in the source maps specification), and then parse the string as JSON.
+  if (typeof newMap === 'string') {
+    newMap = JSON.parse(newMap);
+  }
+
+  delete newMap.file;
+
+  const { sourceRoot } = newMap;
+
+  delete newMap.sourceRoot;
+
+  if (newMap.sources) {
+    // Source maps should use forward slash because it is URLs (https://github.com/mozilla/source-map/issues/91)
+    // We should normalize path because previous loaders like `sass-loader` using backslash when generate source map
+    newMap.sources = newMap.sources.map(source => {
+      // Non-standard syntax from `postcss`
+      if (source.indexOf('<') === 0) {
+        return source;
+      }
+
+      const sourceType = getURLType(source);
+
+      // Do no touch `scheme-relative` and `absolute` URLs
+      if (sourceType === 'path-relative' || sourceType === 'path-absolute') {
+        const absoluteSource =
+          sourceType === 'path-relative' && sourceRoot
+            ? path.resolve(sourceRoot, normalizePath(source))
+            : normalizePath(source);
+
+        return path.relative(path.dirname(resourcePath), absoluteSource);
+      }
+
+      return source;
+    });
+  }
+
+  return newMap;
+}
+
+function getPreRequester({ loaders, loaderIndex }) {
+  const cache = Object.create(null);
+
+  return number => {
+    if (cache[number]) {
+      return cache[number];
+    }
+
+    if (number === false) {
+      cache[number] = '';
+    } else {
+      const loadersRequest = loaders
+        .slice(
+          loaderIndex,
+          loaderIndex + 1 + (typeof number !== 'number' ? 0 : number)
+        )
+        .map(x => x.request)
+        .join('!');
+
+      cache[number] = `-!${loadersRequest}!`;
+    }
+
+    return cache[number];
+  };
+}
+
+function getImportCode(imports, options) {
+  let code = '';
+
+  for (const item of imports) {
+    const { importName, url, icss, type } = item;
+
+    if (options.esModule) {
+      if (icss && options.modules.namedExport) {
+        code += `import ${
+          options.modules.exportOnlyLocals ? '' : `${importName}, `
+        }* as ${importName}_NAMED___ from ${url};\n`;
+      } else {
+        code +=
+          type === 'url'
+            ? `var ${importName} = new URL(${url}, import.meta.url);\n`
+            : `import ${importName} from ${url};\n`;
+      }
+    } else {
+      code += `var ${importName} = require(${url});\n`;
+    }
+  }
+
+  return code ? `// Imports\n${code}` : '';
+}
+
+function normalizeParcelCssSourceMapForRuntime(map, loaderContext) {
+  let resultMap = null;
+
+  if (map instanceof Buffer) {
+    resultMap = JSON.parse(map.toString());
+  } else if (typeof map === 'object') {
+    resultMap = map;
+  }
+
+  if (resultMap) {
+    delete resultMap.file;
+
+    /* eslint-disable no-underscore-dangle */
+    if (
+      loaderContext._compilation &&
+      loaderContext._compilation.options &&
+      loaderContext._compilation.options.devtool &&
+      loaderContext._compilation.options.devtool.includes('nosources')
+    ) {
+      /* eslint-enable no-underscore-dangle */
+
+      delete resultMap.sourcesContent;
+    }
+
+    resultMap.sourceRoot = '';
+    // parseCss sourcesMap sources path is wrong, generate source by webpack
+    const contextifyPath = normalizePath(
+      path.relative(loaderContext.rootContext, loaderContext.resourcePath)
+    );
+    resultMap.sources = [`webpack://./${contextifyPath}`];
+  }
+
+  return JSON.stringify(resultMap);
+}
+
+function printParams(media, dedupe, supports, layer) {
+  let result = '';
+
+  if (typeof layer !== 'undefined' && layer) {
+    result = `, ${JSON.stringify(layer)}`;
+  }
+
+  if (typeof supports !== 'undefined' && supports) {
+    result = `, ${JSON.stringify(supports)}${result}`;
+  } else if (result.length > 0) {
+    result = `, undefined${result}`;
+  }
+
+  if (dedupe) {
+    result = `, true${result}`;
+  } else if (result.length > 0) {
+    result = `, false${result}`;
+  }
+
+  if (media) {
+    result = `${JSON.stringify(media)}${result}`;
+  } else if (result.length > 0) {
+    result = `""${result}`;
+  }
+
+  return result;
+}
+
+function getParcelCssModuleCode(
+  result,
+  api,
+  replacements,
+  options,
+  loaderContext
+) {
+  if (options.modules.exportOnlyLocals === true) {
+    return '';
+  }
+
+  let sourceMapValue = '';
+
+  if (options.sourceMap) {
+    const sourceMap = result.map;
+
+    sourceMapValue = `,${normalizeParcelCssSourceMapForRuntime(
+      sourceMap,
+      loaderContext
+    )}`;
+  }
+
+  let code = JSON.stringify(result.code.toString());
+
+  let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${
+    options.sourceMap
+      ? '___CSS_LOADER_API_SOURCEMAP_IMPORT___'
+      : '___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___'
+  });\n`;
+
+  for (const item of api) {
+    const { url, layer, supports, media, dedupe } = item;
+
+    if (url) {
+      // eslint-disable-next-line no-undefined
+      const printedParam = printParams(media, undefined, supports, layer);
+
+      beforeCode += `___CSS_LOADER_EXPORT___.push([module.id, ${JSON.stringify(
+        `@import url(${url});`
+      )}${printedParam.length > 0 ? `, ${printedParam}` : ''}]);\n`;
+    } else {
+      const printedParam = printParams(media, dedupe, supports, layer);
+
+      beforeCode += `___CSS_LOADER_EXPORT___.i(${item.importName}${
+        printedParam.length > 0 ? `, ${printedParam}` : ''
+      });\n`;
+    }
+  }
+
+  for (const item of replacements) {
+    const { replacementName, importName, localName, placeholder } = item;
+
+    if (localName) {
+      code = code.replace(new RegExp(replacementName, 'g'), () =>
+        options.modules.namedExport
+          ? `" + ${importName}_NAMED___[${JSON.stringify(
+              getValidLocalName(
+                localName,
+                options.modules.exportLocalsConvention
+              )
+            )}] + "`
+          : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`
+      );
+    } else {
+      const { hash, needQuotes, isString } = item;
+      if (isString) {
+        code = code.replace(
+          new RegExp(placeholder, 'g'),
+          () => `${replacementName}`
+        );
+      } else {
+        const getUrlOptions = []
+          .concat(hash ? [`hash: ${JSON.stringify(hash)}`] : [])
+          .concat(needQuotes ? 'needQuotes: true' : []);
+        const preparedOptions =
+          getUrlOptions.length > 0 ? `, { ${getUrlOptions.join(', ')} }` : '';
+
+        beforeCode += `var ${replacementName} = ___CSS_LOADER_GET_URL_IMPORT___(${importName}${preparedOptions});\n`;
+      }
+      code = code.replace(
+        new RegExp(placeholder, 'g'),
+        () => `" + ${replacementName} + "`
+      );
+    }
+  }
+
+  // Indexes description:
+  // 0 - module id
+  // 1 - CSS code
+  // 2 - media
+  // 3 - source map
+  // 4 - supports
+  // 5 - layer
+  return `${beforeCode}// Module\n___CSS_LOADER_EXPORT___.push([module.id, ${code}, ""${sourceMapValue}]);\n`;
+}
+
+function dashesCamelCase(str) {
+  return str.replace(/-+(\w)/g, (match, firstLetter) =>
+    firstLetter.toUpperCase()
+  );
+}
+
+function getExportCode(exports, replacements, icssPluginUsed, options) {
+  let code = '// Exports\n';
+
+  if (icssPluginUsed) {
+    let localsCode = '';
+
+    const addExportToLocalsCode = (names, value) => {
+      const normalizedNames = Array.isArray(names)
+        ? new Set(names)
+        : new Set([names]);
+
+      for (const name of normalizedNames) {
+        if (options.modules.namedExport) {
+          localsCode += `export var ${name} = ${JSON.stringify(value)};\n`;
+        } else {
+          if (localsCode) {
+            localsCode += `,\n`;
+          }
+
+          localsCode += `\t${JSON.stringify(name)}: ${JSON.stringify(value)}`;
+        }
+      }
+    };
+
+    for (const { name, value } of exports) {
+      addExportToLocalsCode(
+        options.modules.exportLocalsConvention(name),
+        value
+      );
+    }
+
+    for (const item of replacements) {
+      const { replacementName, localName, isString } = item;
+      if (isString) {
+        continue;
+      }
+      if (localName) {
+        const { importName } = item;
+
+        localsCode = localsCode.replace(
+          new RegExp(replacementName, 'g'),
+          () => {
+            if (options.modules.namedExport) {
+              return `" + ${importName}_NAMED___[${JSON.stringify(
+                getValidLocalName(
+                  localName,
+                  options.modules.exportLocalsConvention
+                )
+              )}] + "`;
+            } else if (options.modules.exportOnlyLocals) {
+              return `" + ${importName}[${JSON.stringify(localName)}] + "`;
+            }
+
+            return `" + ${importName}.locals[${JSON.stringify(localName)}] + "`;
+          }
+        );
+      } else {
+        localsCode = localsCode.replace(
+          new RegExp(replacementName, 'g'),
+          () => `" + ${replacementName} + "`
+        );
+      }
+    }
+
+    if (options.modules.exportOnlyLocals) {
+      code += options.modules.namedExport
+        ? localsCode
+        : `${
+            options.esModule ? 'export default' : 'module.exports ='
+          } {\n${localsCode}\n};\n`;
+
+      return code;
+    }
+
+    code += options.modules.namedExport
+      ? localsCode
+      : `___CSS_LOADER_EXPORT___.locals = {${
+          localsCode ? `\n${localsCode}\n` : ''
+        }};\n`;
+  }
+
+  const isCSSStyleSheetExport = options.exportType === 'css-style-sheet';
+
+  if (isCSSStyleSheetExport) {
+    code += 'var ___CSS_LOADER_STYLE_SHEET___ = new CSSStyleSheet();\n';
+    code +=
+      '___CSS_LOADER_STYLE_SHEET___.replaceSync(___CSS_LOADER_EXPORT___.toString());\n';
+  }
+
+  let finalExport;
+
+  switch (options.exportType) {
+    case 'string':
+      finalExport = '___CSS_LOADER_EXPORT___.toString()';
+      break;
+    case 'css-style-sheet':
+      finalExport = '___CSS_LOADER_STYLE_SHEET___';
+      break;
+    default:
+    case 'array':
+      finalExport = '___CSS_LOADER_EXPORT___';
+      break;
+  }
+
+  code += `${
+    options.esModule ? 'export default' : 'module.exports ='
+  } ${finalExport};\n`;
+
+  return code;
+}
+
+async function resolveRequests(resolve, context, possibleRequests) {
+  return resolve(context, possibleRequests[0])
+    .then(result => result)
+    .catch(error => {
+      const [, ...tailPossibleRequests] = possibleRequests;
+
+      if (tailPossibleRequests.length === 0) {
+        throw error;
+      }
+
+      return resolveRequests(resolve, context, tailPossibleRequests);
+    });
+}
+
+function isURLRequestable(url, options = {}) {
+  // Protocol-relative URLs
+  if (/^\/\//.test(url)) {
+    return { requestable: false, needResolve: false };
+  }
+
+  // `#` URLs
+  if (/^#/.test(url)) {
+    return { requestable: false, needResolve: false };
+  }
+
+  // Data URI
+  if (isDataUrl(url) && options.isSupportDataURL) {
+    try {
+      decodeURIComponent(url);
+    } catch (ignoreError) {
+      return { requestable: false, needResolve: false };
+    }
+
+    return { requestable: true, needResolve: false };
+  }
+
+  // `file:` protocol
+  if (/^file:/i.test(url)) {
+    return { requestable: true, needResolve: true };
+  }
+
+  // Absolute URLs
+  if (/^[a-z][a-z0-9+.-]*:/i.test(url) && !NATIVE_WIN32_PATH.test(url)) {
+    if (options.isSupportAbsoluteURL && /^https?:/i.test(url)) {
+      return { requestable: true, needResolve: false };
+    }
+
+    return { requestable: false, needResolve: false };
+  }
+
+  return { requestable: true, needResolve: true };
+}
+
+function combineRequests(preRequest, url) {
+  const idx = url.indexOf('!=!');
+
+  return idx !== -1
+    ? url.slice(0, idx + 3) + preRequest + url.slice(idx + 3)
+    : preRequest + url;
+}
+
+export {
+  normalizeOptions,
+  shouldUseIcssPlugin,
+  normalizeUrl,
+  requestify,
+  normalizeSourceMap,
+  getPreRequester,
+  getImportCode,
+  getParcelCssModuleCode,
+  getExportCode,
+  resolveRequests,
+  isURLRequestable,
+  combineRequests,
+  stringifyRequest,
+  isDataUrl
+};
diff --git a/test/e2e/css.test.ts b/test/e2e/css.test.ts
index 18efee5d3..dff4dcea4 100644
--- a/test/e2e/css.test.ts
+++ b/test/e2e/css.test.ts
@@ -6,88 +6,125 @@ let page: Page;
 
 jest.setTimeout(5 * 60 * 1000);
 
-describe('CSS', () => {
-  beforeAll(async () => {
-    ctx = await launchFixture('css');
-  }, 1000 * 60 * 5);
-  afterAll(async () => {
-    await ctx.close();
-  });
-  afterEach(async () => {
-    await page.close();
-  });
+['CSS', 'ParcelCss'].forEach(function (describeName) {
+  describe(describeName, () => {
+    beforeAll(async () => {
+      ctx = await launchFixture(
+        'css',
+        describeName === 'ParcelCss'
+          ? {
+              experimental: {
+                parcelCss: true
+              }
+            }
+          : {}
+      );
+    }, 1000 * 60 * 5);
+    afterAll(async () => {
+      await ctx.close();
+    });
+    afterEach(async () => {
+      await page.close();
+    });
 
-  test('should import .css files', async () => {
-    page = await ctx.browser.page(ctx.url('/css'));
-    // wait for style inserting
-    await page.waitFor(1000);
-    expect(
-      await page.$eval('#css', el => window.getComputedStyle(el).fontSize)
-    ).toBe('16px');
-    expect(
-      await page.$eval('#css', el => window.getComputedStyle(el).opacity)
-    ).toBe('0.5');
-  });
+    test('should import .css files', async () => {
+      page = await ctx.browser.page(ctx.url('/css'));
+      // wait for style inserting
+      await page.waitFor(1000);
+      expect(
+        await page.$eval('#css', el => window.getComputedStyle(el).fontSize)
+      ).toBe('16px');
+      expect(
+        await page.$eval('#css', el => window.getComputedStyle(el).opacity)
+      ).toBe('0.5');
+    });
 
-  test('should import .sass files', async () => {
-    page = await ctx.browser.page(ctx.url('/sass'));
-    // wait for style inserting
-    await page.waitFor(1000);
-    expect(
-      await page.$eval('#css', el => window.getComputedStyle(el).fontSize)
-    ).toBe('16px');
-    expect(
-      await page.$eval('#css', el => window.getComputedStyle(el).opacity)
-    ).toBe('0.5');
-  });
+    test('should import .sass files', async () => {
+      page = await ctx.browser.page(ctx.url('/sass'));
+      // wait for style inserting
+      await page.waitFor(1000);
+      expect(
+        await page.$eval('#css', el => window.getComputedStyle(el).fontSize)
+      ).toBe('16px');
+      expect(
+        await page.$eval('#css', el => window.getComputedStyle(el).opacity)
+      ).toBe('0.5');
+    });
 
-  test('should import .scss files', async () => {
-    page = await ctx.browser.page(ctx.url('/scss'));
-    // wait for style inserting
-    await page.waitFor(1000);
-    expect(
-      await page.$eval('#css', el => window.getComputedStyle(el).fontSize)
-    ).toBe('16px');
-    expect(
-      await page.$eval('#css', el => window.getComputedStyle(el).opacity)
-    ).toBe('0.5');
-  });
+    test('should import .scss files', async () => {
+      page = await ctx.browser.page(ctx.url('/scss'));
+      // wait for style inserting
+      await page.waitFor(1000);
+      expect(
+        await page.$eval('#css', el => window.getComputedStyle(el).fontSize)
+      ).toBe('16px');
+      expect(
+        await page.$eval('#css', el => window.getComputedStyle(el).opacity)
+      ).toBe('0.5');
+    });
 
-  test('should import .css files as css modules', async () => {
-    page = await ctx.browser.page(ctx.url('/css-modules'));
-    // wait for style inserting
-    page.waitForFunction(`document
+    test('should import .css files as css modules', async () => {
+      page = await ctx.browser.page(ctx.url('/css-modules'));
+      // wait for style inserting
+      page.waitForFunction(`document
     .querySelectorAll('[${DEV_STYLE_HIDE_FOUC}]').length <= 0`);
 
-    // wait for render
-    page.waitFor(1000);
+      // wait for render
+      page.waitFor(1000);
 
-    expect(await page.$attr('#css-modules', 'class')).toMatch(/style/);
-    expect(
-      await page.$eval(
-        '#css-modules',
-        el => window.getComputedStyle(el).opacity
-      )
-    ).toBe('0.5');
-  });
+      expect(await page.$attr('#css-modules', 'class')).toMatch(
+        /(style_)?test_.*/
+      );
+      expect(
+        await page.$eval(
+          '#css-modules',
+          el => window.getComputedStyle(el).opacity
+        )
+      ).toBe('0.5');
+      const nextButtonStyle = await page.$eval('#next-button', el => {
+        const { padding, border, cursor, backgroundColor, color } =
+          window.getComputedStyle(el);
+        return {
+          padding,
+          border,
+          cursor,
+          backgroundColor,
+          color
+        };
+      });
+      expect(nextButtonStyle).toStrictEqual({
+        padding: '7px 15px',
+        border: '0px none rgb(255, 255, 255)',
+        cursor: 'pointer',
+        backgroundColor: 'rgb(0, 0, 255)',
+        color: 'rgb(255, 255, 255)'
+      });
+    });
 
-  test('should export class mapping for css modules on ssr', async () => {
-    page = await ctx.browser.page(ctx.url('/css-modules-ssr'), {
-      disableJavaScript: true
+    test('should export class mapping for css modules on ssr', async () => {
+      page = await ctx.browser.page(ctx.url('/css-modules-ssr'), {
+        disableJavaScript: true
+      });
+      expect(await page.$attr('[data-test-id="css"]', 'class')).toMatch(
+        /(style_)?test_.*/
+      );
+      expect(await page.$attr('[data-test-id="sass"]', 'class')).toMatch(
+        /(style_)?test_.*/
+      );
+      expect(await page.$attr('[data-test-id="scss"]', 'class')).toMatch(
+        /(style_)?test_.*/
+      );
     });
-    expect(await page.$attr('[data-test-id="css"]', 'class')).toMatch(/style/);
-    expect(await page.$attr('[data-test-id="sass"]', 'class')).toMatch(/style/);
-    expect(await page.$attr('[data-test-id="scss"]', 'class')).toMatch(/style/);
-  });
 
-  test('should remove FOUC style when no css', async () => {
-    page = await ctx.browser.page(ctx.url('/no-css'));
-    // wait for style inserting
-    page.waitForFunction(
-      `document.querySelectorAll('[${DEV_STYLE_HIDE_FOUC}]').length <= 0`
-    );
-    expect(
-      await page.$eval('body', el => window.getComputedStyle(el).display)
-    ).not.toBe('none');
+    test('should remove FOUC style when no css', async () => {
+      page = await ctx.browser.page(ctx.url('/no-css'));
+      // wait for style inserting
+      page.waitForFunction(
+        `document.querySelectorAll('[${DEV_STYLE_HIDE_FOUC}]').length <= 0`
+      );
+      expect(
+        await page.$eval('body', el => window.getComputedStyle(el).display)
+      ).not.toBe('none');
+    });
   });
 });
diff --git a/test/fixtures/css/src/assets/btc.jpeg b/test/fixtures/css/src/assets/btc.jpeg
new file mode 100644
index 000000000..62c3768cf
Binary files /dev/null and b/test/fixtures/css/src/assets/btc.jpeg differ
diff --git a/test/fixtures/css/src/css/buttons/button.css b/test/fixtures/css/src/css/buttons/button.css
new file mode 100644
index 000000000..63446188d
--- /dev/null
+++ b/test/fixtures/css/src/css/buttons/button.css
@@ -0,0 +1,6 @@
+.button
+{
+  border:none;
+  padding:7px 15px;
+  cursor:pointer;
+}
diff --git a/test/fixtures/css/src/css/buttons/primary-button.css b/test/fixtures/css/src/css/buttons/primary-button.css
new file mode 100644
index 000000000..17bd070d9
--- /dev/null
+++ b/test/fixtures/css/src/css/buttons/primary-button.css
@@ -0,0 +1,6 @@
+.primaryButton
+{
+  composes:button from './button.css';
+  background-color:blue;
+  color:white;
+}
diff --git a/test/fixtures/css/src/css/buttons/secondary-button.css b/test/fixtures/css/src/css/buttons/secondary-button.css
new file mode 100644
index 000000000..8d9eefc8e
--- /dev/null
+++ b/test/fixtures/css/src/css/buttons/secondary-button.css
@@ -0,0 +1,6 @@
+.secondaryButton
+{
+  composes:button from './button.css';
+  background-color:#555;
+  color:white;
+}
diff --git a/test/fixtures/css/src/css/fonts/test.woff2 b/test/fixtures/css/src/css/fonts/test.woff2
new file mode 100644
index 000000000..30d74d258
--- /dev/null
+++ b/test/fixtures/css/src/css/fonts/test.woff2
@@ -0,0 +1 @@
+test
\ No newline at end of file
diff --git a/test/fixtures/css/src/css/order/order-1.css b/test/fixtures/css/src/css/order/order-1.css
new file mode 100644
index 000000000..7aabf54fa
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-1.css
@@ -0,0 +1,7 @@
+.order-1 {
+  color: red;
+}
+
+.order-1-1 {
+  width: 20px;
+}
diff --git a/test/fixtures/css/src/css/order/order-2.css b/test/fixtures/css/src/css/order/order-2.css
new file mode 100644
index 000000000..40eb929a2
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-2.css
@@ -0,0 +1,7 @@
+.order-2 {
+  color: red;
+}
+
+.order-2-2{
+  height: 20px;
+}
diff --git a/test/fixtures/css/src/css/order/order-3-1.css b/test/fixtures/css/src/css/order/order-3-1.css
new file mode 100644
index 000000000..f34c60206
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-3-1.css
@@ -0,0 +1,3 @@
+.order-3-1 {
+  color: white;
+}
diff --git a/test/fixtures/css/src/css/order/order-3.css b/test/fixtures/css/src/css/order/order-3.css
new file mode 100644
index 000000000..2894e2715
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-3.css
@@ -0,0 +1,5 @@
+@import url('./order-3-1.css') screen and (orientation:landscape);
+
+.order-3 {
+  color: red;
+}
diff --git a/test/fixtures/css/src/css/order/order-4-1.css b/test/fixtures/css/src/css/order/order-4-1.css
new file mode 100644
index 000000000..d80177cb7
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-4-1.css
@@ -0,0 +1,3 @@
+.order-4-1 {
+  color: red;
+}
diff --git a/test/fixtures/css/src/css/order/order-4-2-1.css b/test/fixtures/css/src/css/order/order-4-2-1.css
new file mode 100644
index 000000000..d063acd22
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-4-2-1.css
@@ -0,0 +1,3 @@
+.order-4-2-1 {
+  color: red;
+}
diff --git a/test/fixtures/css/src/css/order/order-4-2-2.css b/test/fixtures/css/src/css/order/order-4-2-2.css
new file mode 100644
index 000000000..851d03b23
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-4-2-2.css
@@ -0,0 +1,3 @@
+.order-4-2-2 {
+  color: red;
+}
diff --git a/test/fixtures/css/src/css/order/order-4-2.css b/test/fixtures/css/src/css/order/order-4-2.css
new file mode 100644
index 000000000..af8e2f217
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-4-2.css
@@ -0,0 +1,6 @@
+@import url('./order-4-2-1.css');
+@import url('./order-4-2-2.css') (orientation:landscape);
+
+.order-4-2 {
+  color: #0090ff;
+}
diff --git a/test/fixtures/css/src/css/order/order-4.css b/test/fixtures/css/src/css/order/order-4.css
new file mode 100644
index 000000000..66940a711
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order-4.css
@@ -0,0 +1,6 @@
+@import url('./order-4-1.css') (min-width: 1000px);
+@import url('./order-4-2.css') (min-width: 2000px);
+
+.order-4 {
+  color: red;
+}
diff --git a/test/fixtures/css/src/css/order/order.css b/test/fixtures/css/src/css/order/order.css
new file mode 100644
index 000000000..d3d58ae1c
--- /dev/null
+++ b/test/fixtures/css/src/css/order/order.css
@@ -0,0 +1,17 @@
+@import url('./order-1.css');
+@import url(http://example.com/style.css);
+@import url('./order-2.css');
+@import url(http://example.com/style.css);
+@import url('./order-1.css');
+@import url(http://example.com/style.css);
+@import url('./order-2.css') screen and (min-width: 2000px);
+@import url(http://example.com/style.css);
+@import url('./order-3.css');
+@import url(http://example.com/style.css);
+@import url('./order-4.css') screen;
+
+.div-order {
+  width: 100%;
+  height: 20px;
+  background: #0BB20C;
+}
diff --git a/test/fixtures/css/src/pages/css-modules.js b/test/fixtures/css/src/pages/css-modules.js
index 63a36ee4f..ec69f0433 100644
--- a/test/fixtures/css/src/pages/css-modules.js
+++ b/test/fixtures/css/src/pages/css-modules.js
@@ -1,7 +1,16 @@
-import style from "./style.css";
-
+import style from './style.css';
+import m from './modules.css';
 export default () => (
-  <div id="css-modules" className={style.test}>
-    css modules
+  <div>
+    <div id="css-modules" className={style.test}>
+      css modules
+    </div>
+    <div className={m.className1}>className1</div>
+    <div className={m.otherClassName}>otherClassName</div>
+    <div className={m.otherClassName2}>otherClassName2</div>
+    <div className={m.simple}>simple</div>
+    <div id="next-button" className={m.nextButton}>
+      nextButton
+    </div>
   </div>
 );
diff --git a/test/fixtures/css/src/pages/css.js b/test/fixtures/css/src/pages/css.js
index 8073c6c3a..d363d79a1 100644
--- a/test/fixtures/css/src/pages/css.js
+++ b/test/fixtures/css/src/pages/css.js
@@ -1,7 +1,16 @@
 import './style.css';
 
 export default () => (
-  <div id="css" className="test">
-    css
+  <div>
+    <div id="css" className="test">
+      css
+    </div>
+    <div className="url_png" />
+    <div className="url_png1" />
+    <div className="url_png2" />
+    <div className="url_quotes" />
+    <div className="url_no-quote" />
+    <div className="div-order" />
+    <div className="order-4">order-4</div>
   </div>
 );
diff --git a/test/fixtures/css/src/pages/modules.css b/test/fixtures/css/src/pages/modules.css
new file mode 100644
index 000000000..0a2f12280
--- /dev/null
+++ b/test/fixtures/css/src/pages/modules.css
@@ -0,0 +1,53 @@
+.foo {
+  background-color: red;
+}
+
+.one :local(.bar) {
+  background-color: green;
+}
+
+.two :global(.baz) {
+  background-color: blue;
+}
+
+:local(.header-baz) {
+  color: red;
+}
+
+:local(.body) {
+  color: coral;
+}
+
+
+:global(.globalClassName) {
+  color: orange;
+}
+
+
+.otherClassName {
+  composes: foo;
+  background: #000;
+}
+
+
+.className1 {
+  color: green;
+  background: red;
+}
+
+.otherClassName2 {
+  composes: className1;
+  color: yellow;
+}
+
+.simple {
+  display: block;
+  composes: order-1 from '../css/order/order-1.css';
+  composes: order-2 from '../css/order/order-2.css';
+  composes: order-1-1 from '../css/order/order-1.css';
+  composes: order-2-2 from '../css/order/order-2.css';
+}
+
+.nextButton {
+  composes:primaryButton from '../css/buttons/primary-button.css';
+}
diff --git a/test/fixtures/css/src/pages/style.css b/test/fixtures/css/src/pages/style.css
index ba6ca6173..a4b1df5cb 100644
--- a/test/fixtures/css/src/pages/style.css
+++ b/test/fixtures/css/src/pages/style.css
@@ -1,7 +1,54 @@
+@import url('../css/order/order.css');
+
+@font-face {
+  font-family: "Test";
+  src: url("../css/fonts/test.woff2") format("woff2");
+}
+
+.url_css {
+  background-image: url("https://img2.baidu.com/it/u=56857287,1771434321&fm=253&fmt=auto&app=138&f=JPEG?w=180&h=120");
+}
+
+.url_png {
+  width: 50px;
+  height: 50px;
+  background-image: url("../assets/btc.jpeg")
+}
+
+
+.url_png1 {
+  width: 50px;
+  height: 50px;
+  background-image: url("../assets/btc.jpeg")
+}
+
+.url_png2 {
+  width: 50px;
+  height: 50px;
+  background-image: url("https://img2.baidu.com/it/u=56857287,1771434321&fm=253&fmt=auto&app=138&f=JPEG?w=180&h=120");
+}
+
+.url_quotes {
+  width: 100px;
+  height: 100px;
+  background-image: url("data:image/png;base64,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");
+}
+
+.url_no-quote {
+  width: 100px;
+  height: 100px;
+  background-image: url(data:image/png;base64,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);
+}
+
 body {
   font-size: 16px;
 }
 
+div {
+  background-size: contain;
+}
+
 .test {
   opacity: 0.5;
+  color: red;
 }
diff --git a/test/fixtures/css/src/pages/style.sass b/test/fixtures/css/src/pages/style.sass
index a11d4b6b0..2741e3e17 100644
--- a/test/fixtures/css/src/pages/style.sass
+++ b/test/fixtures/css/src/pages/style.sass
@@ -3,3 +3,4 @@ body
 
 .test
   opacity: 0.5
+  color: #0be6ed
diff --git a/test/fixtures/css/src/pages/style.scss b/test/fixtures/css/src/pages/style.scss
index 9269350a3..0289e12e3 100644
--- a/test/fixtures/css/src/pages/style.scss
+++ b/test/fixtures/css/src/pages/style.scss
@@ -1,4 +1,5 @@
 $font-size: 16px;
+$red: #25cd1a;
 
 body {
   font-size: $font-size;
@@ -8,4 +9,5 @@ body {
 
 .test {
   opacity: 0.5;
+  color: $red;
 }
diff --git a/yarn.lock b/yarn.lock
index e9c8729d5..177ea8ab5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2352,6 +2352,62 @@
   dependencies:
     "@octokit/openapi-types" "^11.2.0"
 
+"@parcel/css-darwin-arm64@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-darwin-arm64/-/css-darwin-arm64-1.2.0.tgz#c8e7665754da229e5be101611bd4b91c45316ab6"
+  integrity sha512-UzM9rv+ERUURVbQvNIN5SNBoU4ycJvLdqQbolDCmRvfBu6+tgM6n4W8nBp1cXpxh/iIsdHwDV2KPtK3XbKF1UQ==
+
+"@parcel/css-darwin-x64@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-darwin-x64/-/css-darwin-x64-1.2.0.tgz#8e5317cf1b7cfdf45a57bebfca4bfd7919159097"
+  integrity sha512-M1yVWyTjXby6IzbSQlKpoyuAJIM1G7HVEI9ASYcmz0C3dsJqS8EW7IWjA/fJc/HevHoyGXIEYuIvrCc50bey0w==
+
+"@parcel/css-linux-arm-gnueabihf@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-linux-arm-gnueabihf/-/css-linux-arm-gnueabihf-1.2.0.tgz#124ee1c8235842440cacc2d78b6153e7cc863993"
+  integrity sha512-kLf4OmglnCHOVFfrJLF1Uuxuo5ayCI5egAZRKhZSeZ9ua5KOioAPSwvieYZrI6esH0a/MUhfywn/7haKGfxwnA==
+
+"@parcel/css-linux-arm64-gnu@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-linux-arm64-gnu/-/css-linux-arm64-gnu-1.2.0.tgz#f7581ba53587aa7bb5ad54e08849e8493f0460d9"
+  integrity sha512-dNnJLiAy2xXXDVVOeboDG2Rn6Ak9DsylRfKGdO2KvGj4MkwbV6fEBo4m9s73JKgsgtdGljWRcsTRPo23vaWBtw==
+
+"@parcel/css-linux-arm64-musl@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-linux-arm64-musl/-/css-linux-arm64-musl-1.2.0.tgz#a498cdf7807a317950d358f25e6c3df6a0bc75f5"
+  integrity sha512-oOa55lM59KWDlD6SK2brLT+Oaj8rDQDVHkMUVipxh2vFEQMDeRm1k6seFN1EyMGwb67ixjaWbqDsVCwpSDAtag==
+
+"@parcel/css-linux-x64-gnu@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-linux-x64-gnu/-/css-linux-x64-gnu-1.2.0.tgz#8cbf46109285d044b6aa05a68938d2edf698be0e"
+  integrity sha512-qyVozcROGm1oB2Sp4Qyzi4OLSAno31Q0/gofN5De2gycnqeG1k/dViIK37KMLjDQNVm2S2RfigLo79NbhNtOrw==
+
+"@parcel/css-linux-x64-musl@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-linux-x64-musl/-/css-linux-x64-musl-1.2.0.tgz#05e69c799b33e7f6b833f5d0dec8747b79f3df2c"
+  integrity sha512-tBuaEcZ8kJECHxDv4goA2XXW/ZC9p0lmKf5HEEssF6coXlAXbcngF4V8E/NALuESLDIlhKbF+htbIS/GgpgvkQ==
+
+"@parcel/css-win32-x64-msvc@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css-win32-x64-msvc/-/css-win32-x64-msvc-1.2.0.tgz#f00a6f4f9b8ad089170eef4b9b03515bc3110933"
+  integrity sha512-r2nxgelC5T5+icP5+E/CTLpToRUbvtGVHZloinre3E3vJOAhe6uJJ5TCP8fr8H+KHjzHoQCy9H3VgFiQE8A3pg==
+
+"@parcel/css@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@parcel/css/-/css-1.2.0.tgz#481d1271e8c7c711dc6e4ad44428e5b617da4805"
+  integrity sha512-kFKigkVGgjE7wcs+BtQuk127C2/Tc42PGPS9qLePZWty7BL8ydBND+1Ef7dnx7qEqMU+6yKZBz97nG7LFJ27yA==
+  dependencies:
+    detect-libc "^1.0.3"
+  optionalDependencies:
+    "@parcel/css-darwin-arm64" "1.2.0"
+    "@parcel/css-darwin-x64" "1.2.0"
+    "@parcel/css-linux-arm-gnueabihf" "1.2.0"
+    "@parcel/css-linux-arm64-gnu" "1.2.0"
+    "@parcel/css-linux-arm64-musl" "1.2.0"
+    "@parcel/css-linux-x64-gnu" "1.2.0"
+    "@parcel/css-linux-x64-musl" "1.2.0"
+    "@parcel/css-win32-x64-msvc" "1.2.0"
+
 "@polka/url@^1.0.0-next.20":
   version "1.0.0-next.21"
   resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.21.tgz#5de5a2385a35309427f6011992b544514d559aa1"
@@ -2618,6 +2674,11 @@
   resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-1.1.2.tgz#ccb91445360179a04e7fe6aff78c00ffc1eeaf82"
   integrity sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw==
 
+"@trysound/sax@0.2.0":
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/@trysound/sax/-/sax-0.2.0.tgz#cccaab758af56761eb7bf37af6f03f326dd798ad"
+  integrity sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==
+
 "@types/aria-query@^4.2.0":
   version "4.2.2"
   resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.2.tgz#ed4e0ad92306a704f9fb132a0cfcf77486dbe2bc"
@@ -2822,7 +2883,7 @@
     jest-diff "^25.2.1"
     pretty-format "^25.2.1"
 
-"@types/json-schema@*", "@types/json-schema@^7.0.4", "@types/json-schema@^7.0.5", "@types/json-schema@^7.0.8":
+"@types/json-schema@*", "@types/json-schema@^7.0.4", "@types/json-schema@^7.0.5", "@types/json-schema@^7.0.8", "@types/json-schema@^7.0.9":
   version "7.0.9"
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.9.tgz#97edc9037ea0c38585320b28964dde3b39e4660d"
   integrity sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==
@@ -3476,11 +3537,25 @@ aggregate-error@^3.0.0:
     clean-stack "^2.0.0"
     indent-string "^4.0.0"
 
+ajv-formats@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/ajv-formats/-/ajv-formats-2.1.1.tgz#6e669400659eb74973bbf2e33327180a0996b520"
+  integrity sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==
+  dependencies:
+    ajv "^8.0.0"
+
 ajv-keywords@^3.4.1, ajv-keywords@^3.5.2:
   version "3.5.2"
   resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.5.2.tgz#31f29da5ab6e00d1c2d329acf7b5929614d5014d"
   integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==
 
+ajv-keywords@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-5.1.0.tgz#69d4d385a4733cdbeab44964a1170a88f87f0e16"
+  integrity sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==
+  dependencies:
+    fast-deep-equal "^3.1.3"
+
 ajv@^6.12.2, ajv@^6.12.3, ajv@^6.12.4, ajv@^6.12.5:
   version "6.12.6"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
@@ -3491,6 +3566,16 @@ ajv@^6.12.2, ajv@^6.12.3, ajv@^6.12.4, ajv@^6.12.5:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
+ajv@^8.0.0, ajv@^8.8.0:
+  version "8.10.0"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.10.0.tgz#e573f719bd3af069017e3b66538ab968d040e54d"
+  integrity sha512-bzqAEZOjkrUMl2afH8dknrq5KEk2SrwdBROR+vH1EKVQTqaUbJVPdc/gEdggTMM0Se+s+Ja4ju4TlNcStKl2Hw==
+  dependencies:
+    fast-deep-equal "^3.1.1"
+    json-schema-traverse "^1.0.0"
+    require-from-string "^2.0.2"
+    uri-js "^4.2.2"
+
 amdefine@>=0.0.4:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
@@ -3988,6 +4073,11 @@ body-parser@1.19.0:
     raw-body "2.4.0"
     type-is "~1.6.17"
 
+boolbase@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
+  integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24=
+
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
@@ -4083,6 +4173,17 @@ browserify-sign@^4.0.0:
     readable-stream "^3.6.0"
     safe-buffer "^5.2.0"
 
+browserslist@4.19.1, browserslist@^4.0.0, browserslist@^4.16.6:
+  version "4.19.1"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.19.1.tgz#4ac0435b35ab655896c31d53018b6dd5e9e4c9a3"
+  integrity sha512-u2tbbG5PdKRTUoctO3NBD8FQ5HdPh1ZXPHzp1rwaa5jTc+RV9/+RlWiAIKmjRPQF+xbGM9Kklj5bZQFa2s/38A==
+  dependencies:
+    caniuse-lite "^1.0.30001286"
+    electron-to-chromium "^1.4.17"
+    escalade "^3.1.1"
+    node-releases "^2.0.1"
+    picocolors "^1.0.0"
+
 browserslist@^4.12.0, browserslist@^4.14.5, browserslist@^4.17.5, browserslist@^4.17.6, browserslist@^4.6.4:
   version "4.18.1"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.18.1.tgz#60d3920f25b6860eb917c6c7b185576f4d8b017f"
@@ -4317,11 +4418,31 @@ camelcase@^6.0.0, camelcase@^6.2.0:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.2.1.tgz#250fd350cfd555d0d2160b1d51510eaf8326e86e"
   integrity sha512-tVI4q5jjFV5CavAU8DXfza/TJcZutVKo/5Foskmsqcm0MsL91moHvwiGNnqaa2o6PF/7yT5ikDRcVcl8Rj6LCA==
 
+caniuse-api@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0"
+  integrity sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==
+  dependencies:
+    browserslist "^4.0.0"
+    caniuse-lite "^1.0.0"
+    lodash.memoize "^4.1.2"
+    lodash.uniq "^4.5.0"
+
+caniuse-lite@^1.0.0:
+  version "1.0.30001310"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001310.tgz#da02cd07432c9eece6992689d1b84ca18139eea8"
+  integrity sha512-cb9xTV8k9HTIUA3GnPUJCk0meUnrHL5gy5QePfDjxHyNBcnzPzrHFv5GqfP7ue5b1ZyzZL0RJboD6hQlPXjhjg==
+
 caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001280:
   version "1.0.30001282"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001282.tgz#38c781ee0a90ccfe1fe7fefd00e43f5ffdcb96fd"
   integrity sha512-YhF/hG6nqBEllymSIjLtR2iWDDnChvhnVJqp+vloyt2tEHFG1yBR+ac2B/rOw0qOK0m0lEXU2dv4E/sMk5P9Kg==
 
+caniuse-lite@^1.0.30001286:
+  version "1.0.30001309"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001309.tgz#e0ee78b9bec0704f67304b00ff3c5c0c768a9f62"
+  integrity sha512-Pl8vfigmBXXq+/yUz1jUwULeq9xhMJznzdc/xwl4WclDAuebcTHVefpz8lE/bMI+UN7TOkSSe7B7RnZd6+dzjA==
+
 capture-exit@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/capture-exit/-/capture-exit-2.0.0.tgz#fb953bfaebeb781f62898239dabb426d08a509a4"
@@ -4615,6 +4736,11 @@ color-name@~1.1.4:
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
   integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
 
+colord@^2.9.1:
+  version "2.9.2"
+  resolved "https://registry.yarnpkg.com/colord/-/colord-2.9.2.tgz#25e2bacbbaa65991422c07ea209e2089428effb1"
+  integrity sha512-Uqbg+J445nc1TKn4FoDPS6ZZqAvEDnwrH42yo8B40JSOgSLxMZ/gt3h4nmCtPLQeXhjJJkqBx7SCY35WnIixaQ==
+
 colorette@^1.2.1:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.4.0.tgz#5190fbb87276259a86ad700bff2c6d6faa3fca40"
@@ -4655,6 +4781,11 @@ commander@^6.2.0:
   resolved "https://registry.yarnpkg.com/commander/-/commander-6.2.1.tgz#0792eb682dfbc325999bb2b84fddddba110ac73c"
   integrity sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==
 
+commander@^7.2.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-7.2.0.tgz#a36cb57d0b501ce108e4d20559a150a391d97ab7"
+  integrity sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==
+
 commondir@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
@@ -5002,6 +5133,13 @@ css-blank-pseudo@^0.1.4:
   dependencies:
     postcss "^7.0.5"
 
+css-declaration-sorter@^6.0.3:
+  version "6.1.4"
+  resolved "https://registry.yarnpkg.com/css-declaration-sorter/-/css-declaration-sorter-6.1.4.tgz#b9bfb4ed9a41f8dcca9bf7184d849ea94a8294b4"
+  integrity sha512-lpfkqS0fctcmZotJGhnxkIyJWvBXgpyi2wsFd4J8VB7wzyrT6Ch/3Q+FMNJpjK4gu1+GN5khOnpU2ZVKrLbhCw==
+  dependencies:
+    timsort "^0.3.0"
+
 css-has-pseudo@^0.10.0:
   version "0.10.0"
   resolved "https://registry.yarnpkg.com/css-has-pseudo/-/css-has-pseudo-0.10.0.tgz#3c642ab34ca242c59c41a125df9105841f6966ee"
@@ -5028,6 +5166,18 @@ css-loader@5.0.1:
     schema-utils "^3.0.0"
     semver "^7.3.2"
 
+css-minimizer-webpack-plugin@3.4.1:
+  version "3.4.1"
+  resolved "https://registry.yarnpkg.com/css-minimizer-webpack-plugin/-/css-minimizer-webpack-plugin-3.4.1.tgz#ab78f781ced9181992fe7b6e4f3422e76429878f"
+  integrity sha512-1u6D71zeIfgngN2XNRJefc/hY7Ybsxd74Jm4qngIXyUEk7fss3VUzuHxLAq/R8NAba4QU9OUSaMZlbpRc7bM4Q==
+  dependencies:
+    cssnano "^5.0.6"
+    jest-worker "^27.0.2"
+    postcss "^8.3.5"
+    schema-utils "^4.0.0"
+    serialize-javascript "^6.0.0"
+    source-map "^0.6.1"
+
 css-prefers-color-scheme@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/css-prefers-color-scheme/-/css-prefers-color-scheme-3.1.1.tgz#6f830a2714199d4f0d0d0bb8a27916ed65cff1f4"
@@ -5035,6 +5185,30 @@ css-prefers-color-scheme@^3.1.1:
   dependencies:
     postcss "^7.0.5"
 
+css-select@^4.1.3:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/css-select/-/css-select-4.2.1.tgz#9e665d6ae4c7f9d65dbe69d0316e3221fb274cdd"
+  integrity sha512-/aUslKhzkTNCQUB2qTX84lVmfia9NyjP3WpDGtj/WxhwBzWBYUV3DgUpurHTme8UTPcPlAD1DJ+b0nN/t50zDQ==
+  dependencies:
+    boolbase "^1.0.0"
+    css-what "^5.1.0"
+    domhandler "^4.3.0"
+    domutils "^2.8.0"
+    nth-check "^2.0.1"
+
+css-tree@^1.1.2, css-tree@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.1.3.tgz#eb4870fb6fd7707327ec95c2ff2ab09b5e8db91d"
+  integrity sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==
+  dependencies:
+    mdn-data "2.0.14"
+    source-map "^0.6.1"
+
+css-what@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/css-what/-/css-what-5.1.0.tgz#3f7b707aadf633baf62c2ceb8579b545bb40f7fe"
+  integrity sha512-arSMRWIIFY0hV8pIxZMEfmMI47Wj3R/aWpZDDxWYCPEiOMv6tfOrnpDtgxBYPEQD4V0Y/958+1TdC3iWTFcUPw==
+
 cssdb@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/cssdb/-/cssdb-4.4.0.tgz#3bf2f2a68c10f5c6a08abd92378331ee803cddb0"
@@ -5050,6 +5224,62 @@ cssesc@^3.0.0:
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
+cssnano-preset-default@^5.1.12:
+  version "5.1.12"
+  resolved "https://registry.yarnpkg.com/cssnano-preset-default/-/cssnano-preset-default-5.1.12.tgz#64e2ad8e27a279e1413d2d2383ef89a41c909be9"
+  integrity sha512-rO/JZYyjW1QNkWBxMGV28DW7d98UDLaF759frhli58QFehZ+D/LSmwQ2z/ylBAe2hUlsIWTq6NYGfQPq65EF9w==
+  dependencies:
+    css-declaration-sorter "^6.0.3"
+    cssnano-utils "^3.0.2"
+    postcss-calc "^8.2.0"
+    postcss-colormin "^5.2.5"
+    postcss-convert-values "^5.0.4"
+    postcss-discard-comments "^5.0.3"
+    postcss-discard-duplicates "^5.0.3"
+    postcss-discard-empty "^5.0.3"
+    postcss-discard-overridden "^5.0.4"
+    postcss-merge-longhand "^5.0.6"
+    postcss-merge-rules "^5.0.6"
+    postcss-minify-font-values "^5.0.4"
+    postcss-minify-gradients "^5.0.6"
+    postcss-minify-params "^5.0.5"
+    postcss-minify-selectors "^5.1.3"
+    postcss-normalize-charset "^5.0.3"
+    postcss-normalize-display-values "^5.0.3"
+    postcss-normalize-positions "^5.0.4"
+    postcss-normalize-repeat-style "^5.0.4"
+    postcss-normalize-string "^5.0.4"
+    postcss-normalize-timing-functions "^5.0.3"
+    postcss-normalize-unicode "^5.0.4"
+    postcss-normalize-url "^5.0.5"
+    postcss-normalize-whitespace "^5.0.4"
+    postcss-ordered-values "^5.0.5"
+    postcss-reduce-initial "^5.0.3"
+    postcss-reduce-transforms "^5.0.4"
+    postcss-svgo "^5.0.4"
+    postcss-unique-selectors "^5.0.4"
+
+cssnano-utils@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/cssnano-utils/-/cssnano-utils-3.0.2.tgz#d82b4991a27ba6fec644b39bab35fe027137f516"
+  integrity sha512-KhprijuQv2sP4kT92sSQwhlK3SJTbDIsxcfIEySB0O+3m9esFOai7dP9bMx5enHAh2MwarVIcnwiWoOm01RIbQ==
+
+cssnano@^5.0.6:
+  version "5.0.17"
+  resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-5.0.17.tgz#ff45713c05cfc780a1aeb3e663b6f224d091cabf"
+  integrity sha512-fmjLP7k8kL18xSspeXTzRhaFtRI7DL9b8IcXR80JgtnWBpvAzHT7sCR/6qdn0tnxIaINUN6OEQu83wF57Gs3Xw==
+  dependencies:
+    cssnano-preset-default "^5.1.12"
+    lilconfig "^2.0.3"
+    yaml "^1.10.2"
+
+csso@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/csso/-/csso-4.2.0.tgz#ea3a561346e8dc9f546d6febedd50187cf389529"
+  integrity sha512-wvlcdIbf6pwKEk7vHj8/Bkc0B4ylXZruLvOgs9doS5eOsOpuodOV2zJChSpkp+pRpYQLQMeF04nr3Z68Sta9jA==
+  dependencies:
+    css-tree "^1.1.2"
+
 cssom@^0.4.4:
   version "0.4.4"
   resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.4.4.tgz#5a66cf93d2d0b661d80bf6a44fb65f5c2e4e0a10"
@@ -5303,6 +5533,11 @@ detect-indent@^5.0.0:
   resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-5.0.0.tgz#3871cc0a6a002e8c3e5b3cf7f336264675f06b9d"
   integrity sha1-OHHMCmoALow+Wzz38zYmRnXwa50=
 
+detect-libc@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
+  integrity sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=
+
 detect-newline@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/detect-newline/-/detect-newline-3.1.0.tgz#576f5dfc63ae1a192ff192d8ad3af6308991b651"
@@ -5355,6 +5590,15 @@ dom-accessibility-api@^0.5.6, dom-accessibility-api@^0.5.9:
   resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.10.tgz#caa6d08f60388d0bb4539dd75fe458a9a1d0014c"
   integrity sha512-Xu9mD0UjrJisTmv7lmVSDMagQcU9R5hwAbxsaAE/35XPnPLJobbuREfV/rraiSaEj/UOvgrzQs66zyTWTlyd+g==
 
+dom-serializer@^1.0.1:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-1.3.2.tgz#6206437d32ceefaec7161803230c7a20bc1b4d91"
+  integrity sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==
+  dependencies:
+    domelementtype "^2.0.1"
+    domhandler "^4.2.0"
+    entities "^2.0.0"
+
 dom7@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/dom7/-/dom7-3.0.0.tgz#b861ce5d67a6becd7aaa3ad02942ff14b1240331"
@@ -5362,6 +5606,11 @@ dom7@^3.0.0:
   dependencies:
     ssr-window "^3.0.0-alpha.1"
 
+domelementtype@^2.0.1, domelementtype@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.2.0.tgz#9a0b6c2782ed6a1c7323d42267183df9bd8b1d57"
+  integrity sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==
+
 domexception@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/domexception/-/domexception-2.0.1.tgz#fb44aefba793e1574b0af6aed2801d057529f304"
@@ -5369,6 +5618,22 @@ domexception@^2.0.1:
   dependencies:
     webidl-conversions "^5.0.0"
 
+domhandler@^4.2.0, domhandler@^4.3.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-4.3.0.tgz#16c658c626cf966967e306f966b431f77d4a5626"
+  integrity sha512-fC0aXNQXqKSFTr2wDNZDhsEYjCiYsDWl3D01kwt25hm1YIPyDGHvvi3rw+PLqHAl/m71MaiF7d5zvBr0p5UB2g==
+  dependencies:
+    domelementtype "^2.2.0"
+
+domutils@^2.8.0:
+  version "2.8.0"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-2.8.0.tgz#4437def5db6e2d1f5d6ee859bd95ca7d02048135"
+  integrity sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==
+  dependencies:
+    dom-serializer "^1.0.1"
+    domelementtype "^2.2.0"
+    domhandler "^4.2.0"
+
 dot-prop@^4.2.0:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.2.1.tgz#45884194a71fc2cda71cbb4bceb3a4dd2f433ba4"
@@ -5443,6 +5708,11 @@ electron-to-chromium@^1.3.896:
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.903.tgz#e2d3c3809f4ef05fdbe5cc88969dfc94b1bd15b9"
   integrity sha512-+PnYAyniRRTkNq56cqYDLq9LyklZYk0hqoDy9GpcU11H5QjRmFZVDbxtgHUMK/YzdNTcn1XWP5gb+hFlSCr20g==
 
+electron-to-chromium@^1.4.17:
+  version "1.4.66"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.66.tgz#d7453d363dcd7b06ed1757adcde34d724e27b367"
+  integrity sha512-f1RXFMsvwufWLwYUxTiP7HmjprKXrqEWHiQkjAYa9DJeVIlZk5v8gBGcaV+FhtXLly6C1OTVzQY+2UQrACiLlg==
+
 elliptic@^6.5.3:
   version "6.5.4"
   resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.4.tgz#da37cebd31e79a1367e941b592ed1fbebd58abbb"
@@ -5510,6 +5780,11 @@ enquirer@^2.3.6:
   dependencies:
     ansi-colors "^4.1.1"
 
+entities@^2.0.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55"
+  integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
+
 env-paths@^2.2.0:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/env-paths/-/env-paths-2.2.1.tgz#420399d416ce1fbe9bc0a07c62fa68d67fd0f8f2"
@@ -5955,7 +6230,7 @@ extsprintf@^1.2.0:
   resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.1.tgz#8d172c064867f235c0c84a596806d279bf4bcc07"
   integrity sha512-Wrk35e8ydCKDj/ArClo1VrPVmN8zph5V4AtHwIuHhvMXsKf73UT3BOD+azBIW+3wOJ4FhEH7zyaJCFvChjYvMA==
 
-fast-deep-equal@^3.1.1:
+fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
   integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
@@ -7902,6 +8177,15 @@ jest-worker@^26.6.2:
     merge-stream "^2.0.0"
     supports-color "^7.0.0"
 
+jest-worker@^27.0.2:
+  version "27.5.1"
+  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-27.5.1.tgz#8d146f0900e8973b106b6f73cc1e9a8cb86f8db0"
+  integrity sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==
+  dependencies:
+    "@types/node" "*"
+    merge-stream "^2.0.0"
+    supports-color "^8.0.0"
+
 jest-worker@^27.0.6:
   version "27.3.1"
   resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-27.3.1.tgz#0def7feae5b8042be38479799aeb7b5facac24b2"
@@ -8006,6 +8290,11 @@ json-schema-traverse@^0.4.1:
   resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
   integrity sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==
 
+json-schema-traverse@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz#ae7bcb3656ab77a73ba5c49bf654f38e6b6860e2"
+  integrity sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==
+
 json-schema@0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.2.3.tgz#b480c892e59a2f05954ce727bd3f2a4e882f9e13"
@@ -8203,6 +8492,11 @@ levn@~0.3.0:
     prelude-ls "~1.1.2"
     type-check "~0.3.2"
 
+lilconfig@^2.0.3:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.0.4.tgz#f4507d043d7058b380b6a8f5cb7bcd4b34cee082"
+  integrity sha512-bfTIN7lEsiooCocSISTWXkiWJkRqtL9wYtYy+8EK3Y41qh3mpwPU0ycTOgjdY9ErwXCc8QyrQp82bdL0Xkm9yA==
+
 lines-and-columns@^1.1.6:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.1.6.tgz#1c00c743b433cd0a4e80758f7b64a57440d9ff00"
@@ -8367,6 +8661,11 @@ lodash.ismatch@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.ismatch/-/lodash.ismatch-4.4.0.tgz#756cb5150ca3ba6f11085a78849645f188f85f37"
   integrity sha1-dWy1FQyjum8RCFp4hJZF8Yj4Xzc=
 
+lodash.memoize@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
+  integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
+
 lodash.set@^4.3.2:
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/lodash.set/-/lodash.set-4.3.2.tgz#d8757b1da807dde24816b0d6a84bea1a76230b23"
@@ -8567,6 +8866,11 @@ md5@^2.3.0:
     crypt "0.0.2"
     is-buffer "~1.1.6"
 
+mdn-data@2.0.14:
+  version "2.0.14"
+  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.14.tgz#7113fc4281917d63ce29b43446f701e68c25ba50"
+  integrity sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==
+
 media-typer@0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"
@@ -8982,6 +9286,11 @@ nanoid@^3.1.20, nanoid@^3.1.30:
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.30.tgz#63f93cc548d2a113dc5dfbc63bfa09e2b9b64362"
   integrity sha512-zJpuPDwOv8D2zq2WRoMe1HsfZthVewpel9CAvTfc/2mBD1uUT/agc5f7GHGWXlYkFvi1mVxe4IjvP2HNrop7nQ==
 
+nanoid@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.2.0.tgz#62667522da6673971cca916a6d3eff3f415ff80c"
+  integrity sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==
+
 nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
@@ -9266,6 +9575,13 @@ npmlog@^4.0.0, npmlog@^4.1.2:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
+nth-check@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-2.0.1.tgz#2efe162f5c3da06a28959fbd3db75dbeea9f0fc2"
+  integrity sha512-it1vE95zF6dTT9lBsYbxvqh0Soy4SPowchj0UBGj/V6cTPnXXtQOPUbhZ6CmGzAD/rW22LQK6E96pcdJXk4A4w==
+  dependencies:
+    boolbase "^1.0.0"
+
 num2fraction@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/num2fraction/-/num2fraction-1.2.2.tgz#6f682b6a027a4e9ddfa4564cd2589d1d4e669ede"
@@ -9870,6 +10186,14 @@ postcss-attribute-case-insensitive@^4.0.1:
     postcss "^7.0.2"
     postcss-selector-parser "^6.0.2"
 
+postcss-calc@^8.2.0:
+  version "8.2.4"
+  resolved "https://registry.yarnpkg.com/postcss-calc/-/postcss-calc-8.2.4.tgz#77b9c29bfcbe8a07ff6693dc87050828889739a5"
+  integrity sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==
+  dependencies:
+    postcss-selector-parser "^6.0.9"
+    postcss-value-parser "^4.2.0"
+
 postcss-color-functional-notation@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/postcss-color-functional-notation/-/postcss-color-functional-notation-2.0.1.tgz#5efd37a88fbabeb00a2966d1e53d98ced93f74e0"
@@ -9912,6 +10236,23 @@ postcss-color-rebeccapurple@^4.0.1:
     postcss "^7.0.2"
     postcss-values-parser "^2.0.0"
 
+postcss-colormin@^5.2.5:
+  version "5.2.5"
+  resolved "https://registry.yarnpkg.com/postcss-colormin/-/postcss-colormin-5.2.5.tgz#d1fc269ac2ad03fe641d462b5d1dada35c69968a"
+  integrity sha512-+X30aDaGYq81mFqwyPpnYInsZQnNpdxMX0ajlY7AExCexEFkPVV+KrO7kXwayqEWL2xwEbNQ4nUO0ZsRWGnevg==
+  dependencies:
+    browserslist "^4.16.6"
+    caniuse-api "^3.0.0"
+    colord "^2.9.1"
+    postcss-value-parser "^4.2.0"
+
+postcss-convert-values@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-convert-values/-/postcss-convert-values-5.0.4.tgz#3e74dd97c581f475ae7b4500bc0a7c4fb3a6b1b6"
+  integrity sha512-bugzSAyjIexdObovsPZu/sBCTHccImJxLyFgeV0MmNBm/Lw5h5XnjfML6gzEmJ3A6nyfCW7hb1JXzcsA4Zfbdw==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
 postcss-custom-media@^7.0.8:
   version "7.0.8"
   resolved "https://registry.yarnpkg.com/postcss-custom-media/-/postcss-custom-media-7.0.8.tgz#fffd13ffeffad73621be5f387076a28b00294e0c"
@@ -9943,6 +10284,26 @@ postcss-dir-pseudo-class@^5.0.0:
     postcss "^7.0.2"
     postcss-selector-parser "^5.0.0-rc.3"
 
+postcss-discard-comments@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-discard-comments/-/postcss-discard-comments-5.0.3.tgz#011acb63418d600fdbe18804e1bbecb543ad2f87"
+  integrity sha512-6W5BemziRoqIdAKT+1QjM4bNcJAQ7z7zk073730NHg4cUXh3/rQHHj7pmYxUB9aGhuRhBiUf0pXvIHkRwhQP0Q==
+
+postcss-discard-duplicates@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-discard-duplicates/-/postcss-discard-duplicates-5.0.3.tgz#10f202a4cfe9d407b73dfea7a477054d21ea0c1f"
+  integrity sha512-vPtm1Mf+kp7iAENTG7jI1MN1lk+fBqL5y+qxyi4v3H+lzsXEdfS3dwUZD45KVhgzDEgduur8ycB4hMegyMTeRw==
+
+postcss-discard-empty@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-discard-empty/-/postcss-discard-empty-5.0.3.tgz#ec185af4a3710b88933b0ff751aa157b6041dd6a"
+  integrity sha512-xGJugpaXKakwKI7sSdZjUuN4V3zSzb2Y0LOlmTajFbNinEjTfVs9PFW2lmKBaC/E64WwYppfqLD03P8l9BuueA==
+
+postcss-discard-overridden@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-discard-overridden/-/postcss-discard-overridden-5.0.4.tgz#cc999d6caf18ea16eff8b2b58f48ec3ddee35c9c"
+  integrity sha512-3j9QH0Qh1KkdxwiZOW82cId7zdwXVQv/gRXYDnwx5pBtR1sTkU4cXRK9lp5dSdiM0r0OICO/L8J6sV1/7m0kHg==
+
 postcss-double-position-gradients@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/postcss-double-position-gradients/-/postcss-double-position-gradients-1.0.0.tgz#fc927d52fddc896cb3a2812ebc5df147e110522e"
@@ -10041,6 +10402,56 @@ postcss-media-minmax@^4.0.0:
   dependencies:
     postcss "^7.0.2"
 
+postcss-merge-longhand@^5.0.6:
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/postcss-merge-longhand/-/postcss-merge-longhand-5.0.6.tgz#090e60d5d3b3caad899f8774f8dccb33217d2166"
+  integrity sha512-rkmoPwQO6ymJSmWsX6l2hHeEBQa7C4kJb9jyi5fZB1sE8nSCv7sqchoYPixRwX/yvLoZP2y6FA5kcjiByeJqDg==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+    stylehacks "^5.0.3"
+
+postcss-merge-rules@^5.0.6:
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-5.0.6.tgz#26b37411fe1e80202fcef61cab027265b8925f2b"
+  integrity sha512-nzJWJ9yXWp8AOEpn/HFAW72WKVGD2bsLiAmgw4hDchSij27bt6TF+sIK0cJUBAYT3SGcjtGGsOR89bwkkMuMgQ==
+  dependencies:
+    browserslist "^4.16.6"
+    caniuse-api "^3.0.0"
+    cssnano-utils "^3.0.2"
+    postcss-selector-parser "^6.0.5"
+
+postcss-minify-font-values@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-minify-font-values/-/postcss-minify-font-values-5.0.4.tgz#627d824406b0712243221891f40a44fffe1467fd"
+  integrity sha512-RN6q3tyuEesvyCYYFCRGJ41J1XFvgV+dvYGHr0CeHv8F00yILlN8Slf4t8XW4IghlfZYCeyRrANO6HpJ948ieA==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-minify-gradients@^5.0.6:
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/postcss-minify-gradients/-/postcss-minify-gradients-5.0.6.tgz#b07cef51a93f075e94053fd972ff1cba2eaf6503"
+  integrity sha512-E/dT6oVxB9nLGUTiY/rG5dX9taugv9cbLNTFad3dKxOO+BQg25Q/xo2z2ddG+ZB1CbkZYaVwx5blY8VC7R/43A==
+  dependencies:
+    colord "^2.9.1"
+    cssnano-utils "^3.0.2"
+    postcss-value-parser "^4.2.0"
+
+postcss-minify-params@^5.0.5:
+  version "5.0.5"
+  resolved "https://registry.yarnpkg.com/postcss-minify-params/-/postcss-minify-params-5.0.5.tgz#86cb624358cd45c21946f8c317893f0449396646"
+  integrity sha512-YBNuq3Rz5LfLFNHb9wrvm6t859b8qIqfXsWeK7wROm3jSKNpO1Y5e8cOyBv6Acji15TgSrAwb3JkVNCqNyLvBg==
+  dependencies:
+    browserslist "^4.16.6"
+    cssnano-utils "^3.0.2"
+    postcss-value-parser "^4.2.0"
+
+postcss-minify-selectors@^5.1.3:
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/postcss-minify-selectors/-/postcss-minify-selectors-5.1.3.tgz#6ac12d52aa661fd509469d87ab2cebb0a1e3a1b5"
+  integrity sha512-9RJfTiQEKA/kZhMaEXND893nBqmYQ8qYa/G+uPdVnXF6D/FzpfI6kwBtWEcHx5FqDbA79O9n6fQJfrIj6M8jvQ==
+  dependencies:
+    postcss-selector-parser "^6.0.5"
+
 postcss-modules-extract-imports@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d"
@@ -10076,6 +10487,77 @@ postcss-nesting@^7.0.0:
   dependencies:
     postcss "^7.0.2"
 
+postcss-normalize-charset@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-5.0.3.tgz#719fb9f9ca9835fcbd4fed8d6e0d72a79e7b5472"
+  integrity sha512-iKEplDBco9EfH7sx4ut7R2r/dwTnUqyfACf62Unc9UiyFuI7uUqZZtY+u+qp7g8Qszl/U28HIfcsI3pEABWFfA==
+
+postcss-normalize-display-values@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-display-values/-/postcss-normalize-display-values-5.0.3.tgz#94cc82e20c51cc4ffba6b36e9618adc1e50db8c1"
+  integrity sha512-FIV5FY/qs4Ja32jiDb5mVj5iWBlS3N8tFcw2yg98+8MkRgyhtnBgSC0lxU+16AMHbjX5fbSJgw5AXLMolonuRQ==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-positions@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-positions/-/postcss-normalize-positions-5.0.4.tgz#4001f38c99675437b83277836fb4291887fcc6cc"
+  integrity sha512-qynirjBX0Lc73ROomZE3lzzmXXTu48/QiEzKgMeqh28+MfuHLsuqC9po4kj84igZqqFGovz8F8hf44hA3dPYmQ==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-repeat-style@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-repeat-style/-/postcss-normalize-repeat-style-5.0.4.tgz#d005adf9ee45fae78b673031a376c0c871315145"
+  integrity sha512-Innt+wctD7YpfeDR7r5Ik6krdyppyAg2HBRpX88fo5AYzC1Ut/l3xaxACG0KsbX49cO2n5EB13clPwuYVt8cMA==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-string@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-string/-/postcss-normalize-string-5.0.4.tgz#b5e00a07597e7aa8a871817bfeac2bfaa59c3333"
+  integrity sha512-Dfk42l0+A1CDnVpgE606ENvdmksttLynEqTQf5FL3XGQOyqxjbo25+pglCUvziicTxjtI2NLUR6KkxyUWEVubQ==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-timing-functions@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-timing-functions/-/postcss-normalize-timing-functions-5.0.3.tgz#47210227bfcba5e52650d7a18654337090de7072"
+  integrity sha512-QRfjvFh11moN4PYnJ7hia4uJXeFotyK3t2jjg8lM9mswleGsNw2Lm3I5wO+l4k1FzK96EFwEVn8X8Ojrp2gP4g==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-unicode@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-unicode/-/postcss-normalize-unicode-5.0.4.tgz#02866096937005cdb2c17116c690f29505a1623d"
+  integrity sha512-W79Regn+a+eXTzB+oV/8XJ33s3pDyFTND2yDuUCo0Xa3QSy1HtNIfRVPXNubHxjhlqmMFADr3FSCHT84ITW3ig==
+  dependencies:
+    browserslist "^4.16.6"
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-url@^5.0.5:
+  version "5.0.5"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-url/-/postcss-normalize-url-5.0.5.tgz#c39efc12ff119f6f45f0b4f516902b12c8080e3a"
+  integrity sha512-Ws3tX+PcekYlXh+ycAt0wyzqGthkvVtZ9SZLutMVvHARxcpu4o7vvXcNoiNKyjKuWecnjS6HDI3fjBuDr5MQxQ==
+  dependencies:
+    normalize-url "^6.0.1"
+    postcss-value-parser "^4.2.0"
+
+postcss-normalize-whitespace@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-normalize-whitespace/-/postcss-normalize-whitespace-5.0.4.tgz#1d477e7da23fecef91fc4e37d462272c7b55c5ca"
+  integrity sha512-wsnuHolYZjMwWZJoTC9jeI2AcjA67v4UuidDrPN9RnX8KIZfE+r2Nd6XZRwHVwUiHmRvKQtxiqo64K+h8/imaw==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
+postcss-ordered-values@^5.0.5:
+  version "5.0.5"
+  resolved "https://registry.yarnpkg.com/postcss-ordered-values/-/postcss-ordered-values-5.0.5.tgz#e878af822a130c3f3709737e24cb815ca7c6d040"
+  integrity sha512-mfY7lXpq+8bDEHfP+muqibDPhZ5eP9zgBEF9XRvoQgXcQe2Db3G1wcvjbnfjXG6wYsl+0UIjikqq4ym1V2jGMQ==
+  dependencies:
+    cssnano-utils "^3.0.2"
+    postcss-value-parser "^4.2.0"
+
 postcss-overflow-shorthand@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/postcss-overflow-shorthand/-/postcss-overflow-shorthand-2.0.0.tgz#31ecf350e9c6f6ddc250a78f0c3e111f32dd4c30"
@@ -10149,6 +10631,21 @@ postcss-pseudo-class-any-link@^6.0.0:
     postcss "^7.0.2"
     postcss-selector-parser "^5.0.0-rc.3"
 
+postcss-reduce-initial@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/postcss-reduce-initial/-/postcss-reduce-initial-5.0.3.tgz#68891594defd648253703bbd8f1093162f19568d"
+  integrity sha512-c88TkSnQ/Dnwgb4OZbKPOBbCaauwEjbECP5uAuFPOzQ+XdjNjRH7SG0dteXrpp1LlIFEKK76iUGgmw2V0xeieA==
+  dependencies:
+    browserslist "^4.16.6"
+    caniuse-api "^3.0.0"
+
+postcss-reduce-transforms@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-reduce-transforms/-/postcss-reduce-transforms-5.0.4.tgz#717e72d30befe857f7d2784dba10eb1157863712"
+  integrity sha512-VIJB9SFSaL8B/B7AXb7KHL6/GNNbbCHslgdzS9UDfBZYIA2nx8NLY7iD/BXFSO/1sRUILzBTfHCoW5inP37C5g==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+
 postcss-replace-overflow-wrap@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-replace-overflow-wrap/-/postcss-replace-overflow-wrap-3.0.0.tgz#61b360ffdaedca84c7c918d2b0f0d0ea559ab01c"
@@ -10189,6 +10686,29 @@ postcss-selector-parser@^6.0.2, postcss-selector-parser@^6.0.4:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
+postcss-selector-parser@^6.0.5, postcss-selector-parser@^6.0.9:
+  version "6.0.9"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.9.tgz#ee71c3b9ff63d9cd130838876c13a2ec1a992b2f"
+  integrity sha512-UO3SgnZOVTwu4kyLR22UQ1xZh086RyNZppb7lLAKBFK8a32ttG5i87Y/P3+2bRSjZNyJ1B7hfFNo273tKe9YxQ==
+  dependencies:
+    cssesc "^3.0.0"
+    util-deprecate "^1.0.2"
+
+postcss-svgo@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-5.0.4.tgz#cfa8682f47b88f7cd75108ec499e133b43102abf"
+  integrity sha512-yDKHvULbnZtIrRqhZoA+rxreWpee28JSRH/gy9727u0UCgtpv1M/9WEWY3xySlFa0zQJcqf6oCBJPR5NwkmYpg==
+  dependencies:
+    postcss-value-parser "^4.2.0"
+    svgo "^2.7.0"
+
+postcss-unique-selectors@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-unique-selectors/-/postcss-unique-selectors-5.0.4.tgz#08e188126b634ddfa615fb1d6c262bafdd64826e"
+  integrity sha512-5ampwoSDJCxDPoANBIlMgoBcYUHnhaiuLYJR5pj1DLnYQvMRVyFuTA5C3Bvt+aHtiqWpJkD/lXT50Vo1D0ZsAQ==
+  dependencies:
+    postcss-selector-parser "^6.0.5"
+
 postcss-url@^10.1.3:
   version "10.1.3"
   resolved "https://registry.yarnpkg.com/postcss-url/-/postcss-url-10.1.3.tgz#54120cc910309e2475ec05c2cfa8f8a2deafdf1e"
@@ -10204,6 +10724,11 @@ postcss-value-parser@^4.1.0:
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.1.0.tgz#443f6a20ced6481a2bda4fa8532a6e55d789a2cb"
   integrity sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==
 
+postcss-value-parser@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
+  integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
+
 postcss-values-parser@^2.0.0, postcss-values-parser@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/postcss-values-parser/-/postcss-values-parser-2.0.1.tgz#da8b472d901da1e205b47bdc98637b9e9e550e5f"
@@ -10239,6 +10764,15 @@ postcss@^8.1.4:
     picocolors "^1.0.0"
     source-map-js "^0.6.2"
 
+postcss@^8.3.5:
+  version "8.4.6"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.6.tgz#c5ff3c3c457a23864f32cb45ac9b741498a09ae1"
+  integrity sha512-OovjwIzs9Te46vlEx7+uXB0PLijpwjXGKXjVGGPIGubGpq7uh5Xgf6D6FiJ/SzJMBosHDp6a2hiXOS97iBXcaA==
+  dependencies:
+    nanoid "^3.2.0"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
@@ -10887,6 +11421,11 @@ require-directory@^2.1.1:
   resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42"
   integrity sha1-jGStX9MNqxyXbiNE/+f3kqam30I=
 
+require-from-string@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-2.0.2.tgz#89a7fdd938261267318eafe14f9c32e598c36909"
+  integrity sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==
+
 require-main-filename@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-2.0.0.tgz#d0b329ecc7cc0f61649f62215be69af54aa8989b"
@@ -11160,6 +11699,16 @@ schema-utils@^3.0.0, schema-utils@^3.1.0, schema-utils@^3.1.1:
     ajv "^6.12.5"
     ajv-keywords "^3.5.2"
 
+schema-utils@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-4.0.0.tgz#60331e9e3ae78ec5d16353c467c34b3a0a1d3df7"
+  integrity sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==
+  dependencies:
+    "@types/json-schema" "^7.0.9"
+    ajv "^8.8.0"
+    ajv-formats "^2.1.1"
+    ajv-keywords "^5.0.0"
+
 scss-tokenizer@^0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz#8eb06db9a9723333824d3f5530641149847ce5d1"
@@ -11439,6 +11988,11 @@ source-map-js@^0.6.2:
   resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-0.6.2.tgz#0bb5de631b41cfbda6cfba8bd05a80efdfd2385e"
   integrity sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==
 
+source-map-js@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
+  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
+
 source-map-resolve@^0.5.0:
   version "0.5.3"
   resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.3.tgz#190866bece7553e1f8f267a2ee82c606b5509a1a"
@@ -11576,6 +12130,11 @@ ssri@^6.0.0, ssri@^6.0.1:
   dependencies:
     figgy-pudding "^3.5.1"
 
+stable@^0.1.8:
+  version "0.1.8"
+  resolved "https://registry.yarnpkg.com/stable/-/stable-0.1.8.tgz#836eb3c8382fe2936feaf544631017ce7d47a3cf"
+  integrity sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==
+
 stack-utils@^2.0.2:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.5.tgz#d25265fca995154659dbbfba3b49254778d2fdd5"
@@ -11823,6 +12382,14 @@ style-loader@2.0.0:
     loader-utils "^2.0.0"
     schema-utils "^3.0.0"
 
+stylehacks@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-5.0.3.tgz#2ef3de567bfa2be716d29a93bf3d208c133e8d04"
+  integrity sha512-ENcUdpf4yO0E1rubu8rkxI+JGQk4CgjchynZ4bDBJDfqdy+uhTRSWb8/F3Jtu+Bw5MW45Po3/aQGeIyyxgQtxg==
+  dependencies:
+    browserslist "^4.16.6"
+    postcss-selector-parser "^6.0.4"
+
 supports-color@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
@@ -11857,6 +12424,19 @@ supports-hyperlinks@^2.0.0:
     has-flag "^4.0.0"
     supports-color "^7.0.0"
 
+svgo@^2.7.0:
+  version "2.8.0"
+  resolved "https://registry.yarnpkg.com/svgo/-/svgo-2.8.0.tgz#4ff80cce6710dc2795f0c7c74101e6764cfccd24"
+  integrity sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg==
+  dependencies:
+    "@trysound/sax" "0.2.0"
+    commander "^7.2.0"
+    css-select "^4.1.3"
+    css-tree "^1.1.3"
+    csso "^4.2.0"
+    picocolors "^1.0.0"
+    stable "^0.1.8"
+
 swiper@6.8.0:
   version "6.8.0"
   resolved "https://registry.yarnpkg.com/swiper/-/swiper-6.8.0.tgz#61c850f49ba778e403f00a01fe0b768bd85d0d20"
@@ -12032,6 +12612,11 @@ through@2, "through@>=2.2.7 <3", through@^2.3.4, through@^2.3.6, through@^2.3.8:
   resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
   integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=
 
+timsort@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4"
+  integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=
+
 tiny-invariant@1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.1.0.tgz#634c5f8efdc27714b7f386c35e6760991d230875"
@@ -12952,7 +13537,7 @@ yallist@^4.0.0:
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
   integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
 
-yaml@^1.10.0, yaml@^1.7.2:
+yaml@^1.10.0, yaml@^1.10.2, yaml@^1.7.2:
   version "1.10.2"
   resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
   integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==