diff --git a/.eslintignore b/.eslintignore
deleted file mode 100644
index 34af3774f..000000000
--- a/.eslintignore
+++ /dev/null
@@ -1,2 +0,0 @@
-build/*.js
-config/*.js
diff --git a/.eslintrc.js b/.eslintrc.js
deleted file mode 100644
index 361cff5f2..000000000
--- a/.eslintrc.js
+++ /dev/null
@@ -1,27 +0,0 @@
-module.exports = {
-  root: true,
-  parserOptions: {
-    parser: '@babel/eslint-parser',
-    sourceType: 'module'
-  },
-  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
-  extends: [
-    'standard',
-    'plugin:vue/recommended'
-  ],
-  // required to lint *.vue files
-  plugins: [
-    'vue'
-  ],
-  // add your custom rules here
-  rules: {
-    // allow paren-less arrow functions
-    'arrow-parens': 0,
-    // allow async-await
-    'generator-star-spacing': 0,
-    // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'vue/require-prop-types': 0,
-    'vue/multi-word-component-names': 0
-  }
-}
diff --git a/.gitattributes b/.gitattributes
index c5b9ea10e..1bea4dc8f 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -1 +1 @@
-/build/webpack.prod.conf.js export-subst
+/build/commit_hash.js export-subst
diff --git a/.gitignore b/.gitignore
index 0d5befd28..01ffda9a8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,5 +7,6 @@ test/e2e/reports
 selenium-debug.log
 .idea/
 config/local.json
-static/emoji.json
+src/assets/emoji.json
 logs/
+__screenshots__/
diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index f4c5cf43a..99c85dd36 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -1,7 +1,7 @@
 # This file is a template, and might need editing before it works on your project.
 # Official framework image. Look for the different tagged releases at:
 # https://hub.docker.com/r/library/node/tags/
-image: node:16
+image: node:18
 
 stages:
   - check-changelog
@@ -38,8 +38,8 @@ lint:
   stage: lint
   script:
     - yarn
-    - npm run lint
-    - npm run stylelint
+    - yarn lint
+    - yarn stylelint
 
 test:
   stage: test
@@ -50,10 +50,15 @@ test:
     APT_CACHE_DIR: apt-cache
   script:
     - mkdir -pv $APT_CACHE_DIR && apt-get -qq update
-    - apt install firefox-esr -y --no-install-recommends
-    - firefox --version
     - yarn
-    - yarn unit
+    - yarn playwright install firefox
+    - yarn playwright install-deps
+    - yarn unit-ci
+  artifacts:
+    # When the test fails, upload screenshots for better context on why it fails
+    paths:
+      - test/**/__screenshots__
+    when: on_failure
 
 build:
   stage: build
@@ -62,7 +67,7 @@ build:
     - himem
   script:
     - yarn
-    - npm run build
+    - yarn build
   artifacts:
     paths:
     - dist/
diff --git a/.gitlab/merge_request_templates/Release.md b/.gitlab/merge_request_templates/Release.md
new file mode 100644
index 000000000..d02e14a73
--- /dev/null
+++ b/.gitlab/merge_request_templates/Release.md
@@ -0,0 +1,8 @@
+### Release checklist
+* [ ] Bump version in `package.json`
+* [ ] Compile a changelog with the `tools/collect-changelog` script
+* [ ] Create an MR with an announcement to pleroma.social
+#### post-merge
+* [ ] Tag the release on the merge commit
+* [ ] Make the tag into a Gitlab Release™
+* [ ] Merge `master` into `develop` (in case the fixes are already in develop, use `git merge -s ours --no-commit` and manually merge the changelogs)
diff --git a/.node-version b/.node-version
index 5397c87fa..08b7109d0 100644
--- a/.node-version
+++ b/.node-version
@@ -1 +1 @@
-16.18.1
+18.20.8
diff --git a/.stylelintrc.json b/.stylelintrc.json
index d6689cc01..afdfd5f5b 100644
--- a/.stylelintrc.json
+++ b/.stylelintrc.json
@@ -1,6 +1,5 @@
 {
   "extends": [
-    "stylelint-rscss/config",
     "stylelint-config-standard",
     "stylelint-config-recommended-scss",
     "stylelint-config-html",
@@ -8,20 +7,13 @@
   ],
   "rules": {
     "declaration-no-important": true,
-    "rscss/no-descendant-combinator": false,
-    "rscss/class-format": [
-      false,
-      {
-        "component": "pascal-case",
-        "variant": "^-[a-z]\\w+",
-        "element": "^[a-z]\\w+"
-      }
-    ],
     "selector-class-pattern": null,
     "import-notation": null,
     "custom-property-pattern": null,
     "keyframes-name-pattern": null,
     "scss/operator-no-newline-after": null,
+    "declaration-property-value-no-unknown": true,
+    "scss/declaration-property-value-no-unknown": true,
     "declaration-block-no-redundant-longhand-properties": [
       true,
       {
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9844319e3..20c9c2693 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,114 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
+## 2.9.3
+### Fixed
+- Being unable to update profile
+
+## 2.9.2
+### Changed
+- BREAKING: due to some internal technical changes logging into AdminFE through PleromaFE is no longer possible
+- User card/profile got an overhaul
+- Profile editing overhaul
+- Visually combined subject and content fields in post form
+- Moved post form's emoji button into input field
+- Minor visual changes and fixes
+- Clicking on fav/rt/emoji notifications' contents expands/collapses it
+- Reduced time taken processing theme by half
+- Splash screen only appears if loading takes more than 2 seconds
+
+### Added
+- Mutes received an update, adding support for regex, muting based on username and expiration time.
+- Mutes are now synchronized across sessions
+- Support for expiring mutes and blocks (if available)
+- Clicking on emoji shows bigger version of it alongside with its shortcode
+  - Admins also are able to copy it into a local pack
+- Added support for Akkoma and IceShrimp.NET backends
+- Compatibility with stricter CSP (Akkoma backend)
+- Added a way to upload new packs from a URL or ZIP file via the Admin Dashboard
+- Unify show/hide content buttons
+- Add support for detachable scrollTop button
+- Option to left-align user bio
+- Cache assets and emojis with service worker
+- Indicate currently active V3 theme as a body element class
+- Add arithmetic blend ISS function
+
+### Fixed
+- Display counter for status action buttons when they are in the menu
+- Fix bookmark button alignment in the extra actions menu
+- Instance favicons are no longer stretched
+- A lot more scalable UI fixes
+  - Emoji picker now should work fine when emoji size is increased
+
+## 2.8.0
+### Changed
+- BREAKING: static/img/nsfw.2958239.png is now static/img/nsfw.DepQPhG0.png, which may affect people who specify exactly this path as the cover image
+- BREAKING: static/emoji.json is replaced with a properly hashed path under static/js in the production build, meaning server admins cannot provide their own set of unicode emojis by overriding this file (custom (image-based) emojis not affected)
+- Speed up initial boot.
+- Updated our build system to support browsers:
+  Safari >= 15
+  Firefox >= 115
+  Android > 4
+  no Opera Mini support
+  no IE support
+  no "dead" (unmaintained) browsers support
+
+This does not guarantee that browsers will or will not work.
+
+- Use /api/v1/accounts/:id/follow for account subscriptions instead of the deprecated routes
+- Modal layout for mobile has new layout to make it easy to use
+- Better display of mute reason on posts
+- Simplify the OAuth client_name to 'PleromaFE'
+- Partially migrated from vuex to pinia
+- Authenticate and subscribe to streaming after connection
+- Tabs now have indentation for better visibility of which tab is currently active
+- Upgraded Vue to version 3.5
+
+### Added
+- Support bookmark folders
+- Some new default color schemes
+- Added support for fetching /{resource}.custom.ext to allow adding instance-specific themes without altering sourcetree
+- Post actions customization
+- Support displaying time in absolute format
+- Add draft management system
+- Compress most kinds of images on upload.
+- Added option to always convert images to JPEG format instead of using WebP when compressing images. 
+- Added configurable image compression option in general settings, allowing users to control whether images are compressed before upload. 
+- Inform users that Smithereen public polls are public
+- Splash screen + loading indicator to make process of identifying initialization issues and load performance
+- UI for making v3 themes and palettes, support for bundling v3 themes
+- Make UserLink wrappable
+
+### Fixed
+- Fixed occasional overflows in emoji picker and made header scrollable
+- Updated shadow editor, hopefully fixed long-standing bugs, added ability to specify shadow's name.
+- Checkbox vertical alignment
+- Check for canvas extract permission when initializing favicon service
+- Fix some of the color manipulation functions
+- Fix draft saving when auto-save is off
+- Switch from class hack to normalButton attribute for emoji count popover
+- Fix emoji inconsistencies in notifications,
+- Fix some emoji not scaling with interface
+- Make sure hover style is also applied to :focus-visible
+- Improved ToS and registration
+- Fix small markup inconsistencies
+- Fixed modals buttons overflow
+- Fix whitespaces for multiple status mute reasons, display bot status reason
+- Create an OAuth app only when needed
+- Fix CSS compatibility issues in style_setter.js for older browsers like Palemoon
+- Proper sticky header for conversations on user page
+- Add text label for more actions button in post status form
+- Reply-or-quote buttons now take less space
+- Allow repeats of own posts with private scopes
+- Bookmarks visible again on mobile
+- Remove focusability on hidden popover in subject input
+- Show only month and day instead of weird "day, hour" format.
+
+### Removed
+- BREAKING: drop support for browsers that do not support `<script type="module">`
+- BREAKING: css source map does not work in production (see https://github.com/vitejs/vite/issues/2830 )
+- Remove emoji annotations code for unused languages from final build
+
 ## 2.7.1
 Bugfix release. Added small optimizations to emoji picker that should make it a bit more responsive, however it needs rather large change to make it more performant which might come in a major release.
 
diff --git a/build/build.js b/build/build.js
deleted file mode 100644
index 8242bc5f6..000000000
--- a/build/build.js
+++ /dev/null
@@ -1,43 +0,0 @@
-// https://github.com/shelljs/shelljs
-require('./check-versions')()
-require('shelljs/global')
-env.NODE_ENV = 'production'
-
-var path = require('path')
-var config = require('../config')
-var ora = require('ora')
-var webpack = require('webpack')
-var webpackConfig = require('./webpack.prod.conf')
-
-console.log(
-  '  Tip:\n' +
-  '  Built files are meant to be served over an HTTP server.\n' +
-  '  Opening index.html over file:// won\'t work.\n'
-)
-
-var spinner = ora('building for production...')
-spinner.start()
-
-var updateEmoji = require('./update-emoji').updateEmoji
-updateEmoji()
-
-var assetsPath = path.join(config.build.assetsRoot, config.build.assetsSubDirectory)
-rm('-rf', assetsPath)
-mkdir('-p', assetsPath)
-cp('-R', 'static/*', assetsPath)
-
-webpack(webpackConfig, function (err, stats) {
-  spinner.stop()
-  if (err) throw err
-  process.stdout.write(stats.toString({
-    colors: true,
-    modules: false,
-    children: false,
-    chunks: false,
-    chunkModules: false
-  }) + '\n')
-  if (stats.hasErrors()) {
-    console.error('See above for errors.')
-    process.exit(1)
-  }
-})
diff --git a/build/check-versions.js b/build/check-versions.js
deleted file mode 100644
index e2b6cf74c..000000000
--- a/build/check-versions.js
+++ /dev/null
@@ -1,45 +0,0 @@
-var semver = require('semver')
-var chalk = require('chalk')
-var packageConfig = require('../package.json')
-var exec = function (cmd) {
-  return require('child_process')
-    .execSync(cmd).toString().trim()
-}
-
-var versionRequirements = [
-  {
-    name: 'node',
-    currentVersion: semver.clean(process.version),
-    versionRequirement: packageConfig.engines.node
-  },
-  {
-    name: 'npm',
-    currentVersion: exec('npm --version'),
-    versionRequirement: packageConfig.engines.npm
-  }
-]
-
-module.exports = function () {
-  var warnings = []
-  for (var i = 0; i < versionRequirements.length; i++) {
-    var mod = versionRequirements[i]
-    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
-      warnings.push(mod.name + ': ' +
-        chalk.red(mod.currentVersion) + ' should be ' +
-        chalk.green(mod.versionRequirement)
-      )
-    }
-  }
-
-  if (warnings.length) {
-    console.log('')
-    console.log(chalk.yellow('To use this template, you must update following to modules:'))
-    console.log()
-    for (var i = 0; i < warnings.length; i++) {
-      var warning = warnings[i]
-      console.log('  ' + warning)
-    }
-    console.log()
-    process.exit(1)
-  }
-}
diff --git a/build/check-versions.mjs b/build/check-versions.mjs
new file mode 100644
index 000000000..73c1eeb15
--- /dev/null
+++ b/build/check-versions.mjs
@@ -0,0 +1,35 @@
+import semver from 'semver'
+import chalk from 'chalk'
+
+import packageConfig from '../package.json' with { type: 'json' }
+
+var versionRequirements = [
+  {
+    name: 'node',
+    currentVersion: semver.clean(process.version),
+    versionRequirement: packageConfig.engines.node
+  }
+]
+
+export default function () {
+  const warnings = []
+  for (let i = 0; i < versionRequirements.length; i++) {
+    const mod = versionRequirements[i]
+    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
+      warnings.push(mod.name + ': ' +
+        chalk.red(mod.currentVersion) + ' should be ' +
+        chalk.green(mod.versionRequirement)
+      )
+    }
+  }
+
+  if (warnings.length) {
+    console.warn(chalk.yellow('\nTo use this template, you must update following to modules:\n'))
+    for (let i = 0; i < warnings.length; i++) {
+      const warning = warnings[i]
+      console.warn('  ' + warning)
+    }
+    console.warn()
+    process.exit(1)
+  }
+}
diff --git a/build/commit_hash.js b/build/commit_hash.js
new file mode 100644
index 000000000..c104af5d9
--- /dev/null
+++ b/build/commit_hash.js
@@ -0,0 +1,18 @@
+import childProcess from 'child_process'
+
+export const getCommitHash = (() => {
+  const subst = "$Format:%h$"
+  if(!subst.match(/Format:/)) {
+    return subst
+  } else {
+    try {
+      return childProcess
+        .execSync('git rev-parse --short HEAD')
+        .toString()
+        .trim()
+    } catch (e) {
+      console.error('Failed run git:', e)
+      return 'UNKNOWN'
+    }
+  }
+})
diff --git a/build/copy_plugin.js b/build/copy_plugin.js
new file mode 100644
index 000000000..a783fe7ff
--- /dev/null
+++ b/build/copy_plugin.js
@@ -0,0 +1,40 @@
+import serveStatic from 'serve-static'
+import { resolve } from 'node:path'
+import { cp } from 'node:fs/promises'
+
+const getPrefix = s => {
+  const padEnd = s.endsWith('/') ? s : s + '/'
+  return padEnd.startsWith('/') ? padEnd : '/' + padEnd
+}
+
+const copyPlugin = ({ inUrl, inFs }) => {
+  const prefix = getPrefix(inUrl)
+  const subdir = prefix.slice(1)
+  let copyTarget
+  const handler = serveStatic(inFs)
+
+  return [{
+    name: 'copy-plugin-serve',
+    apply: 'serve',
+    configureServer (server) {
+      server.middlewares.use(prefix, handler)
+    }
+  }, {
+    name: 'copy-plugin-build',
+    apply: 'build',
+    configResolved (config) {
+      copyTarget = resolve(config.root, config.build.outDir, subdir)
+    },
+    closeBundle: {
+      order: 'post',
+      sequential: true,
+      async handler () {
+        console.log(`Copying '${inFs}' to ${copyTarget}...`)
+        await cp(inFs, copyTarget, { recursive: true })
+        console.log('Done.')
+      }
+    }
+  }]
+}
+
+export default copyPlugin
diff --git a/build/dev-client.js b/build/dev-client.js
deleted file mode 100644
index 18aa1e219..000000000
--- a/build/dev-client.js
+++ /dev/null
@@ -1,9 +0,0 @@
-/* eslint-disable */
-require('eventsource-polyfill')
-var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true')
-
-hotClient.subscribe(function (event) {
-  if (event.action === 'reload') {
-    window.location.reload()
-  }
-})
diff --git a/build/dev-server.js b/build/dev-server.js
deleted file mode 100644
index e51ba9484..000000000
--- a/build/dev-server.js
+++ /dev/null
@@ -1,81 +0,0 @@
-require('./check-versions')()
-var config = require('../config')
-if (!process.env.NODE_ENV) process.env.NODE_ENV = config.dev.env
-var path = require('path')
-var express = require('express')
-var webpack = require('webpack')
-var opn = require('opn')
-var proxyMiddleware = require('http-proxy-middleware')
-var webpackConfig = process.env.NODE_ENV === 'testing'
-  ? require('./webpack.prod.conf')
-  : require('./webpack.dev.conf')
-
-var updateEmoji = require('./update-emoji').updateEmoji
-updateEmoji()
-
-// default port where dev server listens for incoming traffic
-var port = process.env.PORT || config.dev.port
-// Define HTTP proxies to your custom API backend
-// https://github.com/chimurai/http-proxy-middleware
-var proxyTable = config.dev.proxyTable
-
-var app = express()
-var compiler = webpack(webpackConfig)
-
-var devMiddleware = require('webpack-dev-middleware')(compiler, {
-  publicPath: webpackConfig.output.publicPath,
-  writeToDisk: true,
-  stats: {
-    colors: true,
-    chunks: false
-  }
-})
-
-var hotMiddleware = require('webpack-hot-middleware')(compiler)
-
-// FIXME: The statement below gives error about hooks being required in webpack 5.
-// force page reload when html-webpack-plugin template changes
-// compiler.plugin('compilation', function (compilation) {
-//   compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
-//     // FIXME: This supposed to reload whole page when index.html is changed,
-//     // however now it reloads entire page on every breath, i suppose the order
-//     // of plugins changed or something. It's a minor thing and douesn't hurt
-//     // disabling it, constant reloads hurt much more
-
-//     // hotMiddleware.publish({ action: 'reload' })
-//     // cb()
-//   })
-// })
-
-// proxy api requests
-Object.keys(proxyTable).forEach(function (context) {
-  var options = proxyTable[context]
-  if (typeof options === 'string') {
-    options = { target: options }
-  }
-  app.use(proxyMiddleware.createProxyMiddleware(context, options))
-})
-
-// handle fallback for HTML5 history API
-app.use(require('connect-history-api-fallback')())
-
-// serve webpack bundle output
-app.use(devMiddleware)
-
-// enable hot-reload and state-preserving
-// compilation error display
-app.use(hotMiddleware)
-
-// serve pure static assets
-var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
-app.use(staticPath, express.static('./static'))
-
-module.exports = app.listen(port, function (err) {
-  if (err) {
-    console.log(err)
-    return
-  }
-  var uri = 'http://localhost:' + port
-  console.log('Listening at ' + uri + '\n')
-  // opn(uri)
-})
diff --git a/build/emojis_plugin.js b/build/emojis_plugin.js
new file mode 100644
index 000000000..aed52066d
--- /dev/null
+++ b/build/emojis_plugin.js
@@ -0,0 +1,64 @@
+import { resolve } from 'node:path'
+import { access } from 'node:fs/promises'
+import { languages, langCodeToCldrName } from '../src/i18n/languages.js'
+
+const annotationsImportPrefix = '@kazvmoe-infra/unicode-emoji-json/annotations/'
+const specialAnnotationsLocale = {
+  ja_easy: 'ja'
+}
+
+const internalToAnnotationsLocale = (internal) => specialAnnotationsLocale[internal] || internal
+
+// This gets all the annotations that are accessible (whose language
+// can be chosen in the settings). Data for other languages are
+// discarded because there is no way for it to be fetched.
+const getAllAccessibleAnnotations = async (projectRoot) => {
+  const imports = (await Promise.all(
+    languages
+      .map(async lang => {
+        const destLang = internalToAnnotationsLocale(lang)
+        const importModule = `${annotationsImportPrefix}${destLang}.json`
+        const importFile = resolve(projectRoot, 'node_modules', importModule)
+        try {
+          await access(importFile)
+          return `'${lang}': () => import('${importModule}')`
+        } catch (e) {
+          return
+        }
+      })))
+        .filter(k => k)
+        .join(',\n')
+
+  return `
+export const annotationsLoader = {
+  ${imports}
+}
+`
+}
+
+const emojiAnnotationsId = 'virtual:pleroma-fe/emoji-annotations'
+const emojiAnnotationsIdResolved = '\0' + emojiAnnotationsId
+
+const emojisPlugin = () => {
+  let projectRoot
+  return {
+    name: 'emojis-plugin',
+    configResolved (conf) {
+      projectRoot = conf.root
+    },
+    resolveId (id) {
+      if (id === emojiAnnotationsId) {
+        return emojiAnnotationsIdResolved
+      }
+      return null
+    },
+    async load (id) {
+      if (id === emojiAnnotationsIdResolved) {
+        return await getAllAccessibleAnnotations(projectRoot)
+      }
+      return null
+    }
+  }
+}
+
+export default emojisPlugin
diff --git a/build/msw_plugin.js b/build/msw_plugin.js
new file mode 100644
index 000000000..f544348fc
--- /dev/null
+++ b/build/msw_plugin.js
@@ -0,0 +1,28 @@
+import { resolve } from 'node:path'
+import { readFile } from 'node:fs/promises'
+
+const target = 'node_modules/msw/lib/mockServiceWorker.js'
+
+const mswPlugin = () => {
+  let projectRoot
+  return {
+    name: 'msw-plugin',
+    apply: 'serve',
+    configResolved (conf) {
+      projectRoot = conf.root
+    },
+    configureServer (server) {
+      server.middlewares.use(async (req, res, next) => {
+        if (req.path === '/mockServiceWorker.js') {
+          const file = await readFile(resolve(projectRoot, target))
+          res.set('Content-Type', 'text/javascript')
+          res.send(file)
+        } else {
+          next()
+        }
+      })
+    }
+  }
+}
+
+export default mswPlugin
diff --git a/build/service_worker_messages.js b/build/service_worker_messages.js
new file mode 100644
index 000000000..c078e8563
--- /dev/null
+++ b/build/service_worker_messages.js
@@ -0,0 +1,30 @@
+import { languages, langCodeToJsonName } from '../src/i18n/languages.js'
+import { readFile } from 'node:fs/promises'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+const i18nDir = resolve(
+  dirname(dirname(fileURLToPath(import.meta.url))),
+  'src/i18n'
+)
+
+export const i18nFiles = languages.reduce((acc, lang) => {
+  const name = langCodeToJsonName(lang)
+  const file = resolve(i18nDir, name + '.json')
+  acc[lang] = file
+  return acc
+}, {})
+
+export const generateServiceWorkerMessages = async () => {
+  const msgArray = await Promise.all(Object.entries(i18nFiles).map(async ([lang, file]) => {
+    const fileContent = await readFile(file, 'utf-8')
+    const msg = {
+      notifications: JSON.parse(fileContent).notifications || {}
+    }
+    return [lang, msg]
+  }))
+  return msgArray.reduce((acc, [lang, msg]) => {
+    acc[lang] = msg
+    return acc
+  }, {})
+}
diff --git a/build/sw_plugin.js b/build/sw_plugin.js
new file mode 100644
index 000000000..a2c792b7d
--- /dev/null
+++ b/build/sw_plugin.js
@@ -0,0 +1,211 @@
+import { fileURLToPath } from 'node:url'
+import { dirname, resolve } from 'node:path'
+import { readFile } from 'node:fs/promises'
+import { build } from 'vite'
+import * as esbuild from 'esbuild'
+import { generateServiceWorkerMessages, i18nFiles } from './service_worker_messages.js'
+
+const getSWMessagesAsText = async () => {
+  const messages = await generateServiceWorkerMessages()
+  return `export default ${JSON.stringify(messages, undefined, 2)}`
+}
+const projectRoot = dirname(dirname(fileURLToPath(import.meta.url)))
+
+const swEnvName = 'virtual:pleroma-fe/service_worker_env'
+const swEnvNameResolved = '\0' + swEnvName
+const getDevSwEnv = () => `self.serviceWorkerOption = { assets: [] };`
+const getProdSwEnv = ({ assets }) => `self.serviceWorkerOption = { assets: ${JSON.stringify(assets)} };`
+
+export const devSwPlugin = ({
+  swSrc,
+  swDest,
+  transformSW,
+  alias
+}) => {
+  const swFullSrc = resolve(projectRoot, swSrc)
+  const esbuildAlias = {}
+  Object.entries(alias).forEach(([source, dest]) => {
+    esbuildAlias[source] = dest.startsWith('/') ? projectRoot + dest : dest
+  })
+
+  return {
+    name: 'dev-sw-plugin',
+    apply: 'serve',
+    configResolved (conf) {
+    },
+    resolveId (id) {
+      const name = id.startsWith('/') ? id.slice(1) : id
+      if (name === swDest) {
+        return swFullSrc
+      } else if (name === swEnvName) {
+        return swEnvNameResolved
+      }
+      return null
+    },
+    async load (id) {
+      if (id === swFullSrc) {
+        return readFile(swFullSrc, 'utf-8')
+      } else if (id === swEnvNameResolved) {
+        return getDevSwEnv()
+      }
+      return null
+    },
+    /**
+     * vite does not bundle the service worker
+     * during dev, and firefox does not support ESM as service worker
+     * https://bugzilla.mozilla.org/show_bug.cgi?id=1360870
+     */
+    async transform (code, id) {
+      if (id === swFullSrc && transformSW) {
+        const res = await esbuild.build({
+          entryPoints: [swSrc],
+          bundle: true,
+          write: false,
+          outfile: 'sw-pleroma.js',
+          alias: esbuildAlias,
+          plugins: [{
+            name: 'vite-like-root-resolve',
+            setup (b) {
+              b.onResolve(
+                { filter: new RegExp(/^\//) },
+                args => ({
+                  path: resolve(projectRoot, args.path.slice(1))
+                })
+              )
+            }
+          }, {
+            name: 'sw-messages',
+            setup (b) {
+              b.onResolve(
+                { filter: new RegExp('^' + swMessagesName + '$') },
+                args => ({
+                  path: args.path,
+                  namespace: 'sw-messages'
+                }))
+              b.onLoad(
+                { filter: /.*/, namespace: 'sw-messages' },
+                async () => ({
+                  contents: await getSWMessagesAsText()
+                }))
+            }
+          }, {
+            name: 'sw-env',
+            setup (b) {
+              b.onResolve(
+                { filter: new RegExp('^' + swEnvName + '$') },
+                args => ({
+                  path: args.path,
+                  namespace: 'sw-env'
+                }))
+              b.onLoad(
+                { filter: /.*/, namespace: 'sw-env' },
+                () => ({
+                  contents: getDevSwEnv()
+                }))
+            }
+          }]
+        })
+        const text = res.outputFiles[0].text
+        return text
+      }
+    }
+  }
+}
+
+// Idea taken from
+// https://github.com/vite-pwa/vite-plugin-pwa/blob/main/src/plugins/build.ts
+// rollup does not support compiling to iife if we want to code-split;
+// however, we must compile the service worker to iife because of browser support.
+// Run another vite build just for the service worker targeting iife at
+// the end of the build.
+export const buildSwPlugin = ({
+  swSrc,
+  swDest,
+}) => {
+  let config
+  return {
+    name: 'build-sw-plugin',
+    enforce: 'post',
+    apply: 'build',
+    configResolved (resolvedConfig) {
+      config = {
+        define: resolvedConfig.define,
+        resolve: resolvedConfig.resolve,
+        plugins: [swMessagesPlugin()],
+        publicDir: false,
+        build: {
+          ...resolvedConfig.build,
+          lib: {
+            entry: swSrc,
+            formats: ['iife'],
+            name: 'sw_pleroma'
+          },
+          emptyOutDir: false,
+          rollupOptions: {
+            output: {
+              entryFileNames: swDest
+            }
+          }
+        },
+        configFile: false
+      }
+    },
+    generateBundle: {
+      order: 'post',
+      sequential: true,
+      async handler (_, bundle) {
+        const assets = Object.keys(bundle)
+              .filter(name => !/\.map$/.test(name))
+              .map(name => '/' + name)
+        config.plugins.push({
+          name: 'build-sw-env-plugin',
+          resolveId (id) {
+            if (id === swEnvName) {
+              return swEnvNameResolved
+            }
+            return null
+          },
+          load (id) {
+            if (id === swEnvNameResolved) {
+              return getProdSwEnv({ assets })
+            }
+            return null
+          }
+        })
+      }
+    },
+    closeBundle: {
+      order: 'post',
+      sequential: true,
+      async handler () {
+        console.log('Building service worker for production')
+        await build(config)
+      }
+    }
+  }
+}
+
+const swMessagesName = 'virtual:pleroma-fe/service_worker_messages'
+const swMessagesNameResolved = '\0' + swMessagesName
+
+export const swMessagesPlugin = () => {
+  return {
+    name: 'sw-messages-plugin',
+    resolveId (id) {
+      if (id === swMessagesName) {
+        Object.values(i18nFiles).forEach(f => {
+          this.addWatchFile(f)
+        })
+        return swMessagesNameResolved
+      } else {
+        return null
+      }
+    },
+    async load (id) {
+      if (id === swMessagesNameResolved) {
+        return await getSWMessagesAsText()
+      }
+      return null
+    }
+  }
+}
diff --git a/build/update-emoji.js b/build/update-emoji.js
index 9f4b4e67a..5d578ba61 100644
--- a/build/update-emoji.js
+++ b/build/update-emoji.js
@@ -1,27 +1,23 @@
 
-module.exports = {
-  updateEmoji () {
-    const emojis = require('@kazvmoe-infra/unicode-emoji-json/data-by-group')
-    const fs = require('fs')
+import emojis from '@kazvmoe-infra/unicode-emoji-json/data-by-group.json' with { type: 'json' }
+import fs from 'fs'
 
-    Object.keys(emojis)
-      .map(k => {
-        emojis[k].map(e => {
-          delete e.unicode_version
-          delete e.emoji_version
-          delete e.skin_tone_support_unicode_version
-        })
-      })
+Object.keys(emojis)
+  .map(k => {
+    emojis[k].map(e => {
+      delete e.unicode_version
+      delete e.emoji_version
+      delete e.skin_tone_support_unicode_version
+    })
+  })
 
-    const res = {}
-    Object.keys(emojis)
-      .map(k => {
-        const groupId = k.replace('&', 'and').replace(/ /g, '-').toLowerCase()
-        res[groupId] = emojis[k]
-      })
+const res = {}
+Object.keys(emojis)
+  .map(k => {
+    const groupId = k.replace('&', 'and').replace(/ /g, '-').toLowerCase()
+    res[groupId] = emojis[k]
+  })
 
-    console.info('Updating emojis...')
-    fs.writeFileSync('static/emoji.json', JSON.stringify(res))
-    console.info('Done.')
-  }
-}
+console.info('Updating emojis...')
+fs.writeFileSync('src/assets/emoji.json', JSON.stringify(res))
+console.info('Done.')
diff --git a/build/utils.js b/build/utils.js
deleted file mode 100644
index c094c3c87..000000000
--- a/build/utils.js
+++ /dev/null
@@ -1,63 +0,0 @@
-var path = require('path')
-var config = require('../config')
-var sass = require('sass')
-var MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-exports.assetsPath = function (_path) {
-  var assetsSubDirectory = process.env.NODE_ENV === 'production'
-      ? config.build.assetsSubDirectory
-      : config.dev.assetsSubDirectory
-  return path.posix.join(assetsSubDirectory, _path)
-}
-
-exports.cssLoaders = function (options) {
-  options = options || {}
-
-  function generateLoaders (loaders) {
-    // Extract CSS when that option is specified
-    // (which is the case during production build)
-    if (options.extract) {
-      return [MiniCssExtractPlugin.loader].concat(loaders)
-    } else {
-      return ['vue-style-loader'].concat(loaders)
-    }
-  }
-
-  // http://vuejs.github.io/vue-loader/configurations/extract-css.html
-  return [
-    {
-      test: /\.(post)?css$/,
-      use: generateLoaders(['css-loader', 'postcss-loader']),
-    },
-    {
-      test: /\.less$/,
-      use: generateLoaders(['css-loader', 'postcss-loader', 'less-loader']),
-    },
-    {
-      test: /\.sass$/,
-      use: generateLoaders([
-        'css-loader',
-        'postcss-loader',
-        {
-          loader: 'sass-loader',
-          options: {
-            indentedSyntax: true
-          }
-        }
-      ])
-    },
-    {
-      test: /\.scss$/,
-      use: generateLoaders(['css-loader', 'postcss-loader', 'sass-loader'])
-    },
-    {
-      test: /\.styl(us)?$/,
-      use: generateLoaders(['css-loader', 'postcss-loader', 'stylus-loader']),
-    },
-  ]
-}
-
-// Generate loaders for standalone style files (outside of .vue)
-exports.styleLoaders = function (options) {
-  return exports.cssLoaders(options)
-}
diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js
deleted file mode 100644
index 7e69352a6..000000000
--- a/build/webpack.base.conf.js
+++ /dev/null
@@ -1,129 +0,0 @@
-var path = require('path')
-var config = require('../config')
-var utils = require('./utils')
-var projectRoot = path.resolve(__dirname, '../')
-var ServiceWorkerWebpackPlugin = require('serviceworker-webpack5-plugin')
-var CopyPlugin = require('copy-webpack-plugin');
-var { VueLoaderPlugin } = require('vue-loader')
-var ESLintPlugin = require('eslint-webpack-plugin');
-var StylelintPlugin = require('stylelint-webpack-plugin');
-
-var env = process.env.NODE_ENV
-// check env & config/index.js to decide weither to enable CSS Sourcemaps for the
-// various preprocessor loaders added to vue-loader at the end of this file
-var cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap)
-var cssSourceMapProd = (env === 'production' && config.build.productionSourceMap)
-var useCssSourceMap = cssSourceMapDev || cssSourceMapProd
-
-var now = Date.now()
-
-module.exports = {
-  entry: {
-    app: './src/main.js'
-  },
-  output: {
-    path: config.build.assetsRoot,
-    publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath,
-    filename: '[name].js',
-    chunkFilename: '[name].js'
-  },
-  optimization: {
-    splitChunks: {
-      chunks: 'all'
-    }
-  },
-  resolve: {
-    extensions: ['.mjs', '.js', '.jsx', '.vue'],
-    modules: [
-      path.join(__dirname, '../node_modules')
-    ],
-    alias: {
-      'static': path.resolve(__dirname, '../static'),
-      'src': path.resolve(__dirname, '../src'),
-      'assets': path.resolve(__dirname, '../src/assets'),
-      'components': path.resolve(__dirname, '../src/components'),
-      'vue-i18n': 'vue-i18n/dist/vue-i18n.runtime.esm-bundler.js'
-    },
-    fallback: {
-      'querystring': require.resolve('querystring-es3'),
-      'url': require.resolve('url/')
-    }
-  },
-  module: {
-    noParse: /node_modules\/localforage\/dist\/localforage.js/,
-    rules: [
-      {
-        enforce: 'post',
-        test: /\.(json5?|ya?ml)$/, // target json, json5, yaml and yml files
-        type: 'javascript/auto',
-        loader: '@intlify/vue-i18n-loader',
-        include: [ // Use `Rule.include` to specify the files of locale messages to be pre-compiled
-          path.resolve(__dirname, '../src/i18n')
-        ]
-      },
-      {
-        test: /\.vue$/,
-        loader: 'vue-loader',
-        options: {
-          compilerOptions: {
-            isCustomElement(tag) {
-              if (tag === 'pinch-zoom') {
-                return true
-              }
-              return false
-            }
-          }
-        }
-      },
-      {
-        test: /\.jsx?$/,
-        include: projectRoot,
-        exclude: /node_modules\/(?!tributejs)/,
-        use: 'babel-loader'
-      },
-      {
-        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
-        type: 'asset',
-        generator: {
-          filename: utils.assetsPath('img/[name].[hash:7][ext]')
-        }
-      },
-      {
-        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
-        type: 'asset',
-        generator: {
-          filename: utils.assetsPath('fonts/[name].[hash:7][ext]')
-        }
-      },
-      {
-        test: /\.mjs$/,
-        include: /node_modules/,
-        type: 'javascript/auto'
-      }
-    ]
-  },
-  plugins: [
-    new ServiceWorkerWebpackPlugin({
-      entry: path.join(__dirname, '..', 'src/sw.js'),
-      filename: 'sw-pleroma.js'
-    }),
-    new ESLintPlugin({
-      extensions: ['js', 'vue'],
-      formatter: require('eslint-formatter-friendly')
-    }),
-    new StylelintPlugin({}),
-    new VueLoaderPlugin(),
-    // This copies Ruffle's WASM to a directory so that JS side can access it
-    new CopyPlugin({
-      patterns: [
-        {
-          from: "node_modules/@ruffle-rs/ruffle/**/*",
-          to: "static/ruffle/[name][ext]"
-        },
-      ],
-      options: {
-        concurrency: 100,
-      },
-    })
-  ]
-}
diff --git a/build/webpack.dev.conf.js b/build/webpack.dev.conf.js
deleted file mode 100644
index 97799f828..000000000
--- a/build/webpack.dev.conf.js
+++ /dev/null
@@ -1,37 +0,0 @@
-var config = require('../config')
-var webpack = require('webpack')
-var merge = require('webpack-merge')
-var utils = require('./utils')
-var baseWebpackConfig = require('./webpack.base.conf')
-var HtmlWebpackPlugin = require('html-webpack-plugin')
-
-// add hot-reload related code to entry chunks
-Object.keys(baseWebpackConfig.entry).forEach(function (name) {
-  baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name])
-})
-
-module.exports = merge(baseWebpackConfig, {
-  module: {
-    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap })
-  },
-  mode: 'development',
-  // eval-source-map is faster for development
-  devtool: 'eval-source-map',
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env': config.dev.env,
-      'COMMIT_HASH': JSON.stringify('DEV'),
-      'DEV_OVERRIDES': JSON.stringify(config.dev.settings),
-      '__VUE_OPTIONS_API__': true,
-      '__VUE_PROD_DEVTOOLS__': false
-    }),
-    // https://github.com/glenjamin/webpack-hot-middleware#installation--usage
-    new webpack.HotModuleReplacementPlugin(),
-    // https://github.com/ampedandwired/html-webpack-plugin
-    new HtmlWebpackPlugin({
-      filename: 'index.html',
-      template: 'index.html',
-      inject: true
-    })
-  ]
-})
diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js
deleted file mode 100644
index 7a108f68d..000000000
--- a/build/webpack.prod.conf.js
+++ /dev/null
@@ -1,104 +0,0 @@
-var path = require('path')
-var config = require('../config')
-var utils = require('./utils')
-var webpack = require('webpack')
-var merge = require('webpack-merge')
-var baseWebpackConfig = require('./webpack.base.conf')
-var MiniCssExtractPlugin = require('mini-css-extract-plugin')
-const CssMinimizerPlugin = require("css-minimizer-webpack-plugin")
-var HtmlWebpackPlugin = require('html-webpack-plugin')
-var env = process.env.NODE_ENV === 'testing'
-    ? require('../config/test.env')
-    : config.build.env
-
-let commitHash = (() => {
-  const subst = "$Format:%h$";
-  if(!subst.match(/Format:/)) {
-    return subst;
-  } else {
-    return require('child_process')
-      .execSync('git rev-parse --short HEAD')
-      .toString();
-  }
-})();
-
-var webpackConfig = merge(baseWebpackConfig, {
-  mode: 'production',
-  module: {
-    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, extract: true })
-  },
-  devtool: config.build.productionSourceMap ? 'source-map' : false,
-  optimization: {
-    minimize: true,
-    splitChunks: {
-      chunks: 'all'
-    },
-    minimizer: [
-      `...`,
-      new CssMinimizerPlugin()
-    ]
-  },
-  output: {
-    path: config.build.assetsRoot,
-    filename: utils.assetsPath('js/[name].[chunkhash].js'),
-    chunkFilename: utils.assetsPath('js/[name].[chunkhash].js')
-  },
-  plugins: [
-    // http://vuejs.github.io/vue-loader/workflow/production.html
-    new webpack.DefinePlugin({
-      'process.env': env,
-      'COMMIT_HASH': JSON.stringify(commitHash),
-      'DEV_OVERRIDES': JSON.stringify(undefined),
-      '__VUE_OPTIONS_API__': true,
-      '__VUE_PROD_DEVTOOLS__': false
-    }),
-    // extract css into its own file
-    new MiniCssExtractPlugin({
-      filename: utils.assetsPath('css/[name].[contenthash].css')
-    }),
-    // generate dist index.html with correct asset hash for caching.
-    // you can customize output by editing /index.html
-    // see https://github.com/ampedandwired/html-webpack-plugin
-    new HtmlWebpackPlugin({
-      filename: process.env.NODE_ENV === 'testing'
-        ? 'index.html'
-        : config.build.index,
-      template: 'index.html',
-      inject: true,
-      minify: {
-        removeComments: true,
-        collapseWhitespace: true,
-        removeAttributeQuotes: true,
-        ignoreCustomComments: [/server-generated-meta/]
-        // more options:
-        // https://github.com/kangax/html-minifier#options-quick-reference
-      }
-    }),
-    // split vendor js into its own file
-    // extract webpack runtime and module manifest to its own file in order to
-    // prevent vendor hash from being updated whenever app bundle is updated
-    // new webpack.optimize.SplitChunksPlugin({
-    // name: ['app', 'vendor']
-    // }),
-  ]
-})
-
-if (config.build.productionGzip) {
-  var CompressionWebpackPlugin = require('compression-webpack-plugin')
-
-  webpackConfig.plugins.push(
-    new CompressionWebpackPlugin({
-      asset: '[path].gz[query]',
-      algorithm: 'gzip',
-      test: new RegExp(
-        '\\.(' +
-        config.build.productionGzipExtensions.join('|') +
-        ')$'
-      ),
-      threshold: 10240,
-      minRatio: 0.8
-    })
-  )
-}
-
-module.exports = webpackConfig
diff --git a/changelog.d/admin_tab.add b/changelog.d/admin_tab.add
new file mode 100644
index 000000000..421ce57cd
--- /dev/null
+++ b/changelog.d/admin_tab.add
@@ -0,0 +1 @@
+Most of the remaining AdminFE tabs into Admin Dashboard
diff --git a/changelog.d/better-shadow-control.fix b/changelog.d/better-shadow-control.fix
deleted file mode 100644
index 585ef6d26..000000000
--- a/changelog.d/better-shadow-control.fix
+++ /dev/null
@@ -1 +0,0 @@
-Updated shadow editor, hopefully fixed long-standing bugs, added ability to specify shadow's name.
diff --git a/changelog.d/bookmark-folders.add b/changelog.d/bookmark-folders.add
deleted file mode 100644
index f22966602..000000000
--- a/changelog.d/bookmark-folders.add
+++ /dev/null
@@ -1 +0,0 @@
-Support bookmark folders
diff --git a/changelog.d/broken.fix b/changelog.d/broken.fix
new file mode 100644
index 000000000..7e58091b4
--- /dev/null
+++ b/changelog.d/broken.fix
@@ -0,0 +1,2 @@
+Fix display of the broken/deleted/banned users
+
diff --git a/changelog.d/browsers-support.change b/changelog.d/browsers-support.change
deleted file mode 100644
index a62e50240..000000000
--- a/changelog.d/browsers-support.change
+++ /dev/null
@@ -1,9 +0,0 @@
-Updated our build system to support browsers:
-  Safari >= 15
-  Firefox >= 115
-  Android > 4
-  no Opera Mini support
-  no IE support
-  no "dead" (unmaintained) browsers support
-
-This does not guarantee that browsers will or will not work.
diff --git a/changelog.d/date-absolute.add b/changelog.d/date-absolute.add
deleted file mode 100644
index d9365f464..000000000
--- a/changelog.d/date-absolute.add
+++ /dev/null
@@ -1 +0,0 @@
-Support displaying time in absolute format
diff --git a/changelog.d/everything-instance-default.add b/changelog.d/everything-instance-default.add
new file mode 100644
index 000000000..6c4475905
--- /dev/null
+++ b/changelog.d/everything-instance-default.add
@@ -0,0 +1 @@
+Make every configuration option default-overridable by instance admins
diff --git a/changelog.d/piss-fix.skip b/changelog.d/finalfix-fr.skip
similarity index 100%
rename from changelog.d/piss-fix.skip
rename to changelog.d/finalfix-fr.skip
diff --git a/changelog.d/piss-serialization.skip b/changelog.d/finalfix.skip
similarity index 100%
rename from changelog.d/piss-serialization.skip
rename to changelog.d/finalfix.skip
diff --git a/changelog.d/multiple-status-mute-reasons.fix b/changelog.d/multiple-status-mute-reasons.fix
deleted file mode 100644
index 952ccea82..000000000
--- a/changelog.d/multiple-status-mute-reasons.fix
+++ /dev/null
@@ -1 +0,0 @@
-Fix whitespaces for multiple status mute reasons, display bot status reason
diff --git a/changelog.d/non-anonymous-polls.add b/changelog.d/non-anonymous-polls.add
deleted file mode 100644
index 9ff7f3adc..000000000
--- a/changelog.d/non-anonymous-polls.add
+++ /dev/null
@@ -1 +0,0 @@
-Inform users that Smithereen public polls are public
\ No newline at end of file
diff --git a/changelog.d/oauth-app-name.change b/changelog.d/oauth-app-name.change
deleted file mode 100644
index 15d6f87ee..000000000
--- a/changelog.d/oauth-app-name.change
+++ /dev/null
@@ -1 +0,0 @@
-Simplify the OAuth client_name to 'PleromaFE'
diff --git a/changelog.d/settings-shuffle.change b/changelog.d/settings-shuffle.change
new file mode 100644
index 000000000..f1d9ecf89
--- /dev/null
+++ b/changelog.d/settings-shuffle.change
@@ -0,0 +1,3 @@
+rearranged and split settings to make more sense and be less of a wall of text
+on mobile settings now take up full width and presented in navigation style
+improved styles for settings
diff --git a/changelog.d/splashscreen.add b/changelog.d/splashscreen.add
deleted file mode 100644
index f1f56551a..000000000
--- a/changelog.d/splashscreen.add
+++ /dev/null
@@ -1 +0,0 @@
-Splash screen + loading indicator to make process of identifying initialization issues and load performance
diff --git a/config/dev.env.js b/config/dev.env.js
deleted file mode 100644
index efead7c84..000000000
--- a/config/dev.env.js
+++ /dev/null
@@ -1,6 +0,0 @@
-var merge = require('webpack-merge')
-var prodEnv = require('./prod.env')
-
-module.exports = merge(prodEnv, {
-  NODE_ENV: '"development"'
-})
diff --git a/config/index.js b/config/index.js
deleted file mode 100644
index 023d4c9bc..000000000
--- a/config/index.js
+++ /dev/null
@@ -1,73 +0,0 @@
-// see http://vuejs-templates.github.io/webpack for documentation.
-const path = require('path')
-let settings = {}
-try {
-  settings = require('./local.json')
-  if (settings.target && settings.target.endsWith('/')) {
-    // replacing trailing slash since it can conflict with some apis
-    // and that's how actual BE reports its url
-    settings.target = settings.target.replace(/\/$/, '')
-  }
-  console.log('Using local dev server settings (/config/local.json):')
-  console.log(JSON.stringify(settings, null, 2))
-} catch (e) {
-  console.log('Local dev server settings not found (/config/local.json)')
-}
-
-const target = settings.target || 'http://localhost:4000/'
-
-module.exports = {
-  build: {
-    env: require('./prod.env'),
-    index: path.resolve(__dirname, '../dist/index.html'),
-    assetsRoot: path.resolve(__dirname, '../dist'),
-    assetsSubDirectory: 'static',
-    assetsPublicPath: '/',
-    productionSourceMap: true,
-    // Gzip off by default as many popular static hosts such as
-    // Surge or Netlify already gzip all static assets for you.
-    // Before setting to `true`, make sure to:
-    // npm install --save-dev compression-webpack-plugin
-    productionGzip: false,
-    productionGzipExtensions: ['js', 'css']
-  },
-  dev: {
-    env: require('./dev.env'),
-    port: 8080,
-    settings,
-    assetsSubDirectory: 'static',
-    assetsPublicPath: '/',
-    proxyTable: {
-      '/api': {
-        target,
-        changeOrigin: true,
-        cookieDomainRewrite: 'localhost'
-      },
-      '/nodeinfo': {
-        target,
-        changeOrigin: true,
-        cookieDomainRewrite: 'localhost'
-      },
-      '/socket': {
-        target,
-        changeOrigin: true,
-        cookieDomainRewrite: 'localhost',
-        ws: true,
-        headers: {
-          'Origin': target
-        }
-      },
-      '/oauth/revoke': {
-        target,
-        changeOrigin: true,
-        cookieDomainRewrite: 'localhost'
-      }
-    },
-    // CSS Sourcemaps off by default because relative paths are "buggy"
-    // with this option, according to the CSS-Loader README
-    // (https://github.com/webpack/css-loader#sourcemaps)
-    // In our experience, they generally work as expected,
-    // just be aware of this issue when enabling this option.
-    cssSourceMap: false
-  }
-}
diff --git a/config/prod.env.js b/config/prod.env.js
deleted file mode 100644
index 773d263d3..000000000
--- a/config/prod.env.js
+++ /dev/null
@@ -1,3 +0,0 @@
-module.exports = {
-  NODE_ENV: '"production"'
-}
diff --git a/config/test.env.js b/config/test.env.js
deleted file mode 100644
index 89f90deb2..000000000
--- a/config/test.env.js
+++ /dev/null
@@ -1,6 +0,0 @@
-var merge = require('webpack-merge')
-var devEnv = require('./dev.env')
-
-module.exports = merge(devEnv, {
-  NODE_ENV: '"testing"'
-})
diff --git a/eslint.config.mjs b/eslint.config.mjs
new file mode 100644
index 000000000..01bdb2038
--- /dev/null
+++ b/eslint.config.mjs
@@ -0,0 +1,37 @@
+import vue from "eslint-plugin-vue";
+import js from "@eslint/js";
+import globals from "globals";
+
+
+export default [
+  ...vue.configs['flat/recommended'],
+  js.configs.recommended,
+  {
+    files: ["**/*.js", "**/*.mjs", "**/*.vue"],
+    ignores: ["build/*.js", "config/*.js"],
+
+    languageOptions: {
+      ecmaVersion: 2024,
+      sourceType: "module",
+
+      parserOptions: {
+        parser: "@babel/eslint-parser",
+      },
+      globals: {
+        ...globals.browser,
+        ...globals.vitest,
+        ...globals.chai,
+        ...globals.commonjs,
+        ...globals.serviceworker
+      }
+    },
+
+    rules: {
+      'arrow-parens': 0,
+      'generator-star-spacing': 0,
+      'no-debugger': 0,
+      'vue/require-prop-types': 0,
+      'vue/multi-word-component-names': 0,
+    }
+  }
+]
diff --git a/index.html b/index.html
index 461f5acc1..26eeee19b 100644
--- a/index.html
+++ b/index.html
@@ -3,115 +3,20 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
-    <link rel="icon" type="image/png" href="/favicon.png">
+    <link rel="preload" href="/static/config.json" as="fetch" crossorigin />
+    <link rel="preload" href="/api/pleroma/frontend_configurations" as="fetch" crossorigin />
+    <link rel="preload" href="/nodeinfo/2.0.json" as="fetch" crossorigin />
+    <link rel="preload" href="/nodeinfo/2.1.json" as="fetch" crossorigin />
+    <link rel="preload" href="/api/v1/instance" as="fetch" crossorigin />
+    <link rel="preload" href="/static/pleromatan_apology_fox_small.webp" as="image" />
     <!-- putting styles here to avoid having to wait for styles to load up -->
-    <style id="splashscreen">
-     #splash {
-       --scale: 1;
-       width: 100vw;
-       height: 100vh;
-       display: grid;
-       grid-template-rows: auto;
-       grid-template-columns: auto;
-       align-content: center;
-       align-items: center;
-       justify-content: center;
-       justify-items: center;
-       flex-direction: column;
-       background: #0f161e;
-       font-family: sans-serif;
-       color: #b9b9ba;
-       position: absolute;
-       z-index: 9999;
-       font-size: calc(1vw + 1vh + 1vmin);
-     }
-
-     #splash-credit {
-       position: absolute;
-       font-size: 14px;
-       bottom: 16px;
-       right: 16px;
-     }
-
-     #splash-container {
-       align-items: center;
-     }
-
-     #mascot-container {
-       display: flex;
-       align-items: flex-end;
-       justify-content: center;
-       perspective: 60em;
-       perspective-origin: 0 -15em;
-       transform-style: preserve-3d;
-     }
-
-     #mascot {
-       width: calc(10em * var(--scale));
-       height: calc(10em * var(--scale));
-       object-fit: contain;
-       object-position: bottom;
-       transform: translateZ(-2em);
-     }
-
-     #throbber {
-       display: grid;
-       width: calc(5em * 0.5 * var(--scale));
-       height: calc(8em * 0.5 * var(--scale));
-       margin-left: 4.1em;
-       z-index: 2;
-       grid-template-rows: repeat(8, 1fr);
-       grid-template-columns: repeat(5, 1fr);
-       grid-template-areas: "P P . L L"
-                            "P P . L L"
-                            "P P . L L"
-                            "P P . L L"
-                            "P P . . ."
-                            "P P . . ."
-                            "P P . E E"
-                            "P P . E E";
-     }
-
-     .chunk {
-       background-color: #e2b188;
-       box-shadow: 0.01em 0.01em 0.1em 0 #e2b188;
-     }
-
-     #chunk-P {
-       grid-area: P;
-       border-top-left-radius:  calc(var(--logoChunkSize) / 2);
-     }
-
-     #chunk-L {
-       grid-area: L;
-       border-bottom-right-radius: calc(var(--logoChunkSize) / 2);
-     }
-
-     #chunk-E {
-       grid-area: E;
-       border-bottom-right-radius: calc(var(--logoChunkSize) / 2);
-     }
-
-     #status {
-       margin-top: 1em;
-       line-height: 2;
-       width: 100%;
-       text-align: center;
-     }
-
-     @media (prefers-reduced-motion) {
-       #throbber {
-         animation: none !important;
-       }
-     }
-    </style>
-    <style id="pleroma-eager-styles" type="text/css"></style>
-    <style id="pleroma-lazy-styles" type="text/css"></style>
+    <link rel="stylesheet" id="splashscreen" href="/static/splash.css" />
+    <link rel="stylesheet" id="custom-styles-holder" type="text/css" href="/static/empty.css" />
     <!--server-generated-meta-->
   </head>
-  <body style="margin: 0; padding: 0">
+  <body>
     <noscript>To use Pleroma, please enable JavaScript.</noscript>
-    <div id="splash">
+    <div id="splash" class="initial-hidden">
       <!-- we are hiding entire graphic so no point showing credit -->
       <div aria-hidden="true" id="splash-credit">
         Art by pipivovott
@@ -126,18 +31,21 @@
             <div class="chunk" id="chunk-E">
             </div>
           </div>
-          <img id="mascot" src="/static/pleromatan_apology.png">
+          <img id="mascot" src="/static/pleromatan_apology_small.webp">
         </div>
         <div id="status" class="css-ok">
           <!-- (｡>﹏<) -->
           <!-- it's a pseudographic, don't want screenreader read out nonsense -->
           <span aria-hidden="true" class="initial-text">(｡&gt;﹏&lt;)</span>
         </div>
+        <code id="statusError"></code>
+        <pre id="statusStack"></pre>
       </div>
     </div>
     <div id="app" class="hidden"></div>
     <div id="modal"></div>
     <!-- built files will be auto injected -->
-    <div id="popovers" />
+    <div id="popovers"></div>
+    <script type="module" src="/src/main.js"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
index 403a2b231..21d75f0fb 100644
--- a/package.json
+++ b/package.json
@@ -1,137 +1,122 @@
 {
   "name": "pleroma_fe",
-  "version": "2.7.1",
+  "version": "2.9.3",
   "description": "Pleroma frontend, the default frontend of Pleroma social network server",
   "author": "Pleroma contributors <https://git.pleroma.social/pleroma/pleroma-fe/-/blob/develop/CONTRIBUTORS.md>",
   "private": false,
   "scripts": {
-    "dev": "node build/dev-server.js",
-    "build": "node build/build.js",
-    "unit": "karma start test/unit/karma.conf.js --single-run",
-    "unit:watch": "karma start test/unit/karma.conf.js --single-run=false",
+    "dev": "node build/update-emoji.js && vite dev",
+    "build": "node build/update-emoji.js && vite build",
+    "unit": "node build/update-emoji.js && vitest --run",
+    "unit-ci": "node build/update-emoji.js && vitest --run --browser.headless",
+    "unit:watch": "node build/update-emoji.js && vitest",
     "e2e": "node test/e2e/runner.js",
-    "test": "npm run unit && npm run e2e",
-    "stylelint": "npx stylelint '**/*.scss' '**/*.vue'",
-    "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs",
-    "lint-fix": "eslint --fix --ext .js,.vue src test/unit/specs test/e2e/specs"
+    "test": "yarn run unit && yarn run e2e",
+    "stylelint": "yarn exec stylelint '**/*.scss' '**/*.vue'",
+    "lint": "eslint src test/unit/specs test/e2e/specs",
+    "lint-fix": "eslint --fix src test/unit/specs test/e2e/specs"
   },
   "dependencies": {
-    "@babel/runtime": "7.21.5",
+    "@babel/runtime": "7.28.4",
     "@chenfengyuan/vue-qrcode": "2.0.0",
-    "@fortawesome/fontawesome-svg-core": "6.4.0",
-    "@fortawesome/free-regular-svg-icons": "6.4.0",
-    "@fortawesome/free-solid-svg-icons": "6.4.0",
-    "@fortawesome/vue-fontawesome": "3.0.3",
-    "@kazvmoe-infra/pinch-zoom-element": "1.2.0",
+    "@fortawesome/fontawesome-svg-core": "7.1.0",
+    "@fortawesome/free-regular-svg-icons": "7.1.0",
+    "@fortawesome/free-solid-svg-icons": "7.1.0",
+    "@fortawesome/vue-fontawesome": "3.1.2",
+    "@kazvmoe-infra/pinch-zoom-element": "1.3.0",
     "@kazvmoe-infra/unicode-emoji-json": "0.4.0",
-    "@ruffle-rs/ruffle": "0.1.0-nightly.2024.8.21",
+    "@ruffle-rs/ruffle": "0.1.0-nightly.2025.6.22",
     "@vuelidate/core": "2.0.3",
     "@vuelidate/validators": "2.0.4",
+    "@web3-storage/parse-link-header": "^3.1.0",
     "body-scroll-lock": "3.1.5",
     "chromatism": "3.0.0",
     "click-outside-vue3": "4.0.1",
-    "cropperjs": "1.5.13",
+    "cropperjs": "2.0.1",
     "escape-html": "1.0.3",
+    "globals": "^16.0.0",
     "hash-sum": "^2.0.0",
     "js-cookie": "3.0.5",
     "localforage": "1.10.0",
     "parse-link-header": "2.0.0",
-    "phoenix": "1.7.7",
-    "punycode.js": "2.3.0",
-    "qrcode": "1.5.3",
+    "phoenix": "1.8.1",
+    "pinia": "^3.0.0",
+    "punycode.js": "2.3.1",
+    "qrcode": "1.5.4",
     "querystring-es3": "0.2.1",
-    "url": "0.11.0",
+    "url": "0.11.4",
     "utf8": "3.0.0",
-    "vue": "3.2.45",
-    "vue-i18n": "9.2.2",
-    "vue-router": "4.1.6",
-    "vue-template-compiler": "2.7.14",
+    "uuid": "11.1.0",
+    "vue": "3.5.22",
+    "vue-i18n": "11",
+    "vue-router": "4.5.1",
     "vue-virtual-scroller": "^2.0.0-beta.7",
     "vuex": "4.1.0"
   },
   "devDependencies": {
-    "@babel/core": "7.21.8",
-    "@babel/eslint-parser": "7.21.8",
-    "@babel/plugin-transform-runtime": "7.21.4",
-    "@babel/preset-env": "7.21.5",
-    "@babel/register": "7.21.0",
-    "@intlify/vue-i18n-loader": "5.0.1",
+    "@babel/core": "7.28.4",
+    "@babel/eslint-parser": "7.28.4",
+    "@babel/plugin-transform-runtime": "7.28.3",
+    "@babel/preset-env": "7.28.3",
+    "@babel/register": "7.28.3",
     "@ungap/event-target": "0.2.4",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "@vitejs/plugin-vue-jsx": "^4.1.1",
+    "@vitest/browser": "^3.0.7",
+    "@vitest/ui": "^3.0.7",
     "@vue/babel-helper-vue-jsx-merge-props": "1.4.0",
-    "@vue/babel-plugin-jsx": "1.2.2",
-    "@vue/compiler-sfc": "3.2.45",
-    "@vue/test-utils": "2.2.8",
-    "autoprefixer": "10.4.19",
-    "babel-loader": "9.1.3",
+    "@vue/babel-plugin-jsx": "1.5.0",
+    "@vue/compiler-sfc": "3.5.22",
+    "@vue/test-utils": "2.4.6",
+    "autoprefixer": "10.4.21",
     "babel-plugin-lodash": "3.3.4",
-    "chai": "4.3.7",
-    "chalk": "1.1.3",
-    "chromedriver": "108.0.0",
+    "chai": "5.3.3",
+    "chalk": "5.6.2",
+    "chromedriver": "135.0.4",
     "connect-history-api-fallback": "2.0.0",
-    "copy-webpack-plugin": "11.0.0",
-    "cross-spawn": "7.0.3",
-    "css-loader": "6.10.0",
-    "css-minimizer-webpack-plugin": "4.2.2",
+    "cross-spawn": "7.0.6",
     "custom-event-polyfill": "1.0.7",
-    "eslint": "8.33.0",
-    "eslint-config-standard": "17.0.0",
+    "eslint": "9.37.0",
+    "vue-eslint-parser": "10.2.0",
+    "eslint-config-standard": "17.1.0",
     "eslint-formatter-friendly": "7.0.0",
-    "eslint-plugin-import": "2.27.5",
-    "eslint-plugin-n": "15.6.1",
-    "eslint-plugin-promise": "6.1.1",
-    "eslint-plugin-vue": "9.9.0",
-    "eslint-webpack-plugin": "3.2.0",
+    "eslint-plugin-import": "2.32.0",
+    "eslint-plugin-n": "17.23.1",
+    "eslint-plugin-promise": "7.2.1",
+    "eslint-plugin-vue": "10.5.0",
     "eventsource-polyfill": "0.9.6",
-    "express": "4.18.2",
-    "function-bind": "1.1.1",
-    "html-webpack-plugin": "5.5.1",
-    "http-proxy-middleware": "2.0.6",
-    "iso-639-1": "2.1.15",
-    "json-loader": "0.5.7",
-    "karma": "6.4.4",
-    "karma-coverage": "2.2.0",
-    "karma-firefox-launcher": "2.1.3",
-    "karma-mocha": "2.0.1",
-    "karma-mocha-reporter": "2.2.5",
-    "karma-sinon-chai": "2.0.2",
-    "karma-sourcemap-loader": "0.3.8",
-    "karma-spec-reporter": "0.0.36",
-    "karma-webpack": "5.0.0",
+    "express": "5.1.0",
+    "function-bind": "1.1.2",
+    "http-proxy-middleware": "3.0.5",
+    "iso-639-1": "3.1.5",
     "lodash": "4.17.21",
-    "mini-css-extract-plugin": "2.7.6",
-    "mocha": "10.2.0",
-    "nightwatch": "2.6.25",
-    "opn": "5.5.0",
-    "ora": "0.4.1",
-    "postcss": "8.4.23",
+    "msw": "2.10.5",
+    "nightwatch": "3.12.2",
+    "playwright": "1.55.0",
+    "postcss": "8.5.6",
     "postcss-html": "^1.5.0",
-    "postcss-loader": "7.0.2",
     "postcss-scss": "^4.0.6",
-    "sass": "1.60.0",
-    "sass-loader": "13.2.2",
-    "selenium-server": "2.53.1",
-    "semver": "7.3.8",
-    "serviceworker-webpack5-plugin": "2.0.0",
-    "shelljs": "0.8.5",
-    "sinon": "15.0.4",
-    "sinon-chai": "3.7.0",
-    "stylelint": "14.16.1",
+    "sass": "1.93.2",
+    "selenium-server": "3.141.59",
+    "semver": "7.7.3",
+    "serve-static": "2.2.0",
+    "shelljs": "0.10.0",
+    "sinon": "20.0.0",
+    "sinon-chai": "4.0.1",
+    "stylelint": "16.25.0",
     "stylelint-config-html": "^1.1.0",
-    "stylelint-config-recommended-scss": "^8.0.0",
-    "stylelint-config-recommended-vue": "^1.4.0",
-    "stylelint-config-standard": "29.0.0",
-    "stylelint-rscss": "0.4.0",
-    "stylelint-webpack-plugin": "^3.3.0",
-    "vue-loader": "17.0.1",
-    "vue-style-loader": "4.1.3",
-    "webpack": "5.75.0",
-    "webpack-dev-middleware": "3.7.3",
-    "webpack-hot-middleware": "2.25.3",
-    "webpack-merge": "0.20.0"
+    "stylelint-config-recommended": "^16.0.0",
+    "stylelint-config-recommended-scss": "^14.0.0",
+    "stylelint-config-recommended-vue": "^1.6.0",
+    "stylelint-config-standard": "38.0.0",
+    "vite": "^6.1.0",
+    "vite-plugin-eslint2": "^5.0.3",
+    "vite-plugin-stylelint": "^6.0.0",
+    "vitest": "^3.0.7"
   },
+  "type": "module",
   "engines": {
-    "node": ">= 16.0.0",
-    "npm": ">= 3.0.0"
+    "node": ">= 16.0.0"
   },
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }
diff --git a/postcss.config.js b/postcss.config.js
index 88752c6cb..95ebbf2a6 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,5 +1,7 @@
-module.exports = {
+import autoprefixer from 'autoprefixer'
+
+export default {
   plugins: [
-    require('autoprefixer')
+    autoprefixer
   ]
 }
diff --git a/public/static/.gitignore b/public/static/.gitignore
new file mode 100644
index 000000000..3332292a1
--- /dev/null
+++ b/public/static/.gitignore
@@ -0,0 +1 @@
+*.custom.*
diff --git a/static/.gitkeep b/public/static/.gitkeep
similarity index 100%
rename from static/.gitkeep
rename to public/static/.gitkeep
diff --git a/static/aurora_borealis.jpg b/public/static/aurora_borealis.jpg
similarity index 100%
rename from static/aurora_borealis.jpg
rename to public/static/aurora_borealis.jpg
diff --git a/static/config.json b/public/static/config.json
similarity index 92%
rename from static/config.json
rename to public/static/config.json
index fb39ff77f..6df21bb9e 100644
--- a/static/config.json
+++ b/public/static/config.json
@@ -24,6 +24,8 @@
   "showInstanceSpecificPanel": false,
   "sidebarRight": false,
   "subjectLineBehavior": "email",
-  "theme": "pleroma-dark",
+  "theme": null,
+  "style": "BreezyDX",
+  "palette": "sigsegv2",
   "webPushNotifications": false
 }
diff --git a/static/logo.svg b/public/static/logo.svg
similarity index 100%
rename from static/logo.svg
rename to public/static/logo.svg
diff --git a/public/static/palettes/index.json b/public/static/palettes/index.json
new file mode 100644
index 000000000..2cd110d1e
--- /dev/null
+++ b/public/static/palettes/index.json
@@ -0,0 +1,75 @@
+{
+  "pleroma-dark": [ "Pleroma Dark", "#121a24", "#182230", "#b9b9ba", "#d8a070", "#d31014", "#0fa00f", "#0095ff", "#ffa500" ],
+  "pleroma-light": [ "Pleroma Light", "#f2f4f6", "#dbe0e8", "#304055", "#f86f0f", "#d31014", "#0fa00f", "#0095ff", "#ffa500" ],
+  "classic-dark": {
+    "name": "Classic Dark",
+    "bg": "#161c20",
+    "fg": "#282e32",
+    "text": "#b9b9b9",
+    "link": "#baaa9c",
+    "cRed": "#d31014",
+    "cGreen": "#0fa00f",
+    "cBlue": "#0095ff",
+    "cOrange": "#ffa500"
+  },
+  "bird": [ "Bird", "#f8fafd", "#e6ecf0", "#14171a", "#0084b8", "#e0245e", "#17bf63", "#1b95e0", "#fab81e"],
+  "pleroma-amoled": [ "Pleroma Dark AMOLED", "#000000", "#111111", "#b0b0b1", "#d8a070", "#aa0000", "#0fa00f", "#0095ff", "#d59500"],
+  "tomorrow-night": {
+    "name": "Tomorrow Night",
+    "bg": "#1d1f21",
+    "fg": "#373b41",
+    "link": "#81a2be",
+    "text": "#c5c8c6",
+    "cRed": "#cc6666",
+    "cBlue": "#8abeb7",
+    "cGreen": "#b5bd68",
+    "cOrange": "#de935f"
+  },
+  "dracula": {
+    "name": "Dracula",
+    "bg": "#282A36",
+    "fg": "#44475A",
+    "link": "#BC92F9",
+    "text": "#f8f8f2",
+    "cRed": "#FF5555",
+    "cBlue": "#8BE9FD",
+    "cGreen": "#50FA7B",
+    "cOrange": "#FFB86C"
+  },
+  "ir-black": [ "Ir Black", "#000000", "#242422", "#b5b3aa", "#ff6c60", "#FF6C60", "#A8FF60", "#96CBFE", "#FFFFB6" ],
+  "monokai": [ "Monokai", "#272822", "#383830", "#f8f8f2", "#f92672", "#F92672", "#a6e22e", "#66d9ef", "#f4bf75" ],
+  "purple-stream": {
+    "name": "Purple stream",
+    "bg": "#17171A",
+    "fg": "#450F92",
+    "link": "#8769B4",
+    "text": "#C0C0C5",
+    "cRed": "#EB0300",
+    "cBlue": "#4656FF",
+    "cGreen": "#B0E020",
+    "cOrange": "#FF9046"
+  },
+  "feud": {
+    "name": "Feud",
+    "bg": "#323337",
+    "fg": "#1D1E21",
+    "link": "#18A0E3",
+    "accent": "#6671E2",
+    "text": "#DBDDE0",
+    "cRed": "#E05053",
+    "cBlue": "#6671E2",
+    "cGreen": "#3A8D5D",
+    "cOrange": "#DCAA45"
+  },
+  "constabulary": {
+    "name": "Constabulary",
+    "bg": "#FFFFFF",
+    "fg": "#3B5897",
+    "link": "#28487C",
+    "text": "#333333",
+    "cRed": "#FA3C4C",
+    "cBlue": "#0083FF",
+    "cGreen": "#44BDC6",
+    "cOrange": "#FFC200"
+  }
+}
diff --git a/static/pleromatan_apology.png b/public/static/pleromatan_apology.png
similarity index 100%
rename from static/pleromatan_apology.png
rename to public/static/pleromatan_apology.png
diff --git a/static/pleromatan_apology_fox.png b/public/static/pleromatan_apology_fox.png
similarity index 100%
rename from static/pleromatan_apology_fox.png
rename to public/static/pleromatan_apology_fox.png
diff --git a/public/static/pleromatan_apology_fox_small.webp b/public/static/pleromatan_apology_fox_small.webp
new file mode 100644
index 000000000..eacbf3cbf
Binary files /dev/null and b/public/static/pleromatan_apology_fox_small.webp differ
diff --git a/public/static/pleromatan_apology_small.webp b/public/static/pleromatan_apology_small.webp
new file mode 100644
index 000000000..e27e06d06
Binary files /dev/null and b/public/static/pleromatan_apology_small.webp differ
diff --git a/static/pleromatan_orz.png b/public/static/pleromatan_orz.png
similarity index 100%
rename from static/pleromatan_orz.png
rename to public/static/pleromatan_orz.png
diff --git a/static/pleromatan_orz_fox.png b/public/static/pleromatan_orz_fox.png
similarity index 100%
rename from static/pleromatan_orz_fox.png
rename to public/static/pleromatan_orz_fox.png
diff --git a/public/static/splash.css b/public/static/splash.css
new file mode 100644
index 000000000..f56f33d07
--- /dev/null
+++ b/public/static/splash.css
@@ -0,0 +1,132 @@
+body {
+  margin: 0;
+  padding: 0;
+}
+
+#splash {
+  --scale: 1;
+
+  width: 100vw;
+  height: 100vh;
+  display: grid;
+  grid-template-rows: auto;
+  grid-template-columns: auto;
+  align-content: center;
+  place-items: center;
+  flex-direction: column;
+  background: #0f161e;
+  font-family: sans-serif;
+  color: #b9b9ba;
+  position: absolute;
+  z-index: 9999;
+  font-size: calc(1vw + 1vh + 1vmin);
+  opacity: 1;
+  transition: opacity 500ms ease-out 2s;
+}
+
+#splash.hidden,
+#splash.initial-hidden {
+  opacity: 0;
+}
+
+#splash-credit {
+  position: absolute;
+  font-size: 1em;
+  bottom: 1em;
+  right: 1em;
+}
+
+#splash-container {
+  align-items: center;
+}
+
+#mascot-container {
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+  perspective: 60em;
+  perspective-origin: 0 -15em;
+  transform-style: preserve-3d;
+}
+
+#mascot {
+  width: calc(10em * var(--scale));
+  height: calc(10em * var(--scale));
+  object-fit: contain;
+  object-position: bottom;
+  transform: translateZ(-2em);
+}
+
+#throbber {
+  display: grid;
+  width: calc(5em * 0.5 * var(--scale));
+  height: calc(8em * 0.5 * var(--scale));
+  margin-left: 4.1em;
+  z-index: 2;
+  grid-template-rows: repeat(8, 1fr);
+  grid-template-columns: repeat(5, 1fr);
+  grid-template-areas: "P P . L L"
+                       "P P . L L"
+                       "P P . L L"
+                       "P P . L L"
+                       "P P . . ."
+                       "P P . . ."
+                       "P P . E E"
+                       "P P . E E";
+
+  --logoChunkSize: calc(2em * 0.5 * var(--scale))
+}
+
+.chunk {
+  background-color: #e2b188;
+  box-shadow: 0.01em 0.01em 0.1em 0 #e2b188;
+}
+
+#chunk-P {
+  grid-area: P;
+  border-top-left-radius:  calc(var(--logoChunkSize) / 2);
+}
+
+#chunk-L {
+  grid-area: L;
+  border-bottom-right-radius: calc(var(--logoChunkSize) / 2);
+}
+
+#chunk-E {
+  grid-area: E;
+  border-bottom-right-radius: calc(var(--logoChunkSize) / 2);
+}
+
+#status {
+  margin-top: 1em;
+  line-height: 2;
+  width: 100%;
+  text-align: center;
+}
+
+#statusError {
+  display: none;
+  margin-top: 1em;
+  font-size: calc(1vw + 1vh + 1vmin);
+  line-height: 2;
+  width: 100%;
+  text-align: center;
+}
+
+#statusStack {
+  display: none;
+  margin-top: 1em;
+  font-size: calc((1vw + 1vh + 1vmin) / 2.5);
+  width: calc(100vw - 5em);
+  padding: 1em;
+  text-overflow: ellipsis;
+  overflow-x: hidden;
+  text-align: left;
+  line-height: 2;
+}
+
+@media (prefers-reduced-motion) {
+  #throbber {
+    animation: none !important;
+  }
+}
diff --git a/public/static/styles.json b/public/static/styles.json
new file mode 100644
index 000000000..2f836a47a
--- /dev/null
+++ b/public/static/styles.json
@@ -0,0 +1,11 @@
+{
+  "pleroma-dark": "/static/themes/pleroma-dark.json",
+  "pleroma-light": "/static/themes/pleroma-light.json",
+  "redmond-xx": "/static/themes/redmond-xx.json",
+  "redmond-xx-se": "/static/themes/redmond-xx-se.json",
+  "redmond-xxi": "/static/themes/redmond-xxi.json",
+  "breezy-dark": "/static/themes/breezy-dark.json",
+  "breezy-light": "/static/themes/breezy-light.json",
+  "mammal": "/static/themes/mammal.json",
+  "paper": "/static/themes/paper.json"
+}
diff --git a/public/static/styles/Breezy DX.iss b/public/static/styles/Breezy DX.iss
new file mode 100644
index 000000000..69cc3befe
--- /dev/null
+++ b/public/static/styles/Breezy DX.iss	
@@ -0,0 +1,102 @@
+@meta {
+  name: Breezy DX;
+  author: HJ;
+  license: WTFPL;
+  website: ebin.club;
+}
+
+@palette.Dark {
+  bg: #292C32;
+  fg: #292C32;
+  text: #ffffff;
+  link: #1CA4F3;
+  accent: #1CA4F3;
+  cRed: #f41a51;
+  cBlue: #1CA4F3;
+  cGreen: #1af46e;
+  cOrange: #f4af1a;
+}
+
+@palette.Light {
+  bg: #EFF0F2;
+  fg: #EFF0F2;
+  text: #1B1F22;
+  underlay: #5d6086;
+  accent: #1CA4F3;
+  cBlue: #1CA4F3;
+  cRed: #f41a51;
+  cGreen: #0b6a30;
+  cOrange: #f4af1a;
+  border: #d8e6f9;
+  link: #1CA4F3;
+}
+
+@palette.Panda {
+  bg: #EFF0F2;
+  fg: #292C32;
+  text: #1B1F22;
+  link: #1CA4F3;
+  accent: #1CA4F3;
+  cRed: #f41a51;
+  cBlue: #1CA4F3;
+  cGreen: #0b6a30;
+  cOrange: #f4af1a;
+}
+
+Root {
+  --badgeNotification: color | --cRed;
+  --buttonDefaultHoverGlow: shadow | inset 0 0 0 1 --accent / 1;
+  --buttonDefaultFocusGlow: shadow | inset 0 0 0 1 --accent / 1;
+  --buttonDefaultShadow: shadow | inset 0 0 0 1 --text / 0.35, 0 5 5 -5 #000000 / 0.35;
+  --buttonDefaultBevel: shadow | inset 0 14 14 -14 #FFFFFF / 0.1;
+  --buttonPressedBevel: shadow | inset 0 -20 20 -20 #000000 / 0.05;
+  --defaultInputBevel: shadow | inset 0 0 0 1 --text / 0.35;
+  --defaultInputHoverGlow: shadow | 0 0 0 1 --accent / 1;
+  --defaultInputFocusGlow: shadow | 0 0 0 1 --link / 1;
+}
+
+Button {
+  background: --parent;
+}
+
+Button:disabled {
+  shadow: --buttonDefaultBevel, --buttonDefaultShadow
+}
+
+Button:hover {
+  background: --inheritedBackground;
+  shadow: --buttonDefaultHoverGlow, --buttonDefaultBevel, --buttonDefaultShadow
+}
+
+Button:toggled {
+  background: $blend(--inheritedBackground 0.3 --accent)
+}
+
+Button:pressed {
+  background: $blend(--inheritedBackground 0.8 --accent)
+}
+
+Button:pressed:toggled {
+  background: $blend(--inheritedBackground 0.2 --accent)
+}
+
+Button:toggled:hover {
+  background: $blend(--inheritedBackground 0.3 --accent)
+}
+
+Input {
+  shadow: --defaultInputBevel;
+  background: $mod(--bg -10);
+}
+
+PanelHeader {
+  shadow: inset 0 30 30 -30 #ffffff / 0.25
+}
+
+Tab:hover {
+  shadow: --buttonDefaultHoverGlow, --buttonDefaultBevel, --buttonDefaultShadow
+}
+
+Tab {
+  background: --bg;
+}
diff --git a/public/static/styles/Redmond DX.iss b/public/static/styles/Redmond DX.iss
new file mode 100644
index 000000000..919be056b
--- /dev/null
+++ b/public/static/styles/Redmond DX.iss	
@@ -0,0 +1,201 @@
+@meta {
+  name: Redmond DX;
+  author: HJ;
+  license: WTFPL;
+  website: ebin.club;
+}
+
+@palette.Modern {
+  bg: #D3CFC7;
+  fg: #092369;
+  text: #000000;
+  link: #0000FF;
+  accent: #A5C9F0;
+  cRed: #FF3000;
+  cBlue: #009EFF;
+  cGreen: #309E00;
+  cOrange: #FFCE00;
+}
+
+@palette.Classic {
+  bg: #BFBFBF;
+  fg: #000180;
+  text: #000000;
+  link: #0000FF;
+  accent: #A5C9F0;
+  cRed: #FF0000;
+  cBlue: #2E2ECE;
+  cGreen: #007E00;
+  cOrange: #CE8F5F;
+}
+
+@palette.Vapor {
+  bg: #F0ADCD;
+  fg: #bca4ee;
+  text: #602040;
+  link: #064745;
+  accent: #9DF7C8;
+  cRed: #86004a;
+  cBlue: #0e5663;
+  cGreen: #0a8b51;
+  cOrange: #787424;
+}
+
+Root {
+  --gradientColor: color | --accent;
+  --inputColor: color | #FFFFFF;
+  --bevelLight: color | $brightness(--bg 50);
+  --bevelDark: color | $brightness(--bg -20);
+  --bevelExtraDark: color | #404040;
+  --buttonDefaultBevel: shadow | $borderSide(--bevelExtraDark bottom-right 1 1), $borderSide(--bevelLight top-left 1 1), $borderSide(--bevelDark bottom-right 1 2);
+  --buttonPressedFocusedBevel: shadow | inset 0 0 0 1 #000000 / 1 #Outer , inset 0 0 0 2 --bevelExtraDark / 1 #inner;
+  --buttonPressedBevel: shadow | $borderSide(--bevelDark top-left 1 1), $borderSide(--bevelLight bottom-right 1 1), $borderSide(--bevelExtraDark top-left 1 2);
+  --defaultInputBevel: shadow | $borderSide(--bevelDark top-left 1 1), $borderSide(--bevelLight bottom-right 1 1), $borderSide(--bevelExtraDark top-left 1 2), $borderSide(--bg bottom-right 1 2);
+}
+
+Button:toggled {
+  background: --bg;
+  shadow: --buttonPressedBevel
+}
+
+Button:focused {
+  shadow: --buttonDefaultBevel, 0 0 0 1 #000000 / 1
+}
+
+Button:pressed {
+  shadow: --buttonPressedBevel
+}
+
+Button:hover {
+  shadow: --buttonDefaultBevel;
+  background: --bg
+}
+
+Button {
+  shadow: --buttonDefaultBevel;
+  background: --bg;
+  roundness: 0
+}
+
+Button:pressed:hover {
+  shadow: --buttonPressedBevel
+}
+
+Button:hover:pressed:focused {
+  shadow: --buttonPressedFocusedBevel
+}
+
+Button:pressed:focused {
+  shadow: --buttonPressedFocusedBevel
+}
+
+Button:toggled:pressed {
+  shadow: --buttonPressedFocusedBevel
+}
+
+Input {
+  background: $boost(--bg 20);
+  shadow: --defaultInputBevel;
+  roundness: 0
+}
+
+Input:focused {
+  shadow: inset 0 0 0 1 #000000 / 1, --defaultInputBevel
+}
+
+Input:focused:hover {
+  shadow: --defaultInputBevel
+}
+
+Input:focused:hover:disabled {
+  shadow: --defaultInputBevel
+}
+
+Input:hover {
+  shadow: --defaultInputBevel
+}
+
+Input:disabled {
+  shadow: --defaultInputBevel
+}
+
+Panel {
+  shadow: --buttonDefaultBevel;
+  roundness: 0
+}
+
+PanelHeader {
+  shadow: inset -1100 0 1000 -1000 --gradientColor / 1 #Gradient ;
+  background: --fg
+}
+
+PanelHeader ButtonUnstyled Icon {
+  textColor: --text;
+  textAuto: 'no-preserve'
+}
+
+PanelHeader Button Icon {
+  textColor: --text;
+  textAuto: 'no-preserve'
+}
+
+PanelHeader Button Text {
+  textColor: --text;
+  textAuto: 'no-preserve'
+}
+
+Tab:hover {
+  background: --bg;
+  shadow: --buttonDefaultBevel
+}
+
+Tab:active {
+  background: --bg
+}
+
+Tab:active:hover {
+  background: --bg;
+  shadow: --defaultButtonBevel
+}
+
+Tab:active:hover:disabled {
+  background: --bg
+}
+
+Tab:hover:disabled {
+  background: --bg
+}
+
+Tab:disabled {
+  background: --bg
+}
+
+Tab {
+  background: --bg;
+  shadow: --buttonDefaultBevel
+}
+
+Tab:hover:active {
+  shadow: --buttonDefaultBevel
+}
+
+TopBar Link {
+  textColor: #ffffff
+}
+
+MenuItem:hover {
+  background: --fg
+}
+
+MenuItem:active {
+  background: --fg
+}
+
+MenuItem:active:hover {
+  background: --fg
+}
+
+Popover {
+  shadow: --buttonDefaultBevel, 5 5 0 0 #000000 / 0.2;
+  roundness: 0
+}
diff --git a/public/static/styles/index.json b/public/static/styles/index.json
new file mode 100644
index 000000000..6c1dd1676
--- /dev/null
+++ b/public/static/styles/index.json
@@ -0,0 +1,4 @@
+{
+  "RedmondDX": "/static/styles/Redmond DX.iss",
+  "BreezyDX": "/static/styles/Breezy DX.iss"
+}
diff --git a/static/terms-of-service.html b/public/static/terms-of-service.html
similarity index 100%
rename from static/terms-of-service.html
rename to public/static/terms-of-service.html
diff --git a/static/themes/breezy-dark.json b/public/static/themes/breezy-dark.json
similarity index 100%
rename from static/themes/breezy-dark.json
rename to public/static/themes/breezy-dark.json
diff --git a/static/themes/breezy-light.json b/public/static/themes/breezy-light.json
similarity index 100%
rename from static/themes/breezy-light.json
rename to public/static/themes/breezy-light.json
diff --git a/static/themes/mammal.json b/public/static/themes/mammal.json
similarity index 100%
rename from static/themes/mammal.json
rename to public/static/themes/mammal.json
diff --git a/static/themes/paper.json b/public/static/themes/paper.json
similarity index 100%
rename from static/themes/paper.json
rename to public/static/themes/paper.json
diff --git a/static/themes/pleroma-dark.json b/public/static/themes/pleroma-dark.json
similarity index 100%
rename from static/themes/pleroma-dark.json
rename to public/static/themes/pleroma-dark.json
diff --git a/static/themes/pleroma-light.json b/public/static/themes/pleroma-light.json
similarity index 100%
rename from static/themes/pleroma-light.json
rename to public/static/themes/pleroma-light.json
diff --git a/static/themes/redmond-xx-se.json b/public/static/themes/redmond-xx-se.json
similarity index 100%
rename from static/themes/redmond-xx-se.json
rename to public/static/themes/redmond-xx-se.json
diff --git a/static/themes/redmond-xx.json b/public/static/themes/redmond-xx.json
similarity index 100%
rename from static/themes/redmond-xx.json
rename to public/static/themes/redmond-xx.json
diff --git a/static/themes/redmond-xxi.json b/public/static/themes/redmond-xxi.json
similarity index 100%
rename from static/themes/redmond-xxi.json
rename to public/static/themes/redmond-xxi.json
diff --git a/src/App.js b/src/App.js
index e87108dd9..0027d908a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -14,9 +14,14 @@ import EditStatusModal from './components/edit_status_modal/edit_status_modal.vu
 import PostStatusModal from './components/post_status_modal/post_status_modal.vue'
 import StatusHistoryModal from './components/status_history_modal/status_history_modal.vue'
 import GlobalNoticeList from './components/global_notice_list/global_notice_list.vue'
+import { getOrCreateServiceWorker } from './services/sw/sw'
 import { windowWidth, windowHeight } from './services/window_utils/window_utils'
 import { mapGetters } from 'vuex'
 import { defineAsyncComponent } from 'vue'
+import { useShoutStore } from './stores/shout'
+import { useInterfaceStore } from './stores/interface'
+
+import { throttle } from 'lodash'
 
 export default {
   name: 'app',
@@ -45,27 +50,57 @@ export default {
     mobileActivePanel: 'timeline'
   }),
   watch: {
-    themeApplied (value) {
+    themeApplied () {
       this.removeSplash()
+    },
+    currentTheme () {
+      this.setThemeBodyClass()
+    },
+    layoutType () {
+      document.getElementById('modal').classList = ['-' + this.layoutType]
     }
   },
   created () {
     // Load the locale from the storage
     const val = this.$store.getters.mergedConfig.interfaceLanguage
     this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
-    window.addEventListener('resize', this.updateMobileState)
+    document.getElementById('modal').classList = ['-' + this.layoutType]
+
+    // Create bound handlers
+    this.updateScrollState = throttle(this.scrollHandler, 200)
+    this.updateMobileState = throttle(this.resizeHandler, 200)
   },
   mounted () {
-    if (this.$store.state.interface.themeApplied) {
+    window.addEventListener('resize', this.updateMobileState)
+    this.scrollParent.addEventListener('scroll', this.updateScrollState)
+
+    if (useInterfaceStore().themeApplied) {
+      this.setThemeBodyClass()
       this.removeSplash()
     }
+    getOrCreateServiceWorker()
   },
   unmounted () {
     window.removeEventListener('resize', this.updateMobileState)
+    this.scrollParent.removeEventListener('scroll', this.updateScrollState)
   },
   computed: {
     themeApplied () {
-      return this.$store.state.interface.themeApplied
+      return useInterfaceStore().themeApplied
+    },
+    currentTheme () {
+      if (useInterfaceStore().styleDataUsed) {
+        const styleMeta = useInterfaceStore().styleDataUsed.find(x => x.component === '@meta')
+
+        if (styleMeta !== undefined) {
+          return styleMeta.directives.name.replaceAll(" ", "-").toLowerCase()
+        }
+      }
+
+      return 'stock'
+    },
+    layoutModalClass () {
+      return '-' + this.layoutType
     },
     classes () {
       return [
@@ -99,7 +134,7 @@ export default {
         }
       }
     },
-    shout () { return this.$store.state.shout.joined },
+    shout () { return useShoutStore().joined },
     suggestionsEnabled () { return this.$store.state.instance.suggestionsEnabled },
     showInstanceSpecificPanel () {
       return this.$store.state.instance.showInstanceSpecificPanel &&
@@ -125,7 +160,7 @@ export default {
     hideShoutbox () {
       return this.$store.getters.mergedConfig.hideShoutbox
     },
-    layoutType () { return this.$store.state.interface.layoutType },
+    layoutType () { return useInterfaceStore().layoutType },
     privateMode () { return this.$store.state.instance.private },
     reverseLayout () {
       const { thirdColumnMode, sidebarRight: reverseSetting } = this.$store.getters.mergedConfig
@@ -137,12 +172,41 @@ export default {
     },
     noSticky () { return this.$store.getters.mergedConfig.disableStickyHeaders },
     showScrollbars () { return this.$store.getters.mergedConfig.showScrollbars },
+    scrollParent () { return window; /* this.$refs.appContentRef */ },
     ...mapGetters(['mergedConfig'])
   },
   methods: {
-    updateMobileState () {
-      this.$store.dispatch('setLayoutWidth', windowWidth())
-      this.$store.dispatch('setLayoutHeight', windowHeight())
+    resizeHandler () {
+      useInterfaceStore().setLayoutWidth(windowWidth())
+      useInterfaceStore().setLayoutHeight(windowHeight())
+    },
+    scrollHandler () {
+      const scrollPosition = this.scrollParent === window ? window.scrollY : this.scrollParent.scrollTop
+
+      if (scrollPosition != 0) {
+        this.$refs.appContentRef.classList.add(['-scrolled'])
+      } else {
+        this.$refs.appContentRef.classList.remove(['-scrolled'])
+      }
+    },
+    setThemeBodyClass () {
+      const themeName = this.currentTheme
+      const classList = Array.from(document.body.classList)
+      const oldTheme = classList.filter(c => c.startsWith('theme-'))
+
+      if (themeName !== null && themeName !== '') {
+        const newTheme = `theme-${themeName.toLowerCase()}`
+
+        // remove old theme reference if there are any
+        if (oldTheme.length) {
+          document.body.classList.replace(oldTheme[0], newTheme)
+        } else {
+          document.body.classList.add(newTheme)
+        }
+      } else {
+        // remove theme reference if non-V3 theme is used
+        document.body.classList.remove(...oldTheme)
+      }
     },
     removeSplash () {
       document.querySelector('#status').textContent = this.$t('splash.fun_' + Math.ceil(Math.random() * 4))
@@ -150,6 +214,9 @@ export default {
       splashscreenRoot.addEventListener('transitionend', () => {
         splashscreenRoot.remove()
       })
+      setTimeout(() => {
+        splashscreenRoot.remove() // forcibly remove it, should fix my plasma browser widget t. HJ
+      }, 600)
       splashscreenRoot.classList.add('hidden')
       document.querySelector('#app').classList.remove('hidden')
     }
diff --git a/src/App.scss b/src/App.scss
index f52ba06b9..1eee63a7e 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -1,6 +1,9 @@
 // stylelint-disable rscss/class-format
 /* stylelint-disable no-descending-specificity */
-@import "./panel";
+@use "panel";
+
+@import '@fortawesome/fontawesome-svg-core/styles.css';
+@import '@kazvmoe-infra/pinch-zoom-element/dist/pinch-zoom.css';
 
 :root {
   --status-margin: 0.75em;
@@ -18,7 +21,7 @@
 }
 
 html {
-  font-size: var(--textSize, 14px);
+  font-size: var(--textSize, 1rem);
 
   --navbar-height: var(--navbarSize, 3.5rem);
   --emoji-size: var(--emojiSize, 32px);
@@ -30,12 +33,12 @@ body {
   font-family: sans-serif;
   font-family: var(--font);
   margin: 0;
+  padding: 0;
   color: var(--text);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   overscroll-behavior-y: none;
-  overflow-x: clip;
-  overflow-y: scroll;
+  overflow: clip scroll;
 
   &.hidden {
     display: none;
@@ -224,9 +227,8 @@ nav {
   grid-template-rows: 1fr;
   box-sizing: border-box;
   margin: 0 auto;
-  align-content: flex-start;
+  place-content: flex-start center;
   flex-wrap: wrap;
-  justify-content: center;
   min-height: 100vh;
   overflow-x: clip;
 
@@ -262,8 +264,7 @@ nav {
       position: sticky;
       top: var(--navbar-height);
       max-height: calc(100vh - var(--navbar-height));
-      overflow-y: auto;
-      overflow-x: hidden;
+      overflow: hidden auto;
       margin-left: calc(var(--___paddingIncrease) * -1);
       padding-left: calc(var(--___paddingIncrease) + var(--___columnMargin) / 2);
 
@@ -381,6 +382,10 @@ nav {
   font-family: sans-serif;
   font-family: var(--font);
 
+  &.-transparent {
+    backdrop-filter: blur(0.125em) contrast(60%);
+  }
+
   &::-moz-focus-inner {
     border: none;
   }
@@ -388,39 +393,35 @@ nav {
   &:disabled {
     cursor: not-allowed;
   }
+
+  &:active {
+    transform: translate(1px, 1px);
+  }
 }
 
-.menu-item,
-.list-item {
-  display: block;
-  box-sizing: border-box;
-  border: none;
-  outline: none;
-  text-align: initial;
-  font-size: inherit;
+.menu-item {
+  line-height: var(--__line-height);
   font-family: inherit;
   font-weight: 400;
+  font-size: 100%;
   cursor: pointer;
-  color: inherit;
-  clear: both;
-  position: relative;
-  white-space: nowrap;
+
+  a,
+  button:not(.button-default) {
+    color: var(--text);
+    font-size: 100%;
+  }
+
+  &.disabled {
+    cursor: not-allowed;
+  }
+}
+
+.list-item {
   border-color: var(--border);
   border-style: solid;
   border-width: 0;
   border-top-width: 1px;
-  width: 100%;
-  line-height: var(--__line-height);
-  padding: var(--__vertical-gap) var(--__horizontal-gap);
-  background: transparent;
-
-  --__line-height: 1.5em;
-  --__horizontal-gap: 0.75em;
-  --__vertical-gap: 0.5em;
-
-  &.-non-interactive {
-    cursor: auto;
-  }
 
   &.-active,
   &:hover {
@@ -442,20 +443,6 @@ nav {
     border-bottom-width: 1px;
   }
 
-  a,
-  button:not(.button-default) {
-    text-align: initial;
-    padding: 0;
-    background: none;
-    border: none;
-    outline: none;
-    display: inline;
-    font-size: 100%;
-    font-family: inherit;
-    line-height: unset;
-    color: var(--text);
-  }
-
   &:first-child {
     border-top-right-radius: var(--roundness);
     border-top-left-radius: var(--roundness);
@@ -469,6 +456,42 @@ nav {
   }
 }
 
+.menu-item,
+.list-item {
+  display: block;
+  box-sizing: border-box;
+  border: none;
+  outline: none;
+  text-align: initial;
+  color: inherit;
+  clear: both;
+  position: relative;
+  white-space: nowrap;
+  width: 100%;
+  padding: var(--__vertical-gap) var(--__horizontal-gap);
+  background: transparent;
+
+  --__line-height: 1.5em;
+  --__horizontal-gap: 0.75em;
+  --__vertical-gap: 0.5em;
+
+  &.-non-interactive {
+    cursor: auto;
+  }
+
+  a,
+  button:not(.button-default) {
+    text-align: initial;
+    padding: 0;
+    background: none;
+    border: none;
+    outline: none;
+    display: inline;
+    font-family: inherit;
+    line-height: unset;
+  }
+}
+
 .button-unstyled {
   border: none;
   outline: none;
@@ -490,6 +513,12 @@ nav {
   }
 }
 
+label {
+  &.-disabled {
+    color: var(--textFaint);
+  }
+}
+
 input,
 textarea {
   border: none;
@@ -506,6 +535,10 @@ textarea {
     height: unset;
   }
 
+  &::placeholder {
+    color: var(--textFaint)
+  }
+
   --_padding: 0.5em;
 
   border: none;
@@ -526,6 +559,10 @@ textarea {
   &[disabled="disabled"],
   &.disabled {
     cursor: not-allowed;
+    color: var(--textFaint);
+
+    /* stylelint-disable-next-line declaration-no-important */
+    background-color: transparent !important;
   }
 
   &[type="range"] {
@@ -551,6 +588,8 @@ textarea {
       & + label::before {
         opacity: 0.5;
       }
+
+      background-color: var(--background);
     }
 
     + label::before {
@@ -650,7 +689,8 @@ option {
   list-style: none;
   display: grid;
   grid-auto-flow: row dense;
-  grid-template-columns: 1fr 1fr;
+  grid-template-columns: repeat(auto-fit, minmax(20em, 1fr));
+  grid-gap: 0.5em;
 
   li {
     border: 1px solid var(--border);
@@ -660,11 +700,6 @@ option {
   }
 }
 
-.btn-block {
-  display: block;
-  width: 100%;
-}
-
 .btn-group {
   position: relative;
   display: inline-flex;
@@ -676,7 +711,6 @@ option {
     --_roundness-right: 0;
 
     position: relative;
-    flex: 1 1 auto;
   }
 
   > *:first-child,
@@ -723,17 +757,15 @@ option {
   }
 
   &.-dot {
-    min-height: 8px;
-    max-height: 8px;
-    min-width: 8px;
-    max-width: 8px;
-    padding: 0;
+    min-height: 0.6em;
+    max-height: 0.6em;
+    min-width: 0.6em;
+    max-width: 0.6em;
+    left: calc(50% + 0.5em);
+    top: calc(50% - 1em);
     line-height: 0;
-    font-size: 0;
-    left: calc(50% - 4px);
-    top: calc(50% - 4px);
-    margin-left: 6px;
-    margin-top: -6px;
+    padding: 0;
+    margin: 0;
   }
 
   &.-counter {
@@ -764,12 +796,6 @@ option {
   color: var(--text);
 }
 
-.visibility-notice {
-  padding: 0.5em;
-  border: 1px solid var(--textFaint);
-  border-radius: var(--roundness);
-}
-
 .notice-dismissible {
   padding-right: 4rem;
   position: relative;
@@ -814,7 +840,7 @@ option {
 .login-hint {
   text-align: center;
 
-  @media all and (min-width: 801px) {
+  @media all and (width >= 801px) {
     display: none;
   }
 
@@ -836,7 +862,7 @@ option {
   flex: 1;
 }
 
-@media all and (max-width: 800px) {
+@media all and (width <= 800px) {
   .mobile-hidden {
     display: none;
   }
@@ -917,12 +943,7 @@ option {
 
 #splash {
   pointer-events: none;
-  transition: opacity 2s;
-  opacity: 1;
-
-  &.hidden {
-    opacity: 0;
-  }
+  // transition: opacity 0.5s;
 
   #status {
     &.css-ok {
@@ -946,7 +967,7 @@ option {
 
     &.dead {
       animation-name: dead;
-      animation-duration: 2s;
+      animation-duration: 0.5s;
       animation-iteration-count: 1;
       transform: rotateX(90deg) rotateY(0) rotateZ(-45deg);
     }
@@ -1061,7 +1082,7 @@ option {
         scale: 1.0063 0.9938;
         translate: 0 -10%;
         transform: rotateZ(var(--defaultZ));
-        animation-timing-function: ease-in-ou;
+        animation-timing-function: ease-in-out;
       }
 
       90% {
@@ -1080,3 +1101,8 @@ option {
     }
   }
 }
+
+@property --shadow {
+  syntax: "*";
+  inherits: false;
+}
diff --git a/src/App.vue b/src/App.vue
index 9d7ad9129..e5e088bc3 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    v-show="$store.state.interface.themeApplied"
+    v-show="themeApplied"
     id="app-loaded"
     :style="bgStyle"
   >
@@ -16,6 +16,7 @@
     <Notifications v-if="currentUser" />
     <div
       id="content"
+      ref="appContentRef"
       class="app-layout container"
       :class="classes"
     >
@@ -70,7 +71,7 @@
     <PostStatusModal />
     <EditStatusModal v-if="editingAvailable" />
     <StatusHistoryModal v-if="editingAvailable" />
-    <SettingsModal />
+    <SettingsModal :class="layoutModalClass" />
     <UpdateNotification />
     <GlobalNoticeList />
   </div>
diff --git a/src/assets/pleromatan_apology.png b/src/assets/pleromatan_apology.png
deleted file mode 120000
index a7f6191f6..000000000
--- a/src/assets/pleromatan_apology.png
+++ /dev/null
@@ -1 +0,0 @@
-../../static/pleromatan_apology.png
\ No newline at end of file
diff --git a/src/assets/pleromatan_apology_fox.png b/src/assets/pleromatan_apology_fox.png
deleted file mode 120000
index b3db4af3f..000000000
--- a/src/assets/pleromatan_apology_fox.png
+++ /dev/null
@@ -1 +0,0 @@
-../../static/pleromatan_apology_fox.png
\ No newline at end of file
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 9a6964d15..ad994af6a 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -1,3 +1,4 @@
+/* global process */
 import { createApp } from 'vue'
 import { createRouter, createWebHistory } from 'vue-router'
 import vClickOutside from 'click-outside-vue3'
@@ -5,18 +6,26 @@ import VueVirtualScroller from 'vue-virtual-scroller'
 import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
 
 import { FontAwesomeIcon, FontAwesomeLayers } from '@fortawesome/vue-fontawesome'
+import { config } from '@fortawesome/fontawesome-svg-core';
+config.autoAddCss = false
 
 import App from '../App.vue'
 import routes from './routes'
 import VBodyScrollLock from 'src/directives/body_scroll_lock'
 
 import { windowWidth, windowHeight } from '../services/window_utils/window_utils'
-import { getOrCreateApp, getClientToken } from '../services/new_api/oauth.js'
 import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
 import { applyConfig } from '../services/style_setter/style_setter.js'
 import FaviconService from '../services/favicon_service/favicon_service.js'
 import { initServiceWorker, updateFocus } from '../services/sw/sw.js'
 
+import { useOAuthStore } from 'src/stores/oauth'
+import { useI18nStore } from 'src/stores/i18n'
+import { useInterfaceStore } from 'src/stores/interface'
+import { useAnnouncementsStore } from 'src/stores/announcements'
+import { useAuthFlowStore } from 'src/stores/auth_flow'
+import { staticOrApiConfigDefault, instanceDefaultConfig } from 'src/modules/default_config_state.js'
+
 let staticInitialResults = null
 
 const parsedInitialResults = () => {
@@ -58,10 +67,11 @@ const getInstanceConfig = async ({ store }) => {
       const textlimit = data.max_toot_chars
       const vapidPublicKey = data.pleroma.vapid_public_key
 
+      store.dispatch('setInstanceOption', { name: 'pleromaExtensionsAvailable', value: data.pleroma })
       store.dispatch('setInstanceOption', { name: 'textlimit', value: textlimit })
       store.dispatch('setInstanceOption', { name: 'accountApprovalRequired', value: data.approval_required })
-      store.dispatch('setInstanceOption', { name: 'birthdayRequired', value: !!data.pleroma.metadata.birthday_required })
-      store.dispatch('setInstanceOption', { name: 'birthdayMinAge', value: data.pleroma.metadata.birthday_min_age || 0 })
+      store.dispatch('setInstanceOption', { name: 'birthdayRequired', value: !!data.pleroma?.metadata.birthday_required })
+      store.dispatch('setInstanceOption', { name: 'birthdayMinAge', value: data.pleroma?.metadata.birthday_min_age || 0 })
 
       if (vapidPublicKey) {
         store.dispatch('setInstanceOption', { name: 'vapidPublicKey', value: vapidPublicKey })
@@ -73,9 +83,11 @@ const getInstanceConfig = async ({ store }) => {
     console.error('Could not load instance config, potentially fatal')
     console.error(error)
   }
+  // We should check for scrobbles support here but it requires userId
+  // so instead we check for it where it's fetched (statuses.js)
 }
 
-const getBackendProvidedConfig = async ({ store }) => {
+const getBackendProvidedConfig = async () => {
   try {
     const res = await window.fetch('/api/pleroma/frontend_configurations')
     if (res.ok) {
@@ -119,47 +131,15 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
   }
 
   const copyInstanceOption = (name) => {
-    store.dispatch('setInstanceOption', { name, value: config[name] })
+    if (typeof config[name] !== 'undefined') {
+      store.dispatch('setInstanceOption', { name, value: config[name] })
+    }
   }
 
-  copyInstanceOption('theme')
-  copyInstanceOption('nsfwCensorImage')
-  copyInstanceOption('background')
-  copyInstanceOption('hidePostStats')
-  copyInstanceOption('hideBotIndication')
-  copyInstanceOption('hideUserStats')
-  copyInstanceOption('hideFilteredStatuses')
-  copyInstanceOption('logo')
+  Object.keys(staticOrApiConfigDefault).forEach(copyInstanceOption)
+  Object.keys(instanceDefaultConfig).forEach(copyInstanceOption)
 
-  store.dispatch('setInstanceOption', {
-    name: 'logoMask',
-    value: typeof config.logoMask === 'undefined'
-      ? true
-      : config.logoMask
-  })
-
-  store.dispatch('setInstanceOption', {
-    name: 'logoMargin',
-    value: typeof config.logoMargin === 'undefined'
-      ? 0
-      : config.logoMargin
-  })
-  copyInstanceOption('logoLeft')
-  store.commit('authFlow/setInitialStrategy', config.loginMethod)
-
-  copyInstanceOption('redirectRootNoLogin')
-  copyInstanceOption('redirectRootLogin')
-  copyInstanceOption('showInstanceSpecificPanel')
-  copyInstanceOption('minimalScopesMode')
-  copyInstanceOption('hideMutedPosts')
-  copyInstanceOption('collapseMessageWithSubject')
-  copyInstanceOption('scopeCopy')
-  copyInstanceOption('subjectLineBehavior')
-  copyInstanceOption('postContentType')
-  copyInstanceOption('alwaysShowSubjectInput')
-  copyInstanceOption('showFeaturesPanel')
-  copyInstanceOption('hideSitename')
-  copyInstanceOption('sidebarRight')
+  useAuthFlowStore().setInitialStrategy(config.loginMethod)
 }
 
 const getTOS = async ({ store }) => {
@@ -172,8 +152,7 @@ const getTOS = async ({ store }) => {
       throw (res)
     }
   } catch (e) {
-    console.warn("Can't load TOS")
-    console.warn(e)
+    console.warn("Can't load TOS\n", e)
   }
 }
 
@@ -187,8 +166,7 @@ const getInstancePanel = async ({ store }) => {
       throw (res)
     }
   } catch (e) {
-    console.warn("Can't load instance panel")
-    console.warn(e)
+    console.warn("Can't load instance panel\n", e)
   }
 }
 
@@ -218,20 +196,15 @@ const getStickers = async ({ store }) => {
       throw (res)
     }
   } catch (e) {
-    console.warn("Can't load stickers")
-    console.warn(e)
+    console.warn("Can't load stickers\n", e)
   }
 }
 
 const getAppSecret = async ({ store }) => {
-  const { state, commit } = store
-  const { oauth, instance } = state
-  return getOrCreateApp({ ...oauth, instance: instance.server, commit })
-    .then((app) => getClientToken({ ...app, instance: instance.server }))
-    .then((token) => {
-      commit('setAppToken', token.access_token)
-      commit('setBackendInteractor', backendInteractorService(store.getters.getToken()))
-    })
+  const oauth = useOAuthStore()
+  if (oauth.userToken) {
+    store.commit('setBackendInteractor', backendInteractorService(oauth.getToken))
+  }
 }
 
 const resolveStaffAccounts = ({ store, accounts }) => {
@@ -241,7 +214,8 @@ const resolveStaffAccounts = ({ store, accounts }) => {
 
 const getNodeInfo = async ({ store }) => {
   try {
-    const res = await preloadFetch('/nodeinfo/2.0.json')
+    let res = await preloadFetch('/nodeinfo/2.1.json')
+    if (!res.ok) res = await preloadFetch('/nodeinfo/2.0.json')
     if (res.ok) {
       const data = await res.json()
       const metadata = data.metadata
@@ -252,7 +226,12 @@ const getNodeInfo = async ({ store }) => {
       store.dispatch('setInstanceOption', { name: 'safeDM', value: features.includes('safe_dm_mentions') })
       store.dispatch('setInstanceOption', { name: 'shoutAvailable', value: features.includes('chat') })
       store.dispatch('setInstanceOption', { name: 'pleromaChatMessagesAvailable', value: features.includes('pleroma_chat_messages') })
-      store.dispatch('setInstanceOption', { name: 'pleromaCustomEmojiReactionsAvailable', value: features.includes('pleroma_custom_emoji_reactions') })
+      store.dispatch('setInstanceOption', {
+        name: 'pleromaCustomEmojiReactionsAvailable',
+        value:
+          features.includes('pleroma_custom_emoji_reactions') ||
+          features.includes('custom_emoji_reactions')
+      })
       store.dispatch('setInstanceOption', { name: 'pleromaBookmarkFoldersAvailable', value: features.includes('pleroma:bookmark_folders') })
       store.dispatch('setInstanceOption', { name: 'gopherAvailable', value: features.includes('gopher') })
       store.dispatch('setInstanceOption', { name: 'pollsAvailable', value: features.includes('polls') })
@@ -261,6 +240,8 @@ const getNodeInfo = async ({ store }) => {
       store.dispatch('setInstanceOption', { name: 'mailerEnabled', value: metadata.mailerEnabled })
       store.dispatch('setInstanceOption', { name: 'quotingAvailable', value: features.includes('quote_posting') })
       store.dispatch('setInstanceOption', { name: 'groupActorAvailable', value: features.includes('pleroma:group_actors') })
+      store.dispatch('setInstanceOption', { name: 'blockExpiration', value: features.includes('pleroma:block_expiration') })
+      store.dispatch('setInstanceOption', { name: 'localBubbleInstances', value: metadata.localBubbleInstances ?? [] })
 
       const uploadLimits = metadata.uploadLimits
       store.dispatch('setInstanceOption', { name: 'uploadlimit', value: parseInt(uploadLimits.general) })
@@ -278,7 +259,7 @@ const getNodeInfo = async ({ store }) => {
 
       const software = data.software
       store.dispatch('setInstanceOption', { name: 'backendVersion', value: software.version })
-      store.dispatch('setInstanceOption', { name: 'pleromaBackend', value: software.name === 'pleroma' })
+      store.dispatch('setInstanceOption', { name: 'backendRepository', value: software.repository })
 
       const priv = metadata.private
       store.dispatch('setInstanceOption', { name: 'private', value: priv })
@@ -323,19 +304,71 @@ const setConfig = async ({ store }) => {
   const apiConfig = configInfos[0]
   const staticConfig = configInfos[1]
 
-  await setSettings({ store, apiConfig, staticConfig }).then(getAppSecret({ store }))
+  getAppSecret({ store })
+  await setSettings({ store, apiConfig, staticConfig })
 }
 
 const checkOAuthToken = async ({ store }) => {
-  if (store.getters.getUserToken()) {
-    return store.dispatch('loginUser', store.getters.getUserToken())
+  const oauth = useOAuthStore()
+  if (oauth.getUserToken) {
+    return store.dispatch('loginUser', oauth.getUserToken)
   }
   return Promise.resolve()
 }
 
-const afterStoreSetup = async ({ store, i18n }) => {
-  store.dispatch('setLayoutWidth', windowWidth())
-  store.dispatch('setLayoutHeight', windowHeight())
+const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
+  const app = createApp(App)
+  // Must have app use pinia before we do anything that touches the store
+  // https://pinia.vuejs.org/core-concepts/plugins.html#Introduction
+  // "Plugins are only applied to stores created after the plugins themselves, and after pinia is passed to the app, otherwise they won't be applied."
+  app.use(pinia)
+
+  const waitForAllStoresToLoad = async () => {
+    // the stores that do not persist technically do not need to be awaited here,
+    // but that involves either hard-coding the stores in some place (prone to errors)
+    // or writing another vite plugin to analyze which stores needs persisting (++load time)
+    const allStores = import.meta.glob('../stores/*.js', { eager: true })
+    if (process.env.NODE_ENV === 'development') {
+      // do some checks to avoid common errors
+      if (!Object.keys(allStores).length) {
+        throw new Error('No stores are available. Check the code in src/boot/after_store.js')
+      }
+    }
+    await Promise.all(
+      Object.entries(allStores)
+        .map(async ([name, mod]) => {
+          const isStoreName = name => name.startsWith('use')
+          if (process.env.NODE_ENV === 'development') {
+            if (Object.keys(mod).filter(isStoreName).length !== 1) {
+              throw new Error('Each store file must export exactly one store as a named export. Check your code in src/stores/')
+            }
+          }
+          const storeFuncName = Object.keys(mod).find(isStoreName)
+          if (storeFuncName && typeof mod[storeFuncName] === 'function') {
+            const p = mod[storeFuncName]().$persistLoaded
+            if (!(p instanceof Promise)) {
+              throw new Error(`${name} store's $persistLoaded is not a Promise. The persist plugin is not applied.`)
+            }
+            await p
+          } else {
+            throw new Error(`Store module ${name} does not export a 'use...' function`)
+          }
+        }))
+  }
+
+  try {
+    await waitForAllStoresToLoad()
+  } catch (e) {
+    console.error('Cannot load stores:', e)
+    storageError = e
+  }
+
+  if (storageError) {
+    useInterfaceStore().pushGlobalNotice({ messageKey: 'errors.storage_unavailable', level: 'error' })
+  }
+
+  useInterfaceStore().setLayoutWidth(windowWidth())
+  useInterfaceStore().setLayoutHeight(windowHeight())
 
   FaviconService.initFaviconService()
   initServiceWorker(store)
@@ -346,12 +379,11 @@ const afterStoreSetup = async ({ store, i18n }) => {
   const server = (typeof overrides.target !== 'undefined') ? overrides.target : window.location.origin
   store.dispatch('setInstanceOption', { name: 'server', value: server })
 
-  document.querySelector('#status').textContent = i18n.global.t('splash.settings')
   await setConfig({ store })
-  document.querySelector('#status').textContent = i18n.global.t('splash.theme')
   try {
-    await store.dispatch('setTheme').catch((e) => { console.error('Error setting theme', e) })
+    await useInterfaceStore().applyTheme().catch((e) => { console.error('Error setting theme', e) })
   } catch (e) {
+    window.splashError(e)
     return Promise.reject(e)
   }
 
@@ -359,7 +391,6 @@ const afterStoreSetup = async ({ store, i18n }) => {
 
   // Now we can try getting the server settings and logging in
   // Most of these are preloaded into the index.html so blocking is minimized
-  document.querySelector('#status').textContent = i18n.global.t('splash.instance')
   await Promise.all([
     checkOAuthToken({ store }),
     getInstancePanel({ store }),
@@ -369,7 +400,8 @@ const afterStoreSetup = async ({ store, i18n }) => {
 
   // Start fetching things that don't need to block the UI
   store.dispatch('fetchMutes')
-  store.dispatch('startFetchingAnnouncements')
+  store.dispatch('loadDrafts')
+  useAnnouncementsStore().startFetchingAnnouncements()
   getTOS({ store })
   getStickers({ store })
 
@@ -384,12 +416,19 @@ const afterStoreSetup = async ({ store, i18n }) => {
     }
   })
 
-  const app = createApp(App)
+  useI18nStore().setI18n(i18n)
 
   app.use(router)
   app.use(store)
   app.use(i18n)
 
+  // Little thing to get out of invalid theme state
+  window.resetThemes = () => {
+    useInterfaceStore().resetThemeV3()
+    useInterfaceStore().resetThemeV3Palette()
+    useInterfaceStore().resetThemeV2()
+  }
+
   app.use(vClickOutside)
   app.use(VBodyScrollLock)
   app.use(VueVirtualScroller)
@@ -399,7 +438,6 @@ const afterStoreSetup = async ({ store, i18n }) => {
 
   // remove after vue 3.3
   app.config.unwrapInjectedRef = true
-  document.querySelector('#status').textContent = i18n.global.t('splash.almost')
 
   app.mount('#app')
   return app
diff --git a/src/boot/routes.js b/src/boot/routes.js
index f87b2ec85..02abf8ce6 100644
--- a/src/boot/routes.js
+++ b/src/boot/routes.js
@@ -1,4 +1,5 @@
 import PublicTimeline from 'components/public_timeline/public_timeline.vue'
+import BubbleTimeline from 'components/bubble_timeline/bubble_timeline.vue'
 import PublicAndExternalTimeline from 'components/public_and_external_timeline/public_and_external_timeline.vue'
 import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue'
 import TagTimeline from 'components/tag_timeline/tag_timeline.vue'
@@ -26,6 +27,7 @@ import ListsEdit from 'components/lists_edit/lists_edit.vue'
 import NavPanel from 'src/components/nav_panel/nav_panel.vue'
 import AnnouncementsPage from 'components/announcements_page/announcements_page.vue'
 import QuotesTimeline from '../components/quotes_timeline/quotes_timeline.vue'
+import Drafts from 'components/drafts/drafts.vue'
 import BookmarkFolders from '../components/bookmark_folders/bookmark_folders.vue'
 import BookmarkFolderEdit from '../components/bookmark_folder_edit/bookmark_folder_edit.vue'
 
@@ -42,7 +44,7 @@ export default (store) => {
     {
       name: 'root',
       path: '/',
-      redirect: _to => {
+      redirect: () => {
         return (store.state.users.currentUser
           ? store.state.instance.redirectRootLogin
           : store.state.instance.redirectRootNoLogin) || '/main/all'
@@ -53,6 +55,7 @@ export default (store) => {
     { name: 'friends', path: '/main/friends', component: FriendsTimeline, beforeEnter: validateAuthenticatedRoute },
     { name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline },
     { name: 'bookmarks', path: '/bookmarks', component: BookmarkTimeline },
+    { name: 'bubble', path: '/bubble', component: BubbleTimeline },
     { name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } },
     { name: 'quotes', path: '/notice/:id/quotes', component: QuotesTimeline },
     {
@@ -82,6 +85,7 @@ export default (store) => {
     { name: 'who-to-follow', path: '/who-to-follow', component: WhoToFollow, beforeEnter: validateAuthenticatedRoute },
     { name: 'about', path: '/about', component: About },
     { name: 'announcements', path: '/announcements', component: AnnouncementsPage },
+    { name: 'drafts', path: '/drafts', component: Drafts },
     { name: 'user-profile', path: '/users/:name', component: UserProfile },
     { name: 'legacy-user-profile', path: '/:name', component: UserProfile },
     { name: 'lists', path: '/lists', component: Lists },
diff --git a/src/components/account_actions/account_actions.js b/src/components/account_actions/account_actions.js
index acd93e065..2ac74ea76 100644
--- a/src/components/account_actions/account_actions.js
+++ b/src/components/account_actions/account_actions.js
@@ -3,10 +3,12 @@ import ProgressButton from '../progress_button/progress_button.vue'
 import Popover from '../popover/popover.vue'
 import UserListMenu from 'src/components/user_list_menu/user_list_menu.vue'
 import ConfirmModal from '../confirm_modal/confirm_modal.vue'
+import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faEllipsisV
 } from '@fortawesome/free-solid-svg-icons'
+import { useReportsStore } from 'src/stores/reports'
 
 library.add(
   faEllipsisV
@@ -26,21 +28,19 @@ const AccountActions = {
     ProgressButton,
     Popover,
     UserListMenu,
-    ConfirmModal
+    ConfirmModal,
+    UserTimedFilterModal
   },
   methods: {
-    showConfirmBlock () {
-      this.showingConfirmBlock = true
-    },
-    hideConfirmBlock () {
-      this.showingConfirmBlock = false
-    },
     showConfirmRemoveUserFromFollowers () {
       this.showingConfirmRemoveFollower = true
     },
     hideConfirmRemoveUserFromFollowers () {
       this.showingConfirmRemoveFollower = false
     },
+    hideConfirmBlock () {
+      this.showingConfirmBlock = false
+    },
     showRepeats () {
       this.$store.dispatch('showReblogs', this.user.id)
     },
@@ -48,14 +48,18 @@ const AccountActions = {
       this.$store.dispatch('hideReblogs', this.user.id)
     },
     blockUser () {
-      if (!this.shouldConfirmBlock) {
-        this.doBlockUser()
+      if (this.$refs.timedBlockDialog) {
+        this.$refs.timedBlockDialog.optionallyPrompt()
       } else {
-        this.showConfirmBlock()
+        if (!this.shouldConfirmBlock) {
+          this.doBlockUser()
+        } else {
+          this.showingConfirmBlock = true
+        }
       }
     },
     doBlockUser () {
-      this.$store.dispatch('blockUser', this.user.id)
+      this.$store.dispatch('blockUser', { id: this.user.id })
       this.hideConfirmBlock()
     },
     unblockUser () {
@@ -73,7 +77,7 @@ const AccountActions = {
       this.hideConfirmRemoveUserFromFollowers()
     },
     reportUser () {
-      this.$store.dispatch('openUserReportingModal', { userId: this.user.id })
+      useReportsStore().openUserReportingModal({ userId: this.user.id })
     },
     openChat () {
       this.$router.push({
@@ -90,6 +94,7 @@ const AccountActions = {
       return this.$store.getters.mergedConfig.modalOnRemoveUserFromFollowers
     },
     ...mapState({
+      blockExpirationSupported: state => state.instance.blockExpiration,
       pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable
     })
   }
diff --git a/src/components/account_actions/account_actions.vue b/src/components/account_actions/account_actions.vue
index 9a7c6824a..cc00a735d 100644
--- a/src/components/account_actions/account_actions.vue
+++ b/src/components/account_actions/account_actions.vue
@@ -3,66 +3,85 @@
     <Popover
       trigger="click"
       placement="bottom"
-      :bound-to="{ x: 'container' }"
       remove-padding
     >
       <template #content>
         <div class="dropdown-menu">
           <template v-if="relationship.following">
-            <button
+            <div
               v-if="relationship.showing_reblogs"
-              class="dropdown-item menu-item"
-              @click="hideRepeats"
+              class="menu-item dropdown-item"
             >
-              {{ $t('user_card.hide_repeats') }}
-            </button>
-            <button
+              <button
+                class="main-button"
+                @click="hideRepeats"
+              >
+                {{ $t('user_card.hide_repeats') }}
+              </button>
+            </div>
+            <div
               v-if="!relationship.showing_reblogs"
-              class="dropdown-item menu-item"
-              @click="showRepeats"
+              class="menu-item dropdown-item"
             >
-              {{ $t('user_card.show_repeats') }}
-            </button>
+              <button
+                class="main-button"
+                @click="showRepeats"
+              >
+                {{ $t('user_card.show_repeats') }}
+              </button>
+            </div>
             <div
               role="separator"
               class="dropdown-divider"
             />
           </template>
           <UserListMenu :user="user" />
-          <button
+          <div
             v-if="relationship.followed_by"
-            class="dropdown-item menu-item"
-            @click="removeUserFromFollowers"
+            class="menu-item dropdown-item"
           >
-            {{ $t('user_card.remove_follower') }}
-          </button>
-          <button
-            v-if="relationship.blocking"
-            class="dropdown-item menu-item"
-            @click="unblockUser"
-          >
-            {{ $t('user_card.unblock') }}
-          </button>
-          <button
-            v-else
-            class="dropdown-item menu-item"
-            @click="blockUser"
-          >
-            {{ $t('user_card.block') }}
-          </button>
-          <button
-            class="dropdown-item menu-item"
-            @click="reportUser"
-          >
-            {{ $t('user_card.report') }}
-          </button>
-          <button
+            <button
+              class="main-button"
+              @click="removeUserFromFollowers"
+            >
+              {{ $t('user_card.remove_follower') }}
+            </button>
+          </div>
+          <div class="menu-item dropdown-item">
+            <button
+              v-if="relationship.blocking"
+              class="main-button"
+              @click="unblockUser"
+            >
+              {{ $t('user_card.unblock') }}
+            </button>
+            <button
+              v-else
+              class="main-button"
+              @click="blockUser"
+            >
+              {{ $t('user_card.block') }}
+            </button>
+          </div>
+          <div class="menu-item dropdown-item">
+            <button
+              class="main-button"
+              @click="reportUser"
+            >
+              {{ $t('user_card.report') }}
+            </button>
+          </div>
+          <div
             v-if="pleromaChatMessagesAvailable"
-            class="dropdown-item menu-item"
-            @click="openChat"
+            class="menu-item dropdown-item"
           >
-            {{ $t('user_card.message') }}
-          </button>
+            <button
+              class="main-button"
+              @click="openChat"
+            >
+              {{ $t('user_card.message') }}
+            </button>
+          </div>
         </div>
       </template>
       <template #trigger>
@@ -76,7 +95,8 @@
     </Popover>
     <teleport to="#modal">
       <confirm-modal
-        v-if="showingConfirmBlock"
+        v-if="showingConfirmBlock && !blockExpirationSupported"
+        ref="blockDialog"
         :title="$t('user_card.block_confirm_title')"
         :confirm-text="$t('user_card.block_confirm_accept_button')"
         :cancel-text="$t('user_card.block_confirm_cancel_button')"
@@ -86,6 +106,7 @@
         <i18n-t
           keypath="user_card.block_confirm"
           tag="span"
+          scope="global"
         >
           <template #user>
             <span
@@ -107,6 +128,7 @@
         <i18n-t
           keypath="user_card.remove_follower_confirm"
           tag="span"
+          scope="global"
         >
           <template #user>
             <span
@@ -115,6 +137,12 @@
           </template>
         </i18n-t>
       </confirm-modal>
+      <UserTimedFilterModal
+        v-if="blockExpirationSupported"
+        ref="timedBlockDialog"
+        :is-mute="false"
+        :user="user"
+      />
     </teleport>
   </div>
 </template>
diff --git a/src/components/alert.style.js b/src/components/alert.style.js
index abbeb5baa..868514764 100644
--- a/src/components/alert.style.js
+++ b/src/components/alert.style.js
@@ -14,6 +14,10 @@ export default {
     warning: '.warning',
     success: '.success'
   },
+  editor: {
+    border: 1,
+    aspect: '3 / 1'
+  },
   defaultRules: [
     {
       directives: {
diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js
index 30254926a..d1b8257d8 100644
--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@@ -2,6 +2,7 @@ import { mapState } from 'vuex'
 import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
 import RichContent from '../rich_content/rich_content.jsx'
 import localeService from '../../services/locale/locale.service.js'
+import { useAnnouncementsStore } from 'src/stores/announcements'
 
 const Announcement = {
   components: {
@@ -67,11 +68,11 @@ const Announcement = {
   methods: {
     markAsRead () {
       if (!this.isRead) {
-        return this.$store.dispatch('markAnnouncementAsRead', this.announcement.id)
+        return useAnnouncementsStore().markAnnouncementAsRead(this.announcement.id)
       }
     },
     deleteAnnouncement () {
-      return this.$store.dispatch('deleteAnnouncement', this.announcement.id)
+      return useAnnouncementsStore().deleteAnnouncement(this.announcement.id)
     },
     formatTimeOrDate (time, locale) {
       const d = new Date(time)
@@ -85,7 +86,7 @@ const Announcement = {
       this.editing = true
     },
     submitEdit () {
-      this.$store.dispatch('editAnnouncement', {
+      useAnnouncementsStore().editAnnouncement({
         id: this.announcement.id,
         ...this.editedAnnouncement
       })
diff --git a/src/components/announcement_editor/announcement_editor.vue b/src/components/announcement_editor/announcement_editor.vue
index c0a3c30ac..f1b016183 100644
--- a/src/components/announcement_editor/announcement_editor.vue
+++ b/src/components/announcement_editor/announcement_editor.vue
@@ -34,8 +34,9 @@
         id="announcement-all-day"
         v-model="announcement.allDay"
         :disabled="disabled"
-      />
-      <label for="announcement-all-day">{{ $t('announcements.all_day_prompt') }}</label>
+      >
+        {{ $t('announcements.all_day_prompt') }}
+      </Checkbox>
     </span>
   </div>
 </template>
@@ -55,7 +56,7 @@
   .post-textarea {
     resize: vertical;
     height: 10em;
-    overflow: none;
+    overflow: visible;
     box-sizing: content-box;
   }
 }
diff --git a/src/components/announcements_page/announcements_page.js b/src/components/announcements_page/announcements_page.js
index 8d1204d4c..9ce0b45f5 100644
--- a/src/components/announcements_page/announcements_page.js
+++ b/src/components/announcements_page/announcements_page.js
@@ -1,6 +1,7 @@
 import { mapState } from 'vuex'
 import Announcement from '../announcement/announcement.vue'
 import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
+import { useAnnouncementsStore } from 'src/stores/announcements'
 
 const AnnouncementsPage = {
   components: {
@@ -20,14 +21,14 @@ const AnnouncementsPage = {
     }
   },
   mounted () {
-    this.$store.dispatch('fetchAnnouncements')
+    useAnnouncementsStore().fetchAnnouncements()
   },
   computed: {
     ...mapState({
       currentUser: state => state.users.currentUser
     }),
     announcements () {
-      return this.$store.state.announcements.announcements
+      return useAnnouncementsStore().announcements
     },
     canPostAnnouncement () {
       return this.currentUser && this.currentUser.privileges.includes('announcements_manage_announcements')
@@ -36,7 +37,7 @@ const AnnouncementsPage = {
   methods: {
     postAnnouncement () {
       this.posting = true
-      this.$store.dispatch('postAnnouncement', this.newAnnouncement)
+      useAnnouncementsStore().postAnnouncement(this.newAnnouncement)
         .then(() => {
           this.newAnnouncement.content = ''
           this.startsAt = undefined
diff --git a/src/components/announcements_page/announcements_page.vue b/src/components/announcements_page/announcements_page.vue
index 25f830ffb..44e2cf46a 100644
--- a/src/components/announcements_page/announcements_page.vue
+++ b/src/components/announcements_page/announcements_page.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="panel panel-default announcements-page">
     <div class="panel-heading">
-      <span>
+      <h1 class="title">
         {{ $t('announcements.page_header') }}
-      </span>
+      </h1>
     </div>
     <div class="panel-body">
       <section
diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js
index 6e14b24d7..21d793930 100644
--- a/src/components/attachment/attachment.js
+++ b/src/components/attachment/attachment.js
@@ -18,6 +18,7 @@ import {
   faPencilAlt,
   faAlignRight
 } from '@fortawesome/free-solid-svg-icons'
+import { useMediaViewerStore } from 'src/stores/media_viewer'
 
 library.add(
   faFile,
@@ -144,17 +145,17 @@ const Attachment = {
         window.open(target.href, '_blank')
       }
     },
-    openModal (event) {
+    openModal () {
       if (this.useModal) {
         this.$emit('setMedia')
-        this.$store.dispatch('setCurrentMedia', this.attachment)
+        useMediaViewerStore().setCurrentMedia(this.attachment)
       } else if (this.type === 'unknown') {
         window.open(this.attachment.url)
       }
     },
-    openModalForce (event) {
+    openModalForce () {
       this.$emit('setMedia')
-      this.$store.dispatch('setCurrentMedia', this.attachment)
+      useMediaViewerStore().setCurrentMedia(this.attachment)
     },
     onEdit (event) {
       this.edit && this.edit(this.attachment, event)
diff --git a/src/components/attachment/attachment.scss b/src/components/attachment/attachment.scss
index 13afbe641..97515eb32 100644
--- a/src/components/attachment/attachment.scss
+++ b/src/components/attachment/attachment.scss
@@ -107,9 +107,9 @@
 
   .play-icon {
     position: absolute;
-    font-size: 64px;
-    top: calc(50% - 32px);
-    left: calc(50% - 32px);
+    font-size: 4.5em;
+    top: calc(50% - 2.25rem);
+    left: calc(50% - 2.25rem);
     color: rgb(255 255 255 / 75%);
     text-shadow: 0 0 2px rgb(0 0 0 / 40%);
 
@@ -177,7 +177,8 @@
     .text {
       flex: 2;
       margin: 8px;
-      word-break: break-all;
+      overflow-wrap: break-word;
+      text-wrap: pretty;
 
       h1 {
         font-size: 1rem;
diff --git a/src/components/attachment/attachment.style.js b/src/components/attachment/attachment.style.js
deleted file mode 100644
index 5fb4701c3..000000000
--- a/src/components/attachment/attachment.style.js
+++ /dev/null
@@ -1,24 +0,0 @@
-export default {
-  name: 'Attachment',
-  selector: '.Attachment',
-  validInnerComponents: [
-    'Border',
-    'ButtonUnstyled',
-    'Input'
-  ],
-  defaultRules: [
-    {
-      directives: {
-        roundness: 3
-      }
-    },
-    {
-      component: 'ButtonUnstyled',
-      parent: { component: 'Attachment' },
-      directives: {
-        background: '#FFFFFF',
-        opacity: 0.5
-      }
-    }
-  ]
-}
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 9abc26271..696d3bb8a 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -1,7 +1,7 @@
 <template>
   <button
     v-if="usePlaceholder"
-    class="Attachment -placeholder button-unstyled"
+    class="Attachment -placeholder button-default"
     :class="classNames"
     @click="openModal"
   >
@@ -23,7 +23,7 @@
     >
       <button
         v-if="remove"
-        class="button-unstyled attachment-button"
+        class="button-default attachment-button -transparent"
         @click.prevent="onRemove"
       >
         <FAIcon icon="trash-alt" />
@@ -81,7 +81,7 @@
       >
         <button
           v-if="type === 'flash' && flashLoaded"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.attachment_stop_flash')"
           @click.prevent="stopFlash"
         >
@@ -89,7 +89,7 @@
         </button>
         <button
           v-if="attachment.description && size !== 'small' && !edit && type !== 'unknown'"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.show_attachment_description')"
           @click.prevent="toggleDescription"
         >
@@ -97,7 +97,7 @@
         </button>
         <button
           v-if="!useModal && type !== 'unknown'"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.show_attachment_in_modal')"
           @click.prevent="openModalForce"
         >
@@ -105,7 +105,7 @@
         </button>
         <button
           v-if="nsfw && hideNsfwLocal"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.hide_attachment')"
           @click.prevent="toggleHidden"
         >
@@ -113,7 +113,7 @@
         </button>
         <button
           v-if="shiftUp"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.move_up')"
           @click.prevent="onShiftUp"
         >
@@ -121,7 +121,7 @@
         </button>
         <button
           v-if="shiftDn"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.move_down')"
           @click.prevent="onShiftDn"
         >
@@ -129,7 +129,7 @@
         </button>
         <button
           v-if="remove"
-          class="button-unstyled attachment-button"
+          class="button-default attachment-button -transparent"
           :title="$t('status.remove_attachment')"
           @click.prevent="onRemove"
         >
@@ -238,8 +238,8 @@
           ref="flash"
           class="flash"
           :src="attachment.large_thumb_url || attachment.url"
-          @playerOpened="setFlashLoaded(true)"
-          @playerClosed="setFlashLoaded(false)"
+          @player-opened="setFlashLoaded(true)"
+          @player-closed="setFlashLoaded(false)"
         />
       </span>
     </div>
diff --git a/src/components/auth_form/auth_form.js b/src/components/auth_form/auth_form.js
index a86a3dca2..243cbf574 100644
--- a/src/components/auth_form/auth_form.js
+++ b/src/components/auth_form/auth_form.js
@@ -2,7 +2,8 @@ import { h, resolveComponent } from 'vue'
 import LoginForm from '../login_form/login_form.vue'
 import MFARecoveryForm from '../mfa_form/recovery_form.vue'
 import MFATOTPForm from '../mfa_form/totp_form.vue'
-import { mapGetters } from 'vuex'
+import { mapState } from 'pinia'
+import { useAuthFlowStore } from 'src/stores/auth_flow'
 
 const AuthForm = {
   name: 'AuthForm',
@@ -15,7 +16,7 @@ const AuthForm = {
       if (this.requiredRecovery) { return 'MFARecoveryForm' }
       return 'LoginForm'
     },
-    ...mapGetters('authFlow', ['requiredTOTP', 'requiredRecovery'])
+    ...mapState(useAuthFlowStore, ['requiredTOTP', 'requiredRecovery'])
   },
   components: {
     MFARecoveryForm,
diff --git a/src/components/basic_user_card/basic_user_card.vue b/src/components/basic_user_card/basic_user_card.vue
index 9e2b0295d..29a60cd1e 100644
--- a/src/components/basic_user_card/basic_user_card.vue
+++ b/src/components/basic_user_card/basic_user_card.vue
@@ -48,7 +48,7 @@
   flex: 1 0;
   margin: 0;
 
-  --emoji-size: 14px;
+  --emoji-size: 1em;
 
   &-collapsed-content {
     margin-left: 0.7em;
diff --git a/src/components/block_card/block_card.js b/src/components/block_card/block_card.js
index 0bf4e37bc..9a618db3f 100644
--- a/src/components/block_card/block_card.js
+++ b/src/components/block_card/block_card.js
@@ -1,12 +1,9 @@
+import { mapState } from 'vuex'
+
 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
 
 const BlockCard = {
   props: ['userId'],
-  data () {
-    return {
-      progress: false
-    }
-  },
   computed: {
     user () {
       return this.$store.getters.findUser(this.userId)
@@ -16,23 +13,32 @@ const BlockCard = {
     },
     blocked () {
       return this.relationship.blocking
-    }
+    },
+    blockExpiryAvailable () {
+      return this.user.block_expires_at !== undefined
+    },
+    blockExpiry () {
+      return this.user.block_expires_at == null
+        ? this.$t('user_card.block_expires_forever')
+        : this.$t('user_card.block_expires_at', [new Date(this.user.mute_expires_at).toLocaleString()])
+    },
+    ...mapState({
+      blockExpirationSupported: state => state.instance.blockExpiration,
+    })
   },
   components: {
     BasicUserCard
   },
   methods: {
     unblockUser () {
-      this.progress = true
-      this.$store.dispatch('unblockUser', this.user.id).then(() => {
-        this.progress = false
-      })
+      this.$store.dispatch('unblockUser', this.user.id)
     },
     blockUser () {
-      this.progress = true
-      this.$store.dispatch('blockUser', this.user.id).then(() => {
-        this.progress = false
-      })
+      if (this.blockExpirationSupported) {
+        this.$refs.timedBlockDialog.optionallyPrompt()
+      } else {
+        this.$store.dispatch('blockUser', { id: this.user.id })
+      }
     }
   }
 }
diff --git a/src/components/block_card/block_card.vue b/src/components/block_card/block_card.vue
index b14ef8448..90b9a2b16 100644
--- a/src/components/block_card/block_card.vue
+++ b/src/components/block_card/block_card.vue
@@ -1,33 +1,35 @@
 <template>
   <basic-user-card :user="user">
     <div class="block-card-content-container">
+      <span
+        v-if="blocked && blockExpiryAvailable"
+        class="alert neutral"
+      >
+        {{ blockExpiry }}
+      </span>
+      {{ ' ' }}
       <button
         v-if="blocked"
         class="btn button-default"
-        :disabled="progress"
         @click="unblockUser"
       >
-        <template v-if="progress">
-          {{ $t('user_card.unblock_progress') }}
-        </template>
-        <template v-else>
-          {{ $t('user_card.unblock') }}
-        </template>
+        {{ $t('user_card.unblock') }}
       </button>
       <button
         v-else
         class="btn button-default"
-        :disabled="progress"
         @click="blockUser"
       >
-        <template v-if="progress">
-          {{ $t('user_card.block_progress') }}
-        </template>
-        <template v-else>
-          {{ $t('user_card.block') }}
-        </template>
+        {{ $t('user_card.block') }}
       </button>
     </div>
+    <teleport to="#modal">
+      <UserTimedFilterModal
+        ref="timedBlockDialog"
+        :user="user"
+        :is-mute="false"
+      />
+    </teleport>
   </basic-user-card>
 </template>
 
diff --git a/src/components/bookmark_folder_edit/bookmark_folder_edit.js b/src/components/bookmark_folder_edit/bookmark_folder_edit.js
index 95c015764..bb96585bf 100644
--- a/src/components/bookmark_folder_edit/bookmark_folder_edit.js
+++ b/src/components/bookmark_folder_edit/bookmark_folder_edit.js
@@ -1,5 +1,7 @@
 import EmojiPicker from '../emoji_picker/emoji_picker.vue'
 import apiService from '../../services/api/api.service'
+import { useInterfaceStore } from 'src/stores/interface'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
 
 const BookmarkFolderEdit = {
   data () {
@@ -52,18 +54,18 @@ const BookmarkFolderEdit = {
       this.emojiPickerExpanded = false
     },
     updateFolder () {
-      this.$store.dispatch('setBookmarkFolder', { folderId: this.id, name: this.nameDraft, emoji: this.emojiDraft })
+      useBookmarkFoldersStore().updateBookmarkFolder({ folderId: this.id, name: this.nameDraft, emoji: this.emojiDraft })
         .then(() => {
           this.$router.push({ name: 'bookmark-folders' })
         })
     },
     createFolder () {
-      this.$store.dispatch('createBookmarkFolder', { name: this.nameDraft, emoji: this.emojiDraft })
+      useBookmarkFoldersStore().createBookmarkFolder({ name: this.nameDraft, emoji: this.emojiDraft })
         .then(() => {
           this.$router.push({ name: 'bookmark-folders' })
         })
         .catch((e) => {
-          this.$store.dispatch('pushGlobalNotice', {
+          useInterfaceStore().pushGlobalNotice({
             messageKey: 'bookmark_folders.error',
             messageArgs: [e.message],
             level: 'error'
@@ -71,7 +73,7 @@ const BookmarkFolderEdit = {
         })
     },
     deleteFolder () {
-      this.$store.dispatch('deleteBookmarkFolder', { folderId: this.id })
+      useBookmarkFoldersStore().deleteBookmarkFolder({ folderId: this.id })
       this.$router.push({ name: 'bookmark-folders' })
     }
   }
diff --git a/src/components/bookmark_folder_edit/bookmark_folder_edit.vue b/src/components/bookmark_folder_edit/bookmark_folder_edit.vue
index b6a768d41..4a5bff499 100644
--- a/src/components/bookmark_folder_edit/bookmark_folder_edit.vue
+++ b/src/components/bookmark_folder_edit/bookmark_folder_edit.vue
@@ -13,10 +13,11 @@
           icon="chevron-left"
         />
       </button>
-      <div class="title">
+      <h1 class="title">
         <i18n-t
           v-if="id"
           keypath="bookmark_folders.editing_folder"
+          scope="global"
         >
           <template #folderName>
             {{ name }}
@@ -25,8 +26,9 @@
         <i18n-t
           v-else
           keypath="bookmark_folders.creating_folder"
+          scope="global"
         />
-      </div>
+      </h1>
     </div>
     <div class="panel-body">
       <div class="input-wrap">
diff --git a/src/components/bookmark_folders/bookmark_folders.js b/src/components/bookmark_folders/bookmark_folders.js
index 9f1f1fed0..096f3769d 100644
--- a/src/components/bookmark_folders/bookmark_folders.js
+++ b/src/components/bookmark_folders/bookmark_folders.js
@@ -1,4 +1,5 @@
 import BookmarkFolderCard from '../bookmark_folder_card/bookmark_folder_card.vue'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
 
 const BookmarkFolders = {
   data () {
@@ -11,7 +12,7 @@ const BookmarkFolders = {
   },
   computed: {
     bookmarkFolders () {
-      return this.$store.state.bookmarkFolders.allFolders
+      return useBookmarkFoldersStore().allFolders
     }
   },
   methods: {
diff --git a/src/components/bookmark_folders/bookmark_folders.vue b/src/components/bookmark_folders/bookmark_folders.vue
index d92e95df0..fdd461064 100644
--- a/src/components/bookmark_folders/bookmark_folders.vue
+++ b/src/components/bookmark_folders/bookmark_folders.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="Bookmark-folders panel panel-default">
     <div class="panel-heading">
-      <div class="title">
+      <h1 class="title">
         {{ $t('nav.bookmark_folders') }}
-      </div>
+      </h1>
       <router-link
         :to="{ name: 'bookmark-folder-new' }"
         class="button-default btn new-folder-button"
diff --git a/src/components/bookmark_folders_menu/bookmark_folders_menu_content.js b/src/components/bookmark_folders_menu/bookmark_folders_menu_content.js
index d5f82f466..dc46b91b3 100644
--- a/src/components/bookmark_folders_menu/bookmark_folders_menu_content.js
+++ b/src/components/bookmark_folders_menu/bookmark_folders_menu_content.js
@@ -1,13 +1,17 @@
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
 import { getBookmarkFolderEntries } from 'src/components/navigation/filter.js'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
 
 export const BookmarkFoldersMenuContent = {
+  props: [
+    'showPin'
+  ],
   components: {
     NavigationEntry
   },
   computed: {
-    ...mapState({
+    ...mapState(useBookmarkFoldersStore, {
       folders: getBookmarkFolderEntries
     })
   }
diff --git a/src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue b/src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue
index d603cd010..197f79654 100644
--- a/src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue
+++ b/src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue
@@ -7,10 +7,12 @@
         label: 'nav.all_bookmarks',
         icon: 'bookmark'
       }"
+      :show-pin="showPin"
     />
     <NavigationEntry
       v-for="item in folders"
       :key="item.id"
+      :show-pin="showPin"
       :item="item"
     />
   </ul>
diff --git a/src/components/border.style.js b/src/components/border.style.js
index a87ee9c87..7f2c30163 100644
--- a/src/components/border.style.js
+++ b/src/components/border.style.js
@@ -5,7 +5,7 @@ export default {
   defaultRules: [
     {
       directives: {
-        textColor: '$mod(--parent, 10)',
+        textColor: '$mod(--parent 10)',
         textAuto: 'no-auto'
       }
     }
diff --git a/src/components/bubble_timeline/bubble_timeline.js b/src/components/bubble_timeline/bubble_timeline.js
new file mode 100644
index 000000000..6f73dd2b8
--- /dev/null
+++ b/src/components/bubble_timeline/bubble_timeline.js
@@ -0,0 +1,18 @@
+import Timeline from '../timeline/timeline.vue'
+const BubbleTimeline = {
+  components: {
+    Timeline
+  },
+  computed: {
+    timeline () { return this.$store.state.statuses.timelines.bubble }
+  },
+  created () {
+    this.$store.dispatch('startFetchingTimeline', { timeline: 'bubble' })
+  },
+  unmounted () {
+    this.$store.dispatch('stopFetchingTimeline', 'bubble')
+  }
+
+}
+
+export default BubbleTimeline
diff --git a/src/components/bubble_timeline/bubble_timeline.vue b/src/components/bubble_timeline/bubble_timeline.vue
new file mode 100644
index 000000000..4aefa2729
--- /dev/null
+++ b/src/components/bubble_timeline/bubble_timeline.vue
@@ -0,0 +1,9 @@
+<template>
+  <Timeline
+    :title="$t('nav.bubble')"
+    :timeline="timeline"
+    :timeline-name="'bubble'"
+  />
+</template>
+
+<script src="./bubble_timeline.js"></script>
diff --git a/src/components/button.style.js b/src/components/button.style.js
index 1423d5c78..5cffefd91 100644
--- a/src/components/button.style.js
+++ b/src/components/button.style.js
@@ -9,19 +9,23 @@ export default {
     // However, cascading still works, so resulting state will be result of merging of all relevant states/variants
     // normal: '' // normal state is implicitly added, it is always included
     toggled: '.toggled',
-    pressed: ':active',
-    hover: ':hover:not(:disabled)',
     focused: ':focus-within',
+    pressed: ':active',
+    hover: ':is(:hover, :focus-visible):not(:disabled)',
     disabled: ':disabled'
   },
   // Variants are mutually exclusive, each component implicitly has "normal" variant, and all other variants inherit from it.
   variants: {
     // Variants save on computation time since adding new variant just adds one more "set".
     // normal: '', // you can override normal variant, it will be appenended to the main class
-    danger: '.danger'
+    danger: '.-danger',
+    transparent: '.-transparent'
     // Overall the compuation difficulty is N*((1/6)M^3+M) where M is number of distinct states and N is number of variants.
     // This (currently) is further multipled by number of places where component can exist.
   },
+  editor: {
+    aspect: '2 / 1'
+  },
   // This lists all other components that can possibly exist within one. Recursion is currently not supported (and probably won't be supported ever).
   validInnerComponents: [
     'Text',
@@ -32,10 +36,11 @@ export default {
     {
       component: 'Root',
       directives: {
-        '--defaultButtonHoverGlow': 'shadow | 0 0 4 --text',
-        '--defaultButtonShadow': 'shadow | 0 0 2 #000000',
-        '--defaultButtonBevel': 'shadow | $borderSide(#FFFFFF, top, 0.2), $borderSide(#000000, bottom, 0.2)',
-        '--pressedButtonBevel': 'shadow | $borderSide(#FFFFFF, bottom, 0.2), $borderSide(#000000, top, 0.2)'
+        '--buttonDefaultHoverGlow': 'shadow | 0 0 1 2 --text / 0.4',
+        '--buttonDefaultFocusGlow': 'shadow | 0 0 1 2 --link / 0.5',
+        '--buttonDefaultShadow': 'shadow | 0 0 2 #000000',
+        '--buttonDefaultBevel': 'shadow | $borderSide(#FFFFFF top 0.2 1), $borderSide(#000000 bottom 0.2 1)',
+        '--buttonPressedBevel': 'shadow | inset 0 0 4 #000000, $borderSide(#FFFFFF bottom 0.2 1), $borderSide(#000000 top 0.2 1)'
       }
     },
     {
@@ -43,47 +48,106 @@ export default {
       // like within it
       directives: {
         background: '--fg',
-        shadow: ['--defaultButtonShadow', '--defaultButtonBevel'],
+        shadow: ['--buttonDefaultShadow', '--buttonDefaultBevel'],
         roundness: 3
       }
     },
+    {
+      variant: 'danger',
+      directives: {
+        background: '--cRed'
+      }
+    },
+    {
+      variant: 'transparent',
+      directives: {
+        opacity: 0.5
+      }
+    },
+    {
+      component: 'Text',
+      parent: {
+        component: 'Button',
+        variant: 'transparent'
+      },
+      directives: {
+        textColor: '--text'
+      }
+    },
+    {
+      component: 'Icon',
+      parent: {
+        component: 'Button',
+        variant: 'transparent'
+      },
+      directives: {
+        textColor: '--text'
+      }
+    },
     {
       state: ['hover'],
       directives: {
-        shadow: ['--defaultButtonHoverGlow', '--defaultButtonBevel']
+        shadow: ['--buttonDefaultHoverGlow', '--buttonDefaultBevel']
+      }
+    },
+    {
+      state: ['focused'],
+      directives: {
+        shadow: ['--buttonDefaultFocusGlow', '--buttonDefaultBevel']
       }
     },
     {
       state: ['pressed'],
       directives: {
-        shadow: ['--defaultButtonShadow', '--pressedButtonBevel']
+        shadow: ['--buttonDefaultShadow', '--buttonPressedBevel']
       }
     },
     {
-      state: ['hover', 'pressed'],
+      state: ['pressed', 'hover'],
       directives: {
-        shadow: ['--defaultButtonHoverGlow', '--pressedButtonBevel']
+        shadow: ['--buttonPressedBevel', '--buttonDefaultHoverGlow']
       }
     },
     {
       state: ['toggled'],
       directives: {
-        background: '--inheritedBackground,-14.2',
-        shadow: ['--defaultButtonShadow', '--pressedButtonBevel']
+        background: '--accent,-24.2',
+        shadow: ['--buttonDefaultShadow', '--buttonPressedBevel']
       }
     },
     {
       state: ['toggled', 'hover'],
       directives: {
-        background: '--inheritedBackground,-14.2',
-        shadow: ['--defaultButtonHoverGlow', '--pressedButtonBevel']
+        background: '--accent,-24.2',
+        shadow: ['--buttonDefaultHoverGlow', '--buttonPressedBevel']
+      }
+    },
+    {
+      state: ['toggled', 'focused'],
+      directives: {
+        background: '--accent,-24.2',
+        shadow: ['--buttonDefaultHoverGlow', '--buttonPressedBevel']
+      }
+    },
+    {
+      state: ['toggled', 'hover', 'focused'],
+      directives: {
+        background: '--accent,-24.2',
+        shadow: ['--buttonDefaultHoverGlow', '--buttonPressedBevel']
+      }
+    },
+    {
+      state: ['toggled', 'disabled'],
+      directives: {
+        background: '$blend(--accent 0.25 --parent)',
+        shadow: ['--buttonPressedBevel']
       }
     },
     {
       state: ['disabled'],
       directives: {
-        background: '$blend(--inheritedBackground, 0.25, --parent)',
-        shadow: ['--defaultButtonBevel']
+        background: '$blend(--inheritedBackground 0.25 --parent)',
+        shadow: ['--buttonDefaultBevel']
       }
     },
     {
diff --git a/src/components/button_unstyled.style.js b/src/components/button_unstyled.style.js
index 65b5c57bf..9e1a2ca90 100644
--- a/src/components/button_unstyled.style.js
+++ b/src/components/button_unstyled.style.js
@@ -1,22 +1,23 @@
 export default {
   name: 'ButtonUnstyled',
   selector: '.button-unstyled',
+  notEditable: true,
+  transparent: true,
   states: {
     toggled: '.toggled',
     disabled: ':disabled',
-    hover: ':hover:not(:disabled)',
-    focused: ':focus-within'
+    hover: ':is(:hover, :focus-visible):not(:disabled)',
+    focused: ':focus-within:not(:is(:focus-visible))'
   },
   validInnerComponents: [
     'Text',
+    'Link',
     'Icon',
     'Badge'
   ],
   defaultRules: [
     {
       directives: {
-        background: '#ffffff',
-        opacity: 0,
         shadow: []
       }
     },
diff --git a/src/components/chat/chat.js b/src/components/chat/chat.js
index 79f24771a..56f389e60 100644
--- a/src/components/chat/chat.js
+++ b/src/components/chat/chat.js
@@ -1,6 +1,7 @@
 import _ from 'lodash'
 import { WSConnectionStatus } from '../../services/api/api.service.js'
 import { mapGetters, mapState } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import ChatMessage from '../chat_message/chat_message.vue'
 import PostStatusForm from '../post_status_form/post_status_form.vue'
 import ChatTitle from '../chat_title/chat_title.vue'
@@ -13,6 +14,7 @@ import {
   faChevronLeft
 } from '@fortawesome/free-solid-svg-icons'
 import { buildFakeMessage } from '../../services/chat_utils/chat_utils.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
 
 library.add(
   faChevronDown,
@@ -90,10 +92,12 @@ const Chat = {
       'findOpenedChatByRecipientId',
       'mergedConfig'
     ]),
+    ...mapPiniaState(useInterfaceStore, {
+      mobileLayout: store => store.layoutType === 'mobile'
+    }),
     ...mapState({
       backendInteractor: state => state.api.backendInteractor,
       mastoUserSocketStatus: state => state.api.mastoUserSocketStatus,
-      mobileLayout: state => state.interface.layoutType === 'mobile',
       currentUser: state => state.users.currentUser
     })
   },
diff --git a/src/components/chat/chat.vue b/src/components/chat/chat.vue
index 6efe576b8..dfd197e56 100644
--- a/src/components/chat/chat.vue
+++ b/src/components/chat/chat.vue
@@ -76,6 +76,7 @@
             :disable-sensitivity-checkbox="true"
             :disable-submit="errorLoadingChat || !currentChat"
             :disable-preview="true"
+            :disable-draft="true"
             :optimistic-posting="true"
             :post-handler="sendMessage"
             :submit-on-enter="!mobileLayout"
@@ -94,6 +95,4 @@
 </template>
 
 <script src="./chat.js"></script>
-<style lang="scss">
-@import "./chat";
-</style>
+<style src="./chat.scss" lang="scss" />
diff --git a/src/components/chat_list/chat_list.vue b/src/components/chat_list/chat_list.vue
index b33ea67ec..881df2988 100644
--- a/src/components/chat_list/chat_list.vue
+++ b/src/components/chat_list/chat_list.vue
@@ -7,9 +7,9 @@
     class="chat-list panel panel-default"
   >
     <div class="panel-heading -sticky">
-      <span class="title">
+      <h1 class="title">
         {{ $t("chats.chats") }}
-      </span>
+      </h1>
       <button
         class="button-default"
         @click="newChat"
@@ -34,7 +34,7 @@
       </div>
       <div
         v-else
-        class="emtpy-chat-list-alert"
+        class="empty-chat-list-alert"
       >
         <span>{{ $t('chats.empty_chat_list_placeholder') }}</span>
       </div>
@@ -50,7 +50,7 @@
   margin-bottom: 0;
 }
 
-.emtpy-chat-list-alert {
+.empty-chat-list-alert {
   padding: 3em;
   font-size: 1.2em;
   display: flex;
diff --git a/src/components/chat_list_item/chat_list_item.js b/src/components/chat_list_item/chat_list_item.js
index e5032176f..8f8c491f5 100644
--- a/src/components/chat_list_item/chat_list_item.js
+++ b/src/components/chat_list_item/chat_list_item.js
@@ -52,7 +52,7 @@ const ChatListItem = {
     }
   },
   methods: {
-    openChat (_e) {
+    openChat () {
       if (this.chat.id) {
         this.$router.push({
           name: 'chat',
diff --git a/src/components/chat_list_item/chat_list_item.scss b/src/components/chat_list_item/chat_list_item.scss
index 9711b41d6..dcef6380e 100644
--- a/src/components/chat_list_item/chat_list_item.scss
+++ b/src/components/chat_list_item/chat_list_item.scss
@@ -17,7 +17,6 @@
     width: 100%;
     box-sizing: border-box;
     overflow: hidden;
-    word-wrap: break-word;
   }
 
   .heading {
diff --git a/src/components/chat_list_item/chat_list_item.vue b/src/components/chat_list_item/chat_list_item.vue
index 0f9d5c5fa..236562df0 100644
--- a/src/components/chat_list_item/chat_list_item.vue
+++ b/src/components/chat_list_item/chat_list_item.vue
@@ -47,6 +47,4 @@
 
 <script src="./chat_list_item.js"></script>
 
-<style lang="scss">
-@import "./chat_list_item";
-</style>
+<style src="./chat_list_item.scss" lang="scss" />
diff --git a/src/components/chat_message/chat_message.js b/src/components/chat_message/chat_message.js
index ebe09814c..837f6d214 100644
--- a/src/components/chat_message/chat_message.js
+++ b/src/components/chat_message/chat_message.js
@@ -1,4 +1,5 @@
 import { mapState, mapGetters } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import Popover from '../popover/popover.vue'
 import Attachment from '../attachment/attachment.vue'
 import UserAvatar from '../user_avatar/user_avatar.vue'
@@ -12,6 +13,7 @@ import {
   faTimes,
   faEllipsisH
 } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faTimes,
@@ -65,8 +67,10 @@ const ChatMessage = {
     hasAttachment () {
       return this.message.attachments.length > 0
     },
+    ...mapPiniaState(useInterfaceStore, {
+      betterShadow: store => store.browserSupport.cssFilter
+    }),
     ...mapState({
-      betterShadow: state => state.interface.browserSupport.cssFilter,
       currentUser: state => state.users.currentUser,
       restrictedNicknames: state => state.instance.restrictedNicknames
     }),
diff --git a/src/components/chat_message/chat_message.scss b/src/components/chat_message/chat_message.scss
index f7254ea35..c058f8172 100644
--- a/src/components/chat_message/chat_message.scss
+++ b/src/components/chat_message/chat_message.scss
@@ -107,8 +107,7 @@
   .outgoing {
     display: flex;
     flex-flow: row wrap;
-    align-content: end;
-    justify-content: flex-end;
+    place-content: end flex-end;
 
     .chat-message-inner {
       align-items: flex-end;
diff --git a/src/components/chat_message/chat_message.style.js b/src/components/chat_message/chat_message.style.js
index 9b57ad371..76b565823 100644
--- a/src/components/chat_message/chat_message.style.js
+++ b/src/components/chat_message/chat_message.style.js
@@ -8,9 +8,6 @@ export default {
     'Text',
     'Icon',
     'Border',
-    'Button',
-    'RichContent',
-    'Attachment',
     'PollGraph'
   ],
   defaultRules: [
diff --git a/src/components/chat_message/chat_message.vue b/src/components/chat_message/chat_message.vue
index 166889d71..22e2e8eb8 100644
--- a/src/components/chat_message/chat_message.vue
+++ b/src/components/chat_message/chat_message.vue
@@ -20,7 +20,6 @@
         >
           <UserAvatar
             :compact="true"
-            :better-shadow="betterShadow"
             :user="author"
           />
         </UserPopover>
@@ -52,12 +51,14 @@
               >
                 <template #content>
                   <div class="dropdown-menu">
-                    <button
-                      class="menu-item dropdown-item dropdown-item-icon"
-                      @click="deleteMessage"
-                    >
-                      <FAIcon icon="times" /> {{ $t("chats.delete") }}
-                    </button>
+                    <div class="menu-item dropdown-item -icon">
+                      <button
+                        class="main-button"
+                        @click="deleteMessage"
+                      >
+                        <FAIcon icon="times" /> {{ $t("chats.delete") }}
+                      </button>
+                    </div>
                   </div>
                 </template>
                 <template #trigger>
@@ -97,7 +98,5 @@
 </template>
 
 <script src="./chat_message.js"></script>
-<style lang="scss">
-@import "./chat_message";
 
-</style>
+<style src="./chat_message.scss" lang="scss" />
diff --git a/src/components/chat_new/chat_new.vue b/src/components/chat_new/chat_new.vue
index 673ba56b6..14b26efd6 100644
--- a/src/components/chat_new/chat_new.vue
+++ b/src/components/chat_new/chat_new.vue
@@ -47,6 +47,5 @@
 </template>
 
 <script src="./chat_new.js"></script>
-<style lang="scss">
-@import "./chat_new";
-</style>
+
+<style src="./chat_new.scss" lang="scss" />
diff --git a/src/components/chat_title/chat_title.vue b/src/components/chat_title/chat_title.vue
index 68ee7a5ab..00521260f 100644
--- a/src/components/chat_title/chat_title.vue
+++ b/src/components/chat_title/chat_title.vue
@@ -19,6 +19,7 @@
       :title="'@'+(user && user.screen_name_ui)"
       :html="htmlTitle"
       :emoji="user.emoji || []"
+      :is-local="user.is_local"
     />
   </div>
 </template>
@@ -32,14 +33,13 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 
-  --emoji-size: 14px;
+  --emoji-size: 1em;
 
   .username {
     max-width: 100%;
     text-overflow: ellipsis;
     white-space: nowrap;
     display: inline;
-    word-wrap: break-word;
     overflow: hidden;
   }
 
diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index 8ffcc63b4..1e0f5ad05 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -1,7 +1,7 @@
 <template>
   <label
     class="checkbox"
-    :class="{ disabled, indeterminate, 'indeterminate-fix': indeterminateTransitionFix }"
+    :class="[{ ['-disabled']: disabled, indeterminate, 'indeterminate-fix': indeterminateTransitionFix }, radio ? '-radio' : '-checkbox']"
   >
     <span
       v-if="!!$slots.before"
@@ -19,9 +19,9 @@
       @change="$emit('update:modelValue', $event.target.checked)"
     >
     <i
-      class="input -checkbox checkbox-indicator"
+      class="input checkbox-indicator"
       :aria-hidden="true"
-      :class="{ disabled }"
+      :class="[{ disabled }, radio ? '-radio' : '-checkbox']"
       @transitionend.capture="onTransitionEnd"
     />
     <span
@@ -37,6 +37,7 @@
 <script>
 export default {
   props: [
+    'radio',
     'modelValue',
     'indeterminate',
     'disabled'
@@ -53,7 +54,7 @@ export default {
     }
   },
   methods: {
-    onTransitionEnd (e) {
+    onTransitionEnd () {
       if (!this.indeterminate) {
         this.indeterminateTransitionFix = false
       }
@@ -63,35 +64,40 @@ export default {
 </script>
 
 <style lang="scss">
-@import "../../mixins";
-
 .checkbox {
   position: relative;
   display: inline-block;
   min-height: 1.2em;
 
+  &-indicator,
+  & .label {
+    vertical-align: middle;
+  }
+
   & > &-indicator {
     /* Reset .input stuff */
     padding: 0;
     margin: 0;
     position: relative;
     line-height: inherit;
-    display: inline;
-    padding-left: 1.2em;
+    display: inline-block;
+    width: 1.2em;
+    height: 1.2em;
     box-shadow: none;
+
+    --_shadow: var(--shadow);
   }
 
   &-indicator::before {
     position: absolute;
-    right: 0;
-    top: 0;
+    inset: 0;
     display: block;
     content: "✓";
     transition: color 200ms;
     width: 1.1em;
     height: 1.1em;
     border-radius: var(--roundness);
-    box-shadow: var(--shadow);
+    box-shadow: var(--_shadow);
     background-color: var(--background);
     vertical-align: top;
     text-align: center;
@@ -102,9 +108,22 @@ export default {
     box-sizing: border-box;
   }
 
+  &.-radio {
+    .checkbox-indicator {
+      &,
+      &::before {
+        border-radius: 9999px;
+      }
+
+      &::before {
+        content: "•";
+      }
+    }
+  }
+
   .disabled {
     .checkbox-indicator::before {
-      background-color: var(--background);
+      background-color: transparent;
     }
   }
 
diff --git a/src/components/color_input/color_input.scss b/src/components/color_input/color_input.scss
index 19c88a690..fad2bfca7 100644
--- a/src/components/color_input/color_input.scss
+++ b/src/components/color_input/color_input.scss
@@ -1,14 +1,27 @@
 .color-input {
   display: inline-flex;
+  flex-wrap: wrap;
+  max-width: 10em;
+
+  &.-compact {
+    max-width: none;
+  }
 
   .label {
     flex: 1 1 auto;
+    grid-area: label;
+  }
+
+  .opt {
+    grid-area: checkbox;
+    margin-right: 0.5em;
   }
 
   &-field.input {
-    display: inline-flex;
-    flex: 0 0 0;
-    max-width: 9em;
+    flex: 1 1 10em;
+    max-width: 10em;
+    grid-area: input;
+    display: flex;
     align-items: stretch;
 
     input {
diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index b6e84629f..58aee575c 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     class="color-input style-control"
-    :class="{ disabled: !present || disabled }"
+    :class="{ disabled: !present || disabled, '-compact': compact }"
   >
     <label
       :for="name"
@@ -11,22 +11,22 @@
       {{ label }}
     </label>
     <Checkbox
-      v-if="typeof fallback !== 'undefined' && showOptionalTickbox"
+      v-if="typeof fallback !== 'undefined' && showOptionalCheckbox && !hideOptionalCheckbox"
       :model-value="present"
       :disabled="disabled"
       class="opt"
-      @update:modelValue="update(typeof modelValue === 'undefined' ? fallback : undefined)"
+      @update:model-value="updateValue(typeof modelValue === 'undefined' ? fallback : undefined)"
     />
     <div
       class="input color-input-field"
-      :class="{ disabled: !present || disabled }"
+      :class="{ disabled: !present || disabled, unstyled }"
     >
       <input
         :id="name + '-t'"
         class="textColor unstyled"
         :class="{ disabled: !present || disabled }"
         type="text"
-        :value="modelValue || fallback"
+        :value="modelValue ?? fallback"
         :disabled="!present || disabled"
         @input="updateValue($event.target.value)"
       >
@@ -92,6 +92,11 @@ export default {
       required: true,
       type: String
     },
+    // use unstyled, uh, style
+    unstyled: {
+      required: false,
+      type: Boolean
+    },
     // Color value, should be required but vue cannot tell the difference
     // between "property missing" and "property set to undefined"
     modelValue: {
@@ -112,10 +117,20 @@ export default {
       default: false
     },
     // Show "optional" tickbox, for when value might become mandatory
-    showOptionalTickbox: {
+    showOptionalCheckbox: {
       required: false,
       type: Boolean,
       default: true
+    },
+    // Force "optional" tickbox to hide
+    hideOptionalCheckbox: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    compact: {
+      required: false,
+      type: Boolean
     }
   },
   emits: ['update:modelValue'],
@@ -130,7 +145,7 @@ export default {
       return this.modelValue === 'transparent'
     },
     computedColor () {
-      return this.modelValue && this.modelValue.startsWith('--')
+      return this.modelValue && (this.modelValue.startsWith('--') || this.modelValue.startsWith('$'))
     }
   },
   methods: {
diff --git a/src/components/component_preview/component_preview.js b/src/components/component_preview/component_preview.js
new file mode 100644
index 000000000..9f830cd72
--- /dev/null
+++ b/src/components/component_preview/component_preview.js
@@ -0,0 +1,82 @@
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import ColorInput from 'src/components/color_input/color_input.vue'
+
+import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
+import { createStyleSheet, adoptStyleSheets } from 'src/services/style_setter/style_setter.js'
+
+export default {
+  components: {
+    Checkbox,
+    ColorInput
+  },
+  props: [
+    'shadow',
+    'shadowControl',
+    'previewClass',
+    'previewStyle',
+    'previewCss',
+    'disabled',
+    'invalid',
+    'noColorControl'
+  ],
+  emits: ['update:shadow'],
+  data () {
+    return {
+      colorOverride: undefined,
+      lightGrid: false,
+      zoom: 100,
+      randomSeed: genRandomSeed()
+    }
+  },
+  mounted () {
+    this.update()
+  },
+  computed: {
+    hideControls () {
+      return typeof this.shadow === 'string'
+    }
+  },
+  watch: {
+    previewCss () {
+      this.update()
+    },
+    previewStyle () {
+      this.update()
+    },
+    zoom () {
+      this.update()
+    }
+  },
+  methods: {
+    updateProperty (axis, value) {
+      this.$emit('update:shadow', { axis, value: Number(value) })
+    },
+    update () {
+      const sheet = createStyleSheet('style-component-preview', 90)
+
+      sheet.clear()
+
+      const result = [this.previewCss]
+      if (this.colorOverride) result.push(`--background: ${this.colorOverride}`)
+
+      const styleRule = [
+        '#component-preview-', this.randomSeed, ' {\n',
+        '.preview-block {\n',
+        `zoom: ${this.zoom / 100};`,
+        this.previewStyle,
+        '\n}',
+        '\n}'
+      ].join('')
+
+      sheet.addRule(styleRule)
+      sheet.addRule([
+        '#component-preview-', this.randomSeed, ' {\n',
+        ...result,
+        '\n}'
+      ].join(''))
+
+      sheet.ready = true
+      adoptStyleSheets()
+    }
+  }
+}
diff --git a/src/components/component_preview/component_preview.scss b/src/components/component_preview/component_preview.scss
new file mode 100644
index 000000000..bb83b7908
--- /dev/null
+++ b/src/components/component_preview/component_preview.scss
@@ -0,0 +1,151 @@
+.ComponentPreview {
+  display: grid;
+  grid-template-columns: 1em 1fr 1fr 1em;
+  grid-template-rows: 2em 1fr 1fr 1fr 1em 2em max-content;
+  grid-template-areas:
+    "header     header     header     header "
+    "preview    preview    preview    y-slide"
+    "preview    preview    preview    y-slide"
+    "preview    preview    preview    y-slide"
+    "x-slide    x-slide    x-slide    .      "
+    "x-num      x-num      y-num      y-num  "
+    "assists    assists    assists    assists";
+  grid-gap: 0.5em;
+
+  &:not(.-shadow-controls) {
+    grid-template-areas:
+      "header     header     header     header "
+      "preview    preview    preview    y-slide"
+      "preview    preview    preview    y-slide"
+      "preview    preview    preview    y-slide"
+      "assists    assists    assists    assists";
+    grid-template-rows: 2em 1fr 1fr 1fr max-content;
+  }
+
+  .header {
+    grid-area: header;
+    place-self: baseline center;
+    line-height: 2;
+  }
+
+  .invalid-container {
+    position: absolute;
+    inset: 0;
+    display: grid;
+    place-items: center center;
+    background-color: rgb(100 0 0 / 50%);
+
+    .alert {
+      padding: 0.5em 1em;
+    }
+  }
+
+  .assists {
+    grid-area: assists;
+    display: grid;
+    grid-auto-flow: row;
+    grid-auto-rows: 2em;
+    grid-gap: 0.5em;
+  }
+
+  .input-light-grid {
+    justify-self: center;
+  }
+
+  .input-number {
+    min-width: 2em;
+  }
+
+  .x-shift-number {
+    grid-area: x-num;
+    justify-self: right;
+  }
+
+  .y-shift-number {
+    grid-area: y-num;
+    justify-self: left;
+  }
+
+  .x-shift-number,
+  .y-shift-number {
+    input {
+      max-width: 4em;
+    }
+  }
+
+  .x-shift-slider {
+    grid-area: x-slide;
+    height: auto;
+    align-self: start;
+    min-width: 10em;
+  }
+
+  .y-shift-slider {
+    grid-area: y-slide;
+    writing-mode: vertical-lr;
+    justify-self: left;
+    min-height: 10em;
+  }
+
+  .x-shift-slider,
+  .y-shift-slider {
+    padding: 0;
+  }
+
+  .preview-window {
+    --__grid-color1: rgb(102 102 102);
+    --__grid-color2: rgb(153 153 153);
+    --__grid-color1-disabled: rgb(102 102 102 / 20%);
+    --__grid-color2-disabled: rgb(153 153 153 / 20%);
+
+    &.-light-grid {
+      --__grid-color1: rgb(205 205 205);
+      --__grid-color2: rgb(255 255 255);
+      --__grid-color1-disabled: rgb(205 205 205 / 20%);
+      --__grid-color2-disabled: rgb(255 255 255 / 20%);
+    }
+
+    position: relative;
+    grid-area: preview;
+    aspect-ratio: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 10em;
+    min-height: 10em;
+    background-color: var(--__grid-color2);
+    background-image:
+      linear-gradient(45deg, var(--__grid-color1) 25%, transparent 25%),
+      linear-gradient(-45deg, var(--__grid-color1) 25%, transparent 25%),
+      linear-gradient(45deg, transparent 75%, var(--__grid-color1) 75%),
+      linear-gradient(-45deg, transparent 75%, var(--__grid-color1) 75%);
+    background-size: 20px 20px;
+    background-position: 0 0, 0 10px, 10px -10px, -10px 0;
+    border-radius: var(--roundness);
+
+    &.disabled {
+      background-color: var(--__grid-color2-disabled);
+      background-image:
+        linear-gradient(45deg, var(--__grid-color1-disabled) 25%, transparent 25%),
+        linear-gradient(-45deg, var(--__grid-color1-disabled) 25%, transparent 25%),
+        linear-gradient(45deg, transparent 75%, var(--__grid-color1-disabled) 75%),
+        linear-gradient(-45deg, transparent 75%, var(--__grid-color1-disabled) 75%);
+    }
+
+    .preview-block {
+      background: var(--background, var(--bg));
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      min-width: 33%;
+      min-height: 33%;
+      max-width: 80%;
+      max-height: 80%;
+      border-width: 0;
+      border-style: solid;
+      border-color: var(--border);
+      border-radius: var(--roundness);
+      box-shadow: var(--shadow);
+    }
+  }
+}
diff --git a/src/components/component_preview/component_preview.vue b/src/components/component_preview/component_preview.vue
index 3b2cf63b9..0a0f9541e 100644
--- a/src/components/component_preview/component_preview.vue
+++ b/src/components/component_preview/component_preview.vue
@@ -1,212 +1,115 @@
 <template>
-<div
-  class="ComponentPreview"
-  :class="{ '-shadow-controls': shadowControl }"
->
-  <label
-    class="header"
-    v-show="shadowControl"
-    :class="{ faint: disabled }"
-  >
-    {{ $t('settings.style.shadows.offset') }}
-  </label>
-  <input
-    v-show="shadowControl"
-    :value="shadow?.y"
-    :disabled="disabled"
-    :class="{ disabled }"
-    class="input input-number y-shift-number"
-    type="number"
-    @input="e => updateProperty('y', e.target.value)"
-  >
-  <input
-    v-show="shadowControl"
-    :value="shadow?.y"
-    :disabled="disabled"
-    :class="{ disabled }"
-    class="input input-range y-shift-slider"
-    type="range"
-    max="20"
-    min="-20"
-    @input="e => updateProperty('y', e.target.value)"
-  >
   <div
-    class="preview-window"
-    :class="{ '-light-grid': lightGrid }"
+    :id="'component-preview-' + randomSeed"
+    class="ComponentPreview"
+    :class="{ '-shadow-controls': shadowControl }"
   >
+    <label
+      v-show="shadowControl"
+      role="heading"
+      class="header"
+      :class="{ faint: disabled }"
+    >
+      {{ $t('settings.style.shadows.offset') }}
+    </label>
+    <label
+      v-show="shadowControl && !hideControls"
+      class="x-shift-number"
+    >
+      {{ $t('settings.style.shadows.offset-x') }}
+      <input
+        :value="shadow?.x"
+        :disabled="disabled"
+        :class="{ disabled }"
+        class="input input-number"
+        type="number"
+        @input="e => updateProperty('x', e.target.value)"
+      >
+    </label>
+    <label
+      v-show="shadowControl && !hideControls"
+      class="y-shift-number"
+    >
+      {{ $t('settings.style.shadows.offset-y') }}
+      <input
+        :value="shadow?.y"
+        :disabled="disabled"
+        :class="{ disabled }"
+        class="input input-number"
+        type="number"
+        @input="e => updateProperty('y', e.target.value)"
+      >
+    </label>
+    <input
+      v-show="shadowControl && !hideControls"
+      :value="shadow?.x"
+      :disabled="disabled"
+      :class="{ disabled }"
+      class="input input-range x-shift-slider"
+      type="range"
+      max="20"
+      min="-20"
+      @input="e => updateProperty('x', e.target.value)"
+    >
+    <input
+      v-show="shadowControl && !hideControls"
+      :value="shadow?.y"
+      :disabled="disabled"
+      :class="{ disabled }"
+      class="input input-range y-shift-slider"
+      type="range"
+      max="20"
+      min="-20"
+      @input="e => updateProperty('y', e.target.value)"
+    >
     <div
-      class="preview-block"
-      :style="previewStyle"
-    />
+      class="preview-window"
+      :class="{ '-light-grid': lightGrid }"
+    >
+      <div
+        class="preview-block"
+        :class="previewClass"
+      >
+        {{ $t('settings.style.themes3.editor.test_string') }}
+      </div>
+      <div
+        v-if="invalid"
+        class="invalid-container"
+      >
+        <div class="alert error invalid-label">
+          {{ $t('settings.style.themes3.editor.invalid') }}
+        </div>
+      </div>
+    </div>
+    <div class="assists">
+      <Checkbox
+        v-model="lightGrid"
+        name="lightGrid"
+        class="input-light-grid"
+      >
+        {{ $t('settings.style.shadows.light_grid') }}
+      </Checkbox>
+      <div class="style-control">
+        <label class="label">
+          {{ $t('settings.style.shadows.zoom') }}
+        </label>
+        <input
+          v-model="zoom"
+          class="input input-number y-shift-number"
+          type="number"
+        >
+      </div>
+      <ColorInput
+        v-if="!noColorControl"
+        v-model="colorOverride"
+        class="input-color-input"
+        fallback="#606060"
+        :compact="true"
+        :label="$t('settings.style.shadows.color_override')"
+      />
+    </div>
   </div>
-  <input
-    v-show="shadowControl"
-    :value="shadow?.x"
-    :disabled="disabled"
-    :class="{ disabled }"
-    class="input input-number x-shift-number"
-    type="number"
-    @input="e => updateProperty('x', e.target.value)"
-  >
-  <input
-    v-show="shadowControl"
-    :value="shadow?.x"
-    :disabled="disabled"
-    :class="{ disabled }"
-    class="input input-range x-shift-slider"
-    type="range"
-    max="20"
-    min="-20"
-    @input="e => updateProperty('x', e.target.value)"
-  >
-  <Checkbox
-    id="lightGrid"
-    v-model="lightGrid"
-    :disabled="shadow == null"
-    name="lightGrid"
-    class="input-light-grid"
-  >
-    {{ $t('settings.style.shadows.light_grid') }}
-  </Checkbox>
-</div>
 </template>
 
-<style lang="scss">
-.ComponentPreview {
-  display: grid;
-  grid-template-columns: 3em 1fr 3em;
-  grid-template-rows: 2em 1fr 2em;
-  grid-template-areas:
-    ".       header  y-num  "
-    ".       preview y-slide"
-    "x-num   x-slide .      "
-    "options options options";
-  grid-gap: 0.5em;
-
-  .header {
-    grid-area: header;
-    justify-self: center;
-    align-self: baseline;
-    line-height: 2;
-  }
-
-  .input-light-grid {
-    grid-area: options;
-    justify-self: center;
-  }
-
-  .input-number {
-    min-width: 2em;
-  }
-
-  .x-shift-number {
-    grid-area: x-num;
-  }
-
-  .x-shift-slider {
-    grid-area: x-slide;
-    height: auto;
-    align-self: start;
-    min-width: 10em;
-  }
-
-  .y-shift-number {
-    grid-area: y-num;
-  }
-
-  .y-shift-slider {
-    grid-area: y-slide;
-    writing-mode: vertical-lr;
-    justify-self: left;
-    min-height: 10em;
-  }
-
-  .x-shift-slider,
-  .y-shift-slider {
-    padding: 0;
-  }
-
-  .preview-window {
-    --__grid-color1: rgb(102 102 102);
-    --__grid-color2: rgb(153 153 153);
-    --__grid-color1-disabled: rgba(102 102 102 / 20%);
-    --__grid-color2-disabled: rgba(153 153 153 / 20%);
-
-    &.-light-grid {
-      --__grid-color1: rgb(205 205 205);
-      --__grid-color2: rgb(255 255 255);
-      --__grid-color1-disabled: rgba(205 205 205 / 20%);
-      --__grid-color2-disabled: rgba(255 255 255 / 20%);
-    }
-
-    grid-area: preview;
-    aspect-ratio: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    min-width: 10em;
-    min-height: 10em;
-    background-color: var(--__grid-color2);
-    background-image:
-      linear-gradient(45deg, var(--__grid-color1) 25%, transparent 25%),
-      linear-gradient(-45deg, var(--__grid-color1) 25%, transparent 25%),
-      linear-gradient(45deg, transparent 75%, var(--__grid-color1) 75%),
-      linear-gradient(-45deg, transparent 75%, var(--__grid-color1) 75%);
-    background-size: 20px 20px;
-    background-position: 0 0, 0 10px, 10px -10px, -10px 0;
-    border-radius: var(--roundness);
-
-    &.disabled {
-      background-color: var(--__grid-color2-disabled);
-      background-image:
-        linear-gradient(45deg, var(--__grid-color1-disabled) 25%, transparent 25%),
-        linear-gradient(-45deg, var(--__grid-color1-disabled) 25%, transparent 25%),
-        linear-gradient(45deg, transparent 75%, var(--__grid-color1-disabled) 75%),
-        linear-gradient(-45deg, transparent 75%, var(--__grid-color1-disabled) 75%);
-    }
-
-    .preview-block {
-      background: var(--background, var(--bg));
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      min-width: 33%;
-      min-height: 33%;
-      max-width: 80%;
-      max-height: 80%;
-      border-width: 0;
-      border-style: solid;
-      border-color: var(--border);
-      border-radius: var(--roundness);
-      box-shadow: var(--shadow);
-    }
-  }
-}
-</style>
-<script>
-import Checkbox from 'src/components/checkbox/checkbox.vue'
-
-export default {
-  props: [
-    'shadow',
-    'shadowControl',
-    'previewClass',
-    'previewStyle',
-    'disabled'
-  ],
-  data () {
-    return {
-      lightGrid: false
-    }
-  },
-  emits: ['update:shadow'],
-  components: {
-    Checkbox
-  },
-  methods: {
-    updateProperty (axis, value) {
-      this.$emit('update:shadow', { axis, value })
-    }
-  }
-}
-</script>
+<script src="./component_preview.js" />
+<style src="./component_preview.scss" lang="scss" />
diff --git a/src/components/confirm_modal/confirm_modal.js b/src/components/confirm_modal/confirm_modal.js
index 96ddc118f..3e2bc2cb7 100644
--- a/src/components/confirm_modal/confirm_modal.js
+++ b/src/components/confirm_modal/confirm_modal.js
@@ -22,6 +22,7 @@ const ConfirmModal = {
       type: String
     }
   },
+  emits: ['cancelled', 'accepted'],
   computed: {
   },
   methods: {
diff --git a/src/components/confirm_modal/confirm_modal.vue b/src/components/confirm_modal/confirm_modal.vue
index 3b98174aa..992792ede 100644
--- a/src/components/confirm_modal/confirm_modal.vue
+++ b/src/components/confirm_modal/confirm_modal.vue
@@ -1,8 +1,8 @@
 <template>
-  <dialog-modal
+  <DialogModal
     v-body-scroll-lock="true"
     class="confirm-modal"
-    :on-cancel="onCancel"
+    @cancel="onCancel"
   >
     <template #header>
       <span v-text="title" />
@@ -11,6 +11,7 @@
     <slot />
 
     <template #footer>
+      <slot name="footerLeft" />
       <button
         class="btn button-default"
         @click.prevent="onAccept"
@@ -23,7 +24,7 @@
         v-text="cancelText"
       />
     </template>
-  </dialog-modal>
+  </DialogModal>
 </template>
 
 <script src="./confirm_modal.js"></script>
diff --git a/src/components/confirm_modal/mute_confirm.js b/src/components/confirm_modal/mute_confirm.js
new file mode 100644
index 000000000..a279dc716
--- /dev/null
+++ b/src/components/confirm_modal/mute_confirm.js
@@ -0,0 +1,84 @@
+import { mapGetters } from 'vuex'
+
+import ConfirmModal from './confirm_modal.vue'
+import Select from 'src/components/select/select.vue'
+
+export default {
+  props: ['type', 'user', 'status'],
+  emits: ['hide', 'show', 'muted'],
+  data: () => ({
+    showing: false
+  }),
+  components: {
+    ConfirmModal,
+    Select
+  },
+  computed: {
+    domain () {
+      return this.user.fqn.split('@')[1]
+    },
+    keypath () {
+      if (this.type === 'domain') {
+        return 'status.mute_domain_confirm'
+      } else if (this.type === 'conversation') {
+        return 'status.mute_conversation_confirm'
+      }
+    },
+    conversationIsMuted () {
+      return this.status.conversation_muted
+    },
+    domainIsMuted () {
+      return new Set(this.$store.state.users.currentUser.domainMutes).has(this.domain)
+    },
+    shouldConfirm () {
+      switch (this.type) {
+        case 'domain': {
+          return this.mergedConfig.modalOnMuteDomain
+        }
+        default: { // conversation
+          return this.mergedConfig.modalOnMuteConversation
+        }
+      }
+    },
+    ...mapGetters(['mergedConfig'])
+  },
+  methods: {
+    optionallyPrompt () {
+      if (this.shouldConfirm) {
+        this.show()
+      } else {
+        this.doMute()
+      }
+    },
+    show () {
+      this.showing = true
+      this.$emit('show')
+    },
+    hide () {
+      this.showing = false
+      this.$emit('hide')
+    },
+    doMute () {
+      switch (this.type) {
+        case 'domain': {
+          if (!this.domainIsMuted) {
+            this.$store.dispatch('muteDomain', { id: this.domain })
+          } else {
+            this.$store.dispatch('unmuteDomain', { id: this.domain })
+          }
+          break
+        }
+        case 'conversation': {
+          if (!this.conversationIsMuted) {
+            this.$store.dispatch('muteConversation', { id: this.status.id })
+          } else {
+            this.$store.dispatch('unmuteConversation', { id: this.status.id })
+          }
+          break
+        }
+      }
+      this.$emit('muted')
+      this.hide()
+    }
+  }
+}
diff --git a/src/components/confirm_modal/mute_confirm.vue b/src/components/confirm_modal/mute_confirm.vue
new file mode 100644
index 000000000..7c754b006
--- /dev/null
+++ b/src/components/confirm_modal/mute_confirm.vue
@@ -0,0 +1,31 @@
+<template>
+  <confirm-modal
+    v-if="showing"
+    :title="$t('user_card.mute_confirm_title')"
+    :confirm-text="$t('user_card.mute_confirm_accept_button')"
+    :cancel-text="$t('user_card.mute_confirm_cancel_button')"
+    @accepted="doMute"
+    @cancelled="hide"
+  >
+    <i18n-t
+      :keypath="keypath"
+      tag="div"
+    >
+      <template #domain>
+        <span v-text="domain" />
+      </template>
+      <template #user>
+        <span v-text="user.screen_name_ui" />
+      </template>
+    </i18n-t>
+  </confirm-modal>
+</template>
+
+<script src="./mute_confirm.js" />
+
+<style lang="scss">
+.expiry-amount {
+  width: 4em;
+  text-align: right;
+}
+</style>
diff --git a/src/components/contrast_ratio/contrast_ratio.vue b/src/components/contrast_ratio/contrast_ratio.vue
index bbd6fd4a5..93799e4c2 100644
--- a/src/components/contrast_ratio/contrast_ratio.vue
+++ b/src/components/contrast_ratio/contrast_ratio.vue
@@ -3,39 +3,62 @@
     v-if="contrast"
     class="contrast-ratio"
   >
-    <span
-      :title="hint"
+    <span v-if="showRatio">
+      {{ contrast.text }}
+    </span>
+    <Tooltip
+      :text="hint"
       class="rating"
     >
       <span v-if="contrast.aaa">
-        <FAIcon icon="thumbs-up" />
+        <FAIcon
+          icon="thumbs-up"
+          :size="showRatio ? 'lg' : ''"
+        />
       </span>
       <span v-if="!contrast.aaa && contrast.aa">
-        <FAIcon icon="adjust" />
+        <FAIcon
+          icon="adjust"
+          :size="showRatio ? 'lg' : ''"
+        />
       </span>
       <span v-if="!contrast.aaa && !contrast.aa">
-        <FAIcon icon="exclamation-triangle" />
+        <FAIcon
+          icon="exclamation-triangle"
+          :size="showRatio ? 'lg' : ''"
+        />
       </span>
-    </span>
-    <span
+    </Tooltip>
+    <Tooltip
       v-if="contrast && large"
+      :text="hint_18pt"
       class="rating"
-      :title="hint_18pt"
     >
       <span v-if="contrast.laaa">
-        <FAIcon icon="thumbs-up" />
+        <FAIcon
+          icon="thumbs-up"
+          :size="showRatio ? 'large' : ''"
+        />
       </span>
       <span v-if="!contrast.laaa && contrast.laa">
-        <FAIcon icon="adjust" />
+        <FAIcon
+          icon="adjust"
+          :size="showRatio ? 'lg' : ''"
+        />
       </span>
       <span v-if="!contrast.laaa && !contrast.laa">
-        <FAIcon icon="exclamation-triangle" />
+        <FAIcon
+          icon="exclamation-triangle"
+          :size="showRatio ? 'lg' : ''"
+        />
       </span>
-    </span>
+    </Tooltip>
   </span>
 </template>
 
 <script>
+import Tooltip from 'src/components/tooltip/tooltip.vue'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faAdjust,
@@ -50,6 +73,9 @@ library.add(
 )
 
 export default {
+  components: {
+    Tooltip
+  },
   props: {
     large: {
       required: false,
@@ -62,6 +88,11 @@ export default {
       required: false,
       type: Object,
       default: () => ({})
+    },
+    showRatio: {
+      required: false,
+      type: Boolean,
+      default: false
     }
   },
   computed: {
@@ -87,8 +118,7 @@ export default {
 .contrast-ratio {
   display: flex;
   justify-content: flex-end;
-  margin-top: -4px;
-  margin-bottom: 5px;
+  align-items: baseline;
 
   .label {
     margin-right: 1em;
@@ -96,7 +126,6 @@ export default {
 
   .rating {
     display: inline-block;
-    text-align: center;
     margin-left: 0.5em;
   }
 }
diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index a94d2130d..491a8543f 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -3,8 +3,10 @@ import Status from '../status/status.vue'
 import ThreadTree from '../thread_tree/thread_tree.vue'
 import { WSConnectionStatus } from '../../services/api/api.service.js'
 import { mapGetters, mapState } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
 import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
+import { useInterfaceStore } from 'src/stores/interface'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -112,7 +114,7 @@ const conversation = {
     suspendable () {
       if (this.isTreeView) {
         return Object.entries(this.statusContentProperties)
-          .every(([k, prop]) => !prop.replying && prop.mediaPlaying.length === 0)
+          .every(([, prop]) => !prop.replying && prop.mediaPlaying.length === 0)
       }
       if (this.$refs.statusComponent && this.$refs.statusComponent[0]) {
         return this.$refs.statusComponent.every(s => s.suspendable)
@@ -270,11 +272,8 @@ const conversation = {
     },
     replies () {
       let i = 1
-      // eslint-disable-next-line camelcase
-      return reduce(this.conversation, (result, { id, in_reply_to_status_id }) => {
-        /* eslint-disable camelcase */
-        const irid = in_reply_to_status_id
-        /* eslint-enable camelcase */
+
+      return reduce(this.conversation, (result, { id, in_reply_to_status_id: irid }) => {
         if (irid) {
           result[irid] = result[irid] || []
           result[irid].push({
@@ -340,17 +339,15 @@ const conversation = {
     canDive () {
       return this.isTreeView && this.isExpanded
     },
-    focused () {
-      return (id) => {
-        return (this.isExpanded) && id === this.highlight
-      }
-    },
     maybeHighlight () {
       return this.isExpanded ? this.highlight : null
     },
     ...mapGetters(['mergedConfig']),
     ...mapState({
       mastoUserSocketStatus: state => state.api.mastoUserSocketStatus
+    }),
+    ...mapPiniaState(useInterfaceStore, {
+      mobileLayout: store => store.layoutType === 'mobile'
     })
   },
   components: {
@@ -376,7 +373,7 @@ const conversation = {
         this.resetDisplayState()
       }
     },
-    virtualHidden (value) {
+    virtualHidden () {
       this.$store.dispatch(
         'setVirtualHeight',
         { statusId: this.statusId, height: `${this.$el.clientHeight}px` }
@@ -404,6 +401,9 @@ const conversation = {
           })
       }
     },
+    isFocused (id) {
+      return (this.isExpanded) && id === this.highlight
+    },
     getReplies (id) {
       return this.replies[id] || []
     },
@@ -472,7 +472,7 @@ const conversation = {
       // nothing found, fall back to toplevel
       return this.topLevel[0] ? this.topLevel[0].id : undefined
     },
-    diveIntoStatus (id, preventScroll) {
+    diveIntoStatus (id) {
       this.tryScrollTo(id)
     },
     diveToTopLevel () {
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 526de5c30..2f3de3a86 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -9,7 +9,9 @@
       v-if="isExpanded"
       class="panel-heading conversation-heading -sticky"
     >
-      <span class="title"> {{ $t('timeline.conversation') }} </span>
+      <h1 class="title">
+        {{ $t('timeline.conversation') }}
+      </h1>
       <button
         v-if="collapsable"
         class="button-unstyled -link"
@@ -18,7 +20,7 @@
         {{ $t('timeline.collapse') }}
       </button>
       <QuickFilterSettings
-        v-if="!collapsable"
+        v-if="!collapsable && mobileLayout"
         :conversation="true"
         class="rightside-button"
       />
@@ -71,7 +73,7 @@
             </template>
             <template #text>
               <span>
-                {{ $tc('status.show_all_conversation', otherTopLevelCount, { numStatus: otherTopLevelCount }) }}
+                {{ $t('status.show_all_conversation', { numStatus: otherTopLevelCount }, otherTopLevelCount) }}
               </span>
             </template>
           </i18n-t>
@@ -92,7 +94,7 @@
               :statusoid="status"
               :expandable="!isExpanded"
               :show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
-              :focused="focused(status.id)"
+              :focused="isFocused(status.id)"
               :in-conversation="isExpanded"
               :highlight="getHighlight()"
               :replies="getReplies(status.id)"
@@ -121,7 +123,7 @@
               :controlled-set-media-playing="(newVal) => toggleStatusContentProperty(status.id, 'mediaPlaying', newVal)"
 
               @goto="setHighlight"
-              @toggleExpanded="toggleExpanded"
+              @toggle-expanded="toggleExpanded"
             />
             <div
               v-if="showOtherRepliesButtonBelowStatus && getReplies(status.id).length > 1"
@@ -144,7 +146,7 @@
                   </template>
                   <template #text>
                     <span>
-                      {{ $tc('status.ancestor_follow', getReplies(status.id).length - 1, { numReplies: getReplies(status.id).length - 1 }) }}
+                      {{ $t('status.ancestor_follow', { numReplies: getReplies(status.id, getReplies(status.id).length - 1).length - 1 }) }}
                     </span>
                   </template>
                 </i18n-t>
@@ -166,7 +168,7 @@
           :pinned-status-ids-object="pinnedStatusIdsObject"
           :profile-user-id="profileUserId"
 
-          :focused="focused"
+          :is-focused-function="isFocused"
           :get-replies="getReplies"
           :highlight="maybeHighlight"
           :set-highlight="setHighlight"
@@ -197,7 +199,7 @@
             :statusoid="status"
             :expandable="!isExpanded"
             :show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
-            :focused="focused(status.id)"
+            :focused="isFocused(status.id)"
             :in-conversation="isExpanded"
             :highlight="getHighlight()"
             :replies="getReplies(status.id)"
@@ -215,7 +217,7 @@
             :toggle-status-content-property="toggleStatusContentProperty"
 
             @goto="setHighlight"
-            @toggleExpanded="toggleExpanded"
+            @toggle-expanded="toggleExpanded"
           />
         </article>
       </div>
@@ -320,10 +322,7 @@
       content: "";
       display: block;
       position: absolute;
-      top: calc(var(--___margin) * -1);
-      bottom: calc(var(--___margin) * -1);
-      left: calc(var(--___margin) * -1);
-      right: calc(var(--___margin) * -1);
+      inset: calc(var(--___margin) * -1);
       background: var(--background);
       backdrop-filter: var(--__panel-backdrop-filter);
     }
diff --git a/src/components/desktop_nav/desktop_nav.js b/src/components/desktop_nav/desktop_nav.js
index f6a2e2947..98d408a7e 100644
--- a/src/components/desktop_nav/desktop_nav.js
+++ b/src/components/desktop_nav/desktop_nav.js
@@ -14,6 +14,7 @@ import {
   faCog,
   faInfoCircle
 } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faSignInAlt,
@@ -107,10 +108,10 @@ export default {
       this.searchBarHidden = hidden
     },
     openSettingsModal () {
-      this.$store.dispatch('openSettingsModal', 'user')
+      useInterfaceStore().openSettingsModal('user')
     },
     openAdminModal () {
-      this.$store.dispatch('openSettingsModal', 'admin')
+      useInterfaceStore().openSettingsModal('admin')
     }
   }
 }
diff --git a/src/components/desktop_nav/desktop_nav.scss b/src/components/desktop_nav/desktop_nav.scss
index 61d2541ca..35a57d9fe 100644
--- a/src/components/desktop_nav/desktop_nav.scss
+++ b/src/components/desktop_nav/desktop_nav.scss
@@ -6,10 +6,6 @@
     color: var(--inputTopbarText, var(--inputText));
   }
 
-  a {
-    color: var(--link);
-  }
-
   .inner-nav {
     display: grid;
     grid-template-rows: var(--navbar-height);
@@ -63,7 +59,7 @@
     transition-timing-function: ease-out;
     transition-duration: 100ms;
 
-    @media all and (min-width: 800px) {
+    @media all and (width >= 800px) {
       /* stylelint-disable-next-line declaration-no-important */
       opacity: 1 !important;
     }
@@ -74,10 +70,7 @@
       mask-size: contain;
       background-color: var(--text);
       position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
+      inset: 0;
     }
 
     img {
@@ -91,10 +84,6 @@
     width: 2em;
     height: 100%;
     text-align: center;
-
-    .svg-inline--fa {
-      color: var(--link);
-    }
   }
 
   .sitename {
diff --git a/src/components/dialog_modal/dialog_modal.js b/src/components/dialog_modal/dialog_modal.js
index f14e3fe9a..b39851fe7 100644
--- a/src/components/dialog_modal/dialog_modal.js
+++ b/src/components/dialog_modal/dialog_modal.js
@@ -8,6 +8,11 @@ const DialogModal = {
       default: () => {},
       type: Function
     }
+  },
+  computed: {
+    mobileCenter () {
+      return this.$store.getters.mergedConfig.modalMobileCenter
+    }
   }
 }
 
diff --git a/src/components/dialog_modal/dialog_modal.vue b/src/components/dialog_modal/dialog_modal.vue
index 3bceff229..2b9c7a5d8 100644
--- a/src/components/dialog_modal/dialog_modal.vue
+++ b/src/components/dialog_modal/dialog_modal.vue
@@ -1,6 +1,7 @@
 <template>
   <span
-    :class="{ 'dark-overlay': darkOverlay }"
+    class="dialog-container"
+    :class="{ 'dark-overlay': darkOverlay, '-center-mobile': mobileCenter }"
     @click.self.stop="onCancel()"
   >
     <div
@@ -8,9 +9,9 @@
       @click.stop=""
     >
       <div class="panel-heading dialog-modal-heading">
-        <div class="title">
+        <h1 class="title">
           <slot name="header" />
-        </div>
+        </h1>
       </div>
       <div class="panel-body dialog-modal-content">
         <slot name="default" />
@@ -28,27 +29,27 @@
 // TODO: unify with other modals.
 .dark-overlay {
   &::before {
-    bottom: 0;
+    inset: 0;
     content: " ";
     display: block;
     cursor: default;
-    left: 0;
     position: fixed;
-    right: 0;
-    top: 0;
     background: rgb(27 31 35 / 50%);
     z-index: 2000;
   }
 }
 
-.dialog-modal.panel {
-  top: 0;
-  left: 50%;
-  max-height: 80vh;
-  max-width: 90vw;
-  margin: 15vh auto;
+.dialog-container {
+  display: grid;
   position: fixed;
-  transform: translateX(-50%);
+  inset: 0;
+  justify-content: center;
+  place-items: center center;
+  overflow: auto;
+}
+
+.dialog-modal.panel {
+  max-width: 90vw;
   z-index: 2001;
   cursor: default;
   display: block;
@@ -63,18 +64,54 @@
     margin: 0;
     padding: 1rem;
     white-space: normal;
+    text-align: center;
   }
 
   .dialog-modal-footer {
     margin: 0;
     padding: 0.5em;
     border-top: 1px solid var(--border);
-    display: flex;
-    justify-content: flex-end;
+    display: grid;
+    justify-content: end;
+    grid-gap: 0.5em;
+    grid-template-columns: min-content;
+    grid-auto-columns: min-content;
+    grid-auto-flow: column dense;
+    height: auto;
 
     button {
       width: auto;
-      margin-left: 0.5rem;
+      white-space: nowrap;
+      padding-left: 2em;
+      padding-right: 2em;
+    }
+  }
+}
+
+#modal.-mobile {
+  .dialog-container {
+    justify-content: stretch;
+    place-items: end stretch;
+
+    &.-center-mobile {
+      align-items: center;
+    }
+  }
+
+  .dialog-modal.panel {
+    min-width: 100vw;
+  }
+
+  .dialog-modal-footer {
+    flex-direction: column;
+    justify-content: flex-end;
+    grid-template-columns: 1fr;
+    grid-auto-rows: auto;
+    grid-auto-flow: row dense;
+
+    button {
+      grid-column: 1;
+      height: 3em;
     }
   }
 }
diff --git a/src/components/draft/draft.js b/src/components/draft/draft.js
new file mode 100644
index 000000000..55ee11a15
--- /dev/null
+++ b/src/components/draft/draft.js
@@ -0,0 +1,104 @@
+import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
+import EditStatusForm from 'src/components/edit_status_form/edit_status_form.vue'
+import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
+import StatusContent from 'src/components/status_content/status_content.vue'
+import Gallery from 'src/components/gallery/gallery.vue'
+import { cloneDeep } from 'lodash'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faPollH
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faPollH
+)
+
+const Draft = {
+  components: {
+    PostStatusForm,
+    EditStatusForm,
+    ConfirmModal,
+    StatusContent,
+    Gallery
+  },
+  props: {
+    draft: {
+      type: Object,
+      required: true
+    }
+  },
+  data () {
+    return {
+      referenceDraft: cloneDeep(this.draft),
+      editing: false,
+      showingConfirmDialog: false
+    }
+  },
+  computed: {
+    relAttrs () {
+      if (this.draft.type === 'edit') {
+        return { statusId: this.draft.refId }
+      } else if (this.draft.type === 'reply') {
+        return { replyTo: this.draft.refId }
+      } else {
+        return {}
+      }
+    },
+    safeToSave () {
+      return this.draft.status ||
+        this.draft.files?.length ||
+        this.draft.hasPoll
+    },
+    postStatusFormProps () {
+      return {
+        draftId: this.draft.id,
+        ...this.relAttrs
+      }
+    },
+    refStatus () {
+      return this.draft.refId ? this.$store.state.statuses.allStatusesObject[this.draft.refId] : undefined
+    },
+    localCollapseSubjectDefault () {
+      return this.$store.getters.mergedConfig.collapseMessageWithSubject
+    },
+    nsfwClickthrough () {
+      if (!this.draft.nsfw) {
+        return false
+      }
+      if (this.draft.summary && this.localCollapseSubjectDefault) {
+        return false
+      }
+      return true
+    }
+  },
+  watch: {
+    editing (newVal) {
+      if (newVal) return
+      if (this.safeToSave) {
+        this.$store.dispatch('addOrSaveDraft', { draft: this.draft })
+      } else {
+        this.$store.dispatch('addOrSaveDraft', { draft: this.referenceDraft })
+      }
+    }
+  },
+  methods: {
+    toggleEditing () {
+      this.editing = !this.editing
+    },
+    abandon () {
+      this.showingConfirmDialog = true
+    },
+    doAbandon () {
+      this.$store.dispatch('abandonDraft', { id: this.draft.id })
+        .then(() => {
+          this.hideConfirmDialog()
+        })
+    },
+    hideConfirmDialog () {
+      this.showingConfirmDialog = false
+    }
+  }
+}
+
+export default Draft
diff --git a/src/components/draft/draft.vue b/src/components/draft/draft.vue
new file mode 100644
index 000000000..433ebae31
--- /dev/null
+++ b/src/components/draft/draft.vue
@@ -0,0 +1,168 @@
+<template>
+  <article class="Draft">
+    <div
+      v-if="!editing"
+      class="status-content"
+    >
+      <div>
+        <i18n-t
+          v-if="draft.type === 'reply' || draft.type === 'edit'"
+          tag="span"
+          :keypath="draft.type === 'reply' ? 'drafts.replying' : 'drafts.editing'"
+        >
+          <template #statusLink>
+            <router-link
+              class="faint-link"
+              :to="{ name: 'conversation', params: { id: draft.refId } }"
+            >
+              {{ refStatus ? refStatus.external_url : $t('drafts.unavailable') }}
+            </router-link>
+          </template>
+        </i18n-t>
+        <StatusContent
+          v-if="draft.refId && refStatus"
+          class="status-content"
+          :status="refStatus"
+          :compact="true"
+        />
+      </div>
+      <div class="status-preview">
+        <span class="status_content">
+          <p v-if="draft.spoilerText">
+            <i>
+              {{ draft.spoilerText }}:
+            </i>
+          </p>
+          <p v-if="draft.status">{{ draft.status }}</p>
+          <p
+            v-else
+            class="faint"
+          >{{ $t('drafts.empty') }}</p>
+        </span>
+        <gallery
+          v-if="draft.files?.length !== 0"
+          class="attachments media-body"
+          :compact="true"
+          :nsfw="nsfwClickthrough"
+          :attachments="draft.files"
+          :limit="1"
+          size="small"
+          @play="$emit('mediaplay', attachment.id)"
+          @pause="$emit('mediapause', attachment.id)"
+        />
+        <div
+          v-if="draft.poll.options"
+          class="poll-indicator-container"
+          :title="$t('drafts.poll_tooltip')"
+        >
+          <div class="poll-indicator">
+            <FAIcon
+              icon="poll-h"
+              size="3x"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div v-if="editing">
+      <PostStatusForm
+        v-if="draft.type !== 'edit'"
+        :hide-draft="true"
+        v-bind="postStatusFormProps"
+      />
+      <EditStatusForm
+        v-else
+        :hide-draft="true"
+        :params="postStatusFormProps"
+      />
+    </div>
+    <teleport to="#modal">
+      <confirm-modal
+        v-if="showingConfirmDialog"
+        :title="$t('drafts.abandon_confirm_title')"
+        :confirm-text="$t('drafts.abandon_confirm_accept_button')"
+        :cancel-text="$t('drafts.abandon_confirm_cancel_button')"
+        @accepted="doAbandon"
+        @cancelled="hideConfirmDialog"
+      >
+        {{ $t('drafts.abandon_confirm') }}
+      </confirm-modal>
+    </teleport>
+    <div class="actions">
+      <button
+        class="btn button-default"
+        :aria-expanded="editing"
+        @click.prevent.stop="toggleEditing"
+      >
+        {{ editing ? $t('drafts.save') : $t('drafts.continue') }}
+      </button>
+      <button
+        class="btn button-default"
+        @click.prevent.stop="abandon"
+      >
+        {{ $t('drafts.abandon') }}
+      </button>
+    </div>
+  </article>
+</template>
+
+<script src="./draft.js"></script>
+
+<style lang="scss">
+.Draft {
+  position: relative;
+
+  .status-content {
+    padding: 0.5em;
+    margin: 0.5em 0;
+  }
+
+  .status-preview {
+    display: grid;
+    grid-template-columns: 1fr;
+    grid-auto-columns: 10em;
+    grid-auto-flow: column;
+    grid-gap: 0.5em;
+    align-items: start;
+    max-width: 100%;
+
+    p {
+      white-space: normal;
+      overflow-x: hidden;
+    }
+
+    .poll-indicator-container {
+      border-radius: var(--roundness);
+      display: grid;
+      place-items: center center;
+      align-self: start;
+      height: 0;
+      padding-bottom: 62.5%;
+      position: relative;
+    }
+
+    .poll-indicator {
+      box-sizing: border-box;
+      border: 1px solid var(--border);
+      position: absolute;
+      inset: 0;
+      display: grid;
+      place-items: center center;
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .actions {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-evenly;
+
+    .btn {
+      flex: 1;
+      margin-left: 1em;
+      margin-right: 1em;
+    }
+  }
+}
+</style>
diff --git a/src/components/draft_closer/draft_closer.js b/src/components/draft_closer/draft_closer.js
new file mode 100644
index 000000000..e50ea05ab
--- /dev/null
+++ b/src/components/draft_closer/draft_closer.js
@@ -0,0 +1,52 @@
+import DialogModal from 'src/components/dialog_modal/dialog_modal.vue'
+
+const DraftCloser = {
+  data () {
+    return {
+      showing: false
+    }
+  },
+  components: {
+    DialogModal
+  },
+  emits: [
+    'save',
+    'discard'
+  ],
+  computed: {
+    action () {
+      if (this.$store.getters.mergedConfig.autoSaveDraft) {
+        return 'save'
+      } else {
+        return this.$store.getters.mergedConfig.unsavedPostAction
+      }
+    },
+    shouldConfirm () {
+      return this.action === 'confirm'
+    }
+  },
+  methods: {
+    requestClose () {
+      if (this.shouldConfirm) {
+        this.showing = true
+      } else if (this.action === 'save') {
+        this.save()
+      } else {
+        this.discard()
+      }
+    },
+    save () {
+      this.$emit('save')
+      this.showing = false
+    },
+    discard () {
+      this.$emit('discard')
+      this.showing = false
+    },
+    cancel () {
+      this.showing = false
+    }
+  }
+}
+
+export default DraftCloser
diff --git a/src/components/draft_closer/draft_closer.vue b/src/components/draft_closer/draft_closer.vue
new file mode 100644
index 000000000..1afb1f44d
--- /dev/null
+++ b/src/components/draft_closer/draft_closer.vue
@@ -0,0 +1,43 @@
+<template>
+  <teleport to="#modal">
+    <dialog-modal
+      v-if="showing"
+      v-body-scroll-lock="true"
+      class="confirm-modal"
+      :on-cancel="cancel"
+    >
+      <template #header>
+        <span>
+          {{ $t('post_status.close_confirm_title') }}
+        </span>
+      </template>
+
+      {{ $t('post_status.close_confirm') }}
+
+      <template #footer>
+        <button
+          class="btn button-default"
+          @click.prevent="save"
+        >
+          {{ $t('post_status.close_confirm_save_button') }}
+        </button>
+
+        <button
+          class="btn button-default"
+          @click.prevent="discard"
+        >
+          {{ $t('post_status.close_confirm_discard_button') }}
+        </button>
+
+        <button
+          class="btn button-default"
+          @click.prevent="cancel"
+        >
+          {{ $t('post_status.close_confirm_continue_composing_button') }}
+        </button>
+      </template>
+    </dialog-modal>
+  </teleport>
+</template>
+
+<script src="./draft_closer.js"></script>
diff --git a/src/components/drafts/drafts.js b/src/components/drafts/drafts.js
new file mode 100644
index 000000000..201417f66
--- /dev/null
+++ b/src/components/drafts/drafts.js
@@ -0,0 +1,16 @@
+import Draft from 'src/components/draft/draft.vue'
+import List from 'src/components/list/list.vue'
+
+const Drafts = {
+  components: {
+    Draft,
+    List
+  },
+  computed: {
+    drafts () {
+      return this.$store.getters.draftsArray
+    }
+  }
+}
+
+export default Drafts
diff --git a/src/components/drafts/drafts.vue b/src/components/drafts/drafts.vue
new file mode 100644
index 000000000..1cce255da
--- /dev/null
+++ b/src/components/drafts/drafts.vue
@@ -0,0 +1,48 @@
+<template>
+  <div class="Drafts">
+    <div class="panel panel-default">
+      <div class="panel-heading -sticky">
+        <div class="title">
+          {{ $t('drafts.drafts') }}
+        </div>
+      </div>
+      <div class="panel-body">
+        <div
+          v-if="drafts.length === 0"
+          class="empty-drafs-list-alert"
+        >
+          {{ $t('drafts.no_drafts') }}
+        </div>
+        <List
+          v-else
+          :items="drafts"
+          :non-interactive="true"
+        >
+          <template #item="{ item: draft }">
+            <Draft
+              class="draft"
+              :draft="draft"
+            />
+          </template>
+        </List>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script src="./drafts.js"></script>
+
+<style lang="scss">
+.draft {
+  margin: 1em 0;
+}
+
+.empty-drafs-list-alert {
+  padding: 3em;
+  font-size: 1.2em;
+  display: flex;
+  justify-content: center;
+  color: var(--textFaint);
+}
+
+</style>
diff --git a/src/components/edit_status_form/edit_status_form.js b/src/components/edit_status_form/edit_status_form.js
new file mode 100644
index 000000000..323763370
--- /dev/null
+++ b/src/components/edit_status_form/edit_status_form.js
@@ -0,0 +1,44 @@
+import PostStatusForm from '../post_status_form/post_status_form.vue'
+import statusPosterService from '../../services/status_poster/status_poster.service.js'
+
+const EditStatusForm = {
+  components: {
+    PostStatusForm
+  },
+  props: {
+    params: {
+      type: Object,
+      required: true
+    }
+  },
+  methods: {
+    requestClose () {
+      this.$refs.postStatusForm.requestClose()
+    },
+    doEditStatus ({ status, spoilerText, sensitive, media, contentType, poll }) {
+      const params = {
+        store: this.$store,
+        statusId: this.params.statusId,
+        status,
+        spoilerText,
+        sensitive,
+        poll,
+        media,
+        contentType
+      }
+
+      return statusPosterService.editStatus(params)
+        .then((data) => {
+          return data
+        })
+        .catch((err) => {
+          console.error('Error editing status', err)
+          return {
+            error: err.message
+          }
+        })
+    }
+  }
+}
+
+export default EditStatusForm
diff --git a/src/components/edit_status_form/edit_status_form.vue b/src/components/edit_status_form/edit_status_form.vue
new file mode 100644
index 000000000..0a7ec760a
--- /dev/null
+++ b/src/components/edit_status_form/edit_status_form.vue
@@ -0,0 +1,11 @@
+<template>
+  <PostStatusForm
+    ref="postStatusForm"
+    v-bind="params"
+    :post-handler="doEditStatus"
+    :disable-polls="true"
+    :disable-visibility-selector="true"
+  />
+</template>
+
+<script src="./edit_status_form.js"></script>
diff --git a/src/components/edit_status_modal/edit_status_modal.js b/src/components/edit_status_modal/edit_status_modal.js
index 75adfea75..4c10c21a0 100644
--- a/src/components/edit_status_modal/edit_status_modal.js
+++ b/src/components/edit_status_modal/edit_status_modal.js
@@ -1,11 +1,11 @@
-import PostStatusForm from '../post_status_form/post_status_form.vue'
+import EditStatusForm from '../edit_status_form/edit_status_form.vue'
 import Modal from '../modal/modal.vue'
-import statusPosterService from '../../services/status_poster/status_poster.service.js'
 import get from 'lodash/get'
+import { useEditStatusStore } from 'src/stores/editStatus'
 
 const EditStatusModal = {
   components: {
-    PostStatusForm,
+    EditStatusForm,
     Modal
   },
   data () {
@@ -18,13 +18,13 @@ const EditStatusModal = {
       return !!this.$store.state.users.currentUser
     },
     modalActivated () {
-      return this.$store.state.editStatus.modalActivated
+      return useEditStatusStore().modalActivated
     },
     isFormVisible () {
       return this.isLoggedIn && !this.resettingForm && this.modalActivated
     },
     params () {
-      return this.$store.state.editStatus.params || {}
+      return useEditStatusStore().params || {}
     }
   },
   watch: {
@@ -43,31 +43,11 @@ const EditStatusModal = {
     }
   },
   methods: {
-    doEditStatus ({ status, spoilerText, sensitive, media, contentType, poll }) {
-      const params = {
-        store: this.$store,
-        statusId: this.$store.state.editStatus.params.statusId,
-        status,
-        spoilerText,
-        sensitive,
-        poll,
-        media,
-        contentType
-      }
-
-      return statusPosterService.editStatus(params)
-        .then((data) => {
-          return data
-        })
-        .catch((err) => {
-          console.error('Error editing status', err)
-          return {
-            error: err.message
-          }
-        })
-    },
     closeModal () {
-      this.$store.dispatch('closeEditStatusModal')
+      this.$refs.editStatusForm.requestClose()
+    },
+    doCloseModal () {
+      useEditStatusStore().closeEditStatusModal()
     }
   }
 }
diff --git a/src/components/edit_status_modal/edit_status_modal.vue b/src/components/edit_status_modal/edit_status_modal.vue
index db62972d6..3d192b1ee 100644
--- a/src/components/edit_status_modal/edit_status_modal.vue
+++ b/src/components/edit_status_modal/edit_status_modal.vue
@@ -2,19 +2,21 @@
   <Modal
     v-if="isFormVisible"
     class="edit-form-modal-view"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
   >
     <div class="edit-form-modal-panel panel">
       <div class="panel-heading">
-        {{ $t('post_status.edit_status') }}
+        <h1 class="title">
+          {{ $t('post_status.edit_status') }}
+        </h1>
       </div>
-      <PostStatusForm
+      <EditStatusForm
+        ref="editStatusForm"
         class="panel-body"
-        v-bind="params"
-        :post-handler="doEditStatus"
-        :disable-polls="true"
-        :disable-visibility-selector="true"
-        @posted="closeModal"
+        :params="params"
+        @posted="doCloseModal"
+        @draft-done="doCloseModal"
+        @can-close="doCloseModal"
       />
     </div>
   </Modal>
diff --git a/src/components/emoji_input/emoji_input.js b/src/components/emoji_input/emoji_input.js
index 9baf63f22..f6ba6e245 100644
--- a/src/components/emoji_input/emoji_input.js
+++ b/src/components/emoji_input/emoji_input.js
@@ -205,12 +205,6 @@ const EmojiInput = {
         return emoji.displayText
       }
     },
-    onInputScroll () {
-      this.$refs.hiddenOverlay.scrollTo({
-        top: this.input.scrollTop,
-        left: this.input.scrollLeft
-      })
-    },
     suggestionListId () {
       return `suggestions-${this.randomSeed}`
     },
@@ -239,7 +233,6 @@ const EmojiInput = {
     this.overlayStyle.fontSize = style.fontSize
     this.overlayStyle.wordWrap = style.wordWrap
     this.overlayStyle.whiteSpace = style.whiteSpace
-    this.resize()
     input.addEventListener('blur', this.onBlur)
     input.addEventListener('focus', this.onFocus)
     input.addEventListener('paste', this.onPaste)
@@ -265,7 +258,7 @@ const EmojiInput = {
     }
   },
   watch: {
-    showSuggestions: function (newValue, oldValue) {
+    showSuggestions: function (newValue) {
       this.$emit('shown', newValue)
       if (newValue) {
         this.$refs.suggestorPopover.showPopover()
@@ -293,12 +286,22 @@ const EmojiInput = {
         }))
       this.highlighted = this.defaultCandidateIndex
       this.$refs.screenReaderNotice.announce(
-        this.$tc('tool_tip.autocomplete_available',
-          this.suggestions.length,
-          { number: this.suggestions.length }))
+        this.$t(
+          'tool_tip.autocomplete_available',
+          { number: this.suggestions.length },
+          this.suggestions.length
+        )
+      )
     }
   },
   methods: {
+    onInputScroll (e) {
+      this.$refs.hiddenOverlay.scrollTo({
+        top: this.input.scrollTop,
+        left: this.input.scrollLeft
+      })
+      this.setCaret(e)
+    },
     triggerShowPicker () {
       this.$nextTick(() => {
         this.$refs.picker.showPicker()
@@ -558,8 +561,6 @@ const EmojiInput = {
         this.$refs.suggestorPopover.updateStyles()
       })
     },
-    resize () {
-    },
     autoCompleteItemLabel (suggestion) {
       if (suggestion.user) {
         return suggestion.displayText + ' ' + suggestion.detailText
diff --git a/src/components/emoji_input/emoji_input.vue b/src/components/emoji_input/emoji_input.vue
index 9bd5c8f4e..a1cba33bc 100644
--- a/src/components/emoji_input/emoji_input.vue
+++ b/src/components/emoji_input/emoji_input.vue
@@ -55,7 +55,7 @@
       ref="suggestorPopover"
       class="autocomplete-panel"
       placement="bottom"
-      :trigger-attrs="{ 'aria-hidden': true }"
+      :hide-trigger="true"
     >
       <template #content>
         <div
@@ -123,7 +123,7 @@
     margin: 0.2em 0.25em;
     font-size: 1.3em;
     cursor: pointer;
-    line-height: 24px;
+    line-height: 1.2em;
 
     &:hover i {
       color: var(--text);
@@ -133,7 +133,7 @@
   .emoji-picker-panel {
     position: absolute;
     z-index: 20;
-    margin-top: 2px;
+    margin-top: 0.2em;
 
     &.hide {
       display: none;
@@ -152,17 +152,14 @@
   }
 
   &.with-picker input {
-    padding-right: 30px;
+    padding-right: 2em;
   }
 
   .hidden-overlay {
     opacity: 0;
     pointer-events: none;
     position: absolute;
-    top: 0;
-    bottom: 0;
-    right: 0;
-    left: 0;
+    inset: 0;
     overflow: hidden;
 
     /* DEBUG STUFF */
@@ -218,8 +215,8 @@
       }
 
       .detailText {
-        font-size: 9px;
-        line-height: 9px;
+        font-size: 0.6em;
+        line-height: 0.6em;
       }
     }
   }
diff --git a/src/components/emoji_input/suggestor.js b/src/components/emoji_input/suggestor.js
index e746dcd76..f2daf2f46 100644
--- a/src/components/emoji_input/suggestor.js
+++ b/src/components/emoji_input/suggestor.js
@@ -116,7 +116,6 @@ export const suggestUsers = ({ dispatch, state }) => {
       const screenNameAlphabetically = a.screen_name > b.screen_name ? 1 : -1
 
       return diff + nameAlphabetically + screenNameAlphabetically
-      /* eslint-disable camelcase */
     }).map((user) => ({
       user,
       displayText: user.screen_name_ui,
@@ -124,7 +123,6 @@ export const suggestUsers = ({ dispatch, state }) => {
       imageUrl: user.profile_image_url_original,
       replacement: '@' + user.screen_name + ' '
     }))
-    /* eslint-enable camelcase */
 
     suggestions = newSuggestions || []
     return suggestions
diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js
index d3d6563ab..8e572d1d2 100644
--- a/src/components/emoji_picker/emoji_picker.js
+++ b/src/components/emoji_picker/emoji_picker.js
@@ -97,7 +97,7 @@ const EmojiPicker = {
     enableStickerPicker: {
       required: false,
       type: Boolean,
-      default: false
+      default: true
     },
     hideCustomEmoji: {
       required: false,
@@ -105,7 +105,11 @@ const EmojiPicker = {
       default: false
     }
   },
-  inject: ['popoversZLayer'],
+  inject: {
+    popoversZLayer: {
+      default: ''
+    }
+  },
   data () {
     return {
       keyword: '',
@@ -131,21 +135,35 @@ const EmojiPicker = {
     Popover
   },
   methods: {
+    groupScroll (e) {
+      e.currentTarget.scrollLeft += e.deltaY + e.deltaX
+    },
     updateEmojiSize () {
       const css = window.getComputedStyle(this.$refs.popover.$el)
-      const emojiSize = css.getPropertyValue('--emojiSize')
-      const emojiSizeUnit = emojiSize.replace(/[0-9,.]+/, '')
+      const fontSize = css.getPropertyValue('font-size') || '1rem'
+      const emojiSize = css.getPropertyValue('--emojiSize') || '2.2rem'
+
+      const fontSizeUnit = fontSize.replace(/[0-9,.]+/, '').trim()
+      const fontSizeValue = Number(fontSize.replace(/[^0-9,.]+/, ''))
+
+      const emojiSizeUnit = emojiSize.replace(/[0-9,.]+/, '').trim()
       const emojiSizeValue = Number(emojiSize.replace(/[^0-9,.]+/, ''))
-      const fontSize = css.getPropertyValue('font-size').replace(/[^0-9,.]+/, '')
+
+      let fontSizeMultiplier
+      if (fontSizeUnit.endsWith('em')) {
+        fontSizeMultiplier = fontSizeValue
+      } else {
+        fontSizeMultiplier = fontSizeValue / 14
+      }
 
       let emojiSizeReal
       if (emojiSizeUnit.endsWith('em')) {
-        emojiSizeReal = emojiSizeValue * fontSize
+        emojiSizeReal = emojiSizeValue * fontSizeMultiplier * 14
       } else {
         emojiSizeReal = emojiSizeValue
       }
 
-      const fullEmojiSize = emojiSizeReal + (2 * 0.2 * fontSize)
+      const fullEmojiSize = emojiSizeReal + (2 * 0.2 * fontSizeMultiplier * 14)
       this.emojiSize = fullEmojiSize
     },
     showPicker () {
@@ -334,7 +352,7 @@ const EmojiPicker = {
     },
     allEmojiGroups () {
       return Object.entries(this.allCustomGroups)
-        .map(([_, v]) => v)
+        .map(([, v]) => v)
         .concat(this.unicodeEmojiGroups)
     },
     stickerPickerEnabled () {
diff --git a/src/components/emoji_picker/emoji_picker.scss b/src/components/emoji_picker/emoji_picker.scss
index 12c09388f..e318cdb40 100644
--- a/src/components/emoji_picker/emoji_picker.scss
+++ b/src/components/emoji_picker/emoji_picker.scss
@@ -49,6 +49,7 @@
 
   .heading {
     display: flex;
+    flex-direction: column;
     padding: 0.7em 0.5em 0;
   }
 
@@ -63,8 +64,7 @@
     flex-grow: 1;
     display: flex;
     flex-flow: row nowrap;
-    overflow-x: auto;
-    overflow-y: hidden;
+    overflow: auto hidden;
   }
 
   .additional-tabs {
@@ -129,7 +129,7 @@
 
   .emoji {
     &-search {
-      padding: 0.3em;
+      padding-bottom: 0.5em;
       flex: 0 0 auto;
 
       input {
@@ -152,7 +152,15 @@
       transition: mask-size 150ms;
       mask-size: 100% 20px, 100% 20px, auto;
       // Autoprefixed seem to ignore this one, and also syntax is different
+      /* stylelint-disable mask-composite */
+      /* stylelint-disable declaration-property-value-no-unknown */
+      /* stylelint-disable scss/declaration-property-value-no-unknown */
+
+      /* TODO check if this is still needed */
       mask-composite: xor;
+      /* stylelint-enable declaration-property-value-no-unknown */
+      /* stylelint-enable scss/declaration-property-value-no-unknown */
+      /* stylelint-enable mask-composite */
       mask-composite: exclude;
 
       &.scrolled {
@@ -166,24 +174,6 @@
       }
     }
 
-    &-group {
-      display: flex;
-      align-items: center;
-      flex-wrap: wrap;
-      justify-content: left;
-
-      &-title {
-        font-size: 0.85em;
-        width: 100%;
-        margin: 0;
-        padding-left: 0.3em;
-
-        &.disabled {
-          display: none;
-        }
-      }
-    }
-
     &-item {
       width: var(--emoji-size);
       height: var(--emoji-size);
@@ -206,9 +196,37 @@
       }
 
       .emoji-picker-emoji.-unicode {
-        font-size: 1.6em;
+        font-size: calc(var(--emoji-size) * 0.8);
         overflow: hidden;
       }
     }
+
+    &-group {
+      display: grid;
+      grid-template-columns: repeat(var(--__amount), 1fr);
+      place-items: center center;
+      justify-content: center;
+      grid-template-rows: repeat(1, auto);
+
+      &.first-row {
+        grid-template-rows: repeat(2, auto);
+
+        .emoji-item {
+          grid-row: 2;
+        }
+      }
+
+      &-title {
+        font-size: 0.85em;
+        grid-column: span var(--__amount);
+        width: 100%;
+        margin: 0;
+        padding-left: 0.3em;
+
+        &.disabled {
+          display: none;
+        }
+      }
+    }
   }
 }
diff --git a/src/components/emoji_picker/emoji_picker.vue b/src/components/emoji_picker/emoji_picker.vue
index a3dc8f9ee..dae5ff871 100644
--- a/src/components/emoji_picker/emoji_picker.vue
+++ b/src/components/emoji_picker/emoji_picker.vue
@@ -3,12 +3,24 @@
     ref="popover"
     trigger="click"
     popover-class="emoji-picker popover-default"
-    :trigger-attrs="{ 'aria-hidden': true, tabindex: -1 }"
+    :hide-trigger="true"
     @show="onPopoverShown"
     @close="onPopoverClosed"
   >
     <template #content>
-      <div class="heading">
+      <div
+        class="heading"
+      >
+        <div class="emoji-search">
+          <input
+            ref="search"
+            v-model="keyword"
+            type="text"
+            class="input form-control"
+            :placeholder="$t('emoji.search_emoji')"
+            @input="$event.target.composing = false"
+          >
+        </div>
         <!--
           Body scroll lock needs to be on every scrollable element on safari iOS.
           Here we tell it to enable scrolling for this element.
@@ -18,6 +30,7 @@
           ref="header"
           v-body-scroll-lock="isInModal"
           class="emoji-tabs"
+          @wheel.prevent="groupScroll"
         >
           <span
             v-for="group in filteredEmojiGroups"
@@ -72,16 +85,6 @@
           class="emoji-content"
           :class="{hidden: showingStickers}"
         >
-          <div class="emoji-search">
-            <input
-              ref="search"
-              v-model="keyword"
-              type="text"
-              class="input form-control"
-              :placeholder="$t('emoji.search_emoji')"
-              @input="$event.target.composing = false"
-            >
-          </div>
           <!-- Enables scrolling for this element on safari iOS. See comments for header. -->
           <DynamicScroller
             ref="emoji-groups"
@@ -106,6 +109,8 @@
               >
                 <div
                   class="emoji-group"
+                  :class="{ ['first-row']: group.isFirstRow }"
+                  :style="{ '--__amount': itemPerRow }"
                 >
                   <h6
                     v-if="group.isFirstRow"
diff --git a/src/components/emoji_reactions/emoji_reactions.js b/src/components/emoji_reactions/emoji_reactions.js
index 4d5c6c5a3..f5e1b68f6 100644
--- a/src/components/emoji_reactions/emoji_reactions.js
+++ b/src/components/emoji_reactions/emoji_reactions.js
@@ -1,5 +1,6 @@
 import UserAvatar from '../user_avatar/user_avatar.vue'
 import UserListPopover from '../user_list_popover/user_list_popover.vue'
+import StillImage from 'src/components/still-image/still-image.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faPlus,
@@ -19,7 +20,8 @@ const EmojiReactions = {
   name: 'EmojiReactions',
   components: {
     UserAvatar,
-    UserListPopover
+    UserListPopover,
+    StillImage
   },
   props: ['status'],
   data: () => ({
@@ -69,7 +71,7 @@ const EmojiReactions = {
     unreact (emoji) {
       this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
     },
-    async emojiOnClick (emoji, event) {
+    async emojiOnClick (emoji) {
       if (!this.loggedIn) return
 
       await this.fetchEmojiReactionsByIfMissing()
@@ -82,12 +84,13 @@ const EmojiReactions = {
     counterTriggerAttrs (reaction) {
       return {
         class: [
-          'btn',
-          'button-default',
           'emoji-reaction-count-button',
-          { '-picked-reaction': this.reactedWith(reaction.name) }
+          {
+            '-picked-reaction': this.reactedWith(reaction.name),
+            toggled: this.reactedWith(reaction.name)
+          }
         ],
-        'aria-label': this.$tc('status.reaction_count_label', reaction.count, { num: reaction.count })
+        'aria-label': this.$t('status.reaction_count_label', { num: reaction.count }, reaction.count)
       }
     }
   }
diff --git a/src/components/emoji_reactions/emoji_reactions.scss b/src/components/emoji_reactions/emoji_reactions.scss
new file mode 100644
index 000000000..8ea45e1b4
--- /dev/null
+++ b/src/components/emoji_reactions/emoji_reactions.scss
@@ -0,0 +1,121 @@
+@use "../../mixins";
+
+.EmojiReactions {
+  display: flex;
+  margin-top: 0.25em;
+  flex-wrap: wrap;
+
+  --emoji-size: calc(var(--emojiSize, 1.25em) * var(--emojiReactionsScale, 1));
+
+  .emoji-reaction-container {
+    display: flex;
+    align-items: stretch;
+    margin-top: 0.5em;
+    margin-right: 0.5em;
+
+    .emoji-reaction-popover {
+      padding: 0;
+
+      .emoji-reaction-count-button {
+        margin: 0;
+        height: 100%;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+        box-sizing: border-box;
+        min-width: 2em;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+  }
+
+  .emoji-reaction {
+    padding-left: 0.5em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+    margin: 0;
+
+    .reaction-emoji {
+      width: var(--emoji-size);
+      height: var(--emoji-size);
+      margin-right: 0.25em;
+      line-height: var(--emoji-size);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      --_still_image-label-scale: 0.3;
+    }
+
+    .reaction-emoji-content {
+      max-width: 100%;
+      max-height: 100%;
+      width: var(--emoji-size);
+      height: var(--emoji-size);
+      line-height: inherit;
+      overflow: hidden;
+      font-size: calc(var(--emoji-size) * 0.8);
+      margin: 0;
+
+      img {
+        object-fit: contain;
+      }
+    }
+
+    &:focus {
+      outline: none;
+    }
+
+    .svg-inline--fa {
+      color: var(--text);
+    }
+
+    &.-picked-reaction {
+      .svg-inline--fa {
+        color: var(--accent);
+      }
+    }
+
+    @include mixins.unfocused-style {
+      .focus-marker {
+        visibility: hidden;
+      }
+
+      .active-marker {
+        visibility: visible;
+      }
+    }
+
+    @include mixins.focused-style {
+      .svg-inline--fa {
+        color: var(--accent);
+      }
+
+      .focus-marker {
+        visibility: visible;
+      }
+
+      .active-marker {
+        visibility: hidden;
+      }
+    }
+  }
+
+  .emoji-reaction-expand {
+    padding: 0 0.5em;
+    margin-right: 0.5em;
+    margin-top: 0.5em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+}
diff --git a/src/components/emoji_reactions/emoji_reactions.vue b/src/components/emoji_reactions/emoji_reactions.vue
index 3ab4c125e..e2361885a 100644
--- a/src/components/emoji_reactions/emoji_reactions.vue
+++ b/src/components/emoji_reactions/emoji_reactions.vue
@@ -10,7 +10,7 @@
         v-bind="!loggedIn ? { href: remoteInteractionLink } : {}"
         role="button"
         class="emoji-reaction btn button-default"
-        :class="{ '-picked-reaction': reactedWith(reaction.name) }"
+        :class="{ '-picked-reaction': reactedWith(reaction.name), toggled: reactedWith(reaction.name) }"
         :title="reaction.url ? reaction.name : undefined"
         :aria-pressed="reactedWith(reaction.name)"
         @click="emojiOnClick(reaction.name, $event)"
@@ -18,12 +18,11 @@
         <span
           class="reaction-emoji"
         >
-          <img
+          <StillImage
             v-if="reaction.url"
             :src="reaction.url"
             class="reaction-emoji-content"
-            width="1em"
-          >
+          />
           <span
             v-else
             class="reaction-emoji reaction-emoji-content"
@@ -53,6 +52,7 @@
       <UserListPopover
         :users="accountsForEmoji[reaction.name]"
         class="emoji-reaction-popover"
+        :normal-button="true"
         :trigger-attrs="counterTriggerAttrs(reaction)"
         @show="fetchEmojiReactionsByIfMissing()"
       >
@@ -71,129 +71,5 @@
 </template>
 
 <script src="./emoji_reactions.js"></script>
-<style lang="scss">
-@import "../../mixins";
 
-.EmojiReactions {
-  display: flex;
-  margin-top: 0.25em;
-  flex-wrap: wrap;
-
-  --emoji-size: calc(var(--emojiSize, 1.25em) * var(--emojiReactionsScale, 1));
-
-  .emoji-reaction-container {
-    display: flex;
-    align-items: stretch;
-    margin-top: 0.5em;
-    margin-right: 0.5em;
-
-    .emoji-reaction-popover {
-      padding: 0;
-
-      .emoji-reaction-count-button {
-        margin: 0;
-        height: 100%;
-        border-top-left-radius: 0;
-        border-bottom-left-radius: 0;
-        box-sizing: border-box;
-        min-width: 2em;
-        display: inline-flex;
-        justify-content: center;
-        align-items: center;
-
-        &.-picked-reaction {
-          border: 1px solid var(--accent);
-          margin-right: -1px;
-        }
-      }
-    }
-  }
-
-  .emoji-reaction {
-    padding-left: 0.5em;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-    margin: 0;
-
-    .reaction-emoji {
-      width: var(--emoji-size);
-      height: var(--emoji-size);
-      margin-right: 0.25em;
-      line-height: var(--emoji-size);
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-
-    .reaction-emoji-content {
-      max-width: 100%;
-      max-height: 100%;
-      width: auto;
-      height: auto;
-      line-height: inherit;
-      overflow: hidden;
-      font-size: calc(var(--emoji-size) * 0.8);
-      margin: 0;
-    }
-
-    &:focus {
-      outline: none;
-    }
-
-    .svg-inline--fa {
-      color: var(--text);
-    }
-
-    &.-picked-reaction {
-      border: 1px solid var(--accent);
-      margin-left: -1px; // offset the border, can't use inset shadows either
-      margin-right: -1px;
-
-      .svg-inline--fa {
-        color: var(--accent);
-      }
-    }
-
-    @include unfocused-style {
-      .focus-marker {
-        visibility: hidden;
-      }
-
-      .active-marker {
-        visibility: visible;
-      }
-    }
-
-    @include focused-style {
-      .svg-inline--fa {
-        color: var(--accent);
-      }
-
-      .focus-marker {
-        visibility: visible;
-      }
-
-      .active-marker {
-        visibility: hidden;
-      }
-    }
-  }
-
-  .emoji-reaction-expand {
-    padding: 0 0.5em;
-    margin-right: 0.5em;
-    margin-top: 0.5em;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    &:hover {
-      text-decoration: underline;
-    }
-  }
-}
-</style>
+<style src="./emoji_reactions.scss" lang="scss" />
diff --git a/src/components/exporter/exporter.vue b/src/components/exporter/exporter.vue
index 79defdf6f..e36d9dd62 100644
--- a/src/components/exporter/exporter.vue
+++ b/src/components/exporter/exporter.vue
@@ -23,6 +23,9 @@
 
 <style lang="scss">
 .exporter {
+  display: flex;
+  flex-direction: column;
+
   &-processing {
     margin: 0.25em;
   }
diff --git a/src/components/extra_buttons/extra_buttons.js b/src/components/extra_buttons/extra_buttons.js
deleted file mode 100644
index b3e1cb2bb..000000000
--- a/src/components/extra_buttons/extra_buttons.js
+++ /dev/null
@@ -1,175 +0,0 @@
-import Popover from '../popover/popover.vue'
-import genRandomSeed from '../../services/random_seed/random_seed.service.js'
-import ConfirmModal from '../confirm_modal/confirm_modal.vue'
-import StatusBookmarkFolderMenu from '../status_bookmark_folder_menu/status_bookmark_folder_menu.vue'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faEllipsisH,
-  faBookmark,
-  faEyeSlash,
-  faThumbtack,
-  faShareAlt,
-  faExternalLinkAlt,
-  faHistory,
-  faPlus,
-  faTimes
-} from '@fortawesome/free-solid-svg-icons'
-import {
-  faBookmark as faBookmarkReg,
-  faFlag
-} from '@fortawesome/free-regular-svg-icons'
-
-library.add(
-  faEllipsisH,
-  faBookmark,
-  faBookmarkReg,
-  faEyeSlash,
-  faThumbtack,
-  faShareAlt,
-  faExternalLinkAlt,
-  faFlag,
-  faHistory,
-  faPlus,
-  faTimes
-)
-
-const ExtraButtons = {
-  props: ['status'],
-  components: {
-    Popover,
-    ConfirmModal,
-    StatusBookmarkFolderMenu
-  },
-  data () {
-    return {
-      expanded: false,
-      showingDeleteDialog: false,
-      randomSeed: genRandomSeed()
-    }
-  },
-  methods: {
-    onShow () {
-      this.expanded = true
-    },
-    onClose () {
-      this.expanded = false
-    },
-    deleteStatus () {
-      if (this.shouldConfirmDelete) {
-        this.showDeleteStatusConfirmDialog()
-      } else {
-        this.doDeleteStatus()
-      }
-    },
-    doDeleteStatus () {
-      this.$store.dispatch('deleteStatus', { id: this.status.id })
-      this.hideDeleteStatusConfirmDialog()
-    },
-    showDeleteStatusConfirmDialog () {
-      this.showingDeleteDialog = true
-    },
-    hideDeleteStatusConfirmDialog () {
-      this.showingDeleteDialog = false
-    },
-    pinStatus () {
-      this.$store.dispatch('pinStatus', this.status.id)
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    unpinStatus () {
-      this.$store.dispatch('unpinStatus', this.status.id)
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    muteConversation () {
-      this.$store.dispatch('muteConversation', this.status.id)
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    unmuteConversation () {
-      this.$store.dispatch('unmuteConversation', this.status.id)
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    copyLink () {
-      navigator.clipboard.writeText(this.statusLink)
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    bookmarkStatus () {
-      this.$store.dispatch('bookmark', { id: this.status.id })
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    unbookmarkStatus () {
-      this.$store.dispatch('unbookmark', { id: this.status.id })
-        .then(() => this.$emit('onSuccess'))
-        .catch(err => this.$emit('onError', err.error.error))
-    },
-    reportStatus () {
-      this.$store.dispatch('openUserReportingModal', { userId: this.status.user.id, statusIds: [this.status.id] })
-    },
-    editStatus () {
-      this.$store.dispatch('fetchStatusSource', { id: this.status.id })
-        .then(data => this.$store.dispatch('openEditStatusModal', {
-          statusId: this.status.id,
-          subject: data.spoiler_text,
-          statusText: data.text,
-          statusIsSensitive: this.status.nsfw,
-          statusPoll: this.status.poll,
-          statusFiles: [...this.status.attachments],
-          visibility: this.status.visibility,
-          statusContentType: data.content_type
-        }))
-    },
-    showStatusHistory () {
-      const originalStatus = { ...this.status }
-      const stripFieldsList = ['attachments', 'created_at', 'emojis', 'text', 'raw_html', 'nsfw', 'poll', 'summary', 'summary_raw_html']
-      stripFieldsList.forEach(p => delete originalStatus[p])
-      this.$store.dispatch('openStatusHistoryModal', originalStatus)
-    }
-  },
-  computed: {
-    currentUser () { return this.$store.state.users.currentUser },
-    canDelete () {
-      if (!this.currentUser) { return }
-      return this.currentUser.privileges.includes('messages_delete') || this.status.user.id === this.currentUser.id
-    },
-    ownStatus () {
-      return this.status.user.id === this.currentUser.id
-    },
-    canPin () {
-      return this.ownStatus && (this.status.visibility === 'public' || this.status.visibility === 'unlisted')
-    },
-    canMute () {
-      return !!this.currentUser
-    },
-    canBookmark () {
-      return !!this.currentUser
-    },
-    bookmarkFolders () {
-      return this.$store.state.instance.pleromaBookmarkFoldersAvailable
-    },
-    statusLink () {
-      return `${this.$store.state.instance.server}${this.$router.resolve({ name: 'conversation', params: { id: this.status.id } }).href}`
-    },
-    isEdited () {
-      return this.status.edited_at !== null
-    },
-    editingAvailable () { return this.$store.state.instance.editingAvailable },
-    shouldConfirmDelete () {
-      return this.$store.getters.mergedConfig.modalOnDelete
-    },
-    triggerAttrs () {
-      return {
-        title: this.$t('status.more_actions'),
-        id: `popup-trigger-${this.randomSeed}`,
-        'aria-controls': `popup-menu-${this.randomSeed}`,
-        'aria-expanded': this.expanded,
-        'aria-haspopup': 'menu'
-      }
-    }
-  }
-}
-
-export default ExtraButtons
diff --git a/src/components/extra_buttons/extra_buttons.vue b/src/components/extra_buttons/extra_buttons.vue
deleted file mode 100644
index c030de0c8..000000000
--- a/src/components/extra_buttons/extra_buttons.vue
+++ /dev/null
@@ -1,238 +0,0 @@
-<template>
-  <Popover
-    class="ExtraButtons"
-    trigger="click"
-    :trigger-attrs="triggerAttrs"
-    placement="top"
-    :offset="{ y: 5 }"
-    :bound-to="{ x: 'container' }"
-    remove-padding
-    @show="onShow"
-    @close="onClose"
-  >
-    <template #content="{close}">
-      <div
-        :id="`popup-menu-${randomSeed}`"
-        class="dropdown-menu"
-        role="menu"
-      >
-        <button
-          v-if="canMute && !status.thread_muted"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="muteConversation"
-        >
-          <FAIcon
-            fixed-width
-            icon="eye-slash"
-          /><span>{{ $t("status.mute_conversation") }}</span>
-        </button>
-        <button
-          v-if="canMute && status.thread_muted"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="unmuteConversation"
-        >
-          <FAIcon
-            fixed-width
-            icon="eye-slash"
-          /><span>{{ $t("status.unmute_conversation") }}</span>
-        </button>
-        <button
-          v-if="!status.pinned && canPin"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="pinStatus"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            icon="thumbtack"
-          /><span>{{ $t("status.pin") }}</span>
-        </button>
-        <button
-          v-if="status.pinned && canPin"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="unpinStatus"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            icon="thumbtack"
-          /><span>{{ $t("status.unpin") }}</span>
-        </button>
-        <template v-if="canBookmark">
-          <button
-            v-if="!status.bookmarked"
-            class="menu-item dropdown-item dropdown-item-icon"
-            role="menuitem"
-            @click.prevent="bookmarkStatus"
-            @click="close"
-          >
-            <FAIcon
-              fixed-width
-              :icon="['far', 'bookmark']"
-            /><span>{{ $t("status.bookmark") }}</span>
-          </button>
-          <button
-            v-if="status.bookmarked"
-            class="menu-item dropdown-item dropdown-item-icon"
-            role="menuitem"
-            @click.prevent="unbookmarkStatus"
-            @click="close"
-          >
-            <FAIcon
-              fixed-width
-              icon="bookmark"
-            /><span>{{ $t("status.unbookmark") }}</span>
-          </button>
-          <StatusBookmarkFolderMenu
-            v-if="status.bookmarked && bookmarkFolders"
-            :status="status"
-          />
-        </template>
-        <button
-          v-if="ownStatus && editingAvailable"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="editStatus"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            icon="pen"
-          /><span>{{ $t("status.edit") }}</span>
-        </button>
-        <button
-          v-if="isEdited && editingAvailable"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="showStatusHistory"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            icon="history"
-          /><span>{{ $t("status.status_history") }}</span>
-        </button>
-        <button
-          v-if="canDelete"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="deleteStatus"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            icon="times"
-          /><span>{{ $t("status.delete") }}</span>
-        </button>
-        <button
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="copyLink"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            icon="share-alt"
-          /><span>{{ $t("status.copy_link") }}</span>
-        </button>
-        <a
-          v-if="!status.is_local"
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          title="Source"
-          :href="status.external_url"
-          target="_blank"
-        >
-          <FAIcon
-            fixed-width
-            icon="external-link-alt"
-          /><span>{{ $t("status.external_source") }}</span>
-        </a>
-        <button
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click.prevent="reportStatus"
-          @click="close"
-        >
-          <FAIcon
-            fixed-width
-            :icon="['far', 'flag']"
-          /><span>{{ $t("user_card.report") }}</span>
-        </button>
-      </div>
-    </template>
-    <template #trigger>
-      <span class="button-unstyled popover-trigger">
-        <FALayers class="fa-old-padding-layer">
-          <FAIcon
-            class="fa-scale-110 "
-            icon="ellipsis-h"
-          />
-          <FAIcon
-            v-show="!expanded"
-            class="focus-marker"
-            transform="shrink-6 up-8 right-16"
-            icon="plus"
-          />
-          <FAIcon
-            v-show="expanded"
-            class="focus-marker"
-            transform="shrink-6 up-8 right-16"
-            icon="times"
-          />
-        </FALayers>
-      </span>
-      <teleport to="#modal">
-        <ConfirmModal
-          v-if="showingDeleteDialog"
-          :title="$t('status.delete_confirm_title')"
-          :cancel-text="$t('status.delete_confirm_cancel_button')"
-          :confirm-text="$t('status.delete_confirm_accept_button')"
-          @cancelled="hideDeleteStatusConfirmDialog"
-          @accepted="doDeleteStatus"
-        >
-          {{ $t('status.delete_confirm') }}
-        </ConfirmModal>
-      </teleport>
-    </template>
-  </Popover>
-</template>
-
-<script src="./extra_buttons.js"></script>
-
-<style lang="scss">
-@import "../../mixins";
-
-.ExtraButtons {
-  .popover-trigger {
-    position: static;
-    padding: 10px;
-    margin: -10px;
-
-    &:hover .svg-inline--fa {
-      color: var(--text);
-    }
-  }
-
-  .popover-trigger-button {
-    /* override of popover internal stuff */
-    width: auto;
-
-    @include unfocused-style {
-      .focus-marker {
-        visibility: hidden;
-      }
-    }
-
-    @include focused-style {
-      .focus-marker {
-        visibility: visible;
-      }
-    }
-  }
-}
-</style>
diff --git a/src/components/extra_notifications/extra_notifications.js b/src/components/extra_notifications/extra_notifications.js
index 1bb0f8374..673b28662 100644
--- a/src/components/extra_notifications/extra_notifications.js
+++ b/src/components/extra_notifications/extra_notifications.js
@@ -1,4 +1,6 @@
 import { mapGetters } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
+import { useAnnouncementsStore } from 'src/stores/announcements'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -7,6 +9,8 @@ import {
   faBullhorn
 } from '@fortawesome/free-solid-svg-icons'
 
+import { useInterfaceStore } from 'src/stores/interface'
+
 library.add(
   faUserPlus,
   faComments,
@@ -33,11 +37,14 @@ const ExtraNotifications = {
     currentUser () {
       return this.$store.state.users.currentUser
     },
-    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount', 'followRequestCount', 'mergedConfig'])
+    ...mapGetters(['unreadChatCount', 'followRequestCount', 'mergedConfig']),
+    ...mapPiniaState(useAnnouncementsStore, {
+      unreadAnnouncementCount: 'unreadAnnouncementCount'
+    })
   },
   methods: {
     openNotificationSettings () {
-      return this.$store.dispatch('openSettingsModalTab', 'notifications')
+      return useInterfaceStore().openSettingsModalTab('notifications')
     },
     dismissConfigurationTip () {
       return this.$store.dispatch('setOption', { name: 'showExtraNotificationsTip', value: false })
diff --git a/src/components/extra_notifications/extra_notifications.vue b/src/components/extra_notifications/extra_notifications.vue
index 600c99bbb..5728dc98f 100644
--- a/src/components/extra_notifications/extra_notifications.vue
+++ b/src/components/extra_notifications/extra_notifications.vue
@@ -14,7 +14,7 @@
           class="fa-scale-110 icon"
           icon="comments"
         />
-        {{ $tc('notifications.unread_chats', unreadChatCount, { num: unreadChatCount }) }}
+        {{ $t('notifications.unread_chats', { num: unreadChatCount }, unreadChatCount) }}
       </router-link>
     </div>
     <div
@@ -31,7 +31,7 @@
           class="fa-scale-110 icon"
           icon="bullhorn"
         />
-        {{ $tc('notifications.unread_announcements', unreadAnnouncementCount, { num: unreadAnnouncementCount }) }}
+        {{ $t('notifications.unread_announcements', { num: unreadAnnouncementCount }, unreadAnnouncementCount) }}
       </router-link>
     </div>
     <div
@@ -48,7 +48,7 @@
           class="fa-scale-110 icon"
           icon="user-plus"
         />
-        {{ $tc('notifications.unread_follow_requests', followRequestCount, { num: followRequestCount }) }}
+        {{ $t('notifications.unread_follow_requests', { num: followRequestCount }, followRequestCount) }}
       </router-link>
     </div>
     <i18n-t
@@ -56,6 +56,7 @@
       tag="span"
       class="notification tip extra-notification"
       keypath="notifications.configuration_tip"
+      scope="global"
     >
       <template #theSettings>
         <button
diff --git a/src/components/favorite_button/favorite_button.js b/src/components/favorite_button/favorite_button.js
deleted file mode 100644
index cf3378c90..000000000
--- a/src/components/favorite_button/favorite_button.js
+++ /dev/null
@@ -1,49 +0,0 @@
-import { mapGetters } from 'vuex'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faStar,
-  faPlus,
-  faMinus,
-  faCheck
-} from '@fortawesome/free-solid-svg-icons'
-import {
-  faStar as faStarRegular
-} from '@fortawesome/free-regular-svg-icons'
-
-library.add(
-  faStar,
-  faStarRegular,
-  faPlus,
-  faMinus,
-  faCheck
-)
-
-const FavoriteButton = {
-  props: ['status', 'loggedIn'],
-  data () {
-    return {
-      animated: false
-    }
-  },
-  methods: {
-    favorite () {
-      if (!this.status.favorited) {
-        this.$store.dispatch('favorite', { id: this.status.id })
-      } else {
-        this.$store.dispatch('unfavorite', { id: this.status.id })
-      }
-      this.animated = true
-      setTimeout(() => {
-        this.animated = false
-      }, 500)
-    }
-  },
-  computed: {
-    ...mapGetters(['mergedConfig']),
-    remoteInteractionLink () {
-      return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
-    }
-  }
-}
-
-export default FavoriteButton
diff --git a/src/components/favorite_button/favorite_button.vue b/src/components/favorite_button/favorite_button.vue
deleted file mode 100644
index 2e0dd0476..000000000
--- a/src/components/favorite_button/favorite_button.vue
+++ /dev/null
@@ -1,114 +0,0 @@
-<template>
-  <div class="FavoriteButton">
-    <button
-      v-if="loggedIn"
-      class="button-unstyled interactive"
-      :class="status.favorited && '-favorited'"
-      :title="$t('tool_tip.favorite')"
-      @click.prevent="favorite()"
-    >
-      <FALayers class="fa-scale-110 fa-old-padding-layer">
-        <FAIcon
-          class="fa-scale-110"
-          :icon="[status.favorited ? 'fas' : 'far', 'star']"
-          :spin="animated"
-        />
-        <FAIcon
-          v-if="status.favorited"
-          class="active-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="check"
-        />
-        <FAIcon
-          v-if="!status.favorited"
-          class="focus-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="plus"
-        />
-        <FAIcon
-          v-else
-          class="focus-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="minus"
-        />
-      </FALayers>
-    </button>
-    <a
-      v-else
-      class="button-unstyled interactive"
-      target="_blank"
-      role="button"
-      :title="$t('tool_tip.favorite')"
-      :href="remoteInteractionLink"
-    >
-      <FALayers class="fa-scale-110 fa-old-padding-layer">
-        <FAIcon
-          class="fa-scale-110"
-          :icon="['far', 'star']"
-        />
-        <FAIcon
-          class="focus-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="plus"
-        />
-      </FALayers>
-    </a>
-    <span
-      v-if="!mergedConfig.hidePostStats && status.fave_num > 0"
-      class="action-counter"
-    >
-      {{ status.fave_num }}
-    </span>
-  </div>
-</template>
-
-<script src="./favorite_button.js"></script>
-
-<style lang="scss">
-@import "../../mixins";
-
-.FavoriteButton {
-  display: flex;
-
-  > :first-child {
-    padding: 10px;
-    margin: -10px -8px -10px -10px;
-  }
-
-  .action-counter {
-    pointer-events: none;
-    user-select: none;
-  }
-
-  .interactive {
-    .svg-inline--fa {
-      animation-duration: 0.6s;
-    }
-
-    &:hover .svg-inline--fa,
-    &.-favorited .svg-inline--fa {
-      color: var(--cOrange);
-    }
-
-    @include unfocused-style {
-      .focus-marker {
-        visibility: hidden;
-      }
-
-      .active-marker {
-        visibility: visible;
-      }
-    }
-
-    @include focused-style {
-      .focus-marker {
-        visibility: visible;
-      }
-
-      .active-marker {
-        visibility: hidden;
-      }
-    }
-  }
-}
-</style>
diff --git a/src/components/features_panel/features_panel.vue b/src/components/features_panel/features_panel.vue
index 4cdf56d07..d91ef1eff 100644
--- a/src/components/features_panel/features_panel.vue
+++ b/src/components/features_panel/features_panel.vue
@@ -1,12 +1,12 @@
 <template>
   <div class="features-panel">
     <div class="panel panel-default base01-background">
-      <div class="panel-heading timeline-heading base02-background base04">
-        <div class="title">
+      <div class="panel-heading timeline-heading base02-background base04 -sticky">
+        <h1 class="title">
           {{ $t('features_panel.title') }}
-        </div>
+        </h1>
       </div>
-      <div class="panel-body features-panel">
+      <div class="panel-body">
         <ul>
           <li v-if="shout">
             {{ $t('features_panel.shout') }}
diff --git a/src/components/flash/flash.vue b/src/components/flash/flash.vue
index c9fc730be..57de5b2ee 100644
--- a/src/components/flash/flash.vue
+++ b/src/components/flash/flash.vue
@@ -72,12 +72,11 @@
     flex: 1 1 0;
     line-height: 1.2;
     white-space: normal;
-    word-wrap: normal;
   }
 
   .hidden {
     display: none;
-    visibility: "hidden";
+    visibility: hidden;
   }
 }
 </style>
diff --git a/src/components/follow_button/follow_button.vue b/src/components/follow_button/follow_button.vue
index e421c15b3..3606b68be 100644
--- a/src/components/follow_button/follow_button.vue
+++ b/src/components/follow_button/follow_button.vue
@@ -17,6 +17,7 @@
         @cancelled="hideConfirmUnfollow"
       >
         <i18n-t
+          scope="global"
           keypath="user_card.unfollow_confirm"
           tag="span"
         >
diff --git a/src/components/follow_requests/follow_requests.vue b/src/components/follow_requests/follow_requests.vue
index 41f19db8f..b678364cc 100644
--- a/src/components/follow_requests/follow_requests.vue
+++ b/src/components/follow_requests/follow_requests.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="settings panel panel-default">
     <div class="panel-heading">
-      <div class="title">
+      <h1 class="title">
         {{ $t('nav.friend_requests') }}
-      </div>
+      </h1>
     </div>
     <div class="panel-body">
       <FollowRequestCard
diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js
index d93949450..ffc866788 100644
--- a/src/components/font_control/font_control.js
+++ b/src/components/font_control/font_control.js
@@ -1,6 +1,7 @@
 import Select from '../select/select.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Popover from 'src/components/popover/popover.vue'
+import { useInterfaceStore } from 'src/stores/interface'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -25,7 +26,7 @@ export default {
     'name', 'label', 'modelValue', 'fallback', 'options', 'no-inherit'
   ],
   mounted () {
-    this.$store.dispatch('queryLocalFonts')
+    useInterfaceStore().queryLocalFonts()
   },
   emits: ['update:modelValue'],
   data () {
@@ -50,10 +51,10 @@ export default {
       return typeof this.modelValue !== 'undefined'
     },
     localFontsList () {
-      return this.$store.state.interface.localFonts
+      return useInterfaceStore().localFonts
     },
     localFontsSize () {
-      return this.$store.state.interface.localFonts?.length
+      return useInterfaceStore().localFonts?.length
     }
   }
 }
diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index fca3b360b..5124fd53a 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -1,34 +1,39 @@
 <template>
-  <div
-    class="font-control"
-    :class="{ custom: isCustom }"
-  >
-    <label
-      :id="name + '-label'"
-      :for="preset === 'custom' ? name : name + '-font-switcher'"
-      class="label"
-    >
-      {{ label }}
-    </label>
+  <div class="font-control">
+    <div class="setting-item">
+      <Checkbox
+        v-if="typeof fallback !== 'undefined'"
+        :id="name + '-o'"
+        class="font-checkbox setting-control setting-label"
+        :model-value="present"
+        @change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
+      >
+        <i18n-t
+          scope="global"
+          keypath="settings.style.fonts.override"
+          tag="span"
+        >
+          <span>
+            {{ label }}
+          </span>
+        </i18n-t>
+      </Checkbox>
+    </div>
     {{ ' ' }}
-    <Checkbox
-      v-if="typeof fallback !== 'undefined'"
-      :id="name + '-o'"
-      :modelValue="present"
-      @change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
+    <div
+      v-if="modelValue?.family"
+      class="font-input setting-item"
     >
-      {{ $t('settings.style.themes3.define') }}
-    </Checkbox>
-    <p v-if="modelValue?.family">
       <label
         v-if="manualEntry"
         :id="name + '-label'"
-        :for="preset === 'custom' ? name : name + '-font-switcher'"
+        :for="manualEntry ? name : name + '-font-switcher'"
         class="label"
       >
         <i18n-t
           keypath="settings.style.themes3.font.entry"
           tag="span"
+          scope="global"
         >
           <template #fontFamily>
             <code>font-family</code>
@@ -38,7 +43,7 @@
       <label
         v-else
         :id="name + '-label'"
-        :for="preset === 'custom' ? name : name + '-font-switcher'"
+        :for="manualEntry ? name : name + '-font-switcher'"
         class="label"
       >
         {{ $t('settings.style.themes3.font.select') }}
@@ -50,8 +55,8 @@
       >
         <button
           class="btn button-default"
-          @click="toggleManualEntry"
           :title="$t('settings.style.themes3.font.lookup_local_fonts')"
+          @click="toggleManualEntry"
         >
           <FAIcon
             fixed-width
@@ -68,12 +73,12 @@
       </span>
       <span
         v-else
-        class="btn-group"
+        class="font-selector btn-group"
       >
         <button
           class="btn button-default"
-          @click="toggleManualEntry"
           :title="$t('settings.style.themes3.font.enter_manually')"
+          @click="toggleManualEntry"
         >
           <FAIcon
             fixed-width
@@ -84,7 +89,7 @@
           :id="name + '-local-font-switcher'"
           :model-value="modelValue?.family"
           class="custom-font"
-          @update:modelValue="v => $emit('update:modelValue', { ...(modelValue || {}), family: v })"
+          @update:model-value="v => $emit('update:modelValue', { ...(modelValue || {}), family: v })"
         >
           <optgroup
             :label="$t('settings.style.themes3.font.group-builtin')"
@@ -124,20 +129,13 @@
           </optgroup>
         </Select>
       </span>
-    </p>
+    </div>
   </div>
 </template>
 
 <script src="./font_control.js"></script>
 
 <style lang="scss">
-.font-control {
-  .custom-font {
-    min-width: 20em;
-    max-width: 20em;
-  }
-}
-
 .invalid-tooltip {
   margin: 0.5em 1em;
   min-width: 10em;
diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
index e86a3eeaf..676c830b0 100644
--- a/src/components/gallery/gallery.js
+++ b/src/components/gallery/gallery.js
@@ -1,3 +1,4 @@
+import { useMediaViewerStore } from 'src/stores/media_viewer'
 import Attachment from '../attachment/attachment.vue'
 import { sumBy, set } from 'lodash'
 
@@ -107,11 +108,11 @@ const Gallery = {
       this.hidingLong = event
     },
     openGallery () {
-      this.$store.dispatch('setMedia', this.attachments)
-      this.$store.dispatch('setCurrentMedia', this.attachments[0])
+      useMediaViewerStore().setMedia(this.attachments)
+      useMediaViewerStore().setCurrentMedia(this.attachments[0])
     },
     onMedia () {
-      this.$store.dispatch('setMedia', this.attachments)
+      useMediaViewerStore().setMedia(this.attachments)
     }
   }
 }
diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue
index 40048285c..eb1054df6 100644
--- a/src/components/gallery/gallery.vue
+++ b/src/components/gallery/gallery.vue
@@ -32,8 +32,8 @@
             :description="descriptions && descriptions[attachment.id]"
             :hide-description="size === 'small' || tooManyAttachments && hidingLong"
             :style="itemStyle(attachment.id, row.items)"
-            @setMedia="onMedia"
-            @naturalSizeLoad="onNaturalSizeLoad"
+            @set-media="onMedia"
+            @natural-size-load="onNaturalSizeLoad"
           />
         </div>
       </div>
@@ -101,10 +101,7 @@
 
     .gallery-row-inner {
       position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
+      inset: 0;
       display: flex;
       flex-flow: row wrap;
       align-content: stretch;
@@ -132,7 +129,7 @@
 
         .gallery-item {
           margin: 0;
-          height: 200px;
+          height: 15em;
         }
       }
     }
@@ -160,7 +157,15 @@
         linear-gradient(to top, white, white);
 
       /* Autoprefixed seem to ignore this one, and also syntax is different */
+      /* stylelint-disable mask-composite */
+      /* stylelint-disable declaration-property-value-no-unknown */
+      /* stylelint-disable scss/declaration-property-value-no-unknown */
+
+      /* TODO check if this is still needed */
       mask-composite: xor;
+      /* stylelint-enable scss/declaration-property-value-no-unknown */
+      /* stylelint-enable declaration-property-value-no-unknown */
+      /* stylelint-enable mask-composite */
       mask-composite: exclude;
     }
   }
diff --git a/src/components/global_notice_list/global_notice_list.js b/src/components/global_notice_list/global_notice_list.js
index e93fba752..cf14d1a07 100644
--- a/src/components/global_notice_list/global_notice_list.js
+++ b/src/components/global_notice_list/global_notice_list.js
@@ -2,6 +2,7 @@ import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faTimes
 } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faTimes
@@ -10,12 +11,12 @@ library.add(
 const GlobalNoticeList = {
   computed: {
     notices () {
-      return this.$store.state.interface.globalNotices
+      return useInterfaceStore().globalNotices
     }
   },
   methods: {
     closeNotice (notice) {
-      this.$store.dispatch('removeGlobalNotice', notice)
+      useInterfaceStore().removeGlobalNotice(notice)
     }
   }
 }
diff --git a/src/components/icon.style.js b/src/components/icon.style.js
index 6cb9e4e39..4d30f389b 100644
--- a/src/components/icon.style.js
+++ b/src/components/icon.style.js
@@ -6,7 +6,7 @@ export default {
     {
       component: 'Icon',
       directives: {
-        textColor: '$blend(--stack, 0.5, --parent--text)',
+        textColor: '$blend(--stack 0.5 --parent--text)',
         textAuto: 'no-auto'
       }
     }
diff --git a/src/components/image_cropper/image_cropper.js b/src/components/image_cropper/image_cropper.js
index 55e901a03..afca328e8 100644
--- a/src/components/image_cropper/image_cropper.js
+++ b/src/components/image_cropper/image_cropper.js
@@ -1,5 +1,4 @@
-import Cropper from 'cropperjs'
-import 'cropperjs/dist/cropper.css'
+import 'cropperjs' // This adds all of the cropperjs's components into DOM
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faCircleNotch
@@ -11,86 +10,47 @@ library.add(
 
 const ImageCropper = {
   props: {
-    trigger: {
-      type: [String, window.Element],
-      required: true
-    },
-    submitHandler: {
-      type: Function,
-      required: true
-    },
-    cropperOptions: {
-      type: Object,
-      default () {
-        return {
-          aspectRatio: 1,
-          autoCropArea: 1,
-          viewMode: 1,
-          movable: false,
-          zoomable: false,
-          guides: false
-        }
-      }
-    },
+    // Mime-types to accept, i.e. which filetypes to accept (.gif, .png, etc.)
     mimes: {
       type: String,
       default: 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon'
     },
-    saveButtonLabel: {
-      type: String
-    },
-    saveWithoutCroppingButtonlabel: {
-      type: String
-    },
-    cancelButtonLabel: {
-      type: String
+    // Fixed aspect-ratio for selection box
+    aspectRatio: {
+      type: Number
     }
   },
   data () {
     return {
-      cropper: undefined,
       dataUrl: undefined,
-      filename: undefined,
-      submitting: false
-    }
-  },
-  computed: {
-    saveText () {
-      return this.saveButtonLabel || this.$t('image_cropper.save')
-    },
-    saveWithoutCroppingText () {
-      return this.saveWithoutCroppingButtonlabel || this.$t('image_cropper.save_without_cropping')
-    },
-    cancelText () {
-      return this.cancelButtonLabel || this.$t('image_cropper.cancel')
+      filename: undefined
     }
   },
+  emits: [
+    'submit', // cropping complete or uncropped image returned
+    'close', // cropper is closed
+  ],
   methods: {
     destroy () {
-      if (this.cropper) {
-        this.cropper.destroy()
-      }
       this.$refs.input.value = ''
       this.dataUrl = undefined
       this.$emit('close')
     },
     submit (cropping = true) {
-      this.submitting = true
-      this.submitHandler(cropping && this.cropper, this.file)
-        .then(() => this.destroy())
-        .finally(() => {
-          this.submitting = false
-        })
+      let cropperPromise
+      if (cropping) {
+        cropperPromise = this.$refs.cropperSelection.$toCanvas()
+      } else {
+        cropperPromise = Promise.resolve()
+      }
+
+      cropperPromise.then(canvas => {
+        this.$emit('submit', { canvas, file: this.file })
+      })
     },
     pickImage () {
       this.$refs.input.click()
     },
-    createCropper () {
-      this.cropper = new Cropper(this.$refs.img, this.cropperOptions)
-    },
-    getTriggerDOM () {
-      return typeof this.trigger === 'object' ? this.trigger : document.querySelector(this.trigger)
-    },
     readFile () {
       const fileInput = this.$refs.input
       if (fileInput.files != null && fileInput.files[0] != null) {
@@ -103,26 +63,37 @@ const ImageCropper = {
         reader.readAsDataURL(this.file)
         this.$emit('changed', this.file, reader)
       }
+    },
+    inSelection(selection, maxSelection) {
+      return (
+        selection.x >= maxSelection.x
+        && selection.y >= maxSelection.y
+        && (selection.x + selection.width) <= (maxSelection.x + maxSelection.width)
+        && (selection.y + selection.height) <= (maxSelection.y + maxSelection.height)
+      )
+    },
+    onCropperSelectionChange(event) {
+      const cropperCanvas = this.$refs.cropperCanvas
+      const cropperCanvasRect = cropperCanvas.getBoundingClientRect()
+      const selection = event.detail
+      const maxSelection = {
+        x: 0,
+        y: 0,
+        width: cropperCanvasRect.width,
+        height: cropperCanvasRect.height,
+      }
+
+      if (!this.inSelection(selection, maxSelection)) {
+        event.preventDefault();
+      }
     }
   },
   mounted () {
-    // listen for click event on trigger
-    const trigger = this.getTriggerDOM()
-    if (!trigger) {
-      this.$emit('error', 'No image make trigger found.', 'user')
-    } else {
-      trigger.addEventListener('click', this.pickImage)
-    }
     // listen for input file changes
     const fileInput = this.$refs.input
     fileInput.addEventListener('change', this.readFile)
   },
   beforeUnmount: function () {
-    // remove the event listeners
-    const trigger = this.getTriggerDOM()
-    if (trigger) {
-      trigger.removeEventListener('click', this.pickImage)
-    }
     const fileInput = this.$refs.input
     fileInput.removeEventListener('change', this.readFile)
   }
diff --git a/src/components/image_cropper/image_cropper.vue b/src/components/image_cropper/image_cropper.vue
index 8647ed4d7..ee487b09c 100644
--- a/src/components/image_cropper/image_cropper.vue
+++ b/src/components/image_cropper/image_cropper.vue
@@ -1,42 +1,53 @@
 <template>
   <div class="image-cropper">
-    <div v-if="dataUrl">
-      <div class="image-cropper-image-container">
-        <img
-          ref="img"
+    <div class="image">
+      <cropper-canvas
+        ref="cropperCanvas"
+        background
+        class="image-cropper-canvas"
+        height="100%"
+      >
+        <cropper-image
+          v-if="dataUrl"
+          ref="cropperImage"
           :src="dataUrl"
-          alt=""
-          @load.stop="createCropper"
+          alt="Picture"
+          class="image-cropper-image"
+          translatable
+          scalable
+        />
+        <cropper-shade hidden />
+        <cropper-handle
+          action="select"
+          plain
+        />
+        <cropper-selection
+          ref="cropperSelection"
+          initial-coverage="0.9"
+          :aspect-ratio="aspectRatio"
+          movable
+          resizable
+          @change="onCropperSelectionChange"
         >
-      </div>
-      <div class="image-cropper-buttons-wrapper">
-        <button
-          class="button-default btn"
-          type="button"
-          :disabled="submitting"
-          @click="submit()"
-          v-text="saveText"
-        />
-        <button
-          class="button-default btn"
-          type="button"
-          :disabled="submitting"
-          @click="destroy"
-          v-text="cancelText"
-        />
-        <button
-          class="button-default btn"
-          type="button"
-          :disabled="submitting"
-          @click="submit(false)"
-          v-text="saveWithoutCroppingText"
-        />
-        <FAIcon
-          v-if="submitting"
-          spin
-          icon="circle-notch"
-        />
-      </div>
+          <cropper-grid
+            role="grid"
+            covered
+          />
+          <cropper-crosshair centered />
+          <cropper-handle
+            action="move"
+            theme-color="rgba(255, 255, 255, 0.35)"
+          />
+          <cropper-handle action="n-resize" />
+          <cropper-handle action="e-resize" />
+          <cropper-handle action="s-resize" />
+          <cropper-handle action="w-resize" />
+          <cropper-handle action="ne-resize" />
+          <cropper-handle action="nw-resize" />
+          <cropper-handle action="se-resize" />
+          <cropper-handle action="sw-resize" />
+        </cropper-selection>
+      </cropper-canvas>
     </div>
     <input
       ref="input"
@@ -51,24 +62,24 @@
 
 <style lang="scss">
 .image-cropper {
-  &-img-input {
+  display: flex;
+  flex-direction: column;
+
+  &-canvas, .image {
+    height: 100%;
+  }
+
+  & &-img-input {
     display: none;
   }
 
-  &-image-container {
-    position: relative;
-
-    img {
-      display: block;
-      max-width: 100%;
-    }
-  }
-
   &-buttons-wrapper {
-    margin-top: 10px;
+    display: grid;
+    grid-gap: 0.5em;
+    grid-template-columns: 1fr 1fr 1fr;
 
     button {
-      margin-top: 5px;
+      margin-top: 1em;
     }
   }
 }
diff --git a/src/components/importer/importer.vue b/src/components/importer/importer.vue
index 12779b457..0259ca70e 100644
--- a/src/components/importer/importer.vue
+++ b/src/components/importer/importer.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="importer">
+  <div class="importer btn-group">
     <form>
       <input
         ref="input"
@@ -19,7 +19,7 @@
       class="btn button-default"
       @click="submit"
     >
-      {{ submitButtonLabel || $t('importer.submit') }}
+      {{ submitButtonLabel || $t('importer.import') }}
     </button>
     <div v-if="success">
       <button
diff --git a/src/components/input.style.js b/src/components/input.style.js
index 6ad6cf903..00f51cbf6 100644
--- a/src/components/input.style.js
+++ b/src/components/input.style.js
@@ -1,17 +1,8 @@
-const hoverGlow = {
-  x: 0,
-  y: 0,
-  blur: 4,
-  spread: 0,
-  color: '--text',
-  alpha: 1
-}
-
 export default {
   name: 'Input',
   selector: '.input',
   states: {
-    hover: ':hover:not(.disabled)',
+    hover: ':is(:hover, :focus-visible):not(.disabled)',
     focused: ':focus-within',
     disabled: '.disabled'
   },
@@ -27,7 +18,9 @@ export default {
     {
       component: 'Root',
       directives: {
-        '--defaultInputBevel': 'shadow | $borderSide(#FFFFFF, bottom, 0.2), $borderSide(#000000, top, 0.2)'
+        '--defaultInputBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2), $borderSide(#000000 top 0.2), inset 0 0 2 #000000 / 0.15, 1 0 1 1 --text / 0.15, -1 0 1 1 --text / 0.15',
+        '--defaultInputHoverGlow': 'shadow | 0 0 4 --text / 0.5',
+        '--defaultInputFocusGlow': 'shadow | 0 0 4 4 --link / 0.5'
       }
     },
     {
@@ -54,7 +47,19 @@ export default {
     {
       state: ['hover'],
       directives: {
-        shadow: [hoverGlow, '--defaultInputBevel']
+        shadow: ['--defaultInputHoverGlow', '--defaultInputBevel']
+      }
+    },
+    {
+      state: ['focused'],
+      directives: {
+        shadow: ['--defaultInputFocusGlow', '--defaultInputBevel']
+      }
+    },
+    {
+      state: ['focused', 'hover'],
+      directives: {
+        shadow: ['--defaultInputFocusGlow', '--defaultInputHoverGlow', '--defaultInputBevel']
       }
     },
     {
diff --git a/src/components/interactions/interactions.vue b/src/components/interactions/interactions.vue
index a2c56af4e..1e2efe402 100644
--- a/src/components/interactions/interactions.vue
+++ b/src/components/interactions/interactions.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="panel panel-default">
     <div class="panel-heading">
-      <div class="title">
+      <h1 class="title">
         {{ $t("nav.interactions") }}
-      </div>
+      </h1>
     </div>
     <tab-switcher
       ref="tabSwitcher"
diff --git a/src/components/interface_language_switcher/interface_language_switcher.js b/src/components/interface_language_switcher/interface_language_switcher.js
new file mode 100644
index 000000000..721c19887
--- /dev/null
+++ b/src/components/interface_language_switcher/interface_language_switcher.js
@@ -0,0 +1,62 @@
+import localeService from '../../services/locale/locale.service.js'
+
+import Select from '../select/select.vue'
+import ProfileSettingIndicator from 'src/components/settings_modal/helpers/profile_setting_indicator.vue'
+
+import { v4 as uuidv4 } from 'uuid';
+
+export default {
+  components: {
+    Select,
+    ProfileSettingIndicator
+  },
+  props: {
+    // List of languages (or just one language)
+    modelValue: {
+      type: [Array, String],
+      required: true
+    },
+    // Is this setting stored in user profile (true) or elsewhere (false)
+    // Doesn't affect storage, just shows an icon if true
+    profile: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ['update:modelValue'],
+  computed: {
+    languages () {
+      return localeService.languages
+    },
+    uniqueId () {
+        return uuidv4()
+    },
+    controlledLanguage: {
+      get: function () {
+        return Array.isArray(this.modelValue) ? this.modelValue : [this.modelValue]
+      },
+      set: function (val) {
+        this.$emit('update:modelValue', val)
+      }
+    }
+  },
+
+  methods: {
+    getLanguageName (code) {
+      return localeService.getLanguageName(code)
+    },
+    addLanguage () {
+      this.controlledLanguage = [...this.controlledLanguage, '']
+    },
+    setLanguageAt (index, val) {
+      const lang = [...this.controlledLanguage]
+      lang[index] = val
+      this.controlledLanguage = lang
+    },
+    removeLanguageAt (index) {
+      const lang = [...this.controlledLanguage]
+      lang.splice(index, 1)
+      this.controlledLanguage = lang
+    }
+  }
+}
diff --git a/src/components/interface_language_switcher/interface_language_switcher.vue b/src/components/interface_language_switcher/interface_language_switcher.vue
index f7d5ef7ea..a547b98a5 100644
--- a/src/components/interface_language_switcher/interface_language_switcher.vue
+++ b/src/components/interface_language_switcher/interface_language_switcher.vue
@@ -1,29 +1,32 @@
 <template>
-  <div class="interface-language-switcher">
-    <label>
-      {{ promptText }}
-    </label>
-    <ul class="setting-list">
-      <li
-        v-for="index of controlledLanguage.keys()"
-        :key="index"
+  <ul class="interface-language-switcher setting-list">
+    <li
+      v-for="index of controlledLanguage.keys()"
+      :key="index"
+      class="setting-item"
+    >
+      <label
+        class="setting-label"
+        :for="uniqueId+index"
       >
-        <label>
-          {{ index === 0 ? $t('settings.primary_language') : $tc('settings.fallback_language', index, { index }) }}
-          <Select
-            class="language-select"
-            :model-value="controlledLanguage[index]"
-            @update:modelValue="val => setLanguageAt(index, val)"
+        {{ index === 0 ? $t('settings.primary_language') : $t('settings.fallback_language', { index }, index) }}
+      </label>
+      <span class="setting-control btn-group">
+        <Select
+          :id="uniqueId+index"
+          :name="uniqueId+index"
+          class="language-select"
+          :model-value="controlledLanguage[index]"
+          @update:model-value="val => setLanguageAt(index, val)"
+        >
+          <option
+            v-for="lang in languages"
+            :key="lang.code"
+            :value="lang.code"
           >
-            <option
-              v-for="lang in languages"
-              :key="lang.code"
-              :value="lang.code"
-            >
-              {{ lang.name }}
-            </option>
-          </Select>
-        </label>
+            {{ lang.name }}
+          </option>
+        </Select>
         <button
           v-if="controlledLanguage.length > 1 && index !== 0"
           class="button-default btn"
@@ -31,82 +34,53 @@
         >
           {{ $t('settings.remove_language') }}
         </button>
-      </li>
-      <li>
-        <button
-          class="button-default btn"
-          @click="addLanguage"
-        >
-          {{ $t('settings.add_language') }}
-        </button>
-      </li>
-    </ul>
-  </div>
+      </span>
+    </li>
+    <li class="add-button">
+      <button
+        class="button-default btn"
+        @click="addLanguage"
+      >
+        {{ $t('settings.add_language') }}
+      </button>
+    </li>
+  </ul>
 </template>
 
-<script>
-import localeService from '../../services/locale/locale.service.js'
-import Select from '../select/select.vue'
-
-export default {
-  components: {
-    // eslint-disable-next-line vue/no-reserved-component-names
-    Select
-  },
-  props: {
-    promptText: {
-      type: String,
-      required: true
-    },
-    language: {
-      type: [Array, String],
-      required: true
-    },
-    setLanguage: {
-      type: Function,
-      required: true
-    }
-  },
-  computed: {
-    languages () {
-      return localeService.languages
-    },
-
-    controlledLanguage: {
-      get: function () {
-        return Array.isArray(this.language) ? this.language : [this.language]
-      },
-      set: function (val) {
-        this.setLanguage(val)
-      }
-    }
-  },
-
-  methods: {
-    getLanguageName (code) {
-      return localeService.getLanguageName(code)
-    },
-    addLanguage () {
-      this.controlledLanguage = [...this.controlledLanguage, '']
-    },
-    setLanguageAt (index, val) {
-      const lang = [...this.controlledLanguage]
-      lang[index] = val
-      this.controlledLanguage = lang
-    },
-    removeLanguageAt (index) {
-      const lang = [...this.controlledLanguage]
-      lang.splice(index, 1)
-      this.controlledLanguage = lang
-    }
-  }
-}
-</script>
+<script src="./interface_language_switcher.js"></script>
 
 <style lang="scss">
 .interface-language-switcher {
-  .language-select {
-    margin-right: 1em;
+  .setting-list {
+    .setting-item {
+      display: grid;
+      grid-template-columns: subgrid;
+    }
+  }
+
+  .add-button {
+    display: block;
+    text-align: center;
+    padding-bottom: 1em;
+
+    .default-button {
+      display: block;
+      width: auto;
+    }
+  }
+
+  .-mobile & {
+    li.setting-item {
+      display: flex;
+      flex-direction: column;
+      gap: 0.5em;
+      align-items: stretch;
+      border-bottom: none;
+    }
+
+    .add-button {
+      border-bottom: 1px solid var(--border);
+    }
   }
 }
 </style>
diff --git a/src/components/link-preview/link-preview.vue b/src/components/link-preview/link-preview.vue
index 8eb5a5010..18fc77df4 100644
--- a/src/components/link-preview/link-preview.vue
+++ b/src/components/link-preview/link-preview.vue
@@ -68,10 +68,13 @@
     margin: 0.5em 0 0;
     overflow: hidden;
     text-overflow: ellipsis;
-    word-break: break-word;
+    overflow-wrap: break-word;
+    text-wrap: pretty;
     line-height: 1.2em;
-    // cap description at 3 lines, the 1px is to clean up some stray pixels
-    // TODO: fancier fade-out at the bottom to show off that it's too long?
+
+    /* cap description at 3 lines, the 1px is to clean up some stray pixels
+       TODO: fancier fade-out at the bottom to show off that it's too long?
+     */
     max-height: calc(1.2em * 3 - 1px);
   }
 
diff --git a/src/components/list/list.vue b/src/components/list/list.vue
index c885bacd9..5d2c49b3c 100644
--- a/src/components/list/list.vue
+++ b/src/components/list/list.vue
@@ -37,7 +37,7 @@ export default {
     },
     getClass: {
       type: Function,
-      default: item => ''
+      default: () => ''
     },
     nonInteractive: {
       type: Boolean,
diff --git a/src/components/list/list_item.style.js b/src/components/list/list_item.style.js
deleted file mode 100644
index e82a0a830..000000000
--- a/src/components/list/list_item.style.js
+++ /dev/null
@@ -1,48 +0,0 @@
-export default {
-  name: 'ListItem',
-  selector: '.list-item',
-  states: {
-    active: '.-active',
-    hover: ':hover:not(.-non-interactive)'
-  },
-  validInnerComponents: [
-    'Text',
-    'Link',
-    'Icon',
-    'Border',
-    'Button',
-    'ButtonUnstyled',
-    'RichContent',
-    'Input',
-    'Avatar'
-  ],
-  defaultRules: [
-    {
-      directives: {
-        background: '--bg',
-        opacity: 0
-      }
-    },
-    {
-      state: ['active'],
-      directives: {
-        background: '--inheritedBackground, 10',
-        opacity: 1
-      }
-    },
-    {
-      state: ['hover'],
-      directives: {
-        background: '--inheritedBackground, 10',
-        opacity: 1
-      }
-    },
-    {
-      state: ['hover', 'active'],
-      directives: {
-        background: '--inheritedBackground, 20',
-        opacity: 1
-      }
-    }
-  ]
-}
diff --git a/src/components/lists/lists.js b/src/components/lists/lists.js
index 56d68430a..8dcb48b52 100644
--- a/src/components/lists/lists.js
+++ b/src/components/lists/lists.js
@@ -1,3 +1,4 @@
+import { useListsStore } from 'src/stores/lists'
 import ListsCard from '../lists_card/lists_card.vue'
 
 const Lists = {
@@ -11,7 +12,7 @@ const Lists = {
   },
   computed: {
     lists () {
-      return this.$store.state.lists.allLists
+      return useListsStore().allLists
     }
   },
   methods: {
diff --git a/src/components/lists/lists.vue b/src/components/lists/lists.vue
index b8bab0a04..05df5b72f 100644
--- a/src/components/lists/lists.vue
+++ b/src/components/lists/lists.vue
@@ -2,7 +2,9 @@
   <div class="Lists panel panel-default">
     <div class="panel-heading">
       <div class="title">
-        {{ $t('lists.lists') }}
+        <h1 class="title">
+          {{ $t('lists.lists') }}
+        </h1>
       </div>
       <router-link
         :to="{ name: 'lists-new' }"
diff --git a/src/components/lists_edit/lists_edit.js b/src/components/lists_edit/lists_edit.js
index c33659dfc..ca36ab886 100644
--- a/src/components/lists_edit/lists_edit.js
+++ b/src/components/lists_edit/lists_edit.js
@@ -1,4 +1,5 @@
 import { mapState, mapGetters } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
 import ListsUserSearch from '../lists_user_search/lists_user_search.vue'
 import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
@@ -9,6 +10,8 @@ import {
   faSearch,
   faChevronLeft
 } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
+import { useListsStore } from 'src/stores/lists'
 
 library.add(
   faSearch,
@@ -37,12 +40,12 @@ const ListsNew = {
   },
   created () {
     if (!this.id) return
-    this.$store.dispatch('fetchList', { listId: this.id })
+    useListsStore().fetchList({ listId: this.id })
       .then(() => {
         this.title = this.findListTitle(this.id)
         this.titleDraft = this.title
       })
-    this.$store.dispatch('fetchListAccounts', { listId: this.id })
+    useListsStore().fetchListAccounts({ listId: this.id })
       .then(() => {
         this.membersUserIds = this.findListAccounts(this.id)
         this.membersUserIds.forEach(userId => {
@@ -64,7 +67,8 @@ const ListsNew = {
     ...mapState({
       currentUser: state => state.users.currentUser
     }),
-    ...mapGetters(['findUser', 'findListTitle', 'findListAccounts'])
+    ...mapPiniaState(useListsStore, ['findListTitle', 'findListAccounts']),
+    ...mapGetters(['findUser'])
   },
   methods: {
     onInput () {
@@ -95,15 +99,15 @@ const ListsNew = {
       return this.addedUserIds.has(user.id)
     },
     addUser (user) {
-      this.$store.dispatch('addListAccount', { accountId: user.id, listId: this.id })
+      useListsStore().addListAccount({ accountId: user.id, listId: this.id })
     },
     removeUser (userId) {
-      this.$store.dispatch('removeListAccount', { accountId: userId, listId: this.id })
+      useListsStore().removeListAccount({ accountId: userId, listId: this.id })
     },
-    onSearchLoading (results) {
+    onSearchLoading () {
       this.searchLoading = true
     },
-    onSearchLoadingDone (results) {
+    onSearchLoadingDone () {
       this.searchLoading = false
     },
     onSearchResults (results) {
@@ -111,24 +115,23 @@ const ListsNew = {
       this.searchUserIds = results
     },
     updateListTitle () {
-      this.$store.dispatch('setList', { listId: this.id, title: this.titleDraft })
+      useListsStore().setList({ listId: this.id, title: this.titleDraft })
         .then(() => {
           this.title = this.findListTitle(this.id)
         })
     },
     createList () {
-      this.$store.dispatch('createList', { title: this.titleDraft })
+      useListsStore().createList({ title: this.titleDraft })
         .then((list) => {
-          return this
-            .$store
-            .dispatch('setListAccounts', { listId: list.id, accountIds: [...this.addedUserIds] })
+          return useListsStore()
+            .setListAccounts({ listId: list.id, accountIds: [...this.addedUserIds] })
             .then(() => list.id)
         })
         .then((listId) => {
           this.$router.push({ name: 'lists-timeline', params: { id: listId } })
         })
         .catch((e) => {
-          this.$store.dispatch('pushGlobalNotice', {
+          useInterfaceStore().pushGlobalNotice({
             messageKey: 'lists.error',
             messageArgs: [e.message],
             level: 'error'
@@ -136,7 +139,7 @@ const ListsNew = {
         })
     },
     deleteList () {
-      this.$store.dispatch('deleteList', { listId: this.id })
+      useListsStore().deleteList({ listId: this.id })
       this.$router.push({ name: 'lists' })
     }
   }
diff --git a/src/components/lists_edit/lists_edit.vue b/src/components/lists_edit/lists_edit.vue
index 3c2066f69..3ff8c1072 100644
--- a/src/components/lists_edit/lists_edit.vue
+++ b/src/components/lists_edit/lists_edit.vue
@@ -17,6 +17,7 @@
         <i18n-t
           v-if="id"
           keypath="lists.editing_list"
+          scope="global"
         >
           <template #listTitle>
             {{ title }}
@@ -25,6 +26,7 @@
         <i18n-t
           v-else
           keypath="lists.creating_list"
+          scope="global"
         />
       </div>
     </div>
@@ -82,7 +84,7 @@
           <ListsUserSearch
             @results="onSearchResults"
             @loading="onSearchLoading"
-            @loadingDone="onSearchLoadingDone"
+            @loading-done="onSearchLoadingDone"
           />
           <div
             v-if="searchLoading"
diff --git a/src/components/lists_menu/lists_menu_content.js b/src/components/lists_menu/lists_menu_content.js
index 97b322107..726fd5fc4 100644
--- a/src/components/lists_menu/lists_menu_content.js
+++ b/src/components/lists_menu/lists_menu_content.js
@@ -1,6 +1,8 @@
 import { mapState } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
 import { getListEntries } from 'src/components/navigation/filter.js'
+import { useListsStore } from 'src/stores/lists'
 
 export const ListsMenuContent = {
   props: [
@@ -10,8 +12,10 @@ export const ListsMenuContent = {
     NavigationEntry
   },
   computed: {
+    ...mapPiniaState(useListsStore, {
+      lists: getListEntries
+    }),
     ...mapState({
-      lists: getListEntries,
       currentUser: state => state.users.currentUser,
       privateMode: state => state.instance.private,
       federating: state => state.instance.federating
diff --git a/src/components/lists_timeline/lists_timeline.js b/src/components/lists_timeline/lists_timeline.js
index c3f408bd5..eae82a867 100644
--- a/src/components/lists_timeline/lists_timeline.js
+++ b/src/components/lists_timeline/lists_timeline.js
@@ -1,3 +1,4 @@
+import { useListsStore } from 'src/stores/lists'
 import Timeline from '../timeline/timeline.vue'
 const ListsTimeline = {
   data () {
@@ -17,14 +18,14 @@ const ListsTimeline = {
         this.listId = route.params.id
         this.$store.dispatch('stopFetchingTimeline', 'list')
         this.$store.commit('clearTimeline', { timeline: 'list' })
-        this.$store.dispatch('fetchList', { listId: this.listId })
+        useListsStore().fetchList({ listId: this.listId })
         this.$store.dispatch('startFetchingTimeline', { timeline: 'list', listId: this.listId })
       }
     }
   },
   created () {
     this.listId = this.$route.params.id
-    this.$store.dispatch('fetchList', { listId: this.listId })
+    useListsStore().fetchList({ listId: this.listId })
     this.$store.dispatch('startFetchingTimeline', { timeline: 'list', listId: this.listId })
   },
   unmounted () {
diff --git a/src/components/login_form/login_form.js b/src/components/login_form/login_form.js
index b795640e5..9566aa903 100644
--- a/src/components/login_form/login_form.js
+++ b/src/components/login_form/login_form.js
@@ -1,5 +1,8 @@
-import { mapState, mapGetters, mapActions, mapMutations } from 'vuex'
+import { mapState } from 'vuex'
+import { mapStores, mapActions, mapState as mapPiniaState } from 'pinia'
 import oauthApi from '../../services/new_api/oauth.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useAuthFlowStore } from 'src/stores/auth_flow.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faTimes
@@ -17,49 +20,51 @@ const LoginForm = {
   computed: {
     isPasswordAuth () { return this.requiredPassword },
     isTokenAuth () { return this.requiredToken },
+    ...mapStores(useOAuthStore),
     ...mapState({
       registrationOpen: state => state.instance.registrationOpen,
       instance: state => state.instance,
       loggingIn: state => state.users.loggingIn,
-      oauth: state => state.oauth
     }),
-    ...mapGetters(
-      'authFlow', ['requiredPassword', 'requiredToken', 'requiredMFA']
-    )
+    ...mapPiniaState(useAuthFlowStore, ['requiredPassword', 'requiredToken', 'requiredMFA'])
   },
   methods: {
-    ...mapMutations('authFlow', ['requireMFA']),
-    ...mapActions({ login: 'authFlow/login' }),
+    ...mapActions(useAuthFlowStore, ['requireMFA', 'login']),
     submit () {
       this.isTokenAuth ? this.submitToken() : this.submitPassword()
     },
     submitToken () {
-      const { clientId, clientSecret } = this.oauth
       const data = {
-        clientId,
-        clientSecret,
         instance: this.instance.server,
         commit: this.$store.commit
       }
 
-      oauthApi.getOrCreateApp(data)
-        .then((app) => { oauthApi.login({ ...app, ...data }) })
+      // NOTE: we do not really need the app token, but obtaining a token and
+      // calling verify_credentials is the only way to ensure the app still works.
+      this.oauthStore.ensureAppToken()
+        .then(() => {
+          const app = {
+            clientId: this.oauthStore.clientId,
+            clientSecret: this.oauthStore.clientSecret,
+          }
+          oauthApi.login({ ...app, ...data })
+        })
     },
     submitPassword () {
-      const { clientId } = this.oauth
-      const data = {
-        clientId,
-        oauth: this.oauth,
-        instance: this.instance.server,
-        commit: this.$store.commit
-      }
       this.error = false
 
-      oauthApi.getOrCreateApp(data).then((app) => {
+      // NOTE: we do not really need the app token, but obtaining a token and
+      // calling verify_credentials is the only way to ensure the app still works.
+      this.oauthStore.ensureAppToken().then(() => {
+        const app = {
+          clientId: this.oauthStore.clientId,
+          clientSecret: this.oauthStore.clientSecret,
+        }
+
         oauthApi.getTokenWithCredentials(
           {
             ...app,
-            instance: data.instance,
+            instance: this.instance.server,
             username: this.user.username,
             password: this.user.password
           }
diff --git a/src/components/login_form/login_form.scss b/src/components/login_form/login_form.scss
new file mode 100644
index 000000000..83bc20fe4
--- /dev/null
+++ b/src/components/login_form/login_form.scss
@@ -0,0 +1,44 @@
+.login-panel {
+  .login-form {
+    display: flex;
+    flex-direction: column;
+    padding: 0.6em;
+  }
+
+  .btn {
+    min-height: 2em;
+    width: 10em;
+  }
+
+  .register {
+    flex: 1 1;
+  }
+
+  .login-bottom {
+    margin-top: 1em;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  .form-group {
+    display: flex;
+    flex-direction: column;
+    padding: 0.3em 0.5em 0.6em;
+    line-height: 24px;
+  }
+
+  .login-error {
+    display: flex;
+    line-height: 2;
+    margin: 0.5em;
+    animation-name: shakeError;
+    animation-duration: 0.4s;
+    animation-timing-function: ease-in-out;
+  }
+
+  .error-message {
+    flex: 1;
+  }
+}
diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue
index adc2dd5b4..eb5b3432d 100644
--- a/src/components/login_form/login_form.vue
+++ b/src/components/login_form/login_form.vue
@@ -1,9 +1,11 @@
 <template>
-  <div class="login panel panel-default">
+  <div class="login-panel panel panel-default">
     <!-- Default panel contents -->
 
     <div class="panel-heading">
-      {{ $t('login.login') }}
+      <h1 class="title">
+        {{ $t('login.login') }}
+      </h1>
     </div>
 
     <div class="panel-body">
@@ -68,14 +70,13 @@
           </div>
         </div>
       </form>
-    </div>
-
-    <div
-      v-if="error"
-      class="form-group"
-    >
-      <div class="alert error">
-        {{ error }}
+      <div
+        v-if="error"
+        class="login-error alert error"
+      >
+        <span class="error-message">
+          {{ error }}
+        </span>
         <button
           class="button-unstyled"
           @click="clearError"
@@ -92,57 +93,4 @@
 
 <script src="./login_form.js"></script>
 
-<style lang="scss">
-.login-form {
-  display: flex;
-  flex-direction: column;
-  padding: 0.6em;
-
-  .btn {
-    min-height: 2em;
-    width: 10em;
-  }
-
-  .register {
-    flex: 1 1;
-  }
-
-  .login-bottom {
-    margin-top: 1em;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-  }
-
-  .form-group {
-    display: flex;
-    flex-direction: column;
-    padding: 0.3em 0.5em 0.6em;
-    line-height: 24px;
-  }
-
-  .form-bottom {
-    display: flex;
-    padding: 0.5em;
-    height: 32px;
-
-    button {
-      width: 10em;
-    }
-
-    p {
-      margin: 0.35em;
-      padding: 0.35em;
-      display: flex;
-    }
-  }
-
-  .error {
-    text-align: center;
-    animation-name: shakeError;
-    animation-duration: 0.4s;
-    animation-timing-function: ease-in-out;
-  }
-}
-</style>
+<style src="./login_form.scss" />
diff --git a/src/components/media_modal/media_modal.js b/src/components/media_modal/media_modal.js
index 05ef9fbe1..9a57f8250 100644
--- a/src/components/media_modal/media_modal.js
+++ b/src/components/media_modal/media_modal.js
@@ -13,6 +13,7 @@ import {
   faCircleNotch,
   faTimes
 } from '@fortawesome/free-solid-svg-icons'
+import { useMediaViewerStore } from 'src/stores/media_viewer'
 
 library.add(
   faChevronLeft,
@@ -44,16 +45,16 @@ const MediaModal = {
   },
   computed: {
     showing () {
-      return this.$store.state.mediaViewer.activated
+      return useMediaViewerStore().activated
     },
     media () {
-      return this.$store.state.mediaViewer.media
+      return useMediaViewerStore().media
     },
     description () {
       return this.currentMedia.description
     },
     currentIndex () {
-      return this.$store.state.mediaViewer.currentIndex
+      return useMediaViewerStore().currentIndex
     },
     currentMedia () {
       return this.media[this.currentIndex]
@@ -79,7 +80,7 @@ const MediaModal = {
       // to be processed on the content below the overlay
       const transitionTime = 100 // ms
       setTimeout(() => {
-        this.$store.dispatch('closeMediaViewer')
+        useMediaViewerStore().closeMediaViewer()
       }, transitionTime)
     },
     hideIfNotSwiped (event) {
@@ -98,7 +99,7 @@ const MediaModal = {
         if (this.getType(newMedia) === 'image') {
           this.loading = true
         }
-        this.$store.dispatch('setCurrentMedia', newMedia)
+        useMediaViewerStore().setCurrentMedia(newMedia)
       }
     },
     goNext () {
@@ -108,7 +109,7 @@ const MediaModal = {
         if (this.getType(newMedia) === 'image') {
           this.loading = true
         }
-        this.$store.dispatch('setCurrentMedia', newMedia)
+        useMediaViewerStore().setCurrentMedia(newMedia)
       }
     },
     onImageLoaded () {
diff --git a/src/components/media_modal/media_modal.vue b/src/components/media_modal/media_modal.vue
index eb28f8be1..7f625755c 100644
--- a/src/components/media_modal/media_modal.vue
+++ b/src/components/media_modal/media_modal.vue
@@ -2,7 +2,7 @@
   <Modal
     v-if="showing"
     class="media-modal-view"
-    @backdropClicked="hideIfNotSwiped"
+    @backdrop-clicked="hideIfNotSwiped"
   >
     <SwipeClick
       v-if="type === 'image'"
@@ -98,7 +98,7 @@
     <span
       class="counter"
     >
-      {{ $tc('media_modal.counter', currentIndex + 1, { current: currentIndex + 1, total: media.length }) }}
+      {{ $t('media_modal.counter', { current: currentIndex + 1, total: media.length }, currentIndex + 1) }}
     </span>
     <span
       v-if="loading"
@@ -168,9 +168,10 @@ $modal-view-button-icon-margin: 0.5em;
     flex: 0 0 auto;
     overflow-y: auto;
     min-height: 1em;
-    max-width: 500px;
+    max-width: 35.8em;
     max-height: 9.5em;
-    word-break: break-all;
+    overflow-wrap: break-word;
+    text-wrap: pretty;
   }
 
   .modal-image {
diff --git a/src/components/media_upload/media_upload.js b/src/components/media_upload/media_upload.js
index 8c9e5f71d..f2cbfc405 100644
--- a/src/components/media_upload/media_upload.js
+++ b/src/components/media_upload/media_upload.js
@@ -28,7 +28,86 @@ const mediaUpload = {
         this.$refs.input.click()
       }
     },
-    uploadFile (file) {
+    async resizeImage (file) {
+      // Skip if not an image or if it's a GIF
+      if (!file.type.startsWith('image/') || file.type === 'image/gif') {
+        return file
+      }
+
+      // Skip if image compression is disabled
+      if (!this.$store.getters.mergedConfig.imageCompression) {
+        return file
+      }
+
+      // For PNGs, check if animated
+      if (file.type === 'image/png') {
+        const isAnimated = await this.isAnimatedPng(file)
+        if (isAnimated) {
+          return file
+        }
+      }
+
+      return new Promise((resolve) => {
+        const img = new Image()
+        img.onload = () => {
+          // Calculate new dimensions
+          let width = img.width
+          let height = img.height
+          const maxSize = 2048
+
+          if (width > maxSize || height > maxSize) {
+            if (width > height) {
+              height = Math.round((height * maxSize) / width)
+              width = maxSize
+            } else {
+              width = Math.round((width * maxSize) / height)
+              height = maxSize
+            }
+          }
+
+          // Create canvas and resize
+          const canvas = document.createElement('canvas')
+          canvas.width = width
+          canvas.height = height
+          const ctx = canvas.getContext('2d')
+          ctx.drawImage(img, 0, 0, width, height)
+
+          // Check WebP support by trying to create a WebP canvas
+          const testCanvas = document.createElement('canvas')
+          const supportsWebP = testCanvas.toDataURL('image/webp').startsWith('data:image/webp')
+
+          // Convert to WebP if supported and alwaysUseJpeg is false, otherwise JPEG
+          const type = (!this.$store.getters.mergedConfig.alwaysUseJpeg && supportsWebP) ? 'image/webp' : 'image/jpeg'
+          const extension = type === 'image/webp' ? '.webp' : '.jpg'
+
+          // Remove the original extension and add new one
+          const newFileName = file.name.replace(/\.[^/.]+$/, '') + extension
+
+          canvas.toBlob((blob) => {
+            resolve(new File([blob], newFileName, {
+              type,
+              lastModified: Date.now()
+            }))
+          }, type, 0.85)
+        }
+        img.src = URL.createObjectURL(file)
+      })
+    },
+    async isAnimatedPng (file) {
+      const buffer = await file.arrayBuffer()
+      const view = new Uint8Array(buffer)
+      // Look for animated PNG chunks (acTL)
+      for (let i = 0; i < view.length - 8; i++) {
+        if (view[i] === 0x61 && // a
+            view[i + 1] === 0x63 && // c
+            view[i + 2] === 0x54 && // T
+            view[i + 3] === 0x4C) { // L
+          return true
+        }
+      }
+      return false
+    },
+    async uploadFile (file) {
       const self = this
       const store = this.$store
       if (file.size > store.state.instance.uploadlimit) {
@@ -37,8 +116,11 @@ const mediaUpload = {
         self.$emit('upload-failed', 'file_too_big', { filesize: filesize.num, filesizeunit: filesize.unit, allowedsize: allowedsize.num, allowedsizeunit: allowedsize.unit })
         return
       }
+
+      // Resize image if needed
+      const processedFile = await this.resizeImage(file)
       const formData = new FormData()
-      formData.append('file', file)
+      formData.append('file', processedFile)
 
       self.$emit('uploading')
       self.uploadCount++
diff --git a/src/components/mention_link/mention_link.js b/src/components/mention_link/mention_link.js
index 6515bd116..ca5c24618 100644
--- a/src/components/mention_link/mention_link.js
+++ b/src/components/mention_link/mention_link.js
@@ -53,7 +53,9 @@ const MentionLink = {
       this.$router.push(link)
     },
     handleSelection () {
-      this.hasSelection = document.getSelection().containsNode(this.$refs.full, true)
+      if (this.$refs.full) {
+        this.hasSelection = document.getSelection().containsNode(this.$refs.full, true)
+      }
     }
   },
   mounted () {
@@ -94,12 +96,14 @@ const MentionLink = {
     },
     style () {
       if (this.highlight) {
+        /* eslint-disable no-unused-vars */
         const {
           backgroundColor,
           backgroundPosition,
           backgroundImage,
           ...rest
         } = highlightStyle(this.highlight)
+        /* eslint-enable no-unused-vars */
         return rest
       }
     },
@@ -113,9 +117,6 @@ const MentionLink = {
         this.highlightType
       ]
     },
-    useAtIcon () {
-      return this.mergedConfig.useAtIcon
-    },
     isRemote () {
       return this.userName !== this.userNameFull
     },
diff --git a/src/components/mention_link/mention_link.scss b/src/components/mention_link/mention_link.scss
index 42f572941..3aa7816be 100644
--- a/src/components/mention_link/mention_link.scss
+++ b/src/components/mention_link/mention_link.scss
@@ -7,7 +7,6 @@
   & .new,
   & .original {
     display: inline;
-    border-radius: 2px;
   }
 
   .mention-avatar {
@@ -27,7 +26,6 @@
     top: 100%;
     left: 0;
     height: 100%;
-    word-wrap: normal;
     white-space: nowrap;
     transition: opacity 0.2s ease;
     z-index: 1;
diff --git a/src/components/mention_link/mention_link.vue b/src/components/mention_link/mention_link.vue
index 5db837a25..0452cad58 100644
--- a/src/components/mention_link/mention_link.vue
+++ b/src/components/mention_link/mention_link.vue
@@ -34,12 +34,7 @@
             :user="user"
           /><span
             class="shortName"
-          ><FAIcon
-            v-if="useAtIcon"
-            size="sm"
-            icon="at"
-            class="at"
-          />{{ !useAtIcon ? '@' : '' }}<span
+          >@<span
             class="userName"
             v-html="userName"
           /><span
diff --git a/src/components/mentions_line/mentions_line.scss b/src/components/mentions_line/mentions_line.scss
index b7dfbfb87..30f2422ed 100644
--- a/src/components/mentions_line/mentions_line.scss
+++ b/src/components/mentions_line/mentions_line.scss
@@ -1,5 +1,6 @@
 .MentionsLine {
-  word-break: break-all;
+  overflow-wrap: break-word;
+  text-wrap: pretty;
 
   .mention-link:not(:first-child)::before {
     content: " ";
diff --git a/src/components/menu_item.style.js b/src/components/menu_item.style.js
index 51388155d..859932062 100644
--- a/src/components/menu_item.style.js
+++ b/src/components/menu_item.style.js
@@ -4,15 +4,12 @@ export default {
   validInnerComponents: [
     'Text',
     'Icon',
-    'Input',
-    'Border',
-    'ButtonUnstyled',
-    'Badge',
-    'Avatar'
+    'Border'
   ],
   states: {
-    hover: ':hover',
-    active: '.-active'
+    hover: ':is(:hover, :focus-visible, :has(:focus-visible)):not(.disabled)',
+    active: '.-active',
+    disabled: '.disabled'
   },
   defaultRules: [
     {
@@ -24,21 +21,21 @@ export default {
     {
       state: ['hover'],
       directives: {
-        background: '$mod(--bg, 5)',
+        background: '$mod(--bg 5)',
         opacity: 1
       }
     },
     {
       state: ['active'],
       directives: {
-        background: '$mod(--bg, 10)',
+        background: '$mod(--bg 10)',
         opacity: 1
       }
     },
     {
       state: ['active', 'hover'],
       directives: {
-        background: '$mod(--bg, 15)',
+        background: '$mod(--bg 15)',
         opacity: 1
       }
     },
@@ -85,6 +82,28 @@ export default {
         textColor: '--link',
         textAuto: 'no-preserve'
       }
+    },
+    {
+      component: 'Text',
+      parent: {
+        component: 'MenuItem',
+        state: ['disabled']
+      },
+      directives: {
+        textOpacity: 0.25,
+        textOpacityMode: 'blend'
+      }
+    },
+    {
+      component: 'Icon',
+      parent: {
+        component: 'MenuItem',
+        state: ['disabled']
+      },
+      directives: {
+        textOpacity: 0.25,
+        textOpacityMode: 'blend'
+      }
     }
   ]
 }
diff --git a/src/components/mfa_form/recovery_form.js b/src/components/mfa_form/recovery_form.js
index 01a62a503..84479b1ec 100644
--- a/src/components/mfa_form/recovery_form.js
+++ b/src/components/mfa_form/recovery_form.js
@@ -1,5 +1,8 @@
 import mfaApi from '../../services/new_api/mfa.js'
-import { mapState, mapGetters, mapActions, mapMutations } from 'vuex'
+import { mapState } from 'vuex'
+import { mapStores, mapActions, mapState as mapPiniaState } from 'pinia'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useAuthFlowStore } from 'src/stores/auth_flow.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faTimes
@@ -15,20 +18,26 @@ export default {
     error: false
   }),
   computed: {
-    ...mapGetters({
-      authSettings: 'authFlow/settings'
+    ...mapPiniaState(useAuthFlowStore, {
+      authSettings: store => store.settings
     }),
+    ...mapStores(useOAuthStore),
     ...mapState({
       instance: 'instance',
-      oauth: 'oauth'
     })
   },
   methods: {
-    ...mapMutations('authFlow', ['requireTOTP', 'abortMFA']),
-    ...mapActions({ login: 'authFlow/login' }),
+    ...mapActions(useAuthFlowStore, ['requireTOTP', 'abortMFA', 'login']),
     clearError () { this.error = false },
+
+    focusOnCodeInput () {
+      const codeInput = this.$refs.codeInput
+      codeInput.focus()
+      codeInput.setSelectionRange(0, codeInput.value.length)
+    },
+
     submit () {
-      const { clientId, clientSecret } = this.oauth
+      const { clientId, clientSecret } = this.oauthStore
 
       const data = {
         clientId,
@@ -42,6 +51,7 @@ export default {
         if (result.error) {
           this.error = result.error
           this.code = null
+          this.focusOnCodeInput()
           return
         }
 
diff --git a/src/components/mfa_form/recovery_form.vue b/src/components/mfa_form/recovery_form.vue
index 27184fb4e..02f27ddaf 100644
--- a/src/components/mfa_form/recovery_form.vue
+++ b/src/components/mfa_form/recovery_form.vue
@@ -1,9 +1,11 @@
 <template>
-  <div class="login panel panel-default">
+  <div class="login-panel panel panel-default">
     <!-- Default panel contents -->
 
     <div class="panel-heading">
-      {{ $t('login.heading.recovery') }}
+      <h1 class="title">
+        {{ $t('login.heading.recovery') }}
+      </h1>
     </div>
 
     <div class="panel-body">
@@ -15,6 +17,7 @@
           <label for="code">{{ $t('login.recovery_code') }}</label>
           <input
             id="code"
+            ref="codeInput"
             v-model="code"
             class="input form-control"
           >
@@ -69,4 +72,5 @@
     </div>
   </div>
 </template>
+
 <script src="./recovery_form.js"></script>
diff --git a/src/components/mfa_form/totp_form.js b/src/components/mfa_form/totp_form.js
index 6ee823ed3..e369d8a5d 100644
--- a/src/components/mfa_form/totp_form.js
+++ b/src/components/mfa_form/totp_form.js
@@ -1,5 +1,8 @@
 import mfaApi from '../../services/new_api/mfa.js'
-import { mapState, mapGetters, mapActions, mapMutations } from 'vuex'
+import { mapState } from 'vuex'
+import { mapStores, mapActions, mapState as mapPiniaState } from 'pinia'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useAuthFlowStore } from 'src/stores/auth_flow.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faTimes
@@ -15,20 +18,26 @@ export default {
     error: false
   }),
   computed: {
-    ...mapGetters({
-      authSettings: 'authFlow/settings'
+    ...mapPiniaState(useAuthFlowStore, {
+      authSettings: store => store.settings
     }),
+    ...mapStores(useOAuthStore),
     ...mapState({
       instance: 'instance',
-      oauth: 'oauth'
     })
   },
   methods: {
-    ...mapMutations('authFlow', ['requireRecovery', 'abortMFA']),
-    ...mapActions({ login: 'authFlow/login' }),
+    ...mapActions(useAuthFlowStore, ['requireRecovery', 'abortMFA', 'login']),
     clearError () { this.error = false },
+
+    focusOnCodeInput () {
+      const codeInput = this.$refs.codeInput
+      codeInput.focus()
+      codeInput.setSelectionRange(0, codeInput.value.length)
+    },
+
     submit () {
-      const { clientId, clientSecret } = this.oauth
+      const { clientId, clientSecret } = this.oauthStore
 
       const data = {
         clientId,
@@ -42,6 +51,7 @@ export default {
         if (result.error) {
           this.error = result.error
           this.code = null
+          this.focusOnCodeInput()
           return
         }
 
diff --git a/src/components/mfa_form/totp_form.vue b/src/components/mfa_form/totp_form.vue
index 3ec617e9a..b057f0413 100644
--- a/src/components/mfa_form/totp_form.vue
+++ b/src/components/mfa_form/totp_form.vue
@@ -1,9 +1,11 @@
 <template>
-  <div class="login panel panel-default">
+  <div class="login-panel panel panel-default">
     <!-- Default panel contents -->
 
     <div class="panel-heading">
-      {{ $t('login.heading.totp') }}
+      <h1 class="title">
+        {{ $t('login.heading.totp') }}
+      </h1>
     </div>
 
     <div class="panel-body">
@@ -17,6 +19,7 @@
           </label>
           <input
             id="code"
+            ref="codeInput"
             v-model="code"
             class="input form-control"
           >
@@ -72,4 +75,5 @@
     </div>
   </div>
 </template>
+
 <script src="./totp_form.js"></script>
diff --git a/src/components/mobile_drawer.style.js b/src/components/mobile_drawer.style.js
index 398bc186e..0f2cf4e59 100644
--- a/src/components/mobile_drawer.style.js
+++ b/src/components/mobile_drawer.style.js
@@ -2,18 +2,7 @@ export default {
   name: 'MobileDrawer',
   selector: '.mobile-drawer',
   validInnerComponents: [
-    'Text',
-    'Link',
-    'Icon',
-    'Border',
-    'Button',
-    'ButtonUnstyled',
-    'Input',
-    'PanelHeader',
-    'MenuItem',
-    'Notification',
-    'Alert',
-    'UserCard'
+    'MenuItem'
   ],
   defaultRules: [
     {
@@ -21,21 +10,6 @@ export default {
         background: '--bg',
         backgroundNoCssColor: 'yes'
       }
-    },
-    {
-      component: 'PanelHeader',
-      parent: { component: 'MobileDrawer' },
-      directives: {
-        background: '--fg',
-        shadow: [{
-          x: 0,
-          y: 0,
-          blur: 4,
-          spread: 0,
-          color: '#000000',
-          alpha: 0.6
-        }]
-      }
     }
   ]
 }
diff --git a/src/components/mobile_nav/mobile_nav.js b/src/components/mobile_nav/mobile_nav.js
index 8c9261b02..2085d24e3 100644
--- a/src/components/mobile_nav/mobile_nav.js
+++ b/src/components/mobile_nav/mobile_nav.js
@@ -1,13 +1,19 @@
 import SideDrawer from '../side_drawer/side_drawer.vue'
 import Notifications from '../notifications/notifications.vue'
 import ConfirmModal from '../confirm_modal/confirm_modal.vue'
+import GestureService from '../../services/gesture_service/gesture_service'
+import NavigationPins from 'src/components/navigation/navigation_pins.vue'
+
 import {
   unseenNotificationsFromStore,
   countExtraNotifications
 } from '../../services/notification_utils/notification_utils'
-import GestureService from '../../services/gesture_service/gesture_service'
-import NavigationPins from 'src/components/navigation/navigation_pins.vue'
+
 import { mapGetters } from 'vuex'
+import { mapState } from 'pinia'
+import { useAnnouncementsStore } from 'src/stores/announcements'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faTimes,
@@ -68,10 +74,10 @@ const MobileNav = {
     isChat () {
       return this.$route.name === 'chat'
     },
-    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount']),
-    chatsPinned () {
-      return new Set(this.$store.state.serverSideStorage.prefsStorage.collections.pinnedNavItems).has('chats')
-    },
+    ...mapState(useAnnouncementsStore, ['unreadAnnouncementCount']),
+    ...mapState(useServerSideStorageStore, {
+      pinnedItems: store => new Set(store.prefsStorage.collections.pinnedNavItems).has('chats')
+    }),
     shouldConfirmLogout () {
       return this.$store.getters.mergedConfig.modalOnLogout
     },
diff --git a/src/components/mobile_nav/mobile_nav.vue b/src/components/mobile_nav/mobile_nav.vue
index 76a90d3e5..eb950cba0 100644
--- a/src/components/mobile_nav/mobile_nav.vue
+++ b/src/components/mobile_nav/mobile_nav.vue
@@ -50,13 +50,13 @@
       @touchmove.stop="notificationsTouchMove"
     >
       <div class="panel-heading mobile-notifications-header">
-        <span class="title">
+        <h1 class="title">
           {{ $t('notifications.notifications') }}
           <span
             v-if="unseenCountBadgeText"
             class="badge -notification unseen-count"
           >{{ unseenCountBadgeText }}</span>
-        </span>
+        </h1>
         <span class="spacer" />
         <button
           v-if="notificationsAtTop"
@@ -202,6 +202,9 @@
     .title {
       font-size: 1.3em;
       margin-left: 0.6em;
+      white-space: nowrap;
+      overflow-x: hidden;
+      text-overflow: ellipsis;
     }
   }
 
@@ -217,8 +220,7 @@
     margin-top: 3.5em;
     width: 100vw;
     height: calc(100vh - var(--navbar-height));
-    overflow-x: hidden;
-    overflow-y: scroll;
+    overflow: hidden scroll;
 
     .notifications {
       padding: 0;
diff --git a/src/components/mobile_post_status_button/mobile_post_status_button.js b/src/components/mobile_post_status_button/mobile_post_status_button.js
index f7f96cd67..031013559 100644
--- a/src/components/mobile_post_status_button/mobile_post_status_button.js
+++ b/src/components/mobile_post_status_button/mobile_post_status_button.js
@@ -3,6 +3,7 @@ import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faPen
 } from '@fortawesome/free-solid-svg-icons'
+import { usePostStatusStore } from 'src/stores/post_status'
 
 library.add(
   faPen
@@ -71,7 +72,7 @@ const MobilePostStatusButton = {
       window.removeEventListener('scroll', this.handleScrollEnd)
     },
     openPostForm () {
-      this.$store.dispatch('openPostStatusModal')
+      usePostStatusStore().openPostStatusModal()
     },
     handleOSK () {
       // This is a big hack: we're guessing from changed window sizes if the
diff --git a/src/components/mobile_post_status_button/mobile_post_status_button.vue b/src/components/mobile_post_status_button/mobile_post_status_button.vue
index ba77cb2d6..32079c298 100644
--- a/src/components/mobile_post_status_button/mobile_post_status_button.vue
+++ b/src/components/mobile_post_status_button/mobile_post_status_button.vue
@@ -42,7 +42,7 @@
   }
 }
 
-@media all and (min-width: 801px) {
+@media all and (width >= 801px) {
   .new-status-button:not(.always-show) {
     display: none;
   }
diff --git a/src/components/modal/modal.vue b/src/components/modal/modal.vue
index 9f767edeb..032e7dbeb 100644
--- a/src/components/modal/modal.vue
+++ b/src/components/modal/modal.vue
@@ -25,6 +25,7 @@ export default {
       default: false
     }
   },
+  emits: ['backdropClicked'],
   computed: {
     classes () {
       return {
@@ -40,10 +41,7 @@ export default {
 .modal-view {
   z-index: var(--ZI_modals);
   position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
+  inset: 0;
   display: flex;
   justify-content: center;
   align-items: center;
diff --git a/src/components/modal/modals.style.js b/src/components/modal/modals.style.js
index c401a0cda..1cb4a34a7 100644
--- a/src/components/modal/modals.style.js
+++ b/src/components/modal/modals.style.js
@@ -1,7 +1,8 @@
 export default {
   name: 'Modals',
-  selector: '.modal-view',
+  selector: ['.modal-view', '#modal', '.shout-panel'],
   lazy: true,
+  notEditable: true,
   validInnerComponents: [
     'Panel'
   ],
diff --git a/src/components/moderation_tools/moderation_tools.js b/src/components/moderation_tools/moderation_tools.js
index a5ce86560..bd57a353a 100644
--- a/src/components/moderation_tools/moderation_tools.js
+++ b/src/components/moderation_tools/moderation_tools.js
@@ -100,7 +100,7 @@ const ModerationTools = {
       const user = this.user
       const { id, name } = user
       store.state.api.backendInteractor.deleteUser({ user })
-        .then(e => {
+        .then(() => {
           this.$store.dispatch('markStatusesAsDeleted', status => user.id === status.user.id)
           const isProfile = this.$route.name === 'external-user-profile' || this.$route.name === 'user-profile'
           const isTargetUser = this.$route.params.name === name || this.$route.params.id === id
diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue
index df3bb655f..da33b89dc 100644
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@@ -10,119 +10,150 @@
     >
       <template #content>
         <div class="dropdown-menu">
-          <span v-if="canGrantRole">
-            <button
-              class="menu-item dropdown-item menu-item"
-              @click="toggleRight(&quot;admin&quot;)"
-            >
-              {{ $t(!!user.rights.admin ? 'user_card.admin_menu.revoke_admin' : 'user_card.admin_menu.grant_admin') }}
-            </button>
-            <button
-              class="menu-item dropdown-item menu-item"
-              @click="toggleRight(&quot;moderator&quot;)"
-            >
-              {{ $t(!!user.rights.moderator ? 'user_card.admin_menu.revoke_moderator' : 'user_card.admin_menu.grant_moderator') }}
-            </button>
+          <template v-if="canGrantRole">
+            <div class="menu-item dropdown-item -icon-space">
+              <button
+                class="main-button"
+                @click="toggleRight(&quot;admin&quot;)"
+              >
+                {{ $t(!!user.rights.admin ? 'user_card.admin_menu.revoke_admin' : 'user_card.admin_menu.grant_admin') }}
+              </button>
+            </div>
+            <div class="menu-item dropdown-item -icon-space">
+              <button
+                class="main-button"
+                @click="toggleRight(&quot;moderator&quot;)"
+              >
+                {{ $t(!!user.rights.moderator ? 'user_card.admin_menu.revoke_moderator' : 'user_card.admin_menu.grant_moderator') }}
+              </button>
+            </div>
             <div
               v-if="canChangeActivationState || canDeleteAccount"
               role="separator"
               class="dropdown-divider"
             />
-          </span>
-          <button
-            v-if="canChangeActivationState"
-            class="menu-item dropdown-item menu-item"
-            @click="toggleActivationStatus()"
-          >
-            {{ $t(!!user.deactivated ? 'user_card.admin_menu.activate_account' : 'user_card.admin_menu.deactivate_account') }}
-          </button>
-          <button
-            v-if="canDeleteAccount"
-            class="menu-item dropdown-item menu-item"
-            @click="deleteUserDialog(true)"
-          >
-            {{ $t('user_card.admin_menu.delete_account') }}
-          </button>
+          </template>
           <div
-            v-if="canUseTagPolicy"
-            role="separator"
-            class="dropdown-divider"
-          />
-          <span v-if="canUseTagPolicy">
+            v-if="canChangeActivationState"
+            class="menu-item dropdown-item -icon-space"
+          >
             <button
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.FORCE_NSFW)"
+              class="main-button"
+              @click="toggleActivationStatus()"
             >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.FORCE_NSFW) }"
-              />
-              {{ $t('user_card.admin_menu.force_nsfw') }}
+              {{ $t(!!user.deactivated ? 'user_card.admin_menu.activate_account' : 'user_card.admin_menu.deactivate_account') }}
             </button>
+          </div>
+          <div
+            v-if="canDeleteAccount"
+            class="menu-item dropdown-item -icon-space"
+          >
             <button
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.STRIP_MEDIA)"
+              class="main-button"
+              @click="deleteUserDialog(true)"
             >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.STRIP_MEDIA) }"
-              />
-              {{ $t('user_card.admin_menu.strip_media') }}
+              {{ $t('user_card.admin_menu.delete_account') }}
             </button>
-            <button
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.FORCE_UNLISTED)"
-            >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.FORCE_UNLISTED) }"
-              />
-              {{ $t('user_card.admin_menu.force_unlisted') }}
-            </button>
-            <button
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.SANDBOX)"
-            >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.SANDBOX) }"
-              />
-              {{ $t('user_card.admin_menu.sandbox') }}
-            </button>
-            <button
+          </div>
+          <template v-if="canUseTagPolicy">
+            <div
+              role="separator"
+              class="dropdown-divider"
+            />
+            <div class="menu-item dropdown-item -icon">
+              <button
+                class="main-button"
+                @click="toggleTag(tags.FORCE_NSFW)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.FORCE_NSFW) }"
+                />
+                {{ $t('user_card.admin_menu.force_nsfw') }}
+              </button>
+            </div>
+            <div class="menu-item dropdown-item -icon">
+              <button
+                class="main-button"
+                @click="toggleTag(tags.STRIP_MEDIA)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.STRIP_MEDIA) }"
+                />
+                {{ $t('user_card.admin_menu.strip_media') }}
+              </button>
+            </div>
+            <div class="menu-item dropdown-item -icon">
+              <button
+                class="main-button"
+                @click="toggleTag(tags.FORCE_UNLISTED)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.FORCE_UNLISTED) }"
+                />
+                {{ $t('user_card.admin_menu.force_unlisted') }}
+              </button>
+            </div>
+            <div class="menu-item dropdown-item -icon">
+              <button
+                class="main-button"
+                @click="toggleTag(tags.SANDBOX)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.SANDBOX) }"
+                />
+                {{ $t('user_card.admin_menu.sandbox') }}
+              </button>
+            </div>
+            <div
               v-if="user.is_local"
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.DISABLE_REMOTE_SUBSCRIPTION)"
+              class="menu-item dropdown-item -icon"
             >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.DISABLE_REMOTE_SUBSCRIPTION) }"
-              />
-              {{ $t('user_card.admin_menu.disable_remote_subscription') }}
-            </button>
-            <button
+              <button
+                class="main-button"
+                @click="toggleTag(tags.DISABLE_REMOTE_SUBSCRIPTION)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.DISABLE_REMOTE_SUBSCRIPTION) }"
+                />
+                {{ $t('user_card.admin_menu.disable_remote_subscription') }}
+              </button>
+            </div>
+            <div
               v-if="user.is_local"
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.DISABLE_ANY_SUBSCRIPTION)"
+              class="menu-item dropdown-item -icon"
             >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.DISABLE_ANY_SUBSCRIPTION) }"
-              />
-              {{ $t('user_card.admin_menu.disable_any_subscription') }}
-            </button>
-            <button
+              <button
+                class="main-button"
+                @click="toggleTag(tags.DISABLE_ANY_SUBSCRIPTION)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.DISABLE_ANY_SUBSCRIPTION) }"
+                />
+                {{ $t('user_card.admin_menu.disable_any_subscription') }}
+              </button>
+            </div>
+            <div
               v-if="user.is_local"
-              class="menu-item dropdown-item menu-item"
-              @click="toggleTag(tags.QUARANTINE)"
+              class="menu-item dropdown-item -icon"
             >
-              <span
-                class="input menu-checkbox"
-                :class="{ 'menu-checkbox-checked': hasTag(tags.QUARANTINE) }"
-              />
-              {{ $t('user_card.admin_menu.quarantine') }}
-            </button>
-          </span>
+              <button
+                class="main-button"
+                @click="toggleTag(tags.QUARANTINE)"
+              >
+                <span
+                  class="input menu-checkbox"
+                  :class="{ 'menu-checkbox-checked': hasTag(tags.QUARANTINE) }"
+                />
+                {{ $t('user_card.admin_menu.quarantine') }}
+              </button>
+            </div>
+          </template>
         </div>
       </template>
       <template #trigger>
@@ -177,6 +208,8 @@
 }
 
 .moderation-tools-button {
+  white-space: nowrap;
+
   svg,
   i {
     font-size: 0.8em;
diff --git a/src/components/mrf_transparency_panel/mrf_transparency_panel.scss b/src/components/mrf_transparency_panel/mrf_transparency_panel.scss
index a262ed1c5..8e2fa553a 100644
--- a/src/components/mrf_transparency_panel/mrf_transparency_panel.scss
+++ b/src/components/mrf_transparency_panel/mrf_transparency_panel.scss
@@ -4,13 +4,13 @@
   table {
     width: 100%;
     text-align: left;
-    padding-left: 10px;
-    padding-bottom: 20px;
+    padding-left: 0.5em;
+    padding-bottom: 1.1em;
 
     th,
     td {
-      width: 180px;
-      max-width: 360px;
+      width: 11em;
+      max-width: 25em;
       overflow: hidden;
       vertical-align: text-top;
     }
diff --git a/src/components/mrf_transparency_panel/mrf_transparency_panel.vue b/src/components/mrf_transparency_panel/mrf_transparency_panel.vue
index 6dc86738e..cb2436806 100644
--- a/src/components/mrf_transparency_panel/mrf_transparency_panel.vue
+++ b/src/components/mrf_transparency_panel/mrf_transparency_panel.vue
@@ -4,7 +4,7 @@
     class="mrf-transparency-panel"
   >
     <div class="panel panel-default base01-background">
-      <div class="panel-heading timeline-heading base02-background">
+      <div class="panel-heading timeline-heading base02-background -sticky">
         <div class="title">
           {{ $t("about.mrf.federation") }}
         </div>
@@ -32,22 +32,24 @@
             <p>{{ $t("about.mrf.simple.accept_desc") }}</p>
 
             <table>
-              <tr>
-                <th>{{ $t("about.mrf.simple.instance") }}</th>
-                <th>{{ $t("about.mrf.simple.reason") }}</th>
-              </tr>
-              <tr
-                v-for="entry in acceptInstances"
-                :key="entry.instance + '_accept'"
-              >
-                <td>{{ entry.instance }}</td>
-                <td v-if="entry.reason === ''">
-                  {{ $t("about.mrf.simple.not_applicable") }}
-                </td>
-                <td v-else>
-                  {{ entry.reason }}
-                </td>
-              </tr>
+              <tbody>
+                <tr>
+                  <th>{{ $t("about.mrf.simple.instance") }}</th>
+                  <th>{{ $t("about.mrf.simple.reason") }}</th>
+                </tr>
+                <tr
+                  v-for="entry in acceptInstances"
+                  :key="entry.instance + '_accept'"
+                >
+                  <td>{{ entry.instance }}</td>
+                  <td v-if="entry.reason === ''">
+                    {{ $t("about.mrf.simple.not_applicable") }}
+                  </td>
+                  <td v-else>
+                    {{ entry.reason }}
+                  </td>
+                </tr>
+              </tbody>
             </table>
           </div>
 
@@ -57,22 +59,24 @@
             <p>{{ $t("about.mrf.simple.reject_desc") }}</p>
 
             <table>
-              <tr>
-                <th>{{ $t("about.mrf.simple.instance") }}</th>
-                <th>{{ $t("about.mrf.simple.reason") }}</th>
-              </tr>
-              <tr
-                v-for="entry in rejectInstances"
-                :key="entry.instance + '_reject'"
-              >
-                <td>{{ entry.instance }}</td>
-                <td v-if="entry.reason === ''">
-                  {{ $t("about.mrf.simple.not_applicable") }}
-                </td>
-                <td v-else>
-                  {{ entry.reason }}
-                </td>
-              </tr>
+              <tbody>
+                <tr>
+                  <th>{{ $t("about.mrf.simple.instance") }}</th>
+                  <th>{{ $t("about.mrf.simple.reason") }}</th>
+                </tr>
+                <tr
+                  v-for="entry in rejectInstances"
+                  :key="entry.instance + '_reject'"
+                >
+                  <td>{{ entry.instance }}</td>
+                  <td v-if="entry.reason === ''">
+                    {{ $t("about.mrf.simple.not_applicable") }}
+                  </td>
+                  <td v-else>
+                    {{ entry.reason }}
+                  </td>
+                </tr>
+              </tbody>
             </table>
           </div>
 
@@ -82,22 +86,24 @@
             <p>{{ $t("about.mrf.simple.quarantine_desc") }}</p>
 
             <table>
-              <tr>
-                <th>{{ $t("about.mrf.simple.instance") }}</th>
-                <th>{{ $t("about.mrf.simple.reason") }}</th>
-              </tr>
-              <tr
-                v-for="entry in quarantineInstances"
-                :key="entry.instance + '_quarantine'"
-              >
-                <td>{{ entry.instance }}</td>
-                <td v-if="entry.reason === ''">
-                  {{ $t("about.mrf.simple.not_applicable") }}
-                </td>
-                <td v-else>
-                  {{ entry.reason }}
-                </td>
-              </tr>
+              <tbody>
+                <tr>
+                  <th>{{ $t("about.mrf.simple.instance") }}</th>
+                  <th>{{ $t("about.mrf.simple.reason") }}</th>
+                </tr>
+                <tr
+                  v-for="entry in quarantineInstances"
+                  :key="entry.instance + '_quarantine'"
+                >
+                  <td>{{ entry.instance }}</td>
+                  <td v-if="entry.reason === ''">
+                    {{ $t("about.mrf.simple.not_applicable") }}
+                  </td>
+                  <td v-else>
+                    {{ entry.reason }}
+                  </td>
+                </tr>
+              </tbody>
             </table>
           </div>
 
@@ -107,22 +113,24 @@
             <p>{{ $t("about.mrf.simple.ftl_removal_desc") }}</p>
 
             <table>
-              <tr>
-                <th>{{ $t("about.mrf.simple.instance") }}</th>
-                <th>{{ $t("about.mrf.simple.reason") }}</th>
-              </tr>
-              <tr
-                v-for="entry in ftlRemovalInstances"
-                :key="entry.instance + '_ftl_removal'"
-              >
-                <td>{{ entry.instance }}</td>
-                <td v-if="entry.reason === ''">
-                  {{ $t("about.mrf.simple.not_applicable") }}
-                </td>
-                <td v-else>
-                  {{ entry.reason }}
-                </td>
-              </tr>
+              <tbody>
+                <tr>
+                  <th>{{ $t("about.mrf.simple.instance") }}</th>
+                  <th>{{ $t("about.mrf.simple.reason") }}</th>
+                </tr>
+                <tr
+                  v-for="entry in ftlRemovalInstances"
+                  :key="entry.instance + '_ftl_removal'"
+                >
+                  <td>{{ entry.instance }}</td>
+                  <td v-if="entry.reason === ''">
+                    {{ $t("about.mrf.simple.not_applicable") }}
+                  </td>
+                  <td v-else>
+                    {{ entry.reason }}
+                  </td>
+                </tr>
+              </tbody>
             </table>
           </div>
 
@@ -132,22 +140,24 @@
             <p>{{ $t("about.mrf.simple.media_nsfw_desc") }}</p>
 
             <table>
-              <tr>
-                <th>{{ $t("about.mrf.simple.instance") }}</th>
-                <th>{{ $t("about.mrf.simple.reason") }}</th>
-              </tr>
-              <tr
-                v-for="entry in mediaNsfwInstances"
-                :key="entry.instance + '_media_nsfw'"
-              >
-                <td>{{ entry.instance }}</td>
-                <td v-if="entry.reason === ''">
-                  {{ $t("about.mrf.simple.not_applicable") }}
-                </td>
-                <td v-else>
-                  {{ entry.reason }}
-                </td>
-              </tr>
+              <tbody>
+                <tr>
+                  <th>{{ $t("about.mrf.simple.instance") }}</th>
+                  <th>{{ $t("about.mrf.simple.reason") }}</th>
+                </tr>
+                <tr
+                  v-for="entry in mediaNsfwInstances"
+                  :key="entry.instance + '_media_nsfw'"
+                >
+                  <td>{{ entry.instance }}</td>
+                  <td v-if="entry.reason === ''">
+                    {{ $t("about.mrf.simple.not_applicable") }}
+                  </td>
+                  <td v-else>
+                    {{ entry.reason }}
+                  </td>
+                </tr>
+              </tbody>
             </table>
           </div>
 
@@ -157,22 +167,24 @@
             <p>{{ $t("about.mrf.simple.media_removal_desc") }}</p>
 
             <table>
-              <tr>
-                <th>{{ $t("about.mrf.simple.instance") }}</th>
-                <th>{{ $t("about.mrf.simple.reason") }}</th>
-              </tr>
-              <tr
-                v-for="entry in mediaRemovalInstances"
-                :key="entry.instance + '_media_removal'"
-              >
-                <td>{{ entry.instance }}</td>
-                <td v-if="entry.reason === ''">
-                  {{ $t("about.mrf.simple.not_applicable") }}
-                </td>
-                <td v-else>
-                  {{ entry.reason }}
-                </td>
-              </tr>
+              <tbody>
+                <tr>
+                  <th>{{ $t("about.mrf.simple.instance") }}</th>
+                  <th>{{ $t("about.mrf.simple.reason") }}</th>
+                </tr>
+                <tr
+                  v-for="entry in mediaRemovalInstances"
+                  :key="entry.instance + '_media_removal'"
+                >
+                  <td>{{ entry.instance }}</td>
+                  <td v-if="entry.reason === ''">
+                    {{ $t("about.mrf.simple.not_applicable") }}
+                  </td>
+                  <td v-else>
+                    {{ entry.reason }}
+                  </td>
+                </tr>
+              </tbody>
             </table>
           </div>
 
@@ -226,6 +238,4 @@
 
 <script src="./mrf_transparency_panel.js"></script>
 
-<style lang="scss">
-@import "./mrf_transparency_panel";
-</style>
+<style src="./mrf_transparency_panel.scss" lang="scss" />
diff --git a/src/components/mute_card/mute_card.js b/src/components/mute_card/mute_card.js
index cbec0e9bb..895586888 100644
--- a/src/components/mute_card/mute_card.js
+++ b/src/components/mute_card/mute_card.js
@@ -1,12 +1,8 @@
 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
+import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
 
 const MuteCard = {
   props: ['userId'],
-  data () {
-    return {
-      progress: false
-    }
-  },
   computed: {
     user () {
       return this.$store.getters.findUser(this.userId)
@@ -16,23 +12,26 @@ const MuteCard = {
     },
     muted () {
       return this.relationship.muting
+    },
+    muteExpiryAvailable () {
+      return this.user.mute_expires_at !== undefined
+    },
+    muteExpiry () {
+      return this.user.mute_expires_at == null
+        ? this.$t('user_card.mute_expires_forever')
+        : this.$t('user_card.mute_expires_at', [new Date(this.user.mute_expires_at).toLocaleString()])
     }
   },
   components: {
-    BasicUserCard
+    BasicUserCard,
+    UserTimedFilterModal
   },
   methods: {
     unmuteUser () {
-      this.progress = true
-      this.$store.dispatch('unmuteUser', this.userId).then(() => {
-        this.progress = false
-      })
+      this.$store.dispatch('unmuteUser', this.userId)
     },
     muteUser () {
-      this.progress = true
-      this.$store.dispatch('muteUser', this.userId).then(() => {
-        this.progress = false
-      })
+      this.$refs.timedMuteDialog.optionallyPrompt()
     }
   }
 }
diff --git a/src/components/mute_card/mute_card.vue b/src/components/mute_card/mute_card.vue
index 97e91cbca..83520dc22 100644
--- a/src/components/mute_card/mute_card.vue
+++ b/src/components/mute_card/mute_card.vue
@@ -1,33 +1,35 @@
 <template>
   <basic-user-card :user="user">
     <div class="mute-card-content-container">
+      <span
+        v-if="muted && muteExpiryAvailable"
+        class="alert neutral"
+      >
+        {{ muteExpiry }}
+      </span>
+      {{ ' ' }}
       <button
         v-if="muted"
         class="btn button-default"
-        :disabled="progress"
         @click="unmuteUser"
       >
-        <template v-if="progress">
-          {{ $t('user_card.unmute_progress') }}
-        </template>
-        <template v-else>
-          {{ $t('user_card.unmute') }}
-        </template>
+        {{ $t('user_card.unmute') }}
       </button>
       <button
         v-else
         class="btn button-default"
-        :disabled="progress"
         @click="muteUser"
       >
-        <template v-if="progress">
-          {{ $t('user_card.mute_progress') }}
-        </template>
-        <template v-else>
-          {{ $t('user_card.mute') }}
-        </template>
+        {{ $t('user_card.mute') }}
       </button>
     </div>
+    <teleport to="#modal">
+      <UserTimedFilterModal
+        ref="timedMuteDialog"
+        :user="user"
+        :is-mute="true"
+      />
+    </teleport>
   </basic-user-card>
 </template>
 
diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js
index 11863e975..a155abe0c 100644
--- a/src/components/nav_panel/nav_panel.js
+++ b/src/components/nav_panel/nav_panel.js
@@ -1,16 +1,21 @@
 import BookmarkFoldersMenuContent from 'src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue'
 import ListsMenuContent from 'src/components/lists_menu/lists_menu_content.vue'
 import { mapState, mapGetters } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import { TIMELINES, ROOT_ITEMS } from 'src/components/navigation/navigation.js'
 import { filterNavigation } from 'src/components/navigation/filter.js'
 import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
 import NavigationPins from 'src/components/navigation/navigation_pins.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 
+import { useAnnouncementsStore } from 'src/stores/announcements'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faUsers,
   faGlobe,
+  faCity,
   faBookmark,
   faEnvelope,
   faChevronDown,
@@ -20,12 +25,14 @@ import {
   faInfoCircle,
   faStream,
   faList,
-  faBullhorn
+  faBullhorn,
+  faFilePen
 } from '@fortawesome/free-solid-svg-icons'
 
 library.add(
   faUsers,
   faGlobe,
+  faCity,
   faBookmark,
   faEnvelope,
   faChevronDown,
@@ -35,7 +42,8 @@ library.add(
   faInfoCircle,
   faStream,
   faList,
-  faBullhorn
+  faBullhorn,
+  faFilePen
 )
 const NavPanel = {
   props: ['forceExpand', 'forceEditMode'],
@@ -72,37 +80,45 @@ const NavPanel = {
       this.editMode = !this.editMode
     },
     toggleCollapse () {
-      this.$store.commit('setPreference', { path: 'simple.collapseNav', value: !this.collapsed })
-      this.$store.dispatch('pushServerSideStorage')
+      useServerSideStorageStore().setPreference({ path: 'simple.collapseNav', value: !this.collapsed })
+      useServerSideStorageStore().pushServerSideStorage()
     },
     isPinned (item) {
       return this.pinnedItems.has(item)
     },
     togglePin (item) {
       if (this.isPinned(item)) {
-        this.$store.commit('removeCollectionPreference', { path: 'collections.pinnedNavItems', value: item })
+        useServerSideStorageStore().removeCollectionPreference({ path: 'collections.pinnedNavItems', value: item })
       } else {
-        this.$store.commit('addCollectionPreference', { path: 'collections.pinnedNavItems', value: item })
+        useServerSideStorageStore().addCollectionPreference({ path: 'collections.pinnedNavItems', value: item })
       }
-      this.$store.dispatch('pushServerSideStorage')
+      useServerSideStorageStore().pushServerSideStorage()
     }
   },
   computed: {
+    ...mapPiniaState(useAnnouncementsStore, {
+      unreadAnnouncementCount: 'unreadAnnouncementCount',
+      supportsAnnouncements: store => store.supportsAnnouncements
+    }),
+    ...mapPiniaState(useServerSideStorageStore, {
+      collapsed: store => store.prefsStorage.simple.collapseNav,
+      pinnedItems: store => new Set(store.prefsStorage.collections.pinnedNavItems)
+    }),
     ...mapState({
       currentUser: state => state.users.currentUser,
       followRequestCount: state => state.api.followRequests.length,
       privateMode: state => state.instance.private,
       federating: state => state.instance.federating,
       pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable,
-      supportsAnnouncements: state => state.announcements.supportsAnnouncements,
-      pinnedItems: state => new Set(state.serverSideStorage.prefsStorage.collections.pinnedNavItems),
-      collapsed: state => state.serverSideStorage.prefsStorage.simple.collapseNav,
-      bookmarkFolders: state => state.instance.pleromaBookmarkFoldersAvailable
+      bookmarkFolders: state => state.instance.pleromaBookmarkFoldersAvailable,
+      bubbleTimeline: state => state.instance.localBubbleInstances.length > 0
     }),
     timelinesItems () {
       return filterNavigation(
         Object
           .entries({ ...TIMELINES })
+          // do not show in timeliens list since it's in a better place now
+          .filter(([key]) => key !== 'bookmarks')
           .map(([k, v]) => ({ ...v, name: k })),
         {
           hasChats: this.pleromaChatMessagesAvailable,
@@ -110,6 +126,7 @@ const NavPanel = {
           isFederating: this.federating,
           isPrivate: this.privateMode,
           currentUser: this.currentUser,
+          supportsBubbleTimeline: this.bubbleTimeline,
           supportsBookmarkFolders: this.bookmarkFolders
         }
       )
@@ -125,11 +142,12 @@ const NavPanel = {
           isFederating: this.federating,
           isPrivate: this.privateMode,
           currentUser: this.currentUser,
+          supportsBubbleTimeline: this.bubbleTimeline,
           supportsBookmarkFolders: this.bookmarkFolders
         }
       )
     },
-    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
+    ...mapGetters(['unreadChatCount'])
   }
 }
 
diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
index a19e9ba55..10903bcae 100644
--- a/src/components/nav_panel/nav_panel.vue
+++ b/src/components/nav_panel/nav_panel.vue
@@ -113,6 +113,7 @@
           :class="{ '-expanded': showBookmarkFolders }"
         >
           <BookmarkFoldersMenuContent
+            :show-pin="editMode || forceEditMode"
             class="timelines"
           />
         </div>
@@ -125,7 +126,7 @@
         <NavigationEntry
           v-if="!forceEditMode && currentUser"
           :show-pin="false"
-          :item="{ label: editMode ? $t('nav.edit_finish') : $t('nav.edit_pinned'), icon: editMode ? 'check' : 'wrench' }"
+          :item="{ labelRaw: editMode ? $t('nav.edit_finish') : $t('nav.edit_pinned'), icon: editMode ? 'check' : 'wrench' }"
           @click="toggleEditMode"
         />
       </ul>
@@ -154,11 +155,6 @@
     font-size: 1.1em;
   }
 
-  .timelines-chevron {
-    margin-left: 0.8em;
-    font-size: 1.1em;
-  }
-
   .timelines-background {
     padding: 0 0 0 0.6em;
   }
diff --git a/src/components/navigation/filter.js b/src/components/navigation/filter.js
index 9b8f43cba..54abb67b4 100644
--- a/src/components/navigation/filter.js
+++ b/src/components/navigation/filter.js
@@ -1,4 +1,12 @@
-export const filterNavigation = (list = [], { hasChats, hasAnnouncements, isFederating, isPrivate, currentUser, supportsBookmarkFolders }) => {
+export const filterNavigation = (list = [], {
+  hasChats,
+  hasAnnouncements,
+  isFederating,
+  isPrivate,
+  currentUser,
+  supportsBookmarkFolders,
+  supportsBubbleTimeline
+}) => {
   return list.filter(({ criteria, anon, anonRoute }) => {
     const set = new Set(criteria || [])
     if (!isFederating && set.has('federating')) return false
@@ -7,23 +15,25 @@ export const filterNavigation = (list = [], { hasChats, hasAnnouncements, isFede
     if ((!currentUser || !currentUser.locked) && set.has('lockedUser')) return false
     if (!hasChats && set.has('chats')) return false
     if (!hasAnnouncements && set.has('announcements')) return false
+    if (!supportsBubbleTimeline && set.has('supportsBubbleTimeline')) return false
+    if (!supportsBookmarkFolders && set.has('supportsBookmarkFolders')) return false
     if (supportsBookmarkFolders && set.has('!supportsBookmarkFolders')) return false
     return true
   })
 }
 
-export const getListEntries = state => state.lists.allLists.map(list => ({
+export const getListEntries = store => store.allLists.map(list => ({
   name: 'list-' + list.id,
   routeObject: { name: 'lists-timeline', params: { id: list.id } },
   labelRaw: list.title,
   iconLetter: list.title[0]
 }))
 
-export const getBookmarkFolderEntries = state => state.bookmarkFolders.allFolders.map(folder => ({
+export const getBookmarkFolderEntries = store => store.allFolders ? store.allFolders.map(folder => ({
   name: 'bookmark-folder-' + folder.id,
   routeObject: { name: 'bookmark-folder', params: { id: folder.id } },
   labelRaw: folder.name,
   iconEmoji: folder.emoji,
   iconEmojiUrl: folder.emoji_url,
   iconLetter: folder.name[0]
-}))
+})) : []
diff --git a/src/components/navigation/navigation.js b/src/components/navigation/navigation.js
index 9fc264baa..d1c2b6763 100644
--- a/src/components/navigation/navigation.js
+++ b/src/components/navigation/navigation.js
@@ -1,11 +1,16 @@
+// routes that take :username property
 export const USERNAME_ROUTES = new Set([
-  'bookmarks',
   'dms',
   'interactions',
   'notifications',
   'chat',
-  'chats',
-  'user-profile'
+  'chats'
+])
+
+// routes that take :name property
+export const NAME_ROUTES = new Set([
+  'user-profile',
+  'legacy-user-profile'
 ])
 
 export const TIMELINES = {
@@ -22,6 +27,13 @@ export const TIMELINES = {
     label: 'nav.public_tl',
     criteria: ['!private']
   },
+  bubble: {
+    route: 'bubble',
+    anon: true,
+    icon: 'city',
+    label: 'nav.bubble',
+    criteria: ['!private', 'federating', 'supportsBubbleTimeline']
+  },
   twkn: {
     route: 'public-external-timeline',
     anon: true,
@@ -29,11 +41,11 @@ export const TIMELINES = {
     label: 'nav.twkn',
     criteria: ['!private', 'federating']
   },
+  // bookmarks are still technically a timeline so we should show it in the dropdown
   bookmarks: {
     route: 'bookmarks',
     icon: 'bookmark',
     label: 'nav.bookmarks',
-    criteria: ['!supportsBookmarkFolders']
   },
   favorites: {
     routeObject: { name: 'user-profile', query: { tab: 'favorites' } },
@@ -48,6 +60,15 @@ export const TIMELINES = {
 }
 
 export const ROOT_ITEMS = {
+  bookmarks: {
+    route: 'bookmarks',
+    icon: 'bookmark',
+    label: 'nav.bookmarks',
+    // shows bookmarks entry in a better suited location
+    // hides it when bookmark folders are supported since
+    // we show custom component instead of it
+    criteria: ['!supportsBookmarkFolders']
+  },
   interactions: {
     route: 'interactions',
     icon: 'bell',
@@ -57,6 +78,7 @@ export const ROOT_ITEMS = {
     route: 'chats',
     icon: 'comments',
     label: 'nav.chats',
+    badgeStyle: 'notification',
     badgeGetter: 'unreadChatCount',
     criteria: ['chats']
   },
@@ -64,6 +86,7 @@ export const ROOT_ITEMS = {
     route: 'friend-requests',
     icon: 'user-plus',
     label: 'nav.friend_requests',
+    badgeStyle: 'notification',
     criteria: ['lockedUser'],
     badgeGetter: 'followRequestCount'
   },
@@ -77,8 +100,17 @@ export const ROOT_ITEMS = {
     route: 'announcements',
     icon: 'bullhorn',
     label: 'nav.announcements',
+    store: 'announcements',
+    badgeStyle: 'notification',
     badgeGetter: 'unreadAnnouncementCount',
     criteria: ['announcements']
+  },
+  drafts: {
+    route: 'drafts',
+    icon: 'file-pen',
+    label: 'nav.drafts',
+    badgeStyle: 'neutral',
+    badgeGetter: 'draftCount'
   }
 }
 
@@ -94,7 +126,9 @@ export function routeTo (item, currentUser) {
   }
 
   if (USERNAME_ROUTES.has(route.name)) {
-    route.params = { username: currentUser.screen_name, name: currentUser.screen_name }
+    route.params = { username: currentUser.screen_name }
+  } else if (NAME_ROUTES.has(route.name)) {
+    route.params = { name: currentUser.screen_name }
   }
 
   return route
diff --git a/src/components/navigation/navigation_entry.js b/src/components/navigation/navigation_entry.js
index 22ed77d9d..11db1c9e3 100644
--- a/src/components/navigation/navigation_entry.js
+++ b/src/components/navigation/navigation_entry.js
@@ -3,6 +3,10 @@ import { routeTo } from 'src/components/navigation/navigation.js'
 import OptionalRouterLink from 'src/components/optional_router_link/optional_router_link.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faThumbtack } from '@fortawesome/free-solid-svg-icons'
+import { mapStores, mapState as mapPiniaState } from 'pinia'
+
+import { useAnnouncementsStore } from 'src/stores/announcements'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
 
 library.add(faThumbtack)
 
@@ -17,11 +21,11 @@ const NavigationEntry = {
     },
     togglePin (value) {
       if (this.isPinned(value)) {
-        this.$store.commit('removeCollectionPreference', { path: 'collections.pinnedNavItems', value })
+        useServerSideStorageStore().removeCollectionPreference({ path: 'collections.pinnedNavItems', value })
       } else {
-        this.$store.commit('addCollectionPreference', { path: 'collections.pinnedNavItems', value })
+        useServerSideStorageStore().addCollectionPreference({ path: 'collections.pinnedNavItems', value })
       }
-      this.$store.dispatch('pushServerSideStorage')
+      useServerSideStorageStore().pushServerSideStorage()
     }
   },
   computed: {
@@ -31,10 +35,13 @@ const NavigationEntry = {
     getters () {
       return this.$store.getters
     },
+    ...mapStores(useAnnouncementsStore),
     ...mapState({
-      currentUser: state => state.users.currentUser,
-      pinnedItems: state => new Set(state.serverSideStorage.prefsStorage.collections.pinnedNavItems)
-    })
+      currentUser: state => state.users.currentUser
+    }),
+    ...mapPiniaState(useServerSideStorageStore, {
+      pinnedItems: store => new Set(store.prefsStorage.collections.pinnedNavItems)
+    }),
   }
 }
 
diff --git a/src/components/navigation/navigation_entry.vue b/src/components/navigation/navigation_entry.vue
index 024ee3148..3ab0355b1 100644
--- a/src/components/navigation/navigation_entry.vue
+++ b/src/components/navigation/navigation_entry.vue
@@ -48,10 +48,17 @@
       <slot />
       <div
         v-if="item.badgeGetter && getters[item.badgeGetter]"
-        class="badge -notification"
+        class="badge"
+        :class="[`-${item.badgeStyle}`]"
       >
         {{ getters[item.badgeGetter] }}
       </div>
+      <div
+        v-else-if="item.badgeGetter && item.store && this[`${item.store}Store`][item.badgeGetter]"
+        class="badge badge-notification"
+      >
+        {{ this[`${item.store}Store`][item.badgeGetter] }}
+      </div>
       <button
         v-if="showPin && currentUser"
         type="button"
@@ -81,8 +88,12 @@
   --__horizontal-gap: 0.5em;
   --__vertical-gap: 0.4em;
 
-  padding: 0;
-  display: flex;
+  padding: var(--__vertical-gap) var(--__horizontal-gap);
+  display: grid;
+  grid-template-columns: 1fr;
+  grid-auto-columns: var(--__line-height);
+  grid-auto-flow: column;
+  grid-gap: var(--__horizontal-gap);
   align-items: baseline;
 
   &[aria-expanded] {
@@ -92,8 +103,6 @@
   .main-link {
     line-height: var(--__line-height);
     box-sizing: border-box;
-    flex: 1;
-    padding: var(--__vertical-gap) var(--__horizontal-gap);
   }
 
   .menu-icon {
@@ -103,26 +112,16 @@
     margin-right: var(--__horizontal-gap);
   }
 
-  .timelines-chevron {
-    line-height: var(--__line-height);
-    padding: 0;
-    width: var(--__line-height);
-    margin-right: 0;
-  }
-
+  .timelines-chevron,
   .extra-button {
     line-height: var(--__line-height);
+    width: 100%;
     padding: 0;
-    width: var(--__line-height);
     text-align: center;
-
-    &:last-child {
-      margin-right: calc(-1 * var(--__horizontal-gap));
-    }
   }
 
   .badge {
-    margin: 0 var(--__horizontal-gap);
+    justify-self: center;
   }
 
   .iconEmoji {
diff --git a/src/components/navigation/navigation_pins.js b/src/components/navigation/navigation_pins.js
index 86c33d1fb..f9a900fc6 100644
--- a/src/components/navigation/navigation_pins.js
+++ b/src/components/navigation/navigation_pins.js
@@ -1,11 +1,15 @@
 import { mapState } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import { TIMELINES, ROOT_ITEMS, routeTo } from 'src/components/navigation/navigation.js'
-import { getListEntries, filterNavigation } from 'src/components/navigation/filter.js'
+import { getBookmarkFolderEntries, getListEntries, filterNavigation } from 'src/components/navigation/filter.js'
+
+import StillImage from 'src/components/still-image/still-image.vue'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faUsers,
   faGlobe,
+  faCity,
   faBookmark,
   faEnvelope,
   faComments,
@@ -14,10 +18,15 @@ import {
   faStream,
   faList
 } from '@fortawesome/free-solid-svg-icons'
+import { useListsStore } from 'src/stores/lists'
+import { useAnnouncementsStore } from 'src/stores/announcements'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
 
 library.add(
   faUsers,
   faGlobe,
+  faCity,
   faBookmark,
   faEnvelope,
   faComments,
@@ -34,19 +43,32 @@ const NavPanel = {
       return routeTo(item, this.currentUser)
     }
   },
+  components: {
+    StillImage
+  },
   computed: {
     getters () {
       return this.$store.getters
     },
+    ...mapPiniaState(useListsStore, {
+      lists: getListEntries
+    }),
+    ...mapPiniaState(useAnnouncementsStore, {
+      supportsAnnouncements: store => store.supportsAnnouncements
+    }),
+    ...mapPiniaState(useBookmarkFoldersStore, {
+      bookmarks: getBookmarkFolderEntries,
+    }),
+    ...mapPiniaState(useServerSideStorageStore, {
+      pinnedItems: store => new Set(store.prefsStorage.collections.pinnedNavItems)
+    }),
     ...mapState({
-      lists: getListEntries,
       currentUser: state => state.users.currentUser,
       followRequestCount: state => state.api.followRequests.length,
       privateMode: state => state.instance.private,
       federating: state => state.instance.federating,
       pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable,
-      supportsAnnouncements: state => state.announcements.supportsAnnouncements,
-      pinnedItems: state => new Set(state.serverSideStorage.prefsStorage.collections.pinnedNavItems)
+      bubbleTimeline: state => state.instance.localBubbleInstances.length > 0
     }),
     pinnedList () {
       if (!this.currentUser) {
@@ -60,7 +82,9 @@ const NavPanel = {
           hasAnnouncements: this.supportsAnnouncements,
           isFederating: this.federating,
           isPrivate: this.privateMode,
-          currentUser: this.currentUser
+          currentUser: this.currentUser,
+          supportsBubbleTimeline: this.bubbleTimeline,
+          supportsBookmarkFolders: this.bookmarks
         })
       }
       return filterNavigation(
@@ -70,6 +94,7 @@ const NavPanel = {
             .filter(([k]) => this.pinnedItems.has(k))
             .map(([k, v]) => ({ ...v, name: k })),
           ...this.lists.filter((k) => this.pinnedItems.has(k.name)),
+          ...this.bookmarks.filter((k) => this.pinnedItems.has(k.name)),
           ...Object
             .entries({ ...ROOT_ITEMS })
             .filter(([k]) => this.pinnedItems.has(k))
@@ -78,6 +103,8 @@ const NavPanel = {
         {
           hasChats: this.pleromaChatMessagesAvailable,
           hasAnnouncements: this.supportsAnnouncements,
+          supportsBubbleTimeline: this.bubbleTimeline,
+          supportsBookmarkFolders: this.bookmarks,
           isFederating: this.federating,
           isPrivate: this.privateMode,
           currentUser: this.currentUser
diff --git a/src/components/navigation/navigation_pins.vue b/src/components/navigation/navigation_pins.vue
index decd1c04b..a9d11da87 100644
--- a/src/components/navigation/navigation_pins.vue
+++ b/src/components/navigation/navigation_pins.vue
@@ -14,12 +14,18 @@
         :icon="item.icon"
       />
       <span
-        v-if="item.iconLetter"
+        v-if="item.iconLetter && !item.iconEmoji"
         class="iconLetter fa-scale-110 fa-old-padding"
       >{{ item.iconLetter }}</span>
+      <StillImage
+        v-if="item.iconEmoji"
+        class="bookmark-emoji"
+        :src="item.iconEmojiUrl"
+      />
       <div
         v-if="item.badgeGetter && getters[item.badgeGetter]"
-        class="badge -dot -notification"
+        class="badge -dot"
+        :class="[`-${item.badgeStyle}`]"
       />
     </router-link>
   </span>
@@ -34,6 +40,14 @@
   overflow: hidden;
   height: 100%;
 
+  &.alert-dot-notification {
+    background-color: var(--badgeNotification);
+  }
+
+  &.alert-dot-neutral {
+    background-color: var(--badgeNeutral);
+  }
+
   .pinned-item {
     position: relative;
     flex: 1 0 3em;
@@ -43,6 +57,13 @@
     box-sizing: border-box;
     height: 100%;
 
+    .bookmark-emoji {
+      height: 100%;
+      box-sizing: border-box;
+      padding: 0.5em;
+    }
+
+    & .bookmark-emoji,
     & .svg-inline--fa,
     & .iconLetter {
       margin: 0;
diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js
index 0e938c422..3edf21de7 100644
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@@ -42,8 +42,8 @@ library.add(
 const Notification = {
   data () {
     return {
+      selecting: false,
       statusExpanded: false,
-      betterShadow: this.$store.state.interface.browserSupport.cssFilter,
       unmuted: false,
       showingApproveConfirmDialog: false,
       showingDenyConfirmDialog: false
@@ -63,10 +63,35 @@ const Notification = {
     UserLink,
     ConfirmModal
   },
+  mounted () {
+    document.addEventListener('selectionchange', this.onContentSelect)
+  },
+  unmounted () {
+    document.removeEventListener('selectionchange', this.onContentSelect)
+  },
   methods: {
     toggleStatusExpanded () {
+      if (!this.expandable) return
       this.statusExpanded = !this.statusExpanded
     },
+    onContentSelect () {
+      const { isCollapsed, anchorNode, offsetNode } = document.getSelection()
+      if (isCollapsed) {
+        this.selecting = false
+        return
+      }
+      const within = this.$refs.root.contains(anchorNode) || this.$refs.root.contains(offsetNode)
+      if (within) {
+        this.selecting = true
+      } else {
+        this.selecting = false
+      }
+    },
+    onContentClick (e) {
+      if (!this.selecting && !e.target.closest('a') && !e.target.closest('button')) {
+        this.toggleStatusExpanded()
+      }
+    },
     generateUserProfileLink (user) {
       return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
     },
@@ -137,6 +162,9 @@ const Notification = {
       const user = this.notification.from_profile
       return highlightStyle(highlight[user.screen_name])
     },
+    expandable () {
+      return (new Set(['like', 'pleroma:emoji_reaction', 'repeat'])).has(this.notification.type)
+    },
     user () {
       return this.$store.getters.findUser(this.notification.from_profile.id)
     },
diff --git a/src/components/notification/notification.scss b/src/components/notification/notification.scss
index 0ca6aea77..934d3e58d 100644
--- a/src/components/notification/notification.scss
+++ b/src/components/notification/notification.scss
@@ -1,16 +1,21 @@
 // TODO Copypaste from Status, should unify it somehow
+
 .Notification {
   border-bottom: 1px solid;
   border-color: var(--border);
-  word-wrap: break-word;
-  word-break: break-word;
+  overflow-wrap: break-word;
+  text-wrap: pretty;
+
+  .status-content {
+    cursor: pointer;
+  }
 
   &.Status {
     /* stylelint-disable-next-line declaration-no-important */
     background-color: transparent !important;
   }
 
-  --emoji-size: 14px;
+  --emoji-size: 1em;
 
   &:hover {
     --_still-image-img-visibility: visible;
@@ -31,8 +36,6 @@
     & .status-username,
     & .mute-thread,
     & .mute-words {
-      word-wrap: normal;
-      word-break: normal;
       white-space: nowrap;
     }
 
diff --git a/src/components/notification/notification.style.js b/src/components/notification/notification.style.js
index c6d317d1c..05c1f6f23 100644
--- a/src/components/notification/notification.style.js
+++ b/src/components/notification/notification.style.js
@@ -6,12 +6,7 @@ export default {
     'Link',
     'Icon',
     'Border',
-    'Button',
-    'ButtonUnstyled',
-    'RichContent',
-    'Input',
     'Avatar',
-    'Attachment',
     'PollGraph'
   ],
   defaultRules: []
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index f84b75de3..7165289dc 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -1,6 +1,7 @@
 <template>
   <article
     v-if="notification.type === 'mention' || notification.type === 'status'"
+    ref="root"
   >
     <Status
       class="Notification"
@@ -9,9 +10,17 @@
       @interacted="interacted"
     />
   </article>
-  <article v-else>
+  <article
+    v-else
+    ref="root"
+    class="NotificationParent"
+    :class="{ '-expandable': expandable }"
+  >
     <div
       v-if="needMute && !unmuted"
+      :id="'notif-' +notification.id"
+      :aria-expanded="statusExpanded"
+      :aria-controls="'notif-' +notification.id"
       class="Notification container -muted"
     >
       <small>
@@ -47,9 +56,7 @@
         >
           <UserAvatar
             class="post-avatar"
-            :bot="botIndicator"
             :compact="true"
-            :better-shadow="betterShadow"
             :user="notification.from_profile"
           />
         </UserPopover>
@@ -64,6 +71,7 @@
                 :title="'@'+notification.from_profile.screen_name_ui"
                 :html="notification.from_profile.name_html"
                 :emoji="notification.from_profile.emoji"
+                :is-local="notification.from_profile.is_local"
               />
             </bdi>
             <!-- eslint-enable vue/no-v-html -->
@@ -247,8 +255,11 @@
         />
         <template v-else>
           <StatusContent
+            class="status-content"
             :compact="!statusExpanded"
             :status="notification.status"
+            :collapse="!statusExpanded"
+            @click="onContentClick"
           />
         </template>
       </div>
diff --git a/src/components/notifications/notification_filters.vue b/src/components/notifications/notification_filters.vue
index 497a5156f..0b740ea0a 100644
--- a/src/components/notifications/notification_filters.vue
+++ b/src/components/notifications/notification_filters.vue
@@ -7,78 +7,94 @@
   >
     <template #content>
       <div class="dropdown-menu">
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('likes')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.likes }"
-          />{{ $t('settings.notification_visibility_likes') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('repeats')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.repeats }"
-          />{{ $t('settings.notification_visibility_repeats') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('follows')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.follows }"
-          />{{ $t('settings.notification_visibility_follows') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('mentions')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.mentions }"
-          />{{ $t('settings.notification_visibility_mentions') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('statuses')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.statuses }"
-          />{{ $t('settings.notification_visibility_statuses') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('emojiReactions')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.emojiReactions }"
-          />{{ $t('settings.notification_visibility_emoji_reactions') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('moves')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.moves }"
-          />{{ $t('settings.notification_visibility_moves') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          @click="toggleNotificationFilter('polls')"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': filters.polls }"
-          />{{ $t('settings.notification_visibility_polls') }}
-        </button>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('likes')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.likes }"
+            />{{ $t('settings.notification_visibility_likes') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('repeats')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.repeats }"
+            />{{ $t('settings.notification_visibility_repeats') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('follows')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.follows }"
+            />{{ $t('settings.notification_visibility_follows') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('mentions')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.mentions }"
+            />{{ $t('settings.notification_visibility_mentions') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('statuses')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.statuses }"
+            />{{ $t('settings.notification_visibility_statuses') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('emojiReactions')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.emojiReactions }"
+            />{{ $t('settings.notification_visibility_emoji_reactions') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('moves')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.moves }"
+            />{{ $t('settings.notification_visibility_moves') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            @click="toggleNotificationFilter('polls')"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': filters.polls }"
+            />{{ $t('settings.notification_visibility_polls') }}
+          </button>
+        </div>
       </div>
     </template>
     <template #trigger>
diff --git a/src/components/notifications/notifications.js b/src/components/notifications/notifications.js
index 85d3662e9..ced97d57f 100644
--- a/src/components/notifications/notifications.js
+++ b/src/components/notifications/notifications.js
@@ -1,5 +1,6 @@
 import { computed } from 'vue'
 import { mapGetters } from 'vuex'
+import { mapState } from 'pinia'
 import Notification from '../notification/notification.vue'
 import ExtraNotifications from '../extra_notifications/extra_notifications.vue'
 import NotificationFilters from './notification_filters.vue'
@@ -14,6 +15,8 @@ import {
 import FaviconService from '../../services/favicon_service/favicon_service.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch, faArrowUp, faMinus } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
+import { useAnnouncementsStore } from 'src/stores/announcements'
 
 library.add(
   faCircleNotch,
@@ -98,11 +101,11 @@ const Notifications = {
       return this.$store.state.notifications.loading
     },
     noHeading () {
-      const { layoutType } = this.$store.state.interface
+      const { layoutType } = useInterfaceStore()
       return this.minimalMode || layoutType === 'mobile'
     },
     teleportTarget () {
-      const { layoutType } = this.$store.state.interface
+      const { layoutType } = useInterfaceStore()
       const map = {
         wide: '#notifs-column',
         mobile: '#mobile-notifications'
@@ -110,7 +113,7 @@ const Notifications = {
       return map[layoutType] || '#notifs-sidebar'
     },
     popoversZLayer () {
-      const { layoutType } = this.$store.state.interface
+      const { layoutType } = useInterfaceStore()
       return layoutType === 'mobile' ? 'navbar' : null
     },
     notificationsToDisplay () {
@@ -121,7 +124,8 @@ const Notifications = {
     showExtraNotifications () {
       return !this.noExtra
     },
-    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
+    ...mapState(useAnnouncementsStore, ['unreadAnnouncementCount']),
+    ...mapGetters(['unreadChatCount'])
   },
   mounted () {
     this.scrollerRef = this.$refs.root.closest('.column.-scrollable')
@@ -141,10 +145,10 @@ const Notifications = {
     unseenCountTitle (count) {
       if (count > 0) {
         FaviconService.drawFaviconBadge()
-        this.$store.dispatch('setPageTitle', `(${count})`)
+        useInterfaceStore().setPageTitle(`(${count})`)
       } else {
         FaviconService.clearFaviconBadge()
-        this.$store.dispatch('setPageTitle', '')
+        useInterfaceStore().setPageTitle('')
       }
     },
     teleportTarget () {
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index cfc1f3d67..79ef5b300 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -13,10 +13,7 @@
 
     .notification-overlay {
       position: absolute;
-      top: 0;
-      right: 0;
-      left: 0;
-      bottom: 0;
+      inset: 0;
       pointer-events: none;
     }
 
@@ -131,7 +128,6 @@
 
   .notification-details {
     min-width: 0;
-    word-wrap: break-word;
     line-height: var(--post-line-height);
     position: relative;
     overflow: hidden;
@@ -164,7 +160,8 @@
     }
 
     h1 {
-      word-break: break-all;
+      overflow-wrap: break-word;
+      text-wrap: pretty;
       margin: 0 0 0.3em;
       padding: 0;
       font-size: 1em;
diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue
index 87e7b68d7..387c3a847 100644
--- a/src/components/notifications/notifications.vue
+++ b/src/components/notifications/notifications.vue
@@ -14,13 +14,13 @@
           v-if="!noHeading"
           class="notifications-heading panel-heading -sticky"
         >
-          <div class="title">
+          <h1 class="title">
             {{ $t('notifications.notifications') }}
             <span
               v-if="unseenCountBadgeText"
               class="badge -notification unseen-count"
             >{{ unseenCountBadgeText }}</span>
-          </div>
+          </h1>
           <div
             v-if="showScrollTop"
             class="rightside-button"
diff --git a/src/components/oauth_callback/oauth_callback.js b/src/components/oauth_callback/oauth_callback.js
index a3c7b7f98..02e4c9ffc 100644
--- a/src/components/oauth_callback/oauth_callback.js
+++ b/src/components/oauth_callback/oauth_callback.js
@@ -1,10 +1,12 @@
 import oauth from '../../services/new_api/oauth.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 const oac = {
   props: ['code'],
   mounted () {
     if (this.code) {
-      const { clientId, clientSecret } = this.$store.state.oauth
+      const oauthStore = useOAuthStore()
+      const { clientId, clientSecret } = oauthStore
 
       oauth.getToken({
         clientId,
@@ -12,7 +14,7 @@ const oac = {
         instance: this.$store.state.instance.server,
         code: this.code
       }).then((result) => {
-        this.$store.commit('setToken', result.access_token)
+        oauthStore.setToken(result.access_token)
         this.$store.dispatch('loginUser', result.access_token)
         this.$router.push({ name: 'friends' })
       })
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index 5a80b100d..19de233d7 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -8,14 +8,14 @@
       class="label"
       :class="{ faint: !present || disabled }"
     >
-      {{ $t('settings.style.common.opacity') }}
+      {{ label || $t('settings.style.themes3.editor.opacity') }}
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined'"
       :model-value="present"
       :disabled="disabled"
       class="opt"
-      @update:modelValue="$emit('update:modelValue', !present ? fallback : undefined)"
+      @update:model-value="$emit('update:modelValue', !present ? fallback : undefined)"
     />
     <input
       :id="name"
@@ -39,7 +39,7 @@ export default {
     Checkbox
   },
   props: [
-    'name', 'modelValue', 'fallback', 'disabled'
+    'name', 'label', 'modelValue', 'fallback', 'disabled'
   ],
   emits: ['update:modelValue'],
   computed: {
diff --git a/src/components/palette_editor/palette_editor.vue b/src/components/palette_editor/palette_editor.vue
new file mode 100644
index 000000000..3040696d0
--- /dev/null
+++ b/src/components/palette_editor/palette_editor.vue
@@ -0,0 +1,222 @@
+<template>
+  <div
+    class="PaletteEditor"
+    :class="{ '-compact': compact, '-apply': apply, '-mobile': mobile }"
+  >
+    <div class="palette">
+      <ColorInput
+        v-for="key in paletteKeys"
+        :key="key"
+        :name="key"
+        :model-value="props.modelValue[key]"
+        :fallback="fallback(key)"
+        :label="$t('settings.style.themes3.palette.' + key)"
+        @update:model-value="value => updatePalette(key, value)"
+      />
+    </div>
+    <div class="buttons">
+      <button
+        class="btn button-default palette-import-button"
+        @click="importPalette"
+      >
+        <FAIcon icon="file-import" />
+        {{ $t('settings.style.themes3.palette.import') }}
+      </button>
+      <button
+        class="btn button-default palette-export-button"
+        @click="exportPalette"
+      >
+        <FAIcon icon="file-export" />
+        {{ $t('settings.style.themes3.palette.export') }}
+      </button>
+    </div>
+    <div class="buttons">
+      <button
+        v-if="apply"
+        class="btn button-default palette-apply-button"
+        :disabled="disabled"
+        :class="{ disabled }"
+        @click="applyPalette"
+      >
+        {{ $t('settings.style.themes3.palette.apply') }}
+      </button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+import ColorInput from 'src/components/color_input/color_input.vue'
+import {
+  newImporter,
+  newExporter
+} from 'src/services/export_import/export_import.js'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faFileImport,
+  faFileExport
+} from '@fortawesome/free-solid-svg-icons'
+
+import { useInterfaceStore } from 'src/stores/interface'
+
+library.add(
+  faFileImport,
+  faFileExport
+)
+
+const paletteKeys = [
+  'bg',
+  'fg',
+  'text',
+  'link',
+  'accent',
+  'cRed',
+  'cBlue',
+  'cGreen',
+  'cOrange',
+  'wallpaper'
+]
+
+const props = defineProps(['modelValue', 'compact', 'apply', 'disabled'])
+const emit = defineEmits(['update:modelValue', 'applyPalette'])
+const getExportedObject = () => paletteKeys.reduce((acc, key) => {
+  const value = props.modelValue[key]
+  if (value == null) {
+    return acc
+  } else {
+    return { ...acc, [key]: props.modelValue[key] }
+  }
+}, {})
+
+const paletteExporter = newExporter({
+  filename: 'pleroma_palette',
+  extension: 'json',
+  getExportedObject
+})
+const paletteImporter = newImporter({
+  accept: '.json',
+  onImport (parsed) {
+    emit('update:modelValue', parsed)
+  }
+})
+
+const exportPalette = () => {
+  paletteExporter.exportData()
+}
+
+const importPalette = () => {
+  paletteImporter.importData()
+}
+
+const applyPalette = () => {
+  emit('applyPalette', getExportedObject())
+}
+
+const mobile = computed(() => {
+  return useInterfaceStore().layoutType === 'mobile'
+})
+
+const fallback = (key) => {
+  if (key === 'accent') {
+    return props.modelValue.link
+  }
+  if (key === 'link') {
+    return props.modelValue.accent
+  }
+  if (key.startsWith('extra')) {
+    return '#FF00FF'
+  }
+  if (key.startsWith('wallpaper')) {
+    return '#008080'
+  }
+}
+
+const updatePalette = (paletteKey, value) => {
+  emit('update:modelValue', {
+    ...props.modelValue,
+    [paletteKey]: value
+  })
+}
+</script>
+
+<style lang="scss">
+.PaletteEditor {
+  justify-content: space-around;
+  grid-template-columns: repeat(4, 1fr);
+  grid-template-rows: repeat(5, 1fr) auto;
+  grid-gap: 0.5em;
+  align-items: baseline;
+
+  .buttons {
+    margin-top: 0.5em;
+    display: grid;
+    gap: 0.5em
+  }
+
+  .palette {
+    display: grid;
+    grid-template-rows: 1fr;
+    grid-auto-flow: row;
+    grid-auto-rows: auto;
+    grid-template-columns: repeat(auto-fill, 10em);
+    grid-gap: 0.5em;
+    margin-bottom: 0.5em;
+  }
+
+  .palette-import-button {
+    grid-column: 1 / span 2;
+  }
+
+  .palette-export-button {
+    grid-column: 3 / span 2;
+  }
+
+  .palette-apply-button {
+    grid-column: 1 / span 2;
+  }
+
+  .color-input.style-control {
+    margin: 0;
+  }
+
+  &.-compact {
+    grid-template-columns: repeat(2, 1fr);
+    grid-template-rows: repeat(5, 1fr) auto;
+
+    .palette-import-button {
+      grid-column: 1;
+    }
+
+    .palette-export-button {
+      grid-column: 2;
+    }
+
+    &.-apply {
+      grid-template-rows: repeat(5, 1fr) auto auto;
+
+      .palette-apply-button {
+        grid-column: 1 / span 2;
+      }
+    }
+  }
+
+  &.-mobile {
+    &.-apply {
+      .palette-apply-button {
+        grid-column: 1 / span 2;
+      }
+    }
+
+    .color-input {
+      display: grid;
+      gap: 0.5em;
+
+      label {
+        flex: 1;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/components/panel.style.js b/src/components/panel.style.js
index 1bba4766d..2c8956ae1 100644
--- a/src/components/panel.style.js
+++ b/src/components/panel.style.js
@@ -6,29 +6,17 @@ export default {
     'Link',
     'Icon',
     'Border',
-    'Button',
-    'ButtonUnstyled',
-    'Input',
     'PanelHeader',
-    'MenuItem',
     'Post',
     'Notification',
-    'Alert',
-    'UserCard',
-    'Chat',
-    'Attachment',
-    'Tab',
-    'ListItem'
+    'MenuItem'
   ],
   validInnerComponentsLite: [
     'Text',
     'Link',
     'Icon',
     'Border',
-    'Button',
-    'Input',
-    'PanelHeader',
-    'Alert'
+    'PanelHeader'
   ],
   defaultRules: [
     {
@@ -38,12 +26,20 @@ export default {
         roundness: 3,
         blur: '5px',
         shadow: [{
-          x: 1,
-          y: 1,
-          blur: 4,
+          x: 0,
+          y: 0,
+          blur: 3,
           spread: 0,
           color: '#000000',
-          alpha: 0.6
+          alpha: 0.5
+        },
+        {
+          x: 0,
+          y: 4,
+          blur: 6,
+          spread: 3,
+          color: '#000000',
+          alpha: 0.3
         }]
       }
     }
diff --git a/src/components/panel_header.style.js b/src/components/panel_header.style.js
index 32464bc50..4e5f97760 100644
--- a/src/components/panel_header.style.js
+++ b/src/components/panel_header.style.js
@@ -7,9 +7,7 @@ export default {
     'Icon',
     'Button',
     'ButtonUnstyled',
-    'Badge',
-    'Alert',
-    'Avatar'
+    'Alert'
   ],
   defaultRules: [
     {
@@ -17,7 +15,23 @@ export default {
       directives: {
         backgroundNoCssColor: 'yes',
         background: '--fg',
-        shadow: []
+        shadow: [{
+          x: 0,
+          y: 1,
+          blur: 3,
+          spread: 0,
+          color: '#000000',
+          alpha: 0.4
+        },
+        {
+          x: 0,
+          y: 1,
+          blur: 0,
+          spread: 0,
+          color: '#ffffff',
+          alpha: 0.2,
+          inset: true
+        }]
       }
     }
   ]
diff --git a/src/components/password_reset/password_reset.vue b/src/components/password_reset/password_reset.vue
index 037b859e8..5392f487b 100644
--- a/src/components/password_reset/password_reset.vue
+++ b/src/components/password_reset/password_reset.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="settings panel panel-default">
     <div class="panel-heading">
-      {{ $t('password_reset.password_reset') }}
+      <h1 class="title">
+        {{ $t('password_reset.password_reset') }}
+      </h1>
     </div>
     <div class="panel-body">
       <form
diff --git a/src/components/pinch_zoom/pinch_zoom.vue b/src/components/pinch_zoom/pinch_zoom.vue
index 18d697197..6b6a0fa5b 100644
--- a/src/components/pinch_zoom/pinch_zoom.vue
+++ b/src/components/pinch_zoom/pinch_zoom.vue
@@ -2,7 +2,6 @@
   <pinch-zoom
     class="pinch-zoom-parent"
     v-bind="$attrs"
-    v-on="$listeners"
   >
     <slot />
   </pinch-zoom>
diff --git a/src/components/poll/poll.js b/src/components/poll/poll.js
index 9ce0e29eb..a1b7808f2 100644
--- a/src/components/poll/poll.js
+++ b/src/components/poll/poll.js
@@ -1,14 +1,16 @@
 import Timeago from 'components/timeago/timeago.vue'
 import genRandomSeed from '../../services/random_seed/random_seed.service.js'
 import RichContent from 'components/rich_content/rich_content.jsx'
-import { forEach, map } from 'lodash'
+import Checkbox from 'components/checkbox/checkbox.vue'
+import { usePollsStore } from 'src/stores/polls'
 
 export default {
   name: 'Poll',
   props: ['basePoll', 'emoji'],
   components: {
     Timeago,
-    RichContent
+    RichContent,
+    Checkbox
   },
   data () {
     return {
@@ -18,20 +20,20 @@ export default {
     }
   },
   created () {
-    if (!this.$store.state.polls.pollsObject[this.pollId]) {
-      this.$store.dispatch('mergeOrAddPoll', this.basePoll)
+    if (!usePollsStore().pollsObject[this.pollId]) {
+      usePollsStore().mergeOrAddPoll(this.basePoll)
     }
-    this.$store.dispatch('trackPoll', this.pollId)
+    usePollsStore().trackPoll(this.pollId)
   },
   unmounted () {
-    this.$store.dispatch('untrackPoll', this.pollId)
+    usePollsStore().untrackPoll(this.pollId)
   },
   computed: {
     pollId () {
       return this.basePoll.id
     },
     poll () {
-      const storePoll = this.$store.state.polls.pollsObject[this.pollId]
+      const storePoll = usePollsStore().pollsObject[this.pollId]
       return storePoll || {}
     },
     options () {
@@ -43,6 +45,13 @@ export default {
     expired () {
       return (this.poll && this.poll.expired) || false
     },
+    expirationLabel () {
+      if (this.$store.getters.mergedConfig.useAbsoluteTimeFormat) {
+        return this.expired ? 'polls.expired_at' : 'polls.expires_at'
+      } else {
+        return this.expired ? 'polls.expired' : 'polls.expires_in'
+      }
+    },
     loggedIn () {
       return this.$store.state.users.currentUser
     },
@@ -77,29 +86,15 @@ export default {
     resultTitle (option) {
       return `${option.votes_count}/${this.totalVotesCount} ${this.$t('polls.votes')}`
     },
-    fetchPoll () {
-      this.$store.dispatch('refreshPoll', { id: this.statusId, pollId: this.poll.id })
-    },
-    activateOption (index) {
-      // forgive me father: doing checking the radio/checkboxes
-      // in code because of customized input elements need either
-      // a) an extra element for the actual graphic, or b) use a
-      // pseudo element for the label. We use b) which mandates
-      // using "for" and "id" matching which isn't nice when the
-      // same poll appears multiple times on the site (notifs and
-      // timeline for example). With code we can make sure it just
-      // works without altering the pseudo element implementation.
-      const allElements = this.$el.querySelectorAll('input')
-      const clickedElement = this.$el.querySelector(`input[value="${index}"]`)
+    activateOption (index, value) {
+      let result
       if (this.poll.multiple) {
-        // Checkboxes, toggle only the clicked one
-        clickedElement.checked = !clickedElement.checked
+        result = this.choices || this.options.map(() => false)
       } else {
-        // Radio button, uncheck everything and check the clicked one
-        forEach(allElements, element => { element.checked = false })
-        clickedElement.checked = true
+        result = this.options.map(() => false)
       }
-      this.choices = map(allElements, e => e.checked)
+      result[index] = value
+      this.choices = result
     },
     optionId (index) {
       return `poll${this.poll.id}-${index}`
@@ -107,10 +102,9 @@ export default {
     vote () {
       if (this.choiceIndices.length === 0) return
       this.loading = true
-      this.$store.dispatch(
-        'votePoll',
+      usePollsStore().votePoll(
         { id: this.statusId, pollId: this.poll.id, choices: this.choiceIndices }
-      ).then(poll => {
+      ).then(() => {
         this.loading = false
       })
     }
diff --git a/src/components/poll/poll.scss b/src/components/poll/poll.scss
new file mode 100644
index 000000000..693d9898b
--- /dev/null
+++ b/src/components/poll/poll.scss
@@ -0,0 +1,63 @@
+.poll {
+  .votes {
+    display: flex;
+    flex-direction: column;
+    margin: 0 0 0.5em;
+  }
+
+  .poll-option {
+    margin: 0.75em 0.5em;
+
+    .input {
+      line-height: inherit;
+    }
+  }
+
+  .option-result {
+    height: 100%;
+    display: flex;
+    flex-direction: row;
+    position: relative;
+    color: var(--textLight);
+  }
+
+  .option-result-label {
+    display: flex;
+    align-items: center;
+    padding: 0.1em 0.25em;
+    z-index: 1;
+    overflow-wrap: break-word;
+    text-wrap: pretty;
+  }
+
+  .result-percentage {
+    width: 3.5em;
+    flex-shrink: 0;
+  }
+
+  .result-fill {
+    height: 100%;
+    position: absolute;
+    border-radius: var(--roundness);
+    top: 0;
+    left: 0;
+    transition: width 0.5s;
+  }
+
+  input {
+    width: 3.5em;
+  }
+
+  &.loading * {
+    cursor: progress;
+  }
+
+  .poll-vote-button {
+    padding: 0 1em;
+    margin-right: 0.5em;
+  }
+
+  .poll-checkbox {
+    display: none;
+  }
+}
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index e12f3e61b..24de14200 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -37,36 +37,56 @@
           :role="poll.multiple ? 'checkbox' : 'radio'"
           :aria-labelledby="`option-vote-${randomSeed}-${index}`"
           :aria-checked="choices[index]"
-          class="input unstyled"
-          @click="activateOption(index)"
         >
-          <!-- TODO: USE CHECKBOX -->
-          <input
-            v-if="poll.multiple"
-            type="checkbox"
-            class="input -checkbox poll-checkbox"
+          <Checkbox
+            :radio="!poll.multiple"
             :disabled="loading"
-            :value="index"
+            :model-value="choices[index]"
+            @update:model-value="value => activateOption(index, value)"
           >
-          <input
-            v-else
-            type="radio"
-            :disabled="loading"
-            :value="index"
-            class="input -radio"
-          >
-          <label class="option-vote">
             <RichContent
               :id="`option-vote-${randomSeed}-${index}`"
               :html="option.title_html"
               :handle-links="false"
               :emoji="emoji"
             />
-          </label>
+          </Checkbox>
         </div>
       </div>
     </div>
     <div class="footer faint">
+      <p>
+        <span
+          v-if="poll.pleroma?.non_anonymous"
+          :title="$t('polls.non_anonymous_title')"
+        >
+          {{ $t('polls.non_anonymous') }}
+          &nbsp;·&nbsp;
+        </span>
+        <span class="total">
+          <template v-if="typeof poll.voters_count === 'number'">
+            {{ $t("polls.people_voted_count", { count: poll.voters_count }, poll.voters_count) }}
+          </template>
+          <template v-else>
+            {{ $t("polls.votes_count", { count: poll.votes_count }, poll.votes_count) }}
+          </template>
+          <span v-if="expiresAt !== null">
+            &nbsp;·&nbsp;
+          </span>
+        </span>
+        <span v-if="expiresAt !== null">
+          <i18n-t
+            scope="global"
+            :keypath="expirationLabel"
+          >
+            <Timeago
+              :time="expiresAt"
+              :auto-update="60"
+              :now-threshold="0"
+            />
+          </i18n-t>
+        </span>
+      </p>
       <button
         v-if="!showResults"
         class="btn button-default poll-vote-button"
@@ -76,113 +96,10 @@
       >
         {{ $t('polls.vote') }}
       </button>
-      <span
-        v-if="poll.pleroma?.non_anonymous"
-        :title="$t('polls.non_anonymous_title')"
-      >
-        {{ $t('polls.non_anonymous') }}
-        &nbsp;·&nbsp;
-      </span>
-      <div class="total">
-        <template v-if="typeof poll.voters_count === 'number'">
-          {{ $tc("polls.people_voted_count", poll.voters_count, { count: poll.voters_count }) }}
-        </template>
-        <template v-else>
-          {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}
-        </template>
-        <span v-if="expiresAt !== null">
-          &nbsp;·&nbsp;
-        </span>
-      </div>
-      <span v-if="expiresAt !== null">
-        <i18n-t
-          scope="global"
-          :keypath="expired ? 'polls.expired' : 'polls.expires_in'"
-        >
-          <Timeago
-            :time="expiresAt"
-            :auto-update="60"
-            :now-threshold="0"
-          />
-        </i18n-t>
-      </span>
     </div>
   </div>
 </template>
 
 <script src="./poll.js"></script>
 
-<style lang="scss">
-.poll {
-  .votes {
-    display: flex;
-    flex-direction: column;
-    margin: 0 0 0.5em;
-  }
-
-  .poll-option {
-    margin: 0.75em 0.5em;
-
-    .input {
-      line-height: inherit;
-    }
-  }
-
-  .option-result {
-    height: 100%;
-    display: flex;
-    flex-direction: row;
-    position: relative;
-    color: var(--textLight);
-  }
-
-  .option-result-label {
-    display: flex;
-    align-items: center;
-    padding: 0.1em 0.25em;
-    z-index: 1;
-    word-break: break-word;
-  }
-
-  .result-percentage {
-    width: 3.5em;
-    flex-shrink: 0;
-  }
-
-  .result-fill {
-    height: 100%;
-    position: absolute;
-    border-radius: var(--roundness);
-    top: 0;
-    left: 0;
-    transition: width 0.5s;
-  }
-
-  .option-vote {
-    display: flex;
-    align-items: center;
-  }
-
-  input {
-    width: 3.5em;
-  }
-
-  .footer {
-    display: flex;
-    align-items: center;
-  }
-
-  &.loading * {
-    cursor: progress;
-  }
-
-  .poll-vote-button {
-    padding: 0 0.5em;
-    margin-right: 0.5em;
-  }
-
-  .poll-checkbox {
-    display: none;
-  }
-}
-</style>
+<style src="./poll.scss" lang="scss" />
diff --git a/src/components/poll/poll_form.js b/src/components/poll/poll_form.js
index a20701553..7660db0c2 100644
--- a/src/components/poll/poll_form.js
+++ b/src/components/poll/poll_form.js
@@ -1,5 +1,5 @@
 import * as DateUtils from 'src/services/date_utils/date_utils.js'
-import { uniq } from 'lodash'
+import { pollFallback } from 'src/services/poll/poll.service.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import Select from '../select/select.vue'
 import {
@@ -17,14 +17,33 @@ export default {
     Select
   },
   name: 'PollForm',
-  props: ['visible'],
-  data: () => ({
-    pollType: 'single',
-    options: ['', ''],
-    expiryAmount: 10,
-    expiryUnit: 'minutes'
-  }),
+  props: {
+    visible: {},
+    params: {
+      type: Object,
+      required: true
+    }
+  },
   computed: {
+    pollType: {
+      get () { return pollFallback(this.params, 'pollType') },
+      set (newVal) { this.params.pollType = newVal }
+    },
+    options () {
+      const hasOptions = !!this.params.options
+      if (!hasOptions) {
+        this.params.options = pollFallback(this.params, 'options')
+      }
+      return this.params.options
+    },
+    expiryAmount: {
+      get () { return pollFallback(this.params, 'expiryAmount') },
+      set (newVal) { this.params.expiryAmount = newVal }
+    },
+    expiryUnit: {
+      get () { return pollFallback(this.params, 'expiryUnit') },
+      set (newVal) { this.params.expiryUnit = newVal }
+    },
     pollLimits () {
       return this.$store.state.instance.pollLimits
     },
@@ -86,10 +105,9 @@ export default {
       }
       return false
     },
-    deleteOption (index, event) {
+    deleteOption (index) {
       if (this.options.length > 2) {
         this.options.splice(index, 1)
-        this.updatePollToParent()
       }
     },
     convertExpiryToUnit (unit, amount) {
@@ -104,24 +122,6 @@ export default {
         Math.max(this.minExpirationInCurrentUnit, this.expiryAmount)
       this.expiryAmount =
         Math.min(this.maxExpirationInCurrentUnit, this.expiryAmount)
-      this.updatePollToParent()
-    },
-    updatePollToParent () {
-      const expiresIn = this.convertExpiryFromUnit(
-        this.expiryUnit,
-        this.expiryAmount
-      )
-
-      const options = uniq(this.options.filter(option => option !== ''))
-      if (options.length < 2) {
-        this.$emit('update-poll', { error: this.$t('polls.not_enough_options') })
-        return
-      }
-      this.$emit('update-poll', {
-        options,
-        multiple: this.pollType === 'multiple',
-        expiresIn
-      })
     }
   }
 }
diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue
index 4eb9d594b..e5ca9cefe 100644
--- a/src/components/poll/poll_form.vue
+++ b/src/components/poll/poll_form.vue
@@ -84,7 +84,7 @@
             :key="unit"
             :value="unit"
           >
-            {{ $tc(`time.unit.${unit}_short`, expiryAmount, ['']) }}
+            {{ $t(`time.unit.${unit}_short`, [''], expiryAmount) }}
           </option>
         </Select>
       </div>
diff --git a/src/components/popover.style.js b/src/components/popover.style.js
index 0197271b9..455b5f5e0 100644
--- a/src/components/popover.style.js
+++ b/src/components/popover.style.js
@@ -6,16 +6,7 @@ export default {
     modal: '.modal'
   },
   validInnerComponents: [
-    'Text',
-    'Link',
-    'Icon',
-    'Border',
-    'Button',
-    'ButtonUnstyled',
-    'Input',
-    'MenuItem',
-    'Post',
-    'UserCard'
+    'MenuItem'
   ],
   defaultRules: [
     {
diff --git a/src/components/popover/popover.js b/src/components/popover/popover.js
index bc078533e..e8e857918 100644
--- a/src/components/popover/popover.js
+++ b/src/components/popover/popover.js
@@ -1,3 +1,4 @@
+/* global process */
 const Popover = {
   name: 'Popover',
   props: {
@@ -48,12 +49,22 @@ const Popover = {
     // Use styled button (to avoid nested buttons)
     normalButton: Boolean,
 
+    // Whether to hide the trigger totally
+    hideTrigger: {
+      type: Boolean,
+      default: false,
+    },
+
     triggerAttrs: {
       type: Object,
       default: {}
     }
   },
-  inject: ['popoversZLayer'], // override popover z layer
+  inject: { // override popover z layer
+    popoversZLayer: {
+      default: ''
+    }
+  },
   data () {
     return {
       // lockReEntry is a flag that is set when mouse cursor is leaving the popover's content
@@ -75,6 +86,26 @@ const Popover = {
       childrenShown: new Set()
     }
   },
+  computed: {
+    allTriggerAttrs () {
+      if (process.env.NODE_ENV === 'development') {
+        if ('aria-hidden' in this.triggerAttrs) {
+          throw new Error('Do not use aria-hidden in triggerAttrs. Instead set hideTrigger to true')
+        }
+      }
+
+      const attrs = {
+        ...this.triggerAttrs,
+      }
+
+      if (this.hideTrigger) {
+        attrs['aria-hidden'] = true
+        attrs.tabindex = 1
+      }
+
+      return attrs
+    }
+  },
   methods: {
     setAnchorEl (el) {
       this.anchorEl = el
@@ -193,8 +224,8 @@ const Popover = {
         // Default to whatever user wished with placement prop
         let usingTop = this.placement !== 'bottom'
 
-        // Handle special cases, first force to displaying on top if there's not space on bottom,
-        // regardless of what placement value was. Then check if there's not space on top, and
+        // Handle special cases, first force to displaying on top if there's no space on bottom,
+        // regardless of what placement value was. Then check if there's no space on top, and
         // force to bottom, again regardless of what placement value was.
         const topBoundary = origin.y - anchorHeight * 0.5 + (this.removePadding ? topPadding : 0)
         const bottomBoundary = origin.y + anchorHeight * 0.5 - (this.removePadding ? bottomPadding : 0)
@@ -210,20 +241,20 @@ const Popover = {
         translateX = origin.x + horizOffset + xOffset
       } else {
         // Default to whatever user wished with placement prop
-        let usingRight = this.placement !== 'left'
+        let usingLeft = this.placement !== 'right'
 
-        // Handle special cases, first force to displaying on top if there's not space on bottom,
-        // regardless of what placement value was. Then check if there's not space on top, and
-        // force to bottom, again regardless of what placement value was.
-        const rightBoundary = origin.x - anchorWidth * 0.5 + (this.removePadding ? rightPadding : 0)
-        const leftBoundary = origin.x + anchorWidth * 0.5 - (this.removePadding ? leftPadding : 0)
-        if (leftBoundary + content.offsetWidth > xBounds.max) usingRight = true
-        if (rightBoundary - content.offsetWidth < xBounds.min) usingRight = false
+        // Handle special cases, first force to displaying on left if there's no space on right,
+        // regardless of what placement value was. Then check if there's no space on right, and
+        // force to left, again regardless of what placement value was.
+        const leftBoundary = origin.x - anchorWidth * 0.5 + (this.removePadding ? leftPadding : 0)
+        const rightBoundary = origin.x + anchorWidth * 0.5 - (this.removePadding ? rightPadding : 0)
+        if (rightBoundary + content.offsetWidth > xBounds.max) usingLeft = true
+        if (leftBoundary - content.offsetWidth < xBounds.min) usingLeft = false
 
         const xOffset = (this.offset && this.offset.x) || 0
-        translateX = usingRight
-          ? rightBoundary - xOffset - content.offsetWidth
-          : leftBoundary + xOffset
+        translateX = usingLeft
+          ? leftBoundary - xOffset - content.offsetWidth
+          : rightBoundary + xOffset
 
         const yOffset = (this.offset && this.offset.y) || 0
         translateY = origin.y + vertOffset + yOffset
@@ -268,10 +299,15 @@ const Popover = {
       if (this.trigger === 'click') {
         document.removeEventListener('click', this.onClickOutside)
       }
-      this.scrollable.removeEventListener('scroll', this.onScroll)
-      this.scrollable.removeEventListener('resize', this.onResize)
+      this.scrollable?.removeEventListener('scroll', this.onScroll)
+      this.scrollable?.removeEventListener('resize', this.onResize)
     },
-    onMouseenter (e) {
+    resizePopover () {
+      setTimeout(() => {
+        this.updateStyles()
+      }, 1)
+    },
+    onMouseenter () {
       if (this.trigger === 'hover') {
         this.lockReEntry = false
         clearTimeout(this.graceTimeout)
@@ -279,12 +315,12 @@ const Popover = {
         this.showPopover()
       }
     },
-    onMouseleave (e) {
+    onMouseleave () {
       if (this.trigger === 'hover' && this.childrenShown.size === 0) {
         this.graceTimeout = setTimeout(() => this.hidePopover(), 1)
       }
     },
-    onMouseenterContent (e) {
+    onMouseenterContent () {
       if (this.trigger === 'hover' && !this.lockReEntry) {
         this.lockReEntry = true
         clearTimeout(this.graceTimeout)
@@ -292,12 +328,12 @@ const Popover = {
         this.showPopover()
       }
     },
-    onMouseleaveContent (e) {
+    onMouseleaveContent () {
       if (this.trigger === 'hover' && this.childrenShown.size === 0) {
         this.graceTimeout = setTimeout(() => this.hidePopover(), 1)
       }
     },
-    onClick (e) {
+    onClick () {
       if (this.trigger === 'click') {
         if (this.hidden) {
           this.showPopover()
@@ -315,11 +351,16 @@ const Popover = {
       this.hidePopover()
       if (this.parentPopover) this.parentPopover.onClickOutside(e)
     },
-    onScroll (e) {
+    onScroll () {
       this.updateStyles()
     },
-    onResize (e) {
-      this.updateStyles()
+    onResize () {
+      const content = this.$refs.content
+      if (!content) return
+      if (this.oldSize.width !== content.offsetWidth || this.oldSize.height !== content.offsetHeight) {
+        this.updateStyles()
+        this.oldSize = { width: content.offsetWidth, height: content.offsetHeight }
+      }
     },
     onChildPopoverState (childRef, state) {
       if (state) {
@@ -333,12 +374,7 @@ const Popover = {
     // Monitor changes to content size, update styles only when content sizes have changed,
     // that should be the only time we need to move the popover box if we don't care about scroll
     // or resize
-    const content = this.$refs.content
-    if (!content) return
-    if (this.oldSize.width !== content.offsetWidth || this.oldSize.height !== content.offsetHeight) {
-      this.updateStyles()
-      this.oldSize = { width: content.offsetWidth, height: content.offsetHeight }
-    }
+    this.onResize()
   },
   mounted () {
     this.teleport = true
diff --git a/src/components/popover/popover.scss b/src/components/popover/popover.scss
new file mode 100644
index 000000000..a166e2196
--- /dev/null
+++ b/src/components/popover/popover.scss
@@ -0,0 +1,143 @@
+.popover-trigger-button {
+  display: inline-block;
+}
+
+.popover {
+  z-index: var(--ZI_popover_override, var(--ZI_popovers));
+  position: fixed;
+  min-width: 0;
+  max-width: calc(100vw - 20px);
+
+  --_shadow: var(--shadow);
+}
+
+.popover-default {
+  &::after {
+    content: "";
+    position: absolute;
+    inset: -1px;
+    box-shadow: var(--_shadow);
+    pointer-events: none;
+  }
+
+  border-radius: var(--roundness);
+  border-color: var(--border);
+  border-style: solid;
+  border-width: 1px;
+  background-color: var(--background);
+}
+
+.dropdown-menu {
+  display: block;
+  padding: 0;
+  font-size: 1em;
+  text-align: left;
+  list-style: none;
+  max-width: 100vw;
+  z-index: var(--ZI_popover_override, var(--ZI_popovers));
+  white-space: nowrap;
+  background-color: var(--background);
+
+  .dropdown-divider {
+    height: 0;
+    margin: 0.5rem 0;
+    overflow: hidden;
+    border-top: 1px solid var(--border);
+  }
+
+  .dropdown-item {
+    padding: 0;
+    display: grid;
+    grid-template-columns: 1fr;
+    grid-auto-flow: column;
+    grid-auto-columns: auto;
+    grid-gap: 0.5em;
+
+    .popover-wrapper {
+      box-sizing: border-box;
+      display: grid;
+      grid-template-columns: 1fr;
+    }
+
+    .extra-button {
+      border-left: 1px solid;
+      border-image-source: linear-gradient(to bottom, transparent 0%, var(--icon) var(--__horizontal-gap) calc(100% - var(--__horizontal-gap)), transparent 100%);
+      border-image-slice: 1;
+      padding-left: calc(var(--__horizontal-gap) - 1px);
+      padding-right: var(--__horizontal-gap);
+      padding-top: var(--__horizontal-gap);
+      padding-bottom: var(--__horizontal-gap);
+      max-width: fit-content;
+    }
+
+    .main-button {
+      width: 100%;
+      padding: var(--__horizontal-gap) var(--__horizontal-gap);
+      grid-gap: var(--__horizontal-gap);
+      grid-template-columns: 1fr var(--__line-height);
+      grid-auto-flow: column;
+      grid-auto-columns: auto;
+
+      .menu-checkbox {
+        display: inline-block;
+        vertical-align: middle;
+        min-width: calc(var(--__line-height) + 1px);
+        max-width: calc(var(--__line-height) + 1px);
+        min-height: calc(var(--__line-height) + 1px);
+        max-height: calc(var(--__line-height) + 1px);
+        line-height: var(--__line-height);
+        text-align: center;
+        border-radius: 0;
+        box-shadow: var(--shadow);
+        margin-right: var(--__horizontal-gap);
+
+        &.menu-checkbox-checked::after {
+          font-size: 1.25em;
+          content: "✓";
+        }
+
+        &.-radio {
+          border-radius: 9999px;
+
+          &.menu-checkbox-checked::after {
+            font-size: 2em;
+            content: "•";
+          }
+        }
+      }
+    }
+
+    .main-button,
+    .extra-button {
+      display: grid;
+      box-sizing: border-box;
+      align-items: center;
+
+      &.disabled {
+        cursor: not-allowed;
+      }
+
+      &:not(.disabled) {
+        cursor: pointer;
+      }
+    }
+
+    &.-icon {
+      .main-button {
+        grid-template-columns: var(--__line-height) 1fr;
+      }
+    }
+
+    &.-icon-space {
+      .main-button {
+        padding-left: calc(var(--__line-height) + var(--__horizontal-gap) * 2);
+      }
+    }
+
+    &.-icon-double {
+      .main-button {
+        grid-template-columns: var(--__line-height) var(--__line-height) 1fr;
+      }
+    }
+  }
+}
diff --git a/src/components/popover/popover.vue b/src/components/popover/popover.vue
index 0c5b372ee..2810a3748 100644
--- a/src/components/popover/popover.vue
+++ b/src/components/popover/popover.vue
@@ -1,5 +1,6 @@
 <template>
   <span
+    class="popover-wrapper"
     @mouseenter="onMouseenter"
     @mouseleave="onMouseleave"
   >
@@ -8,7 +9,7 @@
       class="popover-trigger-button"
       :class="normalButton ? 'button-default btn' : 'button-unstyled'"
       type="button"
-      v-bind="triggerAttrs"
+      v-bind="allTriggerAttrs"
       @click="onClick"
     >
       <slot name="trigger" />
@@ -32,6 +33,7 @@
             name="content"
             class="popover-inner"
             :close="hidePopover"
+            :resize="resizePopover"
           />
         </div>
       </transition>
@@ -41,101 +43,4 @@
 
 <script src="./popover.js" />
 
-<style lang="scss">
-.popover-trigger-button {
-  display: inline-block;
-}
-
-.popover {
-  z-index: var(--ZI_popover_override, var(--ZI_popovers));
-  position: fixed;
-  min-width: 0;
-  max-width: calc(100vw - 20px);
-  box-shadow: var(--shadow);
-}
-
-.popover-default {
-  &::after {
-    content: "";
-    position: absolute;
-    top: -1px;
-    bottom: -1px;
-    left: -1px;
-    right: -1px;
-    z-index: -1px;
-    box-shadow: var(--shadow);
-    pointer-events: none;
-  }
-
-  border-radius: var(--roundness);
-  border-color: var(--border);
-  border-style: solid;
-  border-width: 1px;
-  background-color: var(--background);
-}
-
-.dropdown-menu {
-  display: block;
-  padding: 0;
-  font-size: 1em;
-  text-align: left;
-  list-style: none;
-  max-width: 100vw;
-  z-index: var(--ZI_popover_override, var(--ZI_popovers));
-  white-space: nowrap;
-  background-color: var(--background);
-
-  .dropdown-divider {
-    height: 0;
-    margin: 0.5rem 0;
-    overflow: hidden;
-    border-top: 1px solid var(--border);
-  }
-
-  .dropdown-item {
-    border: none;
-
-    &-icon {
-      svg {
-        width: var(--__line-height);
-        margin-right: var(--__horizontal-gap);
-      }
-    }
-
-    &.-has-submenu {
-      .chevron-icon {
-        margin-right: 0.25rem;
-        margin-left: 2rem;
-      }
-    }
-
-    .menu-checkbox {
-      display: inline-block;
-      vertical-align: middle;
-      min-width: calc(var(--__line-height) + 1px);
-      max-width: calc(var(--__line-height) + 1px);
-      min-height: calc(var(--__line-height) + 1px);
-      max-height: calc(var(--__line-height) + 1px);
-      line-height: var(--__line-height);
-      text-align: center;
-      border-radius: 0;
-      box-shadow: var(--shadow);
-      margin-right: var(--__horizontal-gap);
-
-      &.menu-checkbox-checked::after {
-        font-size: 1.25em;
-        content: "✓";
-      }
-
-      &.-radio {
-        border-radius: 9999px;
-
-        &.menu-checkbox-checked::after {
-          font-size: 2em;
-          content: "•";
-        }
-      }
-    }
-  }
-}
-</style>
+<style src="./popover.scss" lang="scss"></style>
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 563dfb966..238be88df 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -7,14 +7,18 @@ import PollForm from '../poll/poll_form.vue'
 import Attachment from '../attachment/attachment.vue'
 import Gallery from 'src/components/gallery/gallery.vue'
 import StatusContent from '../status_content/status_content.vue'
+import Popover from 'src/components/popover/popover.vue'
 import fileTypeService from '../../services/file_type/file_type.service.js'
 import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
 import { propsToNative } from '../../services/attributes_helper/attributes_helper.service.js'
+import { pollFormToMasto } from 'src/services/poll/poll.service.js'
 import { reject, map, uniqBy, debounce } from 'lodash'
 import suggestor from '../emoji_input/suggestor.js'
-import { mapGetters, mapState } from 'vuex'
+import { mapGetters } from 'vuex'
+import { mapState, mapActions } from 'pinia'
 import Checkbox from '../checkbox/checkbox.vue'
 import Select from '../select/select.vue'
+import DraftCloser from 'src/components/draft_closer/draft_closer.vue'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -23,16 +27,25 @@ import {
   faUpload,
   faBan,
   faTimes,
-  faCircleNotch
+  faCircleNotch,
+  faChevronDown,
+  faChevronLeft,
+  faChevronRight
 } from '@fortawesome/free-solid-svg-icons'
 
+import { useInterfaceStore } from 'src/stores/interface.js'
+import { useMediaViewerStore } from 'src/stores/media_viewer.js'
+
 library.add(
   faSmileBeam,
   faPollH,
   faUpload,
   faBan,
   faTimes,
-  faCircleNotch
+  faCircleNotch,
+  faChevronDown,
+  faChevronLeft,
+  faChevronRight
 )
 
 const buildMentionsString = ({ user, attentions = [] }, currentUser) => {
@@ -55,6 +68,18 @@ const pxStringToNumber = (str) => {
   return Number(str.substring(0, str.length - 2))
 }
 
+const typeAndRefId = ({ replyTo, profileMention, statusId }) => {
+  if (replyTo) {
+    return ['reply', replyTo]
+  } else if (profileMention) {
+    return ['mention', profileMention]
+  } else if (statusId) {
+    return ['edit', statusId]
+  } else {
+    return ['new', '']
+  }
+}
+
 const PostStatusForm = {
   props: [
     'statusId',
@@ -79,6 +104,9 @@ const PostStatusForm = {
     'disableSensitivityCheckbox',
     'disableSubmit',
     'disablePreview',
+    'disableDraft',
+    'hideDraft',
+    'closeable',
     'placeholder',
     'maxHeight',
     'postHandler',
@@ -88,13 +116,17 @@ const PostStatusForm = {
     'submitOnEnter',
     'emojiPickerPlacement',
     'optimisticPosting',
-    'profileMention'
+    'profileMention',
+    'draftId'
   ],
   emits: [
     'posted',
+    'draft-done',
     'resize',
     'mediaplay',
-    'mediapause'
+    'mediapause',
+    'can-close',
+    'update'
   ],
   components: {
     MediaUpload,
@@ -105,7 +137,9 @@ const PostStatusForm = {
     Select,
     Attachment,
     StatusContent,
-    Gallery
+    Gallery,
+    DraftCloser,
+    Popover
   },
   mounted () {
     this.updateIdempotencyKey()
@@ -126,41 +160,54 @@ const PostStatusForm = {
 
     const { scopeCopy } = this.$store.getters.mergedConfig
 
-    if (this.replyTo || this.profileMention) {
-      const currentUser = this.$store.state.users.currentUser
-      statusText = buildMentionsString({ user: this.repliedUser, attentions: this.attentions }, currentUser)
-    }
+    const [statusType, refId] = typeAndRefId({ replyTo: this.replyTo, profileMention: this.profileMention && this.repliedUser?.id, statusId: this.statusId })
 
-    const scope = ((this.copyMessageScope && scopeCopy) || this.copyMessageScope === 'direct')
-      ? this.copyMessageScope
-      : this.$store.state.users.currentUser.default_scope
+    // If we are starting a new post, do not associate it with old drafts
+    let statusParams = !this.disableDraft && (this.draftId || statusType !== 'new') ? this.getDraft(statusType, refId) : null
 
-    const { postContentType: contentType, sensitiveByDefault } = this.$store.getters.mergedConfig
+    if (!statusParams) {
+      if (statusType === 'reply' || statusType === 'mention') {
+        const currentUser = this.$store.state.users.currentUser
+        statusText = buildMentionsString({ user: this.repliedUser, attentions: this.attentions }, currentUser)
+      }
 
-    let statusParams = {
-      spoilerText: this.subject || '',
-      status: statusText,
-      nsfw: !!sensitiveByDefault,
-      files: [],
-      poll: {},
-      mediaDescriptions: {},
-      visibility: scope,
-      contentType
-    }
+      const scope = ((this.copyMessageScope && scopeCopy) || this.copyMessageScope === 'direct')
+        ? this.copyMessageScope
+        : this.$store.state.users.currentUser.default_scope
+
+      const { postContentType: contentType, sensitiveByDefault } = this.$store.getters.mergedConfig
 
-    if (this.statusId) {
-      const statusContentType = this.statusContentType || contentType
       statusParams = {
+        type: statusType,
+        refId,
         spoilerText: this.subject || '',
-        status: this.statusText || '',
-        nsfw: this.statusIsSensitive || !!sensitiveByDefault,
-        files: this.statusFiles || [],
-        poll: this.statusPoll || {},
-        mediaDescriptions: this.statusMediaDescriptions || {},
-        visibility: this.statusScope || scope,
-        contentType: statusContentType,
+        status: statusText,
+        nsfw: !!sensitiveByDefault,
+        files: [],
+        poll: {},
+        hasPoll: false,
+        mediaDescriptions: {},
+        visibility: scope,
+        contentType,
         quoting: false
       }
+
+      if (statusType === 'edit') {
+        const statusContentType = this.statusContentType || contentType
+        statusParams = {
+          type: statusType,
+          refId,
+          spoilerText: this.subject || '',
+          status: this.statusText || '',
+          nsfw: this.statusIsSensitive || !!sensitiveByDefault,
+          files: this.statusFiles || [],
+          poll: this.statusPoll || {},
+          hasPoll: false,
+          mediaDescriptions: this.statusMediaDescriptions || {},
+          visibility: this.statusScope || scope,
+          contentType: statusContentType
+        }
+      }
     }
 
     return {
@@ -172,13 +219,14 @@ const PostStatusForm = {
       highlighted: 0,
       newStatus: statusParams,
       caret: 0,
-      pollFormVisible: false,
       showDropIcon: 'hide',
       dropStopTimeout: null,
       preview: null,
       previewLoading: false,
       emojiInputShown: false,
-      idempotencyKey: ''
+      idempotencyKey: '',
+      saveInhibited: true,
+      saveable: false
     }
   },
   computed: {
@@ -191,6 +239,9 @@ const PostStatusForm = {
     showAllScopes () {
       return !this.mergedConfig.minimalScopesMode
     },
+    hideExtraActions () {
+      return this.disableDraft || this.hideDraft
+    },
     emojiUserSuggestor () {
       return suggestor({
         emoji: [
@@ -293,9 +344,43 @@ const PostStatusForm = {
 
       return false
     },
+    debouncedMaybeAutoSaveDraft () {
+      return debounce(this.maybeAutoSaveDraft, 3000)
+    },
+    pollFormVisible () {
+      return this.newStatus.hasPoll
+    },
+    shouldAutoSaveDraft () {
+      return this.$store.getters.mergedConfig.autoSaveDraft
+    },
+    autoSaveState () {
+      if (this.saveable) {
+        return this.$t('post_status.auto_save_saving')
+      } else if (this.newStatus.id) {
+        return this.$t('post_status.auto_save_saved')
+      } else {
+        return this.$t('post_status.auto_save_nothing_new')
+      }
+    },
+    safeToSaveDraft () {
+      return (
+        this.newStatus.status ||
+        this.newStatus.spoilerText ||
+        this.newStatus.files?.length ||
+        this.newStatus.hasPoll
+      ) && this.saveable
+    },
+    hasEmptyDraft () {
+      return this.newStatus.id && !(
+        this.newStatus.status ||
+          this.newStatus.spoilerText ||
+          this.newStatus.files?.length ||
+          this.newStatus.hasPoll
+      )
+    },
     ...mapGetters(['mergedConfig']),
-    ...mapState({
-      mobileLayout: state => state.interface.mobileLayout
+    ...mapState(useInterfaceStore, {
+      mobileLayout: store => store.mobileLayout
     })
   },
   watch: {
@@ -304,15 +389,33 @@ const PostStatusForm = {
       handler () {
         this.statusChanged()
       }
+    },
+    saveable (val) {
+      // https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event#usage_notes
+      // MDN says we'd better add the beforeunload event listener only when needed, and remove it when it's no longer needed
+      if (val) {
+        this.addBeforeUnloadListener()
+      } else {
+        this.removeBeforeUnloadListener()
+      }
     }
   },
+  beforeUnmount () {
+    this.maybeAutoSaveDraft()
+    this.removeBeforeUnloadListener()
+  },
   methods: {
+    ...mapActions(useMediaViewerStore, ['increment']),
     statusChanged () {
       this.autoPreview()
       this.updateIdempotencyKey()
+      this.debouncedMaybeAutoSaveDraft()
+      this.saveable = true
+      this.saveInhibited = false
     },
     clearStatus () {
       const newStatus = this.newStatus
+      this.saveInhibited = true
       this.newStatus = {
         status: '',
         spoilerText: '',
@@ -320,10 +423,10 @@ const PostStatusForm = {
         visibility: newStatus.visibility,
         contentType: newStatus.contentType,
         poll: {},
+        hasPoll: false,
         mediaDescriptions: {},
         quoting: false
       }
-      this.pollFormVisible = false
       this.$refs.mediaUpload && this.$refs.mediaUpload.clearFile()
       this.clearPollForm()
       if (this.preserveFocus) {
@@ -336,8 +439,9 @@ const PostStatusForm = {
       el.style.height = undefined
       this.error = null
       if (this.preview) this.previewStatus()
+      this.saveable = false
     },
-    async postStatus (event, newStatus, opts = {}) {
+    async postStatus (event, newStatus) {
       if (this.posting && !this.optimisticPosting) { return }
       if (this.disableSubmit) { return }
       if (this.emojiInputShown) { return }
@@ -353,7 +457,7 @@ const PostStatusForm = {
         return
       }
 
-      const poll = this.pollFormVisible ? this.newStatus.poll : {}
+      const poll = this.newStatus.hasPoll ? pollFormToMasto(this.newStatus.poll) : {}
       if (this.pollContentError) {
         this.error = this.pollContentError
         return
@@ -363,7 +467,7 @@ const PostStatusForm = {
 
       try {
         await this.setAllMediaDescriptions()
-      } catch (e) {
+      } catch {
         this.error = this.$t('post_status.media_description_error')
         this.posting = false
         return
@@ -388,6 +492,7 @@ const PostStatusForm = {
 
       postHandler(postingOptions).then((data) => {
         if (!data.error) {
+          this.abandonDraft()
           this.clearStatus()
           this.$emit('posted', data)
         } else {
@@ -506,7 +611,7 @@ const PostStatusForm = {
         this.showDropIcon = 'hide'
       }
     },
-    fileDragStop (e) {
+    fileDragStop () {
       // The false-setting is done with delay because just using leave-events
       // directly caused unwanted flickering, this is not perfect either but
       // much less noticable.
@@ -521,7 +626,7 @@ const PostStatusForm = {
         this.showDropIcon = 'show'
       }
     },
-    onEmojiInputInput (e) {
+    onEmojiInputInput () {
       this.$nextTick(() => {
         this.resize(this.$refs.textarea)
       })
@@ -621,10 +726,6 @@ const PostStatusForm = {
         scrollerRef.scrollTop = targetScroll
       }
     },
-    showEmojiPicker () {
-      this.$refs.textarea.focus()
-      this.$refs['emoji-input'].triggerShowPicker()
-    },
     clearError () {
       this.error = null
     },
@@ -632,7 +733,7 @@ const PostStatusForm = {
       this.newStatus.visibility = visibility
     },
     togglePollForm () {
-      this.pollFormVisible = !this.pollFormVisible
+      this.newStatus.hasPoll = !this.newStatus.hasPoll
     },
     setPoll (poll) {
       this.newStatus.poll = poll
@@ -661,10 +762,88 @@ const PostStatusForm = {
       this.idempotencyKey = Date.now().toString()
     },
     openProfileTab () {
-      this.$store.dispatch('openSettingsModalTab', 'profile')
+      useInterfaceStore().openSettingsModalTab('profile')
     },
     propsToNative (props) {
       return propsToNative(props)
+    },
+    saveDraft () {
+      if (!this.disableDraft &&
+          !this.saveInhibited) {
+        if (this.safeToSaveDraft) {
+          return this.$store.dispatch('addOrSaveDraft', { draft: this.newStatus })
+            .then(id => {
+              if (this.newStatus.id !== id) {
+                this.newStatus.id = id
+              }
+              this.saveable = false
+              if (!this.shouldAutoSaveDraft) {
+                this.clearStatus()
+                this.$emit('draft-done')
+              }
+            })
+        } else if (this.hasEmptyDraft) {
+          // There is a draft, but there is nothing in it, clear it
+          return this.abandonDraft()
+            .then(() => {
+              this.saveable = false
+              if (!this.shouldAutoSaveDraft) {
+                this.clearStatus()
+                this.$emit('draft-done')
+              }
+            })
+        }
+      }
+      return Promise.resolve()
+    },
+    maybeAutoSaveDraft () {
+      if (this.shouldAutoSaveDraft) {
+        this.saveDraft(false)
+      }
+    },
+    abandonDraft () {
+      return this.$store.dispatch('abandonDraft', { id: this.newStatus.id })
+    },
+    getDraft (statusType, refId) {
+      const maybeDraft = this.$store.state.drafts.drafts[this.draftId]
+      if (this.draftId && maybeDraft) {
+        return maybeDraft
+      } else {
+        const existingDrafts = this.$store.getters.draftsByTypeAndRefId(statusType, refId)
+
+        if (existingDrafts.length) {
+          return existingDrafts[0]
+        }
+      }
+      // No draft available, fall back
+    },
+    requestClose () {
+      if (!this.saveable) {
+        this.$emit('can-close')
+      } else {
+        this.$refs.draftCloser.requestClose()
+      }
+    },
+    saveAndCloseDraft () {
+      this.saveDraft().then(() => {
+        this.$emit('can-close')
+      })
+    },
+    discardAndCloseDraft () {
+      this.abandonDraft().then(() => {
+        this.$emit('can-close')
+      })
+    },
+    addBeforeUnloadListener () {
+      this._beforeUnloadListener ||= () => {
+        this.saveDraft()
+      }
+      window.addEventListener('beforeunload', this._beforeUnloadListener)
+    },
+    removeBeforeUnloadListener () {
+      if (this._beforeUnloadListener) {
+        window.removeEventListener('beforeunload', this._beforeUnloadListener)
+      }
     }
   }
 }
diff --git a/src/components/post_status_form/post_status_form.scss b/src/components/post_status_form/post_status_form.scss
new file mode 100644
index 000000000..641dc6dac
--- /dev/null
+++ b/src/components/post_status_form/post_status_form.scss
@@ -0,0 +1,276 @@
+.post-status-form {
+  position: relative;
+
+  .attachments {
+    margin-bottom: 0.5em;
+  }
+
+  .more-post-actions {
+    height: 100%;
+
+    .btn {
+      height: 100%;
+    }
+  }
+
+  .form-bottom {
+    display: flex;
+    justify-content: space-between;
+    padding: 0.5em;
+    height: 2.5em;
+
+    .post-button-group {
+      width: 10em;
+      display: flex;
+
+      .post-button {
+        flex: 1 0 auto;
+      }
+
+      .more-post-actions {
+        flex: 0 0 auto;
+      }
+    }
+
+    p {
+      margin: 0.35em;
+      padding: 0.35em;
+      display: flex;
+    }
+  }
+
+  .form-bottom-left {
+    display: flex;
+    gap: 1.5em;
+
+    button {
+      padding: 0.5em;
+      margin: -0.5em;
+    }
+  }
+
+  .preview-heading {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .preview-toggle {
+    flex: 10 0 auto;
+    cursor: pointer;
+    user-select: none;
+    padding-left: 0.5em;
+
+    &:hover {
+      text-decoration: underline;
+    }
+
+    svg,
+    i {
+      margin-left: 0.2em;
+      font-size: 0.8em;
+      transform: rotate(90deg);
+    }
+  }
+
+  .preview-container {
+    margin-bottom: 1em;
+  }
+
+  .preview-error {
+    font-style: italic;
+    color: var(--textFaint);
+  }
+
+  .preview-status {
+    border: 1px solid var(--border);
+    border-radius: var(--roundness);
+    padding: 0.5em;
+    margin: 0;
+  }
+
+  .reply-or-quote-selector {
+    flex: 1 0 auto;
+    margin-bottom: 0.5em;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+  }
+
+  .text-format {
+    .only-format {
+      color: var(--textFaint);
+    }
+  }
+
+  .visibility-tray {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    margin-left: -0.5em;
+  }
+
+  .visibility-notice {
+    border: 1px solid var(--border);
+    border-radius: var(--roundness);
+    padding: 0.5em 1em
+  }
+
+  .visibility-notice.edit-warning {
+    > :first-child {
+      margin-top: 0;
+    }
+
+    > :last-child {
+      margin-bottom: 0;
+    }
+  }
+
+  // Order is not necessary but a good indicator
+  .media-upload-icon {
+    order: 1;
+    justify-content: left;
+  }
+
+  .emoji-icon {
+    order: 2;
+    justify-content: center;
+  }
+
+  .poll-icon {
+    order: 3;
+    justify-content: right;
+  }
+
+  .media-upload-icon,
+  .poll-icon,
+  .emoji-icon {
+    font-size: 1.85em;
+    line-height: 1.1;
+    flex: 1;
+    padding: 0 0.1em;
+    display: flex;
+    align-items: center;
+  }
+
+  .error {
+    text-align: center;
+  }
+
+  .media-upload-wrapper {
+    margin-right: 0.2em;
+    margin-bottom: 0.5em;
+    width: 18em;
+
+    img,
+    video {
+      object-fit: contain;
+      max-height: 10em;
+    }
+
+    .video {
+      max-height: 10em;
+    }
+
+    input {
+      flex: 1;
+      width: 100%;
+    }
+  }
+
+  .status-input-wrapper {
+    display: flex;
+    position: relative;
+    width: 100%;
+    flex-direction: column;
+  }
+
+  .btn[disabled] {
+    cursor: not-allowed;
+  }
+
+  form {
+    display: flex;
+    flex-direction: column;
+    margin: 0.6em;
+    position: relative;
+  }
+
+  .form-group {
+    display: flex;
+    flex-direction: column;
+    padding: 0.25em 0.5em 0.5em;
+    line-height: 1.85;
+  }
+
+  .inputs-wrapper {
+    padding: 0;
+  }
+
+  .input.form-post-body {
+    // TODO: make a resizable textarea component?
+    box-sizing: content-box; // needed for easier computation of dynamic size
+    overflow: hidden;
+    transition: min-height 200ms 100ms;
+    // stock padding + 1 line of text (for counter)
+    padding-bottom: calc(var(--_padding) + var(--post-line-height) * 1em);
+    padding-right: 1.5em;
+    // two lines of text
+    height: calc(var(--post-line-height) * 1em);
+    min-height: calc(var(--post-line-height) * 1em);
+    resize: none;
+    background: transparent;
+    text-wrap: stable;
+
+    &.scrollable-form {
+      overflow-y: auto;
+    }
+  }
+
+  .main-input {
+    position: relative;
+  }
+
+  .subject-input {
+    border-bottom: 1px solid var(--border);
+  }
+
+  .character-counter {
+    position: absolute;
+    bottom: 0;
+    right: 0;
+    padding: 0;
+    margin: 0 0.5em;
+
+    &.error {
+      color: var(--cRed);
+    }
+  }
+
+  @keyframes fade-in {
+    from { opacity: 0; }
+    to { opacity: 0.6; }
+  }
+
+  @keyframes fade-out {
+    from { opacity: 0.6; }
+    to { opacity: 0; }
+  }
+
+  .drop-indicator {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    font-size: 5em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: 0.6;
+    color: var(--text);
+    background-color: var(--bg);
+    border-radius: var(--roundness);
+    border: 2px dashed var(--text);
+  }
+
+  .auto-save-status {
+    align-self: center;
+  }
+}
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index cf411ff18..f661a980d 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -103,6 +103,36 @@
               icon="circle-notch"
             />
           </div>
+          <div
+            v-if="quotable"
+            role="radiogroup"
+            class="btn-group reply-or-quote-selector"
+          >
+            <button
+              :id="`reply-or-quote-option-${randomSeed}-reply`"
+              class="btn button-default reply-or-quote-option"
+              :class="{ toggled: !newStatus.quoting }"
+              tabindex="0"
+              role="radio"
+              :aria-labelledby="`reply-or-quote-option-${randomSeed}-reply`"
+              :aria-checked="!newStatus.quoting"
+              @click="newStatus.quoting = false"
+            >
+              {{ $t('post_status.reply_option') }}
+            </button>
+            <button
+              :id="`reply-or-quote-option-${randomSeed}-quote`"
+              class="btn button-default reply-or-quote-option"
+              :class="{ toggled: newStatus.quoting }"
+              tabindex="0"
+              role="radio"
+              :aria-labelledby="`reply-or-quote-option-${randomSeed}-quote`"
+              :aria-checked="newStatus.quoting"
+              @click="newStatus.quoting = true"
+            >
+              {{ $t('post_status.quote_option') }}
+            </button>
+          </div>
         </div>
         <div
           v-if="showPreview"
@@ -126,97 +156,68 @@
             class="preview-status"
           />
         </div>
-        <div
-          v-if="quotable"
-          role="radiogroup"
-          class="btn-group reply-or-quote-selector"
-        >
-          <button
-            :id="`reply-or-quote-option-${randomSeed}-reply`"
-            class="btn button-default reply-or-quote-option"
-            :class="{ toggled: !newStatus.quoting }"
-            tabindex="0"
-            role="radio"
-            :aria-labelledby="`reply-or-quote-option-${randomSeed}-reply`"
-            :aria-checked="!newStatus.quoting"
-            @click="newStatus.quoting = false"
+        <div class="input inputs-wrapper">
+          <EmojiInput
+            v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
+            v-model="newStatus.spoilerText"
+            enable-emoji-picker
+            :suggest="emojiSuggestor"
+            class="input form-control subject-input unstyled"
           >
-            {{ $t('post_status.reply_option') }}
-          </button>
-          <button
-            :id="`reply-or-quote-option-${randomSeed}-quote`"
-            class="btn button-default reply-or-quote-option"
-            :class="{ toggled: newStatus.quoting }"
-            tabindex="0"
-            role="radio"
-            :aria-labelledby="`reply-or-quote-option-${randomSeed}-quote`"
-            :aria-checked="newStatus.quoting"
-            @click="newStatus.quoting = true"
+            <template #default="inputProps">
+              <input
+                v-model="newStatus.spoilerText"
+                type="text"
+                :placeholder="$t('post_status.content_warning')"
+                :disabled="posting && !optimisticPosting"
+                v-bind="propsToNative(inputProps)"
+                size="1"
+                class="input form-post-subject unstyled"
+              >
+            </template>
+          </EmojiInput>
+          <EmojiInput
+            ref="emoji-input"
+            v-model="newStatus.status"
+            :suggest="emojiUserSuggestor"
+            :placement="emojiPickerPlacement"
+            class="input form-control main-input unstyled"
+            enable-sticker-picker
+            enable-emoji-picker
+            :newline-on-ctrl-enter="submitOnEnter"
+            @input="onEmojiInputInput"
+            @sticker-uploaded="addMediaFile"
+            @sticker-upload-failed="uploadFailed"
+            @shown="handleEmojiInputShow"
           >
-            {{ $t('post_status.quote_option') }}
-          </button>
+            <template #default="inputProps">
+              <textarea
+                ref="textarea"
+                v-model="newStatus.status"
+                :placeholder="placeholder || $t('post_status.default')"
+                rows="1"
+                cols="1"
+                :disabled="posting && !optimisticPosting"
+                class="input form-post-body"
+                :class="{ 'scrollable-form': !!maxHeight }"
+                v-bind="propsToNative(inputProps)"
+                @keydown.exact.enter="submitOnEnter && postStatus($event, newStatus)"
+                @keydown.meta.enter="postStatus($event, newStatus)"
+                @keydown.ctrl.enter="!submitOnEnter && postStatus($event, newStatus)"
+                @input="resize"
+                @compositionupdate="resize"
+                @paste="paste"
+              />
+              <p
+                v-if="hasStatusLengthLimit"
+                class="character-counter faint"
+                :class="{ error: isOverLengthLimit }"
+              >
+                {{ charactersLeft }}
+              </p>
+            </template>
+          </EmojiInput>
         </div>
-        <EmojiInput
-          v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
-          v-model="newStatus.spoilerText"
-          enable-emoji-picker
-          :suggest="emojiSuggestor"
-          class="input form-control"
-        >
-          <template #default="inputProps">
-            <input
-              v-model="newStatus.spoilerText"
-              type="text"
-              :placeholder="$t('post_status.content_warning')"
-              :disabled="posting && !optimisticPosting"
-              v-bind="propsToNative(inputProps)"
-              size="1"
-              class="input form-post-subject"
-            >
-          </template>
-        </EmojiInput>
-        <EmojiInput
-          ref="emoji-input"
-          v-model="newStatus.status"
-          :suggest="emojiUserSuggestor"
-          :placement="emojiPickerPlacement"
-          class="input form-control main-input"
-          enable-emoji-picker
-          hide-emoji-button
-          :newline-on-ctrl-enter="submitOnEnter"
-          enable-sticker-picker
-          @input="onEmojiInputInput"
-          @sticker-uploaded="addMediaFile"
-          @sticker-upload-failed="uploadFailed"
-          @shown="handleEmojiInputShow"
-        >
-          <template #default="inputProps">
-            <textarea
-              ref="textarea"
-              v-model="newStatus.status"
-              :placeholder="placeholder || $t('post_status.default')"
-              rows="1"
-              cols="1"
-              :disabled="posting && !optimisticPosting"
-              class="input form-post-body"
-              :class="{ 'scrollable-form': !!maxHeight }"
-              v-bind="propsToNative(inputProps)"
-              @keydown.exact.enter="submitOnEnter && postStatus($event, newStatus)"
-              @keydown.meta.enter="postStatus($event, newStatus)"
-              @keydown.ctrl.enter="!submitOnEnter && postStatus($event, newStatus)"
-              @input="resize"
-              @compositionupdate="resize"
-              @paste="paste"
-            />
-            <p
-              v-if="hasStatusLengthLimit"
-              class="character-counter faint"
-              :class="{ error: isOverLengthLimit }"
-            >
-              {{ charactersLeft }}
-            </p>
-          </template>
-        </EmojiInput>
         <div
           v-if="!disableScopeSelector"
           class="visibility-tray"
@@ -235,10 +236,10 @@
             class="text-format"
           >
             <Select
-              id="post-content-type"
               v-model="newStatus.contentType"
-              class="input form-control"
+              class="input form-control unstyled"
               :attrs="{ 'aria-label': $t('post_status.content_type_selection') }"
+              unstyled="true"
             >
               <option
                 v-for="postFormat in postFormats"
@@ -263,8 +264,14 @@
         v-if="pollsAvailable"
         ref="pollForm"
         :visible="pollFormVisible"
-        @update-poll="setPoll"
+        :params="newStatus.poll"
       />
+      <span
+        v-if="!disableDraft && shouldAutoSaveDraft"
+        class="auto-save-status"
+      >
+        {{ autoSaveState }}
+      </span>
       <div
         ref="bottom"
         class="form-bottom"
@@ -280,13 +287,6 @@
             @upload-failed="uploadFailed"
             @all-uploaded="finishedUploadingFiles"
           />
-          <button
-            class="emoji-icon button-unstyled"
-            :title="$t('emoji.add_emoji')"
-            @click="showEmojiPicker"
-          >
-            <FAIcon icon="smile-beam" />
-          </button>
           <button
             v-if="pollsAvailable"
             class="poll-icon button-unstyled"
@@ -297,28 +297,63 @@
             <FAIcon icon="poll-h" />
           </button>
         </div>
-        <button
-          v-if="posting"
-          disabled
-          class="btn button-default"
-        >
-          {{ $t('post_status.posting') }}
-        </button>
-        <button
-          v-else-if="isOverLengthLimit"
-          disabled
-          class="btn button-default"
-        >
-          {{ $t('post_status.post') }}
-        </button>
-        <button
-          v-else
-          :disabled="uploadingFiles || disableSubmit"
-          class="btn button-default"
-          @click.stop.prevent="postStatus($event, newStatus)"
-        >
-          {{ $t('post_status.post') }}
-        </button>
+        <div class="btn-group post-button-group">
+          <button
+            class="btn button-default post-button"
+            :disabled="isOverLengthLimit || posting || uploadingFiles || disableSubmit"
+            @click.stop.prevent="postStatus($event, newStatus)"
+          >
+            <template v-if="posting">
+              {{ $t('post_status.posting') }}
+            </template>
+            <template v-else>
+              {{ $t('post_status.post') }}
+            </template>
+          </button>
+          <Popover
+            v-if="!hideExtraActions"
+            class="more-post-actions"
+            :normal-button="true"
+            trigger="click"
+            placement="bottom"
+            :offset="{ y: 5 }"
+            :trigger-attrs="{ 'aria-label': $t('post_status.more_post_actions') }"
+          >
+            <template #trigger>
+              <FAIcon
+                class="fa-scale-110 fa-old-padding"
+                icon="chevron-down"
+              />
+            </template>
+            <template #content="{close}">
+              <div
+                class="dropdown-menu"
+                role="menu"
+              >
+                <div
+                  class="menu-item dropdown-item"
+                  :class="{ disabled: !safeToSaveDraft }"
+                >
+                  <button
+                    v-if="!hideDraft || !disableDraft"
+                    class="main-button"
+                    role="menu"
+                    :disabled="!safeToSaveDraft"
+                    @click.prevent="saveDraft"
+                    @click="close"
+                  >
+                    <template v-if="closeable">
+                      {{ $t('post_status.save_to_drafts_and_close_button') }}
+                    </template>
+                    <template v-else>
+                      {{ $t('post_status.save_to_drafts_button') }}
+                    </template>
+                  </button>
+                </div>
+              </div>
+            </template>
+          </Popover>
+        </div>
       </div>
       <div
         v-show="showDropIcon !== 'hide'"
@@ -351,7 +386,7 @@
         :nsfw="false"
         :attachments="newStatus.files"
         :descriptions="newStatus.mediaDescriptions"
-        :set-media="() => $store.dispatch('setMedia', newStatus.files)"
+        :set-media="() => setMedia()"
         :editable="true"
         :edit-attachment="editAttachment"
         :remove-attachment="removeMediaFile"
@@ -369,243 +404,14 @@
         </Checkbox>
       </div>
     </form>
+    <DraftCloser
+      ref="draftCloser"
+      @save="saveAndCloseDraft"
+      @discard="discardAndCloseDraft"
+    />
   </div>
 </template>
 
 <script src="./post_status_form.js"></script>
 
-<style lang="scss">
-.post-status-form {
-  position: relative;
-
-  .attachments {
-    margin-bottom: 0.5em;
-  }
-
-  .form-bottom {
-    display: flex;
-    justify-content: space-between;
-    padding: 0.5em;
-    height: 2.5em;
-
-    button {
-      width: 10em;
-    }
-
-    p {
-      margin: 0.35em;
-      padding: 0.35em;
-      display: flex;
-    }
-  }
-
-  .form-bottom-left {
-    display: flex;
-    flex: 1;
-    padding-right: 7px;
-    margin-right: 7px;
-    max-width: 10em;
-  }
-
-  .preview-heading {
-    display: flex;
-    padding-left: 0.5em;
-  }
-
-  .preview-toggle {
-    flex: 1;
-    cursor: pointer;
-    user-select: none;
-
-    &:hover {
-      text-decoration: underline;
-    }
-
-    svg,
-    i {
-      margin-left: 0.2em;
-      font-size: 0.8em;
-      transform: rotate(90deg);
-    }
-  }
-
-  .preview-container {
-    margin-bottom: 1em;
-  }
-
-  .preview-error {
-    font-style: italic;
-    color: var(--textFaint);
-  }
-
-  .preview-status {
-    border: 1px solid var(--border);
-    border-radius: var(--roundness);
-    padding: 0.5em;
-    margin: 0;
-  }
-
-  .reply-or-quote-selector {
-    margin-bottom: 0.5em;
-  }
-
-  .text-format {
-    .only-format {
-      color: var(--textFaint);
-    }
-  }
-
-  .visibility-tray {
-    display: flex;
-    justify-content: space-between;
-    padding-top: 5px;
-    align-items: baseline;
-  }
-
-  .visibility-notice.edit-warning {
-    > :first-child {
-      margin-top: 0;
-    }
-
-    > :last-child {
-      margin-bottom: 0;
-    }
-  }
-
-  // Order is not necessary but a good indicator
-  .media-upload-icon {
-    order: 1;
-    justify-content: left;
-  }
-
-  .emoji-icon {
-    order: 2;
-    justify-content: center;
-  }
-
-  .poll-icon {
-    order: 3;
-    justify-content: right;
-  }
-
-  .media-upload-icon,
-  .poll-icon,
-  .emoji-icon {
-    font-size: 1.85em;
-    line-height: 1.1;
-    flex: 1;
-    padding: 0 0.1em;
-    display: flex;
-    align-items: center;
-  }
-
-  .error {
-    text-align: center;
-  }
-
-  .media-upload-wrapper {
-    margin-right: 0.2em;
-    margin-bottom: 0.5em;
-    width: 18em;
-
-    img,
-    video {
-      object-fit: contain;
-      max-height: 10em;
-    }
-
-    .video {
-      max-height: 10em;
-    }
-
-    input {
-      flex: 1;
-      width: 100%;
-    }
-  }
-
-  .status-input-wrapper {
-    display: flex;
-    position: relative;
-    width: 100%;
-    flex-direction: column;
-  }
-
-  .btn[disabled] {
-    cursor: not-allowed;
-  }
-
-  form {
-    display: flex;
-    flex-direction: column;
-    margin: 0.6em;
-    position: relative;
-  }
-
-  .form-group {
-    display: flex;
-    flex-direction: column;
-    padding: 0.25em 0.5em 0.5em;
-    line-height: 1.85;
-  }
-
-  .input.form-post-body {
-    // TODO: make a resizable textarea component?
-    box-sizing: content-box; // needed for easier computation of dynamic size
-    overflow: hidden;
-    transition: min-height 200ms 100ms;
-    // stock padding + 1 line of text (for counter)
-    padding-bottom: calc(var(--_padding) + var(--post-line-height) * 1em);
-    // two lines of text
-    height: calc(var(--post-line-height) * 1em);
-    min-height: calc(var(--post-line-height) * 1em);
-    resize: none;
-    background: transparent;
-
-    &.scrollable-form {
-      overflow-y: auto;
-    }
-  }
-
-  .main-input {
-    position: relative;
-  }
-
-  .character-counter {
-    position: absolute;
-    bottom: 0;
-    right: 0;
-    padding: 0;
-    margin: 0 0.5em;
-
-    &.error {
-      color: var(--cRed);
-    }
-  }
-
-  @keyframes fade-in {
-    from { opacity: 0; }
-    to { opacity: 0.6; }
-  }
-
-  @keyframes fade-out {
-    from { opacity: 0.6; }
-    to { opacity: 0; }
-  }
-
-  .drop-indicator {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    font-size: 5em;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    opacity: 0.6;
-    color: var(--text);
-    background-color: var(--bg);
-    border-radius: var(--roundness);
-    border: 2px dashed var(--text);
-  }
-}
-</style>
+<style src="./post_status_form.scss" lang="scss"></style>
diff --git a/src/components/post_status_modal/post_status_modal.js b/src/components/post_status_modal/post_status_modal.js
index 8970dd9bc..ee6cd6444 100644
--- a/src/components/post_status_modal/post_status_modal.js
+++ b/src/components/post_status_modal/post_status_modal.js
@@ -1,6 +1,7 @@
 import PostStatusForm from '../post_status_form/post_status_form.vue'
 import Modal from '../modal/modal.vue'
 import get from 'lodash/get'
+import { usePostStatusStore } from 'src/stores/post_status'
 
 const PostStatusModal = {
   components: {
@@ -17,13 +18,13 @@ const PostStatusModal = {
       return !!this.$store.state.users.currentUser
     },
     modalActivated () {
-      return this.$store.state.postStatus.modalActivated
+      return usePostStatusStore().modalActivated
     },
     isFormVisible () {
       return this.isLoggedIn && !this.resettingForm && this.modalActivated
     },
     params () {
-      return this.$store.state.postStatus.params || {}
+      return usePostStatusStore().params || {}
     }
   },
   watch: {
@@ -43,11 +44,11 @@ const PostStatusModal = {
   },
   methods: {
     closeModal () {
-      this.$store.dispatch('closePostStatusModal')
+      usePostStatusStore().closePostStatusModal()
     },
     resetAndClose () {
-      this.$store.dispatch('resetPostStatusModal')
-      this.$store.dispatch('closePostStatusModal')
+      usePostStatusStore().resetPostStatusModal()
+      usePostStatusStore().closePostStatusModal()
     }
   }
 }
diff --git a/src/components/post_status_modal/post_status_modal.vue b/src/components/post_status_modal/post_status_modal.vue
index bc2cad4a1..919273c34 100644
--- a/src/components/post_status_modal/post_status_modal.vue
+++ b/src/components/post_status_modal/post_status_modal.vue
@@ -3,16 +3,20 @@
     v-if="isLoggedIn && !resettingForm"
     :is-open="modalActivated"
     class="post-form-modal-view"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
   >
     <div class="post-form-modal-panel panel">
       <div class="panel-heading">
-        {{ $t('post_status.new_status') }}
+        <h1 class="title">
+          {{ $t('post_status.new_status') }}
+        </h1>
       </div>
       <PostStatusForm
         class="panel-body"
         v-bind="params"
+        :closeable="true"
         @posted="resetAndClose"
+        @draft-done="resetAndClose"
       />
     </div>
   </Modal>
diff --git a/src/components/quick_filter_settings/quick_filter_settings.js b/src/components/quick_filter_settings/quick_filter_settings.js
index 0d667df5c..f5e4721d0 100644
--- a/src/components/quick_filter_settings/quick_filter_settings.js
+++ b/src/components/quick_filter_settings/quick_filter_settings.js
@@ -1,7 +1,9 @@
 import Popover from '../popover/popover.vue'
 import { mapGetters } from 'vuex'
+import { mapState } from 'pinia'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faFilter, faFont, faWrench } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faFilter,
@@ -11,7 +13,8 @@ library.add(
 
 const QuickFilterSettings = {
   props: {
-    conversation: Boolean
+    conversation: Boolean,
+    nested: Boolean
   },
   components: {
     Popover
@@ -22,11 +25,30 @@ const QuickFilterSettings = {
       this.$store.dispatch('queueFlushAll')
     },
     openTab (tab) {
-      this.$store.dispatch('openSettingsModalTab', tab)
+      useInterfaceStore().openSettingsModalTab(tab)
     }
   },
   computed: {
     ...mapGetters(['mergedConfig']),
+    ...mapState(useInterfaceStore, {
+      mobileLayout: state => state.layoutType === 'mobile'
+    }),
+    triggerAttrs () {
+      if (this.mobileLayout) {
+        return {}
+      } else {
+        return {
+          title: this.$t('timeline.quick_filter_settings')
+        }
+      }
+    },
+    mainClass () {
+      if (this.mobileLayout) {
+        return 'main-button'
+      } else {
+        return 'dropdown-item'
+      }
+    },
     loggedIn () {
       return !!this.$store.state.users.currentUser
     },
diff --git a/src/components/quick_filter_settings/quick_filter_settings.vue b/src/components/quick_filter_settings/quick_filter_settings.vue
index adb969168..79820ff38 100644
--- a/src/components/quick_filter_settings/quick_filter_settings.vue
+++ b/src/components/quick_filter_settings/quick_filter_settings.vue
@@ -1,9 +1,10 @@
 <template>
   <Popover
-    trigger="click"
+    :trigger="nested ? 'hover' : 'click'"
     class="QuickFilterSettings"
     :bound-to="{ x: 'container' }"
-    :trigger-attrs="{ title: $t('timeline.quick_filter_settings') }"
+    :position="nested ? 'right' : 'top'"
+    :trigger-attrs="triggerAttrs"
   >
     <template #content>
       <div
@@ -14,110 +15,148 @@
           v-if="loggedIn"
           role="group"
         >
-          <button
+          <div class="menu-item dropdown-item -icon">
+            <button
+              v-if="!conversation"
+              class="main-button"
+              :aria-checked="replyVisibilityAll"
+              role="menuitemradio"
+              @click="replyVisibilityAll = true"
+            >
+              <span
+                class="input menu-checkbox -radio"
+                :class="{ 'menu-checkbox-checked': replyVisibilityAll }"
+                :aria-hidden="true"
+              />{{ $t('settings.reply_visibility_all') }}
+            </button>
+          </div>
+          <div
             v-if="!conversation"
-            class="menu-item dropdown-item"
-            :aria-checked="replyVisibilityAll"
-            role="menuitemradio"
-            @click="replyVisibilityAll = true"
+            class="menu-item dropdown-item -icon"
           >
-            <span
-              class="input menu-checkbox -radio"
-              :class="{ 'menu-checkbox-checked': replyVisibilityAll }"
-              :aria-hidden="true"
-            />{{ $t('settings.reply_visibility_all') }}
-          </button>
-          <button
+            <button
+              class="main-button"
+              :aria-checked="replyVisibilityFollowing"
+              role="menuitemradio"
+              @click="replyVisibilityFollowing = true"
+            >
+              <span
+                class="input menu-checkbox -radio"
+                :class="{ 'menu-checkbox-checked': replyVisibilityFollowing }"
+                :aria-hidden="true"
+              />{{ $t('settings.reply_visibility_following_short') }}
+            </button>
+          </div>
+          <div
             v-if="!conversation"
-            class="menu-item dropdown-item"
-            :aria-checked="replyVisibilityFollowing"
-            role="menuitemradio"
-            @click="replyVisibilityFollowing = true"
+            class="menu-item dropdown-item -icon"
           >
-            <span
-              class="input menu-checkbox -radio"
-              :class="{ 'menu-checkbox-checked': replyVisibilityFollowing }"
-              :aria-hidden="true"
-            />{{ $t('settings.reply_visibility_following_short') }}
-          </button>
-          <button
-            v-if="!conversation"
-            class="menu-item dropdown-item"
-            :aria-checked="replyVisibilitySelf"
-            role="menuitemradio"
-            @click="replyVisibilitySelf = true"
-          >
-            <span
-              class="input menu-checkbox -radio"
-              :class="{ 'menu-checkbox-checked': replyVisibilitySelf }"
-              :aria-hidden="true"
-            />{{ $t('settings.reply_visibility_self_short') }}
-          </button>
+            <button
+              class="main-button"
+              :aria-checked="replyVisibilitySelf"
+              role="menuitemradio"
+              @click="replyVisibilitySelf = true"
+            >
+              <span
+                class="input menu-checkbox -radio"
+                :class="{ 'menu-checkbox-checked': replyVisibilitySelf }"
+                :aria-hidden="true"
+              />{{ $t('settings.reply_visibility_self_short') }}
+            </button>
+          </div>
           <div
             v-if="!conversation"
             role="separator"
             class="dropdown-divider"
           />
         </div>
-        <button
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="muteBotStatuses"
-          @click="muteBotStatuses = !muteBotStatuses"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': muteBotStatuses }"
-            :aria-hidden="true"
-          />{{ $t('settings.mute_bot_posts') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="muteSensitiveStatuses"
-          @click="muteSensitiveStatuses = !muteSensitiveStatuses"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': muteSensitiveStatuses }"
-            :aria-hidden="true"
-          />{{ $t('settings.mute_sensitive_posts') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="hideMedia"
-          @click="hideMedia = !hideMedia"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': hideMedia }"
-            :aria-hidden="true"
-          />{{ $t('settings.hide_media_previews') }}
-        </button>
-        <button
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="hideMutedPosts"
-          @click="hideMutedPosts = !hideMutedPosts"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': hideMutedPosts }"
-            :aria-hidden="true"
-          />{{ $t('settings.hide_all_muted_posts') }}
-        </button>
-        <button
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click="openTab('filtering')"
-        >
-          <FAIcon icon="font" />{{ $t('settings.word_filter_and_more') }}
-        </button>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="muteBotStatuses"
+            @click="muteBotStatuses = !muteBotStatuses"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': muteBotStatuses }"
+              :aria-hidden="true"
+            />{{ $t('settings.mute_bot_posts') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="muteSensitiveStatuses"
+            @click="muteSensitiveStatuses = !muteSensitiveStatuses"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': muteSensitiveStatuses }"
+              :aria-hidden="true"
+            />{{ $t('settings.mute_sensitive_posts') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="hideMedia"
+            @click="hideMedia = !hideMedia"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': hideMedia }"
+              :aria-hidden="true"
+            />{{ $t('settings.hide_media_previews') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="hideMutedPosts"
+            @click="hideMutedPosts = !hideMutedPosts"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': hideMutedPosts }"
+              :aria-hidden="true"
+            />{{ $t('settings.hide_all_muted_posts') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitem"
+            @click="openTab('filtering')"
+          >
+            <FAIcon
+              fixed-width
+              icon="font"
+            />{{ $t('settings.word_filter_and_more') }}
+          </button>
+        </div>
       </div>
     </template>
     <template #trigger>
-      <FAIcon icon="filter" />
+      <div :class="mobileLayout ? 'main-button' : ''">
+        <FAIcon
+          icon="filter"
+          :fixed-width="nested"
+        />
+        <template v-if="nested">
+          {{ $t('timeline.filter_settings') }}
+        </template>
+        <FAIcon
+          v-if="nested"
+          class="chevron-icon"
+          size="lg"
+          icon="chevron-right"
+          fixed-width
+        />
+      </div>
     </template>
   </Popover>
 </template>
diff --git a/src/components/quick_view_settings/quick_view_settings.js b/src/components/quick_view_settings/quick_view_settings.js
index e35fd579d..5c98e0f88 100644
--- a/src/components/quick_view_settings/quick_view_settings.js
+++ b/src/components/quick_view_settings/quick_view_settings.js
@@ -1,7 +1,10 @@
-import Popover from '../popover/popover.vue'
+import Popover from 'src/components/popover/popover.vue'
+import QuickFilterSettings from 'src/components/quick_filter_settings/quick_filter_settings.vue'
 import { mapGetters } from 'vuex'
+import { mapState } from 'pinia'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faList, faFolderTree, faBars, faWrench } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faList,
@@ -15,18 +18,22 @@ const QuickViewSettings = {
     conversation: Boolean
   },
   components: {
-    Popover
+    Popover,
+    QuickFilterSettings
   },
   methods: {
     setConversationDisplay (visibility) {
       this.$store.dispatch('setOption', { name: 'conversationDisplay', value: visibility })
     },
     openTab (tab) {
-      this.$store.dispatch('openSettingsModalTab', tab)
+      useInterfaceStore().openSettingsModalTab(tab)
     }
   },
   computed: {
     ...mapGetters(['mergedConfig']),
+    ...mapState(useInterfaceStore, {
+      mobileLayout: state => state.layoutType === 'mobile'
+    }),
     loggedIn () {
       return !!this.$store.state.users.currentUser
     },
diff --git a/src/components/quick_view_settings/quick_view_settings.vue b/src/components/quick_view_settings/quick_view_settings.vue
index e93dd8e08..403ccd159 100644
--- a/src/components/quick_view_settings/quick_view_settings.vue
+++ b/src/components/quick_view_settings/quick_view_settings.vue
@@ -3,94 +3,125 @@
     trigger="click"
     class="QuickViewSettings"
     :bound-to="{ x: 'container' }"
-    :trigger-attrs="{ title: $t('timeline.quick_view_settings') }"
   >
     <template #content>
       <div
         class="dropdown-menu"
         role="menu"
       >
+        <div
+          v-if="mobileLayout"
+          class="menu-item dropdown-item -icon"
+        >
+          <QuickFilterSettings :nested="true" />
+        </div>
+        <div
+          v-if="mobileLayout"
+          role="separator"
+          class="dropdown-divider"
+        />
         <div role="group">
-          <button
-            class="menu-item dropdown-item"
-            :aria-checked="conversationDisplay === 'tree'"
-            role="menuitemradio"
-            @click="conversationDisplay = 'tree'"
-          >
-            <span
-              class="input menu-checkbox -radio"
-              :aria-hidden="true"
-              :class="{ 'menu-checkbox-checked': conversationDisplay === 'tree' }"
-            /><FAIcon
-              icon="folder-tree"
-              :aria-hidden="true"
-            /> {{ $t('settings.conversation_display_tree_quick') }}
-          </button>
-          <button
-            class="menu-item dropdown-item"
-            :aria-checked="conversationDisplay === 'linear'"
-            role="menuitemradio"
-            @click="conversationDisplay = 'linear'"
-          >
-            <span
-              class="input menu-checkbox -radio"
-              :class="{ 'menu-checkbox-checked': conversationDisplay === 'linear' }"
-              :aria-hidden="true"
-            /><FAIcon
-              icon="list"
-              :aria-hidden="true"
-            /> {{ $t('settings.conversation_display_linear_quick') }}
-          </button>
+          <div class="menu-item dropdown-item -icon-double">
+            <button
+              class="main-button"
+              :aria-checked="conversationDisplay === 'tree'"
+              role="menuitemradio"
+              @click="conversationDisplay = 'tree'"
+            >
+              <span
+                class="input menu-checkbox -radio"
+                :aria-hidden="true"
+                :class="{ 'menu-checkbox-checked': conversationDisplay === 'tree' }"
+              /><FAIcon
+                icon="folder-tree"
+                :aria-hidden="true"
+                fixed-width
+              /> {{ $t('settings.conversation_display_tree_quick') }}
+            </button>
+          </div>
+          <div class="menu-item dropdown-item -icon-double">
+            <button
+              class="main-button"
+              :aria-checked="conversationDisplay === 'linear'"
+              role="menuitemradio"
+              @click="conversationDisplay = 'linear'"
+            >
+              <span
+                class="input menu-checkbox -radio"
+                :class="{ 'menu-checkbox-checked': conversationDisplay === 'linear' }"
+                :aria-hidden="true"
+              /><FAIcon
+                icon="list"
+                :aria-hidden="true"
+                fixed-width
+              /> {{ $t('settings.conversation_display_linear_quick') }}
+            </button>
+          </div>
         </div>
         <div
           role="separator"
           class="dropdown-divider"
         />
-        <button
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="showUserAvatars"
-          @click="showUserAvatars = !showUserAvatars"
-        >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': showUserAvatars }"
-            :aria-hidden="true"
-          />{{ $t('settings.mention_link_show_avatar_quick') }}
-        </button>
-        <button
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="showUserAvatars"
+            @click="showUserAvatars = !showUserAvatars"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': showUserAvatars }"
+              :aria-hidden="true"
+            />{{ $t('settings.mention_link_show_avatar_quick') }}
+          </button>
+        </div>
+        <div
           v-if="!conversation"
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="autoUpdate"
-          @click="autoUpdate = !autoUpdate"
+          class="menu-item dropdown-item -icon"
         >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': autoUpdate }"
-            :aria-hidden="true"
-          />{{ $t('settings.auto_update') }}
-        </button>
-        <button
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="autoUpdate"
+            @click="autoUpdate = !autoUpdate"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': autoUpdate }"
+              :aria-hidden="true"
+            />{{ $t('settings.auto_update') }}
+          </button>
+        </div>
+        <div
           v-if="!conversation"
-          class="menu-item dropdown-item"
-          role="menuitemcheckbox"
-          :aria-checked="collapseWithSubjects"
-          @click="collapseWithSubjects = !collapseWithSubjects"
+          class="menu-item dropdown-item -icon"
         >
-          <span
-            class="input menu-checkbox"
-            :class="{ 'menu-checkbox-checked': collapseWithSubjects }"
-            :aria-hidden="true"
-          />{{ $t('settings.collapse_subject') }}
-        </button>
-        <button
-          class="menu-item dropdown-item dropdown-item-icon"
-          role="menuitem"
-          @click="openTab('general')"
-        >
-          <FAIcon icon="wrench" />{{ $t('settings.more_settings') }}
-        </button>
+          <button
+            class="main-button"
+            role="menuitemcheckbox"
+            :aria-checked="collapseWithSubjects"
+            @click="collapseWithSubjects = !collapseWithSubjects"
+          >
+            <span
+              class="input menu-checkbox"
+              :class="{ 'menu-checkbox-checked': collapseWithSubjects }"
+              :aria-hidden="true"
+            />{{ $t('settings.collapse_subject') }}
+          </button>
+        </div>
+        <div class="menu-item dropdown-item -icon">
+          <button
+            class="main-button"
+            role="menuitem"
+            @click="openTab('general')"
+          >
+            <FAIcon
+              icon="wrench"
+              fixed-width
+            />{{ $t('settings.more_settings') }}
+          </button>
+        </div>
       </div>
     </template>
     <template #trigger>
diff --git a/src/components/react_button/react_button.js b/src/components/react_button/react_button.js
deleted file mode 100644
index 0d2521556..000000000
--- a/src/components/react_button/react_button.js
+++ /dev/null
@@ -1,54 +0,0 @@
-import Popover from '../popover/popover.vue'
-import EmojiPicker from '../emoji_picker/emoji_picker.vue'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import { faPlus, faTimes } from '@fortawesome/free-solid-svg-icons'
-import { faSmileBeam } from '@fortawesome/free-regular-svg-icons'
-
-library.add(
-  faPlus,
-  faTimes,
-  faSmileBeam
-)
-
-const ReactButton = {
-  props: ['status'],
-  data () {
-    return {
-      filterWord: '',
-      expanded: false
-    }
-  },
-  components: {
-    Popover,
-    EmojiPicker
-  },
-  methods: {
-    addReaction (event) {
-      const emoji = event.insertion
-      const existingReaction = this.status.emoji_reactions.find(r => r.name === emoji)
-      if (existingReaction && existingReaction.me) {
-        this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
-      } else {
-        this.$store.dispatch('reactWithEmoji', { id: this.status.id, emoji })
-      }
-    },
-    show () {
-      if (!this.expanded) {
-        this.$refs.picker.showPicker()
-      }
-    },
-    onShow () {
-      this.expanded = true
-    },
-    onClose () {
-      this.expanded = false
-    }
-  },
-  computed: {
-    hideCustomEmoji () {
-      return !this.$store.state.instance.pleromaCustomEmojiReactionsAvailable
-    }
-  }
-}
-
-export default ReactButton
diff --git a/src/components/react_button/react_button.vue b/src/components/react_button/react_button.vue
deleted file mode 100644
index e648e7e3b..000000000
--- a/src/components/react_button/react_button.vue
+++ /dev/null
@@ -1,115 +0,0 @@
-<template>
-  <span class="ReactButton">
-    <EmojiPicker
-      ref="picker"
-      :enable-sticker-picker="enableStickerPicker"
-      :hide-custom-emoji="hideCustomEmoji"
-      class="emoji-picker-panel"
-      @emoji="addReaction"
-      @show="onShow"
-      @close="onClose"
-    />
-    <span
-      class="button-unstyled popover-trigger"
-      role="button"
-      :tabindex="0"
-      :title="$t('tool_tip.add_reaction')"
-      @click.stop.prevent="show"
-    >
-      <FALayers>
-        <FAIcon
-          class="fa-scale-110 fa-old-padding"
-          :icon="['far', 'smile-beam']"
-        />
-        <FAIcon
-          v-show="!expanded"
-          class="focus-marker"
-          transform="shrink-6 up-9 right-17"
-          icon="plus"
-        />
-        <FAIcon
-          v-show="expanded"
-          class="focus-marker"
-          transform="shrink-6 up-9 right-17"
-          icon="times"
-        />
-      </FALayers>
-    </span>
-  </span>
-</template>
-
-<script src="./react_button.js"></script>
-
-<style lang="scss">
-@import "../../mixins";
-
-.ReactButton {
-  .reaction-picker-filter {
-    padding: 0.5em;
-    display: flex;
-
-    input {
-      flex: 1;
-    }
-  }
-
-  .reaction-picker-divider {
-    height: 1px;
-    width: 100%;
-    margin: 0.5em;
-    background-color: var(--border);
-  }
-
-  .reaction-picker {
-    width: 10em;
-    height: 9em;
-    font-size: 1.5em;
-    overflow-y: scroll;
-    display: flex;
-    flex-wrap: wrap;
-    padding: 0.5em;
-    text-align: center;
-    align-content: flex-start;
-    user-select: none;
-    mask:
-      linear-gradient(to top, white 0, transparent 100%) bottom no-repeat,
-      linear-gradient(to bottom, white 0, transparent 100%) top no-repeat,
-      linear-gradient(to top, white, white);
-    transition: mask-size 150ms;
-    mask-size: 100% 20px, 100% 20px, auto;
-
-    /* Autoprefixed seem to ignore this one, and also syntax is different */
-    mask-composite: xor;
-    mask-composite: exclude;
-
-    .emoji-button {
-      cursor: pointer;
-      flex-basis: 20%;
-      line-height: 1.5;
-      align-content: center;
-
-      &:hover {
-        transform: scale(1.25);
-      }
-    }
-  }
-
-  .popover-trigger {
-    padding: 10px;
-    margin: -10px;
-
-    @include unfocused-style {
-      .focus-marker {
-        visibility: hidden;
-      }
-    }
-
-    @include focused-style {
-      .focus-marker {
-        visibility: visible;
-      }
-    }
-  }
-}
-
-</style>
diff --git a/src/components/registration/registration.js b/src/components/registration/registration.js
index 78d319804..53a678680 100644
--- a/src/components/registration/registration.js
+++ b/src/components/registration/registration.js
@@ -4,6 +4,7 @@ import { mapActions, mapState } from 'vuex'
 import InterfaceLanguageSwitcher from '../interface_language_switcher/interface_language_switcher.vue'
 import localeService from '../../services/locale/locale.service.js'
 import { DAY } from 'src/services/date_utils/date_utils.js'
+import TermsOfServicePanel from '../terms_of_service_panel/terms_of_service_panel.vue'
 
 const registration = {
   setup () { return { v$: useVuelidate() } },
@@ -21,7 +22,8 @@ const registration = {
     captcha: {}
   }),
   components: {
-    InterfaceLanguageSwitcher
+    InterfaceLanguageSwitcher,
+    TermsOfServicePanel
   },
   validations () {
     return {
@@ -86,6 +88,7 @@ const registration = {
       signUpNotice: (state) => state.users.signUpNotice,
       hasSignUpNotice: (state) => !!state.users.signUpNotice.message,
       termsOfService: (state) => state.instance.tos,
+      embeddedToS: (state) => state.instance.embeddedToS,
       accountActivationRequired: (state) => state.instance.accountActivationRequired,
       accountApprovalRequired: (state) => state.instance.accountApprovalRequired,
       birthdayRequired: (state) => state.instance.birthdayRequired,
diff --git a/src/components/registration/registration.vue b/src/components/registration/registration.vue
index a2008d871..b969a416e 100644
--- a/src/components/registration/registration.vue
+++ b/src/components/registration/registration.vue
@@ -1,319 +1,325 @@
 <template>
-  <div class="settings panel panel-default">
-    <div class="panel-heading">
-      {{ $t('registration.registration') }}
-    </div>
-    <div
-      v-if="!hasSignUpNotice"
-      class="panel-body"
-    >
-      <form
-        class="registration-form"
-        @submit.prevent="submit(user)"
+  <div class="column-inner">
+    <TermsOfServicePanel v-if="!hasSignUpNotice && !embeddedToS" />
+    <div class="settings panel panel-default">
+      <div class="panel-heading">
+        <h1 class="title">
+          {{ $t('registration.registration') }}
+        </h1>
+      </div>
+      <div
+        v-if="!hasSignUpNotice"
+        class="panel-body"
       >
-        <div class="container">
-          <div class="text-fields">
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.username.$error }"
-            >
-              <label
-                class="form--label"
-                for="sign-up-username"
-              >{{ $t('login.username') }}</label>
-              <input
-                id="sign-up-username"
-                v-model.trim="v$.user.username.$model"
-                :disabled="isPending"
-                class="input form-control"
-                :aria-required="true"
-                :placeholder="$t('registration.username_placeholder')"
+        <form
+          class="registration-form"
+          @submit.prevent="submit(user)"
+        >
+          <div class="container">
+            <div class="text-fields">
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.username.$error }"
               >
-            </div>
-            <div
-              v-if="v$.user.username.$dirty"
-              class="form-error"
-            >
-              <ul>
-                <li v-if="!v$.user.username.required">
-                  <span>{{ $t('registration.validations.username_required') }}</span>
-                </li>
-              </ul>
-            </div>
-
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.fullname.$error }"
-            >
-              <label
-                class="form--label"
-                for="sign-up-fullname"
-              >{{ $t('registration.fullname') }}</label>
-              <input
-                id="sign-up-fullname"
-                v-model.trim="v$.user.fullname.$model"
-                :disabled="isPending"
-                class="input form-control"
-                :aria-required="true"
-                :placeholder="$t('registration.fullname_placeholder')"
-              >
-            </div>
-            <div
-              v-if="v$.user.fullname.$dirty"
-              class="form-error"
-            >
-              <ul>
-                <li v-if="!v$.user.fullname.required">
-                  <span>{{ $t('registration.validations.fullname_required') }}</span>
-                </li>
-              </ul>
-            </div>
-
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.email.$error }"
-            >
-              <label
-                class="form--label"
-                for="email"
-              >{{ accountActivationRequired ? $t('registration.email') : $t('registration.email_optional') }}</label>
-              <input
-                id="email"
-                v-model="v$.user.email.$model"
-                :disabled="isPending"
-                class="input form-control"
-                type="email"
-                :aria-required="accountActivationRequired"
-              >
-            </div>
-            <div
-              v-if="v$.user.email.$dirty"
-              class="form-error"
-            >
-              <ul>
-                <li v-if="!v$.user.email.required">
-                  <span>{{ $t('registration.validations.email_required') }}</span>
-                </li>
-              </ul>
-            </div>
-
-            <div class="form-group">
-              <label
-                class="form--label"
-                for="bio"
-              >{{ $t('registration.bio_optional') }}</label>
-              <textarea
-                id="bio"
-                v-model="user.bio"
-                :disabled="isPending"
-                class="input form-control"
-                :placeholder="bioPlaceholder"
-              />
-            </div>
-
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.password.$error }"
-            >
-              <label
-                class="form--label"
-                for="sign-up-password"
-              >{{ $t('login.password') }}</label>
-              <input
-                id="sign-up-password"
-                v-model="user.password"
-                :disabled="isPending"
-                class="input form-control"
-                type="password"
-                :aria-required="true"
-              >
-            </div>
-            <div
-              v-if="v$.user.password.$dirty"
-              class="form-error"
-            >
-              <ul>
-                <li v-if="!v$.user.password.required">
-                  <span>{{ $t('registration.validations.password_required') }}</span>
-                </li>
-              </ul>
-            </div>
-
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.confirm.$error }"
-            >
-              <label
-                class="form--label"
-                for="sign-up-password-confirmation"
-              >{{ $t('registration.password_confirm') }}</label>
-              <input
-                id="sign-up-password-confirmation"
-                v-model="user.confirm"
-                :disabled="isPending"
-                class="input form-control"
-                type="password"
-                :aria-required="true"
-              >
-            </div>
-            <div
-              v-if="v$.user.confirm.$dirty"
-              class="form-error"
-            >
-              <ul>
-                <li v-if="v$.user.confirm.required.$invalid">
-                  <span>{{ $t('registration.validations.password_confirmation_required') }}</span>
-                </li>
-                <li v-if="v$.user.confirm.sameAs.$invalid">
-                  <span>{{ $t('registration.validations.password_confirmation_match') }}</span>
-                </li>
-              </ul>
-            </div>
-
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.birthday.$error }"
-            >
-              <label
-                class="form--label"
-                for="sign-up-birthday"
-              >
-                {{ birthdayRequired ? $t('registration.birthday') : $t('registration.birthday_optional') }}
-              </label>
-              <input
-                id="sign-up-birthday"
-                v-model="user.birthday"
-                :disabled="isPending"
-                class="input form-control"
-                type="date"
-                :max="birthdayRequired ? birthdayMinAttr : undefined"
-                :aria-required="birthdayRequired"
-              >
-            </div>
-            <div
-              v-if="v$.user.birthday.$dirty"
-              class="form-error"
-            >
-              <ul>
-                <li v-if="v$.user.birthday.required.$invalid">
-                  <span>{{ $t('registration.validations.birthday_required') }}</span>
-                </li>
-                <li v-if="v$.user.birthday.maxValue.$invalid">
-                  <span>{{ $tc('registration.validations.birthday_min_age', { date: birthdayMinFormatted }) }}</span>
-                </li>
-              </ul>
-            </div>
-
-            <div
-              class="form-group"
-              :class="{ 'form-group--error': v$.user.language.$error }"
-            >
-              <interface-language-switcher
-                for="email-language"
-                :prompt-text="$t('registration.email_language')"
-                :language="v$.user.language.$model"
-                :set-language="val => v$.user.language.$model = val"
-                @click.stop.prevent
-              />
-            </div>
-
-            <div
-              v-if="accountApprovalRequired"
-              class="form-group"
-            >
-              <label
-                class="form--label"
-                for="reason"
-              >{{ $t('registration.reason') }}</label>
-              <textarea
-                id="reason"
-                v-model="user.reason"
-                :disabled="isPending"
-                class="input form-control"
-                :placeholder="reasonPlaceholder"
-              />
-            </div>
-
-            <div
-              v-if="captcha.type != 'none'"
-              id="captcha-group"
-              class="form-group"
-            >
-              <label
-                class="form--label"
-                for="captcha-label"
-              >{{ $t('registration.captcha') }}</label>
-
-              <template v-if="['kocaptcha', 'native'].includes(captcha.type)">
-                <img
-                  :src="captcha.url"
-                  @click="setCaptcha"
-                >
-
-                <sub>{{ $t('registration.new_captcha') }}</sub>
-
+                <label
+                  class="form--label"
+                  for="sign-up-username"
+                >{{ $t('login.username') }}</label>
                 <input
-                  id="captcha-answer"
-                  v-model="captcha.solution"
+                  id="sign-up-username"
+                  v-model.trim="v$.user.username.$model"
                   :disabled="isPending"
                   class="input form-control"
-                  type="text"
-                  autocomplete="off"
-                  autocorrect="off"
-                  autocapitalize="off"
-                  spellcheck="false"
+                  :aria-required="true"
+                  :placeholder="$t('registration.username_placeholder')"
                 >
-              </template>
+              </div>
+              <div
+                v-if="v$.user.username.$dirty"
+                class="form-error"
+              >
+                <ul>
+                  <li v-if="!v$.user.username.required">
+                    <span>{{ $t('registration.validations.username_required') }}</span>
+                  </li>
+                </ul>
+              </div>
+
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.fullname.$error }"
+              >
+                <label
+                  class="form--label"
+                  for="sign-up-fullname"
+                >{{ $t('registration.fullname') }}</label>
+                <input
+                  id="sign-up-fullname"
+                  v-model.trim="v$.user.fullname.$model"
+                  :disabled="isPending"
+                  class="input form-control"
+                  :aria-required="true"
+                  :placeholder="$t('registration.fullname_placeholder')"
+                >
+              </div>
+              <div
+                v-if="v$.user.fullname.$dirty"
+                class="form-error"
+              >
+                <ul>
+                  <li v-if="!v$.user.fullname.required">
+                    <span>{{ $t('registration.validations.fullname_required') }}</span>
+                  </li>
+                </ul>
+              </div>
+
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.email.$error }"
+              >
+                <label
+                  class="form--label"
+                  for="email"
+                >{{ accountActivationRequired ? $t('registration.email') : $t('registration.email_optional') }}</label>
+                <input
+                  id="email"
+                  v-model="v$.user.email.$model"
+                  :disabled="isPending"
+                  class="input form-control"
+                  type="email"
+                  :aria-required="accountActivationRequired"
+                >
+              </div>
+              <div
+                v-if="v$.user.email.$dirty"
+                class="form-error"
+              >
+                <ul>
+                  <li v-if="!v$.user.email.required">
+                    <span>{{ $t('registration.validations.email_required') }}</span>
+                  </li>
+                </ul>
+              </div>
+
+              <div class="form-group">
+                <label
+                  class="form--label"
+                  for="bio"
+                >{{ $t('registration.bio_optional') }}</label>
+                <textarea
+                  id="bio"
+                  v-model="user.bio"
+                  :disabled="isPending"
+                  class="input form-control"
+                  :placeholder="bioPlaceholder"
+                />
+              </div>
+
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.password.$error }"
+              >
+                <label
+                  class="form--label"
+                  for="sign-up-password"
+                >{{ $t('login.password') }}</label>
+                <input
+                  id="sign-up-password"
+                  v-model="user.password"
+                  :disabled="isPending"
+                  class="input form-control"
+                  type="password"
+                  :aria-required="true"
+                >
+              </div>
+              <div
+                v-if="v$.user.password.$dirty"
+                class="form-error"
+              >
+                <ul>
+                  <li v-if="!v$.user.password.required">
+                    <span>{{ $t('registration.validations.password_required') }}</span>
+                  </li>
+                </ul>
+              </div>
+
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.confirm.$error }"
+              >
+                <label
+                  class="form--label"
+                  for="sign-up-password-confirmation"
+                >{{ $t('registration.password_confirm') }}</label>
+                <input
+                  id="sign-up-password-confirmation"
+                  v-model="user.confirm"
+                  :disabled="isPending"
+                  class="input form-control"
+                  type="password"
+                  :aria-required="true"
+                >
+              </div>
+              <div
+                v-if="v$.user.confirm.$dirty"
+                class="form-error"
+              >
+                <ul>
+                  <li v-if="v$.user.confirm.required.$invalid">
+                    <span>{{ $t('registration.validations.password_confirmation_required') }}</span>
+                  </li>
+                  <li v-if="v$.user.confirm.sameAs.$invalid">
+                    <span>{{ $t('registration.validations.password_confirmation_match') }}</span>
+                  </li>
+                </ul>
+              </div>
+
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.birthday.$error }"
+              >
+                <label
+                  class="form--label"
+                  for="sign-up-birthday"
+                >
+                  {{ birthdayRequired ? $t('registration.birthday') : $t('registration.birthday_optional') }}
+                </label>
+                <input
+                  id="sign-up-birthday"
+                  v-model="user.birthday"
+                  :disabled="isPending"
+                  class="input form-control"
+                  type="date"
+                  :max="birthdayRequired ? birthdayMinAttr : undefined"
+                  :aria-required="birthdayRequired"
+                >
+              </div>
+              <div
+                v-if="v$.user.birthday.$dirty"
+                class="form-error"
+              >
+                <ul>
+                  <li v-if="v$.user.birthday.required.$invalid">
+                    <span>{{ $t('registration.validations.birthday_required') }}</span>
+                  </li>
+                  <li v-if="v$.user.birthday.maxValue.$invalid">
+                    <span>{{ $t('registration.validations.birthday_min_age', { date: birthdayMinFormatted }) }}</span>
+                  </li>
+                </ul>
+              </div>
+
+              <div
+                class="form-group"
+                :class="{ 'form-group--error': v$.user.language.$error }"
+              >
+                <interface-language-switcher
+                  for="email-language"
+                  :prompt-text="$t('registration.email_language')"
+                  :language="v$.user.language.$model"
+                  :set-language="val => v$.user.language.$model = val"
+                  @click.stop.prevent
+                />
+              </div>
+
+              <div
+                v-if="accountApprovalRequired"
+                class="form-group"
+              >
+                <label
+                  class="form--label"
+                  for="reason"
+                >{{ $t('registration.reason') }}</label>
+                <textarea
+                  id="reason"
+                  v-model="user.reason"
+                  :disabled="isPending"
+                  class="input form-control"
+                  :placeholder="reasonPlaceholder"
+                />
+              </div>
+
+              <div
+                v-if="captcha.type != 'none'"
+                id="captcha-group"
+                class="form-group"
+              >
+                <label
+                  class="form--label"
+                  for="captcha-label"
+                >{{ $t('registration.captcha') }}</label>
+
+                <template v-if="['kocaptcha', 'native'].includes(captcha.type)">
+                  <img
+                    :src="captcha.url"
+                    @click="setCaptcha"
+                  >
+
+                  <sub>{{ $t('registration.new_captcha') }}</sub>
+
+                  <input
+                    id="captcha-answer"
+                    v-model="captcha.solution"
+                    :disabled="isPending"
+                    class="input form-control"
+                    type="text"
+                    autocomplete="off"
+                    autocorrect="off"
+                    autocapitalize="off"
+                    spellcheck="false"
+                  >
+                </template>
+              </div>
+
+              <div
+                v-if="token"
+                class="form-group"
+              >
+                <label for="token">{{ $t('registration.token') }}</label>
+                <input
+                  id="token"
+                  v-model="token"
+                  disabled="true"
+                  class="input form-control"
+                  type="text"
+                >
+              </div>
+              <div class="form-group">
+                <button
+                  :disabled="isPending"
+                  type="submit"
+                  class="btn button-default"
+                >
+                  {{ $t('registration.register') }}
+                </button>
+              </div>
             </div>
 
+            <!-- eslint-disable vue/no-v-html -->
             <div
-              v-if="token"
-              class="form-group"
-            >
-              <label for="token">{{ $t('registration.token') }}</label>
-              <input
-                id="token"
-                v-model="token"
-                disabled="true"
-                class="input form-control"
-                type="text"
-              >
-            </div>
-            <div class="form-group">
-              <button
-                :disabled="isPending"
-                type="submit"
-                class="btn button-default"
-              >
-                {{ $t('registration.register') }}
-              </button>
-            </div>
-          </div>
-
-          <!-- eslint-disable vue/no-v-html -->
-          <div
-            class="terms-of-service"
-            v-html="termsOfService"
-          />
+              v-if="embeddedToS"
+              class="terms-of-service"
+              v-html="termsOfService"
+            />
           <!-- eslint-enable vue/no-v-html -->
-        </div>
-        <div
-          v-if="serverValidationErrors.length"
-          class="form-group"
-        >
-          <div class="alert error">
-            <span
-              v-for="error in serverValidationErrors"
-              :key="error"
-            >{{ error }}</span>
           </div>
-        </div>
-      </form>
-    </div>
-    <div v-else>
-      <p class="registration-notice">
-        {{ signUpNotice.message }}
-      </p>
+          <div
+            v-if="serverValidationErrors.length"
+            class="form-group"
+          >
+            <div class="alert error">
+              <span
+                v-for="error in serverValidationErrors"
+                :key="error"
+              >{{ error }}</span>
+            </div>
+          </div>
+        </form>
+      </div>
+      <div v-else>
+        <p class="registration-notice">
+          {{ signUpNotice.message }}
+        </p>
+      </div>
     </div>
   </div>
 </template>
@@ -323,7 +329,7 @@
 .registration-form {
   display: flex;
   flex-direction: column;
-  margin: 0.6em;
+  margin: 1em;
 
   .container {
     display: flex;
@@ -336,7 +342,7 @@
 
   .terms-of-service {
     flex: 0 1 50%;
-    margin: 0.8em;
+    margin: 0.6em 0 0 0.8em;
   }
 
   .text-fields {
@@ -389,7 +395,7 @@
   }
 
   form textarea {
-    line-height: 16px;
+    line-height: 1;
     resize: vertical;
   }
 
@@ -412,9 +418,13 @@
   margin: 0.6em;
 }
 
-@media all and (max-width: 800px) {
+@media all and (width <= 800px) {
   .registration-form .container {
     flex-direction: column-reverse;
+
+    .terms-of-service {
+      margin: 0;
+    }
   }
 }
 </style>
diff --git a/src/components/remote_follow/remote_follow.js b/src/components/remote_follow/remote_follow.js
index 56b264fc9..951b59419 100644
--- a/src/components/remote_follow/remote_follow.js
+++ b/src/components/remote_follow/remote_follow.js
@@ -2,7 +2,6 @@ export default {
   props: ['user'],
   computed: {
     subscribeUrl () {
-      // eslint-disable-next-line no-undef
       const serverUrl = new URL(this.user.statusnet_profile_url)
       return `${serverUrl.protocol}//${serverUrl.host}/main/ostatus`
     }
diff --git a/src/components/remote_user_resolver/remote_user_resolver.vue b/src/components/remote_user_resolver/remote_user_resolver.vue
index 07aac169f..cbd4d19c4 100644
--- a/src/components/remote_user_resolver/remote_user_resolver.vue
+++ b/src/components/remote_user_resolver/remote_user_resolver.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="panel panel-default">
     <div class="panel-heading">
-      {{ $t('remote_user_resolver.remote_user_resolver') }}
+      <h1 class="title">
+        {{ $t('remote_user_resolver.remote_user_resolver') }}
+      </h1>
     </div>
     <div class="panel-body">
       <p>
diff --git a/src/components/remove_follower_button/remove_follower_button.vue b/src/components/remove_follower_button/remove_follower_button.vue
index 0012aebd1..3054770d9 100644
--- a/src/components/remove_follower_button/remove_follower_button.vue
+++ b/src/components/remove_follower_button/remove_follower_button.vue
@@ -17,6 +17,7 @@
         @cancelled="hideConfirmRemoveUserFromFollowers"
       >
         <i18n-t
+          scope="global"
           keypath="user_card.remove_follower_confirm"
           tag="span"
         >
diff --git a/src/components/reply_button/reply_button.js b/src/components/reply_button/reply_button.js
deleted file mode 100644
index 543d25ac2..000000000
--- a/src/components/reply_button/reply_button.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faReply,
-  faPlus,
-  faTimes
-} from '@fortawesome/free-solid-svg-icons'
-
-library.add(
-  faReply,
-  faPlus,
-  faTimes
-)
-
-const ReplyButton = {
-  name: 'ReplyButton',
-  props: ['status', 'replying'],
-  computed: {
-    loggedIn () {
-      return !!this.$store.state.users.currentUser
-    },
-    remoteInteractionLink () {
-      return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
-    }
-  }
-}
-
-export default ReplyButton
diff --git a/src/components/reply_button/reply_button.vue b/src/components/reply_button/reply_button.vue
deleted file mode 100644
index 87c06e391..000000000
--- a/src/components/reply_button/reply_button.vue
+++ /dev/null
@@ -1,96 +0,0 @@
-<template>
-  <div class="ReplyButton">
-    <button
-      v-if="loggedIn"
-      class="button-unstyled interactive"
-      :class="{'-active': replying}"
-      :title="$t('tool_tip.reply')"
-      @click.prevent="$emit('toggle')"
-    >
-      <FALayers class="fa-old-padding-layer">
-        <FAIcon
-          class="fa-scale-110"
-          icon="reply"
-        />
-        <FAIcon
-          v-if="!replying"
-          class="focus-marker"
-          transform="shrink-6 up-8 right-11"
-          icon="plus"
-        />
-        <FAIcon
-          v-else
-          class="focus-marker"
-          transform="shrink-6 up-8 right-11"
-          icon="times"
-        />
-      </FALayers>
-    </button>
-    <a
-      v-else
-      class="button-unstyled interactive"
-      target="_blank"
-      role="button"
-      :href="remoteInteractionLink"
-      :title="$t('tool_tip.reply')"
-    >
-      <FALayers class="fa-old-padding-layer">
-        <FAIcon
-          class="fa-scale-110"
-          icon="reply"
-        />
-        <FAIcon
-          v-if="!replying"
-          class="focus-marker"
-          transform="shrink-6 up-8 right-16"
-          icon="plus"
-        />
-      </FALayers>
-    </a>
-    <span
-      v-if="status.replies_count > 0"
-      class="action-counter"
-    >
-      {{ status.replies_count }}
-    </span>
-  </div>
-</template>
-
-<script src="./reply_button.js"></script>
-
-<style lang="scss">
-@import "../../mixins";
-
-.ReplyButton {
-  display: flex;
-
-  > :first-child {
-    padding: 10px;
-    margin: -10px -8px -10px -10px;
-  }
-
-  .action-counter {
-    pointer-events: none;
-    user-select: none;
-  }
-
-  .interactive {
-    &:hover .svg-inline--fa,
-    &.-active .svg-inline--fa {
-      color: var(--cBlue);
-    }
-
-    @include unfocused-style {
-      .focus-marker {
-        visibility: hidden;
-      }
-    }
-
-    @include focused-style {
-      .focus-marker {
-        visibility: visible;
-      }
-    }
-  }
-}
-</style>
diff --git a/src/components/report/report.js b/src/components/report/report.js
index f8675c0f5..6e9f21eea 100644
--- a/src/components/report/report.js
+++ b/src/components/report/report.js
@@ -1,3 +1,4 @@
+import { useReportsStore } from 'src/stores/reports'
 import Select from '../select/select.vue'
 import StatusContent from '../status_content/status_content.vue'
 import Timeago from '../timeago/timeago.vue'
@@ -16,7 +17,7 @@ const Report = {
   },
   computed: {
     report () {
-      return this.$store.state.reports.reports[this.reportId] || {}
+      return useReportsStore().reports[this.reportId] || {}
     },
     state: {
       get: function () { return this.report.state },
@@ -28,7 +29,7 @@ const Report = {
       return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
     },
     setReportState (state) {
-      return this.$store.dispatch('setReportState', { id: this.report.id, state })
+      return useReportsStore().setReportState({ id: this.report.id, state })
     }
   }
 }
diff --git a/src/components/retweet_button/retweet_button.js b/src/components/retweet_button/retweet_button.js
deleted file mode 100644
index 198b6c14b..000000000
--- a/src/components/retweet_button/retweet_button.js
+++ /dev/null
@@ -1,68 +0,0 @@
-import ConfirmModal from '../confirm_modal/confirm_modal.vue'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faRetweet,
-  faPlus,
-  faMinus,
-  faCheck
-} from '@fortawesome/free-solid-svg-icons'
-
-library.add(
-  faRetweet,
-  faPlus,
-  faMinus,
-  faCheck
-)
-
-const RetweetButton = {
-  props: ['status', 'loggedIn', 'visibility'],
-  components: {
-    ConfirmModal
-  },
-  data () {
-    return {
-      animated: false,
-      showingConfirmDialog: false
-    }
-  },
-  methods: {
-    retweet () {
-      if (!this.status.repeated && this.shouldConfirmRepeat) {
-        this.showConfirmDialog()
-      } else {
-        this.doRetweet()
-      }
-    },
-    doRetweet () {
-      if (!this.status.repeated) {
-        this.$store.dispatch('retweet', { id: this.status.id })
-      } else {
-        this.$store.dispatch('unretweet', { id: this.status.id })
-      }
-      this.animated = true
-      setTimeout(() => {
-        this.animated = false
-      }, 500)
-      this.hideConfirmDialog()
-    },
-    showConfirmDialog () {
-      this.showingConfirmDialog = true
-    },
-    hideConfirmDialog () {
-      this.showingConfirmDialog = false
-    }
-  },
-  computed: {
-    mergedConfig () {
-      return this.$store.getters.mergedConfig
-    },
-    remoteInteractionLink () {
-      return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
-    },
-    shouldConfirmRepeat () {
-      return this.mergedConfig.modalOnRepeat
-    }
-  }
-}
-
-export default RetweetButton
diff --git a/src/components/retweet_button/retweet_button.vue b/src/components/retweet_button/retweet_button.vue
deleted file mode 100644
index adda9a429..000000000
--- a/src/components/retweet_button/retweet_button.vue
+++ /dev/null
@@ -1,133 +0,0 @@
-<template>
-  <div class="RetweetButton">
-    <button
-      v-if="visibility !== 'private' && visibility !== 'direct' && loggedIn"
-      class="button-unstyled interactive"
-      :class="status.repeated && '-repeated'"
-      :title="$t('tool_tip.repeat')"
-      @click.prevent="retweet()"
-    >
-      <FALayers class="fa-old-padding-layer">
-        <FAIcon
-          class="fa-scale-110"
-          icon="retweet"
-          :spin="animated"
-        />
-        <FAIcon
-          v-if="status.repeated"
-          class="active-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="check"
-        />
-        <FAIcon
-          v-if="!status.repeated"
-          class="focus-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="plus"
-        />
-        <FAIcon
-          v-else
-          class="focus-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="minus"
-        />
-      </FALayers>
-    </button>
-    <span v-else-if="loggedIn">
-      <FAIcon
-        class="fa-scale-110 fa-old-padding"
-        icon="lock"
-        :title="$t('timeline.no_retweet_hint')"
-      />
-    </span>
-    <a
-      v-else
-      class="button-unstyled interactive"
-      target="_blank"
-      role="button"
-      :title="$t('tool_tip.repeat')"
-      :href="remoteInteractionLink"
-    >
-      <FALayers class="fa-old-padding-layer">
-        <FAIcon
-          class="fa-scale-110"
-          icon="retweet"
-        />
-        <FAIcon
-          class="focus-marker"
-          transform="shrink-6 up-9 right-12"
-          icon="plus"
-        />
-      </FALayers>
-    </a>
-    <span
-      v-if="!mergedConfig.hidePostStats && status.repeat_num > 0"
-      class="no-event"
-    >
-      {{ status.repeat_num }}
-    </span>
-    <teleport to="#modal">
-      <confirm-modal
-        v-if="showingConfirmDialog"
-        :title="$t('status.repeat_confirm_title')"
-        :confirm-text="$t('status.repeat_confirm_accept_button')"
-        :cancel-text="$t('status.repeat_confirm_cancel_button')"
-        @accepted="doRetweet"
-        @cancelled="hideConfirmDialog"
-      >
-        {{ $t('status.repeat_confirm') }}
-      </confirm-modal>
-    </teleport>
-  </div>
-</template>
-
-<script src="./retweet_button.js"></script>
-
-<style lang="scss">
-@import "../../mixins";
-
-.RetweetButton {
-  display: flex;
-
-  > :first-child {
-    padding: 10px;
-    margin: -10px -8px -10px -10px;
-  }
-
-  .action-counter {
-    pointer-events: none;
-    user-select: none;
-  }
-
-  .interactive {
-    .svg-inline--fa {
-      animation-duration: 0.6s;
-    }
-
-    &:hover .svg-inline--fa,
-    &.-repeated .svg-inline--fa {
-      color: var(--cGreen);
-    }
-
-    @include unfocused-style {
-      .focus-marker {
-        visibility: hidden;
-      }
-
-      .active-marker {
-        visibility: visible;
-      }
-    }
-
-    @include focused-style {
-      .focus-marker {
-        visibility: visible;
-      }
-
-      .active-marker {
-        visibility: hidden;
-      }
-    }
-  }
-}
-</style>
diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx
index 99d7daca8..5adc2443a 100644
--- a/src/components/rich_content/rich_content.jsx
+++ b/src/components/rich_content/rich_content.jsx
@@ -2,8 +2,9 @@ import { unescape, flattenDeep } from 'lodash'
 import { getTagName, processTextForEmoji, getAttrs } from 'src/services/html_converter/utility.service.js'
 import { convertHtmlToTree } from 'src/services/html_converter/html_tree_converter.service.js'
 import { convertHtmlToLines } from 'src/services/html_converter/html_line_converter.service.js'
-import StillImage from 'src/components/still-image/still-image.vue'
-import MentionsLine, { MENTIONS_LIMIT } from 'src/components/mentions_line/mentions_line.vue'
+import StillImageEmojiPopover from 'src/components/still-image/still-image-emoji-popover.vue'
+import MentionsLine from 'src/components/mentions_line/mentions_line.vue'
+import { MENTIONS_LIMIT } from 'src/components/mentions_line/mentions_line.js'
 import HashtagLink from 'src/components/hashtag_link/hashtag_link.vue'
 
 import './rich_content.scss'
@@ -85,6 +86,24 @@ export default {
       required: false,
       type: Boolean,
       default: false
+    },
+    // Collapse newlines
+    collapse: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    /* Content comes from current instance
+     *
+     * This is used for emoji stealing popover.
+     * By default we assume it is, so that steal
+     * emoji button isn't shown where it probably
+     * should not be.
+     */
+    isLocal: {
+      required: false,
+      type: Boolean,
+      default: true
     }
   },
   // NEVER EVER TOUCH DATA INSIDE RENDER
@@ -161,11 +180,14 @@ export default {
             item,
             this.emoji,
             ({ shortcode, url }) => {
-              return <StillImage
+              return <StillImageEmojiPopover
                 class="emoji img"
                 src={url}
                 title={`:${shortcode}:`}
                 alt={`:${shortcode}:`}
+
+                shortcode={shortcode}
+                isLocal={this.isLocal}
               />
             }
           )]
@@ -280,11 +302,20 @@ export default {
 
     const pass1 = convertHtmlToTree(html).map(processItem)
     const pass2 = [...pass1].reverse().map(processItemReverse).reverse()
+
     // DO NOT USE SLOTS they cause a re-render feedback loop here.
     // slots updated -> rerender -> emit -> update up the tree -> rerender -> ...
     // at least until vue3?
-    const result = <span class={['RichContent', this.faint ? '-faint' : '']}>
-      { pass2 }
+    const result =
+    <span class={['RichContent', this.faint ? '-faint' : '']}>
+      {
+        this.collapse
+          ? pass2.map(x => {
+            if (!Array.isArray(x)) return x.replace(/\n/g, ' ')
+            return x.map(y => y.type === 'br' ? ' ' : y)
+          })
+          : pass2
+      }
     </span>
 
     const event = {
diff --git a/src/components/rich_content/rich_content.scss b/src/components/rich_content/rich_content.scss
index 118b6acfc..d2ec77dcb 100644
--- a/src/components/rich_content/rich_content.scss
+++ b/src/components/rich_content/rich_content.scss
@@ -2,12 +2,17 @@
   font-family: var(--font);
 
   &.-faint {
+    color: var(--text);
     /* stylelint-disable declaration-no-important */
     --text: var(--textFaint) !important;
     --link: var(--linkFaint) !important;
     --funtextGreentext: var(--funtextGreentextFaint) !important;
     --funtextCyantext: var(--funtextCyantextFaint) !important;
     /* stylelint-enable declaration-no-important */
+
+    a {
+      color: var(--linkFaint);
+    }
   }
 
   blockquote {
@@ -59,6 +64,11 @@
 
   .img {
     display: inline-block;
+
+    // fix vertical alignment of stealable emoji
+    button {
+      display: inline-flex;
+    }
   }
 
   .emoji {
diff --git a/src/components/rich_content/rich_content.style.js b/src/components/rich_content/rich_content.style.js
deleted file mode 100644
index c83140003..000000000
--- a/src/components/rich_content/rich_content.style.js
+++ /dev/null
@@ -1,18 +0,0 @@
-export default {
-  name: 'RichContent',
-  selector: '.RichContent',
-  validInnerComponents: [
-    'Text',
-    'FunText',
-    'Link'
-  ],
-  defaultRules: [
-    {
-      directives: {
-        '--font': 'generic | inherit',
-        '--monoFont': 'generic | monospace',
-        textNoCssColor: 'yes'
-      }
-    }
-  ]
-}
diff --git a/src/components/root.style.js b/src/components/root.style.js
index 4bd735aa5..5075e33c8 100644
--- a/src/components/root.style.js
+++ b/src/components/root.style.js
@@ -1,22 +1,7 @@
 export default {
   name: 'Root',
   selector: ':root',
-  validInnerComponents: [
-    'Underlay',
-    'Modals',
-    'Popover',
-    'TopBar',
-    'Scrollbar',
-    'ScrollbarElement',
-    'MobileDrawer',
-    'Alert',
-    'Button' // mobile post button
-  ],
-  validInnerComponentsLite: [
-    'Underlay',
-    'Scrollbar',
-    'ScrollbarElement'
-  ],
+  notEditable: true,
   defaultRules: [
     {
       directives: {
@@ -42,7 +27,7 @@ export default {
 
         // Selection colors
         '--selectionBackground': 'color | --accent',
-        '--selectionText': 'color | $textColor(--accent, --text, no-preserve)'
+        '--selectionText': 'color | $textColor(--accent --text no-preserve)'
       }
     }
   ]
diff --git a/src/components/roundness_input/roundness_input.vue b/src/components/roundness_input/roundness_input.vue
new file mode 100644
index 000000000..1da71ca79
--- /dev/null
+++ b/src/components/roundness_input/roundness_input.vue
@@ -0,0 +1,51 @@
+<template>
+  <div
+    class="roundness-control style-control"
+    :class="{ disabled: !present || disabled }"
+  >
+    <label
+      :for="name"
+      class="label"
+      :class="{ faint: !present || disabled }"
+    >
+      {{ label }}
+    </label>
+    <Checkbox
+      v-if="typeof fallback !== 'undefined'"
+      :model-value="present"
+      :disabled="disabled"
+      class="opt"
+      @update:model-value="$emit('update:modelValue', !present ? fallback : undefined)"
+    />
+    <input
+      :id="name"
+      class="input input-number"
+      type="number"
+      :value="modelValue || fallback"
+      :disabled="!present || disabled"
+      :class="{ disabled: !present || disabled }"
+      max="999"
+      min="0"
+      step="1"
+      @input="$emit('update:modelValue', $event.target.value)"
+    >
+  </div>
+</template>
+
+<script>
+import Checkbox from '../checkbox/checkbox.vue'
+export default {
+  components: {
+    Checkbox
+  },
+  props: [
+    'name', 'label', 'modelValue', 'fallback', 'disabled'
+  ],
+  emits: ['update:modelValue'],
+  computed: {
+    present () {
+      return typeof this.modelValue !== 'undefined'
+    }
+  }
+}
+</script>
diff --git a/src/components/scope_selector/scope_selector.js b/src/components/scope_selector/scope_selector.js
index 52cda368b..462892cb6 100644
--- a/src/components/scope_selector/scope_selector.js
+++ b/src/components/scope_selector/scope_selector.js
@@ -14,13 +14,33 @@ library.add(
 )
 
 const ScopeSelector = {
-  props: [
-    'showAll',
-    'userDefault',
-    'originalScope',
-    'initialScope',
-    'onScopeChange'
-  ],
+  props: {
+    showAll: {
+      required: true,
+      type: Boolean
+    },
+    userDefault: {
+      required: true,
+      type: String
+    },
+    originalScope: {
+      required: false,
+      type: String
+    },
+    initialScope: {
+      required: false,
+      type: String
+    },
+    onScopeChange: {
+      required: true,
+      type: Function
+    },
+    unstyled: {
+      required: false,
+      type: Boolean,
+      default: true
+    }
+  },
   data () {
     return {
       currentScope: this.initialScope
@@ -43,11 +63,12 @@ const ScopeSelector = {
       return this.shouldShow('direct')
     },
     css () {
+      const style = this.unstyled ? 'button-unstyled' : 'button-default'
       return {
-        public: { toggled: this.currentScope === 'public' },
-        unlisted: { toggled: this.currentScope === 'unlisted' },
-        private: { toggled: this.currentScope === 'private' },
-        direct: { toggled: this.currentScope === 'direct' }
+        public: [style, { toggled: this.currentScope === 'public' }],
+        unlisted: [style, { toggled: this.currentScope === 'unlisted' }],
+        private: [style, { toggled: this.currentScope === 'private' }],
+        direct: [style, { toggled: this.currentScope === 'direct' }]
       }
     }
   },
diff --git a/src/components/scope_selector/scope_selector.vue b/src/components/scope_selector/scope_selector.vue
index b90ae0205..cbe51a07f 100644
--- a/src/components/scope_selector/scope_selector.vue
+++ b/src/components/scope_selector/scope_selector.vue
@@ -1,11 +1,11 @@
 <template>
   <div
     v-if="!showNothing"
-    class="ScopeSelector"
+    class="ScopeSelector btn-group"
   >
     <button
       v-if="showDirect"
-      class="button-unstyled scope"
+      class="scope"
       :class="css.direct"
       :title="$t('post_status.scope.direct')"
       type="button"
@@ -19,7 +19,7 @@
     {{ ' ' }}
     <button
       v-if="showPrivate"
-      class="button-unstyled scope"
+      class="scope"
       :class="css.private"
       :title="$t('post_status.scope.private')"
       type="button"
@@ -33,7 +33,7 @@
     {{ ' ' }}
     <button
       v-if="showUnlisted"
-      class="button-unstyled scope"
+      class="scope"
       :class="css.unlisted"
       :title="$t('post_status.scope.unlisted')"
       type="button"
@@ -47,7 +47,7 @@
     {{ ' ' }}
     <button
       v-if="showPublic"
-      class="button-unstyled scope"
+      class="scope"
       :class="css.public"
       :title="$t('post_status.scope.public')"
       type="button"
@@ -65,12 +65,14 @@
 
 <style lang="scss">
 .ScopeSelector {
+  display: inline-block;
+
   .scope {
     display: inline-block;
-    cursor: pointer;
     min-width: 1.3em;
     min-height: 1.3em;
     text-align: center;
+    padding: 0.5em 0.25em
   }
 }
 </style>
diff --git a/src/components/scroll_top_button/scroll_top_button.js b/src/components/scroll_top_button/scroll_top_button.js
new file mode 100644
index 000000000..bdc45b9b4
--- /dev/null
+++ b/src/components/scroll_top_button/scroll_top_button.js
@@ -0,0 +1,18 @@
+const ScrollTopButton = {
+  props: {
+    fast: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  methods: {
+    scrollToTop() {
+      const speed = this.fast ? 'instant' : 'smooth';
+
+      window.scrollTo({ top: 0, behavior: speed })
+    }
+  }
+}
+
+export default ScrollTopButton
diff --git a/src/components/scroll_top_button/scroll_top_button.vue b/src/components/scroll_top_button/scroll_top_button.vue
new file mode 100644
index 000000000..ed73059c4
--- /dev/null
+++ b/src/components/scroll_top_button/scroll_top_button.vue
@@ -0,0 +1,29 @@
+<template>
+  <div class="rightside-button scroll-to-top">
+    <button
+      class="button-unstyled scroll-to-top-button"
+      type="button"
+      :title="$t('general.scroll_to_top')"
+      @click="scrollToTop"
+    >
+      <FALayers class="fa-scale-110 fa-old-padding-layer">
+        <FAIcon icon="arrow-up" />
+        <FAIcon
+          icon="minus"
+          transform="up-7"
+        />
+      </FALayers>
+    </button>
+  </div>
+</template>
+
+<script src="./scroll_top_button.js"></script>
+<style lang="scss">
+.scroll-to-top {
+  display: none;
+}
+
+.-scrolled .scroll-to-top {
+  display: inline-block;
+}
+</style>
diff --git a/src/components/scrollbar.style.js b/src/components/scrollbar.style.js
index 94e6135d7..1168f67d8 100644
--- a/src/components/scrollbar.style.js
+++ b/src/components/scrollbar.style.js
@@ -1,6 +1,7 @@
 export default {
   name: 'Scrollbar',
-  selector: '::-webkit-scrollbar',
+  selector: ['::-webkit-scrollbar-button', '::-webkit-scrollbar-thumb', '::-webkit-resizer'],
+  notEditable: true, // for now
   defaultRules: [
     {
       directives: {
diff --git a/src/components/scrollbar_element.style.js b/src/components/scrollbar_element.style.js
index da942ab21..ef1ea8136 100644
--- a/src/components/scrollbar_element.style.js
+++ b/src/components/scrollbar_element.style.js
@@ -31,9 +31,10 @@ const hoverGlow = {
 export default {
   name: 'ScrollbarElement',
   selector: '::-webkit-scrollbar-button',
+  notEditable: true, // for now
   states: {
     pressed: ':active',
-    hover: ':hover:not(:disabled)',
+    hover: ':is(:hover, :focus-visible, :has(:focus-visible)):not(:disabled)',
     disabled: ':disabled'
   },
   validInnerComponents: [
@@ -82,7 +83,7 @@ export default {
     {
       state: ['disabled'],
       directives: {
-        background: '$blend(--inheritedBackground, 0.25, --parent)',
+        background: '$blend(--inheritedBackground 0.25 --parent)',
         shadow: [...buttonInsetFakeBorders]
       }
     },
diff --git a/src/components/search/search.vue b/src/components/search/search.vue
index bd384ad3f..4302f93f9 100644
--- a/src/components/search/search.vue
+++ b/src/components/search/search.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="Search panel panel-default">
     <div class="panel-heading">
-      <div class="title">
+      <h1 class="title">
         {{ $t('nav.search') }}
-      </div>
+      </h1>
     </div>
     <div class="panel-body search-input-container">
       <input
@@ -119,10 +119,13 @@
           :key="hashtag.url"
           class="status trend search-result"
         >
-          <div class="hashtag">
-            <router-link :to="{ name: 'tag-timeline', params: { tag: hashtag.name } }">
+          <router-link
+            class="list-item hashtag"
+            :to="{ name: 'tag-timeline', params: { tag: hashtag.name } }"
+          >
+            <span class="name">
               #{{ hashtag.name }}
-            </router-link>
+            </span>
             <div v-if="lastHistoryRecord(hashtag)">
               <span v-if="lastHistoryRecord(hashtag).accounts == 1">
                 {{ $t('search.person_talking', { count: lastHistoryRecord(hashtag).accounts }) }}
@@ -131,7 +134,7 @@
                 {{ $t('search.people_talking', { count: lastHistoryRecord(hashtag).accounts }) }}
               </span>
             </div>
-          </div>
+          </router-link>
           <div
             v-if="lastHistoryRecord(hashtag)"
             class="count"
@@ -154,7 +157,7 @@
   text-align: center;
 }
 
-@media all and (max-width: 800px) {
+@media all and (width <= 800px) {
   .search-nav-heading {
     .tab-switcher .tabs .tab-wrapper {
       display: block;
@@ -199,10 +202,13 @@
 
   .hashtag {
     flex: 1 1 auto;
-    color: var(--text);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+
+    .name {
+      color: var(--link);
+    }
   }
 
   .count {
diff --git a/src/components/select/select.vue b/src/components/select/select.vue
index 0fb6fcc0e..78b3b348c 100644
--- a/src/components/select/select.vue
+++ b/src/components/select/select.vue
@@ -26,6 +26,7 @@
 /* TODO fix order of styles */
 label.Select {
   padding: 0;
+  display: flex;
 
   select {
     appearance: none;
@@ -33,13 +34,12 @@ label.Select {
     border: none;
     color: var(--text);
     margin: 0;
-    padding: 0 2em 0 0.2em;
+    padding: 0 2em 0 0.5em;
     font-family: var(--font);
     font-size: 1em;
     width: 100%;
     z-index: 1;
-    height: 2em;
-    line-height: 16px;
+    line-height: 2;
 
     &[multiple],
     &[size] {
@@ -49,6 +49,7 @@ label.Select {
       option {
         background-color: transparent;
 
+        &:checked,
         &.-active {
           color: var(--selectionText);
           background-color: var(--selectionBackground);
@@ -78,12 +79,12 @@ label.Select {
     position: absolute;
     top: 0;
     bottom: 0;
-    right: 5px;
+    right: 0.5em;
     height: 100%;
     width: 0.875em;
     font-family: var(--font);
     line-height: 2;
-    z-index: 0;
+    z-index: 1;
     pointer-events: none;
   }
 }
diff --git a/src/components/select/select_motion.vue b/src/components/select/select_motion.vue
new file mode 100644
index 000000000..45e278fc6
--- /dev/null
+++ b/src/components/select/select_motion.vue
@@ -0,0 +1,136 @@
+<template>
+  <div
+    class="SelectMotion btn-group"
+  >
+    <button
+      class="btn button-default"
+      :disabled="disabled"
+      @click="add"
+    >
+      <FAIcon
+        fixed-width
+        icon="plus"
+      />
+    </button>
+    <button
+      class="btn button-default"
+      :disabled="disabled || !moveUpValid"
+      :class="{ disabled: disabled || !moveUpValid }"
+      @click="moveUp"
+    >
+      <FAIcon
+        fixed-width
+        icon="chevron-up"
+      />
+    </button>
+    <button
+      class="btn button-default"
+      :disabled="disabled || !moveDnValid"
+      :class="{ disabled: disabled || !moveDnValid }"
+      @click="moveDn"
+    >
+      <FAIcon
+        fixed-width
+        icon="chevron-down"
+      />
+    </button>
+    <button
+      class="btn button-default"
+      :disabled="disabled || !present"
+      :class="{ disabled: disabled || !present }"
+      @click="del"
+    >
+      <FAIcon
+        fixed-width
+        icon="times"
+      />
+    </button>
+  </div>
+</template>
+
+<script setup>
+import { computed, defineEmits, defineProps, nextTick } from 'vue'
+
+const props = defineProps({
+  modelValue: {
+    type: Array,
+    required: true
+  },
+  selectedId: {
+    type: Number,
+    required: true
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  getAddValue: {
+    type: Function,
+    required: true
+  }
+})
+
+const emit = defineEmits(['update:modelValue', 'update:selectedId'])
+
+const moveUpValid = computed(() => {
+  return props.selectedId > 0
+})
+
+const present = computed(() => props.modelValue[props.selectedId] != null)
+
+const moveUp = async () => {
+  const newModel = [...props.modelValue]
+  const movable = newModel.splice(props.selectedId, 1)[0]
+  newModel.splice(props.selectedId - 1, 0, movable)
+
+  emit('update:modelValue', newModel)
+  await nextTick()
+  emit('update:selectedId', props.selectedId - 1)
+}
+
+const moveDnValid = computed(() => {
+  return props.selectedId < props.modelValue.length - 1
+})
+
+const moveDn = async () => {
+  const newModel = [...props.modelValue]
+  const movable = newModel.splice(props.selectedId.value, 1)[0]
+  newModel.splice(props.selectedId + 1, 0, movable)
+
+  emit('update:modelValue', newModel)
+  await nextTick()
+  emit('update:selectedId', props.selectedId + 1)
+}
+
+const add = async () => {
+  const newModel = [...props.modelValue, props.getAddValue()]
+
+  emit('update:modelValue', newModel)
+  await nextTick()
+  emit('update:selectedId', Math.max(newModel.length - 1, 0))
+}
+
+const del = async () => {
+  const newModel = [...props.modelValue]
+  newModel.splice(props.selectedId, 1)
+
+  emit('update:modelValue', newModel)
+  await nextTick()
+  emit('update:selectedId', newModel.length === 0 ? undefined : Math.max(props.selectedId - 1, 0))
+}
+</script>
+
+<style lang="scss">
+.SelectMotion {
+  flex: 0 0 auto;
+  display: grid;
+  grid-auto-columns: 1fr;
+  grid-auto-flow: column;
+  margin-top: 0.25em;
+
+  .button-default {
+    margin: 0;
+    padding: 0;
+  }
+}
+</style>
diff --git a/src/components/settings_modal/admin_tabs/auth_tab.js b/src/components/settings_modal/admin_tabs/auth_tab.js
new file mode 100644
index 000000000..a078291e6
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/auth_tab.js
@@ -0,0 +1,39 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import TupleSetting from '../helpers/tuple_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+import MapSetting from '../helpers/map_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const AuthTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    TupleSetting,
+    AttachmentSetting,
+    GroupSetting,
+    ListSetting,
+    MapSetting
+  },
+  computed: {
+    ...SharedComputedObject(),
+    LDAPEnabled () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':ldap'][':enabled']
+    },
+  }
+}
+
+export default AuthTab
diff --git a/src/components/settings_modal/admin_tabs/auth_tab.vue b/src/components/settings_modal/admin_tabs/auth_tab.vue
new file mode 100644
index 000000000..ef32aa4e0
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/auth_tab.vue
@@ -0,0 +1,105 @@
+<template>
+  <div :label="$t('admin_dash.tabs.job_queues')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.auth.MFA') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <h4>{{ $t('admin_dash.auth.TOTP') }}</h4>
+          <ul class="setting-list suboptions">
+            <li>
+              <IntegerSetting path=":pleroma.:instance.:multi_factor_authentication.:totp.:digits" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:instance.:multi_factor_authentication.:totp.:period" />
+            </li>
+          </ul>
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.auth.backup_codes') }}</h4>
+          <ul class="setting-list suboptions">
+            <li>
+              <IntegerSetting path=":pleroma.:instance.:multi_factor_authentication.:backup_codes.:number" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:instance.:multi_factor_authentication.:backup_codes.:length" />
+            </li>
+          </ul>
+        </li>
+        <GroupSetting path=":pleroma.:instance.:multi_factor_authentication" />
+      </ul>
+      <h3>{{ $t('admin_dash.auth.OAuth') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <StringSetting path=":pleroma.:auth.:auth_template" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:auth.:enforce_oauth_admin_scope_usage" />
+        </li>
+        <li>
+          <StringSetting path=":pleroma.:auth.:oauth_consumer_template" />
+        </li>
+        <li>
+          <ListSetting path=":pleroma.:auth.:oauth_consumer_strategies" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:oauth2.:token_expires_in" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:oauth2.:issue_new_refresh_token" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:oauth2.:clean_expired_tokens" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.auth.LDAP') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:ldap.:enabled" />
+        </li>
+        <template v-if="LDAPEnabled">
+          <li>
+            <StringSetting path=":pleroma.:ldap.:host" />
+          </li>
+          <li>
+            <IntegerSetting path=":pleroma.:ldap.:port" />
+          </li>
+          <li>
+            <BooleanSetting path=":pleroma.:ldap.:tls" />
+          </li>
+          <li>
+            <!-- CONFIRM old admin FE only supports ONE setting which is Verify, is that correct or should we allow more than one? -->
+            <MapSetting
+              :allow-new="false"
+              path=":pleroma.:ldap.:tlsopts"
+            />
+          </li>
+          <li>
+            <BooleanSetting path=":pleroma.:ldap.:ssl" />
+          </li>
+          <li>
+            <!-- CONFIRM old admin FE only supports ONE setting which is Verify, is that correct or should we allow more than one? -->
+            <MapSetting
+              :allow-new="false"
+              path=":pleroma.:ldap.:sslopts"
+            />
+          </li>
+          <li>
+            <StringSetting path=":pleroma.:ldap.:base" />
+          </li>
+          <li>
+            <StringSetting path=":pleroma.:ldap.:uid" />
+          </li>
+          <li>
+            <StringSetting path=":pleroma.:ldap.:cacertfile" />
+          </li>
+          <li>
+            <StringSetting path=":pleroma.:ldap.:mail" />
+          </li>
+        </template>
+      </ul>
+    </div>
+    <!-- CONFIRM admin token is present in AdminFE but missing in both data and descriptions?? -->
+  </div>
+</template>
+
+<script src="./auth_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/emoji_tab.js b/src/components/settings_modal/admin_tabs/emoji_tab.js
index 58e1468f8..7c137e35f 100644
--- a/src/components/settings_modal/admin_tabs/emoji_tab.js
+++ b/src/components/settings_modal/admin_tabs/emoji_tab.js
@@ -8,6 +8,23 @@ import Popover from 'components/popover/popover.vue'
 import ConfirmModal from 'components/confirm_modal/confirm_modal.vue'
 import ModifiedIndicator from '../helpers/modified_indicator.vue'
 import EmojiEditingPopover from '../helpers/emoji_editing_popover.vue'
+import { useInterfaceStore } from 'src/stores/interface'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faArrowsRotate,
+  faFolderOpen,
+  faServer,
+  faDownload
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faArrowsRotate,
+  faFolderOpen,
+  faDownload,
+  faServer
+)
 
 const EmojiTab = {
   components: {
@@ -31,7 +48,10 @@ const EmojiTab = {
       newPackName: '',
       deleteModalVisible: false,
       remotePackInstance: '',
-      remotePackDownloadAs: ''
+      remotePackDownloadAs: '',
+
+      remotePackURL: '',
+      remotePackFile: null
     }
   },
 
@@ -40,10 +60,12 @@ const EmojiTab = {
   },
 
   computed: {
+    ...SharedComputedObject(),
     pack () {
       return this.packName !== '' ? this.knownPacks[this.packName] : undefined
     },
     packMeta () {
+      if (this.packName === '') return {}
       if (this.editedMetadata[this.packName] === undefined) {
         this.editedMetadata[this.packName] = clone(this.pack.pack)
       }
@@ -93,9 +115,7 @@ const EmojiTab = {
           this.displayError(resp.error)
           return Promise.reject(resp)
         }
-      }).then(done => {
-        this.$refs.createPackPopover.hidePopover()
-
+      }).then(() => {
         this.packName = this.newPackName
         this.newPackName = ''
       })
@@ -110,7 +130,7 @@ const EmojiTab = {
           this.displayError(resp.error)
           return Promise.reject(resp)
         }
-      }).then(done => {
+      }).then(() => {
         delete this.editedMetadata[this.packName]
 
         this.deleteModalVisible = false
@@ -141,9 +161,9 @@ const EmojiTab = {
       })
     },
 
-    updatePackFiles (newFiles) {
-      this.pack.files = newFiles
-      this.sortPackFiles(this.packName)
+    updatePackFiles (newFiles, packName) {
+      this.knownPacks[packName].files = newFiles
+      this.sortPackFiles(packName)
     },
 
     loadPacksPaginated (listFunction) {
@@ -167,7 +187,7 @@ const EmojiTab = {
 
           return resultingPromise
         })
-        .then(finished => allPacks)
+        .then(() => allPacks)
         .catch(data => {
           this.displayError(data)
         })
@@ -201,8 +221,6 @@ const EmojiTab = {
           for (const pack in this.knownRemotePacks[inst]) {
             this.sortPackFiles(`${pack}@${inst}`)
           }
-
-          this.$refs.remotePackPopover.hidePopover()
         })
         .catch(data => {
           this.displayError(data)
@@ -219,20 +237,55 @@ const EmojiTab = {
         .then(data => data.json())
         .then(resp => {
           if (resp === 'ok') {
-            this.$refs.dlPackPopover.hidePopover()
-
             return this.refreshPackList()
           } else {
             this.displayError(resp.error)
             return Promise.reject(resp)
           }
-        }).then(done => {
+        }).then(() => {
           this.packName = this.remotePackDownloadAs
           this.remotePackDownloadAs = ''
         })
     },
+    downloadRemoteURLPack () {
+      this.$store.state.api.backendInteractor.downloadRemoteEmojiPackZIP({
+        url: this.remotePackURL, packName: this.newPackName
+      })
+        .then(data => data.json())
+        .then(resp => {
+          if (resp === 'ok') {
+            return this.refreshPackList()
+          } else {
+            this.displayError(resp.error)
+            return Promise.reject(resp)
+          }
+        }).then(() => {
+          this.packName = this.newPackName
+          this.newPackName = ''
+          this.remotePackURL = ''
+        })
+    },
+    downloadRemoteFilePack () {
+      this.$store.state.api.backendInteractor.downloadRemoteEmojiPackZIP({
+        file: this.remotePackFile[0], packName: this.newPackName
+      })
+        .then(data => data.json())
+        .then(resp => {
+          if (resp === 'ok') {
+            return this.refreshPackList()
+          } else {
+            this.displayError(resp.error)
+            return Promise.reject(resp)
+          }
+        }).then(() => {
+          this.packName = this.newPackName
+          this.newPackName = ''
+          this.remotePackURL = ''
+        })
+    },
+
     displayError (msg) {
-      this.$store.dispatch('pushGlobalNotice', {
+      useInterfaceStore().pushGlobalNotice({
         messageKey: 'admin_dash.emoji.error',
         messageArgs: [msg],
         level: 'error'
diff --git a/src/components/settings_modal/admin_tabs/emoji_tab.scss b/src/components/settings_modal/admin_tabs/emoji_tab.scss
index 3e77e0195..2f3b5aa40 100644
--- a/src/components/settings_modal/admin_tabs/emoji_tab.scss
+++ b/src/components/settings_modal/admin_tabs/emoji_tab.scss
@@ -1,10 +1,54 @@
-.emoji-tab {
-  .btn-group .btn:not(:first-child) {
-    margin-left: 0.5em;
+.EmojiTab {
+  .setting-list {
+    margin: 0.5em 2em;
   }
 
-  .pack-info-wrapper {
+  .toolbar {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5em;
+
+    .header-buttons {
+      display: flex;
+      flex: 1 0 auto;
+      justify-content: end;
+      align-items: end;
+
+      &:not(.btn-group) {
+        gap: 0.5em;
+      }
+
+      .header-text {
+        flex: 1 0 auto;
+      }
+    }
+
+    .button-default {
+      flex: 0 0 auto;
+      padding: 0.5em;
+      font-size: 1rem;
+    }
+
+    .popover-wrapper {
+      display: flex;
+    }
+  }
+
+  .selector-buttons,
+  .meta-buttons {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5em;
+    margin-left: 1em;
+  }
+
+  h5 {
     margin-top: 1em;
+    margin-bottom: 0.25em;
+  }
+
+  h3.toolbar {
+    align-items: end;
   }
 
   .emoji-info-input {
@@ -18,8 +62,8 @@
   }
 
   .emoji {
-    width: 32px;
-    height: 32px;
+    width: 2em;
+    height: 2em;
   }
 
   .emoji-unsaved {
@@ -29,7 +73,23 @@
   .emoji-list {
     display: flex;
     flex-wrap: wrap;
-    gap: 1em 1em;
+    gap: 1em;
+
+    .button-unstyled {
+      display: flex;
+    }
+
+    .emoji-item,
+    .placeholder {
+      width: 2em;
+      height: 2em;
+      opacity: 0.5;
+    }
+
+    .placeholder {
+      background: var(--textFaint);
+      border-radius: 0.5em;
+    }
   }
 }
 
diff --git a/src/components/settings_modal/admin_tabs/emoji_tab.vue b/src/components/settings_modal/admin_tabs/emoji_tab.vue
index 5742d2ce9..038f522b1 100644
--- a/src/components/settings_modal/admin_tabs/emoji_tab.vue
+++ b/src/components/settings_modal/admin_tabs/emoji_tab.vue
@@ -1,110 +1,75 @@
 <template>
   <div
-    class="emoji-tab"
+    class="EmojiTab"
     :label="$t('admin_dash.tabs.emoji')"
   >
-    <div class="setting-item">
-      <h2>{{ $t('admin_dash.tabs.emoji') }}</h2>
+    <div class="setting-section">
+      <h3 class="toolbar">
+        <span class="header-text">
+          {{ $t('admin_dash.emoji.emoji_packs') }}
+        </span>
 
-      <ul class="setting-list">
-        <h3>{{ $t('admin_dash.emoji.global_actions') }}</h3>
-
-        <li class="btn-group setting-item">
+        <span class="header-buttons btn-group">
           <button
-            class="button button-default btn"
+            class="button button-default"
             type="button"
+            :title="$t('admin_dash.emoji.reload')"
             @click="reloadEmoji"
           >
-            {{ $t('admin_dash.emoji.reload') }}
-          </button>
-          <button
-            class="button button-default btn"
-            type="button"
-            @click="importFromFS"
-          >
-            {{ $t('admin_dash.emoji.importFS') }}
-          </button>
-        </li>
-
-        <li class="btn-group setting-item">
-          <button
-            class="button button-default btn"
-            type="button"
-            @click="$refs.remotePackPopover.showPopover"
-          >
-            {{ $t('admin_dash.emoji.remote_packs') }}
-
-            <Popover
-              ref="remotePackPopover"
-              popover-class="emoji-tab-edit-popover popover-default"
-              trigger="click"
-              placement="bottom"
-              bound-to-selector=".emoji-tab"
-              :bound-to="{ x: 'container' }"
-              :offset="{ y: 5 }"
-            >
-              <template #content>
-                <div class="emoji-tab-popover-input">
-                  <h3>{{ $t('admin_dash.emoji.remote_pack_instance') }}</h3>
-                  <input
-                    v-model="remotePackInstance"
-                    class="input"
-                    :placeholder="$t('admin_dash.emoji.remote_pack_instance')"
-                  >
-                  <button
-                    class="button button-default btn emoji-tab-popover-button"
-                    type="button"
-                    @click="listRemotePacks"
-                  >
-                    {{ $t('admin_dash.emoji.do_list') }}
-                  </button>
-                </div>
-              </template>
-            </Popover>
-          </button>
-        </li>
-
-        <h3>{{ $t('admin_dash.emoji.emoji_packs') }}</h3>
-
-        <li>
-          <h4>{{ $t('admin_dash.emoji.edit_pack') }}</h4>
-
-          <Select
-            v-model="packName"
-            class="form-control"
-          >
-            <option
-              value=""
-              disabled
-              hidden
-            >
-              {{ $t('admin_dash.emoji.emoji_pack') }}
-            </option>
-            <option
-              v-for="(pack, listPackName) in knownPacks"
-              :key="listPackName"
-              :label="listPackName"
-            >
-              {{ listPackName }}
-            </option>
-          </Select>
-
-          <button
-            class="button button-default btn emoji-tab-popover-button"
-            type="button"
-            @click="$refs.createPackPopover.showPopover"
-          >
-            {{ $t('admin_dash.emoji.create_pack') }}
+            <FAIcon icon="arrows-rotate" />
+            {{ $t('admin_dash.emoji.reload_short') }}
           </button>
           <Popover
-            ref="createPackPopover"
             popover-class="emoji-tab-edit-popover popover-default"
             trigger="click"
             placement="bottom"
-            bound-to-selector=".emoji-tab"
-            :bound-to="{ x: 'container' }"
-            :offset="{ y: 5 }"
           >
+            <template #trigger>
+              <button
+                class="button button-default"
+                type="button"
+                :title="$t('admin_dash.emoji.remote_packs')"
+              >
+                <FAIcon icon="download" />
+                {{ $t('admin_dash.emoji.remote_packs_short') }}
+              </button>
+            </template>
+            <template #content>
+              <div class="emoji-tab-popover-input">
+                <h3>{{ $t('admin_dash.emoji.remote_pack_instance') }}</h3>
+                <input
+                  v-model="remotePackInstance"
+                  class="input"
+                  :placeholder="$t('admin_dash.emoji.remote_pack_instance')"
+                >
+                <button
+                  class="button button-default emoji-tab-popover-button"
+                  type="button"
+                  @click="listRemotePacks"
+                >
+                  {{ $t('admin_dash.emoji.do_list') }}
+                </button>
+              </div>
+            </template>
+          </Popover>
+
+          <Popover
+            ref="additionalRemotePopover"
+            popover-class="emoji-tab-edit-popover popover-default"
+            trigger="click"
+            placement="bottom"
+          >
+            <template #trigger>
+              <button
+                class="button button-default emoji-panel-additional-actions"
+                :title="$t('admin_dash.emoji.import_pack')"
+                @click="$refs.additionalRemotePopover.showPopover"
+              >
+                <FAIcon icon="folder-open" />
+                {{ $t('admin_dash.emoji.import_pack_short') }}
+              </button>
+            </template>
+
             <template #content>
               <div class="emoji-tab-popover-input">
                 <h3>{{ $t('admin_dash.emoji.new_pack_name') }}</h3>
@@ -113,94 +78,276 @@
                   :placeholder="$t('admin_dash.emoji.new_pack_name')"
                   class="input"
                 >
+                <h3>Import pack from URL</h3>
+                <input
+                  v-model="remotePackURL"
+                  class="input"
+                  placeholder="Pack .zip URL"
+                >
                 <button
                   class="button button-default btn emoji-tab-popover-button"
                   type="button"
-                  @click="createEmojiPack"
+                  :disabled="newPackName.trim() === '' || remotePackURL.trim() === ''"
+                  @click="downloadRemoteURLPack"
                 >
-                  {{ $t('admin_dash.emoji.create') }}
+                  Import
+                </button>
+                <h3>Import pack from a file</h3>
+                <input
+                  type="file"
+                  accept="application/zip"
+                  class="emoji-tab-popover-file input"
+                  @change="remotePackFile = $event.target.files"
+                >
+                <button
+                  class="button button-default btn emoji-tab-popover-button"
+                  type="button"
+                  :disabled="newPackName.trim() === '' || remotePackFile === null || remotePackFile.length === 0"
+                  @click="downloadRemoteFilePack"
+                >
+                  Import
                 </button>
               </div>
             </template>
           </Popover>
-        </li>
-      </ul>
+        </span>
+      </h3>
+      <div class="setting-section">
+        <h4 class="toolbar">
+          {{ $t('admin_dash.emoji.edit_pack') }}
+        </h4>
+        <div class="setting-item selector-buttons">
+          <button
+            :disabled="!pack || pack.remote !== undefined"
+            class="button button-default btn"
+            type="button"
+            @click="deleteModalVisible = true"
+          >
+            {{ $t('admin_dash.emoji.delete_pack') }}
 
-      <div v-if="pack">
-        <div class="pack-info-wrapper">
-          <ul class="setting-list">
-            <li>
-              <label>
-                {{ $t('admin_dash.emoji.description') }}
+            <ConfirmModal
+              v-if="deleteModalVisible"
+              :title="$t('admin_dash.emoji.delete_title')"
+              :cancel-text="$t('status.delete_confirm_cancel_button')"
+              :confirm-text="$t('status.delete_confirm_accept_button')"
+              @cancelled="deleteModalVisible = false"
+              @accepted="deleteEmojiPack"
+            >
+              {{ $t('admin_dash.emoji.delete_confirm', [packName]) }}
+            </ConfirmModal>
+          </button>
+
+          <button
+            :disabled="!pack || pack.remote === undefined"
+            class="button button-default btn"
+            type="button"
+            @click="$refs.downloadPackPopover.showPopover"
+          >
+            {{ $t('admin_dash.emoji.download_pack') }}
+
+            <Popover
+              ref="downloadPackPopover"
+              trigger="click"
+              placement="bottom"
+              bound-to-selector=".emoji-tab"
+              popover-class="emoji-tab-edit-popover popover-default"
+              :bound-to="{ x: 'container' }"
+              :offset="{ y: 5 }"
+            >
+              <template #content>
+                <h3>{{ $t('admin_dash.emoji.downloading_pack', [packName]) }}</h3>
+                <div>
+                  <div>
+                    <div class="emoji-tab-popover-input">
+                      <label>
+                        {{ $t('admin_dash.emoji.download_as_name') }}
+                        <input
+                          v-model="remotePackDownloadAs"
+                          class="emoji-data-input input"
+                          :placeholder="$t('admin_dash.emoji.download_as_name_full')"
+                        >
+                      </label>
+
+                      <div
+                        v-if="downloadWillReplaceLocal"
+                        class="warning"
+                      >
+                        <em>{{ $t('admin_dash.emoji.replace_warning') }}</em>
+                      </div>
+                    </div>
+
+                    <button
+                      class="button button-default btn"
+                      type="button"
+                      @click="downloadRemotePack"
+                    >
+                      {{ $t('admin_dash.emoji.download') }}
+                    </button>
+                  </div>
+                </div>
+              </template>
+            </Popover>
+          </button>
+
+          <span class="btn-group">
+            <Select
+              v-model="packName"
+              class="form-control"
+            >
+              <option
+                value=""
+                disabled
+                hidden
+              >
+                {{ $t('admin_dash.emoji.emoji_pack') }}
+              </option>
+              <option
+                v-for="(pack, listPackName) in knownPacks"
+                :key="listPackName"
+                :label="listPackName"
+              >
+                {{ listPackName }}
+              </option>
+            </Select>
+
+            <Popover
+              ref="createPackPopover"
+              popover-class="emoji-tab-edit-popover popover-default"
+              trigger="click"
+              placement="bottom"
+            >
+              <template #trigger>
+                <button
+                  class="button button-default btn emoji-tab-popover-button"
+                  type="button"
+                >
+                  {{ $t('admin_dash.emoji.create_pack') }}
+                </button>
+              </template>
+              <template #content>
+                <div class="emoji-tab-popover-input">
+                  <h3>{{ $t('admin_dash.emoji.new_pack_name') }}</h3>
+                  <input
+                    v-model="newPackName"
+                    :placeholder="$t('admin_dash.emoji.new_pack_name')"
+                    class="input"
+                  >
+                  <button
+                    class="button button-default btn emoji-tab-popover-button"
+                    type="button"
+                    @click="createEmojiPack"
+                  >
+                    {{ $t('admin_dash.emoji.create') }}
+                  </button>
+                </div>
+              </template>
+            </Popover>
+          </span>
+        </div>
+        <h5>
+          {{ $t('admin_dash.emoji.metadata') }}
+
+          <ModifiedIndicator
+            :changed="$refs.emojiPopovers && $refs.emojiPopovers.some(p => p.isEdited)"
+            message-key="admin_dash.emoji.emoji_changed"
+          />
+        </h5>
+        <ul class="setting-list">
+          <li>
+            <label
+              class="setting-item"
+              :class="{ ['-disabled']: !pack || pack.remote !== undefined }"
+            >
+              <span class="setting-label">
                 <ModifiedIndicator
                   :changed="metaEdited('description')"
                   message-key="admin_dash.emoji.metadata_changed"
                 />
-
-                <textarea
-                  v-model="packMeta.description"
-                  :disabled="pack.remote !== undefined"
-                  class="bio resize-height input"
-                />
-              </label>
-            </li>
-            <li>
-              <label>
-                {{ $t('admin_dash.emoji.homepage') }}
+                {{ $t('admin_dash.emoji.description') }}
+              </span>
+              <textarea
+                v-model="packMeta.description"
+                :disabled="!pack || pack.remote !== undefined"
+                height="4"
+                class="bio resize-height input textarea setting-control"
+              />
+            </label>
+          </li>
+          <li>
+            <label
+              class="setting-item"
+              :class="{ ['-disabled']: !pack || pack.remote !== undefined }"
+            >
+              <span class="setting-label">
                 <ModifiedIndicator
                   :changed="metaEdited('homepage')"
                   message-key="admin_dash.emoji.metadata_changed"
                 />
+                {{ $t('admin_dash.emoji.homepage') }}
+              </span>
 
-                <input
-                  v-model="packMeta.homepage"
-                  class="emoji-info-input input"
-                  :disabled="pack.remote !== undefined"
-                >
-              </label>
-            </li>
-            <li>
-              <label>
-                {{ $t('admin_dash.emoji.fallback_src') }}
+              <input
+                v-model="packMeta.homepage"
+                class="emoji-info-input input setting-control"
+                :disabled="!pack || pack.remote !== undefined"
+              >
+            </label>
+          </li>
+          <li>
+            <label
+              class="setting-item"
+              :class="{ ['-disabled']: !pack || pack.remote !== undefined }"
+            >
+              <span class="setting-label">
                 <ModifiedIndicator
                   :changed="metaEdited('fallback-src')"
                   message-key="admin_dash.emoji.metadata_changed"
                 />
+                {{ $t('admin_dash.emoji.fallback_src') }}
+              </span>
 
-                <input
-                  v-model="packMeta['fallback-src']"
-                  class="emoji-info-input input"
-                  :disabled="pack.remote !== undefined"
-                >
-              </label>
-            </li>
-            <li>
-              <label>
+              <input
+                v-model="packMeta['fallback-src']"
+                class="emoji-info-input input setting-control"
+                :disabled="!pack || pack.remote !== undefined"
+              >
+            </label>
+          </li>
+          <li>
+            <label
+              class="setting-item"
+              :class="{ ['-disabled']: !pack || pack.remote !== undefined }"
+            >
+              <span class="setting-label">
                 {{ $t('admin_dash.emoji.fallback_sha256') }}
+              </span>
 
-                <input
-                  v-model="packMeta['fallback-src-sha256']"
-                  :disabled="true"
-                  class="emoji-info-input input"
-                >
-              </label>
-            </li>
-            <li>
+              <input
+                v-model="packMeta['fallback-src-sha256']"
+                :disabled="!pack || pack.remote !== undefined"
+                class="emoji-info-input input setting-control"
+              >
+            </label>
+          </li>
+          <li>
+            <div class="setting-item">
               <Checkbox
                 v-model="packMeta['share-files']"
-                :disabled="pack.remote !== undefined"
+                :disabled="!pack || pack.remote !== undefined"
+                class="setting-label setting-control"
               >
+                <ModifiedIndicator
+                  :changed="metaEdited('share-files')"
+                  message-key="admin_dash.emoji.metadata_changed"
+                />
                 {{ $t('admin_dash.emoji.share') }}
               </Checkbox>
-
-              <ModifiedIndicator
-                :changed="metaEdited('share-files')"
-                message-key="admin_dash.emoji.metadata_changed"
-              />
-            </li>
-            <li class="btn-group">
+            </div>
+          </li>
+          <li>
+            <div class="meta-buttons">
               <button
-                v-if="pack.remote === undefined"
+                v-if="pack && pack.remote === undefined"
                 class="button button-default btn"
                 type="button"
                 @click="savePackMetadata"
@@ -208,147 +355,89 @@
                 {{ $t('admin_dash.emoji.save_meta') }}
               </button>
               <button
-                v-if="pack.remote === undefined"
+                v-if="pack && pack.remote === undefined"
                 class="button button-default btn"
                 type="button"
                 @click="savePackMetadata"
               >
                 {{ $t('admin_dash.emoji.revert_meta') }}
               </button>
-
-              <button
-                v-if="pack.remote === undefined"
-                class="button button-default btn"
-                type="button"
-                @click="deleteModalVisible = true"
-              >
-                {{ $t('admin_dash.emoji.delete_pack') }}
-
-                <ConfirmModal
-                  v-if="deleteModalVisible"
-                  :title="$t('admin_dash.emoji.delete_title')"
-                  :cancel-text="$t('status.delete_confirm_cancel_button')"
-                  :confirm-text="$t('status.delete_confirm_accept_button')"
-                  @cancelled="deleteModalVisible = false"
-                  @accepted="deleteEmojiPack"
-                >
-                  {{ $t('admin_dash.emoji.delete_confirm', [packName]) }}
-                </ConfirmModal>
-              </button>
-
-              <button
-                v-if="pack.remote !== undefined"
-                class="button button-default btn"
-                type="button"
-                @click="$refs.dlPackPopover.showPopover"
-              >
-                {{ $t('admin_dash.emoji.download_pack') }}
-
-                <Popover
-                  ref="dlPackPopover"
-                  trigger="click"
-                  placement="bottom"
-                  bound-to-selector=".emoji-tab"
-                  popover-class="emoji-tab-edit-popover popover-default"
-                  :bound-to="{ x: 'container' }"
-                  :offset="{ y: 5 }"
-                >
-                  <template #content>
-                    <h3>{{ $t('admin_dash.emoji.downloading_pack', [packName]) }}</h3>
-                    <div>
-                      <div>
-                        <div class="emoji-tab-popover-input">
-                          <label>
-                            {{ $t('admin_dash.emoji.download_as_name') }}
-                            <input
-                              v-model="remotePackDownloadAs"
-                              class="emoji-data-input input"
-                              :placeholder="$t('admin_dash.emoji.download_as_name_full')"
-                            >
-                          </label>
-
-                          <div
-                            v-if="downloadWillReplaceLocal"
-                            class="warning"
-                          >
-                            <em>{{ $t('admin_dash.emoji.replace_warning') }}</em>
-                          </div>
-                        </div>
-
-                        <button
-                          class="button button-default btn"
-                          type="button"
-                          @click="downloadRemotePack"
-                        >
-                          {{ $t('admin_dash.emoji.download') }}
-                        </button>
-                      </div>
-                    </div>
-                  </template>
-                </Popover>
-              </button>
-            </li>
-          </ul>
-        </div>
-
-        <ul class="setting-list">
-          <h4>
-            {{ $t('admin_dash.emoji.files') }}
-
-            <ModifiedIndicator
-              v-if="pack"
-              :changed="$refs.emojiPopovers && $refs.emojiPopovers.some(p => p.isEdited)"
-              message-key="admin_dash.emoji.emoji_changed"
-            />
-          </h4>
-
-          <div
-            v-if="pack"
-            class="emoji-list"
-          >
-            <EmojiEditingPopover
-              v-if="pack.remote === undefined"
-              placement="bottom"
-              new-upload
-              :title="$t('admin_dash.emoji.adding_new')"
-              :pack-name="packName"
-              @updatePackFiles="updatePackFiles"
-              @displayError="displayError"
-            >
-              <template #trigger>
-                <FAIcon
-                  icon="plus"
-                  size="2x"
-                  :title="$t('admin_dash.emoji.add_file')"
-                />
-              </template>
-            </EmojiEditingPopover>
-
-            <EmojiEditingPopover
-              v-for="(file, shortcode) in pack.files"
-              ref="emojiPopovers"
-              :key="shortcode"
-              placement="top"
-              :title="$t('admin_dash.emoji.editing', [shortcode])"
-              :disabled="pack.remote !== undefined"
-              :shortcode="shortcode"
-              :file="file"
-              :pack-name="packName"
-              @updatePackFiles="updatePackFiles"
-              @displayError="displayError"
-            >
-              <template #trigger>
-                <StillImage
-                  class="emoji"
-                  :src="emojiAddr(file)"
-                  :title="`:${shortcode}:`"
-                  :alt="`:${shortcode}:`"
-                />
-              </template>
-            </EmojiEditingPopover>
-          </div>
+            </div>
+          </li>
         </ul>
+        <h5>
+          {{ $t('admin_dash.emoji.files') }}
+
+          <ModifiedIndicator
+            :changed="$refs.emojiPopovers && $refs.emojiPopovers.some(p => p.isEdited)"
+            message-key="admin_dash.emoji.emoji_changed"
+          />
+        </h5>
+
+        <div
+          class="emoji-list setting-list"
+        >
+          <EmojiEditingPopover
+            v-if="pack && pack.remote === undefined"
+            class="emoji-item"
+            placement="bottom"
+            new-upload
+            :title="$t('admin_dash.emoji.adding_new')"
+            :pack-name="packName"
+            @update-pack-files="updatePackFiles"
+            @display-error="displayError"
+          >
+            <template #trigger>
+              <FAIcon
+                icon="plus"
+                size="2x"
+                :title="$t('admin_dash.emoji.add_file')"
+              />
+            </template>
+          </EmojiEditingPopover>
+          <template v-if="!pack">
+            <div
+              v-for="(_, i) in new Array(20)"
+              :key="i"
+              class="placeholder"
+            />
+          </template>
+
+
+          <EmojiEditingPopover
+            v-for="(file, shortcode) in (pack?.files || [])"
+            ref="emojiPopovers"
+            :key="shortcode"
+            placement="top"
+            :title="$t(`admin_dash.emoji.${pack?.remote === undefined ? 'editing' : 'copying'}`, [shortcode])"
+            :shortcode="shortcode"
+            :file="file"
+            :pack-name="packName"
+            :remote="pack?.remote"
+            :known-local-packs="knownLocalPacks"
+            @update-pack-files="updatePackFiles"
+            @display-error="displayError"
+          >
+            <template #trigger>
+              <StillImage
+                class="emoji"
+                :src="emojiAddr(file)"
+                :title="`:${shortcode}:`"
+                :alt="`:${shortcode}:`"
+              />
+            </template>
+          </EmojiEditingPopover>
+        </div>
       </div>
+      <h3>{{ $t('admin_dash.emoji.advanced') }}</h3>
+      <button
+        class="button button-default btn"
+        type="button"
+        @click="importFromFS"
+      >
+        <FAIcon icon="server" />
+        {{ $t('admin_dash.emoji.importFS') }}
+      </button>
     </div>
   </div>
 </template>
diff --git a/src/components/settings_modal/admin_tabs/federation_tab.js b/src/components/settings_modal/admin_tabs/federation_tab.js
new file mode 100644
index 000000000..97b4e0040
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/federation_tab.js
@@ -0,0 +1,34 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+import ListTupleSetting from '../helpers/list_tuple_setting.vue'
+import MapSetting from '../helpers/map_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const FederationTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    ListSetting,
+    ListTupleSetting,
+    GroupSetting,
+    MapSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default FederationTab
diff --git a/src/components/settings_modal/admin_tabs/federation_tab.vue b/src/components/settings_modal/admin_tabs/federation_tab.vue
new file mode 100644
index 000000000..29a19e0b7
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/federation_tab.vue
@@ -0,0 +1,68 @@
+<template>
+  <div :label="$t('admin_dash.tabs.federation')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.federation.global') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:federating" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:skip_thread_containment" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:external_user_synchronization" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.federation.restrictions') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <MapSetting path=":pleroma.:instance.:quarantined_instances" />
+        </li>
+        <li>
+          <MapSetting path=":pleroma.:instance.:rejected_instances" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.federation.activitypub') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:allow_relay" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:activitypub.:unfollow_blocked" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:activitypub.:outgoing_blocks" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:activitypub.:blockers_visible" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:activitypub.:follow_handshake_timeout" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:activitypub.:note_replies_output_limit" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:instance.:federation_incoming_replies_max_depth" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:instance.:federation_reachability_timeout_days" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:allow_relay" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:activitypub.:sign_object_fetches" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:activitypub.:authorized_fetch_mode" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:activitypub.:client_api_enabled" />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./federation_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.js b/src/components/settings_modal/admin_tabs/frontends_tab.js
index f57310eec..c63e76214 100644
--- a/src/components/settings_modal/admin_tabs/frontends_tab.js
+++ b/src/components/settings_modal/admin_tabs/frontends_tab.js
@@ -5,6 +5,7 @@ import StringSetting from '../helpers/string_setting.vue'
 import GroupSetting from '../helpers/group_setting.vue'
 import Popover from 'src/components/popover/popover.vue'
 import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
+import { useInterfaceStore } from 'src/stores/interface'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
@@ -43,10 +44,10 @@ const FrontendsTab = {
     }
   },
   computed: {
+    ...SharedComputedObject(),
     frontends () {
       return this.$store.state.adminSettings.frontends
-    },
-    ...SharedComputedObject()
+    }
   },
   methods: {
     canInstall (frontend) {
@@ -80,7 +81,7 @@ const FrontendsTab = {
           this.$store.dispatch('loadFrontendsStuff')
           if (response.error) {
             const reason = await response.error.json()
-            this.$store.dispatch('pushGlobalNotice', {
+            useInterfaceStore().pushGlobalNotice({
               level: 'error',
               messageKey: 'admin_dash.frontend.failure_installing_frontend',
               messageArgs: {
@@ -90,7 +91,7 @@ const FrontendsTab = {
               timeout: 5000
             })
           } else {
-            this.$store.dispatch('pushGlobalNotice', {
+            useInterfaceStore().pushGlobalNotice({
               level: 'success',
               messageKey: 'admin_dash.frontend.success_installing_frontend',
               messageArgs: {
diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.scss b/src/components/settings_modal/admin_tabs/frontends_tab.scss
index 420d20b35..27c1fdc55 100644
--- a/src/components/settings_modal/admin_tabs/frontends_tab.scss
+++ b/src/components/settings_modal/admin_tabs/frontends_tab.scss
@@ -1,8 +1,24 @@
-.frontends-tab {
+.FrontendsTab {
   .cards-list {
     padding: 0;
   }
 
+  li.frontend-card {
+    display: flex;
+    margin: 0;
+    flex-direction: column;
+  }
+
+  .frontend-buttons {
+    margin-top: 0.5em;
+    display: flex;
+    justify-content: end;
+    gap: 0.5em;
+    flex-wrap: wrap;
+    flex: 1 0 auto;
+    align-items: end;
+  }
+
   .relative {
     position: relative;
   }
@@ -13,17 +29,29 @@
     // fix buttons showing through
     z-index: 2;
     opacity: 0.9;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
+    inset: 0;
+  }
+
+  h5 {
+    margin: 0;
+    font-size: 1.15em
+  }
+
+  dl {
+    margin-left: 1em;
+  }
+
+  dt {
+    margin-top: 0.5em;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow-x: hidden;
   }
 
   dd {
     text-overflow: ellipsis;
-    word-wrap: nowrap;
     white-space: nowrap;
     overflow-x: hidden;
-    max-width: 10em;
   }
+
 }
diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.vue b/src/components/settings_modal/admin_tabs/frontends_tab.vue
index 8fb3d3993..d0d764395 100644
--- a/src/components/settings_modal/admin_tabs/frontends_tab.vue
+++ b/src/components/settings_modal/admin_tabs/frontends_tab.vue
@@ -1,17 +1,17 @@
 <template>
   <div
-    class="frontends-tab"
+    class="FrontendsTab"
     :label="$t('admin_dash.tabs.frontends')"
   >
-    <div class="setting-item">
-      <h2>{{ $t('admin_dash.tabs.frontends') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.frontend.title') }}</h3>
       <p>{{ $t('admin_dash.frontend.wip_notice') }}</p>
       <ul
         v-if="adminDraft"
         class="setting-list"
       >
         <li>
-          <h3>{{ $t('admin_dash.frontend.default_frontend') }}</h3>
+          <h4>{{ $t('admin_dash.frontend.default_frontend') }}</h4>
           <p>{{ $t('admin_dash.frontend.default_frontend_tip') }}</p>
           <ul class="setting-list">
             <li>
@@ -38,22 +38,25 @@
           v-if="working"
           class="overlay"
         />
-        <h3>{{ $t('admin_dash.frontend.available_frontends') }}</h3>
+        <h4>{{ $t('admin_dash.frontend.available_frontends') }}</h4>
         <ul class="cards-list">
           <li
             v-for="frontend in frontends"
             :key="frontend.name"
+            class="frontend-card"
           >
-            <strong>{{ frontend.name }}</strong>
+            <h5>{{ frontend.name }}</h5>
             {{ ' ' }}
             <span v-if="adminDraft && adminDraft[':pleroma'][':frontends'][':primary']?.name === frontend.name">
               <i18n-t
                 v-if="adminDraft && adminDraft[':pleroma'][':frontends'][':primary']?.ref === frontend.refs[0]"
+                scope="global"
                 keypath="admin_dash.frontend.is_default"
               />
               <i18n-t
                 v-else
                 keypath="admin_dash.frontend.is_default_custom"
+                scope="global"
               >
                 <template #version>
                   <code>{{ adminDraft && adminDraft[':pleroma'][':frontends'][':primary'].ref }}</code>
@@ -87,7 +90,7 @@
                 >{{ frontend.build_url }}</a>
               </dd>
             </dl>
-            <div>
+            <div class="frontend-buttons">
               <span class="btn-group">
                 <button
                   class="button button-default btn"
@@ -113,19 +116,28 @@
                 >
                   <template #content="{close}">
                     <div class="dropdown-menu">
-                      <button
+                      <div
                         v-for="ref in frontend.refs"
                         :key="ref"
                         class="menu-item dropdown-item"
-                        @click.prevent="update(frontend, ref)"
-                        @click="close"
                       >
-                        <i18n-t keypath="admin_dash.frontend.install_version">
-                          <template #version>
-                            <code>{{ ref }}</code>
-                          </template>
-                        </i18n-t>
-                      </button>
+                        <button
+                          class="main-button"
+                          @click.prevent="update(frontend, ref)"
+                          @click="close"
+                        >
+                          <span>
+                            <i18n-t
+                              keypath="admin_dash.frontend.install_version"
+                              scope="global"
+                            >
+                              <template #version>
+                                <code>{{ ref }}</code>
+                              </template>
+                            </i18n-t>
+                          </span>
+                        </button>
+                      </div>
                     </div>
                   </template>
                   <template #trigger>
@@ -170,19 +182,28 @@
                 >
                   <template #content="{close}">
                     <div class="dropdown-menu">
-                      <button
+                      <div
                         v-for="ref in frontend.installedRefs || frontend.refs"
                         :key="ref"
                         class="menu-item dropdown-item"
-                        @click.prevent="setDefault(frontend, ref)"
-                        @click="close"
                       >
-                        <i18n-t keypath="admin_dash.frontend.set_default_version">
-                          <template #version>
-                            <code>{{ ref }}</code>
-                          </template>
-                        </i18n-t>
-                      </button>
+                        <button
+                          class="main-button"
+                          @click.prevent="setDefault(frontend, ref)"
+                          @click="close"
+                        >
+                          <span>
+                            <i18n-t
+                              keypath="admin_dash.frontend.set_default_version"
+                              scope="global"
+                            >
+                              <template #version>
+                                <code>{{ ref }}</code>
+                              </template>
+                            </i18n-t>
+                          </span>
+                        </button>
+                      </div>
                     </div>
                   </template>
                   <template #trigger>
diff --git a/src/components/settings_modal/admin_tabs/http_tab.js b/src/components/settings_modal/admin_tabs/http_tab.js
new file mode 100644
index 000000000..82e2bb010
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/http_tab.js
@@ -0,0 +1,46 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+import TupleSetting from '../helpers/tuple_setting.vue'
+import MapSetting from '../helpers/map_setting.vue'
+import ProxySetting from '../helpers/proxy_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+import { get } from 'lodash'
+
+const HTTPTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    MapSetting,
+    GroupSetting,
+    ListSetting,
+    TupleSetting,
+    ProxySetting
+  },
+  computed: {
+    ...SharedComputedObject(),
+    sslOptions () {
+      const desc = get(this.$store.state.adminSettings.descriptions, ':pleroma.:http.:adapter.:ssl_options.:versions')
+      return new Set(desc.suggestions.map(option => ({
+        label: option.replace(':tlsv', 'TLS v'),
+        value: option
+      })))
+    },
+  }
+}
+
+export default HTTPTab
diff --git a/src/components/settings_modal/admin_tabs/http_tab.vue b/src/components/settings_modal/admin_tabs/http_tab.vue
new file mode 100644
index 000000000..9ea067be8
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/http_tab.vue
@@ -0,0 +1,86 @@
+<template>
+  <div
+    class="LinksTab"
+    :label="$t('admin_dash.tabs.http')"
+  >
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.http.outbound') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ProxySetting
+            hide-description
+            path=":pleroma.:http.:proxy_url"
+          />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:http.:send_user_agent" />
+        </li>
+        <li>
+          <StringSetting path=":pleroma.:http.:user_agent" />
+        </li>
+        <li>
+          <ListSetting
+            override-available-options
+            :options="sslOptions"
+            path=":pleroma.:http.:adapter.:ssl_options.:versions"
+          />
+        </li>
+        <li>
+          <GroupSetting path=":pleroma.:http.:adapter" />
+        </li>
+      </ul>
+    </div>
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.http.incoming') }}</h3>
+      <ul class="setting-list">
+        <h4>{{ $t('admin_dash.http.security') }}</h4>
+        <li>
+          <BooleanSetting path=":pleroma.:http_security.:enabled" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:http_security.:sts" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:http_security.:sts_max_age" />
+        </li>
+        <li>
+          <IntegerSetting path=":pleroma.:http_security.:ct_max_age" />
+        </li>
+        <li>
+          <StringSetting path=":pleroma.:http_security.:referrer_policy" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:http_security.:allow_unsafe_eval" />
+        </li>
+        <li>
+          <StringSetting path=":pleroma.:http_security.:report_url" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.http.web_push') }}</h3>
+      <p>{{ $t('admin_dash.http.web_push_description') }}</p>
+      <ul class="setting-list">
+        <li>
+          <StringSetting
+            path=":web_push_encryption.:vapid_details.:subject"
+          />
+        </li>
+        <li>
+          <StringSetting
+            path=":web_push_encryption.:vapid_details.:public_key"
+          />
+        </li>
+        <li>
+          <StringSetting
+            path=":web_push_encryption.:vapid_details.:private_key"
+          />
+        </li>
+      </ul>
+      <!-- CONFIRM admin_token should go there but something is wrong with both data and description. -->
+      <!-- given the nature of the setting it's probably better to not expose it and deprecate it on backend side -->
+    </div>
+  </div>
+</template>
+
+<!--<style lang="scss" src="./http_tab.scss"></style>-->
+
+<script src="./http_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/instance_tab.js b/src/components/settings_modal/admin_tabs/instance_tab.js
index b07bafe8f..ddbd58a88 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.js
+++ b/src/components/settings_modal/admin_tabs/instance_tab.js
@@ -2,18 +2,15 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
 import ChoiceSetting from '../helpers/choice_setting.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 import StringSetting from '../helpers/string_setting.vue'
+import ColorSetting from '../helpers/color_setting.vue'
 import GroupSetting from '../helpers/group_setting.vue'
 import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+import PWAManifestIconsSetting from '../helpers/pwa_manifest_icons_setting.vue'
+import MapSetting from '../helpers/map_setting.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faGlobe
-} from '@fortawesome/free-solid-svg-icons'
-
-library.add(
-  faGlobe
-)
+import { get } from 'lodash'
 
 const InstanceTab = {
   provide () {
@@ -27,11 +24,29 @@ const InstanceTab = {
     ChoiceSetting,
     IntegerSetting,
     StringSetting,
+    ColorSetting,
     AttachmentSetting,
+    ListSetting,
+    PWAManifestIconsSetting,
+    MapSetting,
     GroupSetting
   },
   computed: {
-    ...SharedComputedObject()
+    ...SharedComputedObject(),
+    providersOptions () {
+      const desc = get(this.$store.state.adminSettings.descriptions, [':pleroma', 'Pleroma.Web.Metadata', ':providers'])
+      return new Set(desc.suggestions.map(option => ({
+        label: option.replace('Pleroma.Web.Metadata.Providers.', ''),
+        value: option
+      })))
+    },
+    limitLocalContentOptions () {
+      const desc = get(this.$store.state.adminSettings.descriptions, [':pleroma', ':instance', ':limit_to_local_content'])
+      return new Set(desc.suggestions.map(option => ({
+        label: option !== 'false' ? this.$t('admin_dash.instance.' + option) : this.$t('general.no'),
+        value: option
+      })))
+    }
   }
 }
 
diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue
index 32e8df259..fa55cef41 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.vue
+++ b/src/components/settings_modal/admin_tabs/instance_tab.vue
@@ -1,17 +1,13 @@
 <template>
   <div :label="$t('admin_dash.tabs.instance')">
-    <div class="setting-item">
-      <h2>{{ $t('admin_dash.instance.instance') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.instance.instance') }}</h3>
       <ul class="setting-list">
         <li>
           <StringSetting path=":pleroma.:instance.:name" />
         </li>
-        <!-- See https://git.pleroma.social/pleroma/pleroma/-/merge_requests/3963 -->
-        <li v-if="adminDraft[':pleroma'][':instance'][':favicon'] !== undefined">
-          <AttachmentSetting
-            compact
-            path=":pleroma.:instance.:favicon"
-          />
+        <li>
+          <StringSetting path=":pleroma.:instance.:contact_username" />
         </li>
         <li>
           <StringSetting path=":pleroma.:instance.:email" />
@@ -22,87 +18,68 @@
         <li>
           <StringSetting path=":pleroma.:instance.:short_description" />
         </li>
+        <li>
+          <ListSetting
+            force-new
+            ignore-suggestions
+            path=":pleroma.:instance.:languages"
+          />
+        </li>
+        <li>
+          <StringSetting path=":pleroma.:instance.:status_page" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.instance.branding') }}</h3>
+      <ul class="setting-list">
+        <!-- See https://git.pleroma.social/pleroma/pleroma/-/merge_requests/3963 -->
+        <li v-if="adminDraft[':pleroma'][':instance'][':favicon'] !== undefined">
+          <AttachmentSetting
+            compact
+            path=":pleroma.:instance.:favicon"
+          />
+        </li>
         <li>
           <AttachmentSetting
             compact
             path=":pleroma.:instance.:instance_thumbnail"
           />
         </li>
+        <h4>{{ $t('admin_dash.instance.pwa.manifest') }}</H4>
+        <li>
+          <PWAManifestIconsSetting path=":pleroma.:manifest.:icons" />
+        </li>
+        <li>
+          <ColorSetting hide-draft-buttons path=":pleroma.:manifest.:theme_color" />
+        </li>
+        <li>
+          <ColorSetting hide-draft-buttons path=":pleroma.:manifest.:background_color" />
+        </li>
+        <li>
+          <GroupSetting path=":pleroma.:manifest" />
+        </li>
+        <h4>{{ $t('admin_dash.instance.misc_brand') }}</H4>
         <li>
           <AttachmentSetting path=":pleroma.:instance.:background_image" />
         </li>
       </ul>
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('admin_dash.instance.registrations') }}</h2>
+      <h3>{{ $t('admin_dash.instance.rich_metadata') }}</h3>
       <ul class="setting-list">
         <li>
-          <BooleanSetting path=":pleroma.:instance.:registrations_open" />
-          <ul class="setting-list suboptions">
-            <li>
-              <BooleanSetting
-                path=":pleroma.:instance.:invites_enabled"
-                parent-path=":pleroma.:instance.:registrations_open"
-                parent-invert
-              />
-            </li>
-          </ul>
+          <ListSetting
+            override-available-options
+            :options="providersOptions"
+            :path="[':pleroma','Pleroma.Web.Metadata', ':providers']"
+          />
         </li>
         <li>
-          <BooleanSetting path=":pleroma.:instance.:birthday_required" />
-          <ul class="setting-list suboptions">
-            <li>
-              <IntegerSetting
-                path=":pleroma.:instance.:birthday_min_age"
-                parent-path=":pleroma.:instance.:birthday_required"
-              />
-            </li>
-          </ul>
-        </li>
-        <li>
-          <BooleanSetting path=":pleroma.:instance.:account_activation_required" />
-        </li>
-        <li>
-          <BooleanSetting path=":pleroma.:instance.:account_approval_required" />
-        </li>
-        <li>
-          <h3>{{ $t('admin_dash.instance.captcha_header') }}</h3>
-          <ul class="setting-list">
-            <li>
-              <BooleanSetting :path="[':pleroma', 'Pleroma.Captcha', ':enabled']" />
-              <ul class="setting-list suboptions">
-                <li>
-                  <ChoiceSetting
-                    :path="[':pleroma', 'Pleroma.Captcha', ':method']"
-                    :parent-path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
-                    :option-label-map="{
-                      'Pleroma.Captcha.Native': $t('admin_dash.captcha.native'),
-                      'Pleroma.Captcha.Kocaptcha': $t('admin_dash.captcha.kocaptcha')
-                    }"
-                  />
-                  <IntegerSetting
-                    :path="[':pleroma', 'Pleroma.Captcha', ':seconds_valid']"
-                    :parent-path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
-                  />
-                </li>
-                <li
-                  v-if="adminDraft[':pleroma']['Pleroma.Captcha'][':enabled'] && adminDraft[':pleroma']['Pleroma.Captcha'][':method'] === 'Pleroma.Captcha.Kocaptcha'"
-                >
-                  <h4>{{ $t('admin_dash.instance.kocaptcha') }}</h4>
-                  <ul class="setting-list">
-                    <li>
-                      <StringSetting :path="[':pleroma', 'Pleroma.Captcha.Kocaptcha', ':endpoint']" />
-                    </li>
-                  </ul>
-                </li>
-              </ul>
-            </li>
-          </ul>
+          <BooleanSetting
+            :path="[':pleroma','Pleroma.Web.Metadata', ':unfurl_nsfw']"
+          />
         </li>
       </ul>
     </div>
-    <div class="setting-item">
-      <h2>{{ $t('admin_dash.instance.access') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.instance.access') }}</h3>
       <ul class="setting-list">
         <li>
           <BooleanSetting
@@ -115,6 +92,8 @@
           <ChoiceSetting
             override-backend-description
             override-backend-description-label
+            override-available-options
+            :options="limitLocalContentOptions"
             path=":pleroma.:instance.:limit_to_local_content"
           />
         </li>
diff --git a/src/components/settings_modal/admin_tabs/job_queues_tab.js b/src/components/settings_modal/admin_tabs/job_queues_tab.js
new file mode 100644
index 000000000..b0f583c55
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/job_queues_tab.js
@@ -0,0 +1,34 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import TupleSetting from '../helpers/tuple_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const JobQueuesTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    TupleSetting,
+    AttachmentSetting,
+    GroupSetting,
+    ListSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default JobQueuesTab
diff --git a/src/components/settings_modal/admin_tabs/job_queues_tab.vue b/src/components/settings_modal/admin_tabs/job_queues_tab.vue
new file mode 100644
index 000000000..ad54d57f4
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/job_queues_tab.vue
@@ -0,0 +1,157 @@
+<template>
+  <div :label="$t('admin_dash.tabs.job_queues')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.job_queues.Gun.title') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <h4>{{ $t('admin_dash.job_queues.Gun.connections_pools') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <IntegerSetting path=":pleroma.:connections_pool.:connect_timeout" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:connections_pool.:connection_acquisition_retries" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:connections_pool.:connection_acquisition_wait" />
+            </li>
+            <li>
+              <!-- CONFIRM what is this -->
+              <IntegerSetting path=":pleroma.:connections_pool.:retry" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:connections_pool.:max_connections" />
+            </li>
+            <li>
+              <!-- CONFIRM what is this -->
+              <IntegerSetting path=":pleroma.:connections_pool.:max_idle_time" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:connections_pool.:reclaim_multiplier" />
+            </li>
+          </ul>
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.job_queues.Gun.pools.title') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <h5>{{ $t('admin_dash.job_queues.Gun.pools.default') }}</h5>
+              <ul class="setting-list suboptions">
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:default.:size" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:default.:max_waiting" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:default.:recv_timeout" />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:pools.:default" />
+            </li>
+            <li>
+              <h5>{{ $t('admin_dash.job_queues.Gun.pools.federation') }}</h5>
+              <ul class="setting-list suboptions">
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:federation.:size" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:federation.:max_waiting" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:federation.:recv_timeout" />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:pools.:federation" />
+            </li>
+            <li>
+              <!-- CONFIRM what is this? -->
+              <h5>{{ $t('admin_dash.job_queues.Gun.pools.rich_media') }}</h5>
+              <ul class="setting-list suboptions">
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:rich_media.:size" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:rich_media.:max_waiting" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:rich_media.:recv_timeout" />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:pools.:rich_media" />
+            </li>
+            <li>
+              <h5>{{ $t('admin_dash.job_queues.Gun.pools.media') }}</h5>
+              <ul class="setting-list suboptions">
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:media.:size" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:media.:max_waiting" />
+                </li>
+                <li>
+                  <IntegerSetting path=":pleroma.:pools.:media.:recv_timeout" />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:pools.:media" />
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.job_queues.Hackney.title') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <h4>{{ $t('admin_dash.job_queues.Hackney.federation') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:federation.:max_connections" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:federation.:timeout" />
+            </li>
+          </ul>
+          <GroupSetting path=":pleroma.:hackney_pools.:federation" />
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.job_queues.Hackney.media') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:media.:max_connections" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:media.:timeout" />
+            </li>
+          </ul>
+          <GroupSetting path=":pleroma.:hackney_pools.:media" />
+        </li>
+        <li>
+          <!-- CONFIRM what is this -->
+          <h4>{{ $t('admin_dash.job_queues.Hackney.rich_media') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:rich_media.:max_connections" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:rich_media.:timeout" />
+            </li>
+          </ul>
+          <GroupSetting path=":pleroma.:hackney_pools.:rich_media" />
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.job_queues.Hackney.upload') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:upload.:max_connections" />
+            </li>
+            <li>
+              <IntegerSetting path=":pleroma.:hackney_pools.:upload.:timeout" />
+            </li>
+          </ul>
+          <GroupSetting path=":pleroma.:hackney_pools.:upload" />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./job_queues_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/limits_tab.js b/src/components/settings_modal/admin_tabs/limits_tab.js
index 684739c31..c1126f49c 100644
--- a/src/components/settings_modal/admin_tabs/limits_tab.js
+++ b/src/components/settings_modal/admin_tabs/limits_tab.js
@@ -4,17 +4,8 @@ import IntegerSetting from '../helpers/integer_setting.vue'
 import StringSetting from '../helpers/string_setting.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faGlobe
-} from '@fortawesome/free-solid-svg-icons'
-
-library.add(
-  faGlobe
-)
 
 const LimitsTab = {
-  data () {},
   components: {
     BooleanSetting,
     ChoiceSetting,
diff --git a/src/components/settings_modal/admin_tabs/limits_tab.vue b/src/components/settings_modal/admin_tabs/limits_tab.vue
index ef4b9271d..04afde020 100644
--- a/src/components/settings_modal/admin_tabs/limits_tab.vue
+++ b/src/components/settings_modal/admin_tabs/limits_tab.vue
@@ -1,10 +1,10 @@
 <template>
   <div :label="$t('admin_dash.tabs.limits')">
-    <div class="setting-item">
-      <h2>{{ $t('admin_dash.limits.arbitrary_limits') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.limits.arbitrary_limits') }}</h3>
       <ul class="setting-list">
         <li>
-          <h3>{{ $t('admin_dash.limits.posts') }}</h3>
+          <h4>{{ $t('admin_dash.limits.posts') }}</h4>
           <ul class="setting-list">
             <li>
               <IntegerSetting
@@ -24,7 +24,7 @@
           </ul>
         </li>
         <li>
-          <h3>{{ $t('admin_dash.limits.uploads') }}</h3>
+          <h4>{{ $t('admin_dash.limits.uploads') }}</h4>
           <ul class="setting-list">
             <li>
               <IntegerSetting
@@ -50,7 +50,7 @@
           </ul>
         </li>
         <li>
-          <h3>{{ $t('admin_dash.limits.users') }}</h3>
+          <h4>{{ $t('admin_dash.limits.users') }}</h4>
           <ul class="setting-list">
             <li>
               <IntegerSetting
@@ -74,7 +74,7 @@
               />
             </li>
             <li>
-              <h4>{{ $t('admin_dash.limits.profile_fields') }}</h4>
+              <h5>{{ $t('admin_dash.limits.profile_fields') }}</h5>
               <ul class="setting-list">
                 <li>
                   <IntegerSetting
@@ -108,7 +108,7 @@
               </ul>
             </li>
             <li>
-              <h4>{{ $t('admin_dash.limits.user_uploads') }}</h4>
+              <h5>{{ $t('admin_dash.limits.user_uploads') }}</h5>
               <ul class="setting-list">
                 <li>
                   <IntegerSetting
@@ -128,6 +128,25 @@
             </li>
           </ul>
         </li>
+        <li>
+          <h4>{{ $t('admin_dash.limits.other') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <IntegerSetting
+                source="admin"
+                path=":pleroma.:instance.:max_report_comment_size"
+                draft-mode
+              />
+            </li>
+            <li>
+              <IntegerSetting
+                source="admin"
+                path=":pleroma.:instance.:max_endorsed_users"
+                draft-mode
+              />
+            </li>
+          </ul>
+        </li>
       </ul>
     </div>
   </div>
diff --git a/src/components/settings_modal/admin_tabs/links_tab.js b/src/components/settings_modal/admin_tabs/links_tab.js
new file mode 100644
index 000000000..026b099a5
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/links_tab.js
@@ -0,0 +1,109 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+import { get } from 'lodash'
+
+const LinksTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    GroupSetting,
+    ListSetting,
+    Checkbox
+  },
+  computed: {
+    classIsPresent () {
+      return this.$store.state.adminSettings.draft[':pleroma']['Pleroma.Formatter'][':class'] !== false
+    },
+    relIsPresent () {
+      return this.$store.state.adminSettings.draft[':pleroma']['Pleroma.Formatter'][':rel'] !== false
+    },
+    truncateIsPresent () {
+      return this.$store.state.adminSettings.draft[':pleroma']['Pleroma.Formatter'][':truncate'] !== false
+    },
+    truncateDescription () {
+      return get(this.$store.state.adminSettings.descriptions, [':pleroma', 'Pleroma.Formatter', ':truncate'])
+    },
+    ttlSettersOptions () {
+      const desc = get(this.$store.state.adminSettings.descriptions, ':pleroma.:rich_media.:ttl_setters')
+      return new Set(desc.suggestions.map(option => ({
+        label: option.replace('Pleroma.Web.RichMedia.Parser.TTL.', ''),
+        value: option
+      })))
+    },
+    parsersOptions () {
+      const desc = get(this.$store.state.adminSettings.descriptions, ':pleroma.:rich_media.:parsers')
+      return new Set(desc.suggestions.map(option => ({
+        label: option.replace('Pleroma.Web.RichMedia.Parsers.', ''),
+        value: option
+      })))
+    },
+    validateTLDOptions () {
+      return [{
+        label: this.$t('general.yes'),
+        value: true
+      }, {
+        label: this.$t('general.no'),
+        value: false
+      }, {
+        label: this.$t('admin_dash.links.no_scheme'),
+        value: ':no_scheme'
+      }]
+    },
+    mediaProxyEnabled () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':media_proxy'][':enabled']
+    },
+    mediaInvalidationProvider () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':media_proxy'][':invalidation'][':provider']
+    },
+    ...SharedComputedObject()
+  },
+  methods: {
+    checkRel (e) {
+      this.$store.commit(
+        'updateAdminDraft',
+        {
+          path: [':pleroma','Pleroma.Formatter',':rel'],
+          value: e ? '' : false
+        }
+      )
+    },
+    checkClass (e) {
+      this.$store.commit(
+        'updateAdminDraft',
+        {
+          path: [':pleroma','Pleroma.Formatter',':class'],
+          value: e ? '' : false
+        }
+      )
+    },
+    checkTruncate (e) {
+      this.$store.commit(
+        'updateAdminDraft',
+        {
+          path: [':pleroma','Pleroma.Formatter',':truncate'],
+          value: e ? 20 : false
+        }
+      )
+    }
+  }
+}
+
+export default LinksTab
diff --git a/src/components/settings_modal/admin_tabs/links_tab.vue b/src/components/settings_modal/admin_tabs/links_tab.vue
new file mode 100644
index 000000000..1d446a0dd
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/links_tab.vue
@@ -0,0 +1,45 @@
+<template>
+  <div
+    class="LinksTab"
+    :label="$t('admin_dash.tabs.media_proxy')"
+  >
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.links.link_previews') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:rich_media.:enabled" />
+        </li>
+        <li>
+          <ListSetting
+            override-available-options
+            :options="parsersOptions"
+            path=":pleroma.:rich_media.:parsers"
+          />
+        </li>
+        <li>
+          <IntegerSetting
+            path=":pleroma.:rich_media.:timeout"
+          />
+        </li>
+        <li>
+          <ListSetting
+            override-available-options
+            :options="ttlSettersOptions"
+            path=":pleroma.:rich_media.:ttl_setters"
+          />
+        </li>
+        <li>
+          <ListSetting
+            path=":pleroma.:rich_media.:ignore_tld"
+            ignore-suggestions
+          />
+        </li>
+        <li>
+          <ListSetting path=":pleroma.:rich_media.:ignore_hosts" />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./links_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/mailer_tab.js b/src/components/settings_modal/admin_tabs/mailer_tab.js
new file mode 100644
index 000000000..44b2f33df
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/mailer_tab.js
@@ -0,0 +1,65 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import ColorSetting from '../helpers/color_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const MailerTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    ColorSetting,
+    GroupSetting
+  },
+  computed: {
+    adaptersLabels () {
+      const prefix = 'Swoosh.Adapters.'
+      const descriptions = this.$store.state.adminSettings.descriptions
+      const options = descriptions[':pleroma']['Pleroma.Emails.Mailer'][':adapter'].suggestions
+
+      return Object.fromEntries(options.map(value => [
+        value, value.replace(prefix, '')
+      ]))
+    },
+    startTLSLabels () {
+      return {
+        ':always': this.$t('admin_dash.generic_enforcement.always'),
+        ':if_available': this.$t('admin_dash.generic_enforcement.if_available'),
+        ':never': this.$t('admin_dash.generic_enforcement.never')
+      }
+      // return Object.fromEntries(options.map(value => [
+      //   value, value.replace(prefix, '')
+      // ]))
+    },
+    adapter () {
+      return this.$store.state.adminSettings.draft[':pleroma']['Pleroma.Emails.Mailer'][':adapter']
+    },
+    mailerEnabled () {
+      return this.$store.state.adminSettings.draft[':pleroma']['Pleroma.Emails.Mailer'][':enabled']
+    },
+    ...SharedComputedObject()
+  },
+  methods: {
+    adapterHasKey (key) {
+      const descriptions = this.$store.state.adminSettings.descriptions
+      const mailerStuff = descriptions[':pleroma']['Pleroma.Emails.Mailer']
+      const adapterStuff = mailerStuff[':subgroup,' + this.adapter]
+      return Object.prototype.hasOwnProperty.call(adapterStuff, key)
+    }
+  }
+}
+
+export default MailerTab
diff --git a/src/components/settings_modal/admin_tabs/mailer_tab.vue b/src/components/settings_modal/admin_tabs/mailer_tab.vue
new file mode 100644
index 000000000..53d8cd7f9
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/mailer_tab.vue
@@ -0,0 +1,179 @@
+<template>
+  <div :label="$t('admin_dash.tabs.mailer')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.mailer.styling') }}</h3>
+      <ul class="setting-list">
+        <h4>{{ $t('admin_dash.mailer.assets') }}</h4>
+        <li>
+          <StringSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':logo']" />
+        </li>
+        <h4>{{ $t('admin_dash.mailer.colors') }}</h4>
+        <li>
+          <ColorSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling', ':background_color']" />
+        </li>
+        <li>
+          <ColorSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling', ':content_background_color']" />
+        </li>
+        <li>
+          <ColorSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling', ':header_color']" />
+        </li>
+        <li>
+          <ColorSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling', ':text_color']" />
+        </li>
+        <li>
+          <ColorSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling', ':link_color']" />
+        </li>
+        <li>
+          <ColorSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling', ':text_muted_color']" />
+        </li>
+        <li>
+          <GroupSetting :path="[':pleroma','Pleroma.Emails.UserEmail', ':styling']" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.mailer.adapter') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting :path="[':pleroma','Pleroma.Emails.Mailer',':enabled']" />
+        </li>
+        <template v-if="mailerEnabled">
+          <li>
+            <ChoiceSetting
+              :path="[':pleroma','Pleroma.Emails.Mailer',':adapter']"
+              :option-label-map="adaptersLabels"
+            />
+            <h4>{{ $t('admin_dash.mailer.auth') }}</h4>
+            <ul class="setting-list suboptions">
+              <li v-if="adapterHasKey(':api_key')">
+                <!-- authentication info -->
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':api_key']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':access_key')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':access_key']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':access_token')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':access_token']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':username')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':username']"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':password')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':password']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':secret')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':secret']"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':auth')">
+                <ChoiceSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':auth']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+
+              <!-- server info -->
+              <li v-if="adapterHasKey(':relay')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':relay']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':ssl')">
+                <BooleanSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':ssl']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':tls')">
+                <ChoiceSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':tls']"
+                  :option-label-map="startTLSLabels"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':port')">
+                <IntegerSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':port']"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':server_id')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':server_id']"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':region')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':region']"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':domain')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':domain']"
+                  :subgroup="adapter"
+                />
+              </li>
+
+              <!-- sendmail exclusive -->
+              <li v-if="adapterHasKey(':cmd_path')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':cmd_path']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':cmd_args')">
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':cmd_args']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':qmail')">
+                <BooleanSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':qmail']"
+                  :password="true"
+                  :subgroup="adapter"
+                />
+              </li>
+              <li v-if="adapterHasKey(':retries')">
+                <IntegerSetting
+                  :path="[':pleroma','Pleroma.Emails.Mailer',':retries']"
+                  :subgroup="adapter"
+                />
+              </li>
+            </ul>
+          </li>
+        </template>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./mailer_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/media_proxy_tab.js b/src/components/settings_modal/admin_tabs/media_proxy_tab.js
new file mode 100644
index 000000000..af82593bc
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/media_proxy_tab.js
@@ -0,0 +1,38 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const MediaProxyTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    GroupSetting,
+    ListSetting
+  },
+  computed: {
+    mediaProxyEnabled () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':media_proxy'][':enabled']
+    },
+    mediaInvalidationProvider () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':media_proxy'][':invalidation'][':provider']
+    },
+    ...SharedComputedObject()
+  }
+}
+
+export default MediaProxyTab
diff --git a/src/components/settings_modal/admin_tabs/media_proxy_tab.vue b/src/components/settings_modal/admin_tabs/media_proxy_tab.vue
new file mode 100644
index 000000000..ed5f6f0b4
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/media_proxy_tab.vue
@@ -0,0 +1,135 @@
+<template>
+  <div :label="$t('admin_dash.tabs.media_proxy')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.media_proxy.basic') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:media_proxy.:enabled" />
+          <ul
+            v-if="mediaProxyEnabled"
+            class="setting-list suboptions"
+          >
+            <li>
+              <StringSetting path=":pleroma.:media_proxy.:base_url" />
+            </li>
+            <li>
+              <BooleanSetting path=":pleroma.:media_proxy.:proxy_opts.:redirect_on_failure" />
+            </li>
+            <li>
+              <ListSetting
+                ignore-suggestions
+                path=":pleroma.:media_proxy.:whitelist"
+              />
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <template v-if="mediaProxyEnabled">
+        <h3>{{ $t('admin_dash.media_proxy.invalidation') }}</h3>
+        <ul class="setting-list">
+          <li>
+            <BooleanSetting path=":pleroma.:media_proxy.:invalidation.:enabled" />
+            <ul class="setting-list suboptions">
+              <li>
+                <ChoiceSetting
+                  path=":pleroma.:media_proxy.:invalidation.:provider"
+                  parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                />
+              </li>
+              <h4>{{ $t('admin_dash.media_proxy.invalidation_settings') }}</h4>
+              <ul class="setting-list suboptions">
+                <template v-if="mediaInvalidationProvider === 'Pleroma.Web.MediaProxy.Invalidation.Http'">
+                  <li>
+                    <StringSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Http', ':method']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                    />
+                  </li>
+                  <li>
+                    <ListSetting
+                      ignore-suggestions
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Http', ':headers']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                    />
+                  </li>
+                  <li>
+                    <ListSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Http', ':options']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                    />
+                  </li>
+                </template>
+                <template v-if="mediaInvalidationProvider === 'Pleroma.Web.MediaProxy.Invalidation.Script'">
+                  <!-- TODO: you know the drill by now - list component -->
+                  <li>
+                    <StringSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Script', ':script_path']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                    />
+                  </li>
+                  <li>
+                    <StringSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Script', ':url_format']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                    />
+                  </li>
+                </template>
+              </ul>
+            </ul>
+          </li>
+        </ul>
+        <h3>{{ $t('admin_dash.media_proxy.limits') }}</h3>
+        <ul class="setting-list">
+          <li>
+            <IntegerSetting
+              path=":pleroma.:media_proxy.:proxy_opts.:max_body_length"
+            />
+          </li>
+          <li>
+            <IntegerSetting
+              path=":pleroma.:media_proxy.:proxy_opts.:max_read_duration"
+            />
+          </li>
+          <li>
+            <GroupSetting path=":pleroma.:media_proxy.:proxy_opts" />
+          </li>
+        </ul>
+        <!-- TODO: add whitelist when we have list component (hehe) -->
+        <h3>{{ $t('admin_dash.media_proxy.thumbnails') }}</h3>
+        <ul class="setting-list">
+          <li>
+            <BooleanSetting path=":pleroma.:media_preview_proxy.:enabled" />
+            <ul class="setting-list suboptions">
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:image_quality"
+                />
+              </li>
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:min_content_length"
+                />
+              </li>
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:thumbnail_max_width"
+                />
+              </li>
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:thumbnail_max_height"
+                />
+              </li>
+            </ul>
+          </li>
+        </ul>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script src="./media_proxy_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/monitoring_tab.js b/src/components/settings_modal/admin_tabs/monitoring_tab.js
new file mode 100644
index 000000000..8593b9d69
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/monitoring_tab.js
@@ -0,0 +1,42 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faGlobe
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faGlobe
+)
+
+const MonitoringTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    GroupSetting,
+    ListSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  },
+  methods: {
+  }
+}
+
+export default MonitoringTab
diff --git a/src/components/settings_modal/admin_tabs/monitoring_tab.vue b/src/components/settings_modal/admin_tabs/monitoring_tab.vue
new file mode 100644
index 000000000..762e44157
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/monitoring_tab.vue
@@ -0,0 +1,47 @@
+<template>
+  <div :label="$t('admin_dash.tabs.monitoring')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.monitoring.builtins') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting :path="[':pleroma','Pleroma.Emails.NewUsersDigestEmail',':enabled']" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:healthcheck" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.monitoring.prometheus') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting :path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':enabled']" />
+        </li>
+        <li>
+          <BooleanSetting
+            :parent-path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':enabled']"
+            :path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':auth']"
+          />
+        </li>
+        <li>
+          <StringSetting
+            :parent-path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':enabled']"
+            :path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':path']"
+          />
+        </li>
+        <li>
+          <ChoiceSetting
+            :parent-path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':enabled']"
+            :path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':format']"
+          />
+        </li>
+        <li>
+          <ListSetting
+            :parent-path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':enabled']"
+            :path="[':prometheus','Pleroma.Web.Endpoint.MetricsExporter',':ip_whitelist']"
+          />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./monitoring_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/other_tab.js b/src/components/settings_modal/admin_tabs/other_tab.js
new file mode 100644
index 000000000..dc6550d27
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/other_tab.js
@@ -0,0 +1,38 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import ColorSetting from '../helpers/color_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+import PWAManifestIconsSetting from '../helpers/pwa_manifest_icons_setting.vue'
+import MapSetting from '../helpers/map_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const OtherTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    ColorSetting,
+    AttachmentSetting,
+    ListSetting,
+    PWAManifestIconsSetting,
+    MapSetting,
+    GroupSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default OtherTab
diff --git a/src/components/settings_modal/admin_tabs/other_tab.vue b/src/components/settings_modal/admin_tabs/other_tab.vue
new file mode 100644
index 000000000..55e61607d
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/other_tab.vue
@@ -0,0 +1,52 @@
+<template>
+  <div :label="$t('admin_dash.tabs.other')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.other.uncategorized') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <StringSetting path=":pleroma.:instance.:static_dir" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:profile_directory" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.other.reports') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:report_strip_status" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.other.user_backup') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <IntegerSetting :path="[':pleroma','Pleroma.User.Backup',':purge_after_days']" />
+        </li>
+        <li>
+          <IntegerSetting :path="[':pleroma','Pleroma.User.Backup',':limit_days']" />
+        </li>
+        <!-- CONFIRM what is this?
+        <li>
+          <StringSetting :path="[':pleroma','Pleroma.User.Backup',':dir']" />
+        </li>
+        -->
+        <li>
+          <IntegerSetting :path="[':pleroma','Pleroma.User.Backup',':process_chunk_size']" />
+        </li>
+        <li>
+          <IntegerSetting :path="[':pleroma','Pleroma.User.Backup',':timeout']" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.other.privileges') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ListSetting path=":pleroma.:instance.:admin_privileges" />
+        </li>
+        <li>
+          <ListSetting path=":pleroma.:instance.:moderator_privileges" />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./other_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/posts_tab.js b/src/components/settings_modal/admin_tabs/posts_tab.js
new file mode 100644
index 000000000..d9f213594
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/posts_tab.js
@@ -0,0 +1,38 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import ColorSetting from '../helpers/color_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+import PWAManifestIconsSetting from '../helpers/pwa_manifest_icons_setting.vue'
+import MapSetting from '../helpers/map_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const PostsTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    ColorSetting,
+    AttachmentSetting,
+    ListSetting,
+    PWAManifestIconsSetting,
+    MapSetting,
+    GroupSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default PostsTab
diff --git a/src/components/settings_modal/admin_tabs/posts_tab.vue b/src/components/settings_modal/admin_tabs/posts_tab.vue
new file mode 100644
index 000000000..c76b2e4ee
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/posts_tab.vue
@@ -0,0 +1,29 @@
+<template>
+  <div :label="$t('admin_dash.tabs.posts')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.posts.global') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:instances_favicons.:enabled" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.posts.local') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ListSetting path=":pleroma.:instance.:allowed_post_formats" />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.posts.remote') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <IntegerSetting path=":pleroma.:instance.:remote_post_retention_days" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:skip_thread_containment" />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./posts_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/rates_tab.js b/src/components/settings_modal/admin_tabs/rates_tab.js
new file mode 100644
index 000000000..c602dcc8a
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/rates_tab.js
@@ -0,0 +1,20 @@
+import RateSetting from '../helpers/rate_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const RatesTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    RateSetting,
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default RatesTab
diff --git a/src/components/settings_modal/admin_tabs/rates_tab.vue b/src/components/settings_modal/admin_tabs/rates_tab.vue
new file mode 100644
index 000000000..3056a1920
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/rates_tab.vue
@@ -0,0 +1,41 @@
+<template>
+  <div :label="$t('admin_dash.tabs.instance')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.rate_limit.account_confirmation_resend') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:account_confirmation_resend" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:ap_routes" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:app_account_creation" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:authentication" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:oauth_app_creation" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:relation_id_action" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:search" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:status_id_action" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:statuses_actions" />
+        </li>
+        <li>
+          <RateSetting path=":pleroma.:rate_limit.:timeline" />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./rates_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/registrations_tab.js b/src/components/settings_modal/admin_tabs/registrations_tab.js
new file mode 100644
index 000000000..3ce6c8044
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/registrations_tab.js
@@ -0,0 +1,34 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+import TupleSetting from '../helpers/tuple_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
+import ListSetting from '../helpers/list_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const RegistrationsTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    TupleSetting,
+    AttachmentSetting,
+    GroupSetting,
+    ListSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default RegistrationsTab
diff --git a/src/components/settings_modal/admin_tabs/registrations_tab.vue b/src/components/settings_modal/admin_tabs/registrations_tab.vue
new file mode 100644
index 000000000..a52072c01
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/registrations_tab.vue
@@ -0,0 +1,182 @@
+<template>
+  <div :label="$t('admin_dash.tabs.instance')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.instance.registrations') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:registrations_open" />
+          <ul class="setting-list suboptions">
+            <li>
+              <BooleanSetting
+                path=":pleroma.:instance.:invites_enabled"
+                parent-path=":pleroma.:instance.:registrations_open"
+                parent-invert
+              />
+            </li>
+          </ul>
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:birthday_required" />
+          <ul class="setting-list suboptions">
+            <li>
+              <IntegerSetting
+                path=":pleroma.:instance.:birthday_min_age"
+                parent-path=":pleroma.:instance.:birthday_required"
+              />
+            </li>
+          </ul>
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:account_activation_required" />
+        </li>
+        <li>
+          <BooleanSetting path=":pleroma.:instance.:account_approval_required" />
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.instance.captcha_header') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <BooleanSetting :path="[':pleroma', 'Pleroma.Captcha', ':enabled']" />
+              <ul class="setting-list suboptions">
+                <li>
+                  <ChoiceSetting
+                    :path="[':pleroma', 'Pleroma.Captcha', ':method']"
+                    :parent-path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
+                    :option-label-map="{
+                      'Pleroma.Captcha.Native': $t('admin_dash.captcha.native'),
+                      'Pleroma.Captcha.Kocaptcha': $t('admin_dash.captcha.kocaptcha')
+                    }"
+                  />
+                  <IntegerSetting
+                    :path="[':pleroma', 'Pleroma.Captcha', ':seconds_valid']"
+                    :parent-path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
+                  />
+                </li>
+                <li
+                  v-if="adminDraft[':pleroma']['Pleroma.Captcha'][':enabled'] && adminDraft[':pleroma']['Pleroma.Captcha'][':method'] === 'Pleroma.Captcha.Kocaptcha'"
+                >
+                  <h5>{{ $t('admin_dash.instance.kocaptcha') }}</h5>
+                  <ul class="setting-list">
+                    <li>
+                      <StringSetting :path="[':pleroma', 'Pleroma.Captcha.Kocaptcha', ':endpoint']" />
+                    </li>
+                  </ul>
+                </li>
+              </ul>
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.registrations.autofollow') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ListSetting
+            path=":pleroma.:instance.:autofollowed_nicknames"
+          />
+        </li>
+        <li>
+          <ListSetting
+            path=":pleroma.:instance.:autofollowing_nicknames"
+          />
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.registrations.welcome.title') }}</h3>
+      <ul class="setting-list">
+        <p>{{ $t('admin_dash.registrations.welcome.description') }}</p>
+        <li>
+          <h4>{{ $t('admin_dash.registrations.welcome.direct_message') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <BooleanSetting
+                path=":pleroma.:welcome.:direct_message.:enabled"
+              />
+              <ul class="setting-list suboptions">
+                <li>
+                  <StringSetting
+                    path=":pleroma.:welcome.:direct_message.:sender_nickname"
+                    parent-path=":pleroma.:welcome.:direct_message.:enabled"
+                  />
+                </li>
+                <li>
+                  <StringSetting
+                    path=":pleroma.:welcome.:direct_message.:message"
+                    parent-path=":pleroma.:welcome.:direct_message.:enabled"
+                  />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:welcome.:direct_message" />
+            </li>
+          </ul>
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.registrations.welcome.chat_message') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <BooleanSetting
+                path=":pleroma.:welcome.:chat_message.:enabled"
+              />
+              <ul class="setting-list suboptions">
+                <li>
+                  <StringSetting
+                    tuple
+                    path=":pleroma.:welcome.:chat_message.:sender_nickname"
+                    parent-path=":pleroma.:welcome.:chat_message.:enabled"
+                  />
+                </li>
+                <li>
+                  <StringSetting
+                    path=":pleroma.:welcome.:chat_message.:message"
+                    parent-path=":pleroma.:welcome.:chat_message.:enabled"
+                  />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:welcome.:chat_message" />
+            </li>
+          </ul>
+        </li>
+        <li>
+          <h4>{{ $t('admin_dash.registrations.welcome.email_message') }}</h4>
+          <ul class="setting-list">
+            <li>
+              <BooleanSetting
+                path=":pleroma.:welcome.:email.:enabled"
+              />
+              <ul class="setting-list suboptions">
+                <li>
+                  <TupleSetting
+                    path=":pleroma.:welcome.:email.:sender"
+                    parent-path=":pleroma.:welcome.:email.:enabled"
+                  />
+                </li>
+                <li>
+                  <StringSetting
+                    path=":pleroma.:welcome.:email.:subject"
+                    parent-path=":pleroma.:welcome.:email.:enabled"
+                  />
+                </li>
+                <li>
+                  <StringSetting
+                    path=":pleroma.:welcome.:email.:html"
+                    parent-path=":pleroma.:welcome.:email.:enabled"
+                  />
+                </li>
+              </ul>
+              <GroupSetting path=":pleroma.:welcome.:email" />
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.registrations.restrictions') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ListSetting
+            ignore-suggestions
+            :path="[':pleroma', 'Pleroma.User', ':email_blacklist']"
+          />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./registrations_tab.js"></script>
diff --git a/src/components/settings_modal/admin_tabs/uploads_tab.js b/src/components/settings_modal/admin_tabs/uploads_tab.js
new file mode 100644
index 000000000..40a184db1
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/uploads_tab.js
@@ -0,0 +1,46 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const UploadsTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  data () {
+    return {
+      uploaders: [{
+        key: 'Pleroma.Uploaders.Local',
+        value: 'Pleroma.Uploaders.Local',
+        label: this.$t('admin_dash.uploads.local_uploader')
+      }, {
+        key: 'Pleroma.Uploaders.IPFS',
+        value: 'Pleroma.Uploaders.IPFS',
+        label: 'IPFS'
+      }, {
+        key: 'Pleroma.Uploaders.S3',
+        value: 'Pleroma.Uploaders.S3',
+        label: 'S3'
+      }]
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting
+  },
+  computed: {
+    uploader () {
+      return this.$store.state.adminSettings.draft[':pleroma']['Pleroma.Upload'][':uploader']
+    },
+    ...SharedComputedObject()
+  }
+}
+
+export default UploadsTab
diff --git a/src/components/settings_modal/admin_tabs/uploads_tab.vue b/src/components/settings_modal/admin_tabs/uploads_tab.vue
new file mode 100644
index 000000000..d0462aff1
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/uploads_tab.vue
@@ -0,0 +1,110 @@
+<template>
+  <div :label="$t('admin_dash.tabs.uploads')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.uploads.upload') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ChoiceSetting
+            :path="[':pleroma','Pleroma.Upload',':uploader']"
+            :options="uploaders"
+          />
+          <h4>{{ $t('admin_dash.uploads.uploader_settings') }}</h4>
+          <ul class="setting-list suboptions">
+            <template v-if="uploader === 'Pleroma.Uploaders.Local'">
+              <li>
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Uploaders.Local',':uploads']"
+                />
+              </li>
+            </template>
+            <template v-else-if="uploader === 'Pleroma.Uploaders.IPFS'">
+              <li>
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Uploaders.IPFS',':get_gateway_url']"
+                />
+              </li>
+              <li>
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Uploaders.IPFS',':post_gateway_url']"
+                />
+              </li>
+            </template>
+            <template v-else-if="uploader === 'Pleroma.Uploaders.S3'">
+              <li>
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Uploaders.S3',':bucket']"
+                />
+              </li>
+              <li>
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Uploaders.S3',':bucket_namespace']"
+                />
+              </li>
+              <li>
+                <BooleanSetting
+                  :path="[':pleroma','Pleroma.Uploaders.S3',':streaming_enabled']"
+                />
+              </li>
+              <li>
+                <StringSetting
+                  :path="[':pleroma','Pleroma.Uploaders.S3',':truncated_namespace']"
+                />
+              </li>
+            </template>
+            <li>
+              <IntegerSetting
+                :path="[':pleroma','Pleroma.Uploaders.Uploader',':timeout']"
+              />
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('admin_dash.uploads.attachments') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting
+            path=":pleroma.:instance.:attachment_links"
+            :options="uploaders"
+          />
+        </li>
+        <li>
+          <BooleanSetting
+            path=":pleroma.:instance.:cleanup_attachments"
+            :options="uploaders"
+          />
+        </li>
+      </ul>
+      <!-- CONFIRM how filters work -->
+      <h3>{{ $t('admin_dash.uploads.filenames') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting
+            :path="[':pleroma','Pleroma.Upload',':link_name']"
+            :subgroup="adapter"
+          />
+        </li>
+        <li>
+          <IntegerSetting
+            :path="[':pleroma','Pleroma.Upload',':filename_display_max_length']"
+            :subgroup="adapter"
+          />
+        </li>
+        <li>
+          <StringSetting
+            :path="[':pleroma','Pleroma.Upload',':default_description']"
+            :subgroup="adapter"
+          />
+        </li>
+        <li>
+          <StringSetting
+            :path="[':pleroma','Pleroma.Upload',':base_url']"
+            :subgroup="adapter"
+          />
+        </li>
+        <!-- TODO: add mime-type when we have a dynamic list component -->
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./uploads_tab.js"></script>
diff --git a/src/components/settings_modal/helpers/attachment_setting.vue b/src/components/settings_modal/helpers/attachment_setting.vue
index 96c80ab17..a7804d78f 100644
--- a/src/components/settings_modal/helpers/attachment_setting.vue
+++ b/src/components/settings_modal/helpers/attachment_setting.vue
@@ -1,10 +1,11 @@
 <template>
   <span
     v-if="matchesExpertLevel"
-    class="AttachmentSetting"
+    class="AttachmentSetting setting-item"
     :class="{ '-compact': compact }"
   >
     <label
+      class="setting-label"
       :for="path"
       :class="{ 'faint': shouldBeDisabled }"
     >
@@ -48,18 +49,14 @@
         :attachment="attachment"
         size="small"
         hide-description
-        @setMedia="onMedia"
-        @naturalSizeLoad="onNaturalSizeLoad"
       />
       <div class="controls control-upload">
         <MediaUpload
           ref="mediaUpload"
           class="media-upload-icon"
-          :drop-files="dropFiles"
           normal-button
           :accept-types="acceptTypes"
           @uploaded="setMediaFile"
-          @upload-failed="uploadFailed"
         />
       </div>
     </div>
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index 5a9eab348..2134ad7ce 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -1,18 +1,25 @@
 <template>
   <label
     v-if="matchesExpertLevel"
-    class="BooleanSetting"
+    class="BooleanSetting setting-item"
   >
     <Checkbox
+      class="setting-control setting-label"
       :model-value="visibleState"
       :disabled="shouldBeDisabled"
       :indeterminate="isIndeterminate"
-      @update:modelValue="update"
+      @update:model-value="update"
     >
       <span
         class="label"
         :class="{ 'faint': shouldBeDisabled }"
       >
+        <ModifiedIndicator
+          :changed="isChanged"
+          :onclick="reset"
+        />
+        <ProfileSettingIndicator :is-profile="isProfileSetting" />
+        {{ ' ' }}
         <template v-if="backendDescriptionLabel">
           {{ backendDescriptionLabel }}
         </template>
@@ -22,19 +29,16 @@
         <slot v-else />
       </span>
     </Checkbox>
-    <ModifiedIndicator
-      :changed="isChanged"
-      :onclick="reset"
-    />
-    <ProfileSettingIndicator :is-profile="isProfileSetting" />
-    <DraftButtons />
     <p
-      v-if="backendDescriptionDescription"
+      v-if="backendDescriptionDescription || showDescription"
       class="setting-description"
       :class="{ 'faint': shouldBeDisabled }"
     >
-      {{ backendDescriptionDescription + ' ' }}
+      <slot name="description">
+        {{ backendDescriptionDescription + ' ' }}
+      </slot>
     </p>
+    <DraftButtons />
   </label>
 </template>
 
diff --git a/src/components/settings_modal/helpers/choice_setting.js b/src/components/settings_modal/helpers/choice_setting.js
index bdeece760..10e043082 100644
--- a/src/components/settings_modal/helpers/choice_setting.js
+++ b/src/components/settings_modal/helpers/choice_setting.js
@@ -9,6 +9,10 @@ export default {
   },
   props: {
     ...Setting.props,
+    overrideOptions: {
+      type: Boolean,
+      required: false
+    },
     options: {
       type: Array,
       required: false
@@ -22,7 +26,16 @@ export default {
   computed: {
     ...Setting.computed,
     realOptions () {
+      if (this.overrideOptions) {
+        return this.options
+      }
       if (this.realSource === 'admin') {
+        if (
+          !this.backendDescriptionSuggestions?.length ||
+            this.backendDescriptionSuggestions?.length === 0
+        ) {
+          return this.options
+        }
         return this.backendDescriptionSuggestions.map(x => ({
           key: x,
           value: x,
diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index 114e9b7dc..318951026 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -1,19 +1,28 @@
 <template>
   <label
     v-if="matchesExpertLevel"
-    class="ChoiceSetting"
+    class="ChoiceSetting setting-item"
+    :class="{ 'faint': shouldBeDisabled }"
   >
-    <template v-if="backendDescriptionLabel">
-      {{ backendDescriptionLabel }}
-    </template>
-    <template v-else>
-      <slot />
-    </template>
-    {{ ' ' }}
+    <span class="setting-label">
+      <ModifiedIndicator
+        :changed="isChanged"
+        :onclick="reset"
+      />
+      <ProfileSettingIndicator :is-profile="isProfileSetting" />
+      {{ ' ' }}
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel }}
+      </template>
+      <template v-else>
+        <slot />
+      </template>
+    </span>
     <Select
-      :model-value="realDraftMode ? draft :state"
-      :disabled="disabled"
-      @update:modelValue="update"
+      class="setting-control"
+      :model-value="realDraftMode ? draft : state"
+      :disabled="shouldBeDisabled"
+      @update:model-value="update"
     >
       <option
         v-for="option in realOptions"
@@ -24,11 +33,6 @@
         {{ option.value === defaultState ? $t('settings.instance_default_simple') : '' }}
       </option>
     </Select>
-    <ModifiedIndicator
-      :changed="isChanged"
-      :onclick="reset"
-    />
-    <ProfileSettingIndicator :is-profile="isProfileSetting" />
     <DraftButtons />
     <p
       v-if="backendDescriptionDescription"
@@ -40,3 +44,16 @@
 </template>
 
 <script src="./choice_setting.js"></script>
+
+<style lang="scss">
+.ChoiceSetting.setting-item {
+  .-mobile & {
+    display: block;
+
+    .setting-label {
+      display: block;
+      margin-bottom: 0.5em
+    }
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/color_setting.js b/src/components/settings_modal/helpers/color_setting.js
new file mode 100644
index 000000000..c286b90fe
--- /dev/null
+++ b/src/components/settings_modal/helpers/color_setting.js
@@ -0,0 +1,17 @@
+import Setting from './setting.js'
+import ColorInput from 'src/components/color_input/color_input.vue'
+
+export default {
+  ...Setting,
+  components: {
+    ...Setting.components,
+    ColorInput
+  },
+  methods: {
+    ...Setting.methods,
+    getValue (e) {
+      console.log(e)
+      return e
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/color_setting.vue b/src/components/settings_modal/helpers/color_setting.vue
new file mode 100644
index 000000000..6813bb2a2
--- /dev/null
+++ b/src/components/settings_modal/helpers/color_setting.vue
@@ -0,0 +1,71 @@
+<template>
+  <label
+    v-if="matchesExpertLevel"
+    class="ColorSetting setting-item"
+  >
+    <label
+      v-if="!hideLabel"
+      :for="path"
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    {{ ' ' }}
+    <ColorInput
+      :id="path"
+      class="setting-control color-setting-input"
+      :class="{ disabled: shouldBeDisabled }"
+      :disabled="shouldBeDisabled"
+      :placeholder="backendDescriptionSuggestions"
+      :model-value="realDraftMode ? draft : state"
+      @update:model-value="update"
+    />
+    {{ ' ' }}
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons v-if="!hideDraftButtons" />
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+  </label>
+</template>
+
+<script src="./color_setting.js"></script>
+<style lang="scss">
+.ColorSetting {
+  &.setting-item {
+    display: grid;
+    grid-template-areas:
+      "label control"
+      ". desc"
+      ". draft";
+
+    .setting-label {
+      text-align: right;
+      align-self: center;
+    }
+
+    .setting-control {
+      align-self: end;
+    }
+  }
+
+  .color-setting-input {
+    align-self: baseline;
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/draft_buttons.vue b/src/components/settings_modal/helpers/draft_buttons.vue
index 46a70e866..b07ea1ec4 100644
--- a/src/components/settings_modal/helpers/draft_buttons.vue
+++ b/src/components/settings_modal/helpers/draft_buttons.vue
@@ -2,6 +2,7 @@
 <!-- TODO make it reusable -->
 <template>
   <span
+    v-if="$parent.isDirty || $parent.canHardReset"
     class="DraftButtons"
   >
     <Popover
@@ -72,12 +73,10 @@ export default {
 
 <style lang="scss">
 .DraftButtons {
-  display: inline-block;
+  display: inline-flex;
   position: relative;
-
-  .button-default {
-    margin-left: 0.5em;
-  }
+  gap: 0.5em;
+  margin-top: 0.5em
 }
 
 .draft-tooltip {
diff --git a/src/components/settings_modal/helpers/emoji_editing_popover.vue b/src/components/settings_modal/helpers/emoji_editing_popover.vue
index f0465dd5d..d25b02da2 100644
--- a/src/components/settings_modal/helpers/emoji_editing_popover.vue
+++ b/src/components/settings_modal/helpers/emoji_editing_popover.vue
@@ -7,7 +7,6 @@
     popover-class="emoji-tab-edit-popover popover-default"
     :bound-to="{ x: 'container' }"
     :offset="{ y: 5 }"
-    :disabled="disabled"
     :class="{'emoji-unsaved': isEdited}"
   >
     <template #trigger>
@@ -30,15 +29,27 @@
 
       <div
         v-if="newUpload"
-        class="emoji-tab-popover-input"
+        class="emoji-tab-popover-new-upload"
       >
-        <input
-          type="file"
-          accept="image/*"
-          class="emoji-tab-popover-file input"
-          @change="uploadFile = $event.target.files"
-        >
+        <h4>{{ $t('admin_dash.emoji.emoji_source') }}</h4>
+
+        <div class="emoji-tab-popover-input">
+          <input
+            type="file"
+            accept="image/*"
+            class="emoji-tab-popover-file input"
+            @change="uploadFile = $event.target.files"
+          >
+        </div>
+        <div class="emoji-tab-popover-input ">
+          <input
+            v-model="uploadURL"
+            :placeholder="$t('admin_dash.emoji.upload_url')"
+            class="emoji-data-input input"
+          >
+        </div>
       </div>
+
       <div>
         <div class="emoji-tab-popover-input">
           <label>
@@ -63,16 +74,50 @@
           </label>
         </div>
 
+        <div
+          v-if="remote !== undefined"
+          class="emoji-tab-popover-input"
+        >
+          <label>
+            {{ $t('admin_dash.emoji.copy_to') }}
+
+            <SelectComponent
+              v-model="copyToPack"
+              class="form-control"
+            >
+              <option
+                value=""
+                disabled
+                hidden
+              >
+                {{ $t('admin_dash.emoji.emoji_pack') }}
+              </option>
+              <option
+                v-for="(pack, listPackName) in knownLocalPacks"
+                :key="listPackName"
+                :label="listPackName"
+              >
+                {{ listPackName }}
+              </option>
+            </SelectComponent>
+          </label>
+        </div>
+
+        <!--
+             For local emojis, disable the button if nothing was edited.
+             For remote emojis, also disable it if a local pack is not selected.
+             Remote emojis are processed by the same function that uploads new ones, as that is effectively what it does
+        -->
         <button
           class="button button-default btn"
           type="button"
-          :disabled="newUpload ? uploadFile.length == 0 : !isEdited"
-          @click="newUpload ? uploadEmoji() : saveEditedEmoji()"
+          :disabled="saveButtonDisabled"
+          @click="(newUpload || remote !== undefined) ? uploadEmoji() : saveEditedEmoji()"
         >
           {{ $t('admin_dash.emoji.save') }}
         </button>
 
-        <template v-if="!newUpload">
+        <template v-if="!newUpload && remote === undefined">
           <button
             class="button button-default btn emoji-tab-popover-button"
             type="button"
@@ -107,21 +152,27 @@
 import Popover from 'components/popover/popover.vue'
 import ConfirmModal from 'components/confirm_modal/confirm_modal.vue'
 import StillImage from 'components/still-image/still-image.vue'
+import SelectComponent from 'components/select/select.vue'
 
 export default {
-  components: { Popover, ConfirmModal, StillImage },
+  components: { Popover, ConfirmModal, StillImage, SelectComponent },
   inject: ['emojiAddr'],
   props: {
-    placement: String,
-    disabled: {
-      type: Boolean,
-      default: false
+    placement: {
+      type: String,
+      required: true
     },
 
     newUpload: Boolean,
 
-    title: String,
-    packName: String,
+    title: {
+      type: String,
+      required: true
+    },
+    packName: {
+      type: String,
+      required: true
+    },
     shortcode: {
       type: String,
       // Only exists when this is not a new upload
@@ -131,21 +182,35 @@ export default {
       type: String,
       // Only exists when this is not a new upload
       default: ''
+    },
+
+    // Only exists for emojis from remote packs
+    remote: {
+      type: Object,
+      default: undefined
+    },
+    knownLocalPacks: {
+      type: Object,
+      default: undefined
     }
   },
   emits: ['updatePackFiles', 'displayError'],
   data () {
     return {
       uploadFile: [],
+      uploadURL: '',
       editedShortcode: this.shortcode,
       editedFile: this.file,
-      deleteModalVisible: false
+      deleteModalVisible: false,
+      copyToPack: ''
     }
   },
   computed: {
     emojiPreview () {
       if (this.newUpload && this.uploadFile.length > 0) {
         return URL.createObjectURL(this.uploadFile[0])
+      } else if (this.newUpload && this.uploadURL !== '') {
+        return this.uploadURL
       } else if (!this.newUpload) {
         return this.emojiAddr(this.file)
       }
@@ -154,6 +219,12 @@ export default {
     },
     isEdited () {
       return !this.newUpload && (this.editedShortcode !== this.shortcode || this.editedFile !== this.file)
+    },
+    saveButtonDisabled() {
+      if (this.remote === undefined)
+        return this.newUpload ? (this.uploadURL === "" && this.uploadFile.length == 0) : !this.isEdited
+      else
+        return this.copyToPack === ""
     }
   },
   methods: {
@@ -172,9 +243,12 @@ export default {
       }).then(resp => this.$emit('updatePackFiles', resp))
     },
     uploadEmoji () {
+      let packName = this.remote === undefined ? this.packName : this.copyToPack
       this.$store.state.api.backendInteractor.addNewEmojiFile({
-        packName: this.packName,
-        file: this.uploadFile[0],
+        packName: packName,
+        file: this.remote === undefined
+            ? (this.uploadURL !== "" ? this.uploadURL : this.uploadFile[0])
+            : this.emojiAddr(this.file),
         shortcode: this.editedShortcode,
         filename: this.editedFile
       }).then(resp => resp.json()).then(resp => {
@@ -183,7 +257,7 @@ export default {
           return
         }
 
-        this.$emit('updatePackFiles', resp)
+        this.$emit('updatePackFiles', resp, packName)
         this.$refs.emojiPopover.hidePopover()
 
         this.editedFile = ''
@@ -206,7 +280,7 @@ export default {
           return
         }
 
-        this.$emit('updatePackFiles', resp)
+        this.$emit('updatePackFiles', resp, this.packName)
       })
     }
   }
@@ -219,9 +293,22 @@ export default {
     padding-right: 0.5em;
     padding-bottom: 0.5em;
 
+    .emoji-tab-popover-new-upload {
+      margin-bottom: 2em;
+    }
+
     .emoji {
-      width: 32px;
-      height: 32px;
+      width: 2.3em;
+      height: 2.3em;
+    }
+
+    .Select {
+      display: inline-block;
+    }
+
+    h4 {
+      margin-bottom: 1em;
+      margin-top: 1em;
     }
   }
 </style>
diff --git a/src/components/settings_modal/helpers/group_setting.js b/src/components/settings_modal/helpers/group_setting.js
index 23a2a2025..327654ff1 100644
--- a/src/components/settings_modal/helpers/group_setting.js
+++ b/src/components/settings_modal/helpers/group_setting.js
@@ -1,13 +1,5 @@
-import { isEqual } from 'lodash'
-
 import Setting from './setting.js'
 
 export default {
   ...Setting,
-  computed: {
-    ...Setting.computed,
-    isDirty () {
-      return !isEqual(this.state, this.draft)
-    }
-  }
 }
diff --git a/src/components/settings_modal/helpers/group_setting.vue b/src/components/settings_modal/helpers/group_setting.vue
index a4df4bf35..68e571f7d 100644
--- a/src/components/settings_modal/helpers/group_setting.vue
+++ b/src/components/settings_modal/helpers/group_setting.vue
@@ -1,7 +1,7 @@
 <template>
   <span
     v-if="matchesExpertLevel"
-    class="GroupSetting"
+    class="GroupSetting setting-item"
   >
     <ModifiedIndicator
       :changed="isChanged"
diff --git a/src/components/settings_modal/helpers/help_indicator.vue b/src/components/settings_modal/helpers/help_indicator.vue
new file mode 100644
index 000000000..c48f97b70
--- /dev/null
+++ b/src/components/settings_modal/helpers/help_indicator.vue
@@ -0,0 +1,46 @@
+<template>
+  <span class="HelpIndicator">
+    <Popover
+      trigger="click"
+      :trigger-attrs="{ 'aria-label': $t('settings.setting_changed') }"
+    >
+      <template #trigger>
+        &nbsp;
+        <FAIcon icon="circle-question" />
+      </template>
+      <template #content>
+        <div class="help-tooltip">
+          <slot />
+        </div>
+      </template>
+    </Popover>
+  </span>
+</template>
+
+<script>
+import Popover from 'src/components/popover/popover.vue'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import { faCircleQuestion } from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faCircleQuestion
+)
+
+export default {
+  components: { Popover }
+}
+</script>
+
+<style lang="scss">
+.HelpIndicator {
+  display: inline-block;
+  position: relative;
+}
+
+.help-tooltip {
+  margin: 0.5em 1em;
+  min-width: 10em;
+  max-width: 30vw;
+  text-align: center;
+}
+</style>
diff --git a/src/components/settings_modal/helpers/integer_setting.vue b/src/components/settings_modal/helpers/integer_setting.vue
index 43fa7e1a9..8206c0c45 100644
--- a/src/components/settings_modal/helpers/integer_setting.vue
+++ b/src/components/settings_modal/helpers/integer_setting.vue
@@ -1,7 +1,7 @@
 <template>
   <NumberSetting
     v-bind="$attrs"
-    truncate="1"
+    :truncate="1"
   >
     <slot />
   </NumberSetting>
diff --git a/src/components/settings_modal/helpers/list_setting.js b/src/components/settings_modal/helpers/list_setting.js
new file mode 100644
index 000000000..def6064d0
--- /dev/null
+++ b/src/components/settings_modal/helpers/list_setting.js
@@ -0,0 +1,133 @@
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import Setting from './setting.js'
+
+export default {
+  ...Setting,
+  data () {
+    return {
+      newValue: '',
+    }
+  },
+  components: {
+    ...Setting.components,
+    Checkbox
+  },
+  props: {
+    ...Setting.props,
+    ignoreSuggestions: {
+      required: false,
+      type: Boolean
+    },
+    overrideAvailableOptions: {
+      required: false,
+      type: Boolean
+    },
+    options: {
+      required: false,
+      type: Set
+    },
+    allowNew: {
+      required: false,
+      type: Boolean,
+      default: true
+    },
+    forceNew: {
+      required: false,
+      type: Boolean,
+      default: false
+    }
+  },
+  computed: {
+    ...Setting.computed,
+    showNew () {
+      if (this.forceNew) return true
+      if (!this.allowNew) return false
+
+      const isExpert = this.$store.state.config.expertLevel > 0
+      const hasBuiltins = this.builtinEntries.length > 0
+
+      if (hasBuiltins) {
+        return isExpert
+      } else {
+        return true
+      }
+    },
+    valueSet () {
+      return new Set(this.visibleState)
+    },
+    suggestionsSet () {
+      const suggestions = this.backendDescriptionSuggestions
+      if (suggestions) {
+        return new Set(suggestions)
+      } else {
+        return new Set()
+      }
+    },
+    extraEntries () {
+      if (this.ignoreSuggestions) return [...this.valueSet.values()]
+      if (!this.suggestionsSet) return []
+      return [...this.valueSet.values()].filter((x) => {
+        return !this.builtinEntriesValueSet.has(x)
+      })
+    },
+    builtinEntries () {
+      if (this.ignoreSuggestions) return []
+      if (this.overrideAvailableOptions) {
+        return [...this.options]
+      }
+      if (!this.suggestionsSet) return []
+
+      const builtins = [...this.suggestionsSet.values()]
+      return builtins.map((option) => ({
+        label: option,
+        value: option
+      }))
+    },
+    builtinEntriesValueSet () {
+      return new Set(this.builtinEntries.map(x => x.value))
+    }
+  },
+  methods: {
+    ...Setting.methods,
+    optionPresent (option) {
+      return this.valueSet.has(option)
+    },
+    getValue ({ event, value, index, eventType }) {
+      switch (eventType) {
+        case 'toggle': {
+          this.newValue = ''
+          const newSet = new Set(this.valueSet.values())
+          if (event) {
+            newSet.add(value)
+          } else {
+            newSet.delete(value)
+          }
+          return [...newSet.values()]
+        }
+
+        case 'add': {
+          if (!this.newValue) return this.valueSet.values()
+          const res = [...this.valueSet.values(), this.newValue]
+          this.newValue = ''
+          return res
+        }
+
+        case 'remove': {
+          const pre = [...this.valueSet.values()].slice(0, index)
+          const post = [...this.valueSet.values()].slice(index + 1)
+
+          return [...pre, ...post]
+        }
+
+        case 'edit': {
+          const pre = [...this.valueSet.values()].slice(0, index)
+          const post = [...this.valueSet.values()].slice(index + 1)
+          const string = event.target.value
+          if (!string) return [...this.valueSet.values()]
+
+          return [...pre, string, ...post]
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/list_setting.vue b/src/components/settings_modal/helpers/list_setting.vue
new file mode 100644
index 000000000..1dacba410
--- /dev/null
+++ b/src/components/settings_modal/helpers/list_setting.vue
@@ -0,0 +1,92 @@
+<template>
+  <div
+    v-if="matchesExpertLevel"
+    class="ListSetting setting-item"
+  >
+    <label
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+    <ul class="setting-list">
+      <li
+        v-for="(item, i) in builtinEntries"
+        :key="i"
+      >
+        <Checkbox
+          :disabled="shouldBeDisabled"
+          :model-value="optionPresent(item.value)"
+          @update:model-value="event => update({ event, value: item.value, eventType: 'toggle' })"
+        >
+          {{ item.label }}
+        </Checkbox>
+      </li>
+      <li
+        v-for="(item, index) in extraEntries"
+        :key="index"
+      >
+        <div class="btn-group">
+          <input
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :value="item"
+            @change="e => update({ event: e, index, eventType: 'edit' })"
+          >
+          <button
+            class="button-default"
+            @click="e => update({ index, eventType: 'remove' })"
+          >
+            <FAIcon icon="times" />
+          </button>
+        </div>
+      </li>
+      <li v-if="showNew">
+        <div class="btn-group">
+          <input
+            v-model="newValue"
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :disabled="shouldBeDisabled"
+          >
+          <button
+            class="button-default"
+            @click="e => update({ eventType: 'add' })"
+          >
+            <FAIcon icon="plus" />
+          </button>
+        </div>
+      </li>
+    </ul>
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons />
+  </div>
+</template>
+
+<script src="./list_setting.js"></script>
+<style lang="scss">
+.ListSetting {
+  .setting-list {
+    .checkbox {
+      padding: 0.5em 0;
+    }
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/list_tuple_setting.js b/src/components/settings_modal/helpers/list_tuple_setting.js
new file mode 100644
index 000000000..2cbd93788
--- /dev/null
+++ b/src/components/settings_modal/helpers/list_tuple_setting.js
@@ -0,0 +1,44 @@
+import ListSetting from './list_setting.js'
+
+export default {
+  ...ListSetting,
+  data () {
+    return {
+      newValue: ['','']
+    }
+  },
+  methods: {
+    ...ListSetting.methods,
+    getValue ({ event, index, eventType, tuple }) {
+      switch (eventType) {
+        case 'add': {
+          if (!this.newValue[0] || !this.newValue[1]) return this.visibleState
+          const res = [...this.visibleState, this.newValue]
+          this.newValue = ['', '']
+          return res
+        }
+
+        case 'remove': {
+          const pre = this.visibleState.slice(0, index)
+          const post = this.visibleState.slice(index + 1)
+
+          return [...pre, ...post]
+        }
+
+        case 'edit': {
+          const pre = this.visibleState.slice(0, index)
+          const post = this.visibleState.slice(index + 1)
+          const item = this.visibleState[index]
+          const string = event.target.value
+          if (!string) return this.visibleState
+
+          if (tuple === 0) {
+            return [...pre, [string, item[1]], ...post]
+          } else {
+            return [...pre, [item[0], string], ...post]
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/list_tuple_setting.vue b/src/components/settings_modal/helpers/list_tuple_setting.vue
new file mode 100644
index 000000000..eb2f6e16e
--- /dev/null
+++ b/src/components/settings_modal/helpers/list_tuple_setting.vue
@@ -0,0 +1,113 @@
+<template>
+  <div
+    v-if="matchesExpertLevel"
+    class="ListTupleSetting"
+  >
+    <label
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+    <ul class="setting-list">
+      <li
+        v-for="(item, index) in visibleState"
+        :key="index"
+      >
+        <div class="btn-group">
+          <input
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :value="item.tuple[0]"
+            @change="e => update({ event: e, index, eventType: 'edit', tuple: 0 })"
+          >
+          <input
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :value="item.tuple[1]"
+            @change="e => update({ event: e, index, eventType: 'edit', tuple: 1 })"
+          >
+          <button
+            class="button-default"
+            @click="e => update({ index, eventType: 'remove' })"
+          >
+            <FAIcon icon="times" />
+          </button>
+        </div>
+      </li>
+      <li>
+        <div class="btn-group">
+          <input
+            v-model="newValue[0]"
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :disabled="shouldBeDisabled"
+            :placeholder="backendDescriptionSuggestions[0][0]"
+          >
+          <input
+            v-model="newValue[1]"
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :disabled="shouldBeDisabled"
+            :placeholder="backendDescriptionSuggestions[0][1]"
+          >
+          <button
+            class="button-default"
+            @click="e => update({ eventType: 'add' })"
+          >
+            <FAIcon icon="plus" />
+          </button>
+        </div>
+      </li>
+    </ul>
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons />
+  </div>
+</template>
+
+<script src="./list_tuple_setting.js"></script>
+<style lang="scss">
+.ListTupleSetting {
+  .btn-group {
+    display: flex
+  }
+
+  dl {
+    display: inline-grid;
+    grid-template-columns: auto auto;
+    gap: 0.5em;
+    align-items: baseline;
+
+    dt {
+      display: inline;
+      font-weight: 800;
+
+      &::after {
+        content: ':'
+      }
+    }
+
+    dd {
+      display: inline;
+      margin: 0
+    }
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/map_setting.js b/src/components/settings_modal/helpers/map_setting.js
new file mode 100644
index 000000000..ad93ceacf
--- /dev/null
+++ b/src/components/settings_modal/helpers/map_setting.js
@@ -0,0 +1,70 @@
+import Setting from './setting.js'
+
+export default {
+  ...Setting,
+  props: {
+    ...Setting.props,
+    allowNew: {
+      required: false,
+      type: Boolean,
+      default: true
+    }
+  },
+  data () {
+    return {
+      newValue: ['',''] // avoiding extra complexity by just using an array instead of an object
+    }
+  },
+  computed: {
+    ...Setting.computed,
+    // state that we'll show in the UI, i.e. transforming map into list
+    displayState () {
+      return Object.entries(this.visibleState)
+    }
+  },
+  methods: {
+    ...Setting.methods,
+    getValue ({ event, key, eventType, isKey }) {
+      switch (eventType) {
+        case 'add': {
+          if (key === '') return this.visibleState
+          const res = {...this.visibleState, ...Object.fromEntries([this.newValue])}
+          this.newValue = ['', '']
+          return res
+        }
+
+        case 'remove': {
+          // initial state for this type is empty array
+          if (Array.isArray(this.visibleState)) return this.visibleState
+          const newEntries = Object.entries(this.visibleState).filter(([k]) => k !== key)
+
+          if (newEntries.length === 0 ) return []
+          return Object.fromEntries(newEntries)
+        }
+
+        case 'edit': {
+          const string = event.target.value
+          const newEntries = Object
+            .entries(this.visibleState)
+            .map(([k, v]) => {
+              if (isKey) {
+                if (k === key) {
+                  return [string, v]
+                } else {
+                  return [k, v]
+                }
+              } else {
+                if (k === key) {
+                  return [k, string]
+                } else {
+                  return [k, v]
+                }
+              }
+            })
+
+          return Object.fromEntries(newEntries)
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/map_setting.vue b/src/components/settings_modal/helpers/map_setting.vue
new file mode 100644
index 000000000..95adcb314
--- /dev/null
+++ b/src/components/settings_modal/helpers/map_setting.vue
@@ -0,0 +1,112 @@
+<template>
+  <div
+    v-if="matchesExpertLevel"
+    class="MapSetting setting-item"
+  >
+    <label
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+    <ul class="setting-list">
+      <li
+        v-for="(item, i) in displayState"
+        :key="i"
+      >
+        <div class="btn-group">
+          <input
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :value="item[0]"
+            @change="e => update({ event: e, key: item[0], eventType: 'edit', isKey: true })"
+          >
+          <input
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :value="item[1]"
+            @change="e => update({ event: e, key: item[0], eventType: 'edit', isKey: false })"
+          >
+          <button
+            class="button-default"
+            @click="e => update({ key: item[0], eventType: 'remove' })"
+          >
+            <FAIcon icon="times" />
+          </button>
+        </div>
+      </li>
+      <li v-if="allowNew">
+        <div class="btn-group">
+          <input
+            v-model="newValue[0]"
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :disabled="shouldBeDisabled"
+            :placeholder="backendDescriptionSuggestions[0][0]"
+          >
+          <input
+            v-model="newValue[1]"
+            class="input string-input"
+            :class="{ disabled: shouldBeDisabled }"
+            :disabled="shouldBeDisabled"
+            :placeholder="backendDescriptionSuggestions[0][1]"
+          >
+          <button
+            class="button-default"
+            @click="e => update({ eventType: 'add' })"
+          >
+            <FAIcon icon="plus" />
+          </button>
+        </div>
+      </li>
+    </ul>
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons />
+  </div>
+</template>
+
+<script src="./map_setting.js"></script>
+<style lang="scss">
+.MapSetting {
+  .btn-group {
+    display: flex
+  }
+
+  dl {
+    display: inline-grid;
+    grid-template-columns: auto auto;
+    gap: 0.5em;
+
+    dt {
+      display: inline;
+      font-weight: 800;
+
+      &::after {
+        content: ':'
+      }
+    }
+
+    dd {
+      display: inline;
+      margin: 0
+    }
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/number_setting.js b/src/components/settings_modal/helpers/number_setting.js
index 676a0d227..afbf5ed58 100644
--- a/src/components/settings_modal/helpers/number_setting.js
+++ b/src/components/settings_modal/helpers/number_setting.js
@@ -4,6 +4,21 @@ export default {
   ...Setting,
   props: {
     ...Setting.props,
+    min: {
+      type: Number,
+      required: false,
+      default: 1
+    },
+    max: {
+      type: Number,
+      required: false,
+      default: 1
+    },
+    step: {
+      type: Number,
+      required: false,
+      default: 1
+    },
     truncate: {
       type: Number,
       required: false,
diff --git a/src/components/settings_modal/helpers/number_setting.vue b/src/components/settings_modal/helpers/number_setting.vue
index 32dc6f83f..26c18f928 100644
--- a/src/components/settings_modal/helpers/number_setting.vue
+++ b/src/components/settings_modal/helpers/number_setting.vue
@@ -1,10 +1,12 @@
 <template>
   <span
     v-if="matchesExpertLevel"
-    class="NumberSetting"
+    class="NumberSetting setting-item"
   >
     <label
+      v-if="!hideLabel"
       :for="path"
+      class="setting-label"
       :class="{ 'faint': shouldBeDisabled }"
     >
       <template v-if="backendDescriptionLabel">
@@ -18,10 +20,11 @@
     {{ ' ' }}
     <input
       :id="path"
-      class="input number-input"
+      class="input number-input setting-control"
       type="number"
       :step="step || 1"
       :disabled="shouldBeDisabled"
+      :placeholder="backendDescriptionSuggestions"
       :min="min || 0"
       :value="realDraftMode ? draft :state"
       @change="update"
@@ -32,7 +35,7 @@
       :onclick="reset"
     />
     <ProfileSettingIndicator :is-profile="isProfileSetting" />
-    <DraftButtons />
+    <DraftButtons v-if="!hideDraftButtons" />
     <p
       v-if="backendDescriptionDescription"
       class="setting-description"
diff --git a/src/components/settings_modal/helpers/proxy_setting.js b/src/components/settings_modal/helpers/proxy_setting.js
new file mode 100644
index 000000000..ca717b60b
--- /dev/null
+++ b/src/components/settings_modal/helpers/proxy_setting.js
@@ -0,0 +1,53 @@
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import Setting from './setting.js'
+
+const getUrl = state => state?.tuple ? state.tuple[1] + ':' + state.tuple[2] : state
+const getSocks = state => state?.tuple
+
+export default {
+  ...Setting,
+  data () {
+    return {
+      urlField: '',
+      socksField: false
+    }
+  },
+  created () {
+    Setting.created()
+    this.urlField = getUrl(this.realDraftMode ? this.draft : this.state)
+    this.socksField = getSocks(this.realDraftMode ? this.draft : this.state)
+  },
+  computed: {
+    ...Setting.computed,
+    // state that we'll show in the UI, i.e. transforming map into list
+    displayState () {
+      if (this.visibleState?.tuple) {
+        return this.visibleState.tuple[1] + ':' + this.visibleState.tuple[2]
+      }
+      return this.visibleState
+    },
+    socksState () {
+      return getSocks(this.visibleState)
+    }
+  },
+  components: {
+    ...Setting.components,
+    Checkbox
+  },
+  methods: {
+    ...Setting.methods,
+    getValue ({ event, isProxy}) {
+      if (isProxy) {
+        this.socksField = event
+      } else {
+        this.urlField = event.target.value
+      }
+
+      if (this.socksField) {
+        return { tuple: [ ':socks5', ...this.urlField.split(':') ] }
+      } else {
+        return this.urlField
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/proxy_setting.vue b/src/components/settings_modal/helpers/proxy_setting.vue
new file mode 100644
index 000000000..869cbcdcc
--- /dev/null
+++ b/src/components/settings_modal/helpers/proxy_setting.vue
@@ -0,0 +1,59 @@
+<template>
+  <label
+    v-if="matchesExpertLevel"
+    class="ProxySetting setting-item"
+  >
+    <label
+      v-if="!hideLabel"
+      :for="path"
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    {{ ' ' }}
+    <div class="setting-control">
+      <input
+        :id="path"
+        class="input string-input"
+        :class="{ disabled: shouldBeDisabled }"
+        :disabled="shouldBeDisabled"
+        :placeholder="backendDescriptionSuggestions[0]"
+        :value="displayState"
+        @change="event => update({ event })"
+      >
+      {{ ' ' }}
+      <Checkbox
+        :model-value="socksState"
+        :disabled="shouldBeDisabled"
+        :indeterminate="isIndeterminate"
+        @update:model-value="event => update({ event, isProxy: true})"
+      >
+        SOCKS5
+        {{ ' ' }}
+      </Checkbox>
+    </div>
+    {{ ' ' }}
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons v-if="!hideDraftButtons" />
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+  </label>
+</template>
+
+<script src="./proxy_setting.js"></script>
diff --git a/src/components/settings_modal/helpers/pwa_manifest_icons_setting.js b/src/components/settings_modal/helpers/pwa_manifest_icons_setting.js
new file mode 100644
index 000000000..9986f6f39
--- /dev/null
+++ b/src/components/settings_modal/helpers/pwa_manifest_icons_setting.js
@@ -0,0 +1,99 @@
+import { clone } from 'lodash'
+import { fileTypeExt } from 'src/services/file_type/file_type.service.js'
+
+import Setting from './setting.js'
+import Select from 'src/components/select/select.vue'
+import Attachment from 'src/components/attachment/attachment.vue'
+import MediaUpload from 'src/components/media_upload/media_upload.vue'
+
+export default {
+  ...Setting,
+  components: {
+    ...Setting.components,
+    Select,
+    Attachment,
+    MediaUpload
+  },
+  computed: {
+    ...Setting.computed,
+    purposeOptions () {
+      return ['any','monochrome','maskable'].map(value => ({
+        value,
+        key: value,
+        label: this.$t('admin_dash.instance.pwa.icon.' + value)
+      }))
+    }
+  },
+  methods: {
+    ...Setting.methods,
+    attachment (e) {
+      const path = e[':src']
+      if (!path) {
+        return {
+          mimetype: '',
+          url: ''
+        }
+      }
+      const url = path.includes('://') ? path : this.$store.state.instance.server + path
+
+      return {
+        mimetype: fileTypeExt(url),
+        url
+      }
+    },
+    setMediaFile ({ event, index }) {
+      this.update({
+        event: {
+          target: {
+            value: event.url
+          },
+        },
+        index,
+        eventType: 'edit',
+        field: ':src'
+      })
+    },
+    setPurpose ({ event, index }) {
+      this.update({
+        event: {
+          target: {
+            value: event
+          },
+        },
+        index,
+        eventType: 'edit',
+        field: ':purpose'
+      })
+    },
+    getValue ({ event, field, index, eventType }) {
+      switch (eventType) {
+        case 'add': {
+          const res = [...this.visibleState, {}]
+          return res
+        }
+
+        case 'remove': {
+          const pre = this.visibleState.slice(0, index)
+          const post = this.visibleState.slice(index + 1)
+
+          return [...pre, ...post]
+        }
+
+        case 'edit': {
+          const pre = this.visibleState.slice(0, index)
+          const post = this.visibleState.slice(index + 1)
+          const item = clone(this.visibleState[index])
+          const string = event.target.value
+
+          if (!string)  {
+            delete item[field]
+          } else {
+            item[field] = string
+          }
+
+          return [...pre, item, ...post]
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/pwa_manifest_icons_setting.vue b/src/components/settings_modal/helpers/pwa_manifest_icons_setting.vue
new file mode 100644
index 000000000..20e50fe25
--- /dev/null
+++ b/src/components/settings_modal/helpers/pwa_manifest_icons_setting.vue
@@ -0,0 +1,226 @@
+<template>
+  <div
+    v-if="matchesExpertLevel"
+    class="PWAManifestIconsSetting setting-item"
+  >
+    <label
+      class="pwa-label setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <ModifiedIndicator
+        :changed="isChanged"
+        :onclick="reset"
+      />
+      <ProfileSettingIndicator :is-profile="isProfileSetting" />
+      {{ ' ' }}
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+    <div class="setting-control">
+      <ul class="item-list">
+        <li
+          v-if="visibleState.length === 0"
+          class="no_items"
+        >
+          {{ $t('admin_dash.instance.pwa.no_icons') }}
+          <button
+            v-if="visibleState.length === 0"
+            class="button-default add-button"
+            @click="e => update({ eventType: 'add' })"
+          >
+            <FAIcon icon="plus" />
+          </button>
+        </li>
+        <li
+          v-for="(item, index) in visibleState"
+          :key="index"
+        >
+          <div class="icon-element">
+            <div class="src-field">
+              <Attachment
+                class="src-attachment"
+                :compact="compact"
+                :attachment="attachment(item)"
+                size="small"
+                hide-description
+              />
+              <div class="src-url">
+                <label for="path">{{ $t('settings.url') }}</label>
+                <input
+                  :id="path"
+                  class="input string-input"
+                  :disabled="shouldBeDisabled"
+                  :value="item[':src']"
+                  @change="event => update({ event, index, eventType: 'edit', field: ':src' })"
+                >
+              </div>
+              <MediaUpload
+                ref="mediaUpload"
+                class="src-upload media-upload-icon"
+                :class="{ disabled: shouldBeDisabled }"
+                normal-button
+                :accept-types="acceptTypes"
+                @uploaded="event => setMediaFile({ event, index })"
+              />
+            </div>
+            <dl>
+              <dt>{{ $t('admin_dash.instance.pwa.icon.purpose') }}</dt>
+              <dd>
+                <Select
+                  :class="{ disabled: shouldBeDisabled }"
+                  :disabled="shouldBeDisabled"
+                  :model-value="item[':purpose']"
+                  @update:model-value="event => setPurpose({ event, index })"
+                >
+                  <option
+                    v-for="(purpose, index) in purposeOptions"
+                    :key="index"
+                    :value="purpose.value"
+                  >
+                    {{ purpose.label }}
+                  </option>
+                </Select>
+              </dd>
+              <dt><code>sizes</code>{{ $t('admin_dash.instance.pwa.optional') }}</dt>
+              <dd>
+                <input
+                  class="input string-input"
+                  :class="{ disabled: shouldBeDisabled }"
+                  :value="item[':sizes']"
+                  @change="e => update({ event: e, index, eventType: 'edit', field: ':sizes' })"
+                >
+              </dd>
+              <dt><code>type</code>{{ $t('admin_dash.instance.pwa.optional') }}</dt>
+              <dd>
+                <input
+                  class="input string-input"
+                  :class="{ disabled: shouldBeDisabled }"
+                  :value="item[':type']"
+                  @change="e => update({ event: e, index, eventType: 'edit', field: ':type' })"
+                >
+              </dd>
+            </dl>
+            <div class="buttons">
+              <button
+                v-if="index === visibleState.length - 1"
+                class="button-default add-button"
+                @click="e => update({ eventType: 'add' })"
+              >
+                <FAIcon icon="plus" />
+              </button>
+              <button
+                class="button-default delete-button"
+                @click="e => update({ index, eventType: 'remove' })"
+              >
+                <FAIcon icon="times" />
+              </button>
+            </div>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./pwa_manifest_icons_setting.js"></script>
+<style lang="scss">
+div.PWAManifestIconsSetting {
+  margin-left: 3em;
+
+  &.setting-item {
+    display: grid;
+    grid-template-areas:
+      "label"
+      "desc"
+      "control"
+      "draft";
+    grid-template-rows: 2em auto 1fr;
+    grid-template-columns: 1fr;
+  }
+
+  .pwa-label.setting-label {
+    align-self: end;
+    text-align: left;
+  }
+
+  .buttons {
+    display: flex;
+    gap: 0.5em;
+    justify-content: right;
+    margin-top: 0.5em;
+
+    button {
+      line-height: 2;
+    }
+  }
+
+  ul {
+    list-style: none;
+    display: grid;
+    grid-template-columns: repeat(auto-fit, 12em);
+    grid-gap: 2em;
+  }
+
+  dl {
+    display: grid;
+    grid-template-columns: 1fr;
+    margin-top: 0.5em;
+    gap: 0.25em;
+    align-items: baseline;
+
+    dt {
+      font-weight: 800;
+
+      &::after {
+        content: ':'
+      }
+    }
+
+    dd {
+      margin: 0
+    }
+  }
+
+  .src-field {
+    display: grid;
+    grid-template-columns: auto;
+    justify-items: center;
+    gap: 0.5em;
+
+    .src-attachment {
+      width: 10em;
+      height: 10em;
+      display: block;
+      margin-bottom: 0.5em;
+    }
+
+    .src-upload {
+      display: block;
+      width: 100%;
+    }
+
+    .src-url {
+      display: flex;
+      flex-direction: column;
+      gap: 0.25em;
+      width: 100%;
+
+      label {
+        display: block;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/rate_setting.js b/src/components/settings_modal/helpers/rate_setting.js
new file mode 100644
index 000000000..7425cdba3
--- /dev/null
+++ b/src/components/settings_modal/helpers/rate_setting.js
@@ -0,0 +1,53 @@
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import Setting from './setting.js'
+
+export default {
+  ...Setting,
+  data () {
+    return {
+      newValue: '',
+    }
+  },
+  components: {
+    ...Setting.components,
+    Checkbox
+  },
+  props: {
+    ...Setting.props
+  },
+  computed: {
+    ...Setting.computed,
+    isSeparate () {
+      // [[a1, b1], [a2, b2]] vs [a, b]
+      return Array.isArray(this.visibleState[0])
+    },
+    normalizedState () {
+      if (this.isSeparate) {
+        return this.visibleState.map(y => y.map(x => Number(x) || 0))
+      } else {
+        return [this.visibleState.map(x => Number(x) || 0)]
+      }
+    }
+  },
+  methods: {
+    ...Setting.methods,
+    getValue ({ event, side, index, eventType }) {
+      if (eventType === 'edit') {
+        const value = Number(event.target.value)
+        if (Number.isNaN(value)) return this.visibleState
+
+        const newVal = [...this.normalizedState.map(x => [...x])]
+        newVal[side][index] = value
+        return newVal
+      }
+
+      if (eventType === 'toggleMode') {
+        if (event === 'split') {
+          return [this.normalizedState[0], this.normalizedState[0]]
+        } else if (event === 'join') {
+          return [this.normalizedState[0]]
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/rate_setting.vue b/src/components/settings_modal/helpers/rate_setting.vue
new file mode 100644
index 000000000..f6216223c
--- /dev/null
+++ b/src/components/settings_modal/helpers/rate_setting.vue
@@ -0,0 +1,139 @@
+<template>
+  <div
+    v-if="matchesExpertLevel"
+    class="RateSetting setting-item"
+  >
+    <label
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <ModifiedIndicator
+        :changed="isChanged"
+        :onclick="reset"
+      />
+      <ProfileSettingIndicator :is-profile="isProfileSetting" />
+      {{ ' ' }}
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+    <div class="setting-control">
+      <table>
+        <tr>
+          <th>&nbsp;</th>
+          <th>
+            {{ $t('admin_dash.rate_limit.period') }}
+          </th>
+          <th>
+            {{ $t('admin_dash.rate_limit.amount') }}
+          </th>
+        </tr>
+        <tr>
+          <td v-if="isSeparate">
+            {{ $t('admin_dash.rate_limit.unauthenticated') }}
+          </td>
+          <td v-else>
+            {{ $t('admin_dash.rate_limit.rate_limit') }}
+          </td>
+          <td>
+            <input
+              class="input string-input"
+              type="number"
+              :value="normalizedState[0][0]"
+              @change="e => update({ event: e, index: 0, side: 0, eventType: 'edit' })"
+            >
+          </td>
+          <td>
+            <input
+              class="input string-input"
+              type="number"
+              :value="normalizedState[0][1]"
+              @change="e => update({ event: e, index: 1, side: 0, eventType: 'edit' })"
+            >
+          </td>
+        </tr>
+        <tr v-if="isSeparate">
+          <td>
+            {{ $t('admin_dash.rate_limit.authenticated') }}
+          </td>
+          <td>
+            <input
+              class="input string-input"
+              type="number"
+              :value="normalizedState[1][0]"
+              @change="e => update({ event: e, index: 0, side: 1, eventType: 'edit' })"
+            >
+          </td>
+          <td>
+            <input
+              class="input string-input"
+              type="number"
+              :value="normalizedState[1][1]"
+              @change="e => update({ event: e, index: 1, side: 1, eventType: 'edit' })"
+            >
+          </td>
+        </tr>
+      </table>
+      <Checkbox
+        :model-value="isSeparate"
+        @update:model-value="event => update({ event: event ? 'join' : 'split', eventType: 'toggleMode' })"
+      >
+        {{ $t('admin_dash.rate_limit.separate') }}
+      </Checkbox>
+    </div>
+    <DraftButtons />
+  </div>
+</template>
+
+<script src="./rate_setting.js"></script>
+<style lang="scss">
+.RateSetting {
+  &.setting-item {
+    display: grid;
+    grid-template-areas:
+      "label control"
+      "desc control"
+      ". draft";
+
+    .setting-label {
+      text-align: right;
+      align-self: center;
+    }
+
+    .setting-description {
+      text-align: right;
+    }
+
+    .setting-control {
+      align-self: end;
+    }
+  }
+
+  table {
+    margin-top: 0.5em;
+  }
+
+  th {
+    font-weight: normal;
+  }
+
+  td {
+    input {
+      width: 15ch;
+    }
+  }
+
+  margin-bottom: 2em;
+}
+</style>
diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js
index 3b3e6268d..cf68eaa14 100644
--- a/src/components/settings_modal/helpers/setting.js
+++ b/src/components/settings_modal/helpers/setting.js
@@ -1,7 +1,7 @@
 import ModifiedIndicator from './modified_indicator.vue'
 import ProfileSettingIndicator from './profile_setting_indicator.vue'
 import DraftButtons from './draft_buttons.vue'
-import { get, set, cloneDeep } from 'lodash'
+import { get, set, cloneDeep, isEqual } from 'lodash'
 
 export default {
   components: {
@@ -10,9 +10,29 @@ export default {
     ProfileSettingIndicator
   },
   props: {
+    modelValue: {
+      type: String,
+      default: null
+    },
     path: {
       type: [String, Array],
-      required: true
+      required: false
+    },
+    showDescription: {
+      type: Boolean,
+      required: false
+    },
+    descriptionPathOverride: {
+      type: [String, Array],
+      required: false
+    },
+    suggestions: {
+      type: [String, Array],
+      required: false
+    },
+    subgroup: {
+      type: String,
+      required: false
     },
     disabled: {
       type: Boolean,
@@ -33,17 +53,27 @@ export default {
       type: String,
       default: undefined
     },
+    hideDraftButtons: { // this is for the weird backend hybrid (Boolean|String or Boolean|Number) settings
+      required: false,
+      type: Boolean
+    },
+    hideLabel: {
+      type: Boolean
+    },
     hideDescription: {
       type: Boolean
     },
     swapDescriptionAndLabel: {
       type: Boolean
     },
+    backendDescriptionPath: {
+      type: [String, Array]
+    },
     overrideBackendDescription: {
       type: Boolean
     },
     overrideBackendDescriptionLabel: {
-      type: Boolean
+      type: [Boolean, String]
     },
     draftMode: {
       type: Boolean,
@@ -68,22 +98,21 @@ export default {
     }
   },
   created () {
-    if (this.realDraftMode && this.realSource !== 'admin') {
-      this.draft = this.state
+    if (this.realDraftMode && (this.realSource !== 'admin' || this.path == null)) {
+      this.draft = cloneDeep(this.state)
     }
   },
   computed: {
     draft: {
-      // TODO allow passing shared draft object?
       get () {
-        if (this.realSource === 'admin') {
+        if (this.realSource === 'admin' || this.path == null) {
           return get(this.$store.state.adminSettings.draft, this.canonPath)
         } else {
           return this.localDraft
         }
       },
       set (value) {
-        if (this.realSource === 'admin') {
+        if (this.realSource === 'admin' || this.path == null) {
           this.$store.commit('updateAdminDraft', { path: this.canonPath, value })
         } else {
           this.localDraft = value
@@ -91,6 +120,9 @@ export default {
       }
     },
     state () {
+      if (this.path == null) {
+        return this.modelValue
+      }
       const value = get(this.configSource, this.canonPath)
       if (value === undefined) {
         return this.defaultState
@@ -108,10 +140,13 @@ export default {
       return typeof this.draftMode === 'undefined' ? this.defaultDraftMode : this.draftMode
     },
     backendDescription () {
-      return get(this.$store.state.adminSettings.descriptions, this.path)
+      return get(this.$store.state.adminSettings.descriptions, this.descriptionPath)
     },
     backendDescriptionLabel () {
       if (this.realSource !== 'admin') return ''
+      if (this.overrideBackendDescriptionLabel !== '' && typeof this.overrideBackendDescriptionLabel === 'string') {
+        return this.overrideBackendDescriptionLabel
+      }
       if (!this.backendDescription || this.overrideBackendDescriptionLabel) {
         return this.$t([
           'admin_dash',
@@ -126,6 +161,7 @@ export default {
       }
     },
     backendDescriptionDescription () {
+      if (this.description) return this.description
       if (this.realSource !== 'admin') return ''
       if (this.hideDescription) return null
       if (!this.backendDescription || this.overrideBackendDescription) {
@@ -142,10 +178,20 @@ export default {
       }
     },
     backendDescriptionSuggestions () {
-      return this.backendDescription?.suggestions
+      return this.backendDescription?.suggestions || this.suggestions
     },
     shouldBeDisabled () {
-      const parentValue = this.parentPath !== undefined ? get(this.configSource, this.parentPath) : null
+      if (this.path == null) {
+        return this.disabled
+      }
+      let parentValue = null
+      if (this.parentPath !== undefined && this.realSource === 'admin') {
+        if (this.realDraftMode) {
+          parentValue = get(this.$store.state.adminSettings.draft, this.parentPath)
+        } else {
+          parentValue = get(this.configSource, this.parentPath)
+        }
+      }
       return this.disabled || (parentValue !== null ? (this.parentInvert ? parentValue : !parentValue) : false)
     },
     configSource () {
@@ -159,6 +205,9 @@ export default {
       }
     },
     configSink () {
+      if (this.path == null) {
+        return (k, v) => this.$emit('update:modelValue', v)
+      }
       switch (this.realSource) {
         case 'profile':
           return (k, v) => this.$store.dispatch('setProfileOption', { name: k, value: v })
@@ -184,6 +233,7 @@ export default {
       return this.realSource === 'profile'
     },
     isChanged () {
+      if (this.path == null) return false
       switch (this.realSource) {
         case 'profile':
         case 'admin':
@@ -193,18 +243,32 @@ export default {
       }
     },
     canonPath () {
+      if (this.path == null) return null
       return Array.isArray(this.path) ? this.path : this.path.split('.')
     },
+    descriptionPath () {
+      if (this.path == null) return null
+      if (this.descriptionPathOverride) return this.descriptionPathOverride
+      const path = Array.isArray(this.path) ? this.path : this.path.split('.')
+      if (this.subgroup) {
+        return [
+            ...path.slice(0, path.length - 1),
+            ':subgroup,' + this.subgroup,
+            ...path.slice(path.length - 1)
+        ]
+      }
+      return path
+    },
     isDirty () {
+      if (this.path == null) return false
       if (this.realSource === 'admin' && this.canonPath.length > 3) {
         return false // should not show draft buttons for "grouped" values
       } else {
-        return this.realDraftMode && this.draft !== this.state
+        return this.realDraftMode && !isEqual(this.draft, this.state)
       }
     },
     canHardReset () {
-      return this.realSource === 'admin' && this.$store.state.adminSettings.modifiedPaths &&
-             this.$store.state.adminSettings.modifiedPaths.has(this.canonPath.join(' -> '))
+      return this.realSource === 'admin' && this.$store.state.adminSettings.modifiedPaths?.has(this.canonPath.join(' -> '))
     },
     matchesExpertLevel () {
       return (this.expert || 0) <= this.$store.state.config.expertLevel > 0
diff --git a/src/components/settings_modal/helpers/string_setting.vue b/src/components/settings_modal/helpers/string_setting.vue
index 7b30d1b9f..2ab205db1 100644
--- a/src/components/settings_modal/helpers/string_setting.vue
+++ b/src/components/settings_modal/helpers/string_setting.vue
@@ -1,12 +1,20 @@
 <template>
-  <label
+  <span
     v-if="matchesExpertLevel"
-    class="StringSetting"
+    class="StringSetting setting-item"
   >
     <label
+      v-if="!hideLabel"
       :for="path"
+      class="setting-label"
       :class="{ 'faint': shouldBeDisabled }"
     >
+      <ModifiedIndicator
+        :changed="isChanged"
+        :onclick="reset"
+      />
+      <ProfileSettingIndicator :is-profile="isProfileSetting" />
+      {{ ' ' }}
       <template v-if="backendDescriptionLabel">
         {{ backendDescriptionLabel + ' ' }}
       </template>
@@ -17,18 +25,15 @@
     </label>
     <input
       :id="path"
-      class="input string-input"
+      class="setting-control input string-input"
+      :class="{ disabled: shouldBeDisabled }"
       :disabled="shouldBeDisabled"
+      :placeholder="backendDescriptionSuggestions"
       :value="realDraftMode ? draft : state"
       @change="update"
     >
     {{ ' ' }}
-    <ModifiedIndicator
-      :changed="isChanged"
-      :onclick="reset"
-    />
-    <ProfileSettingIndicator :is-profile="isProfileSetting" />
-    <DraftButtons />
+    <DraftButtons v-if="!hideDraftButtons" />
     <p
       v-if="backendDescriptionDescription"
       class="setting-description"
@@ -36,7 +41,7 @@
     >
       {{ backendDescriptionDescription + ' ' }}
     </p>
-  </label>
+  </span>
 </template>
 
 <script src="./string_setting.js"></script>
diff --git a/src/components/settings_modal/helpers/tuple_setting.js b/src/components/settings_modal/helpers/tuple_setting.js
new file mode 100644
index 000000000..f6f4753c0
--- /dev/null
+++ b/src/components/settings_modal/helpers/tuple_setting.js
@@ -0,0 +1,16 @@
+import Setting from './setting.js'
+
+export default {
+  ...Setting,
+  methods: {
+    ...Setting.methods,
+    getValue ({ e, side }) {
+      const [a, b] = this.visibleState || []
+      if (side === 0) {
+        return { tuple: [e.target.value, b]}
+      } else {
+        return { tuple: [a, e.target.value]}
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/tuple_setting.vue b/src/components/settings_modal/helpers/tuple_setting.vue
new file mode 100644
index 000000000..e39e23344
--- /dev/null
+++ b/src/components/settings_modal/helpers/tuple_setting.vue
@@ -0,0 +1,58 @@
+<template>
+  <span
+    v-if="matchesExpertLevel"
+    class="setting-item"
+  >
+    <label
+      v-if="!hideLabel"
+      :for="path"
+      class="setting-label"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      <ModifiedIndicator
+        :changed="isChanged"
+        :onclick="reset"
+      />
+      <ProfileSettingIndicator :is-profile="isProfileSetting" />
+      {{ ' ' }}
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else-if="source === 'admin'">
+        MISSING LABEL FOR {{ path }}
+      </template>
+      <slot v-else />
+    </label>
+    <span class="setting-control">
+      <input
+        :id="path"
+        class="input string-input"
+        :class="{ disabled: shouldBeDisabled }"
+        :disabled="shouldBeDisabled"
+        :placeholder="backendDescriptionSuggestions?.[0]?.[0]"
+        :value="visibleState?.tuple?.[0]"
+        @change="e => update({ e, side: 0 })"
+      >
+      {{ ' ' }}
+      <input
+        :id="path"
+        class="input string-input"
+        :class="{ disabled: shouldBeDisabled }"
+        :disabled="shouldBeDisabled"
+        :placeholder="backendDescriptionSuggestions?.[0]?.[1]"
+        :value="visibleState?.tuple?.[1]"
+        @change="e => update({ e, side: 1 })"
+      >
+    </span>
+    <DraftButtons v-if="!hideDraftButtons" />
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+  </span>
+</template>
+
+<script src="./tuple_setting.js"></script>
diff --git a/src/components/settings_modal/helpers/unit_setting.vue b/src/components/settings_modal/helpers/unit_setting.vue
index 40ab68801..d23745fa4 100644
--- a/src/components/settings_modal/helpers/unit_setting.vue
+++ b/src/components/settings_modal/helpers/unit_setting.vue
@@ -1,45 +1,47 @@
 <template>
   <span
     v-if="matchesExpertLevel"
-    class="UnitSetting"
+    class="UnitSetting setting-item"
   >
     <label
       :for="path"
-      class="size-label"
+      class="setting-label size-label"
     >
+      <ModifiedIndicator
+        :changed="isChanged"
+        :onclick="reset"
+      />
+      {{ ' ' }}
       <slot />
     </label>
-    {{ ' ' }}
-    <input
-      :id="path"
-      class="input number-input"
-      type="number"
-      :step="step"
-      :disabled="disabled"
-      :min="min || 0"
-      :value="stateValue"
-      @change="updateValue"
-    >
-    <Select
-      :id="path"
-      :model-value="stateUnit"
-      :disabled="disabled"
-      class="unit-input unstyled"
-      @change="updateUnit"
-    >
-      <option
-        v-for="option in units"
-        :key="option"
-        :value="option"
+    <span class="no-break setting-control">
+      <input
+        :id="path"
+        class="input number-input"
+        type="number"
+        :step="step"
+        :disabled="disabled"
+        :min="min || 0"
+        :value="stateValue"
+        @change="updateValue"
       >
-        {{ getUnitString(option) }}
-      </option>
-    </Select>
+      <Select
+        :id="path"
+        :model-value="stateUnit"
+        :disabled="disabled"
+        class="unit-input unstyled"
+        @change="updateUnit"
+      >
+        <option
+          v-for="option in units"
+          :key="option"
+          :value="option"
+        >
+          {{ getUnitString(option) }}
+        </option>
+      </Select>
+    </span>
     {{ ' ' }}
-    <ModifiedIndicator
-      :changed="isChanged"
-      :onclick="reset"
-    />
   </span>
 </template>
 
@@ -47,6 +49,10 @@
 
 <style lang="scss">
 .UnitSetting {
+  .no-break {
+    display: inline-flex;
+  }
+
   .number-input {
     max-width: 6.5em;
     text-align: right;
diff --git a/src/components/settings_modal/helpers/vertical_tab_switcher.jsx b/src/components/settings_modal/helpers/vertical_tab_switcher.jsx
new file mode 100644
index 000000000..de0e1af26
--- /dev/null
+++ b/src/components/settings_modal/helpers/vertical_tab_switcher.jsx
@@ -0,0 +1,215 @@
+// eslint-disable-next-line no-unused
+import { h, Fragment } from 'vue'
+import { mapState } from 'pinia'
+import { throttle } from 'lodash'
+import { mapState as mapPiniaState } from 'pinia'
+import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
+
+import './vertical_tab_switcher.scss'
+import { useInterfaceStore } from 'src/stores/interface'
+
+const findFirstUsable = (slots) => slots.findIndex(_ => _.props)
+
+export default {
+  name: 'VerticalTabSwitcher',
+  props: {
+    renderOnlyFocused: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    onSwitch: {
+      required: false,
+      type: Function,
+      default: undefined
+    },
+    activeTab: {
+      required: false,
+      type: String,
+      default: undefined
+    },
+    bodyScrollLock: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    parentCollapsed: {
+      required: false,
+      type: Boolean,
+      default: null
+    }
+  },
+  data () {
+    return {
+      active: findFirstUsable(this.slots()),
+      resizeHandler: null,
+      navSide: 'tabs',
+    }
+  },
+  computed: {
+    activeIndex () {
+      // In case of controlled component
+      if (this.activeTab) {
+        return this.slots().findIndex(slot => slot && slot.props && this.activeTab === slot.props.key)
+      } else {
+        return this.active
+      }
+    },
+    isActive () {
+      return tabName => {
+        const isWanted = slot => slot.props && slot.props['data-tab-name'] === tabName
+        return this.$slots.default().findIndex(isWanted) === this.activeIndex
+      }
+    },
+    ...mapPiniaState(useInterfaceStore, {
+      mobileLayout: store => store.layoutType === 'mobile'
+    }),
+  },
+  beforeUpdate () {
+    const currentSlot = this.slots()[this.active]
+    if (!currentSlot.props) {
+      this.active = findFirstUsable(this.slots())
+    }
+  },
+  methods: {
+    clickTab (index) {
+      return (e) => {
+        e.preventDefault()
+        this.setTab(index)
+      }
+    },
+    setTab (index) {
+      if (typeof this.onSwitch === 'function') {
+        this.onSwitch.call(null, this.slots()[index].key)
+      }
+      this.active = index
+      this.changeNavSide('content')
+    },
+    changeNavSide (side) {
+      if (this.navSide !== side) {
+        this.navSide = side
+      }
+    },
+    // DO NOT put it to computed, it doesn't work (caching?)
+    slots () {
+      if (this.$slots.default()[0].type === Fragment) {
+        return this.$slots.default()[0].children
+      }
+      return this.$slots.default()
+    }
+  },
+  render () {
+    const tabs = this.slots()
+      .map((slot, index) => {
+        const props = slot.props
+        if (!props) return
+        const classesTab = ['vertical-tab', 'menu-item']
+        if (this.activeIndex === index && useInterfaceStore().layoutType !== 'mobile') {
+          classesTab.push('-active')
+        }
+        return (
+          <button
+            disabled={props.disabled}
+            onClick={this.clickTab(index)}
+            class={classesTab.join(' ')}
+            type="button"
+            role="tab"
+            title={props.label}
+          >
+            {!props.icon ? '' : (<FAIcon class="tab-icon" size="1x" fixed-width icon={props.icon}/>)}
+            <span class="text">
+              {props.label}
+            </span>
+          </button>
+        )
+      })
+
+    const contents = this.slots().map((slot, index) => {
+      const props = slot.props
+      if (!props) return
+      const active = this.activeIndex === index
+
+      let delayRender = slot.props['delay-render']
+      if (delayRender && active) {
+        slot.props['delay-render'] = false
+        delayRender = false
+      }
+      const renderSlot = (!delayRender && (!this.renderOnlyFocused || active))
+        ? slot
+        : ''
+
+      const headerClasses = ['tab-content-label']
+      const header = (
+        <h2 class={headerClasses}>
+          <button
+            type="button"
+            onClick={() => this.changeNavSide('tabs')}
+            title={this.$t('nav.back')}
+            class="button-unstyled"
+          >
+            <FAIcon
+              size="lg"
+              class="back-button-icon"
+              icon="chevron-left"
+            />
+          </button>
+          {props.label}
+        </h2>
+      )
+
+      const wrapperClasses = ['tab-content-wrapper', active ? '-active' : '-hidden' ]
+      const contentClasses = ['tab-content']
+      if (props['full-width'] || props['full-width'] === '') {
+        contentClasses.push('-full-width')
+        wrapperClasses.push('-full-width')
+      }
+      if (props['full-height'] || props['full-width'] === '') {
+        contentClasses.push('-full-height')
+        wrapperClasses.push('-full-height')
+      }
+      return (
+        <div class={wrapperClasses} >
+          <div class="tab-mobile-header">
+            {header}
+          </div>
+          <div class="tab-slot-wrapper">
+            <div class={contentClasses} >
+              {renderSlot}
+            </div>
+          </div>
+        </div>
+      )
+    })
+
+    const rootClasses = ['vertical-tab-switcher']
+    if (useInterfaceStore().layoutType === 'mobile') {
+      rootClasses.push('-mobile')
+    }
+
+    if (this.navSide === 'tabs') {
+      rootClasses.push('-nav-tabs')
+    } else {
+      rootClasses.push('-nav-contents')
+    }
+
+    return (
+      <div ref="root" class={ rootClasses.join(' ') }>
+        <div
+          class="tabs"
+          role="tablist"
+          ref="nav"
+        >
+          {tabs}
+        </div>
+        <div
+          role="tabpanel"
+          class={'contents' + (this.scrollableTabs ? ' scrollable-tabs' : '')}
+          v-body-scroll-lock={this.bodyScrollLock}
+          ref="contents"
+        >
+          {contents}
+        </div>
+      </div>
+    )
+  }
+}
diff --git a/src/components/settings_modal/helpers/vertical_tab_switcher.scss b/src/components/settings_modal/helpers/vertical_tab_switcher.scss
new file mode 100644
index 000000000..4bb4b7167
--- /dev/null
+++ b/src/components/settings_modal/helpers/vertical_tab_switcher.scss
@@ -0,0 +1,183 @@
+.vertical-tab-switcher {
+  display: flex;
+  flex-direction: row;
+  container-type: inline-size;
+
+  > .tabs {
+    flex: 0 0 15em;
+    flex-direction: column;
+    overflow: hidden auto;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    width: 15em;
+    min-width: 15em;
+    border-right: 1px solid;
+    border-right-color: var(--border);
+    box-sizing: border-box;
+
+    > .menu-item {
+      padding: 0.5em 1em;
+
+      .tab-icon {
+        vertical-align: middle;
+        margin-right: 0.75em;
+      }
+    }
+  }
+
+  > .contents {
+    .tab-content-label {
+      box-sizing: border-box;
+      margin: 0;
+      border-bottom: 1px solid var(--border);
+      display: none;
+
+      button {
+        box-sizing: border-box;
+        padding: 0.5em;
+      }
+    }
+
+    .tab-slot-wrapper {
+      flex: 1 1 auto;
+      height: 100%;
+      overflow-y: auto;
+      display: grid;
+      grid-template-columns: minmax(1em, 1fr) minmax(min-content, 45em) minmax(1em, 1fr);
+      grid-template-areas: ". content .";
+      flex-direction: column;
+
+      .tab-content {
+        grid-area: content;
+
+        &.-full-width {
+          grid-column: 1 / 4;
+        }
+
+        &.-full-height {
+          > * {
+            height: 100%;
+          }
+        }
+      }
+    }
+
+    .tab-content-wrapper {
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      flex: 1 1 auto;
+
+      &.-hidden {
+        display: none;
+      }
+    }
+  }
+
+  &.-mobile {
+    > .contents {
+      .tab-content-label {
+        display: block
+      }
+    }
+
+    &.-nav-contents {
+      > .contents {
+        display: block;
+        flex-grow: 1;
+        flex-shrink: 1;
+      }
+
+      > .tabs {
+        display: none;
+        flex-grow: 0;
+        flex-shrink: 1;
+      }
+    }
+
+    &.-nav-tabs {
+      > .tabs {
+        display: block;
+        flex-grow: 1;
+      }
+
+      > .contents {
+        display: none;
+        flex-grow: 0;
+        flex-shrink: 1;
+      }
+    }
+
+    .tab-slot-wrapper {
+      grid-template-columns: 0 minmax(min-content, 45em) 0;
+    }
+  }
+
+  @supports (container-type: inline-size) {
+    &,
+    &.-mobile {
+      &.-nav-contents,
+      &.-nav-tabs {
+        /* I THINK it's a false positive and eslint doesn't understand the @-rule */
+        /* stylelint-disable no-descending-specificity */
+        > .contents {
+          display: block;
+          flex-grow: 1;
+        }
+
+        > .tabs {
+          display: block;
+          flex-grow: 0;
+        }
+        /* stylelint-enable no-descending-specificity */
+      }
+    }
+
+    @container (width < 50em) {
+      > .contents {
+        .tab-content-label {
+          display: block
+        }
+      }
+
+      &.-mobile {
+        > .contents {
+          .tab-content-label {
+            display: block
+          }
+        }
+      }
+
+      &,
+      &.-mobile {
+        &.-nav-contents {
+          > .contents {
+            display: block;
+            flex-grow: 1;
+          }
+
+          > .tabs {
+            display: none;
+            flex-grow: 0;
+            flex-shrink: 1;
+          }
+        }
+
+        &.-nav-tabs {
+          /* stylelint-disable no-descending-specificity */
+          > .tabs {
+            display: block;
+            flex-grow: 1;
+          }
+
+          > .contents {
+            display: none;
+            flex-grow: 0;
+            flex-shrink: 1;
+          }
+          /* stylelint-enable no-descending-specificity */
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js
index 63c9b24a3..789ebd0ee 100644
--- a/src/components/settings_modal/settings_modal.js
+++ b/src/components/settings_modal/settings_modal.js
@@ -7,6 +7,7 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
 import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { cloneDeep, isEqual } from 'lodash'
+import { mapState, mapActions } from 'pinia'
 import {
   newImporter,
   newExporter
@@ -20,6 +21,7 @@ import {
 import {
   faWindowMinimize
 } from '@fortawesome/free-regular-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 const PLEROMAFE_SETTINGS_MAJOR_VERSION = 1
 const PLEROMAFE_SETTINGS_MINOR_VERSION = 0
@@ -74,10 +76,10 @@ const SettingsModal = {
   },
   methods: {
     closeModal () {
-      this.$store.dispatch('closeSettingsModal')
+      useInterfaceStore().closeSettingsModal()
     },
     peekModal () {
-      this.$store.dispatch('togglePeekSettingsModal')
+      useInterfaceStore().togglePeekSettingsModal()
     },
     importValidator (data) {
       if (!Array.isArray(data._pleroma_settings_version)) {
@@ -109,7 +111,7 @@ const SettingsModal = {
       }
 
       if (minor > PLEROMAFE_SETTINGS_MINOR_VERSION) {
-        this.$store.dispatch('pushGlobalNotice', {
+        useInterfaceStore().pushGlobalNotice({
           level: 'warning',
           messageKey: 'settings.file_export_import.errors.file_slightly_new'
         })
@@ -119,9 +121,9 @@ const SettingsModal = {
     },
     onImportFailure (result) {
       if (result.error) {
-        this.$store.dispatch('pushGlobalNotice', { messageKey: 'settings.invalid_settings_imported', level: 'error' })
+        useInterfaceStore().pushGlobalNotice({ messageKey: 'settings.invalid_settings_imported', level: 'error' })
       } else {
-        this.$store.dispatch('pushGlobalNotice', { ...result.validationResult, level: 'error' })
+        useInterfaceStore().pushGlobalNotice({ ...result.validationResult, level: 'error' })
       }
     },
     onImport (data) {
@@ -163,28 +165,19 @@ const SettingsModal = {
     },
     pushAdminDraft () {
       this.$store.dispatch('pushAdminDraft')
-    }
+    },
+    ...mapActions(useInterfaceStore, ['temporaryChangesRevert', 'temporaryChangesConfirm'])
   },
   computed: {
-    currentSaveStateNotice () {
-      console.log(this.$store.state.interface.settings.currentSaveStateNotice)
-      return this.$store.state.interface.settings.currentSaveStateNotice
-    },
-    modalActivated () {
-      return this.$store.state.interface.settingsModalState !== 'hidden'
-    },
-    modalMode () {
-      return this.$store.state.interface.settingsModalMode
-    },
-    modalOpenedOnceUser () {
-      return this.$store.state.interface.settingsModalLoadedUser
-    },
-    modalOpenedOnceAdmin () {
-      return this.$store.state.interface.settingsModalLoadedAdmin
-    },
-    modalPeeked () {
-      return this.$store.state.interface.settingsModalState === 'minimized'
-    },
+    ...mapState(useInterfaceStore, {
+      temporaryChangesCountdown: store => store.temporaryChangesCountdown,
+      currentSaveStateNotice: store => store.settings.currentSaveStateNotice,
+      modalActivated: store => store.settingsModalState !== 'hidden',
+      modalMode: store => store.settingsModalMode,
+      modalOpenedOnceUser: store => store.settingsModalLoadedUser,
+      modalOpenedOnceAdmin: store => store.settingsModalLoadedAdmin,
+      modalPeeked: store => store.settingsModalState === 'minimized'
+    }),
     expertLevel: {
       get () {
         return this.$store.state.config.expertLevel > 0
diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss
index d01553db6..032b603fa 100644
--- a/src/components/settings_modal/settings_modal.scss
+++ b/src/components/settings_modal/settings_modal.scss
@@ -1,48 +1,174 @@
 .settings-modal {
   overflow: hidden;
 
-  h4 {
+  h2 {
+    font-size: 1.3rem;
+    font-weight: 500;
+    margin-top: 1em;
+    margin-bottom: 1em;
+    margin-right: 1em;
+  }
+
+  h3 {
+    font-size: 1.2rem;
+    font-weight: 500;
+    margin-top: 1em;
     margin-bottom: 0.5em;
+    margin-right: 1em;
+    border-bottom: 1px solid var(--border);
+    padding-bottom: 0.25em;
+    box-sizing: border-box;
+    padding-left: 0.5em;
+  }
+
+  h4 {
+    font-size: 1.1rem;
+    margin-top: 1em;
+    margin-right: 1em;
+    margin-bottom: 0.5em;
+    margin-left: 1em;
+  }
+
+  h5 {
+    font-size: 1rem;
+    margin-left: 1em;
+    margin-bottom: 0.25em;
+    margin-top: 0.75em;
+  }
+
+  p {
+    line-height: 1.5;
+  }
+
+  .suboptions {
+    margin-left: 1em;
+  }
+
+  .sidenote {
+    margin-left: 5em;
+    padding: 0.25em 1em;
+    margin-top: 0.25em;
+  }
+
+  .setting-description {
+    margin-top: 0.2em;
+    margin-bottom: 0;
+    font-size: 80%;
+  }
+
+  .setting-item {
+    display: grid;
+    grid-template-areas:
+      "label control"
+      "label desc"
+      ".     draft";
+    grid-template-columns: 4fr 5fr;
+    column-gap: 0.5em;
+    align-items: baseline;
+    padding: 0.5em 0;
+
+    .setting-label {
+      grid-area: label;
+      text-align: right;
+    }
+
+    .ModifiedIndicator,
+    .ProfileSettingIndicator {
+      grid-area: indicator;
+    }
+
+    .setting-control {
+      grid-area: control;
+
+      &.textarea {
+        align-self: baseline;
+        overflow: auto;
+      }
+
+      &.checkbox {
+        display: grid;
+        grid-template-columns: subgrid;
+
+        .label {
+          grid-area: label;
+          text-align: right;
+        }
+
+        .checkbox-indicator {
+          grid-area: control;
+        }
+
+        .-mobile & {
+          .label {
+            text-align: left;
+          }
+        }
+      }
+    }
+
+    .setting-control.setting-label {
+      grid-column: 1 / 3;
+      text-align: left;
+    }
+
+    .setting-description {
+      grid-area: desc;
+    }
+
+    .DraftButtons {
+      grid-area: draft;
+    }
+  }
+
+  .vertical-tab-switcher {
+    height: 100%;
   }
 
   .setting-list,
   .option-list {
     list-style-type: none;
-    padding-left: 2em;
+    padding-left: 0;
+    margin: 0;
 
-    li {
-      margin-bottom: 0.5em;
+    .btn:not(.dropdown-button) {
+      padding: 0 2em;
     }
 
-    .suboptions {
-      margin-top: 0.3em;
+    .btn-group {
+      .button-default {
+        flex: 0 1 auto;
+      }
     }
 
     &.two-column {
-      column-count: 2;
+      display: grid;
+      grid-template-columns: 1fr 1fr;
+      margin-left: 2em;
+      border-bottom: 1px solid var(--border);
+      padding-bottom: 0.5em;
+      margin-bottom: 1em;
+
+      .setting-item {
+        grid-template-columns: 3fr 1fr;
+      }
 
       > li {
+        margin: 0;
         break-inside: avoid;
       }
     }
   }
 
-  .setting-description {
-    margin-top: 0.2em;
-    margin-bottom: 2em;
-    font-size: 70%;
-  }
-
   .settings-modal-panel {
     overflow: hidden;
     transition: transform;
     transition-timing-function: ease-in-out;
     transition-duration: 300ms;
-    width: 1000px;
+    width: 70em;
     max-width: 90vw;
     height: 90vh;
 
-    @media all and (max-width: 800px) {
+    @media all and (width <= 800px) {
       max-width: 100vw;
       height: 100%;
     }
@@ -54,10 +180,6 @@
       .btn {
         min-height: 2em;
       }
-
-      .btn:not(.dropdown-button) {
-        padding: 0 2em;
-      }
     }
   }
 
@@ -76,6 +198,54 @@
     }
   }
 
+  &.-mobile {
+    .tabs {
+      .menu-item {
+        font-size: 1.2em;
+        padding-top: 0.75em;
+        padding-bottom: 0.75em;
+      }
+    }
+
+    /* stylelint-disable no-descending-specificity */
+    .setting-item {
+      grid-template-columns: 1fr min-content;
+      column-gap: 0.5em;
+      padding: 1em;
+      align-items: center;
+
+      .setting-label {
+        text-align: left;
+      }
+
+      .checkbox {
+        .label {
+          text-align: left;
+          margin-left: 0;
+        }
+      }
+    }
+
+    ul {
+      padding: 0;
+
+      li:not(:first-child) {
+        .setting-item {
+          border-top: 1px solid var(--border);
+        }
+      }
+    }
+
+
+
+    .setting-list:not(.suboptions),
+    .option-list {
+      &.two-column {
+        grid-template-columns: 1fr;
+      }
+    }
+  }
+
   &.peek {
     .settings-modal-panel {
       /* Explanation:
@@ -88,7 +258,7 @@
        */
       transform: translateY(calc(((100vh - 100%) / 2 + 100%) - 50px));
 
-      @media all and (max-width: 800px) {
+      @media all and (width <= 800px) {
         /* For mobile, the modal takes 100% of the available screen.
            This ensures the minimized modal is always 50px above the browser bottom
            bar regardless of whether or not it is visible.
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 90dbbde0a..d2b4f60ee 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -7,9 +7,9 @@
   >
     <div class="settings-modal-panel panel">
       <div class="panel-heading">
-        <span class="title">
+        <h1 class="title">
           {{ modalMode === 'user' ? $t('settings.settings') : $t('admin_dash.window_title') }}
-        </span>
+        </h1>
         <transition name="fade">
           <div
             v-if="currentSaveStateNotice"
@@ -69,48 +69,57 @@
           </template>
           <template #content="{close}">
             <div class="dropdown-menu">
-              <button
-                class="menu-item dropdown-item dropdown-item-icon"
-                @click.prevent="backup"
-                @click="close"
-              >
-                <FAIcon
-                  icon="file-download"
-                  fixed-width
-                /><span>{{ $t("settings.file_export_import.backup_settings") }}</span>
-              </button>
-              <button
-                class="menu-item dropdown-item dropdown-item-icon"
-                @click.prevent="backupWithTheme"
-                @click="close"
-              >
-                <FAIcon
-                  icon="file-download"
-                  fixed-width
-                /><span>{{ $t("settings.file_export_import.backup_settings_theme") }}</span>
-              </button>
-              <button
-                class="menu-item dropdown-item dropdown-item-icon"
-                @click.prevent="restore"
-                @click="close"
-              >
-                <FAIcon
-                  icon="file-upload"
-                  fixed-width
-                /><span>{{ $t("settings.file_export_import.restore_settings") }}</span>
-              </button>
+              <div class="menu-item dropdown-item -icon">
+                <button
+                  class="main-button"
+                  @click.prevent="backup"
+                  @click="close"
+                >
+                  <FAIcon
+                    icon="file-download"
+                    fixed-width
+                  /><span>{{ $t("settings.file_export_import.backup_settings") }}</span>
+                </button>
+              </div>
+              <div class="menu-item dropdown-item -icon">
+                <button
+                  class="main-button"
+                  @click.prevent="backupWithTheme"
+                  @click="close"
+                >
+                  <FAIcon
+                    icon="file-download"
+                    fixed-width
+                  /><span>{{ $t("settings.file_export_import.backup_settings_theme") }}</span>
+                </button>
+              </div>
+              <div class="menu-item dropdown-item -icon">
+                <button
+                  class="main-button"
+                  @click.prevent="restore"
+                  @click="close"
+                >
+                  <FAIcon
+                    icon="file-upload"
+                    fixed-width
+                  /><span>{{ $t("settings.file_export_import.restore_settings") }}</span>
+                </button>
+              </div>
             </div>
           </template>
         </Popover>
 
         <Checkbox
           :model-value="!!expertLevel"
-          @update:modelValue="expertLevel = Number($event)"
+          @update:model-value="expertLevel = Number($event)"
         >
           {{ $t("settings.expert_mode") }}
         </Checkbox>
         <span v-if="modalMode === 'admin'">
-          <i18n-t keypath="admin_dash.wip_notice">
+          <i18n-t
+            scope="global"
+            keypath="admin_dash.wip_notice"
+          >
             <template #adminFeLink>
               <a
                 href="/pleroma/admin/#/login-pleroma"
@@ -149,14 +158,14 @@
     </div>
     <teleport to="#modal">
       <ConfirmModal
-        v-if="$store.state.interface.temporaryChangesTimeoutId"
+        v-if="temporaryChangesCountdown > 0"
         :title="$t('settings.confirm_new_setting')"
         :cancel-text="$t('settings.revert')"
         :confirm-text="$t('settings.confirm')"
-        @cancelled="$store.state.interface.temporaryChangesRevert"
-        @accepted="$store.state.interface.temporaryChangesConfirm"
+        @cancelled="temporaryChangesRevert"
+        @accepted="temporaryChangesConfirm"
       >
-        {{ $t('settings.confirm_new_question') }}
+        {{ $t('settings.confirm_new_question_countdown', temporaryChangesCountdown) }}
       </ConfirmModal>
     </teleport>
   </Modal>
diff --git a/src/components/settings_modal/settings_modal_admin_content.js b/src/components/settings_modal/settings_modal_admin_content.js
index ce835bf24..77a3d6b81 100644
--- a/src/components/settings_modal/settings_modal_admin_content.js
+++ b/src/components/settings_modal/settings_modal_admin_content.js
@@ -1,41 +1,84 @@
-import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
+import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
 
 import InstanceTab from './admin_tabs/instance_tab.vue'
+import LinksTab from './admin_tabs/links_tab.vue'
 import LimitsTab from './admin_tabs/limits_tab.vue'
 import FrontendsTab from './admin_tabs/frontends_tab.vue'
+import MediaProxyTab from './admin_tabs/media_proxy_tab.vue'
 import EmojiTab from './admin_tabs/emoji_tab.vue'
+import UploadsTab from './admin_tabs/uploads_tab.vue'
+import MailerTab from './admin_tabs/mailer_tab.vue'
+import MonitoringTab from './admin_tabs/monitoring_tab.vue'
+import RegistrationsTab from './admin_tabs/registrations_tab.vue'
+import AuthTab from './admin_tabs/auth_tab.vue'
+import HTTPTab from './admin_tabs/http_tab.vue'
+import OtherTab from './admin_tabs/other_tab.vue'
+import RatesTab from './admin_tabs/rates_tab.vue'
+import PostsTab from './admin_tabs/posts_tab.vue'
+import FederationTab from './admin_tabs/federation_tab.vue'
+import JobQueuesTab from './admin_tabs/job_queues_tab.vue'
+import { useInterfaceStore } from 'src/stores/interface'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faWrench,
   faHand,
+  faChain,
+  faGlobe,
   faLaptopCode,
-  faPaintBrush,
-  faBell,
-  faDownload,
-  faEyeSlash,
-  faInfo
+  faTowerBroadcast,
+  faEnvelope,
+  faChartLine,
+  faDoorOpen,
+  faGears,
+  faKey,
+  faCircleNodes,
+  faUpload,
+  faMessage,
+  faEllipsis,
+  faGauge
 } from '@fortawesome/free-solid-svg-icons'
 
 library.add(
   faWrench,
   faHand,
+  faChain,
+  faGlobe,
   faLaptopCode,
-  faPaintBrush,
-  faBell,
-  faDownload,
-  faEyeSlash,
-  faInfo
+  faTowerBroadcast,
+  faEnvelope,
+  faChartLine,
+  faDoorOpen,
+  faGears,
+  faKey,
+  faCircleNodes,
+  faUpload,
+  faMessage,
+  faEllipsis,
+  faGauge
 )
 
 const SettingsModalAdminContent = {
   components: {
-    TabSwitcher,
+    VerticalTabSwitcher,
 
     InstanceTab,
-    LimitsTab,
+    RegistrationsTab,
+    EmojiTab,
     FrontendsTab,
-    EmojiTab
+    FederationTab,
+    LimitsTab,
+    MailerTab,
+    UploadsTab,
+    MediaProxyTab,
+    LinksTab,
+    JobQueuesTab,
+    AuthTab,
+    HTTPTab,
+    MonitoringTab,
+    RatesTab,
+    OtherTab,
+    PostsTab
   },
   computed: {
     user () {
@@ -45,10 +88,10 @@ const SettingsModalAdminContent = {
       return !!this.$store.state.users.currentUser
     },
     open () {
-      return this.$store.state.interface.settingsModalState !== 'hidden'
+      return useInterfaceStore().settingsModalState !== 'hidden'
     },
     bodyLock () {
-      return this.$store.state.interface.settingsModalState === 'visible'
+      return useInterfaceStore().settingsModalState === 'visible'
     },
     adminDbLoaded () {
       return this.$store.state.adminSettings.loaded
@@ -67,7 +110,7 @@ const SettingsModalAdminContent = {
   },
   methods: {
     onOpen () {
-      const targetTab = this.$store.state.interface.settingsModalTargetTab
+      const targetTab = useInterfaceStore().settingsModalTargetTab
       // We're being told to open in specific tab
       if (targetTab) {
         const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => {
@@ -79,7 +122,7 @@ const SettingsModalAdminContent = {
       }
       // Clear the state of target tab, so that next time settings is opened
       // it doesn't force it.
-      this.$store.dispatch('clearSettingsModalTargetTab')
+      useInterfaceStore().clearSettingsModalTargetTab()
     }
   },
   mounted () {
diff --git a/src/components/settings_modal/settings_modal_admin_content.scss b/src/components/settings_modal/settings_modal_admin_content.scss
deleted file mode 100644
index a5314fe12..000000000
--- a/src/components/settings_modal/settings_modal_admin_content.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-.settings_tab-switcher {
-  height: 100%;
-
-  .setting-item {
-    border-bottom: 2px solid var(--border);
-    margin: 1em 1em 1.4em;
-    padding-bottom: 1.4em;
-
-    > div,
-    > label {
-      display: block;
-      margin-bottom: 0.5em;
-
-      &:last-child {
-        margin-bottom: 0;
-      }
-    }
-
-    .select-multiple {
-      display: flex;
-
-      .option-list {
-        margin: 0;
-        padding-left: 0.5em;
-      }
-    }
-
-    &:last-child {
-      border-bottom: none;
-      padding-bottom: 0;
-      margin-bottom: 1em;
-    }
-
-    textarea {
-      width: 100%;
-      max-width: 100%;
-      height: 100px;
-    }
-
-    .unavailable,
-    .unavailable svg {
-      color: var(--cRed);
-    }
-  }
-}
diff --git a/src/components/settings_modal/settings_modal_admin_content.vue b/src/components/settings_modal/settings_modal_admin_content.vue
index 65e23b7e8..94f843871 100644
--- a/src/components/settings_modal/settings_modal_admin_content.vue
+++ b/src/components/settings_modal/settings_modal_admin_content.vue
@@ -1,8 +1,8 @@
 <template>
-  <tab-switcher
+  <vertical-tab-switcher
     v-if="adminDescriptionsLoaded && (noDb || adminDbLoaded)"
     ref="tabSwitcher"
-    class="settings_tab-switcher"
+    class="settings-admin-content settings_tab-switcher"
     :side-tab-bar="true"
     :scrollable-tabs="true"
     :render-only-focused="true"
@@ -15,9 +15,12 @@
       data-tab-name="nodb-notice"
     >
       <div :label="$t('admin_dash.tabs.nodb')">
-        <div class="setting-item">
+        <div class="setting-section">
           <h2>{{ $t('admin_dash.nodb.heading') }}</h2>
-          <i18n-t keypath="admin_dash.nodb.text">
+          <i18n-t
+            scope="global"
+            keypath="admin_dash.nodb.text"
+          >
             <template #documentation>
               <a
                 href="https://docs-develop.pleroma.social/backend/configuration/howto_database_config/"
@@ -45,6 +48,41 @@
     >
       <InstanceTab />
     </div>
+
+    <div
+      :label="$t('admin_dash.tabs.registrations')"
+      icon="door-open"
+      data-tab-name="registrations"
+    >
+      <RegistrationsTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.auth')"
+      icon="key"
+      data-tab-name="monitoring"
+    >
+      <AuthTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.emoji')"
+      icon="face-smile-beam"
+      data-tab-name="emoji"
+      full-width
+    >
+      <EmojiTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.frontends')"
+      icon="laptop-code"
+      data-tab-name="frontends"
+      full-width
+    >
+      <FrontendsTab />
+    </div>
+
     <div
       v-if="adminDbLoaded"
       :label="$t('admin_dash.tabs.limits')"
@@ -53,24 +91,104 @@
     >
       <LimitsTab />
     </div>
+
     <div
-      :label="$t('admin_dash.tabs.frontends')"
-      icon="laptop-code"
-      data-tab-name="frontends"
+      v-if="adminDbLoaded"
+      :label="$t('admin_dash.tabs.rate_limit')"
+      icon="gauge"
+      data-tab-name="rate_limits"
     >
-      <FrontendsTab />
+      <RatesTab />
     </div>
 
     <div
-      :label="$t('admin_dash.tabs.emoji')"
-      icon="face-smile-beam"
-      data-tab-name="emoji"
+      :label="$t('admin_dash.tabs.uploads')"
+      icon="upload"
+      data-tab-name="uploads"
     >
-      <EmojiTab />
+      <UploadsTab />
     </div>
-  </tab-switcher>
+
+    <div
+      :label="$t('admin_dash.tabs.media_proxy')"
+      icon="tower-broadcast"
+      data-tab-name="media_proxy"
+    >
+      <MediaProxyTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.posts')"
+      icon="message"
+      data-tab-name="other"
+    >
+      <PostsTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.links')"
+      icon="chain"
+      data-tab-name="links"
+    >
+      <LinksTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.mailer')"
+      icon="envelope"
+      data-tab-name="mailer"
+    >
+      <MailerTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.federation')"
+      icon="circle-nodes"
+      data-tab-name="monitoring"
+    >
+      <FederationTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.http')"
+      icon="globe"
+      data-tab-name="http"
+    >
+      <HTTPTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.job_queues')"
+      icon="gears"
+      data-tab-name="job_queues"
+    >
+      <JobQueuesTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.monitoring')"
+      icon="chart-line"
+      data-tab-name="monitoring"
+    >
+      <MonitoringTab />
+    </div>
+
+    <div
+      :label="$t('admin_dash.tabs.other')"
+      icon="ellipsis"
+      data-tab-name="other"
+    >
+      <OtherTab />
+    </div>
+  </vertical-tab-switcher>
 </template>
 
 <script src="./settings_modal_admin_content.js"></script>
 
-<style src="./settings_modal_admin_content.scss" lang="scss"></style>
+<style lang="scss">
+.settings-admin-content {
+  .setting-item {
+    grid-template-columns: 1fr 3fr;
+  }
+}
+</style>
diff --git a/src/components/settings_modal/settings_modal_user_content.js b/src/components/settings_modal/settings_modal_user_content.js
index ebd5329f5..51718ab26 100644
--- a/src/components/settings_modal/settings_modal_user_content.js
+++ b/src/components/settings_modal/settings_modal_user_content.js
@@ -1,4 +1,4 @@
-import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
+import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
 
 import DataImportExportTab from './tabs/data_import_export_tab.vue'
 import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue'
@@ -7,38 +7,54 @@ import FilteringTab from './tabs/filtering_tab.vue'
 import SecurityTab from './tabs/security_tab/security_tab.vue'
 import ProfileTab from './tabs/profile_tab.vue'
 import GeneralTab from './tabs/general_tab.vue'
+import PostsTab from './tabs/posts_tab.vue'
+import ComposingTab from './tabs/composing_tab.vue'
+import ClutterTab from './tabs/clutter_tab.vue'
+import LayoutTab from './tabs/layout_tab.vue'
 import AppearanceTab from './tabs/appearance_tab.vue'
-import VersionTab from './tabs/version_tab.vue'
-import ThemeTab from './tabs/theme_tab/theme_tab.vue'
+import DeveloperTab from './tabs/developer_tab.vue'
+import OldThemeTab from './tabs/old_theme_tab/old_theme_tab.vue'
+import StyleTab from './tabs/style_tab/style_tab.vue'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faWrench,
   faUser,
+  faMessage,
   faFilter,
   faPaintBrush,
+  faPalette,
   faBell,
   faDownload,
   faEyeSlash,
-  faInfo,
-  faWindowRestore
+  faWindowRestore,
+  faCode,
+  faBroom,
+  faLock,
+  faColumns
 } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faWrench,
   faUser,
-  faFilter,
-  faPaintBrush,
+  faMessage,
+  faWindowRestore,
+  faColumns,
   faBell,
-  faDownload,
+  faFilter,
   faEyeSlash,
-  faInfo,
-  faWindowRestore
+  faBroom,
+  faLock,
+  faDownload,
+  faPalette,
+  faPaintBrush,
+  faCode
 )
 
 const SettingsModalContent = {
   components: {
-    TabSwitcher,
+    VerticalTabSwitcher,
 
     DataImportExportTab,
     MutesAndBlocksTab,
@@ -47,24 +63,38 @@ const SettingsModalContent = {
     SecurityTab,
     ProfileTab,
     GeneralTab,
+    PostsTab,
+    ComposingTab,
+    ClutterTab,
+    LayoutTab,
     AppearanceTab,
-    VersionTab,
-    ThemeTab
+    StyleTab,
+    DeveloperTab,
+    OldThemeTab
   },
   computed: {
     isLoggedIn () {
       return !!this.$store.state.users.currentUser
     },
     open () {
-      return this.$store.state.interface.settingsModalState !== 'hidden'
+      return useInterfaceStore().settingsModalState !== 'hidden'
     },
     bodyLock () {
-      return this.$store.state.interface.settingsModalState === 'visible'
+      return useInterfaceStore().settingsModalState === 'visible'
+    },
+    expertLevel () {
+      return this.$store.state.config.expertLevel
+    }
+  },
+  data () {
+    return {
+      navCollapsed: false,
+      navHideHeader: false
     }
   },
   methods: {
     onOpen () {
-      const targetTab = this.$store.state.interface.settingsModalTargetTab
+      const targetTab = useInterfaceStore().settingsModalTargetTab
       // We're being told to open in specific tab
       if (targetTab) {
         const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => {
@@ -76,7 +106,7 @@ const SettingsModalContent = {
       }
       // Clear the state of target tab, so that next time settings is opened
       // it doesn't force it.
-      this.$store.dispatch('clearSettingsModalTargetTab')
+      useInterfaceStore().clearSettingsModalTargetTab()
     }
   },
   mounted () {
diff --git a/src/components/settings_modal/settings_modal_user_content.scss b/src/components/settings_modal/settings_modal_user_content.scss
deleted file mode 100644
index a5314fe12..000000000
--- a/src/components/settings_modal/settings_modal_user_content.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-.settings_tab-switcher {
-  height: 100%;
-
-  .setting-item {
-    border-bottom: 2px solid var(--border);
-    margin: 1em 1em 1.4em;
-    padding-bottom: 1.4em;
-
-    > div,
-    > label {
-      display: block;
-      margin-bottom: 0.5em;
-
-      &:last-child {
-        margin-bottom: 0;
-      }
-    }
-
-    .select-multiple {
-      display: flex;
-
-      .option-list {
-        margin: 0;
-        padding-left: 0.5em;
-      }
-    }
-
-    &:last-child {
-      border-bottom: none;
-      padding-bottom: 0;
-      margin-bottom: 1em;
-    }
-
-    textarea {
-      width: 100%;
-      max-width: 100%;
-      height: 100px;
-    }
-
-    .unavailable,
-    .unavailable svg {
-      color: var(--cRed);
-    }
-  }
-}
diff --git a/src/components/settings_modal/settings_modal_user_content.vue b/src/components/settings_modal/settings_modal_user_content.vue
index 1441d892d..2bde5b21b 100644
--- a/src/components/settings_modal/settings_modal_user_content.vue
+++ b/src/components/settings_modal/settings_modal_user_content.vue
@@ -1,10 +1,11 @@
 <template>
-  <tab-switcher
+  <vertical-tab-switcher
     ref="tabSwitcher"
     class="settings_tab-switcher"
-    :side-tab-bar="true"
     :scrollable-tabs="true"
+    :child-collapsed="childCollapsed"
     :body-scroll-lock="bodyLock"
+    :hide-header="navHideHeader"
   >
     <div
       :label="$t('settings.general')"
@@ -13,44 +14,57 @@
     >
       <GeneralTab />
     </div>
-    <div
-      :label="$t('settings.appearance')"
-      icon="window-restore"
-      data-tab-name="appearance"
-    >
-      <AppearanceTab />
-    </div>
-    <div
-      :label="$t('settings.theme')"
-      icon="paint-brush"
-      data-tab-name="theme"
-    >
-      <ThemeTab />
-    </div>
     <div
       v-if="isLoggedIn"
       :label="$t('settings.profile_tab')"
       icon="user"
       data-tab-name="profile"
+      :full-width="true"
     >
       <ProfileTab />
     </div>
+    <div
+      :label="$t('settings.composing')"
+      icon="pen-alt"
+      data-tab-name="composing"
+      :delay-render="true"
+    >
+      <ComposingTab />
+    </div>
+    <div
+      :label="$t('settings.posts')"
+      icon="message"
+      data-tab-name="posts"
+      :delay-render="true"
+    >
+      <PostsTab />
+    </div>
+    <div
+      :full-width="true"
+      :label="$t('settings.appearance')"
+      icon="window-restore"
+      data-tab-name="appearance"
+      :delay-render="true"
+    >
+      <AppearanceTab />
+    </div>
+    <div
+      :label="$t('settings.layout')"
+      icon="table-columns"
+      data-tab-name="layout"
+      :delay-render="true"
+    >
+      <LayoutTab />
+    </div>
     <div
       v-if="isLoggedIn"
+      :full-width="true"
       :label="$t('settings.notifications')"
       icon="bell"
       data-tab-name="notifications"
     >
       <NotificationsTab />
     </div>
-    <div
-      v-if="isLoggedIn"
-      :label="$t('settings.security_tab')"
-      icon="lock"
-      data-tab-name="security"
-    >
-      <SecurityTab />
-    </div>
     <div
       :label="$t('settings.filtering')"
       icon="filter"
@@ -61,12 +75,28 @@
     <div
       v-if="isLoggedIn"
       :label="$t('settings.mutes_and_blocks')"
-      :fullHeight="true"
       icon="eye-slash"
       data-tab-name="mutesAndBlocks"
+      :full-width="true"
+      :full-height="true"
     >
       <MutesAndBlocksTab />
     </div>
+    <div
+      :label="$t('settings.clutter')"
+      icon="broom"
+      data-tab-name="clutter"
+    >
+      <ClutterTab />
+    </div>
+    <div
+      v-if="isLoggedIn"
+      :label="$t('settings.security_tab')"
+      icon="lock"
+      data-tab-name="security"
+    >
+      <SecurityTab />
+    </div>
     <div
       v-if="isLoggedIn"
       :label="$t('settings.data_import_export_tab')"
@@ -76,15 +106,34 @@
       <DataImportExportTab />
     </div>
     <div
-      :label="$t('settings.version.title')"
-      icon="info"
-      data-tab-name="version"
+      v-if="expertLevel > 0"
+      :label="$t('settings.style.themes3.editor.title')"
+      icon="palette"
+      data-tab-name="style"
+      :delay-render="true"
+      :full-width="true"
     >
-      <VersionTab />
+      <StyleTab />
     </div>
-  </tab-switcher>
+    <div
+      v-if="expertLevel > 0"
+      :label="$t('settings.theme_old')"
+      icon="paint-brush"
+      data-tab-name="theme"
+      :delay-render="true"
+      :full-width="true"
+    >
+      <OldThemeTab />
+    </div>
+    <div
+      v-if="expertLevel > 0"
+      :label="$t('settings.developer')"
+      icon="code"
+      data-tab-name="developer"
+    >
+      <DeveloperTab />
+    </div>
+  </vertical-tab-switcher>
 </template>
 
 <script src="./settings_modal_user_content.js"></script>
-
-<style src="./settings_modal_user_content.scss" lang="scss"></style>
diff --git a/src/components/settings_modal/tabs/appearance_tab.js b/src/components/settings_modal/tabs/appearance_tab.js
index b5fd6c4c4..e4c3741a9 100644
--- a/src/components/settings_modal/tabs/appearance_tab.js
+++ b/src/components/settings_modal/tabs/appearance_tab.js
@@ -2,55 +2,65 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
 import ChoiceSetting from '../helpers/choice_setting.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 import FloatSetting from '../helpers/float_setting.vue'
-import UnitSetting, { defaultHorizontalUnits } from '../helpers/unit_setting.vue'
+import UnitSetting from '../helpers/unit_setting.vue'
+import PaletteEditor from 'src/components/palette_editor/palette_editor.vue'
+import Preview from './old_theme_tab/theme_preview.vue'
 
-import FontControl from 'src/components/font_control/font_control.vue'
-
-import { normalizeThemeData } from 'src/modules/interface'
-
-import {
-  getThemes
-} from 'src/services/style_setter/style_setter.js'
+import { newImporter } from 'src/services/export_import/export_import.js'
 import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
 import { init } from 'src/services/theme_data/theme_data_3.service.js'
 import {
-  getCssRules,
-  getScopedVersion
+  getCssRules
 } from 'src/services/theme_data/css_utils.js'
+import { deserialize } from 'src/services/theme_data/iss_deserializer.js'
+import { createStyleSheet, adoptStyleSheets } from 'src/services/style_setter/style_setter.js'
+import fileSizeFormatService from 'src/components/../services/file_size_format/file_size_format.js'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faGlobe
-} from '@fortawesome/free-solid-svg-icons'
 
-import Preview from './theme_tab/theme_preview.vue'
-
-library.add(
-  faGlobe
-)
+import { mapActions } from 'pinia'
+import { useInterfaceStore, normalizeThemeData } from 'src/stores/interface'
 
 const AppearanceTab = {
   data () {
     return {
-      availableStyles: [],
+      availableThemesV3: [],
+      availableThemesV2: [],
+      bundledPalettes: [],
+      compilationCache: {},
+      fileImporter: newImporter({
+        accept: '.json, .iss',
+        validator: this.importValidator,
+        onImport: this.onImport,
+        parser: this.importParser,
+        onImportFailure: this.onImportFailure
+      }),
+      palettesKeys: [
+        'bg',
+        'fg',
+        'link',
+        'text',
+        'cRed',
+        'cGreen',
+        'cBlue',
+        'cOrange'
+      ],
+      userPalette: {},
       intersectionObserver: null,
-      thirdColumnModeOptions: ['none', 'notifications', 'postform'].map(mode => ({
-        key: mode,
-        value: mode,
-        label: this.$t(`settings.third_column_mode_${mode}`)
-      })),
       forcedRoundnessOptions: ['disabled', 'sharp', 'nonsharp', 'round'].map((mode, i) => ({
         key: mode,
         value: i - 1,
         label: this.$t(`settings.style.themes3.hacks.forced_roundness_mode_${mode}`)
       })),
-      underlayOverrideModes: ['none', 'opaque', 'transparent'].map((mode, i) => ({
+      underlayOverrideModes: ['none', 'opaque', 'transparent'].map((mode) => ({
         key: mode,
         value: mode,
         label: this.$t(`settings.style.themes3.hacks.underlay_override_mode_${mode}`)
-      }))
+      })),
+      backgroundUploading: false,
+      background: null,
+      backgroundPreview: null,
     }
   },
   components: {
@@ -60,34 +70,79 @@ const AppearanceTab = {
     FloatSetting,
     UnitSetting,
     ProfileSettingIndicator,
-    FontControl,
-    Preview
+    Preview,
+    PaletteEditor
   },
   mounted () {
-    getThemes()
-      .then((promises) => {
-        return Promise.all(
-          Object.entries(promises)
-            .map(([k, v]) => v.then(res => [k, res]))
-        )
+    useInterfaceStore().getThemeData()
+
+    const updateIndex = (resource) => {
+      const capitalizedResource = resource[0].toUpperCase() + resource.slice(1)
+      const currentIndex = this.$store.state.instance[`${resource}sIndex`]
+
+      let promise
+      if (currentIndex) {
+        promise = Promise.resolve(currentIndex)
+      } else {
+        promise = useInterfaceStore()[`fetch${capitalizedResource}sIndex`]()
+      }
+
+      return promise.then(index => {
+        return Object
+          .entries(index)
+          .map(([k, func]) => [k, func()])
       })
-      .then(themes => themes.reduce((acc, [k, v]) => {
-        if (v) {
-          return [
-            ...acc,
-            {
-              name: v.name || v[0],
-              key: k,
-              data: v
-            }
-          ]
+    }
+
+    updateIndex('style').then(styles => {
+      styles.forEach(([key, stylePromise]) => stylePromise.then(data => {
+        const meta = data.find(x => x.component === '@meta')
+        this.availableThemesV3.push({ key, data, name: meta.directives.name, version: 'v3' })
+      }))
+    })
+
+    updateIndex('theme').then(themes => {
+      themes.forEach(([key, themePromise]) => themePromise.then(data => {
+        if (!data) {
+          console.warn(`Theme with key ${key} is empty or malformed`)
+        } else if (Array.isArray(data)) {
+          console.warn(`Theme with key ${key} is a v1 theme and should be moved to static/palettes/index.json`)
+        } else if (!data.source && !data.theme) {
+          console.warn(`Theme with key ${key} is malformed`)
         } else {
-          return acc
+          this.availableThemesV2.push({ key, data, name: data.name, version: 'v2' })
         }
-      }, []))
-      .then((themesComplete) => {
-        this.availableStyles = themesComplete
-      })
+      }))
+    })
+
+    this.userPalette = useInterfaceStore().paletteDataUsed || {}
+
+    updateIndex('palette').then(bundledPalettes => {
+      bundledPalettes.forEach(([key, palettePromise]) => palettePromise.then(v => {
+        let palette
+        if (Array.isArray(v)) {
+          const [
+            name,
+            bg,
+            fg,
+            text,
+            link,
+            cRed = '#FF0000',
+            cGreen = '#00FF00',
+            cBlue = '#0000FF',
+            cOrange = '#E3FF00'
+          ] = v
+          palette = { key, name, bg, fg, text, link, cRed, cBlue, cGreen, cOrange }
+        } else {
+          palette = { key, ...v }
+        }
+        if (!palette.key.startsWith('style.')) {
+          this.bundledPalettes.push(palette)
+        }
+      }))
+    })
+
+    this.previewTheme('stock', 'v3')
 
     if (window.IntersectionObserver) {
       this.intersectionObserver = new IntersectionObserver((entries, observer) => {
@@ -95,13 +150,15 @@ const AppearanceTab = {
           if (!isIntersecting) return
           const theme = this.availableStyles.find(x => x.key === target.dataset.themeKey)
           this.$nextTick(() => {
-            if (theme) theme.ready = true
+            if (theme) this.previewTheme(theme.key, theme.version, theme.data)
           })
           observer.unobserve(target)
         })
       }, {
         root: this.$refs.themeList
       })
+    } else {
+      this.availableStyles.forEach(theme => this.previewTheme(theme.key, theme.version, theme.data))
     }
   },
   updated () {
@@ -111,84 +168,269 @@ const AppearanceTab = {
       })
     })
   },
+  watch: {
+    paletteDataUsed () {
+      this.userPalette = this.paletteDataUsed || {}
+    }
+  },
   computed: {
+    isDefaultBackground () {
+      return !(this.$store.state.users.currentUser.background_image)
+    },
+    switchInProgress () {
+      return useInterfaceStore().themeChangeInProgress
+    },
+    paletteDataUsed () {
+      return useInterfaceStore().paletteDataUsed
+    },
+    availableStyles () {
+      return [
+        ...this.availableThemesV3,
+        ...this.availableThemesV2
+      ]
+    },
+    availablePalettes () {
+      return [
+        ...this.bundledPalettes,
+        ...this.stylePalettes
+      ]
+    },
+    stylePalettes () {
+      const ruleset = useInterfaceStore().styleDataUsed || []
+      if (!ruleset && ruleset.length === 0) return
+      const meta = ruleset.find(x => x.component === '@meta')
+      const result = ruleset.filter(x => x.component.startsWith('@palette'))
+        .map(x => {
+          const { variant, directives } = x
+          const {
+            bg,
+            fg,
+            text,
+            link,
+            accent,
+            cRed,
+            cBlue,
+            cGreen,
+            cOrange,
+            wallpaper
+          } = directives
+
+          const result = {
+            name: `${meta.directives.name || this.$t('settings.style.themes3.palette.imported')}: ${variant}`,
+            key: `style.${variant.toLowerCase().replace(/ /g, '_')}`,
+            bg,
+            fg,
+            text,
+            link,
+            accent,
+            cRed,
+            cBlue,
+            cGreen,
+            cOrange,
+            wallpaper
+          }
+          return Object.fromEntries(Object.entries(result).filter(([, v]) => v))
+        })
+      return result
+    },
     noIntersectionObserver () {
       return !window.IntersectionObserver
     },
-    horizontalUnits () {
-      return defaultHorizontalUnits
+    instanceWallpaper () {
+      console.log(this.$store.state.instance.background)
+      this.$store.state.instance.background
     },
-    fontsOverride () {
-      return this.$store.getters.mergedConfig.fontsOverride
-    },
-    columns () {
-      const mode = this.$store.getters.mergedConfig.thirdColumnMode
-
-      const notif = mode === 'none' ? [] : ['notifs']
-
-      if (this.$store.getters.mergedConfig.sidebarRight || mode === 'postform') {
-        return [...notif, 'content', 'sidebar']
-      } else {
-        return ['sidebar', 'content', ...notif]
-      }
-    },
-    instanceSpecificPanelPresent () { return this.$store.state.instance.showInstanceSpecificPanel },
     instanceWallpaperUsed () {
       return this.$store.state.instance.background &&
         !this.$store.state.users.currentUser.background_image
     },
-    instanceShoutboxPresent () { return this.$store.state.instance.shoutAvailable },
-    language: {
-      get: function () { return this.$store.getters.mergedConfig.interfaceLanguage },
-      set: function (val) {
-        this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
-      }
+    customThemeVersion () {
+      const { themeVersion } = useInterfaceStore()
+      return themeVersion
     },
     isCustomThemeUsed () {
-      const { theme } = this.mergedConfig
-      return theme === 'custom' || theme === null
+      const { customTheme, customThemeSource } = this.mergedConfig
+      return customTheme != null || customThemeSource != null
+    },
+    isCustomStyleUsed () {
+      const { styleCustomData } = this.mergedConfig
+      return styleCustomData != null
     },
     ...SharedComputedObject()
   },
   methods: {
-    updateFont (key, value) {
-      console.log(key, value)
-      this.$store.dispatch('setOption', {
-        name: 'theme3hacks',
-        value: {
-          ...this.mergedConfig.theme3hacks,
-          fonts: {
-            ...this.mergedConfig.theme3hacks.fonts,
-            [key]: value
-          }
-        }
-      })
+    importFile () {
+      this.fileImporter.importData()
+    },
+    importParser (file, filename) {
+      if (filename.endsWith('.json')) {
+        return JSON.parse(file)
+      } else if (filename.endsWith('.iss')) {
+        return deserialize(file)
+      }
+    },
+    onImport (parsed, filename) {
+      if (filename.endsWith('.json')) {
+        useInterfaceStore().setThemeCustom(parsed.source || parsed.theme)
+      } else if (filename.endsWith('.iss')) {
+        useInterfaceStore().setStyleCustom(parsed)
+      }
+    },
+    onImportFailure (result) {
+      console.error('Failure importing theme:', result)
+      useInterfaceStore().pushGlobalNotice({ messageKey: 'settings.invalid_theme_imported', level: 'error' })
+    },
+    importValidator (parsed, filename) {
+      if (filename.endsWith('.json')) {
+        const version = parsed._pleroma_theme_version
+        return version >= 1 || version <= 2
+      } else if (filename.endsWith('.iss')) {
+        if (!Array.isArray(parsed)) return false
+        if (parsed.length < 1) return false
+        if (parsed.find(x => x.component === '@meta') == null) return false
+        return true
+      }
     },
     isThemeActive (key) {
-      const { theme } = this.mergedConfig
-      return key === theme
+      return key === (this.mergedConfig.theme || this.$store.state.instance.theme)
     },
-    setTheme (name) {
-      this.$store.dispatch('setTheme', { themeName: name, saveData: true, recompile: true })
+    isStyleActive (key) {
+      return key === (this.mergedConfig.style || this.$store.state.instance.style)
     },
-    previewTheme (key, input) {
-      const style = normalizeThemeData(input)
-      const x = 2
-      if (x === 1) return
-      const theme2 = convertTheme2To3(style)
-      const theme3 = init({
-        inputRuleset: theme2,
-        ultimateBackgroundColor: '#000000',
-        liteMode: true,
-        debug: true,
-        onlyNormalState: true
-      })
+    isPaletteActive (key) {
+      return key === (this.mergedConfig.palette || this.$store.state.instance.palette)
+    },
+    ...mapActions(useInterfaceStore, [
+      'setStyle',
+      'setTheme'
+    ]),
+    setPalette (name, data) {
+      useInterfaceStore().setPalette(name)
+      this.userPalette = data
+    },
+    setPaletteCustom (data) {
+      useInterfaceStore().setPaletteCustom(data)
+      this.userPalette = data
+    },
+    resetTheming () {
+      useInterfaceStore().setStyle('stock')
+    },
+    previewTheme (key, version, input) {
+      let theme3
+      if (this.compilationCache[key]) {
+        theme3 = this.compilationCache[key]
+      } else if (input) {
+        if (version === 'v2') {
+          const style = normalizeThemeData(input)
+          const theme2 = convertTheme2To3(style)
+          theme3 = init({
+            inputRuleset: theme2,
+            ultimateBackgroundColor: '#000000',
+            liteMode: true,
+            debug: true,
+            onlyNormalState: true
+          })
+        } else if (version === 'v3') {
+          const palette = input.find(x => x.component === '@palette')
+          let paletteRule
+          if (palette) {
+            const { directives } = palette
+            directives.link = directives.link || directives.accent
+            directives.accent = directives.accent || directives.link
+            paletteRule = {
+              component: 'Root',
+              directives: Object.fromEntries(
+                Object
+                  .entries(directives)
+                  .filter(([k]) => k && k !== 'name')
+                  .map(([k, v]) => ['--' + k, 'color | ' + v])
+              )
+            }
+          } else {
+            paletteRule = null
+          }
 
-      return getScopedVersion(
-        getCssRules(theme3.eager),
-        '#theme-preview-' + key
-      ).join('\n')
-    }
+          theme3 = init({
+            inputRuleset: [...input, paletteRule].filter(x => x),
+            ultimateBackgroundColor: '#000000',
+            liteMode: true,
+            onlyNormalState: true
+          })
+        }
+      } else {
+        theme3 = init({
+          inputRuleset: [],
+          ultimateBackgroundColor: '#000000',
+          liteMode: true,
+          onlyNormalState: true
+        })
+      }
+
+      if (!this.compilationCache[key]) {
+        this.compilationCache[key] = theme3
+      }
+
+
+      const sheet = createStyleSheet('appearance-tab-previews', 90)
+      sheet.addRule([
+        '#theme-preview-', key, ' {\n',
+        getCssRules(theme3.eager).join('\n'),
+        '\n}'
+      ].join(''))
+      sheet.ready = true
+      adoptStyleSheets()
+    },
+    uploadFile (slot, e) {
+      const file = e.target.files[0]
+      if (!file) { return }
+      if (file.size > this.$store.state.instance[slot + 'limit']) {
+        const filesize = fileSizeFormatService.fileSizeFormat(file.size)
+        const allowedsize = fileSizeFormatService.fileSizeFormat(this.$store.state.instance[slot + 'limit'])
+        useInterfaceStore().pushGlobalNotice({
+          messageKey: 'upload.error.message',
+          messageArgs: [
+            this.$t('upload.error.file_too_big', {
+              filesize: filesize.num,
+              filesizeunit: filesize.unit,
+              allowedsize: allowedsize.num,
+              allowedsizeunit: allowedsize.unit
+            })
+          ],
+          level: 'error'
+        })
+        return
+      }
+
+      const reader = new FileReader()
+      reader.onload = ({ target }) => {
+        const img = target.result
+        this[slot + 'Preview'] = img
+        this[slot] = file
+      }
+      reader.readAsDataURL(file)
+    },
+    resetBackground () {
+      const confirmed = window.confirm(this.$t('settings.reset_background_confirm'))
+      if (confirmed) {
+        this.submitBackground('')
+      }
+    },
+    resetUploadedBackground () {
+      this.backgroundPreview = null
+    },
+    submitBackground (background) {
+      if (!this.backgroundPreview && background !== '') { return }
+
+      this.backgroundUploading = true
+      this.$store.state.api.backendInteractor.updateProfileImages({ background })
+        .then((data) => {
+          this.$store.commit('addNewUsers', [data])
+          this.$store.commit('setCurrentUser', data)
+          this.backgroundPreview = null
+        })
+        .catch(this.displayUploadError)
+        .finally(() => { this.backgroundUploading = false })
+    },
   }
 }
 
diff --git a/src/components/settings_modal/tabs/appearance_tab.scss b/src/components/settings_modal/tabs/appearance_tab.scss
new file mode 100644
index 000000000..eadfa090d
--- /dev/null
+++ b/src/components/settings_modal/tabs/appearance_tab.scss
@@ -0,0 +1,252 @@
+.appearance-tab {
+  margin: 1em;
+
+  h3 {
+    border: none
+  }
+
+  .palette,
+  .theme-notice {
+    padding: 0.5em;
+  }
+
+  .theme-name {
+    font-weight: 900;
+    padding-bottom: 0.5em;
+  }
+
+  input[type="file"] {
+    padding: 0.25em;
+    height: auto;
+  }
+
+  .banner-background {
+    display: flex;
+    gap: 1em;
+    flex-wrap: wrap;
+
+    h4 {
+      margin: 0;
+    }
+  }
+
+  .banner-background-input {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 0.5em;
+
+    .custom-bg-control {
+      display: grid;
+      gap: 0.5em;
+      grid-template-columns: 1fr 1fr;
+    }
+  }
+
+  .banner-background-preview {
+    display: flex;
+    max-width: 100%;
+    width: 300px;
+    position: relative;
+
+    img {
+      width: 100%;
+    }
+
+    .fun-monitor {
+      position: relative;
+      pointer-events: none;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+
+      * {
+        line-height: 1;
+      }
+
+      &-display-bezel,
+      &-display-screen {
+        aspect-ratio: 16 / 9;
+        width: 16em;
+      }
+
+      img {
+        object-fit: cover;
+      }
+
+      .wallpaper {
+        position: absolute;
+        inset: 0;
+        background-color: var(--wallpaper);
+      }
+
+      &-display-uploading {
+        position: absolute;
+        inset: 0;
+        z-index: 1;
+        display: flex;
+        place-items: center;
+        place-content: center;
+        background-color: rgb(0 0 0 / 60%);
+        font-size: 4em;
+      }
+
+      &-display-screen {
+        padding: 0;
+        overflow: hidden;
+        position: relative;
+
+        &-overlay {
+          background: transparent;
+          position: absolute;
+          inset: 0;
+          z-index: 2;
+        }
+
+        &-image {
+          aspect-ratio: 16 / 9
+        }
+      }
+
+      &-display-bezel {
+        padding: 1em;
+        margin: 0;
+        order: 1;
+        z-index: 3;
+      }
+
+      &-neck {
+        width: 5em;
+        height: 3em;
+        margin-top: -1em;
+        margin-bottom: -0.5em;
+        order: 2
+      }
+
+      &-stand {
+        width: 8em;
+        height: 1em;
+        order: 3;
+        z-index: 1
+      }
+    }
+  }
+
+  .palettes-container {
+    height: 15em;
+    overflow: hidden auto;
+    scrollbar-gutter: stable;
+    border-radius: var(--roundness);
+    border: 1px solid var(--border);
+    margin-bottom: 0.5em;
+    margin-top: 0;
+    padding: 0.5em;
+  }
+
+  .palettes {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-gap: 0.5em;
+    padding: 0.5em;
+    width: 100%;
+
+    h5 {
+      grid-column: 1 / span 2;
+      margin-bottom: 0;
+    }
+  }
+
+  .palette-entry {
+    display: grid;
+    grid-template-columns: 1fr auto;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0 0.5em;
+    height: max-content;
+
+    .palette-label {
+      height: auto;
+
+      label {
+        text-align: center;
+      }
+    }
+
+    .palette-square {
+      flex: 0 0 auto;
+      display: inline-block;
+      min-width: 1em;
+      min-height: 1em;
+    }
+  }
+
+  .column-settings {
+    display: flex;
+    justify-content: space-evenly;
+    flex-wrap: wrap;
+  }
+
+  .column-settings .size-label {
+    display: block;
+    margin-bottom: 0.5em;
+    margin-top: 0.5em;
+  }
+
+  .modal-view.-mobile & {
+    .palettes {
+      grid-template-columns: 1fr;
+    }
+
+    .palette-entry {
+      grid-column: 1;
+      justify-content: center;
+    }
+
+    .palette-label {
+      line-height: 1.5em;
+      margin-top: 0.5em;
+    }
+  }
+
+  .palette-preview {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 1fr;
+    grid-template-rows: 1em 1em;
+    margin: 0.5em 0;
+  }
+
+  .theme-list {
+    list-style: none;
+    display: flex;
+    flex-wrap: wrap;
+    margin: -0.5em 0;
+    height: 25em;
+    overflow: hidden auto;
+    scrollbar-gutter: stable;
+    border-radius: var(--roundness);
+    border: 1px solid var(--border);
+    padding: 0;
+    margin-bottom: 1em;
+
+    .theme-preview {
+      font-size: 1rem; // fix for firefox
+      width: 14rem;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      margin: 0.5em;
+
+      &.placeholder {
+        opacity: 0.2;
+      }
+
+      .theme-preview-container {
+        pointer-events: none;
+        zoom: 0.5;
+        border: none;
+        border-radius: var(--roundness);
+        text-align: left;
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue
index de6eb8e70..75a06388d 100644
--- a/src/components/settings_modal/tabs/appearance_tab.vue
+++ b/src/components/settings_modal/tabs/appearance_tab.vue
@@ -1,214 +1,227 @@
 <template>
-  <div class="appearance-tab" :label="$t('settings.general')">
-    <div class="setting-item">
-      <h2>{{ $t('settings.theme') }}</h2>
+  <div
+    class="appearance-tab"
+    :label="$t('settings.interface')"
+    icon="table-columns"
+  >
+    <div
+      class="setting-section"
+      :label="$t('settings.theme')"
+      icon="paintbrush"
+    >
+      <h3>{{ $t('settings.style.style_section') }}</h3>
       <ul
-        class="theme-list"
         ref="themeList"
+        class="theme-list"
       >
+        <button
+          class="button-default theme-preview"
+          data-theme-key="stock"
+          :class="{ toggled: isStyleActive('stock'), disabled: switchInProgress }"
+          :disabled="switchInProgress"
+          @click="resetTheming"
+        >
+          <preview id="theme-preview-stock" />
+          <span class="theme-name">
+            {{ $t('settings.style.stock_theme_used') }}
+            <span class="alert neutral version">v3</span>
+          </span>
+        </button>
         <button
           v-if="isCustomThemeUsed"
           disabled
-          class="button-default theme-preview"
+          class="button-default theme-preview toggled"
         >
           <preview />
-          <h4 class="theme-name">{{ $t('settings.style.custom_theme_used') }}</h4>
+          <span class="theme-name">
+            {{ $t('settings.style.custom_theme_used') }}
+            <span class="alert neutral version">v2</span>
+          </span>
+        </button>
+        <button
+          v-if="isCustomStyleUsed"
+          disabled
+          class="button-default theme-preview toggled"
+        >
+          <preview />
+          <span class="theme-name">
+            {{ $t('settings.style.custom_style_used') }}
+            <span class="alert neutral version">v3</span>
+          </span>
         </button>
         <button
           v-for="style in availableStyles"
-          :data-theme-key="style.key"
           :key="style.key"
+          :data-theme-key="style.key"
           class="button-default theme-preview"
-          :class="{ toggled: isThemeActive(style.key) }"
-          @click="setTheme(style.key)"
+          :class="{ toggled: isThemeActive(style.key), disabled: switchInProgress }"
+          :disabled="switchInProgress"
+          @click="style.version === 'v2' ? setTheme(style.key) : setStyle(style.key)"
         >
-          <!-- eslint-disable vue/no-v-text-v-html-on-component -->
-          <component
-            :is="'style'"
-            v-if="style.ready || noIntersectionObserver"
-            v-html="previewTheme(style.key, style.data)"
-          />
-          <!-- eslint-enable vue/no-v-text-v-html-on-component -->
-          <preview :class="{ placeholder: ready }" :id="'theme-preview-' + style.key"/>
-          <h4 class="theme-name">{{ style.name }}</h4>
+          <preview :id="'theme-preview-' + style.key" />
+          <span class="theme-name">
+            {{ style.name }}
+            <span class="alert neutral version">{{ style.version }}</span>
+          </span>
         </button>
       </ul>
-    </div>
-    <div class="alert neutral theme-notice">
-      {{ $t("settings.style.appearance_tab_note") }}
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.scale_and_layout') }}</h2>
-      <ul class="setting-list">
-        <li>
-          <UnitSetting
-            path="textSize"
-            step="0.1"
-            :units="['px', 'rem']"
-            :reset-default="{ 'px': 14, 'rem': 1 }"
-            timed-apply-mode
-          >
-            {{ $t('settings.text_size') }}
-          </UnitSetting>
-          <div>
-            <small>
-              <i18n-t
-                scope="global"
-                keypath="settings.text_size_tip"
-                tag="span"
-              >
-                <code>px</code>
-                <code>rem</code>
-              </i18n-t>
-              <br/>
-              <i18n-t
-                scope="global"
-                keypath="settings.text_size_tip2"
-                tag="span"
-              >
-                <code>14px</code>
-              </i18n-t>
-            </small>
-          </div>
-        </li>
-        <li>
-          <h3>{{ $t('settings.style.interface_font_user_override') }}</h3>
-          <ul class="setting-list">
-            <li>
-              <FontControl
-                :model-value="mergedConfig.theme3hacks.fonts.interface"
-                name="ui"
-                :label="$t('settings.style.fonts.components.interface')"
-                :fallback="{ family: 'sans-serif' }"
-                no-inherit="1"
-                @update:modelValue="v => updateFont('interface', v)"
-              />
-            </li>
-            <li>
-              <FontControl
-                v-if="expertLevel > 0"
-                :model-value="mergedConfig.theme3hacks.fonts.input"
-                name="input"
-                :fallback="{ family: 'inherit' }"
-                :label="$t('settings.style.fonts.components.input')"
-                @update:modelValue="v => updateFont('input', v)"
-              />
-            </li>
-            <li>
-              <FontControl
-                v-if="expertLevel > 0"
-                :model-value="mergedConfig.theme3hacks.fonts.post"
-                name="post"
-                :fallback="{ family: 'inherit' }"
-                :label="$t('settings.style.fonts.components.post')"
-                @update:modelValue="v => updateFont('post', v)"
-              />
-            </li>
-            <li>
-              <FontControl
-                v-if="expertLevel > 0"
-                :model-value="mergedConfig.theme3hacks.fonts.monospace"
-                name="postCode"
-                :fallback="{ family: 'monospace' }"
-                :label="$t('settings.style.fonts.components.monospace')"
-                @update:modelValue="v => updateFont('monospace', v)"
-              />
-            </li>
-          </ul>
-        </li>
-        <li>
-          <UnitSetting
-            path="emojiSize"
-            step="0.1"
-            :units="['px', 'rem']"
-            :reset-default="{ 'px': 32, 'rem': 2.2 }"
-          >
-            {{ $t('settings.emoji_size') }}
-          </UnitSetting>
-          <ul
-            class="setting-list suboptions"
-          >
-            <li>
-              <FloatSetting
-                v-if="user"
-                path="emojiReactionsScale"
-                expert="1"
-              >
-                {{ $t('settings.emoji_reactions_scale') }}
-              </FloatSetting>
-            </li>
-          </ul>
-        </li>
-        <li>
-          <UnitSetting
-            path="navbarSize"
-            step="0.1"
-            :units="['px', 'rem']"
-            :reset-default="{ 'px': 55, 'rem': 3.5 }"
-          >
-            {{ $t('settings.navbar_size') }}
-          </UnitSetting>
-        </li>
-        <h3>{{ $t('settings.columns') }}</h3>
-        <li>
-          <UnitSetting
-            path="panelHeaderSize"
-            step="0.1"
-            :units="['px', 'rem']"
-            :reset-default="{ 'px': 52, 'rem': 3.2 }"
-            timed-apply-mode
-          >
-            {{ $t('settings.panel_header_size') }}
-          </UnitSetting>
-        </li>
-        <li>
-          <BooleanSetting path="sidebarRight">
-            {{ $t('settings.right_sidebar') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="navbarColumnStretch">
-            {{ $t('settings.navbar_column_stretch') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <ChoiceSetting
-            v-if="user"
-            id="thirdColumnMode"
-            path="thirdColumnMode"
-            :options="thirdColumnModeOptions"
-          >
-            {{ $t('settings.third_column_mode') }}
-          </ChoiceSetting>
-        </li>
-        <li v-if="expertLevel > 0">
-          {{ $t('settings.column_sizes') }}
-          <div class="column-settings">
-            <UnitSetting
-              v-for="column in columns"
-              :key="column"
-              :path="column + 'ColumnWidth'"
-              :units="horizontalUnits"
-              expert="1"
+      <div class="import-file-container">
+        <button
+          class="btn button-default"
+          :class="{ disabled: switchInProgress }"
+          :disabled="switchInProgress"
+          @click="importFile"
+        >
+          <FAIcon icon="folder-open" />
+          {{ $t('settings.style.themes3.editor.load_style') }}
+        </button>
+        <h4>{{ $t('settings.style.themes3.palette.label') }}</h4>
+        <div
+          v-if="customThemeVersion === 'v3'"
+          class="palettes-container"
+        >
+          <h5 v-if="stylePalettes?.length > 0">
+            {{ $t('settings.style.themes3.palette.style') }}
+          </h5>
+          <div class="palettes">
+            <button
+              v-for="p in stylePalettes || []"
+              :key="p.name"
+              class="btn button-default palette-entry"
+              :class="{ toggled: isPaletteActive(p.key), disabled: switchInProgress }"
+              :disabled="switchInProgress"
+              @click="() => setPalette(p.key, p)"
             >
-              {{ $t('settings.column_sizes_' + column) }}
-            </UnitSetting>
+              <div class="palette-label">
+                <label>
+                  {{ p.name ?? $t('settings.style.themes3.palette.user') }}
+                </label>
+              </div>
+              <div class="palette-preview">
+                <span
+                  v-for="c in palettesKeys"
+                  :key="c"
+                  class="palette-square"
+                  :style="{ backgroundColor: p[c], border: '1px solid ' + (p[c] ?? 'var(--text)') }"
+                />
+              </div>
+            </button>
+            <h5>{{ $t('settings.style.themes3.palette.bundled') }}</h5>
+            <button
+              v-for="p in bundledPalettes"
+              :key="p.name"
+              class="btn button-default palette-entry"
+              :class="{ toggled: isPaletteActive(p.key), disabled: switchInProgress }"
+              :disabled="switchInProgress"
+              @click="() => setPalette(p.key, p)"
+            >
+              <div class="palette-label">
+                <label>
+                  {{ p.name }}
+                </label>
+              </div>
+              <div class="palette-preview">
+                <span
+                  v-for="c in palettesKeys"
+                  :key="c"
+                  class="palette-square"
+                  :style="{ backgroundColor: p[c], border: '1px solid ' + (p[c] ?? 'var(--text)') }"
+                />
+              </div>
+            </button>
           </div>
-        </li>
-        <li>
-          <BooleanSetting path="disableStickyHeaders">
-            {{ $t('settings.disable_sticky_headers') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="showScrollbars">
-            {{ $t('settings.show_scrollbars') }}
-          </BooleanSetting>
-        </li>
-      </ul>
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.visual_tweaks') }}</h2>
+        </div>
+        <div>
+          <template v-if="customThemeVersion === 'v3'">
+            <h5 v-if="expertLevel > 0">
+              {{ $t('settings.style.themes3.palette.user') }}
+            </h5>
+            <PaletteEditor
+              v-if="expertLevel > 0"
+              v-model="userPalette"
+              class="userPalette"
+              :compact="true"
+              :apply="true"
+              :disabled="switchInProgress"
+              @apply-palette="data => setPaletteCustom(data)"
+            />
+          </template>
+          <template v-else-if="customThemeVersion === 'v2'">
+            <div class="alert neutral theme-notice unsupported-theme-v2">
+              {{ $t('settings.style.themes3.palette.v2_unsupported') }}
+            </div>
+          </template>
+        </div>
+      </div>
+      <h3>{{ $t('settings.background') }}</h3>
+      <div class="banner-background">
+        <div class="banner-background-preview">
+          <div class="fun-monitor">
+            <div class="fun-monitor-stand button-default" />
+            <div class="fun-monitor-neck button-default" />
+            <div class="fun-monitor-display-bezel button-default">
+              <div class="fun-monitor-display-screen input">
+                <img
+                  v-if="backgroundPreview || user.background_image || instanceWallpaper"
+                  class="fun-monitor-display-screen-image"
+                  :src="backgroundPreview || user.background_image || instanceWallpaper"
+                >
+                <div
+                  v-else
+                  class="wallpaper"
+                />
+                <div class="fun-monitor-display-screen-overlay input" />
+                <div
+                  v-if="backgroundUploading"
+                  class="fun-monitor-display-uploading"
+                >
+                  <FAIcon
+                    class="fun-monitor-display-screen-uploading"
+                    spin
+                    icon="circle-notch"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="banner-background-input">
+          <h4>{{ $t('settings.set_new_background') }}</h4>
+          <input
+            type="file"
+            class="input"
+            @change="uploadFile('background', $event)"
+          >
+          <div class="custom-bg-control">
+            <button
+              :disabled="!backgroundPreview"
+              class="btn button-default"
+              @click="submitBackground(background)"
+            >
+              {{ $t('settings.save') }}
+            </button>
+            <button
+              :disabled="!backgroundPreview"
+              class="btn button-default"
+              @click="resetUploadedBackground"
+            >
+              {{ $t('settings.reset') }}
+            </button>
+          </div>
+          <button
+            v-if="!isDefaultBackground"
+            class="btn button-default reset-button"
+            :title="$t('settings.reset_profile_background')"
+            @click="resetBackground"
+          >
+            {{ $t('settings.reset_profile_background') }}
+          </button>
+        </div>
+      </div>
+      <h3>{{ $t('settings.visual_tweaks') }}</h3>
+      <div class="alert neutral theme-notice">
+        {{ $t("settings.style.visual_tweaks_section_note") }}
+      </div>
       <ul class="setting-list">
         <li>
           <ChoiceSetting
@@ -233,22 +246,6 @@
             {{ $t('settings.hide_wallpaper') }}
           </BooleanSetting>
         </li>
-        <li>
-          <BooleanSetting
-            path="forceThemeRecompilation"
-            :expert="1"
-          >
-            {{ $t('settings.force_theme_recompilation_debug') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="themeDebug"
-            :expert="1"
-          >
-            {{ $t('settings.theme_debug') }}
-          </BooleanSetting>
-        </li>
       </ul>
     </div>
   </div>
@@ -256,58 +253,4 @@
 
 <script src="./appearance_tab.js"></script>
 
-<style lang="scss">
-.appearance-tab {
-  .theme-notice {
-    padding: 0.5em;
-    margin: 1em;
-  }
-
-  .column-settings {
-    display: flex;
-    justify-content: space-evenly;
-    flex-wrap: wrap;
-  }
-
-  .column-settings .size-label {
-    display: block;
-    margin-bottom: 0.5em;
-    margin-top: 0.5em;
-  }
-
-  .theme-list {
-    list-style: none;
-    display: flex;
-    flex-wrap: wrap;
-    margin: -0.5em 0;
-    height: 25em;
-    overflow-x: hidden;
-    overflow-y: auto;
-    scrollbar-gutter: stable;
-    border-radius: var(--roundness);
-    border: 1px solid var(--border);
-    padding: 0;
-
-    .theme-preview {
-      font-size: 1rem; // fix for firefox
-      width: 19rem;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      margin: 0.5em;
-
-      &.placeholder {
-        opacity: 0.2;
-      }
-
-      .theme-preview-container {
-        pointer-events: none;
-        zoom: 0.5;
-        border: none;
-        border-radius: var(--roundness);
-        text-align: left;
-      }
-    }
-  }
-}
-</style>
+<style lang="scss" src="./appearance_tab.scss"></style>
diff --git a/src/components/settings_modal/tabs/clutter_tab.js b/src/components/settings_modal/tabs/clutter_tab.js
new file mode 100644
index 000000000..8e12104fc
--- /dev/null
+++ b/src/components/settings_modal/tabs/clutter_tab.js
@@ -0,0 +1,194 @@
+import { mapState, mapActions } from 'pinia'
+import { mapState as mapVuexState } from 'vuex'
+import { v4 as uuidv4 } from 'uuid';
+
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import UnitSetting from '../helpers/unit_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import HelpIndicator from '../helpers/help_indicator.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import Select from 'src/components/select/select.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+
+const ClutterTab = {
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    UnitSetting,
+    IntegerSetting,
+    Checkbox,
+    Select,
+    HelpIndicator
+  },
+  computed: {
+    instanceSpecificPanelPresent () { return this.$store.state.instance.showInstanceSpecificPanel },
+    ...SharedComputedObject(),
+    ...mapState(
+      useServerSideStorageStore,
+      {
+        muteFilters: store => Object.entries(store.prefsStorage.simple.muteFilters),
+        muteFiltersObject: store => store.prefsStorage.simple.muteFilters
+      }
+    ),
+    ...mapVuexState({
+      blockExpirationSupported: state => state.instance.blockExpiration
+    }),
+    onMuteDefaultActionLv1: {
+      get () {
+        const value = this.$store.state.config.onMuteDefaultAction
+        if (value === 'ask' || value === 'forever') {
+          return value
+        } else {
+          return 'temporarily'
+        }
+      },
+      set (value) {
+        let realValue = value
+        if (value !== 'ask' && value !== 'forever') {
+          realValue = '14d'
+        }
+        this.$store.dispatch('setOption', { name: 'onMuteDefaultAction', value: realValue })
+      }
+    },
+    onBlockDefaultActionLv1: {
+      get () {
+        const value = this.$store.state.config.onBlockDefaultAction
+        if (value === 'ask' || value === 'forever') {
+          return value
+        } else {
+          return 'temporarily'
+        }
+      },
+      set (value) {
+        let realValue = value
+        if (value !== 'ask' && value !== 'forever') {
+          realValue = '14d'
+        }
+        this.$store.dispatch('setOption', { name: 'onBlockDefaultAction', value: realValue })
+      }
+    },
+    muteFiltersDraft () {
+      return Object.entries(this.muteFiltersDraftObject)
+    },
+    muteFiltersExpired () {
+      const now = Date.now()
+      return Object
+        .entries(this.muteFiltersDraftObject)
+        .filter(([, { expires }]) => expires != null && expires <= now)
+    }
+  },
+  methods: {
+    ...mapActions(useServerSideStorageStore, ['setPreference', 'unsetPreference', 'pushServerSideStorage']),
+    getDatetimeLocal (timestamp) {
+      const date = new Date(timestamp)
+      const fmt = new Intl.NumberFormat("en-US", {minimumIntegerDigits: 2})
+      const datetime = [
+        date.getFullYear(),
+        '-',
+        fmt.format(date.getMonth() + 1),
+        '-',
+        fmt.format(date.getDate()),
+        'T',
+        fmt.format(date.getHours()),
+        ':',
+        fmt.format(date.getMinutes())
+      ].join('')
+      return datetime
+    },
+    checkRegexValid (id) {
+      const filter = this.muteFiltersObject[id]
+      if (filter.type !== 'regexp') return true
+      if (filter.type !== 'user_regexp') return true
+      const { value } = filter
+      let valid = true
+      try {
+        new RegExp(value)
+      } catch {
+        valid = false
+        console.error('Invalid RegExp: ' + value)
+      }
+      return valid
+    },
+    createFilter (filter = {
+      type: 'word',
+      value: '',
+      name: 'New Filter',
+      enabled: true,
+      expires: null,
+      hide: false,
+    }) {
+      const newId = uuidv4()
+
+      filter.order = this.muteFilters.length + 2
+      this.muteFiltersDraftObject[newId] = filter
+      this.setPreference({ path: 'simple.muteFilters.' + newId , value: filter })
+      this.pushServerSideStorage()
+    },
+    exportFilter(id) {
+      this.exportedFilter = { ...this.muteFiltersDraftObject[id] }
+      delete this.exportedFilter.order
+      this.filterExporter.exportData()
+    },
+    importFilter() {
+      this.filterImporter.importData()
+    },
+    copyFilter (id) {
+      const filter = { ...this.muteFiltersDraftObject[id] }
+      const newId = uuidv4()
+
+      this.muteFiltersDraftObject[newId] = filter
+      this.setPreference({ path: 'simple.muteFilters.' + newId , value: filter })
+      this.pushServerSideStorage()
+    },
+    deleteFilter (id) {
+      delete this.muteFiltersDraftObject[id]
+      this.unsetPreference({ path: 'simple.muteFilters.' + id , value: null })
+      this.pushServerSideStorage()
+    },
+    purgeExpiredFilters () {
+      this.muteFiltersExpired.forEach(([id]) => {
+        console.log(id)
+        delete this.muteFiltersDraftObject[id]
+        this.unsetPreference({ path: 'simple.muteFilters.' + id , value: null })
+      })
+      this.pushServerSideStorage()
+    },
+    updateFilter(id, field, value) {
+      const filter = { ...this.muteFiltersDraftObject[id] }
+      if (field === 'expires-never') {
+        if (!value) {
+          const offset = 1000 * 60 * 60 * 24 * 14 // 2 weeks
+          const date = Date.now() + offset
+          filter.expires = date
+        } else {
+          filter.expires = null
+        }
+      } else if (field === 'expires') {
+        const parsed = Date.parse(value)
+        filter.expires = parsed.valueOf()
+      } else {
+        filter[field] = value
+      }
+      this.muteFiltersDraftObject[id] = filter
+      this.muteFiltersDraftDirty[id] = true
+    },
+    saveFilter(id) {
+      this.setPreference({ path: 'simple.muteFilters.' + id , value: this.muteFiltersDraftObject[id] })
+      this.pushServerSideStorage()
+      this.muteFiltersDraftDirty[id] = false
+    },
+  },
+  // Updating nested properties
+  watch: {
+    replyVisibility () {
+      this.$store.dispatch('queueFlushAll')
+    }
+  }
+}
+
+export default ClutterTab
diff --git a/src/components/settings_modal/tabs/clutter_tab.vue b/src/components/settings_modal/tabs/clutter_tab.vue
new file mode 100644
index 000000000..daf098f5a
--- /dev/null
+++ b/src/components/settings_modal/tabs/clutter_tab.vue
@@ -0,0 +1,88 @@
+<template>
+  <div class="clutter-tab">
+    <div class="setting-section">
+      <h3>{{ $t('settings.interface') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path="alwaysShowSubjectInput">
+            {{ $t('settings.subject_input_always_show') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="minimalScopesMode">
+            {{ $t('settings.minimal_scopes_mode') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="hidePostStats">
+            {{ $t('settings.hide_post_stats') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="hideUserStats"
+          >
+            {{ $t('settings.hide_user_stats') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="hideBotIndication">
+            {{ $t('settings.hide_actor_type_indication') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="hideScrobbles">
+            {{ $t('settings.hide_scrobbles') }}
+          </BooleanSetting>
+          <ul class="setting-list suboptions">
+            <li>
+              <UnitSetting
+                key="hideScrobblesAfter"
+                path="hideScrobblesAfter"
+                :units="['m', 'h', 'd']"
+                unit-set="time"
+              >
+                {{ $t('settings.hide_scrobbles_after') }}
+              </UnitSetting>
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.attachments') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <IntegerSetting
+            path="maxThumbnails"
+            :min="0"
+          >
+            {{ $t('settings.max_thumbnails') }}
+          </IntegerSetting>
+        </li>
+        <li>
+          <BooleanSetting path="hideAttachments">
+            {{ $t('settings.hide_attachments_in_tl') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="hideAttachmentsInConv">
+            {{ $t('settings.hide_attachments_in_convo') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="userCardHidePersonalMarks">
+            {{ $t('settings.user_card_hide_personal_marks') }}
+          </BooleanSetting>
+        </li>
+        <li v-if="instanceShoutboxPresent">
+          <BooleanSetting
+            path="hideShoutbox"
+          >
+            {{ $t('settings.hide_shoutbox') }}
+          </BooleanSetting>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./clutter_tab.js"></script>
diff --git a/src/components/settings_modal/tabs/composing_tab.js b/src/components/settings_modal/tabs/composing_tab.js
new file mode 100644
index 000000000..7efbe7047
--- /dev/null
+++ b/src/components/settings_modal/tabs/composing_tab.js
@@ -0,0 +1,178 @@
+import { mapState } from 'vuex'
+
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import FloatSetting from '../helpers/float_setting.vue'
+import UnitSetting from '../helpers/unit_setting.vue'
+import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
+import Select from 'src/components/select/select.vue'
+import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
+import FontControl from 'src/components/font_control/font_control.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+import localeService from 'src/services/locale/locale.service.js'
+import { clearCache, cacheKey, emojiCacheKey } from 'src/services/sw/sw.js'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faGlobe,
+  faMessage,
+  faPenAlt,
+  faDatabase,
+  faSliders
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faGlobe,
+  faMessage,
+  faPenAlt,
+  faDatabase,
+  faSliders
+)
+
+const ComposingTab = {
+  props: {
+    parentCollapsed: {
+      required: true,
+      type: Boolean
+    }
+  },
+  data () {
+    return {
+      subjectLineOptions: ['email', 'noop', 'masto'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.subject_line_${mode === 'masto' ? 'mastodon' : mode}`)
+      })),
+      conversationDisplayOptions: ['tree', 'linear'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.conversation_display_${mode}`)
+      })),
+      absoluteTime12hOptions: ['24h', '12h'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.absolute_time_format_12h_${mode}`)
+      })),
+      conversationOtherRepliesButtonOptions: ['below', 'inside'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.conversation_other_replies_button_${mode}`)
+      })),
+      mentionLinkDisplayOptions: ['short', 'full_for_remote', 'full'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.mention_link_display_${mode}`)
+      })),
+      userPopoverAvatarActionOptions: ['close', 'zoom', 'open'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.user_popover_avatar_action_${mode}`)
+      })),
+      unsavedPostActionOptions: ['save', 'discard', 'confirm'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.unsaved_post_action_${mode}`)
+      })),
+      loopSilentAvailable:
+      // Firefox
+      Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') ||
+      // Chrome-likes
+      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'webkitAudioDecodedByteCount') ||
+      // Future spec, still not supported in Nightly 63 as of 08/2018
+      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'audioTracks'),
+      emailLanguage: this.$store.state.users.currentUser.language || ['']
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    FloatSetting,
+    UnitSetting,
+    InterfaceLanguageSwitcher,
+    ProfileSettingIndicator,
+    ScopeSelector,
+    Select,
+    FontControl
+  },
+  computed: {
+    postFormats () {
+      return this.$store.state.instance.postFormats || []
+    },
+    postContentOptions () {
+      return this.postFormats.map(format => ({
+        key: format,
+        value: format,
+        label: this.$t(`post_status.content_type["${format}"]`)
+      }))
+    },
+    language: {
+      get: function () { return this.$store.getters.mergedConfig.interfaceLanguage },
+      set: function (val) {
+        this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
+      }
+    },
+    ...SharedComputedObject(),
+    ...mapState({
+      blockExpirationSupported: state => state.instance.blockExpiration,
+    })
+  },
+  methods: {
+    changeDefaultScope (value) {
+      this.$store.dispatch('setProfileOption', { name: 'defaultScope', value })
+    },
+    clearCache (key) {
+      clearCache(key)
+        .then(() => {
+          this.$store.dispatch('settingsSaved', { success: true })
+        })
+        .catch(error => {
+          this.$store.dispatch('settingsSaved', { error })
+        })
+    },
+    tooSmall () {
+      this.$emit('tooSmall')
+    },
+    tooBig () {
+      this.$emit('tooBig')
+    },
+    getNavMode () {
+      return this.$refs.tabSwitcher.getNavMode()
+    },
+    clearAssetCache () {
+      this.clearCache(cacheKey)
+    },
+    clearEmojiCache () {
+      this.clearCache(emojiCacheKey)
+    },
+    updateProfile () {
+      const params = {
+        language: localeService.internalToBackendLocaleMulti(this.emailLanguage)
+      }
+
+      this.$store.state.api.backendInteractor
+        .updateProfile({ params })
+        .then((user) => {
+          this.$store.commit('addNewUsers', [user])
+          this.$store.commit('setCurrentUser', user)
+        })
+    },
+    updateFont (key, value) {
+      this.$store.dispatch('setOption', {
+        name: 'theme3hacks',
+        value: {
+          ...this.mergedConfig.theme3hacks,
+          fonts: {
+            ...this.mergedConfig.theme3hacks.fonts,
+            [key]: value
+          }
+        }
+      })
+    },
+  }
+}
+
+export default ComposingTab
diff --git a/src/components/settings_modal/tabs/composing_tab.vue b/src/components/settings_modal/tabs/composing_tab.vue
new file mode 100644
index 000000000..f71d64600
--- /dev/null
+++ b/src/components/settings_modal/tabs/composing_tab.vue
@@ -0,0 +1,119 @@
+<template>
+  <div :label="$t('settings.posts')">
+    <div class="setting-section">
+      <h3>{{ $t('settings.general') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <label
+            class="setting-item "
+            for="default-vis"
+          >
+            <span class="setting-label">
+              <ProfileSettingIndicator :is-profile="true" />
+              {{ $t('settings.default_vis') }}
+            </span>
+            <ScopeSelector
+              class="scope-selector setting-control"
+              :show-all="true"
+              :user-default="$store.state.profileConfig.defaultScope"
+              :initial-scope="$store.state.profileConfig.defaultScope"
+              :on-scope-change="changeDefaultScope"
+              :unstyled="false"
+              uns
+            />
+          </label>
+        </li>
+        <li>
+          <!-- <BooleanSetting source="profile" path="defaultNSFW"> -->
+          <BooleanSetting path="sensitiveByDefault">
+            {{ $t('settings.sensitive_by_default') }}
+          </BooleanSetting>
+        </li>
+        <li v-if="postFormats.length > 0">
+          <ChoiceSetting
+            id="postContentType"
+            path="postContentType"
+            :options="postContentOptions"
+          >
+            {{ $t('settings.default_post_status_content_type') }}
+          </ChoiceSetting>
+        </li>
+        <li>
+          <BooleanSetting path="padEmoji">
+            {{ $t('settings.pad_emoji') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="autocompleteSelect"
+            expert="1"
+          >
+            {{ $t('settings.autocomplete_select_first') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="autoSaveDraft"
+          >
+            {{ $t('settings.auto_save_draft') }}
+          </BooleanSetting>
+        </li>
+        <li v-if="!mergedConfig.autoSaveDraft">
+          <ChoiceSetting
+            id="unsavedPostAction"
+            path="unsavedPostAction"
+            :options="unsavedPostActionOptions"
+            expert="1"
+          >
+            {{ $t('settings.unsaved_post_action') }}
+          </ChoiceSetting>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.replies') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting
+            path="scopeCopy"
+          >
+            {{ $t('settings.scope_copy') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <ChoiceSetting
+            id="subjectLineBehavior"
+            path="subjectLineBehavior"
+            :options="subjectLineOptions"
+          >
+            {{ $t('settings.subject_line_behavior') }}
+          </ChoiceSetting>
+        </li>
+      </ul>
+      <h3 v-if="expertLevel > 0">
+        {{ $t('settings.attachments') }}
+      </h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting
+            path="imageCompression"
+            expert="1"
+          >
+            {{ $t('settings.image_compression') }}
+          </BooleanSetting>
+          <ul class="setting-list suboptions">
+            <li>
+              <BooleanSetting
+                path="alwaysUseJpeg"
+                expert="1"
+                parent-path="imageCompression"
+              >
+                {{ $t('settings.always_use_jpeg') }}
+              </BooleanSetting>
+            </li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./composing_tab.js"></script>
diff --git a/src/components/settings_modal/tabs/data_import_export_tab.js b/src/components/settings_modal/tabs/data_import_export_tab.js
index 4895733c9..4304e59c0 100644
--- a/src/components/settings_modal/tabs/data_import_export_tab.js
+++ b/src/components/settings_modal/tabs/data_import_export_tab.js
@@ -2,6 +2,7 @@ import Importer from 'src/components/importer/importer.vue'
 import Exporter from 'src/components/exporter/exporter.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 import { mapState } from 'vuex'
+import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
 
 const DataImportExportTab = {
   data () {
@@ -15,7 +16,7 @@ const DataImportExportTab = {
     }
   },
   created () {
-    this.$store.dispatch('fetchTokens')
+    useOAuthTokensStore().fetchTokens()
     this.fetchBackups()
   },
   components: {
@@ -72,7 +73,6 @@ const DataImportExportTab = {
         // check is it's a local user
         if (user && user.is_local) {
           // append the instance address
-          // eslint-disable-next-line no-undef
           return user.screen_name + '@' + location.hostname
         }
         return user.screen_name
@@ -80,7 +80,7 @@ const DataImportExportTab = {
     },
     addBackup () {
       this.$store.state.api.backendInteractor.addBackup()
-        .then((res) => {
+        .then(() => {
           this.addedBackup = true
           this.addBackupError = false
         })
diff --git a/src/components/settings_modal/tabs/data_import_export_tab.scss b/src/components/settings_modal/tabs/data_import_export_tab.scss
new file mode 100644
index 000000000..477dab66c
--- /dev/null
+++ b/src/components/settings_modal/tabs/data_import_export_tab.scss
@@ -0,0 +1,21 @@
+.data-import-export-tab {
+  .importer-exporter {
+    display: inline-flex;
+    flex-direction: column;
+    gap: 0.5em;
+  }
+
+  table {
+    td, th {
+      line-height: 1.5;
+    }
+
+    th {
+      padding: 0 0.5em;
+    }
+
+    td {
+      padding: 0.5em;
+    }
+  }
+}
diff --git a/src/components/settings_modal/tabs/data_import_export_tab.vue b/src/components/settings_modal/tabs/data_import_export_tab.vue
index 48356c9b5..d5e540b8b 100644
--- a/src/components/settings_modal/tabs/data_import_export_tab.vue
+++ b/src/components/settings_modal/tabs/data_import_export_tab.vue
@@ -1,62 +1,77 @@
 <template>
   <div
+    class="data-import-export-tab"
     :label="$t('settings.data_import_export_tab')"
   >
-    <div class="setting-item">
-      <h2>{{ $t('settings.follow_import') }}</h2>
-      <p>{{ $t('settings.import_followers_from_a_csv_file') }}</p>
-      <Importer
-        :submit-handler="importFollows"
-        :success-message="$t('settings.follows_imported')"
-        :error-message="$t('settings.follow_import_error')"
-      />
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.follow_export') }}</h2>
-      <Exporter
-        :get-content="getFollowsContent"
-        filename="friends.csv"
-        :export-button-label="$t('settings.follow_export_button')"
-      />
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.block_import') }}</h2>
-      <p>{{ $t('settings.import_blocks_from_a_csv_file') }}</p>
-      <Importer
-        :submit-handler="importBlocks"
-        :success-message="$t('settings.blocks_imported')"
-        :error-message="$t('settings.block_import_error')"
-      />
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.block_export') }}</h2>
-      <Exporter
-        :get-content="getBlocksContent"
-        filename="blocks.csv"
-        :export-button-label="$t('settings.block_export_button')"
-      />
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.mute_import') }}</h2>
-      <p>{{ $t('settings.import_mutes_from_a_csv_file') }}</p>
-      <Importer
-        :submit-handler="importMutes"
-        :success-message="$t('settings.mutes_imported')"
-        :error-message="$t('settings.mute_import_error')"
-      />
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.mute_export') }}</h2>
-      <Exporter
-        :get-content="getMutesContent"
-        filename="mutes.csv"
-        :export-button-label="$t('settings.mute_export_button')"
-      />
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.account_backup') }}</h2>
-      <p>{{ $t('settings.account_backup_description') }}</p>
-      <table>
+    <div class="setting-section">
+      <h3>{{ $t('settings.import_export.title') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <h4>{{ $t('settings.import_export.follows') }}</h4>
+          <p>{{ $t('settings.import_followers_from_a_csv_file') }}</p>
+          <div class="importer-exporter">
+            <Importer
+              :submit-handler="importFollows"
+              :success-message="$t('settings.follows_imported')"
+              :error-message="$t('settings.follow_import_error')"
+            />
+            <Exporter
+              :get-content="getFollowsContent"
+              filename="friends.csv"
+              :export-button-label="$t('settings.follow_export_button')"
+            />
+          </div>
+        </li>
+        <li>
+          <h4>{{ $t('settings.import_export.mutes') }}</h4>
+          <p>{{ $t('settings.import_mutes_from_a_csv_file') }}</p>
+          <div class="importer-exporter">
+            <Importer
+              :submit-handler="importMutes"
+              :success-message="$t('settings.mutes_imported')"
+              :error-message="$t('settings.mute_import_error')"
+            />
+            <Exporter
+              :get-content="getMutesContent"
+              filename="friends.csv"
+              :export-button-label="$t('settings.mute_export_button')"
+            />
+          </div>
+        </li>
+        <li>
+          <h4>{{ $t('settings.import_export.blocks') }}</h4>
+          <p>{{ $t('settings.import_blocks_from_a_csv_file') }}</p>
+          <div class="importer-exporter">
+            <Importer
+              :submit-handler="importBlocks"
+              :success-message="$t('settings.blocks_imported')"
+              :error-message="$t('settings.block_import_error')"
+            />
+            <Exporter
+              :get-content="getBlocksContent"
+              filename="friends.csv"
+              :export-button-label="$t('settings.block_export_button')"
+            />
+          </div>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.account_backup') }}</h3>
+      <div class="setting-list">
+        <p>{{ $t('settings.account_backup_description') }}</p>
+        <button
+          class="btn button-default"
+          @click="addBackup"
+        >
+          {{ $t('settings.add_backup') }}
+        </button>
+        <p v-if="addedBackup">
+          {{ $t('settings.added_backup') }}
+        </p>
+        <template v-if="addBackupError !== false">
+          <p>{{ $t('settings.add_backup_error', { error: addBackupError }) }}</p>
+        </template>
+      </div>
+      <table class="setting-list">
         <thead>
           <tr>
             <th>{{ $t('settings.account_backup_table_head') }}</th>
@@ -80,7 +95,7 @@
               <span
                 v-else-if="backup.state === 'running'"
               >
-                {{ $tc('settings.backup_running', backup.processed_number, { number: backup.processed_number }) }}
+                {{ $t('settings.backup_running', { number: backup.processed_number }, backup.processed_number) }}
               </span>
               <span
                 v-else-if="backup.state === 'failed'"
@@ -111,21 +126,9 @@
           />
         </button>
       </div>
-      <button
-        class="btn button-default"
-        @click="addBackup"
-      >
-        {{ $t('settings.add_backup') }}
-      </button>
-      <p v-if="addedBackup">
-        {{ $t('settings.added_backup') }}
-      </p>
-      <template v-if="addBackupError !== false">
-        <p>{{ $t('settings.add_backup_error', { error: addBackupError }) }}</p>
-      </template>
     </div>
   </div>
 </template>
 
 <script src="./data_import_export_tab.js"></script>
-<!-- <style lang="scss" src="./profile.scss"></style> -->
+<style lang="scss" src="./data_import_export_tab.scss"></style>
diff --git a/src/components/settings_modal/tabs/developer_tab.js b/src/components/settings_modal/tabs/developer_tab.js
new file mode 100644
index 000000000..f8f21e9f4
--- /dev/null
+++ b/src/components/settings_modal/tabs/developer_tab.js
@@ -0,0 +1,46 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+import { clearCache, cacheKey, emojiCacheKey } from 'src/services/sw/sw.js'
+
+const pleromaFeCommitUrl = 'https://git.pleroma.social/pleroma/pleroma-fe/commit/'
+
+const VersionTab = {
+  data () {
+    const instance = this.$store.state.instance
+    return {
+      backendVersion: instance.backendVersion,
+      backendRepository: instance.backendRepository,
+      frontendVersion: instance.frontendVersion
+    }
+  },
+  components: {
+    BooleanSetting
+  },
+  computed: {
+    frontendVersionLink () {
+      return pleromaFeCommitUrl + this.frontendVersion
+    },
+    ...SharedComputedObject(),
+  },
+  methods: {
+    clearAssetCache () {
+      this.clearCache(cacheKey)
+    },
+    clearEmojiCache () {
+      this.clearCache(emojiCacheKey)
+    },
+    clearCache (key) {
+      clearCache(key)
+        .then(() => {
+          this.$store.dispatch('settingsSaved', { success: true })
+        })
+        .catch(error => {
+          this.$store.dispatch('settingsSaved', { error })
+        })
+    }
+  }
+}
+
+export default VersionTab
diff --git a/src/components/settings_modal/tabs/developer_tab.scss b/src/components/settings_modal/tabs/developer_tab.scss
new file mode 100644
index 000000000..a94b5c122
--- /dev/null
+++ b/src/components/settings_modal/tabs/developer_tab.scss
@@ -0,0 +1,30 @@
+.developer-tab {
+  .setting-list {
+    margin-left: 2em;
+  }
+
+  .cache-buttons {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-column: 1 / 3;
+    column-gap: 0.5em;
+    margin: 0 5em;
+
+    .-mobile & {
+      grid-template-columns: 1fr;
+      grid-template-rows: 1fr 1fr;
+      row-gap: 0.5em;
+      margin: 0;
+    }
+  }
+
+
+  dt {
+    font-weight: 900;
+  }
+
+  dd {
+    margin-top: 0.5em;
+    margin-bottom: 1em;
+  }
+}
diff --git a/src/components/settings_modal/tabs/developer_tab.vue b/src/components/settings_modal/tabs/developer_tab.vue
new file mode 100644
index 000000000..1544c02a9
--- /dev/null
+++ b/src/components/settings_modal/tabs/developer_tab.vue
@@ -0,0 +1,75 @@
+<template>
+  <div
+    :label="$t('settings.developer')"
+    class="developer-tab"
+  >
+    <div class="setting-section">
+      <h3>{{ $t('settings.version.title') }}</h3>
+      <dl class="setting-list">
+        <dt>{{ $t('settings.version.backend_version') }}</dt>
+        <dd>
+          <a
+            :href="backendRepository"
+            target="_blank"
+          >
+            {{ backendVersion }}
+          </a>
+        </dd>
+        <dt>{{ $t('settings.version.frontend_version') }}</dt>
+        <dd>
+          <a
+            :href="frontendVersionLink"
+            target="_blank"
+          >
+            {{ frontendVersion }}
+          </a>
+        </dd>
+      </dl>
+      <h3>{{ $t('settings.debug') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path="virtualScrolling">
+            {{ $t('settings.virtual_scrolling') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="themeDebug"
+            :expert="1"
+          >
+            {{ $t('settings.theme_debug') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="forceThemeRecompilation"
+            :expert="1"
+          >
+            {{ $t('settings.force_theme_recompilation_debug') }}
+          </BooleanSetting>
+        </li>
+        <h4>{{ $t('settings.cache') }}</h4>
+        <li>
+          <div class="setting-item">
+            <div class="cache-buttons">
+              <button
+                class="btn button-default"
+                @click="clearAssetCache"
+              >
+                {{ $t('settings.clear_asset_cache') }}
+              </button>
+              <button
+                class="btn button-default"
+                @click="clearEmojiCache"
+              >
+                {{ $t('settings.clear_emoji_cache') }}
+              </button>
+            </div>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+<script src="./developer_tab.js" />
+<style lang="scss" src="./developer_tab.scss"></style>
diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js
index fbace15df..594ce3f58 100644
--- a/src/components/settings_modal/tabs/filtering_tab.js
+++ b/src/components/settings_modal/tabs/filtering_tab.js
@@ -1,48 +1,252 @@
-import { filter, trim, debounce } from 'lodash'
+import { cloneDeep } from 'lodash'
+import { mapState, mapActions } from 'pinia'
+import { mapState as mapVuexState } from 'vuex'
+import { v4 as uuidv4 } from 'uuid';
+
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+import { useInterfaceStore } from 'src/stores/interface'
+
+import {
+  newImporter,
+  newExporter
+} from 'src/services/export_import/export_import.js'
+
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import ChoiceSetting from '../helpers/choice_setting.vue'
 import UnitSetting from '../helpers/unit_setting.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
+import HelpIndicator from '../helpers/help_indicator.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import Select from 'src/components/select/select.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
+const SUPPORTED_TYPES = new Set(['word', 'regexp', 'user', 'user_regexp'])
+
 const FilteringTab = {
   data () {
     return {
-      muteWordsStringLocal: this.$store.getters.mergedConfig.muteWords.join('\n'),
       replyVisibilityOptions: ['all', 'following', 'self'].map(mode => ({
         key: mode,
         value: mode,
         label: this.$t(`settings.reply_visibility_${mode}`)
-      }))
+      })),
+      muteBlockLv1Options: ['ask', 'forever', 'temporarily'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`user_card.mute_block_${mode}`)
+      })),
+      muteFiltersDraftObject: cloneDeep(useServerSideStorageStore().prefsStorage.simple.muteFilters),
+      muteFiltersDraftDirty: Object.fromEntries(
+        Object.entries(
+          useServerSideStorageStore().prefsStorage.simple.muteFilters
+        ).map(([k]) => [k, false])
+      ),
+      exportedFilter: null,
+      filterImporter: newImporter({
+        validator (parsed) {
+          if (Array.isArray(parsed)) return false
+          if (!SUPPORTED_TYPES.has(parsed.type)) return false
+          return true
+        },
+        onImport: (data) => {
+          const {
+            enabled = true,
+            expires = null,
+            hide = false,
+            name = '',
+            value = ''
+          } = data
+
+          this.createFilter({
+            enabled,
+            expires,
+            hide,
+            name,
+            value
+          })
+        },
+        onImportFailure (result) {
+          console.error('Failure importing filter:', result)
+          useInterfaceStore()
+            .pushGlobalNotice({
+              messageKey: 'settings.filter.import_failure',
+              level: 'error'
+            })
+        }
+      }),
+      filterExporter: newExporter({
+        filename: 'pleromafe_mute-filter',
+        getExportedObject: () => this.exportedFilter
+      })
     }
   },
   components: {
     BooleanSetting,
     ChoiceSetting,
     UnitSetting,
-    IntegerSetting
+    IntegerSetting,
+    Checkbox,
+    Select,
+    HelpIndicator
   },
   computed: {
+    instanceSpecificPanelPresent () { return this.$store.state.instance.showInstanceSpecificPanel },
     ...SharedComputedObject(),
-    muteWordsString: {
+    ...mapState(
+      useServerSideStorageStore,
+      {
+        muteFilters: store => Object.entries(store.prefsStorage.simple.muteFilters),
+        muteFiltersObject: store => store.prefsStorage.simple.muteFilters
+      }
+    ),
+    ...mapVuexState({
+      blockExpirationSupported: state => state.instance.blockExpiration
+    }),
+    onMuteDefaultActionLv1: {
       get () {
-        return this.muteWordsStringLocal
+        const value = this.$store.state.config.onMuteDefaultAction
+        if (value === 'ask' || value === 'forever') {
+          return value
+        } else {
+          return 'temporarily'
+        }
       },
       set (value) {
-        this.muteWordsStringLocal = value
-        this.debouncedSetMuteWords(value)
+        let realValue = value
+        if (value !== 'ask' && value !== 'forever') {
+          realValue = '14d'
+        }
+        this.$store.dispatch('setOption', { name: 'onMuteDefaultAction', value: realValue })
       }
     },
-    debouncedSetMuteWords () {
-      return debounce((value) => {
-        this.$store.dispatch('setOption', {
-          name: 'muteWords',
-          value: filter(value.split('\n'), (word) => trim(word).length > 0)
-        })
-      }, 1000)
+    onBlockDefaultActionLv1: {
+      get () {
+        const value = this.$store.state.config.onBlockDefaultAction
+        if (value === 'ask' || value === 'forever') {
+          return value
+        } else {
+          return 'temporarily'
+        }
+      },
+      set (value) {
+        let realValue = value
+        if (value !== 'ask' && value !== 'forever') {
+          realValue = '14d'
+        }
+        this.$store.dispatch('setOption', { name: 'onBlockDefaultAction', value: realValue })
+      }
+    },
+    muteFiltersDraft () {
+      return Object.entries(this.muteFiltersDraftObject)
+    },
+    muteFiltersExpired () {
+      const now = Date.now()
+      return Object
+        .entries(this.muteFiltersDraftObject)
+        .filter(([, { expires }]) => expires != null && expires <= now)
     }
   },
+  methods: {
+    ...mapActions(useServerSideStorageStore, ['setPreference', 'unsetPreference', 'pushServerSideStorage']),
+    getDatetimeLocal (timestamp) {
+      const date = new Date(timestamp)
+      const fmt = new Intl.NumberFormat("en-US", {minimumIntegerDigits: 2})
+      const datetime = [
+        date.getFullYear(),
+        '-',
+        fmt.format(date.getMonth() + 1),
+        '-',
+        fmt.format(date.getDate()),
+        'T',
+        fmt.format(date.getHours()),
+        ':',
+        fmt.format(date.getMinutes())
+      ].join('')
+      return datetime
+    },
+    checkRegexValid (id) {
+      const filter = this.muteFiltersObject[id]
+      if (filter.type !== 'regexp') return true
+      if (filter.type !== 'user_regexp') return true
+      const { value } = filter
+      let valid = true
+      try {
+        new RegExp(value)
+      } catch {
+        valid = false
+        console.error('Invalid RegExp: ' + value)
+      }
+      return valid
+    },
+    createFilter (filter = {
+      type: 'word',
+      value: '',
+      name: 'New Filter',
+      enabled: true,
+      expires: null,
+      hide: false,
+    }) {
+      const newId = uuidv4()
+
+      filter.order = this.muteFilters.length + 2
+      this.muteFiltersDraftObject[newId] = filter
+      this.setPreference({ path: 'simple.muteFilters.' + newId , value: filter })
+      this.pushServerSideStorage()
+    },
+    exportFilter(id) {
+      this.exportedFilter = { ...this.muteFiltersDraftObject[id] }
+      delete this.exportedFilter.order
+      this.filterExporter.exportData()
+    },
+    importFilter() {
+      this.filterImporter.importData()
+    },
+    copyFilter (id) {
+      const filter = { ...this.muteFiltersDraftObject[id] }
+      const newId = uuidv4()
+
+      this.muteFiltersDraftObject[newId] = filter
+      this.setPreference({ path: 'simple.muteFilters.' + newId , value: filter })
+      this.pushServerSideStorage()
+    },
+    deleteFilter (id) {
+      delete this.muteFiltersDraftObject[id]
+      this.unsetPreference({ path: 'simple.muteFilters.' + id , value: null })
+      this.pushServerSideStorage()
+    },
+    purgeExpiredFilters () {
+      this.muteFiltersExpired.forEach(([id]) => {
+        delete this.muteFiltersDraftObject[id]
+        this.unsetPreference({ path: 'simple.muteFilters.' + id , value: null })
+      })
+      this.pushServerSideStorage()
+    },
+    updateFilter(id, field, value) {
+      const filter = { ...this.muteFiltersDraftObject[id] }
+      if (field === 'expires-never') {
+        if (!value) {
+          const offset = 1000 * 60 * 60 * 24 * 14 // 2 weeks
+          const date = Date.now() + offset
+          filter.expires = date
+        } else {
+          filter.expires = null
+        }
+      } else if (field === 'expires') {
+        const parsed = Date.parse(value)
+        filter.expires = parsed.valueOf()
+      } else {
+        filter[field] = value
+      }
+      this.muteFiltersDraftObject[id] = filter
+      this.muteFiltersDraftDirty[id] = true
+    },
+    saveFilter(id) {
+      this.setPreference({ path: 'simple.muteFilters.' + id , value: this.muteFiltersDraftObject[id] })
+      this.pushServerSideStorage()
+      this.muteFiltersDraftDirty[id] = false
+    },
+  },
   // Updating nested properties
   watch: {
     replyVisibility () {
diff --git a/src/components/settings_modal/tabs/filtering_tab.scss b/src/components/settings_modal/tabs/filtering_tab.scss
new file mode 100644
index 000000000..5b51c5e4d
--- /dev/null
+++ b/src/components/settings_modal/tabs/filtering_tab.scss
@@ -0,0 +1,89 @@
+.filtering-tab {
+  .muteFilterContainer {
+    border: 1px solid var(--border);
+    border-radius: var(--roundness);
+    height: 33vh;
+    overflow-y: auto;
+  }
+
+  .mute-filter {
+    border: 1px solid var(--border);
+    border-radius: var(--roundness);
+    margin: 0.5em;
+    padding: 0.5em;
+    display: grid;
+    align-items: baseline;
+    grid-gap: 0.5em;
+  }
+
+  .never {
+    margin-left: 0.5em;
+  }
+
+  .filter-name {
+    grid-column: 1 / span 2;
+    grid-row: 1;
+  }
+
+  .alert,
+  .button-default {
+    display: inline-block;
+    line-height: 2;
+    padding: 0 0.5em;
+  }
+
+  .filter-enabled {
+    grid-column: 3;
+    grid-row: 1;
+    text-align: right;
+    line-height: 2;
+  }
+
+  .filter-field {
+    display: grid;
+    grid-template-columns: subgrid;
+    grid-template-rows: subgrid;
+    grid-column: 1 / span 3;
+    align-items: baseline;
+
+    label {
+      grid-column: 1;
+      text-align: right;
+    }
+
+    .filter-field-value {
+      grid-column: 2 / span 2;
+    }
+  }
+
+  .filter-buttons {
+    grid-column: 1 / span 3;
+    justify-self: end;
+    display: inline-grid;
+    grid-gap: 0.5em;
+    grid-template-columns: repeat(4, 1fr);
+    max-width: 100%;
+    justify-content: end;
+  }
+
+  .muteFiltersActions,
+  .muteFiltersActionsBottom {
+    display: grid;
+    align-items: baseline;
+    grid-auto-flow: column;
+    grid-template-columns: 1fr;
+    grid-gap: 0.5em;
+    margin: 0.5em 0;
+
+    .total {
+      flex: 1;
+    }
+  }
+}
+
+
+.settings-modal.-mobile .filtering-tab {
+  .filter-buttons {
+    grid-template-columns: repeat(1, 1fr);
+  }
+}
diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue
index c86810d5b..ff7498656 100644
--- a/src/components/settings_modal/tabs/filtering_tab.vue
+++ b/src/components/settings_modal/tabs/filtering_tab.vue
@@ -1,11 +1,90 @@
 <template>
-  <div :label="$t('settings.filtering')">
-    <div class="setting-item">
-      <h2>{{ $t('settings.posts') }}</h2>
+  <div class="filtering-tab">
+    <div class="setting-section">
+      <h3>{{ $t('settings.filter.mute_filter') }}</h3>
       <ul class="setting-list">
+        <li>
+          <ChoiceSetting
+            v-if="user"
+            id="replyVisibility"
+            path="replyVisibility"
+            :options="replyVisibilityOptions"
+          >
+            {{ $t('settings.replies_in_timeline') }}
+          </ChoiceSetting>
+        </li>
+        <li>
+          <span class="setting-item">
+            <span class="setting-label">
+              {{ $t('user_card.default_mute_expiration') }}
+            </span>
+            <Select
+              id="onMuteDefaultActionLv1"
+              v-model="onMuteDefaultActionLv1"
+            >
+              <option
+                v-for="option in muteBlockLv1Options"
+                :key="option.key"
+                :value="option.value"
+              >
+                {{ option.label }}
+              </option>
+            </Select>
+          </span>
+          <ul
+            v-if="onMuteDefaultActionLv1 === 'temporarily'"
+            class="setting-list suboptions"
+          >
+            <li>
+              <UnitSetting
+                path="onMuteDefaultAction"
+                unit-set="time"
+                :units="['s', 'm', 'h', 'd']"
+                :min="0"
+              >
+                {{ $t('user_card.default_expiration_time') }}
+              </UnitSetting>
+            </li>
+          </ul>
+        </li>
+        <li v-if="blockExpirationSupported">
+          <span class="setting-item">
+            <span class="setting-label">
+              {{ $t('user_card.default_block_expiration') }}
+            </span>
+            <Select
+              id="onBlockDefaultActionLv1"
+              v-model="onBlockDefaultActionLv1"
+              class="setting-control"
+            >
+              <option
+                v-for="option in muteBlockLv1Options"
+                :key="option.key"
+                :value="option.value"
+              >
+                {{ option.label }}
+              </option>
+            </Select>
+          </span>
+          <ul
+            v-if="onBlockDefaultActionLv1 === 'temporarily'"
+            class="setting-list suboptions"
+          >
+            <li>
+              <UnitSetting
+                path="onBlockDefaultAction"
+                unit-set="time"
+                :units="['s', 'm', 'h', 'd']"
+                :min="0"
+              >
+                {{ $t('user_card.default_expiration_time') }}
+              </UnitSetting>
+            </li>
+          </ul>
+        </li>
         <li>
           <BooleanSetting path="hideFilteredStatuses">
-            {{ $t('settings.hide_filtered_statuses') }}
+            {{ $t('settings.hide_muted_statuses') }}
           </BooleanSetting>
           <ul class="setting-list suboptions">
             <li>
@@ -13,8 +92,9 @@
                 parent-path="hideFilteredStatuses"
                 :parent-invert="true"
                 path="hideWordFilteredPosts"
+                expert="1"
               >
-                {{ $t('settings.hide_wordfiltered_statuses') }}
+                {{ $t('settings.hide_filtered_statuses') }}
               </BooleanSetting>
             </li>
             <li>
@@ -50,83 +130,218 @@
           </BooleanSetting>
         </li>
         <li>
-          <BooleanSetting path="hidePostStats">
-            {{ $t('settings.hide_post_stats') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="hideBotIndication">
-            {{ $t('settings.hide_actor_type_indication') }}
-          </BooleanSetting>
-        </li>
-        <ChoiceSetting
-          v-if="user"
-          id="replyVisibility"
-          path="replyVisibility"
-          :options="replyVisibilityOptions"
-        >
-          {{ $t('settings.replies_in_timeline') }}
-        </ChoiceSetting>
-        <li>
-          <h3>{{ $t('settings.wordfilter') }}</h3>
-          <textarea
-            id="muteWords"
-            v-model="muteWordsString"
-            class="input resize-height"
-          />
-          <div>{{ $t('settings.filtering_explanation') }}</div>
-        </li>
-        <h3>{{ $t('settings.attachments') }}</h3>
-        <li>
-          <IntegerSetting
-            path="maxThumbnails"
-            expert="1"
-            :min="0"
-          >
-            {{ $t('settings.max_thumbnails') }}
-          </IntegerSetting>
-        </li>
-        <li>
-          <BooleanSetting path="hideAttachments">
-            {{ $t('settings.hide_attachments_in_tl') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="hideAttachmentsInConv">
-            {{ $t('settings.hide_attachments_in_convo') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="hideScrobbles">
-            {{ $t('settings.hide_scrobbles') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <UnitSetting
-            key="hideScrobblesAfter"
-            path="hideScrobblesAfter"
-            :units="['m', 'h', 'd']"
-            unitSet="time"
-            expert="1"
-          >
-            {{ $t('settings.hide_scrobbles_after') }}
-          </UnitSetting>
-        </li>
-      </ul>
-    </div>
-    <div
-      v-if="expertLevel > 0"
-      class="setting-item"
-    >
-      <h2>{{ $t('settings.user_profiles') }}</h2>
-      <ul class="setting-list">
-        <li>
-          <BooleanSetting path="hideUserStats">
-            {{ $t('settings.hide_user_stats') }}
-          </BooleanSetting>
+          <h3>{{ $t('settings.filter.custom_filters') }}</h3>
+          <p class="muteFiltersActions">
+            <span class="total">
+              {{ $t('settings.filter.total_count', { count: muteFiltersDraft.length }) }}
+            </span>
+            <button
+              class="add-button button-default"
+              type="button"
+              @click="createFilter()"
+            >
+              {{ $t('settings.filter.new') }}
+            </button>
+            <button
+              class="add-button button-default"
+              type="button"
+              @click="importFilter()"
+            >
+              {{ $t('settings.filter.import') }}
+            </button>
+          </p>
+          <div class="muteFilterContainer">
+            <div
+              v-for="filter in muteFiltersDraft"
+              :key="filter[0]"
+              class="mute-filter"
+              :style="{ order: filter[1].order }"
+            >
+              <div class="filter-name">
+                <label
+                  :for="'filterName' + filter[0]"
+                >
+                  {{ $t('settings.filter.name') }}
+                </label>
+                {{ ' ' }}
+                <input
+                  :id="'filterName' + filter[0]"
+                  class="input"
+                  :value="filter[1].name"
+                  @input="updateFilter(filter[0], 'name', $event.target.value)"
+                >
+                <span
+                  v-if="filter[1].expires !== null && Date.now() > filter[1].expires"
+                  class="alert neutral"
+                >
+                  {{ $t('settings.filter.expired') }}
+                </span>
+              </div>
+              <div class="filter-enabled">
+                <Checkbox
+                  :id="'filterHide' + filter[0]"
+                  :model-value="filter[1].hide"
+                  :name="'filterHide' + filter[0]"
+                  @update:model-value="updateFilter(filter[0], 'hide', $event)"
+                >
+                  {{ $t('settings.filter.hide') }}
+                </Checkbox>
+                {{ ' ' }}
+                <Checkbox
+                  :id="'filterEnabled' + filter[0]"
+                  :model-value="filter[1].enabled"
+                  :name="'filterEnabled' + filter[0]"
+                  @update:model-value="updateFilter(filter[0], 'enabled', $event)"
+                >
+                  {{ $t('settings.enabled') }}
+                </Checkbox>
+              </div>
+              <div class="filter-type filter-field">
+                <label :for="'filterType' + filter[0]">
+                  <HelpIndicator>
+                    <p>
+                      {{ $t('settings.filter.help.word') }}
+                    </p>
+                    <p>
+                      {{ $t('settings.filter.help.user') }}
+                    </p>
+                    <i18n-t
+                      keypath="settings.filter.help.regexp"
+                      tag="p"
+                    >
+                      <template #link>
+                        <a
+                          :href="$t('settings.filter.help.regexp_url')"
+                          target="_blank"
+                        >
+                          {{ $t('settings.filter.help.regexp_link') }}
+                        </a>
+                      </template>
+                    </i18n-t>
+                  </HelpIndicator>
+                  {{ $t('settings.filter.type') }}
+                </label>
+                <Select
+                  :id="'filterType' + filter[0]"
+                  class="filter-field-value"
+                  :model-value="filter[1].type"
+                  @update:model-value="updateFilter(filter[0], 'type', $event)"
+                >
+                  <option value="word">
+                    {{ $t('settings.filter.plain') }}
+                  </option>
+                  <option value="regexp">
+                    {{ $t('settings.filter.regexp') }}
+                  </option>
+                  <option value="user">
+                    {{ $t('settings.filter.user') }}
+                  </option>
+                  <option value="user_regexp">
+                    {{ $t('settings.filter.user_regexp') }}
+                  </option>
+                </Select>
+              </div>
+              <div class="filter-value filter-field">
+                <label
+                  :for="'filterValue' + filter[0]"
+                >
+                  {{ $t('settings.filter.value') }}
+                </label>
+                {{ ' ' }}
+                <input
+                  :id="'filterValue' + filter[0]"
+                  class="input filter-field-value"
+                  :value="filter[1].value"
+                  @input="updateFilter(filter[0], 'value', $event.target.value)"
+                >
+              </div>
+              <div class="filter-expires filter-field">
+                <label
+                  :for="'filterExpires' + filter[0]"
+                >
+                  {{ $t('settings.filter.expires') }}
+                </label>
+                {{ ' ' }}
+                <div class="filter-field-value">
+                  <input
+                    :id="'filterExpires' + filter[0]"
+                    class="input"
+                    :class="{ disabled: filter[1].expires === null }"
+                    type="datetime-local"
+                    :disabled="filter[1].expires === null"
+                    :value="filter[1].expires ? getDatetimeLocal(filter[1].expires) : null"
+                    @input="updateFilter(filter[0], 'expires', $event.target.value)"
+                  >
+                  {{ ' ' }}
+                  <Checkbox
+                    :id="'filterExpiresNever' + filter[0]"
+                    :model-value="filter[1].expires === null"
+                    :name="'filterExpiresNever' + filter[0]"
+                    class="input-inset input-boolean never"
+                    @update:model-value="updateFilter(filter[0], 'expires-never', $event)"
+                  >
+                    {{ $t('settings.filter.never_expires') }}
+                  </Checkbox>
+                </div>
+              </div>
+              <div
+                v-if="!checkRegexValid(filter[0])"
+                class="alert error"
+              >
+                {{ $t('settings.filter.regexp_error') }}
+              </div>
+              <div class="filter-buttons">
+                <button
+                  class="delete-button button-default -danger"
+                  type="button"
+                  @click="deleteFilter(filter[0])"
+                >
+                  {{ $t('settings.filter.delete') }}
+                </button>
+                <button
+                  class="export-button button-default"
+                  type="button"
+                  @click="exportFilter(filter[0])"
+                >
+                  {{ $t('settings.filter.export') }}
+                </button>
+                <button
+                  class="copy-button button-default"
+                  type="button"
+                  @click="copyFilter(filter[0])"
+                >
+                  {{ $t('settings.filter.copy') }}
+                </button>
+                <button
+                  class="save-button button-default"
+                  :class="{ disabled: !muteFiltersDraftDirty[filter[0]] }"
+                  :disabled="!muteFiltersDraftDirty[filter[0]]"
+                  type="button"
+                  @click="saveFilter(filter[0])"
+                >
+                  {{ $t('settings.filter.save') }}
+                </button>
+              </div>
+            </div>
+          </div>
+          <p class="muteFiltersActionsBottom">
+            <span class="total">
+              {{ $t('settings.filter.expired_count', { count: muteFiltersExpired.length }) }}
+            </span>
+            <button
+              class="add-button button-default"
+              type="button"
+              :class="{ disabled: muteFiltersExpired.length === 0 }"
+              :disabled="muteFiltersExpired.length === 0"
+              @click="purgeExpiredFilters()"
+            >
+              {{ $t('settings.filter.purge_expired') }}
+            </button>
+          </p>
         </li>
       </ul>
     </div>
   </div>
 </template>
 <script src="./filtering_tab.js"></script>
+<style src="./filtering_tab.scss"></style>
diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
index e9e8fa72b..4d3b01c46 100644
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@@ -1,92 +1,80 @@
+import { mapState } from 'vuex'
+
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import ChoiceSetting from '../helpers/choice_setting.vue'
-import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
-import IntegerSetting from '../helpers/integer_setting.vue'
-import FloatSetting from '../helpers/float_setting.vue'
 import UnitSetting from '../helpers/unit_setting.vue'
+import FloatSetting from '../helpers/float_setting.vue'
 import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
+import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
+import FontControl from 'src/components/font_control/font_control.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
-import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faGlobe
-} from '@fortawesome/free-solid-svg-icons'
 
-library.add(
-  faGlobe
-)
+import localeService from 'src/services/locale/locale.service.js'
 
 const GeneralTab = {
+  props: {
+    parentCollapsed: {
+      required: true,
+      type: Boolean
+    }
+  },
   data () {
     return {
-      subjectLineOptions: ['email', 'noop', 'masto'].map(mode => ({
+      absoluteTime12hOptions: ['24h', '12h'].map(mode => ({
         key: mode,
         value: mode,
-        label: this.$t(`settings.subject_line_${mode === 'masto' ? 'mastodon' : mode}`)
+        label: this.$t(`settings.absolute_time_format_12h_${mode}`)
       })),
-      conversationDisplayOptions: ['tree', 'linear'].map(mode => ({
-        key: mode,
-        value: mode,
-        label: this.$t(`settings.conversation_display_${mode}`)
-      })),
-      conversationOtherRepliesButtonOptions: ['below', 'inside'].map(mode => ({
-        key: mode,
-        value: mode,
-        label: this.$t(`settings.conversation_other_replies_button_${mode}`)
-      })),
-      mentionLinkDisplayOptions: ['short', 'full_for_remote', 'full'].map(mode => ({
-        key: mode,
-        value: mode,
-        label: this.$t(`settings.mention_link_display_${mode}`)
-      })),
-      userPopoverAvatarActionOptions: ['close', 'zoom', 'open'].map(mode => ({
-        key: mode,
-        value: mode,
-        label: this.$t(`settings.user_popover_avatar_action_${mode}`)
-      })),
-      loopSilentAvailable:
-      // Firefox
-      Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') ||
-      // Chrome-likes
-      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'webkitAudioDecodedByteCount') ||
-      // Future spec, still not supported in Nightly 63 as of 08/2018
-      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'audioTracks')
+      emailLanguage: this.$store.state.users.currentUser.language || ['']
     }
   },
   components: {
     BooleanSetting,
     ChoiceSetting,
-    IntegerSetting,
-    FloatSetting,
     UnitSetting,
+    FloatSetting,
+    FontControl,
     InterfaceLanguageSwitcher,
-    ScopeSelector,
     ProfileSettingIndicator
   },
   computed: {
-    postFormats () {
-      return this.$store.state.instance.postFormats || []
-    },
-    postContentOptions () {
-      return this.postFormats.map(format => ({
-        key: format,
-        value: format,
-        label: this.$t(`post_status.content_type["${format}"]`)
-      }))
-    },
     language: {
       get: function () { return this.$store.getters.mergedConfig.interfaceLanguage },
       set: function (val) {
         this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
       }
     },
-    ...SharedComputedObject()
+    ...SharedComputedObject(),
+    ...mapState({
+      blockExpirationSupported: state => state.instance.blockExpiration,
+    })
   },
   methods: {
-    changeDefaultScope (value) {
-      this.$store.dispatch('setProfileOption', { name: 'defaultScope', value })
-    }
+    updateProfile () {
+      const params = {
+        language: localeService.internalToBackendLocaleMulti(this.emailLanguage)
+      }
+
+      this.$store.state.api.backendInteractor
+        .updateProfile({ params })
+        .then((user) => {
+          this.$store.commit('addNewUsers', [user])
+          this.$store.commit('setCurrentUser', user)
+        })
+    },
+    updateFont (key, value) {
+      this.$store.dispatch('setOption', {
+        name: 'theme3hacks',
+        value: {
+          ...this.mergedConfig.theme3hacks,
+          fonts: {
+            ...this.mergedConfig.theme3hacks.fonts,
+            [key]: value
+          }
+        }
+      })
+    },
   }
 }
 
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index 82d5da89c..ceb073a48 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -1,25 +1,115 @@
 <template>
-  <div :label="$t('settings.general')">
-    <div class="setting-item">
-      <h2>{{ $t('settings.interface') }}</h2>
+  <div>
+    <div class="setting-section">
+      <h3>{{ $t('settings.format_and_language') }}</h3>
+      <ul class="setting-list">
+        <h4>{{ $t('settings.interfaceLanguage') }}</h4>
+        <interface-language-switcher
+          v-model="language"
+          class="lang-selector"
+          @update="val => language = val"
+        />
+        <h4>
+          {{ $t('settings.email_language') }}
+          {{ ' ' }}
+          <ProfileSettingIndicator :is-profile="true" />
+        </h4>
+        <interface-language-switcher
+          v-model="emailLanguage"
+          class="lang-selector"
+          :profile="true"
+          @update:model-value="updateProfile()"
+        />
+        <li>
+          <BooleanSetting path="useAbsoluteTimeFormat">
+            {{ $t('settings.absolute_time_format') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <ChoiceSetting
+            id="absoluteTime12h"
+            path="absoluteTime12h"
+            :options="absoluteTime12hOptions"
+          >
+            {{ $t('settings.absolute_time_format_12h') }}
+          </ChoiceSetting>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.scale_and_font') }}</h3>
       <ul class="setting-list">
         <li>
-          <interface-language-switcher
-            :prompt-text="$t('settings.interfaceLanguage')"
-            :language="language"
-            :set-language="val => language = val"
-          />
-        </li>
-        <li v-if="instanceSpecificPanelPresent">
-          <BooleanSetting path="hideISP">
-            {{ $t('settings.hide_isp') }}
-          </BooleanSetting>
+          <UnitSetting
+            path="textSize"
+            :step="0.1"
+            :units="['px', 'rem']"
+            :reset-default="{ 'px': 14, 'rem': 1 }"
+            timed-apply-mode
+          >
+            {{ $t('settings.text_size') }}
+          </UnitSetting>
+          <p class="sidenote">
+            <i18n-t
+              scope="global"
+              keypath="settings.text_size_tip"
+              tag="span"
+            >
+              <code>px</code>
+              <code>rem</code>
+            </i18n-t>
+            <br>
+            <i18n-t
+              scope="global"
+              keypath="settings.text_size_tip2"
+              tag="span"
+            >
+              <code>14px</code>
+            </i18n-t>
+          </p>
         </li>
         <li>
-          <BooleanSetting path="stopGifs">
-            {{ $t('settings.stop_gifs') }}
-          </BooleanSetting>
+          <FontControl
+            :model-value="mergedConfig.theme3hacks.fonts.interface"
+            name="ui"
+            :label="$t('settings.style.fonts.components_inline.interface')"
+            :fallback="{ family: 'sans-serif' }"
+            no-inherit="1"
+            @update:model-value="v => updateFont('interface', v)"
+          />
         </li>
+        <li>
+          <FontControl
+            :model-value="mergedConfig.theme3hacks.fonts.input"
+            name="input"
+            :fallback="{ family: 'inherit' }"
+            :label="$t('settings.style.fonts.components_inline.input')"
+            @update:model-value="v => updateFont('input', v)"
+          />
+        </li>
+        <li>
+          <UnitSetting
+            path="emojiSize"
+            :step="0.1"
+            :units="['px', 'rem']"
+            :reset-default="{ 'px': 32, 'rem': 2.2 }"
+          >
+            {{ $t('settings.emoji_size') }}
+          </UnitSetting>
+          <ul
+            class="setting-list suboptions"
+          >
+            <li>
+              <FloatSetting
+                v-if="user"
+                path="emojiReactionsScale"
+              >
+                {{ $t('settings.emoji_reactions_scale') }}
+              </FloatSetting>
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.timelines') }}</h3>
+      <ul class="setting-list">
         <li>
           <BooleanSetting path="streaming">
             {{ $t('settings.streaming') }}
@@ -43,58 +133,18 @@
             {{ $t('settings.useStreamingApi') }}
           </BooleanSetting>
         </li>
-        <li>
-          <BooleanSetting
-            path="virtualScrolling"
-            expert="1"
-          >
-            {{ $t('settings.virtual_scrolling') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <ChoiceSetting
-            id="userPopoverAvatarAction"
-            path="userPopoverAvatarAction"
-            :options="userPopoverAvatarActionOptions"
-            expert="1"
-          >
-            {{ $t('settings.user_popover_avatar_action') }}
-          </ChoiceSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="userPopoverOverlay"
-            expert="1"
-          >
-            {{ $t('settings.user_popover_avatar_overlay') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="alwaysShowNewPostButton"
-            expert="1"
-          >
-            {{ $t('settings.always_show_post_button') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="autohideFloatingPostButton"
-            expert="1"
-          >
-            {{ $t('settings.autohide_floating_post_button') }}
-          </BooleanSetting>
-        </li>
-        <li v-if="instanceShoutboxPresent">
-          <BooleanSetting
-            path="hideShoutbox"
-            expert="1"
-          >
-            {{ $t('settings.hide_shoutbox') }}
-          </BooleanSetting>
-        </li>
+      </ul>
+      <h3 v-if="expertLevel > 0">
+        {{ $t('settings.confirmations') }}
+      </h3>
+      <ul
+        v-if="expertLevel > 0"
+        class="setting-list"
+      >
         <li class="select-multiple">
-          <span class="label">{{ $t('settings.confirm_dialogs') }}</span>
+          <h4 class="label">
+            {{ $t('settings.confirm_dialogs') }}
+          </h4>
           <ul class="option-list">
             <li>
               <BooleanSetting path="modalOnRepeat">
@@ -106,14 +156,23 @@
                 {{ $t('settings.confirm_dialogs_unfollow') }}
               </BooleanSetting>
             </li>
-            <li>
-              <BooleanSetting path="modalOnBlock">
+            <li
+              v-if="!blockExpirationSupported"
+            >
+              <BooleanSetting
+                path="modalOnBlock"
+              >
                 {{ $t('settings.confirm_dialogs_block') }}
               </BooleanSetting>
             </li>
             <li>
-              <BooleanSetting path="modalOnMute">
-                {{ $t('settings.confirm_dialogs_mute') }}
+              <BooleanSetting path="modalOnMuteConversation">
+                {{ $t('settings.confirm_dialogs_mute_conversation') }}
+              </BooleanSetting>
+            </li>
+            <li>
+              <BooleanSetting path="modalOnMuteDomain">
+                {{ $t('settings.confirm_dialogs_mute_domain') }}
               </BooleanSetting>
             </li>
             <li>
@@ -145,339 +204,6 @@
         </li>
       </ul>
     </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.post_look_feel') }}</h2>
-      <ul class="setting-list">
-        <li>
-          <ChoiceSetting
-            id="conversationDisplay"
-            path="conversationDisplay"
-            :options="conversationDisplayOptions"
-          >
-            {{ $t('settings.conversation_display') }}
-          </ChoiceSetting>
-        </li>
-        <ul
-          v-if="mergedConfig.conversationDisplay !== 'linear'"
-          class="setting-list suboptions"
-        >
-          <li>
-            <BooleanSetting path="conversationTreeAdvanced">
-              {{ $t('settings.tree_advanced') }}
-            </BooleanSetting>
-          </li>
-          <li>
-            <BooleanSetting
-              path="conversationTreeFadeAncestors"
-              :expert="1"
-            >
-              {{ $t('settings.tree_fade_ancestors') }}
-            </BooleanSetting>
-          </li>
-          <li>
-            <IntegerSetting
-              path="maxDepthInThread"
-              :min="3"
-              :expert="1"
-            >
-              {{ $t('settings.max_depth_in_thread') }}
-            </IntegerSetting>
-          </li>
-          <li>
-            <ChoiceSetting
-              id="conversationOtherRepliesButton"
-              path="conversationOtherRepliesButton"
-              :options="conversationOtherRepliesButtonOptions"
-              :expert="1"
-            >
-              {{ $t('settings.conversation_other_replies_button') }}
-            </ChoiceSetting>
-          </li>
-        </ul>
-        <li>
-          <BooleanSetting path="collapseMessageWithSubject">
-            {{ $t('settings.collapse_subject') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="emojiReactionsOnTimeline"
-            expert="1"
-          >
-            {{ $t('settings.emoji_reactions_on_timeline') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            v-if="user"
-            source="profile"
-            path="stripRichContent"
-            expert="1"
-          >
-            {{ $t('settings.no_rich_text_description') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="useAbsoluteTimeFormat"
-            expert="1"
-          >
-            {{ $t('settings.absolute_time_format') }}
-          </BooleanSetting>
-        </li>
-        <ul
-          class="setting-list suboptions"
-          v-if="mergedConfig.useAbsoluteTimeFormat"
-        >
-          <li>
-            <UnitSetting
-              path="absoluteTimeFormatMinAge"
-              unit-set="time"
-              :units="['s', 'm', 'h', 'd']"
-              :min="0"
-            >
-              {{ $t('settings.absolute_time_format_min_age') }}
-            </UnitSetting>
-          </li>
-        </ul>
-        <h3>{{ $t('settings.attachments') }}</h3>
-        <li>
-          <BooleanSetting
-            path="useContainFit"
-            expert="1"
-          >
-            {{ $t('settings.use_contain_fit') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="hideNsfw">
-            {{ $t('settings.nsfw_clickthrough') }}
-          </BooleanSetting>
-        </li>
-        <ul class="setting-list suboptions">
-          <li>
-            <BooleanSetting
-              path="preloadImage"
-              expert="1"
-              parent-path="hideNsfw"
-            >
-              {{ $t('settings.preload_images') }}
-            </BooleanSetting>
-          </li>
-          <li>
-            <BooleanSetting
-              path="useOneClickNsfw"
-              expert="1"
-              parent-path="hideNsfw"
-            >
-              {{ $t('settings.use_one_click_nsfw') }}
-            </BooleanSetting>
-          </li>
-        </ul>
-        <li>
-          <BooleanSetting
-            path="loopVideo"
-            expert="1"
-          >
-            {{ $t('settings.loop_video') }}
-          </BooleanSetting>
-          <ul class="setting-list suboptions">
-            <li>
-              <BooleanSetting
-                path="loopVideoSilentOnly"
-                expert="1"
-                parent-path="loopVideo"
-                :disabled="!loopSilentAvailable"
-              >
-                {{ $t('settings.loop_video_silent_only') }}
-              </BooleanSetting>
-              <div
-                v-if="!loopSilentAvailable"
-                class="unavailable"
-              >
-                <FAIcon icon="globe" />! {{ $t('settings.limited_availability') }}
-              </div>
-            </li>
-          </ul>
-        </li>
-        <li>
-          <BooleanSetting
-            path="playVideosInModal"
-            expert="1"
-          >
-            {{ $t('settings.play_videos_in_modal') }}
-          </BooleanSetting>
-        </li>
-        <h3>{{ $t('settings.mention_links') }}</h3>
-        <li>
-          <ChoiceSetting
-            id="mentionLinkDisplay"
-            path="mentionLinkDisplay"
-            :options="mentionLinkDisplayOptions"
-          >
-            {{ $t('settings.mention_link_display') }}
-          </ChoiceSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="mentionLinkShowTooltip"
-            expert="1"
-          >
-            {{ $t('settings.mention_link_use_tooltip') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="useAtIcon"
-            expert="1"
-          >
-            {{ $t('settings.use_at_icon') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting path="mentionLinkShowAvatar">
-            {{ $t('settings.mention_link_show_avatar') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="mentionLinkFadeDomain"
-            expert="1"
-          >
-            {{ $t('settings.mention_link_fade_domain') }}
-          </BooleanSetting>
-        </li>
-        <li v-if="user">
-          <BooleanSetting
-            path="mentionLinkBoldenYou"
-            expert="1"
-          >
-            {{ $t('settings.mention_link_bolden_you') }}
-          </BooleanSetting>
-        </li>
-        <h3 v-if="expertLevel > 0">
-          {{ $t('settings.fun') }}
-        </h3>
-        <li>
-          <BooleanSetting
-            path="greentext"
-            expert="1"
-          >
-            {{ $t('settings.greentext') }}
-          </BooleanSetting>
-        </li>
-        <li v-if="user">
-          <BooleanSetting
-            path="mentionLinkShowYous"
-            expert="1"
-          >
-            {{ $t('settings.show_yous') }}
-          </BooleanSetting>
-        </li>
-      </ul>
-    </div>
-
-    <div
-      v-if="user"
-      class="setting-item"
-    >
-      <h2>{{ $t('settings.composing') }}</h2>
-      <ul class="setting-list">
-        <li>
-          <label for="default-vis">
-            {{ $t('settings.default_vis') }} <ProfileSettingIndicator :is-profile="true" />
-            <ScopeSelector
-              class="scope-selector"
-              :show-all="true"
-              :user-default="$store.state.profileConfig.defaultScope"
-              :initial-scope="$store.state.profileConfig.defaultScope"
-              :on-scope-change="changeDefaultScope"
-            />
-          </label>
-        </li>
-        <li>
-          <!-- <BooleanSetting source="profile" path="defaultNSFW"> -->
-          <BooleanSetting path="sensitiveByDefault">
-            {{ $t('settings.sensitive_by_default') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="scopeCopy"
-            expert="1"
-          >
-            {{ $t('settings.scope_copy') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="alwaysShowSubjectInput"
-            expert="1"
-          >
-            {{ $t('settings.subject_input_always_show') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <ChoiceSetting
-            id="subjectLineBehavior"
-            path="subjectLineBehavior"
-            :options="subjectLineOptions"
-            expert="1"
-          >
-            {{ $t('settings.subject_line_behavior') }}
-          </ChoiceSetting>
-        </li>
-        <li v-if="postFormats.length > 0">
-          <ChoiceSetting
-            id="postContentType"
-            path="postContentType"
-            :options="postContentOptions"
-          >
-            {{ $t('settings.post_status_content_type') }}
-          </ChoiceSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="minimalScopesMode"
-            expert="1"
-          >
-            {{ $t('settings.minimal_scopes_mode') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="alwaysShowNewPostButton"
-            expert="1"
-          >
-            {{ $t('settings.always_show_post_button') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="autohideFloatingPostButton"
-            expert="1"
-          >
-            {{ $t('settings.autohide_floating_post_button') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="padEmoji"
-            expert="1"
-          >
-            {{ $t('settings.pad_emoji') }}
-          </BooleanSetting>
-        </li>
-        <li>
-          <BooleanSetting
-            path="autocompleteSelect"
-            expert="1"
-          >
-            {{ $t('settings.autocomplete_select_first') }}
-          </BooleanSetting>
-        </li>
-      </ul>
-    </div>
   </div>
 </template>
 
diff --git a/src/components/settings_modal/tabs/layout_tab.js b/src/components/settings_modal/tabs/layout_tab.js
new file mode 100644
index 000000000..48b6eb971
--- /dev/null
+++ b/src/components/settings_modal/tabs/layout_tab.js
@@ -0,0 +1,50 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import UnitSetting from '../helpers/unit_setting.vue'
+import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const GeneralTab = {
+  props: {
+    parentCollapsed: {
+      required: true,
+      type: Boolean
+    }
+  },
+  data () {
+    return {
+      thirdColumnModeOptions: ['none', 'notifications', 'postform'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.third_column_mode_${mode}`)
+      }))
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    UnitSetting,
+    ProfileSettingIndicator
+  },
+  computed: {
+    postFormats () {
+      return this.$store.state.instance.postFormats || []
+    },
+    instanceShoutboxPresent () { return this.$store.state.instance.shoutAvailable },
+    columns () {
+      const mode = this.$store.getters.mergedConfig.thirdColumnMode
+
+      const notif = mode === 'none' ? [] : ['notifs']
+
+      if (this.$store.getters.mergedConfig.sidebarRight || mode === 'postform') {
+        return [...notif, 'content', 'sidebar']
+      } else {
+        return ['sidebar', 'content', ...notif]
+      }
+    },
+    ...SharedComputedObject(),
+  }
+}
+
+export default GeneralTab
diff --git a/src/components/settings_modal/tabs/layout_tab.vue b/src/components/settings_modal/tabs/layout_tab.vue
new file mode 100644
index 000000000..2290b0630
--- /dev/null
+++ b/src/components/settings_modal/tabs/layout_tab.vue
@@ -0,0 +1,127 @@
+<template>
+  <div :label="$t('settings.layout')">
+    <div class="setting-section">
+      <h3>{{ $t('settings.general') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path="modalMobileCenter">
+            {{ $t('settings.mobile_center_dialog') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="alwaysShowNewPostButton"
+            expert="1"
+          >
+            {{ $t('settings.always_show_post_button') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="autohideFloatingPostButton"
+            expert="1"
+          >
+            {{ $t('settings.autohide_floating_post_button') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="userPopoverOverlay"
+            expert="1"
+          >
+            {{ $t('settings.user_popover_avatar_overlay') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="userCardLeftJustify">
+            {{ $t('settings.user_card_left_justify') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <UnitSetting
+            path="themeEditorMinWidth"
+            :units="['px', 'rem']"
+            expert="1"
+          >
+            {{ $t('settings.theme_editor_min_width') }}
+          </UnitSetting>
+        </li>
+        <li>
+          <UnitSetting
+            path="navbarSize"
+            :step="0.1"
+            :units="['px', 'rem']"
+            :reset-default="{ 'px': 55, 'rem': 3.5 }"
+          >
+            {{ $t('settings.navbar_size') }}
+          </UnitSetting>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.columns') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path="disableStickyHeaders">
+            {{ $t('settings.disable_sticky_headers') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="showScrollbars">
+            {{ $t('settings.show_scrollbars') }}
+          </BooleanSetting>
+        </li>
+        <li v-if="instanceSpecificPanelPresent">
+          <BooleanSetting path="hideISP">
+            {{ $t('settings.hide_isp') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <UnitSetting
+            path="panelHeaderSize"
+            :step="0.1"
+            :units="['px', 'rem']"
+            :reset-default="{ 'px': 52, 'rem': 3.2 }"
+            timed-apply-mode
+          >
+            {{ $t('settings.panel_header_size') }}
+          </UnitSetting>
+        </li>
+        <li>
+          <BooleanSetting path="sidebarRight">
+            {{ $t('settings.right_sidebar') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="navbarColumnStretch">
+            {{ $t('settings.navbar_column_stretch') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <ChoiceSetting
+            v-if="user"
+            id="thirdColumnMode"
+            path="thirdColumnMode"
+            :options="thirdColumnModeOptions"
+          >
+            {{ $t('settings.third_column_mode') }}
+          </ChoiceSetting>
+        </li>
+        <li v-if="expertLevel > 0">
+          <h4> {{ $t('settings.column_sizes') }} </h4>
+          <div class="column-settings">
+            <UnitSetting
+              v-for="column in columns"
+              :key="column"
+              :path="column + 'ColumnWidth'"
+              :units="horizontalUnits"
+              expert="1"
+            >
+              {{ $t('settings.column_sizes_' + column) }}
+            </UnitSetting>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./layout_tab.js"></script>
diff --git a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
index 51974f9fa..36dc8a090 100644
--- a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
+++ b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
@@ -11,6 +11,7 @@ import ProgressButton from 'src/components/progress_button/progress_button.vue'
 import withSubscription from 'src/components/../hocs/with_subscription/with_subscription'
 import withLoadMore from 'src/components/../hocs/with_load_more/with_load_more'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
+import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
 
 const BlockList = withLoadMore({
   fetch: (props, $store) => $store.dispatch('fetchBlocks'),
@@ -39,7 +40,7 @@ const MutesAndBlocks = {
     }
   },
   created () {
-    this.$store.dispatch('fetchTokens')
+    useOAuthTokensStore().fetchTokens()
     this.$store.dispatch('getKnownDomains')
   },
   components: {
@@ -85,7 +86,6 @@ const MutesAndBlocks = {
         // check is it's a local user
         if (user && user.is_local) {
           // append the instance address
-          // eslint-disable-next-line no-undef
           return user.screen_name + '@' + location.hostname
         }
         return user.screen_name
@@ -126,7 +126,7 @@ const MutesAndBlocks = {
       return urls.filter(url => !this.user.domainMutes.includes(url))
     },
     queryKnownDomains (query) {
-      return new Promise((resolve, reject) => {
+      return new Promise((resolve) => {
         resolve(this.knownDomains.filter(url => url.toLowerCase().includes(query)))
       })
     },
diff --git a/src/components/settings_modal/tabs/notifications_tab.vue b/src/components/settings_modal/tabs/notifications_tab.vue
index 10228888c..d08f07b68 100644
--- a/src/components/settings_modal/tabs/notifications_tab.vue
+++ b/src/components/settings_modal/tabs/notifications_tab.vue
@@ -1,7 +1,7 @@
 <template>
   <div :label="$t('settings.notifications')">
-    <div class="setting-item">
-      <h2>{{ $t('settings.notification_setting_annoyance') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('settings.notification_setting_annoyance') }}</h3>
       <ul class="setting-list">
         <li>
           <BooleanSetting path="closingDrawerMarksAsSeen">
@@ -12,11 +12,9 @@
           <BooleanSetting path="ignoreInactionableSeen">
             {{ $t('settings.notification_setting_ignore_inactionable_seen') }}
           </BooleanSetting>
-          <div>
-            <small>
-              {{ $t('settings.notification_setting_ignore_inactionable_seen_tip') }}
-            </small>
-          </div>
+          <p class="sidenote">
+            {{ $t('settings.notification_setting_ignore_inactionable_seen_tip') }}
+          </p>
         </li>
         <li>
           <BooleanSetting
@@ -28,8 +26,8 @@
         </li>
       </ul>
     </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.notification_setting_filters') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('settings.notification_setting_filters') }}</h3>
       <ul class="setting-list">
         <li>
           <BooleanSetting
@@ -40,13 +38,16 @@
           </BooleanSetting>
         </li>
         <li>
-          <h3> {{ $t('settings.notification_visibility') }}</h3>
-          <p v-if="expertLevel > 0">
+          <h4> {{ $t('settings.notification_visibility') }}</h4>
+          <p
+            v-if="expertLevel > 0"
+            class="sidenote"
+          >
             {{ $t('settings.notification_setting_filters_chrome_push') }}
           </p>
           <ul class="setting-list two-column">
             <li>
-              <h4> {{ $t('settings.notification_visibility_mentions') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_mentions') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.mentions">
@@ -61,7 +62,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_statuses') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_statuses') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.statuses">
@@ -76,7 +77,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_likes') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_likes') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.likes">
@@ -91,7 +92,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_repeats') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_repeats') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.repeats">
@@ -106,7 +107,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_emoji_reactions') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_emoji_reactions') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.emojiReactions">
@@ -121,7 +122,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_follows') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_follows') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.follows">
@@ -136,7 +137,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_follow_requests') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_follow_requests') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.followRequest">
@@ -151,7 +152,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_moves') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_moves') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.moves">
@@ -166,7 +167,7 @@
               </ul>
             </li>
             <li>
-              <h4> {{ $t('settings.notification_visibility_polls') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_polls') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.polls">
@@ -181,7 +182,7 @@
               </ul>
             </li>
             <li v-if="canReceiveReports">
-              <h4> {{ $t('settings.notification_visibility_reports') }}</h4>
+              <h5> {{ $t('settings.notification_visibility_reports') }}</h5>
               <ul class="setting-list">
                 <li>
                   <BooleanSetting path="notificationVisibility.reports">
@@ -201,8 +202,6 @@
           <BooleanSetting path="showExtraNotifications">
             {{ $t('settings.notification_show_extra') }}
           </BooleanSetting>
-        </li>
-        <li>
           <ul class="setting-list suboptions">
             <li>
               <BooleanSetting
@@ -243,9 +242,9 @@
 
     <div
       v-if="expertLevel > 0"
-      class="setting-item"
+      class="setting-section"
     >
-      <h2>{{ $t('settings.notification_setting_privacy') }}</h2>
+      <h3>{{ $t('settings.notification_setting_privacy') }}</h3>
       <ul class="setting-list">
         <li>
           <BooleanSetting
@@ -262,11 +261,12 @@
               >
                 {{ $t('settings.enable_web_push_always_show') }}
               </BooleanSetting>
-              <div :class="{ faint: !mergedConfig.webPushNotifications }">
-                <small>
-                  {{ $t('settings.enable_web_push_always_show_tip') }}
-                </small>
-              </div>
+              <p
+                :class="{ faint: !mergedConfig.webPushNotifications }"
+                class="sidenote"
+              >
+                {{ $t('settings.enable_web_push_always_show_tip') }}
+              </p>
             </li>
           </ul>
         </li>
@@ -281,10 +281,12 @@
         </li>
       </ul>
     </div>
-    <div class="setting-item">
-      <p>{{ $t('settings.notification_mutes') }}</p>
-      <p>{{ $t('settings.notification_blocks') }}</p>
-    </div>
+    <p class="sidenote">
+      <ul>
+        <li>{{ $t('settings.notification_mutes') }}</li>
+        <li>{{ $t('settings.notification_blocks') }}</li>
+      </ul>
+    </p>
   </div>
 </template>
 
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.js
similarity index 93%
rename from src/components/settings_modal/tabs/theme_tab/theme_tab.js
rename to src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.js
index 64de28bc3..4b558471f 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js
+++ b/src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.js
@@ -4,9 +4,6 @@ import {
   getContrastRatioLayers,
   relativeLuminance
 } from 'src/services/color_convert/color_convert.js'
-import {
-  getThemes
-} from 'src/services/style_setter/style_setter.js'
 import {
   newImporter,
   newExporter
@@ -34,6 +31,7 @@ import {
   getCssRules,
   getScopedVersion
 } from 'src/services/theme_data/css_utils.js'
+import { createStyleSheet, adoptStyleSheets } from 'src/services/style_setter/style_setter.js'
 
 import ColorInput from 'src/components/color_input/color_input.vue'
 import RangeInput from 'src/components/range_input/range_input.vue'
@@ -46,6 +44,7 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Select from 'src/components/select/select.vue'
 
 import Preview from './theme_preview.vue'
+import { useInterfaceStore } from 'src/stores/interface'
 
 // List of color values used in v1
 const v1OnlyNames = [
@@ -70,7 +69,6 @@ const colorConvert = (color) => {
 export default {
   data () {
     return {
-      themeV3Preview: [],
       themeImporter: newImporter({
         validator: this.importValidator,
         onImport: this.onImport,
@@ -123,31 +121,24 @@ export default {
     }
   },
   created () {
-    const self = this
+    const currentIndex = this.$store.state.instance.themesIndex
 
-    getThemes()
-      .then((promises) => {
-        return Promise.all(
-          Object.entries(promises)
-            .map(([k, v]) => v.then(res => [k, res]))
-        )
-      })
-      .then(themes => themes.reduce((acc, [k, v]) => {
-        if (v) {
-          return {
-            ...acc,
-            [k]: v
-          }
-        } else {
-          return acc
-        }
-      }, {}))
-      .then((themesComplete) => {
-        self.availableStyles = themesComplete
-      })
+    let promise
+    if (currentIndex) {
+      promise = Promise.resolve(currentIndex)
+    } else {
+      promise = useInterfaceStore().fetchThemesIndex()
+    }
+
+    promise.then(themesIndex => {
+      Object
+        .values(themesIndex)
+        .forEach(themeFunc => {
+          themeFunc().then(themeData => themeData && this.availableStyles.push(themeData))
+        })
+    })
   },
   mounted () {
-    this.loadThemeFromLocalStorage()
     if (typeof this.shadowSelected === 'undefined') {
       this.shadowSelected = this.shadowsAvailable[0]
     }
@@ -305,6 +296,9 @@ export default {
         return {}
       }
     },
+    themeDataUsed () {
+      return useInterfaceStore().themeDataUsed
+    },
     shadowsAvailable () {
       return Object.keys(DEFAULT_SHADOWS).sort()
     },
@@ -412,9 +406,6 @@ export default {
       forceUseSource = false
     ) {
       this.dismissWarning()
-      if (!source && !theme) {
-        throw new Error('Can\'t load theme: empty')
-      }
       const version = (origin === 'localStorage' && !theme.colors)
         ? 'l1'
         : fileVersion
@@ -489,23 +480,12 @@ export default {
       }
       this.dismissWarning()
     },
-    loadThemeFromLocalStorage (confirmLoadSource = false, forceSnapshot = false) {
-      const {
-        customTheme: theme,
-        customThemeSource: source
-      } = this.$store.getters.mergedConfig
-      if (!theme && !source) {
-        // Anon user or never touched themes
-        this.loadTheme(
-          this.$store.state.instance.themeData,
-          'defaults',
-          confirmLoadSource
-        )
-      } else {
+    loadThemeFromLocalStorage (confirmLoadSource = false) {
+      const theme = this.themeDataUsed?.source
+      if (theme) {
         this.loadTheme(
           {
-            theme,
-            source: forceSnapshot ? theme : source
+            theme
           },
           'localStorage',
           confirmLoadSource
@@ -513,7 +493,7 @@ export default {
       }
     },
     setCustomTheme () {
-      this.$store.dispatch('setThemeV2', {
+      useInterfaceStore().setThemeV2({
         customTheme: {
           ignore: true,
           themeFileVersion: this.selectedVersion,
@@ -556,8 +536,8 @@ export default {
       this.tempImportFile = parsed
       this.loadTheme(parsed, 'file', forceSource)
     },
-    onImportFailure (result) {
-      this.$store.dispatch('pushGlobalNotice', { messageKey: 'settings.invalid_theme_imported', level: 'error' })
+    onImportFailure () {
+      useInterfaceStore().pushGlobalNotice({ messageKey: 'settings.invalid_theme_imported', level: 'error' })
     },
     importValidator (parsed) {
       const version = parsed._pleroma_theme_version
@@ -717,13 +697,22 @@ export default {
         liteMode: true
       })
 
-      this.themeV3Preview = getScopedVersion(
+      const sheet = createStyleSheet('theme-tab-overall-preview', 90)
+      const rule = getScopedVersion(
         getCssRules(theme3.eager),
-        '#theme-preview'
+        '&'
       ).join('\n')
+
+      sheet.clear()
+      sheet.addRule('#theme-preview {\n' + rule + '\n}')
+      sheet.ready = true
+      adoptStyleSheets()
     }
   },
   watch: {
+    themeDataUsed () {
+      this.loadThemeFromLocalStorage()
+    },
     currentRadii () {
       try {
         this.previewTheme.radii = generateRadii({ radii: this.currentRadii }).theme.radii
@@ -774,7 +763,7 @@ export default {
       }
     },
     selected () {
-      this.selectedTheme = Object.entries(this.availableStyles).find(([k, s]) => {
+      this.selectedTheme = Object.entries(this.availableStyles).find(([, s]) => {
         if (Array.isArray(s)) {
           return s[0] === this.selected
         } else {
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.scss b/src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.scss
similarity index 93%
rename from src/components/settings_modal/tabs/theme_tab/theme_tab.scss
rename to src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.scss
index e86e61dab..9ec6b7b2f 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.scss
+++ b/src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.scss
@@ -1,4 +1,7 @@
-.theme-tab {
+.old-theme-tab {
+  min-width: var(--themeEditorMinWidth, fit-content);
+  margin: 1em;
+
   .deprecation-warning {
     padding: 0.5em;
     margin: 2em;
@@ -45,12 +48,16 @@
       flex: 0;
 
       &[type="number"] {
-        min-width: 5em;
+        min-width: 9em;
+
+        &.-small {
+          min-width: 5em;
+        }
       }
 
       &[type="range"] {
         flex: 1;
-        min-width: 2em;
+        min-width: 9em;
         align-self: center;
         margin: 0 0.5em;
       }
@@ -101,7 +108,7 @@
     justify-content: space-between;
     align-items: baseline;
     width: 100%;
-    min-height: 30px;
+    min-height: 2.1em;
     margin-bottom: 1em;
 
     p {
@@ -206,7 +213,7 @@
   .theme-color-cl,
   .theme-radius-in,
   .theme-color-in {
-    margin-left: 4px;
+    margin-left: 0.3em;
   }
 
   .theme-radius-in {
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.vue
similarity index 98%
rename from src/components/settings_modal/tabs/theme_tab/theme_tab.vue
rename to src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.vue
index 00a55832f..751e113a0 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="theme-tab">
+  <div class="old-theme-tab">
     <div class="alert warning deprecation-warning">
       {{ $t("settings.style.themes2_outdated") }}
     </div>
@@ -123,12 +123,6 @@
       </div>
     </div>
 
-    <!-- eslint-disable vue/no-v-html vue/no-v-text-v-html-on-component -->
-    <component
-      :is="'style'"
-      v-html="themeV3Preview"
-    />
-    <!-- eslint-enable vue/no-v-html vue/no-v-text-v-html-on-component -->
     <preview id="theme-preview" />
 
     <div>
@@ -187,14 +181,14 @@
               name="accentColor"
               :fallback="previewTheme.colors?.link"
               :label="$t('settings.accent')"
-              :show-optional-tickbox="typeof linkColorLocal !== 'undefined'"
+              :show-optional-checkbox="typeof linkColorLocal !== 'undefined'"
             />
             <ColorInput
               v-model="linkColorLocal"
               name="linkColor"
               :fallback="previewTheme.colors?.accent"
               :label="$t('settings.links')"
-              :show-optional-tickbox="typeof accentColorLocal !== 'undefined'"
+              :show-optional-checkbox="typeof accentColorLocal !== 'undefined'"
             />
             <ContrastRatio :contrast="previewContrast.bgLink" />
           </div>
@@ -957,6 +951,8 @@
             v-model="currentShadow"
             :separate-inset="shadowSelected === 'avatar' || shadowSelected === 'avatarStatus'"
             :fallback="currentShadowFallback"
+            :static-vars="previewTheme.colors"
+            :compact="true"
           />
         </div>
         <div
@@ -1024,6 +1020,6 @@
   </div>
 </template>
 
-<script src="./theme_tab.js"></script>
+<script src="./old_theme_tab.js"></script>
 
-<style src="./theme_tab.scss" lang="scss"></style>
+<style src="./old_theme_tab.scss" lang="scss"></style>
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_preview.vue b/src/components/settings_modal/tabs/old_theme_tab/theme_preview.vue
similarity index 90%
rename from src/components/settings_modal/tabs/theme_tab/theme_preview.vue
rename to src/components/settings_modal/tabs/old_theme_tab/theme_preview.vue
index dbaecee45..df2d9f9e9 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_preview.vue
+++ b/src/components/settings_modal/tabs/old_theme_tab/theme_preview.vue
@@ -3,12 +3,12 @@
     <div class="underlay underlay-preview" />
     <div class="panel dummy">
       <div class="panel-heading">
-        <div class="title">
+        <h1 class="title">
           {{ $t('settings.style.preview.header') }}
           <span class="badge -notification">
             99
           </span>
-        </div>
+        </h1>
         <span class="faint">
           {{ $t('settings.style.preview.header_faint') }}
         </span>
@@ -21,7 +21,10 @@
       </div>
       <div class="panel-body theme-preview-content">
         <div class="post">
-          <div class="avatar still-image">
+          <div
+            class="avatar still-image"
+            aria-hidden="true"
+          >
             ( ͡° ͜ʖ ͡°)
           </div>
           <div class="content">
@@ -71,7 +74,10 @@
         </div>
 
         <div class="after-post">
-          <div class="avatar-alt">
+          <div
+            class="avatar-alt"
+            aria-hidden="true"
+          >
             :^)
           </div>
           <div class="content">
@@ -149,7 +155,7 @@ export default {
   background-position: 50% 50%;
 
   .theme-preview-content {
-    padding: 20px;
+    padding: 1.5em;
   }
 
   .dummy {
@@ -203,19 +209,21 @@ export default {
 
     .avatar-alt {
       flex: 0 auto;
-      margin-left: 28px;
-      font-size: 12px;
-      min-width: 20px;
-      min-height: 20px;
-      line-height: 20px;
+      margin-left: 2em;
+      font-size: 0.85em;
+      min-width: 2.2rem;
+      min-height: 2.2rem;
+      line-height: 1.5em;
+      align-content: center;
     }
 
     .avatar {
       flex: 0 auto;
-      width: 48px;
-      height: 48px;
-      font-size: 14px;
-      line-height: 48px;
+      width: 3.5em;
+      height: 3.5em;
+      font-size: 1rem;
+      line-height: 3.5em;
+      justify-content: center;
     }
 
     .actions {
@@ -241,10 +249,7 @@ export default {
 
   .underlay-preview {
     position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 10px;
-    right: 10px;
+    inset: 0 0.9em;
   }
 }
  </style>
diff --git a/src/components/settings_modal/tabs/posts_tab.js b/src/components/settings_modal/tabs/posts_tab.js
new file mode 100644
index 000000000..094583c15
--- /dev/null
+++ b/src/components/settings_modal/tabs/posts_tab.js
@@ -0,0 +1,78 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
+import FontControl from 'src/components/font_control/font_control.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const GeneralTab = {
+  props: {
+    parentCollapsed: {
+      required: true,
+      type: Boolean
+    }
+  },
+  data () {
+    return {
+      conversationDisplayOptions: ['tree', 'linear'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.conversation_display_${mode}`)
+      })),
+      conversationOtherRepliesButtonOptions: ['below', 'inside'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.conversation_other_replies_button_${mode}`)
+      })),
+      mentionLinkDisplayOptions: ['short', 'full_for_remote', 'full'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.mention_link_display_${mode}`)
+      })),
+      userPopoverAvatarActionOptions: ['close', 'zoom', 'open'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.user_popover_avatar_action_${mode}`)
+      })),
+      unsavedPostActionOptions: ['save', 'discard', 'confirm'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.unsaved_post_action_${mode}`)
+      })),
+      loopSilentAvailable:
+      // Firefox
+      Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') ||
+      // Chrome-likes
+      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'webkitAudioDecodedByteCount') ||
+      // Future spec, still not supported in Nightly 63 as of 08/2018
+      Object.getOwnPropertyDescriptor(HTMLMediaElement.prototype, 'audioTracks')
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    FontControl,
+    ProfileSettingIndicator
+  },
+  computed: {
+    ...SharedComputedObject(),
+  },
+  methods: {
+    updateFont (key, value) {
+      this.$store.dispatch('setOption', {
+        name: 'theme3hacks',
+        value: {
+          ...this.mergedConfig.theme3hacks,
+          fonts: {
+            ...this.mergedConfig.theme3hacks.fonts,
+            [key]: value
+          }
+        }
+      })
+    },
+  }
+}
+
+export default GeneralTab
diff --git a/src/components/settings_modal/tabs/posts_tab.scss b/src/components/settings_modal/tabs/posts_tab.scss
new file mode 100644
index 000000000..84c3d0dd2
--- /dev/null
+++ b/src/components/settings_modal/tabs/posts_tab.scss
@@ -0,0 +1,5 @@
+.posts-tab {
+  .greentext {
+    color: var(--funtextGreentext);
+  }
+}
diff --git a/src/components/settings_modal/tabs/posts_tab.vue b/src/components/settings_modal/tabs/posts_tab.vue
new file mode 100644
index 000000000..0a864d179
--- /dev/null
+++ b/src/components/settings_modal/tabs/posts_tab.vue
@@ -0,0 +1,257 @@
+<template>
+  <div class="posts-tab">
+    <div class="setting-section">
+      <h3>{{ $t('settings.posts_appearance') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path="collapseMessageWithSubject">
+            {{ $t('settings.collapse_subject') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <ChoiceSetting
+            id="conversationDisplay"
+            path="conversationDisplay"
+            :options="conversationDisplayOptions"
+          >
+            {{ $t('settings.conversation_display') }}
+          </ChoiceSetting>
+          <ul
+            v-if="mergedConfig.conversationDisplay !== 'linear'"
+            class="setting-list suboptions"
+          >
+            <li>
+              <BooleanSetting path="conversationTreeAdvanced">
+                {{ $t('settings.tree_advanced') }}
+              </BooleanSetting>
+            </li>
+            <li>
+              <BooleanSetting
+                path="conversationTreeFadeAncestors"
+                :expert="1"
+              >
+                {{ $t('settings.tree_fade_ancestors') }}
+              </BooleanSetting>
+            </li>
+            <li>
+              <IntegerSetting
+                path="maxDepthInThread"
+                :min="3"
+                :expert="1"
+              >
+                {{ $t('settings.max_depth_in_thread') }}
+              </IntegerSetting>
+            </li>
+            <li>
+              <ChoiceSetting
+                id="conversationOtherRepliesButton"
+                path="conversationOtherRepliesButton"
+                :options="conversationOtherRepliesButtonOptions"
+                :expert="1"
+              >
+                {{ $t('settings.conversation_other_replies_button') }}
+              </ChoiceSetting>
+            </li>
+          </ul>
+        </li>
+        <li>
+          <FontControl
+            :model-value="mergedConfig.theme3hacks.fonts.post"
+            name="post"
+            :fallback="{ family: 'inherit' }"
+            :label="$t('settings.style.fonts.components.post')"
+            @update:model-value="v => updateFont('post', v)"
+          />
+        </li>
+        <li>
+          <FontControl
+            :model-value="mergedConfig.theme3hacks.fonts.monospace"
+            name="postCode"
+            :fallback="{ family: 'monospace' }"
+            :label="$t('settings.style.fonts.components.monospace')"
+            @update:model-value="v => updateFont('monospace', v)"
+          />
+        </li>
+        <li>
+          <BooleanSetting path="greentext">
+            <i18n-t
+              keypath="settings.plaintext_quotes"
+              tag="span"
+            >
+              <span class="greentext">
+                {{ $t('settings.greentext_quotes') }}
+              </span>
+            </i18n-t>
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="emojiReactionsOnTimeline"
+            expert="1"
+          >
+            {{ $t('settings.emoji_reactions_on_timeline') }}
+          </BooleanSetting>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.mention_links') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ChoiceSetting
+            id="mentionLinkDisplay"
+            path="mentionLinkDisplay"
+            :options="mentionLinkDisplayOptions"
+          >
+            {{ $t('settings.mention_link_display') }}
+          </ChoiceSetting>
+          <ul class="setting-list suboptions">
+            <li>
+              <BooleanSetting
+                v-if="mergedConfig.mentionLinkDisplay !== 'short'"
+                path="mentionLinkFadeDomain"
+              >
+                {{ $t('settings.mention_link_fade_domain') }}
+              </BooleanSetting>
+            </li>
+          </ul>
+        </li>
+        <li>
+          <BooleanSetting
+            path="mentionLinkShowTooltip"
+            expert="1"
+          >
+            {{ $t('settings.mention_link_use_tooltip') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="mentionLinkShowAvatar">
+            {{ $t('settings.mention_link_show_avatar') }}
+          </BooleanSetting>
+        </li>
+        <li v-if="user">
+          <BooleanSetting
+            path="mentionLinkBoldenYou"
+            expert="1"
+          >
+            {{ $t('settings.mention_link_bolden_you') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            v-if="user"
+            source="profile"
+            path="stripRichContent"
+            expert="1"
+          >
+            {{ $t('settings.no_rich_text_description') }}
+          </BooleanSetting>
+          <ul
+            v-if="mergedConfig.useAbsoluteTimeFormat"
+            class="setting-list suboptions"
+          >
+            <li>
+              <UnitSetting
+                path="absoluteTimeFormatMinAge"
+                unit-set="time"
+                :units="['s', 'm', 'h', 'd']"
+                :min="0"
+              >
+                {{ $t('settings.absolute_time_format_min_age') }}
+              </UnitSetting>
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <h3>{{ $t('settings.attachments') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path="stopGifs">
+            {{ $t('settings.stop_gifs') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting path="hideNsfw">
+            {{ $t('settings.nsfw_clickthrough') }}
+          </BooleanSetting>
+          <ul class="setting-list suboptions">
+            <li>
+              <BooleanSetting
+                path="preloadImage"
+                expert="1"
+                parent-path="hideNsfw"
+              >
+                {{ $t('settings.preload_images') }}
+              </BooleanSetting>
+            </li>
+            <li>
+              <BooleanSetting
+                path="useOneClickNsfw"
+                expert="1"
+                parent-path="hideNsfw"
+              >
+                {{ $t('settings.use_one_click_nsfw') }}
+              </BooleanSetting>
+            </li>
+          </ul>
+        </li>
+        <li>
+          <BooleanSetting
+            path="loopVideo"
+            expert="1"
+          >
+            {{ $t('settings.loop_video') }}
+          </BooleanSetting>
+          <ul class="setting-list suboptions">
+            <li>
+              <BooleanSetting
+                path="loopVideoSilentOnly"
+                expert="1"
+                parent-path="loopVideo"
+                :disabled="!loopSilentAvailable"
+              >
+                {{ $t('settings.loop_video_silent_only') }}
+              </BooleanSetting>
+              <div
+                v-if="!loopSilentAvailable"
+                class="unavailable"
+              >
+                <FAIcon icon="globe" />! {{ $t('settings.limited_availability') }}
+              </div>
+            </li>
+          </ul>
+        </li>
+        <li>
+          <BooleanSetting
+            path="playVideosInModal"
+            expert="1"
+          >
+            {{ $t('settings.play_videos_in_modal') }}
+          </BooleanSetting>
+        </li>
+        <li>
+          <BooleanSetting
+            path="useContainFit"
+            expert="1"
+          >
+            {{ $t('settings.use_contain_fit') }}
+          </BooleanSetting>
+        </li>
+      </ul>
+      <h3 v-if="expertLevel > 0">
+        {{ $t('settings.fun') }}
+      </h3>
+      <ul
+        v-if="expertLevel > 0"
+        class="setting-list"
+      >
+        <li v-if="user">
+          <BooleanSetting path="mentionLinkShowYous">
+            {{ $t('settings.show_yous') }}
+          </BooleanSetting>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./posts_tab.js"></script>
+<style src="./posts_tab.scss"></style>
diff --git a/src/components/settings_modal/tabs/profile_tab.js b/src/components/settings_modal/tabs/profile_tab.js
index dee174508..9e13eed69 100644
--- a/src/components/settings_modal/tabs/profile_tab.js
+++ b/src/components/settings_modal/tabs/profile_tab.js
@@ -1,19 +1,8 @@
-import unescape from 'lodash/unescape'
-import merge from 'lodash/merge'
-import ImageCropper from 'src/components/image_cropper/image_cropper.vue'
-import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
-import fileSizeFormatService from 'src/components/../services/file_size_format/file_size_format.js'
-import ProgressButton from 'src/components/progress_button/progress_button.vue'
-import EmojiInput from 'src/components/emoji_input/emoji_input.vue'
-import suggestor from 'src/components/emoji_input/suggestor.js'
-import Autosuggest from 'src/components/autosuggest/autosuggest.vue'
+import UserCard from 'src/components/user_card/user_card.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
-import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
-import Select from 'src/components/select/select.vue'
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
-import localeService from 'src/services/locale/locale.service.js'
-import { propsToNative } from 'src/services/attributes_helper/attributes_helper.service.js'
+import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -31,249 +20,42 @@ library.add(
 const ProfileTab = {
   data () {
     return {
-      newName: this.$store.state.users.currentUser.name_unescaped,
-      newBio: unescape(this.$store.state.users.currentUser.description),
-      newLocked: this.$store.state.users.currentUser.locked,
-      newBirthday: this.$store.state.users.currentUser.birthday,
-      showBirthday: this.$store.state.users.currentUser.show_birthday,
-      newFields: this.$store.state.users.currentUser.fields.map(field => ({ name: field.name, value: field.value })),
-      showRole: this.$store.state.users.currentUser.show_role,
-      role: this.$store.state.users.currentUser.role,
-      bot: this.$store.state.users.currentUser.bot,
-      actorType: this.$store.state.users.currentUser.actor_type,
-      pickAvatarBtnVisible: true,
-      bannerUploading: false,
-      backgroundUploading: false,
-      banner: null,
-      bannerPreview: null,
-      background: null,
-      backgroundPreview: null,
-      emailLanguage: this.$store.state.users.currentUser.language || ['']
+      // Whether user is locked or not
+      locked: this.$store.state.users.currentUser.locked,
     }
   },
   components: {
-    ScopeSelector,
-    ImageCropper,
-    EmojiInput,
-    Autosuggest,
-    ProgressButton,
+    UserCard,
     Checkbox,
     BooleanSetting,
-    InterfaceLanguageSwitcher,
-    Select
+    ProfileSettingIndicator
   },
   computed: {
     user () {
       return this.$store.state.users.currentUser
     },
-    ...SharedComputedObject(),
-    emojiUserSuggestor () {
-      return suggestor({
-        emoji: [
-          ...this.$store.getters.standardEmojiList,
-          ...this.$store.state.instance.customEmoji
-        ],
-        store: this.$store
-      })
-    },
-    emojiSuggestor () {
-      return suggestor({
-        emoji: [
-          ...this.$store.getters.standardEmojiList,
-          ...this.$store.state.instance.customEmoji
-        ]
-      })
-    },
-    userSuggestor () {
-      return suggestor({ store: this.$store })
-    },
-    fieldsLimits () {
-      return this.$store.state.instance.fieldsLimits
-    },
-    maxFields () {
-      return this.fieldsLimits ? this.fieldsLimits.maxFields : 0
-    },
-    defaultAvatar () {
-      return this.$store.state.instance.server + this.$store.state.instance.defaultAvatar
-    },
-    defaultBanner () {
-      return this.$store.state.instance.server + this.$store.state.instance.defaultBanner
-    },
-    isDefaultAvatar () {
-      const baseAvatar = this.$store.state.instance.defaultAvatar
-      return !(this.$store.state.users.currentUser.profile_image_url) ||
-      this.$store.state.users.currentUser.profile_image_url.includes(baseAvatar)
-    },
-    isDefaultBanner () {
-      const baseBanner = this.$store.state.instance.defaultBanner
-      return !(this.$store.state.users.currentUser.cover_photo) ||
-      this.$store.state.users.currentUser.cover_photo.includes(baseBanner)
-    },
-    isDefaultBackground () {
-      return !(this.$store.state.users.currentUser.background_image)
-    },
-    avatarImgSrc () {
-      const src = this.$store.state.users.currentUser.profile_image_url_original
-      return (!src) ? this.defaultAvatar : src
-    },
-    bannerImgSrc () {
-      const src = this.$store.state.users.currentUser.cover_photo
-      return (!src) ? this.defaultBanner : src
-    },
-    groupActorAvailable () {
-      return this.$store.state.instance.groupActorAvailable
-    },
-    availableActorTypes () {
-      return this.groupActorAvailable ? ['Person', 'Service', 'Group'] : ['Person', 'Service']
-    }
+    ...SharedComputedObject()
   },
   methods: {
     updateProfile () {
       const params = {
-        note: this.newBio,
-        locked: this.newLocked,
-        // Backend notation.
-        /* eslint-disable camelcase */
-        display_name: this.newName,
-        fields_attributes: this.newFields.filter(el => el != null),
-        actor_type: this.actorType,
-        show_role: this.showRole,
-        birthday: this.newBirthday || '',
-        show_birthday: this.showBirthday
-        /* eslint-enable camelcase */
-      }
-
-      if (this.emailLanguage) {
-        params.language = localeService.internalToBackendLocaleMulti(this.emailLanguage)
+        locked: this.locked
       }
 
       this.$store.state.api.backendInteractor
         .updateProfile({ params })
         .then((user) => {
-          this.newFields.splice(user.fields.length)
-          merge(this.newFields, user.fields)
           this.$store.commit('addNewUsers', [user])
           this.$store.commit('setCurrentUser', user)
         })
-    },
-    changeVis (visibility) {
-      this.newDefaultScope = visibility
-    },
-    addField () {
-      if (this.newFields.length < this.maxFields) {
-        this.newFields.push({ name: '', value: '' })
-        return true
-      }
-      return false
-    },
-    deleteField (index, event) {
-      this.newFields.splice(index, 1)
-    },
-    uploadFile (slot, e) {
-      const file = e.target.files[0]
-      if (!file) { return }
-      if (file.size > this.$store.state.instance[slot + 'limit']) {
-        const filesize = fileSizeFormatService.fileSizeFormat(file.size)
-        const allowedsize = fileSizeFormatService.fileSizeFormat(this.$store.state.instance[slot + 'limit'])
-        this.$store.dispatch('pushGlobalNotice', {
-          messageKey: 'upload.error.message',
-          messageArgs: [
-            this.$t('upload.error.file_too_big', {
-              filesize: filesize.num,
-              filesizeunit: filesize.unit,
-              allowedsize: allowedsize.num,
-              allowedsizeunit: allowedsize.unit
-            })
-          ],
-          level: 'error'
+        .catch((error) => {
+          this.displayUploadError(error)
         })
-        return
-      }
-      // eslint-disable-next-line no-undef
-      const reader = new FileReader()
-      reader.onload = ({ target }) => {
-        const img = target.result
-        this[slot + 'Preview'] = img
-        this[slot] = file
-      }
-      reader.readAsDataURL(file)
-    },
-    resetAvatar () {
-      const confirmed = window.confirm(this.$t('settings.reset_avatar_confirm'))
-      if (confirmed) {
-        this.submitAvatar(undefined, '')
-      }
-    },
-    resetBanner () {
-      const confirmed = window.confirm(this.$t('settings.reset_banner_confirm'))
-      if (confirmed) {
-        this.submitBanner('')
-      }
-    },
-    resetBackground () {
-      const confirmed = window.confirm(this.$t('settings.reset_background_confirm'))
-      if (confirmed) {
-        this.submitBackground('')
-      }
-    },
-    submitAvatar (cropper, file) {
-      const that = this
-      return new Promise((resolve, reject) => {
-        function updateAvatar (avatar, avatarName) {
-          that.$store.state.api.backendInteractor.updateProfileImages({ avatar, avatarName })
-            .then((user) => {
-              that.$store.commit('addNewUsers', [user])
-              that.$store.commit('setCurrentUser', user)
-              resolve()
-            })
-            .catch((error) => {
-              that.displayUploadError(error)
-              reject(error)
-            })
-        }
-
-        if (cropper) {
-          cropper.getCroppedCanvas().toBlob((data) => updateAvatar(data, file.name), file.type)
-        } else {
-          updateAvatar(file, file.name)
-        }
-      })
-    },
-    submitBanner (banner) {
-      if (!this.bannerPreview && banner !== '') { return }
-
-      this.bannerUploading = true
-      this.$store.state.api.backendInteractor.updateProfileImages({ banner })
-        .then((user) => {
-          this.$store.commit('addNewUsers', [user])
-          this.$store.commit('setCurrentUser', user)
-          this.bannerPreview = null
-        })
-        .catch(this.displayUploadError)
-        .finally(() => { this.bannerUploading = false })
-    },
-    submitBackground (background) {
-      if (!this.backgroundPreview && background !== '') { return }
-
-      this.backgroundUploading = true
-      this.$store.state.api.backendInteractor.updateProfileImages({ background })
-        .then((data) => {
-          this.$store.commit('addNewUsers', [data])
-          this.$store.commit('setCurrentUser', data)
-          this.backgroundPreview = null
-        })
-        .catch(this.displayUploadError)
-        .finally(() => { this.backgroundUploading = false })
-    },
-    displayUploadError (error) {
-      this.$store.dispatch('pushGlobalNotice', {
-        messageKey: 'upload.error.message',
-        messageArgs: [error.message],
-        level: 'error'
-      })
-    },
-    propsToNative (props) {
-      return propsToNative(props)
+    }
+  },
+  watch: {
+    locked () {
+      this.updateProfile()
     }
   }
 }
diff --git a/src/components/settings_modal/tabs/profile_tab.scss b/src/components/settings_modal/tabs/profile_tab.scss
index 7eda943b7..6e8b2b131 100644
--- a/src/components/settings_modal/tabs/profile_tab.scss
+++ b/src/components/settings_modal/tabs/profile_tab.scss
@@ -1,133 +1,38 @@
 .profile-tab {
-  .bio {
+  // overriding global for better look
+  .setting-section.profile-edit {
     margin: 0;
-  }
 
-  .visibility-tray {
-    padding-top: 5px;
-  }
-
-  input[type="file"] {
-    padding: 5px;
-    height: auto;
-  }
-
-  .banner-background-preview {
-    max-width: 100%;
-    width: 300px;
-    position: relative;
-
-    img {
-      width: 100%;
-    }
-  }
-
-  .uploading {
-    font-size: 1.5em;
-    margin: 0.25em;
-  }
-
-  .name-changer {
-    width: 100%;
-  }
-
-  .current-avatar-container {
-    position: relative;
-    width: 150px;
-    height: 150px;
-  }
-
-  .current-avatar {
-    display: block;
-    width: 100%;
-    height: 100%;
-    border-radius: var(--roundness);
-  }
-
-  .reset-button {
-    position: absolute;
-    top: 0.2em;
-    right: 0.2em;
-    border-radius: var(--roundness);
-    background-color: rgb(0 0 0 / 60%);
-    opacity: 0.7;
-    width: 1.5em;
-    height: 1.5em;
-    text-align: center;
-    line-height: 1.5em;
-    font-size: 1.5em;
-    cursor: pointer;
-
-    &:hover {
-      opacity: 1;
+    h2 {
+      margin-left: 1rem;
     }
 
-    svg {
-      color: white;
-    }
-  }
-
-  .oauth-tokens {
-    width: 100%;
-
-    th {
-      text-align: left;
+    .user-card {
+      padding: 1.2em;
+      overflow: hidden;
     }
 
-    .actions {
-      text-align: right;
+  }
+
+  .setting-item {
+    .custom-boolean-setting {
+      display: grid;
+      grid-template-columns: subgrid;
+
+      .label {
+        grid-area: label;
+        text-align: right;
+      }
+
+      .-mobile & {
+        .label {
+          text-align: left;
+        }
+      }
+
+      .checkbox-indicator {
+        grid-area: control;
+      }
     }
   }
-
-  &-usersearch-wrapper {
-    padding: 1em;
-  }
-
-  &-bulk-actions {
-    text-align: right;
-    padding: 0 1em;
-    min-height: 2em;
-
-    button {
-      width: 10em;
-    }
-  }
-
-  &-domain-mute-form {
-    padding: 1em;
-    display: flex;
-    flex-direction: column;
-
-    button {
-      align-self: flex-end;
-      margin-top: 1em;
-      width: 10em;
-    }
-  }
-
-  .setting-subitem {
-    margin-left: 1.75em;
-  }
-
-  .profile-fields {
-    display: flex;
-
-    & > .emoji-input {
-      flex: 1 1 auto;
-      margin: 0 0.2em 0.5em;
-      min-width: 0;
-    }
-
-    .delete-field {
-      width: 20px;
-      align-self: center;
-      margin: 0 0.2em 0.5em;
-      padding: 0 0.5em;
-    }
-  }
-
-  .birthday-input {
-    display: block;
-    margin-bottom: 1em;
-  }
 }
diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index 034034a12..80064daf8 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -1,283 +1,25 @@
 <template>
   <div class="profile-tab">
-    <div class="setting-item">
-      <h2>{{ $t('settings.name_bio') }}</h2>
-      <p>{{ $t('settings.name') }}</p>
-      <EmojiInput
-        v-model="newName"
-        enable-emoji-picker
-        :suggest="emojiSuggestor"
-      >
-        <template #default="inputProps">
-          <input
-            id="username"
-            v-model="newName"
-            class="input name-changer"
-            v-bind="propsToNative(inputProps)"
-          >
-        </template>
-      </EmojiInput>
-      <p>{{ $t('settings.bio') }}</p>
-      <EmojiInput
-        v-model="newBio"
-        enable-emoji-picker
-        :suggest="emojiUserSuggestor"
-      >
-        <template #default="inputProps">
-          <textarea
-            v-model="newBio"
-            class="input bio resize-height"
-            v-bind="propsToNative(inputProps)"
-          />
-        </template>
-      </EmojiInput>
-      <p v-if="role === 'admin' || role === 'moderator'">
-        <Checkbox v-model="showRole">
-          <template v-if="role === 'admin'">
-            {{ $t('settings.show_admin_badge') }}
-          </template>
-          <template v-if="role === 'moderator'">
-            {{ $t('settings.show_moderator_badge') }}
-          </template>
-        </Checkbox>
-      </p>
-      <div>
-        <p>{{ $t('settings.birthday.label') }}</p>
-        <input
-          id="birthday"
-          v-model="newBirthday"
-          type="date"
-          class="input birthday-input"
-        >
-        <Checkbox v-model="showBirthday">
-          {{ $t('settings.birthday.show_birthday') }}
-        </Checkbox>
-      </div>
-      <div v-if="maxFields > 0">
-        <p>{{ $t('settings.profile_fields.label') }}</p>
-        <div
-          v-for="(_, i) in newFields"
-          :key="i"
-          class="profile-fields"
-        >
-          <EmojiInput
-            v-model="newFields[i].name"
-            enable-emoji-picker
-            hide-emoji-button
-            :suggest="userSuggestor"
-          >
-            <template #default="inputProps">
-              <input
-                v-model="newFields[i].name"
-                :placeholder="$t('settings.profile_fields.name')"
-                v-bind="propsToNative(inputProps)"
-                class="input"
-              >
-            </template>
-          </EmojiInput>
-          <EmojiInput
-            v-model="newFields[i].value"
-            enable-emoji-picker
-            hide-emoji-button
-            :suggest="userSuggestor"
-          >
-            <template #default="inputProps">
-              <input
-                v-model="newFields[i].value"
-                :placeholder="$t('settings.profile_fields.value')"
-                v-bind="propsToNative(inputProps)"
-                class="input"
-              >
-            </template>
-          </EmojiInput>
-          <button
-            class="delete-field button-unstyled -hover-highlight"
-            @click="deleteField(i)"
-          >
-            <!-- TODO something is wrong with v-show here -->
-            <FAIcon
-              v-if="newFields.length > 1"
-              icon="times"
-            />
-          </button>
-        </div>
-        <button
-          v-if="newFields.length < maxFields"
-          class="add-field faint button-unstyled -hover-highlight"
-          @click="addField"
-        >
-          <FAIcon icon="plus" />
-          {{ $t("settings.profile_fields.add_field") }}
-        </button>
-      </div>
-      <p>
-        <label>
-          {{ $t('settings.actor_type') }}
-          <Select v-model="actorType">
-            <option
-              v-for="option in availableActorTypes"
-              :key="option"
-              :value="option"
-            >
-              {{ $t('settings.actor_type_' + option) }}
-            </option>
-          </Select>
-        </label>
-      </p>
-      <div v-if="groupActorAvailable">
-        <small>
-          {{ $t('settings.actor_type_description') }}
-        </small>
-      </div>
-      <p>
-        <interface-language-switcher
-          :prompt-text="$t('settings.email_language')"
-          :language="emailLanguage"
-          :set-language="val => emailLanguage = val"
-        />
-      </p>
-      <button
-        :disabled="newName && newName.length === 0"
-        class="btn button-default"
-        @click="updateProfile"
-      >
-        {{ $t('settings.save') }}
-      </button>
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.avatar') }}</h2>
-      <p class="visibility-notice">
-        {{ $t('settings.avatar_size_instruction') }}
-      </p>
-      <div class="current-avatar-container">
-        <img
-          :src="user.profile_image_url_original"
-          class="current-avatar"
-        >
-        <button
-          v-if="!isDefaultAvatar && pickAvatarBtnVisible"
-          :title="$t('settings.reset_avatar')"
-          class="button-unstyled reset-button"
-          @click="resetAvatar"
-        >
-          <FAIcon
-            icon="times"
-            type="button"
-          />
-        </button>
-      </div>
-      <p>{{ $t('settings.set_new_avatar') }}</p>
-      <button
-        v-show="pickAvatarBtnVisible"
-        id="pick-avatar"
-        class="button-default btn"
-        type="button"
-      >
-        {{ $t('settings.upload_a_photo') }}
-      </button>
-      <image-cropper
-        trigger="#pick-avatar"
-        :submit-handler="submitAvatar"
-        @open="pickAvatarBtnVisible=false"
-        @close="pickAvatarBtnVisible=true"
+    <div class="setting-section profile-edit">
+      <UserCard
+        :user-id="user.id"
+        :editable="true"
+        :switcher="false"
       />
     </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.profile_banner') }}</h2>
-      <div class="banner-background-preview">
-        <img :src="user.cover_photo">
-        <button
-          v-if="!isDefaultBanner"
-          class="button-unstyled reset-button"
-          :title="$t('settings.reset_profile_banner')"
-          @click="resetBanner"
-        >
-          <FAIcon
-            icon="times"
-            type="button"
-          />
-        </button>
-      </div>
-      <p>{{ $t('settings.set_new_profile_banner') }}</p>
-      <img
-        v-if="bannerPreview"
-        class="banner-background-preview"
-        :src="bannerPreview"
-      >
-      <div>
-        <input
-          type="file"
-          class="input"
-          @change="uploadFile('banner', $event)"
-        >
-      </div>
-      <FAIcon
-        v-if="bannerUploading"
-        class="uploading"
-        spin
-        icon="circle-notch"
-      />
-      <button
-        v-else-if="bannerPreview"
-        class="btn button-default"
-        @click="submitBanner(banner)"
-      >
-        {{ $t('settings.save') }}
-      </button>
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.profile_background') }}</h2>
-      <div class="banner-background-preview">
-        <img :src="user.background_image">
-        <button
-          v-if="!isDefaultBackground"
-          class="button-unstyled reset-button"
-          :title="$t('settings.reset_profile_background')"
-          @click="resetBackground"
-        >
-          <FAIcon
-            icon="times"
-            type="button"
-          />
-        </button>
-      </div>
-      <p>{{ $t('settings.set_new_profile_background') }}</p>
-      <img
-        v-if="backgroundPreview"
-        class="banner-background-preview"
-        :src="backgroundPreview"
-      >
-      <div>
-        <input
-          type="file"
-          class="input"
-          @change="uploadFile('background', $event)"
-        >
-      </div>
-      <FAIcon
-        v-if="backgroundUploading"
-        class="uploading"
-        spin
-        icon="circle-notch"
-      />
-      <button
-        v-else-if="backgroundPreview"
-        class="btn button-default"
-        @click="submitBackground(background)"
-      >
-        {{ $t('settings.save') }}
-      </button>
-    </div>
-    <div class="setting-item">
-      <h2>{{ $t('settings.account_privacy') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('settings.account_privacy') }}</h3>
       <ul class="setting-list">
         <li>
-          <BooleanSetting
-            source="profile"
-            path="locked"
-          >
-            {{ $t('settings.lock_account_description') }}
-          </BooleanSetting>
+          <div class="setting-item">
+            <Checkbox
+              v-model="locked"
+              class="setting-label setting-control custom-boolean-setting"
+            >
+              <ProfileSettingIndicator :is-profile="true" />
+              {{ $t('settings.lock_account_description') }}
+            </Checkbox>
+          </div>
         </li>
         <li>
           <BooleanSetting
diff --git a/src/components/settings_modal/tabs/security_tab/mfa.js b/src/components/settings_modal/tabs/security_tab/mfa.js
index 5337d1500..b24a35cd4 100644
--- a/src/components/settings_modal/tabs/security_tab/mfa.js
+++ b/src/components/settings_modal/tabs/security_tab/mfa.js
@@ -89,7 +89,7 @@ const Mfa = {
       this.backupCodes.getNewCodes = true
     },
     confirmBackupCodes () { // confirm getting new backup codes
-      this.fetchBackupCodes().then((res) => {
+      this.fetchBackupCodes().then(() => {
         this.backupCodes.getNewCodes = false
       })
     },
diff --git a/src/components/settings_modal/tabs/security_tab/mfa.vue b/src/components/settings_modal/tabs/security_tab/mfa.vue
index 9421b16ee..9859e809a 100644
--- a/src/components/settings_modal/tabs/security_tab/mfa.vue
+++ b/src/components/settings_modal/tabs/security_tab/mfa.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     v-if="readyInit && settings.available"
-    class="setting-item mfa-settings"
+    class="setting-section mfa-settings"
   >
     <div class="mfa-heading">
       <h2>{{ $t('settings.mfa.title') }}</h2>
@@ -10,7 +10,7 @@
     <div>
       <div
         v-if="!setupInProgress"
-        class="setting-item"
+        class="setting-section"
       >
         <!-- Enabled methods -->
         <h3>{{ $t('settings.mfa.authentication_methods') }}</h3>
@@ -159,10 +159,16 @@
 
     .qr-code {
       flex: 1;
-      padding-right: 10px;
+      padding-right: 0.7em;
+    }
+
+    .verify {
+      flex: 1;
+    }
+
+    .error {
+      margin: 0.3em 0 0;
     }
-    .verify { flex: 1; }
-    .error { margin: 4px 0 0; }
 
     .confirm-otp-actions {
       button {
diff --git a/src/components/settings_modal/tabs/security_tab/security_tab.js b/src/components/settings_modal/tabs/security_tab/security_tab.js
index d253bc793..04e0328cd 100644
--- a/src/components/settings_modal/tabs/security_tab/security_tab.js
+++ b/src/components/settings_modal/tabs/security_tab/security_tab.js
@@ -2,6 +2,7 @@ import ProgressButton from 'src/components/progress_button/progress_button.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Mfa from './mfa.vue'
 import localeService from 'src/services/locale/locale.service.js'
+import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
 
 const SecurityTab = {
   data () {
@@ -28,7 +29,7 @@ const SecurityTab = {
     }
   },
   created () {
-    this.$store.dispatch('fetchTokens')
+    useOAuthTokensStore().fetchTokens()
     this.fetchAliases()
   },
   components: {
@@ -40,11 +41,11 @@ const SecurityTab = {
     user () {
       return this.$store.state.users.currentUser
     },
-    pleromaBackend () {
-      return this.$store.state.instance.pleromaBackend
+    pleromaExtensionsAvailable () {
+      return this.$store.state.instance.pleromaExtensionsAvailable
     },
     oauthTokens () {
-      return this.$store.state.oauthTokens.tokens.map(oauthToken => {
+      return useOAuthTokensStore().tokens.map(oauthToken => {
         return {
           id: oauthToken.id,
           appName: oauthToken.app_name,
@@ -124,7 +125,7 @@ const SecurityTab = {
     },
     addAlias () {
       this.$store.state.api.backendInteractor.addAlias({ alias: this.addAliasTarget })
-        .then((res) => {
+        .then(() => {
           this.addedAlias = true
           this.addAliasError = false
           this.addAliasTarget = ''
@@ -151,7 +152,7 @@ const SecurityTab = {
     },
     revokeToken (id) {
       if (window.confirm(`${this.$i18n.t('settings.revoke_token')}?`)) {
-        this.$store.dispatch('revokeToken', id)
+        useOAuthTokensStore().revokeToken(id)
       }
     }
   }
diff --git a/src/components/settings_modal/tabs/security_tab/security_tab.vue b/src/components/settings_modal/tabs/security_tab/security_tab.vue
index 74103f6fb..ff1a969d7 100644
--- a/src/components/settings_modal/tabs/security_tab/security_tab.vue
+++ b/src/components/settings_modal/tabs/security_tab/security_tab.vue
@@ -1,116 +1,97 @@
 <template>
   <div :label="$t('settings.security_tab')">
-    <div class="setting-item">
-      <h2>{{ $t('settings.change_email') }}</h2>
-      <div>
-        <p>{{ $t('settings.new_email') }}</p>
-        <input
-          v-model="newEmail"
-          type="email"
-          autocomplete="email"
-          class="input"
-        >
-      </div>
-      <div>
-        <p>{{ $t('settings.current_password') }}</p>
-        <input
-          v-model="changeEmailPassword"
-          type="password"
-          autocomplete="current-password"
-          class="input"
-        >
-      </div>
-      <button
-        class="btn button-default"
-        @click="changeEmail"
-      >
-        {{ $t('settings.save') }}
-      </button>
-      <p v-if="changedEmail">
-        {{ $t('settings.changed_email') }}
-      </p>
-      <template v-if="changeEmailError !== false">
-        <p>{{ $t('settings.change_email_error') }}</p>
-        <p>{{ changeEmailError }}</p>
-      </template>
-    </div>
-
-    <div class="setting-item">
-      <h2>{{ $t('settings.change_password') }}</h2>
-      <div>
-        <p>{{ $t('settings.current_password') }}</p>
-        <input
-          v-model="changePasswordInputs[0]"
-          type="password"
-          class="input"
-        >
-      </div>
-      <div>
-        <p>{{ $t('settings.new_password') }}</p>
-        <input
-          v-model="changePasswordInputs[1]"
-          type="password"
-          class="input"
-        >
-      </div>
-      <div>
-        <p>{{ $t('settings.confirm_new_password') }}</p>
-        <input
-          v-model="changePasswordInputs[2]"
-          type="password"
-          class="input"
-        >
-      </div>
-      <button
-        class="btn button-default"
-        @click="changePassword"
-      >
-        {{ $t('settings.save') }}
-      </button>
-      <p v-if="changedPassword">
-        {{ $t('settings.changed_password') }}
-      </p>
-      <p v-else-if="changePasswordError !== false">
-        {{ $t('settings.change_password_error') }}
-      </p>
-      <p v-if="changePasswordError">
-        {{ changePasswordError }}
-      </p>
-    </div>
-
-    <div class="setting-item">
-      <h2>{{ $t('settings.oauth_tokens') }}</h2>
-      <table class="oauth-tokens">
-        <thead>
-          <tr>
-            <th>{{ $t('settings.app_name') }}</th>
-            <th>{{ $t('settings.valid_until') }}</th>
-            <th />
-          </tr>
-        </thead>
-        <tbody>
-          <tr
-            v-for="oauthToken in oauthTokens"
-            :key="oauthToken.id"
+    <div class="setting-section">
+      <h3>{{ $t('settings.change_email') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <h4>{{ $t('settings.new_email') }}</h4>
+          <input
+            v-model="newEmail"
+            type="email"
+            autocomplete="email"
+            class="input"
           >
-            <td>{{ oauthToken.appName }}</td>
-            <td>{{ oauthToken.validUntil }}</td>
-            <td class="actions">
-              <button
-                class="btn button-default"
-                @click="revokeToken(oauthToken.id)"
-              >
-                {{ $t('settings.revoke_token') }}
-              </button>
-            </td>
-          </tr>
-        </tbody>
-      </table>
+        </li>
+        <li>
+          <h4>{{ $t('settings.current_password') }}</h4>
+          <input
+            v-model="changeEmailPassword"
+            type="password"
+            autocomplete="current-password"
+            class="input"
+          >
+        </li>
+        <li>
+          <button
+            class="btn button-default"
+            @click="changeEmail"
+          >
+            {{ $t('settings.save') }}
+          </button>
+        </li>
+        <li>
+          <p v-if="changedEmail">
+            {{ $t('settings.changed_email') }}
+          </p>
+          <template v-if="changeEmailError !== false">
+            <p>{{ $t('settings.change_email_error') }}</p>
+            <p>{{ changeEmailError }}</p>
+          </template>
+        </li>
+      </ul>
     </div>
-    <mfa />
 
-    <div class="setting-item">
-      <h2>{{ $t('settings.account_alias') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('settings.change_password') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <h4>{{ $t('settings.current_password') }}</h4>
+          <input
+            v-model="changePasswordInputs[0]"
+            type="password"
+            class="input"
+          >
+        </li>
+        <li>
+          <h4>{{ $t('settings.new_password') }}</h4>
+          <input
+            v-model="changePasswordInputs[1]"
+            type="password"
+            class="input"
+          >
+        </li>
+        <li>
+          <h4>{{ $t('settings.confirm_new_password') }}</h4>
+          <input
+            v-model="changePasswordInputs[2]"
+            type="password"
+            class="input"
+          >
+        </li>
+        <li>
+          <button
+            class="btn button-default"
+            @click="changePassword"
+          >
+            {{ $t('settings.save') }}
+          </button>
+        </li>
+        <li>
+          <p v-if="changedPassword">
+            {{ $t('settings.changed_password') }}
+          </p>
+          <p v-else-if="changePasswordError !== false">
+            {{ $t('settings.change_password_error') }}
+          </p>
+          <p v-if="changePasswordError">
+            {{ changePasswordError }}
+          </p>
+        </li>
+      </ul>
+    </div>
+
+    <div class="setting-section">
+      <h3>{{ $t('settings.account_alias') }}</h3>
       <table>
         <thead>
           <tr>
@@ -149,6 +130,7 @@
       </div>
       <div>
         <i18n-t
+          scope="global"
           keypath="settings.new_alias_target"
           tag="p"
         >
@@ -177,13 +159,46 @@
       </template>
     </div>
 
-    <div class="setting-item">
-      <h2>{{ $t('settings.move_account') }}</h2>
+
+    <div class="setting-section">
+      <h3>{{ $t('settings.oauth_tokens') }}</h3>
+      <table class="oauth-tokens">
+        <thead>
+          <tr>
+            <th>{{ $t('settings.app_name') }}</th>
+            <th>{{ $t('settings.valid_until') }}</th>
+            <th />
+          </tr>
+        </thead>
+        <tbody>
+          <tr
+            v-for="oauthToken in oauthTokens"
+            :key="oauthToken.id"
+          >
+            <td>{{ oauthToken.appName }}</td>
+            <td>{{ oauthToken.validUntil }}</td>
+            <td class="actions">
+              <button
+                class="btn button-default"
+                @click="revokeToken(oauthToken.id)"
+              >
+                {{ $t('settings.revoke_token') }}
+              </button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <mfa />
+
+    <div class="setting-section">
+      <h3>{{ $t('settings.move_account') }}</h3>
       <p>{{ $t('settings.move_account_notes') }}</p>
       <div>
         <i18n-t
           keypath="settings.move_account_target"
           tag="p"
+          scope="global"
         >
           <template #example>
             <code>
@@ -219,8 +234,8 @@
       </template>
     </div>
 
-    <div class="setting-item">
-      <h2>{{ $t('settings.delete_account') }}</h2>
+    <div class="setting-section">
+      <h3>{{ $t('settings.delete_account') }}</h3>
       <p v-if="!deletingAccount">
         {{ $t('settings.delete_account_description') }}
       </p>
diff --git a/src/components/settings_modal/tabs/style_tab/style_tab.js b/src/components/settings_modal/tabs/style_tab/style_tab.js
new file mode 100644
index 000000000..35626a103
--- /dev/null
+++ b/src/components/settings_modal/tabs/style_tab/style_tab.js
@@ -0,0 +1,846 @@
+import { ref, reactive, computed, watch, provide, getCurrentInstance } from 'vue'
+import { useInterfaceStore } from 'src/stores/interface'
+import { get, set, unset, throttle } from 'lodash'
+
+import Select from 'src/components/select/select.vue'
+import SelectMotion from 'src/components/select/select_motion.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import ComponentPreview from 'src/components/component_preview/component_preview.vue'
+import StringSetting from '../../helpers/string_setting.vue'
+import ShadowControl from 'src/components/shadow_control/shadow_control.vue'
+import ColorInput from 'src/components/color_input/color_input.vue'
+import PaletteEditor from 'src/components/palette_editor/palette_editor.vue'
+import OpacityInput from 'src/components/opacity_input/opacity_input.vue'
+import RoundnessInput from 'src/components/roundness_input/roundness_input.vue'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
+import Tooltip from 'src/components/tooltip/tooltip.vue'
+import ContrastRatio from 'src/components/contrast_ratio/contrast_ratio.vue'
+import Preview from '../old_theme_tab/theme_preview.vue'
+
+import VirtualDirectivesTab from './virtual_directives_tab.vue'
+
+import { createStyleSheet, adoptStyleSheets } from 'src/services/style_setter/style_setter.js'
+import { init, findColor } from 'src/services/theme_data/theme_data_3.service.js'
+import { getCssRules } from 'src/services/theme_data/css_utils.js'
+import { serialize } from 'src/services/theme_data/iss_serializer.js'
+import { deserializeShadow, deserialize } from 'src/services/theme_data/iss_deserializer.js'
+import {
+  rgb2hex,
+  hex2rgb,
+  getContrastRatio
+} from 'src/services/color_convert/color_convert.js'
+import {
+  newImporter,
+  newExporter
+} from 'src/services/export_import/export_import.js'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faFloppyDisk,
+  faFolderOpen,
+  faFile,
+  faArrowsRotate,
+  faCheck
+} from '@fortawesome/free-solid-svg-icons'
+
+// helper for debugging
+// eslint-disable-next-line no-unused-vars
+const toValue = (x) => JSON.parse(JSON.stringify(x === undefined ? 'null' : x))
+
+// helper to make states comparable
+const normalizeStates = (states) => ['normal', ...(states?.filter(x => x !== 'normal') || [])].join(':')
+
+library.add(
+  faFile,
+  faFloppyDisk,
+  faFolderOpen,
+  faArrowsRotate,
+  faCheck
+)
+
+export default {
+  components: {
+    Select,
+    SelectMotion,
+    Checkbox,
+    Tooltip,
+    StringSetting,
+    ComponentPreview,
+    TabSwitcher,
+    ShadowControl,
+    ColorInput,
+    PaletteEditor,
+    OpacityInput,
+    RoundnessInput,
+    ContrastRatio,
+    Preview,
+    VirtualDirectivesTab
+  },
+  setup () {
+    const exports = {}
+    const interfaceStore = useInterfaceStore()
+    // All rules that are made by editor
+    const allEditedRules = ref(interfaceStore.styleDataUsed || {})
+    const styleDataUsed = computed(() => interfaceStore.styleDataUsed)
+
+    watch([styleDataUsed], () => {
+      onImport(interfaceStore.styleDataUsed)
+    }, { once: true })
+
+    exports.isActive = computed(() => {
+      const tabSwitcher = getCurrentInstance().parent.ctx
+      return tabSwitcher ? tabSwitcher.isActive('style') : false
+    })
+
+    // ## Meta stuff
+    exports.name = ref('')
+    exports.author = ref('')
+    exports.license = ref('')
+    exports.website = ref('')
+
+    const metaOut = computed(() => {
+      return [
+        '@meta {',
+        `  name: ${exports.name.value};`,
+        `  author: ${exports.author.value};`,
+        `  license: ${exports.license.value};`,
+        `  website: ${exports.website.value};`,
+        '}'
+      ].join('\n')
+    })
+
+    const metaRule = computed(() => ({
+      component: '@meta',
+      directives: {
+        name: exports.name.value,
+        author: exports.author.value,
+        license: exports.license.value,
+        website: exports.website.value
+      }
+    }))
+
+    // ## Palette stuff
+    const palettes = reactive([
+      {
+        name: 'default',
+        bg: '#121a24',
+        fg: '#182230',
+        text: '#b9b9ba',
+        link: '#d8a070',
+        accent: '#d8a070',
+        cRed: '#FF0000',
+        cBlue: '#0095ff',
+        cGreen: '#0fa00f',
+        cOrange: '#ffa500'
+      },
+      {
+        name: 'light',
+        bg: '#f2f6f9',
+        fg: '#d6dfed',
+        text: '#304055',
+        underlay: '#5d6086',
+        accent: '#f55b1b',
+        cBlue: '#0095ff',
+        cRed: '#d31014',
+        cGreen: '#0fa00f',
+        cOrange: '#ffa500',
+        border: '#d8e6f9'
+      }
+    ])
+    exports.palettes = palettes
+
+    // This is kinda dumb but you cannot "replace" reactive() object
+    // and so v-model simply fails when you try to chage (increase only?)
+    // length of the array. Since linter complains about mutating modelValue
+    // inside SelectMotion, the next best thing is to just wipe existing array
+    // and replace it with new one.
+
+    const onPalettesUpdate = (e) => {
+      palettes.splice(0, palettes.length)
+      palettes.push(...e)
+    }
+    exports.onPalettesUpdate = onPalettesUpdate
+
+    const selectedPaletteId = ref(0)
+    const selectedPalette = computed({
+      get () {
+        return palettes[selectedPaletteId.value]
+      },
+      set (newPalette) {
+        palettes[selectedPaletteId.value] = newPalette
+      }
+    })
+    exports.selectedPaletteId = selectedPaletteId
+    exports.selectedPalette = selectedPalette
+    provide('selectedPalette', selectedPalette)
+
+    watch([selectedPalette], () => updateOverallPreview())
+
+    exports.getNewPalette = () => ({
+      name: 'new palette',
+      bg: '#121a24',
+      fg: '#182230',
+      text: '#b9b9ba',
+      link: '#d8a070',
+      accent: '#d8a070',
+      cRed: '#FF0000',
+      cBlue: '#0095ff',
+      cGreen: '#0fa00f',
+      cOrange: '#ffa500'
+    })
+
+    // Raw format
+    const palettesRule = computed(() => {
+      return palettes.map(palette => {
+        const { name, ...rest } = palette
+        return {
+          component: '@palette',
+          variant: name,
+          directives: Object
+            .entries(rest)
+            .filter(([k, v]) => v && k)
+            .reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})
+        }
+      })
+    })
+
+    // Text format
+    const palettesOut = computed(() => {
+      return palettes.map(({ name, ...palette }) => {
+        const entries = Object
+          .entries(palette)
+          .filter(([k, v]) => v && k)
+          .map(([slot, data]) => `  ${slot}: ${data};`)
+          .join('\n')
+
+        return `@palette.${name} {\n${entries}\n}`
+      }).join('\n\n')
+    })
+
+    // ## Components stuff
+    // Getting existing components
+    const componentsContext = import.meta.glob(
+      ['/src/**/*.style.js', '/src/**/*.style.json'],
+      { eager: true }
+    )
+    const componentKeysAll = Object.keys(componentsContext)
+    const componentsMap = new Map(
+      componentKeysAll
+        .map(
+          key => [key, componentsContext[key].default]
+        ).filter(([, component]) => !component.virtual && !component.notEditable)
+    )
+    exports.componentsMap = componentsMap
+    const componentKeys = [...componentsMap.keys()]
+    exports.componentKeys = componentKeys
+
+    // Component list and selection
+    const selectedComponentKey = ref(componentsMap.keys().next().value)
+    exports.selectedComponentKey = selectedComponentKey
+
+    const selectedComponent = computed(() => componentsMap.get(selectedComponentKey.value))
+    const selectedComponentName = computed(() => selectedComponent.value.name)
+
+    // Selection basis
+    exports.selectedComponentVariants = computed(() => {
+      return Object.keys({ normal: null, ...(selectedComponent.value.variants || {}) })
+    })
+    exports.selectedComponentStates = computed(() => {
+      const all = Object.keys({ normal: null, ...(selectedComponent.value.states || {}) })
+      return all.filter(x => x !== 'normal')
+    })
+
+    // selection
+    const selectedVariant = ref('normal')
+    exports.selectedVariant = selectedVariant
+    const selectedState = reactive(new Set())
+    exports.selectedState = selectedState
+    exports.updateSelectedStates = (state, v) => {
+      if (v) {
+        selectedState.add(state)
+      } else {
+        selectedState.delete(state)
+      }
+    }
+
+    // Reset variant and state on component change
+    const updateSelectedComponent = () => {
+      selectedVariant.value = 'normal'
+      selectedState.clear()
+    }
+
+    watch(
+      selectedComponentName,
+      updateSelectedComponent
+    )
+
+    // ### Rules stuff aka meat and potatoes
+    // The native structure of separate rules and the child -> parent
+    // relation isn't very convenient for editor, we replace the array
+    // and child -> parent structure with map and parent -> child structure
+    const rulesToEditorFriendly = (rules, root = {}) => rules.reduce((acc, rule) => {
+      const { parent: rParent, component: rComponent } = rule
+      const parent = rParent ?? rule
+      const hasChildren = !!rParent
+      const child = hasChildren ? rule : null
+
+      const {
+        component: pComponent,
+        variant: pVariant = 'normal',
+        state: pState = [] // no relation to Intel CPUs whatsoever
+      } = parent
+
+      const pPath = `${hasChildren ? pComponent : rComponent}.${pVariant}.${normalizeStates(pState)}`
+
+      let output = get(acc, pPath)
+      if (!output) {
+        set(acc, pPath, {})
+        output = get(acc, pPath)
+      }
+
+      if (hasChildren) {
+        output._children = output._children ?? {}
+        const {
+          component: cComponent,
+          variant: cVariant = 'normal',
+          state: cState = [],
+          directives
+        } = child
+
+        const cPath = `${cComponent}.${cVariant}.${normalizeStates(cState)}`
+        set(output._children, cPath, { directives })
+      } else {
+        output.directives = parent.directives
+      }
+      return acc
+    }, root)
+
+    const editorFriendlyFallbackStructure = computed(() => {
+      const root = {}
+
+      componentKeys.forEach((componentKey) => {
+        const componentValue = componentsMap.get(componentKey)
+        const { defaultRules, name } = componentValue
+        rulesToEditorFriendly(
+          defaultRules.map((rule) => ({ ...rule, component: name })),
+          root
+        )
+      })
+
+      return root
+    })
+
+    // Checking whether component can support some "directives" which
+    // are actually virtual subcomponents, i.e. Text, Link etc
+    exports.componentHas = (subComponent) => {
+      return !!selectedComponent.value.validInnerComponents?.find(x => x === subComponent)
+    }
+
+    // Path for lodash's get and set
+    const getPath = (component, directive) => {
+      const pathSuffix = component ? `._children.${component}.normal.normal` : ''
+      const path = `${selectedComponentName.value}.${selectedVariant.value}.${normalizeStates([...selectedState])}${pathSuffix}.directives.${directive}`
+      return path
+    }
+
+    // Templates for directives
+    const isElementPresent = (component, directive, defaultValue = '') => computed({
+      get () {
+        return get(allEditedRules.value, getPath(component, directive)) != null
+      },
+      set (value) {
+        if (value) {
+          const fallback = get(
+            editorFriendlyFallbackStructure.value,
+            getPath(component, directive)
+          )
+          set(allEditedRules.value, getPath(component, directive), fallback ?? defaultValue)
+        } else {
+          unset(allEditedRules.value, getPath(component, directive))
+        }
+        exports.updateOverallPreview()
+      }
+    })
+
+    const getEditedElement = (component, directive, postProcess = x => x) => computed({
+      get () {
+        let usedRule
+        const fallback = editorFriendlyFallbackStructure.value
+        const real = allEditedRules.value
+        const path = getPath(component, directive)
+
+        usedRule = get(real, path) // get real
+        if (usedRule === '') {
+          return usedRule
+        }
+        if (!usedRule) {
+          usedRule = get(fallback, path)
+        }
+
+        return postProcess(usedRule)
+      },
+      set (value) {
+        if (value != null) {
+          set(allEditedRules.value, getPath(component, directive), value)
+        } else {
+          unset(allEditedRules.value, getPath(component, directive))
+        }
+        exports.updateOverallPreview()
+      }
+    })
+
+    // All the editable stuff for the component
+    exports.editedBackgroundColor = getEditedElement(null, 'background')
+    exports.isBackgroundColorPresent = isElementPresent(null, 'background', '#FFFFFF')
+    exports.editedOpacity = getEditedElement(null, 'opacity')
+    exports.isOpacityPresent = isElementPresent(null, 'opacity', 1)
+    exports.editedRoundness = getEditedElement(null, 'roundness')
+    exports.isRoundnessPresent = isElementPresent(null, 'roundness', '0')
+    exports.editedTextColor = getEditedElement('Text', 'textColor')
+    exports.isTextColorPresent = isElementPresent('Text', 'textColor', '#000000')
+    exports.editedTextAuto = getEditedElement('Text', 'textAuto')
+    exports.isTextAutoPresent = isElementPresent('Text', 'textAuto', '#000000')
+    exports.editedLinkColor = getEditedElement('Link', 'textColor')
+    exports.isLinkColorPresent = isElementPresent('Link', 'textColor', '#000080')
+    exports.editedIconColor = getEditedElement('Icon', 'textColor')
+    exports.isIconColorPresent = isElementPresent('Icon', 'textColor', '#909090')
+    exports.editedBorderColor = getEditedElement('Border', 'textColor')
+    exports.isBorderColorPresent = isElementPresent('Border', 'textColor', '#909090')
+
+    const getContrast = (bg, text) => {
+      try {
+        const bgRgb = hex2rgb(bg)
+        const textRgb = hex2rgb(text)
+
+        const ratio = getContrastRatio(bgRgb, textRgb)
+        return {
+          // TODO this ideally should be part of <ContractRatio />
+          ratio,
+          text: ratio.toPrecision(3) + ':1',
+          // AA level, AAA level
+          aa: ratio >= 4.5,
+          aaa: ratio >= 7,
+          // same but for 18pt+ texts
+          laa: ratio >= 3,
+          laaa: ratio >= 4.5
+        }
+      } catch (e) {
+        console.warn('Failure computing contrast', e)
+        return { error: e }
+      }
+    }
+
+    const normalizeShadows = (shadows) => {
+      return shadows?.map(shadow => {
+        if (typeof shadow === 'object') {
+          return shadow
+        }
+        if (typeof shadow === 'string') {
+          try {
+            return deserializeShadow(shadow)
+          } catch (e) {
+            console.warn(e)
+            return shadow
+          }
+        }
+        return null
+      })
+    }
+    provide('normalizeShadows', normalizeShadows)
+
+    // Shadow is partially edited outside the ShadowControl
+    // for better space utilization
+    const editedShadow = getEditedElement(null, 'shadow', normalizeShadows)
+    exports.editedShadow = editedShadow
+    const editedSubShadowId = ref(null)
+    exports.editedSubShadowId = editedSubShadowId
+    const editedSubShadow = computed(() => {
+      if (editedShadow.value == null || editedSubShadowId.value == null) return null
+      return editedShadow.value[editedSubShadowId.value]
+    })
+    exports.editedSubShadow = editedSubShadow
+    exports.isShadowPresent = isElementPresent(null, 'shadow', [])
+    exports.onSubShadow = (id) => {
+      if (id != null) {
+        editedSubShadowId.value = id
+      } else {
+        editedSubShadow.value = null
+      }
+    }
+    exports.updateSubShadow = (axis, value) => {
+      if (!editedSubShadow.value || editedSubShadowId.value == null) return
+      const newEditedShadow = [...editedShadow.value]
+
+      newEditedShadow[editedSubShadowId.value] = {
+        ...newEditedShadow[editedSubShadowId.value],
+        [axis]: value
+      }
+
+      editedShadow.value = newEditedShadow
+    }
+    exports.isShadowTabOpen = ref(false)
+    exports.onTabSwitch = (tab) => {
+      exports.isShadowTabOpen.value = tab === 'shadow'
+    }
+
+    // component preview
+    exports.editorHintStyle = computed(() => {
+      const editorHint = selectedComponent.value.editor
+      const styles = []
+      if (editorHint && Object.keys(editorHint).length > 0) {
+        if (editorHint.aspect != null) {
+          styles.push(`aspect-ratio: ${editorHint.aspect} !important;`)
+        }
+        if (editorHint.border != null) {
+          styles.push(`border-width: ${editorHint.border}px !important;`)
+        }
+      }
+      return styles.join('; ')
+    })
+
+    const editorFriendlyToOriginal = computed(() => {
+      const resultRules = []
+
+      const convert = (component, data = {}, parent) => {
+        const variants = Object.entries(data || {})
+
+        variants.forEach(([variant, variantData]) => {
+          const states = Object.entries(variantData)
+
+          states.forEach(([jointState, stateData]) => {
+            const state = jointState.split(/:/g)
+            const result = {
+              component,
+              variant,
+              state,
+              directives: stateData.directives || {}
+            }
+
+            if (parent) {
+              result.parent = {
+                component: parent
+              }
+            }
+
+            resultRules.push(result)
+
+            // Currently we only support single depth for simplicity's sake
+            if (!parent) {
+              Object.entries(stateData._children || {}).forEach(([cName, child]) => convert(cName, child, component))
+            }
+          })
+        })
+      }
+
+      [...componentsMap.values()].forEach(({ name }) => {
+        convert(name, allEditedRules.value[name])
+      })
+
+      return resultRules
+    })
+
+    const allCustomVirtualDirectives = [...componentsMap.values()]
+      .map(c => {
+        return c
+          .defaultRules
+          .filter(c => c.component === 'Root')
+          .map(x => Object.entries(x.directives))
+          .flat()
+      })
+      .filter(x => x)
+      .flat()
+      .map(([name, value]) => {
+        const [valType, valVal] = value.split('|')
+        return {
+          name: name.substring(2),
+          valType: valType?.trim(),
+          value: valVal?.trim()
+        }
+      })
+
+    const virtualDirectives = ref(allCustomVirtualDirectives)
+    exports.virtualDirectives = virtualDirectives
+    exports.updateVirtualDirectives = (value) => {
+      virtualDirectives.value = value
+    }
+
+    // Raw format
+    const virtualDirectivesRule = computed(() => ({
+      component: 'Root',
+      directives: Object.fromEntries(
+        virtualDirectives.value.map(vd => [`--${vd.name}`, `${vd.valType} | ${vd.value}`])
+      )
+    }))
+
+    // Text format
+    const virtualDirectivesOut = computed(() => {
+      return [
+        'Root {',
+        ...virtualDirectives.value
+          .filter(vd => vd.name && vd.valType && vd.value)
+          .map(vd => `  --${vd.name}: ${vd.valType} | ${vd.value};`),
+        '}'
+      ].join('\n')
+    })
+
+    exports.computeColor = (color) => {
+      let computedColor
+      try {
+        computedColor = findColor(color, { dynamicVars: dynamicVars.value, staticVars: staticVars.value })
+        if (computedColor) {
+          return rgb2hex(computedColor)
+        }
+      } catch (e) {
+        console.warn(e)
+      }
+      return null
+    }
+    provide('computeColor', exports.computeColor)
+
+    exports.contrast = computed(() => {
+      return getContrast(
+        exports.computeColor(previewColors.value.background),
+        exports.computeColor(previewColors.value.text)
+      )
+    })
+
+    // ## Export and Import
+    const styleExporter = newExporter({
+      filename: () => exports.name.value ?? 'pleroma_theme',
+      mime: 'text/plain',
+      extension: 'iss',
+      getExportedObject: () => exportStyleData.value
+    })
+
+    const onImport = parsed => {
+      const editorComponents = parsed.filter(x => x.component.startsWith('@'))
+      const rootComponent = parsed.find(x => x.component === 'Root')
+      const rules = parsed.filter(x => !x.component.startsWith('@') && x.component !== 'Root')
+      const metaIn = editorComponents.find(x => x.component === '@meta').directives
+      const palettesIn = editorComponents.filter(x => x.component === '@palette')
+
+      exports.name.value = metaIn.name
+      exports.license.value = metaIn.license
+      exports.author.value = metaIn.author
+      exports.website.value = metaIn.website
+
+      const newVirtualDirectives = Object
+        .entries(rootComponent.directives)
+        .map(([name, value]) => {
+          const [valType, valVal] = value.split('|').map(x => x.trim())
+          return { name: name.substring(2), valType, value: valVal }
+        })
+      virtualDirectives.value = newVirtualDirectives
+
+      onPalettesUpdate(palettesIn.map(x => ({ name: x.variant, ...x.directives })))
+
+      allEditedRules.value = rulesToEditorFriendly(rules)
+
+      exports.updateOverallPreview()
+    }
+
+    const styleImporter = newImporter({
+      accept: '.iss',
+      parser (string) { return deserialize(string) },
+      onImportFailure (result) {
+        console.error('Failure importing style:', result)
+        useInterfaceStore().pushGlobalNotice({ messageKey: 'settings.invalid_theme_imported', level: 'error' })
+      },
+      onImport
+    })
+
+    // Raw format
+    const exportRules = computed(() => [
+      metaRule.value,
+      ...palettesRule.value,
+      virtualDirectivesRule.value,
+      ...editorFriendlyToOriginal.value
+    ])
+
+    // Text format
+    const exportStyleData = computed(() => {
+      return [
+        metaOut.value,
+        palettesOut.value,
+        virtualDirectivesOut.value,
+        serialize(editorFriendlyToOriginal.value)
+      ].join('\n\n')
+    })
+
+    exports.clearStyle = () => {
+      onImport(interfaceStore.styleDataUsed)
+    }
+
+    exports.exportStyle = () => {
+      styleExporter.exportData()
+    }
+
+    exports.importStyle = () => {
+      styleImporter.importData()
+    }
+
+    exports.applyStyle = () => {
+      useInterfaceStore().setStyleCustom(exportRules.value)
+    }
+
+    const overallPreviewRules = ref([])
+    exports.overallPreviewRules = overallPreviewRules
+
+    watch([overallPreviewRules], () => {
+      let css = null
+      try {
+        css = getCssRules(overallPreviewRules.value).map(r => r.replace('html', '&'))
+      } catch (e) {
+        console.error(e)
+        return
+      }
+
+      const sheet = createStyleSheet('style-tab-overall-preview', 90)
+
+      sheet.clear()
+      sheet.addRule([
+        '#edited-style-preview {\n',
+        css.join('\n'),
+        '\n}'
+      ].join(''))
+      sheet.ready = true
+      adoptStyleSheets()
+    })
+
+    const updateOverallPreview = throttle(() => {
+      try {
+        overallPreviewRules.value = init({
+          inputRuleset: [
+            ...exportRules.value,
+            {
+              component: 'Root',
+              directives: Object.fromEntries(
+                Object
+                  .entries(selectedPalette.value)
+                  .filter(([k, v]) => k && v && k !== 'name')
+                  .map(([k, v]) => [`--${k}`, `color | ${v}`])
+              )
+            }
+          ],
+          ultimateBackgroundColor: '#000000',
+          debug: true
+        }).eager
+      } catch (e) {
+        console.error('Could not compile preview theme', e)
+        return null
+      }
+    }, 1000)
+    //
+    // Apart from "hover" we can't really show how component looks like in
+    // certain states, so we have to fake them.
+    const simulatePseudoSelectors = (css, prefix) => css
+      .replace(prefix, '.preview-block')
+      .replace(':active', '.preview-active')
+      .replace(':hover', '.preview-hover')
+      .replace(':active', '.preview-active')
+      .replace(':focus', '.preview-focus')
+      .replace(':focus-within', '.preview-focus-within')
+      .replace(':disabled', '.preview-disabled')
+
+    const previewRules = computed(() => {
+      const filtered = overallPreviewRules.value.filter(r => {
+        const componentMatch = r.component === selectedComponentName.value
+        const parentComponentMatch = r.parent?.component === selectedComponentName.value
+        if (!componentMatch && !parentComponentMatch) return false
+        const rule = parentComponentMatch ? r.parent : r
+        if (rule.component !== selectedComponentName.value) return false
+        if (rule.variant !== selectedVariant.value) return false
+        const ruleState = new Set(rule.state.filter(x => x !== 'normal'))
+        const differenceA = [...ruleState].filter(x => !selectedState.has(x))
+        const differenceB = [...selectedState].filter(x => !ruleState.has(x))
+        return (differenceA.length + differenceB.length) === 0
+      })
+      const sorted = [...filtered]
+        .filter(x => x.component === selectedComponentName.value)
+        .sort((a, b) => {
+          const aSelectorLength = a.selector.split(/ /g).length
+          const bSelectorLength = b.selector.split(/ /g).length
+          return aSelectorLength - bSelectorLength
+        })
+
+      const prefix = sorted[0].selector
+
+      return filtered.filter(x => x.selector.startsWith(prefix))
+    })
+
+    exports.previewClass = computed(() => {
+      const selectors = []
+      if (!!selectedComponent.value.variants?.normal || selectedVariant.value !== 'normal') {
+        selectors.push(selectedComponent.value.variants[selectedVariant.value])
+      }
+      if (selectedState.size > 0) {
+        selectedState.forEach(state => {
+          const original = selectedComponent.value.states[state]
+          selectors.push(simulatePseudoSelectors(original))
+        })
+      }
+      return selectors.map(x => x.substring(1)).join('')
+    })
+
+    exports.previewCss = computed(() => {
+      try {
+        const prefix = previewRules.value[0].selector
+        const scoped = getCssRules(previewRules.value).map(x => simulatePseudoSelectors(x, prefix))
+        return scoped.join('\n')
+      } catch (e) {
+        console.error('Invalid ruleset', e)
+        return null
+      }
+    })
+
+    const dynamicVars = computed(() => {
+      return previewRules.value[0].dynamicVars
+    })
+
+    const staticVars = computed(() => {
+      const rootComponent = overallPreviewRules.value.find(r => {
+        return r.component === 'Root'
+      })
+      const rootDirectivesEntries = Object.entries(rootComponent.directives)
+      const directives = {}
+      rootDirectivesEntries
+        .filter(([k, v]) => k.startsWith('--') && v.startsWith('color | '))
+        .map(([k, v]) => [k.substring(2), v.substring('color | '.length)])
+        .forEach(([k, v]) => {
+          directives[k] = findColor(v, { dynamicVars: {}, staticVars: directives })
+        })
+      return directives
+    })
+    provide('staticVars', staticVars)
+    exports.staticVars = staticVars
+
+    const previewColors = computed(() => {
+      const stacked = dynamicVars.value.stacked
+      const background = typeof stacked === 'string' ? stacked : rgb2hex(stacked)
+      return {
+        text: previewRules.value.find(r => r.component === 'Text')?.virtualDirectives['--text'],
+        link: previewRules.value.find(r => r.component === 'Link')?.virtualDirectives['--link'],
+        border: previewRules.value.find(r => r.component === 'Border')?.virtualDirectives['--border'],
+        icon: previewRules.value.find(r => r.component === 'Icon')?.virtualDirectives['--icon'],
+        background
+      }
+    })
+    exports.previewColors = previewColors
+    exports.updateOverallPreview = updateOverallPreview
+
+    updateOverallPreview()
+
+    watch(
+      [
+        allEditedRules.value,
+        palettes,
+        selectedPalette,
+        selectedState,
+        selectedVariant
+      ],
+      updateOverallPreview
+    )
+
+    return exports
+  }
+}
diff --git a/src/components/settings_modal/tabs/style_tab/style_tab.scss b/src/components/settings_modal/tabs/style_tab/style_tab.scss
new file mode 100644
index 000000000..eb31f9684
--- /dev/null
+++ b/src/components/settings_modal/tabs/style_tab/style_tab.scss
@@ -0,0 +1,292 @@
+.StyleTab {
+  min-width: var(--themeEditorMinWidth, fit-content);
+  margin: 1em;
+
+  .style-control {
+    align-items: baseline;
+    margin-bottom: 0.5em;
+
+    .label {
+      display: inline-block;
+      margin-right: 0.5em;
+      flex: 1 1 auto;
+      line-height: 2;
+      min-height: 2em;
+    }
+
+    &.suboption {
+      margin-left: 1em;
+    }
+
+    input,
+    select {
+      min-width: 3em;
+      margin: 0;
+      flex: 0;
+
+      &[type="number"] {
+        min-width: 9em;
+
+        &.-small {
+          min-width: 5em;
+        }
+      }
+
+      &[type="range"] {
+        flex: 1;
+        min-width: 9em;
+        align-self: center;
+        margin: 0 0.25em;
+      }
+
+      &[type="checkbox"] + i {
+        height: 1.1em;
+        align-self: center;
+      }
+    }
+  }
+
+  .setting-section.heading {
+    padding: 0;
+  }
+
+  .meta-preview {
+    display: grid;
+    grid-template:
+      "meta preview";
+    grid-gap: 1em;
+    grid-template-columns: min-content 6fr;
+
+    .theme-preview-container {
+      margin: 0;
+    }
+
+    ul.setting-list {
+      padding: 0;
+      margin: 0;
+      grid-area: meta;
+
+      > li {
+        margin: 0;
+      }
+
+      .meta-field {
+        margin: 0;
+
+        .setting-label {
+          display: inline-block;
+          margin-bottom: 0.5em;
+        }
+      }
+    }
+
+    #edited-style-preview {
+      grid-area: preview;
+    }
+  }
+
+  .setting-section {
+    padding-bottom: 0;
+    margin-top: 1em;
+
+    .btn {
+      padding: 0 0.5em;
+    }
+
+    &:not(:first-child) {
+      margin-top: 0.5em;
+    }
+
+    &:not(:last-child) {
+      margin-bottom: 0.5em;
+    }
+  }
+
+  .list-editor {
+    display: grid;
+    grid-template-areas:
+      "label    editor"
+      "selector editor"
+      "movement editor";
+    grid-template-columns: 10em 1fr;
+    grid-template-rows: auto 1fr auto;
+    grid-gap: 0.5em;
+
+    .list-edit-area {
+      grid-area: editor;
+      align-items: baseline;
+    }
+
+    .list-select {
+      grid-area: selector;
+      margin: 0;
+
+      &-label {
+        font-weight: bold;
+        grid-area: label;
+        margin: 0;
+        align-self: baseline;
+      }
+
+      &-movement {
+        grid-area: movement;
+        margin: 0;
+      }
+    }
+  }
+
+  .variables-editor {
+    .variable-selector {
+      display: grid;
+      grid-template-columns: auto 1fr auto 10em;
+      grid-template-rows: subgrid;
+      align-items: baseline;
+      grid-gap: 0 0.5em;
+    }
+
+    .list-edit-area {
+      display: grid;
+      grid-template-rows: subgrid;
+    }
+
+    .shadow-control {
+      grid-row: 2 / span 2;
+    }
+  }
+
+  .component-editor {
+    display: grid;
+    grid-template-columns: 6fr 3fr 4fr;
+    grid-template-rows: auto auto 1fr;
+    grid-gap: 0.5em;
+    grid-template-areas:
+      "component component variant"
+      "state     state     state"
+      "preview   settings  settings";
+
+    .component-selector {
+      grid-area: component;
+      align-self: center;
+    }
+
+    .component-selector,
+    .state-selector,
+    .variant-selector {
+      display: grid;
+      grid-template-columns: 1fr minmax(10em, 1fr);
+      grid-template-rows: auto;
+      grid-auto-flow: column;
+      grid-gap: 0.5em;
+      align-items: baseline;
+
+      > label:not(.Select) {
+        font-weight: bold;
+        justify-self: right;
+      }
+    }
+
+    .state-selector {
+      grid-area: state;
+      grid-template-columns: minmax(min-content, 7em) 1fr;
+    }
+
+    .variant-selector {
+      grid-area: variant;
+    }
+
+    .state-selector-list {
+      display: grid;
+      list-style: none;
+      grid-auto-flow: dense;
+      grid-template-columns: repeat(5, minmax(min-content, 1fr));
+      grid-auto-rows: 1fr;
+      grid-gap: 0.5em;
+      padding: 0;
+      margin: 0;
+    }
+
+    .preview-container {
+      --border: none;
+      --shadow: none;
+      --roundness: none;
+
+      grid-area: preview;
+    }
+
+    .component-settings {
+      grid-area: settings;
+    }
+
+    .editor-tab {
+      display: grid;
+      grid-template-columns: 1fr 2em;
+      grid-column-gap: 0.5em;
+      align-items: center;
+      grid-auto-rows: min-content;
+      grid-auto-flow: dense;
+      border-left: 1px solid var(--border);
+      border-right: 1px solid var(--border);
+      border-bottom: 1px solid var(--border);
+      padding: 0.5em;
+    }
+
+    .shadow-tab {
+      grid-template-columns: 1fr;
+      justify-items: center;
+    }
+  }
+
+  .-mobile & {
+    .meta-preview {
+      grid-template:
+        "meta"
+        "preview"
+    }
+
+    .list-editor {
+      display: grid;
+      grid-template-areas:
+        "label"
+        "selector"
+        "movement"
+        "editor"
+        "editor"
+        "editor"
+        "editor";
+      grid-template-columns: 1fr;
+      grid-template-rows: auto 1fr auto;
+    }
+
+    .component-editor {
+      grid-template-columns: 1fr;
+      grid-template-rows: auto;
+      grid-template-areas:
+        "component"
+        "variant"
+        "state"
+        "preview"
+        "settings";
+    }
+
+      .variable-selector {
+        grid-template-columns: 1fr;
+        grid-template-rows: auto;
+        grid-auto-flow: row;
+        grid-gap: 0.5em;
+      }
+  }
+}
+
+.extra-content {
+  .style-actions-container {
+    width: 100%;
+    display: flex;
+    justify-content: end;
+
+    .style-actions {
+      display: grid;
+      grid-template-columns: repeat(4, minmax(7em, 1fr));
+      grid-gap: 0.25em;
+    }
+  }
+}
diff --git a/src/components/settings_modal/tabs/style_tab/style_tab.vue b/src/components/settings_modal/tabs/style_tab/style_tab.vue
new file mode 100644
index 000000000..eb86026e2
--- /dev/null
+++ b/src/components/settings_modal/tabs/style_tab/style_tab.vue
@@ -0,0 +1,390 @@
+<script src="./style_tab.js">
+</script>
+
+<template>
+  <div class="StyleTab">
+    <div class="setting-section heading">
+      <div class="meta-preview">
+        <Preview id="edited-style-preview" />
+        <teleport
+          v-if="isActive"
+          to="#unscrolled-content"
+        >
+          <div class="style-actions-container">
+            <div class="style-actions">
+              <button
+                class="btn button-default button-new"
+                @click="clearStyle"
+              >
+                <FAIcon icon="arrows-rotate" />
+                {{ $t('settings.style.themes3.editor.reset_style') }}
+              </button>
+              <button
+                class="btn button-default button-load"
+                @click="importStyle"
+              >
+                <FAIcon icon="folder-open" />
+                {{ $t('settings.style.themes3.editor.load_style') }}
+              </button>
+              <button
+                class="btn button-default button-save"
+                @click="exportStyle"
+              >
+                <FAIcon icon="floppy-disk" />
+                {{ $t('settings.style.themes3.editor.save_style') }}
+              </button>
+              <button
+                class="btn button-default button-apply"
+                @click="applyStyle"
+              >
+                <FAIcon icon="check" />
+                {{ $t('settings.style.themes3.editor.apply_preview') }}
+              </button>
+            </div>
+          </div>
+        </teleport>
+        <ul class="setting-list style-metadata">
+          <li>
+            <StringSetting
+              v-model="name"
+              class="meta-field"
+            >
+              {{ $t('settings.style.themes3.editor.style_name') }}
+            </StringSetting>
+          </li>
+          <li>
+            <StringSetting
+              v-model="author"
+              class="meta-field"
+            >
+              {{ $t('settings.style.themes3.editor.style_author') }}
+            </StringSetting>
+          </li>
+          <li>
+            <StringSetting
+              v-model="license"
+              class="meta-field"
+            >
+              {{ $t('settings.style.themes3.editor.style_license') }}
+            </StringSetting>
+          </li>
+          <li>
+            <StringSetting
+              v-model="website"
+              class="meta-field"
+            >
+              {{ $t('settings.style.themes3.editor.style_website') }}
+            </StringSetting>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <tab-switcher>
+      <div
+        key="component"
+        class="setting-section component-editor"
+        :label="$t('settings.style.themes3.editor.component_tab')"
+        :full-width="true"
+      >
+        <div class="component-selector">
+          <label for="component-selector">
+            {{ $t('settings.style.themes3.editor.component_selector') }}
+            {{ ' ' }}
+          </label>
+          <Select
+            id="component-selector"
+            v-model="selectedComponentKey"
+          >
+            <option
+              v-for="key in componentKeys"
+              :key="'component-' + key"
+              :value="key"
+            >
+              {{ componentsMap.get(key).name }}
+            </option>
+          </Select>
+        </div>
+        <div
+          v-if="selectedComponentVariants.length > 1"
+          class="variant-selector"
+        >
+          <label for="variant-selector">
+            {{ $t('settings.style.themes3.editor.variant_selector') }}
+          </label>
+          <Select
+            v-model="selectedVariant"
+          >
+            <option
+              v-for="variant in selectedComponentVariants"
+              :key="'component-variant-' + variant"
+              :value="variant"
+            >
+              {{ variant }}
+            </option>
+          </Select>
+        </div>
+        <div
+          v-if="selectedComponentStates.length > 0"
+          class="state-selector"
+        >
+          <label>
+            {{ $t('settings.style.themes3.editor.states_selector') }}
+          </label>
+          <ul
+            class="state-selector-list"
+          >
+            <li
+              v-for="state in selectedComponentStates"
+              :key="'component-state-' + state"
+            >
+              <Checkbox
+                :value="selectedState.has(state)"
+                @update:model-value="(v) => updateSelectedStates(state, v)"
+              >
+                {{ state }}
+              </Checkbox>
+            </li>
+          </ul>
+        </div>
+        <div class="preview-container">
+          <ComponentPreview
+            class="component-preview"
+            :show-text="componentHas('Text')"
+            :shadow-control="isShadowTabOpen"
+            :preview-class="previewClass"
+            :preview-style="editorHintStyle"
+            :preview-css="previewCss"
+            :disabled="!editedSubShadow && typeof editedShadow !== 'string'"
+            :shadow="editedSubShadow"
+            :no-color-control="true"
+            @update:shadow="({ axis, value }) => updateSubShadow(axis, value)"
+          />
+        </div>
+        <tab-switcher
+          ref="tabSwitcher"
+          class="component-settings"
+          :on-switch="onTabSwitch"
+        >
+          <div
+            key="main"
+            class="editor-tab"
+            :label="$t('settings.style.themes3.editor.main_tab')"
+          >
+            <ColorInput
+              v-model="editedBackgroundColor"
+              name="component-background-color"
+              :fallback="computeColor(editedBackgroundColor) ?? previewColors.background"
+              :disabled="!isBackgroundColorPresent"
+              :label="$t('settings.style.themes3.editor.background')"
+              :hide-optional-checkbox="true"
+            />
+            <Tooltip :text="$t('settings.style.themes3.editor.include_in_rule')">
+              <Checkbox v-model="isBackgroundColorPresent" />
+            </Tooltip>
+            <ColorInput
+              v-if="componentHas('Text')"
+              v-model="editedTextColor"
+              name="component-text-color"
+              :fallback="computeColor(editedTextColor) ?? previewColors.text"
+              :label="$t('settings.style.themes3.editor.text_color')"
+              :disabled="!isTextColorPresent"
+              :hide-optional-checkbox="true"
+            />
+            <Tooltip
+              v-if="componentHas('Text')"
+              :text="$t('settings.style.themes3.editor.include_in_rule')"
+            >
+              <Checkbox v-model="isTextColorPresent" />
+            </Tooltip>
+            <div
+              v-if="componentHas('Text')"
+              class="style-control suboption"
+            >
+              <label
+                for="textAuto"
+                class="label"
+                :class="{ faint: !isTextAutoPresent }"
+              >
+                {{ $t('settings.style.themes3.editor.text_auto.label') }}
+              </label>
+              <Select
+                id="textAuto"
+                v-model="editedTextAuto"
+                :disabled="!isTextAutoPresent"
+              >
+                <option value="no-preserve">
+                  {{ $t('settings.style.themes3.editor.text_auto.no-preserve') }}
+                </option>
+                <option value="no-auto">
+                  {{ $t('settings.style.themes3.editor.text_auto.no-auto') }}
+                </option>
+                <option value="preserve">
+                  {{ $t('settings.style.themes3.editor.text_auto.preserve') }}
+                </option>
+              </Select>
+            </div>
+            <Tooltip
+              v-if="componentHas('Text')"
+              :text="$t('settings.style.themes3.editor.include_in_rule')"
+            >
+              <Checkbox v-model="isTextAutoPresent" />
+            </Tooltip>
+            <div
+              v-if="componentHas('Text')"
+              class="style-control suboption"
+            >
+              <label class="label">
+                {{ $t('settings.style.themes3.editor.contrast') }}
+              </label>
+              <ContrastRatio
+                :show-ratio="true"
+                :contrast="contrast"
+              />
+            </div>
+            <div v-if="componentHas('Text')" />
+            <ColorInput
+              v-if="componentHas('Link')"
+              v-model="editedLinkColor"
+              name="component-link-color"
+              :fallback="computeColor(editedLinkColor) ?? previewColors.link"
+              :label="$t('settings.style.themes3.editor.link_color')"
+              :disabled="!isLinkColorPresent"
+              :hide-optional-checkbox="true"
+            />
+            <Tooltip
+              v-if="componentHas('Link')"
+              :text="$t('settings.style.themes3.editor.include_in_rule')"
+            >
+              <Checkbox v-model="isLinkColorPresent" />
+            </Tooltip>
+            <ColorInput
+              v-if="componentHas('Icon')"
+              v-model="editedIconColor"
+              name="component-icon-color"
+              :fallback="computeColor(editedIconColor) ?? previewColors.icon"
+              :label="$t('settings.style.themes3.editor.icon_color')"
+              :disabled="!isIconColorPresent"
+              :hide-optional-checkbox="true"
+            />
+            <Tooltip
+              v-if="componentHas('Icon')"
+              :text="$t('settings.style.themes3.editor.include_in_rule')"
+            >
+              <Checkbox v-model="isIconColorPresent" />
+            </Tooltip>
+            <ColorInput
+              v-if="componentHas('Border')"
+              v-model="editedBorderColor"
+              name="component-border-color"
+              :fallback="computeColor(editedBorderColor) ?? previewColors.border"
+              :label="$t('settings.style.themes3.editor.border_color')"
+              :disabled="!isBorderColorPresent"
+              :hide-optional-checkbox="true"
+            />
+            <Tooltip
+              v-if="componentHas('Border')"
+              :text="$t('settings.style.themes3.editor.include_in_rule')"
+            >
+              <Checkbox v-model="isBorderColorPresent" />
+            </Tooltip>
+            <OpacityInput
+              v-model="editedOpacity"
+              name="component-opacity"
+              :disabled="!isOpacityPresent"
+              :label="$t('settings.style.themes3.editor.opacity')"
+            />
+            <Tooltip :text="$t('settings.style.themes3.editor.include_in_rule')">
+              <Checkbox v-model="isOpacityPresent" />
+            </Tooltip>
+            <RoundnessInput
+              v-model="editedRoundness"
+              name="component-roundness"
+              :disabled="!isRoundnessPresent"
+              :label="$t('settings.style.themes3.editor.roundness')"
+            />
+            <Tooltip :text="$t('settings.style.themes3.editor.include_in_rule')">
+              <Checkbox v-model="isRoundnessPresent" />
+            </Tooltip>
+          </div>
+          <div
+            key="shadow"
+            class="editor-tab shadow-tab"
+            :label="$t('settings.style.themes3.editor.shadows_tab')"
+          >
+            <Checkbox
+              v-model="isShadowPresent"
+              class="style-control"
+            >
+              {{ $t('settings.style.themes3.editor.include_in_rule') }}
+            </checkbox>
+            <ShadowControl
+              v-model="editedShadow"
+              :disabled="!isShadowPresent"
+              :no-preview="true"
+              :compact="true"
+              :static-vars="staticVars"
+              @sub-shadow-selected="onSubShadow"
+            />
+          </div>
+        </tab-switcher>
+      </div>
+      <div
+        key="palette"
+        :label="$t('settings.style.themes3.editor.palette_tab')"
+        class="setting-section list-editor palette-editor"
+        :full-width="true"
+      >
+        <label
+          class="list-select-label"
+          for="palette-selector"
+        >
+          {{ $t('settings.style.themes3.palette.label') }}
+          {{ ' ' }}
+        </label>
+        <Select
+          id="palette-selector"
+          v-model="selectedPaletteId"
+          class="list-select"
+          size="4"
+        >
+          <option
+            v-for="(p, index) in palettes"
+            :key="p.name"
+            :value="index"
+          >
+            {{ p.name }}
+          </option>
+        </Select>
+        <SelectMotion
+          class="list-select-movement"
+          :model-value="palettes"
+          :selected-id="selectedPaletteId"
+          :get-add-value="getNewPalette"
+          @update:model-value="onPalettesUpdate"
+          @update:selected-id="e => selectedPaletteId = e"
+        />
+        <div class="list-edit-area">
+          <StringSetting
+            v-model="selectedPalette.name"
+            class="palette-name-input"
+          >
+            {{ $t('settings.style.themes3.palette.name_label') }}
+          </StringSetting>
+          <PaletteEditor
+            v-model="selectedPalette"
+            class="palette-editor-single"
+          />
+        </div>
+      </div>
+      <VirtualDirectivesTab
+        key="variables"
+        :label="$t('settings.style.themes3.editor.variables_tab')"
+        :model-value="virtualDirectives"
+        :full-width="true"
+        @update:model-value="updateVirtualDirectives"
+      />
+    </tab-switcher>
+  </div>
+</template>
+
+<style src="./style_tab.scss" lang="scss"></style>
diff --git a/src/components/settings_modal/tabs/style_tab/virtual_directives_tab.js b/src/components/settings_modal/tabs/style_tab/virtual_directives_tab.js
new file mode 100644
index 000000000..d98dea615
--- /dev/null
+++ b/src/components/settings_modal/tabs/style_tab/virtual_directives_tab.js
@@ -0,0 +1,132 @@
+import { ref, computed, watch, inject } from 'vue'
+
+import Select from 'src/components/select/select.vue'
+import SelectMotion from 'src/components/select/select_motion.vue'
+import ShadowControl from 'src/components/shadow_control/shadow_control.vue'
+import ColorInput from 'src/components/color_input/color_input.vue'
+
+import { serializeShadow } from 'src/services/theme_data/iss_serializer.js'
+
+// helper for debugging
+// eslint-disable-next-line no-unused-vars
+const toValue = (x) => JSON.parse(JSON.stringify(x === undefined ? 'null' : x))
+
+export default {
+  components: {
+    Select,
+    SelectMotion,
+    ShadowControl,
+    ColorInput
+  },
+  props: ['modelValue'],
+  emits: ['update:modelValue'],
+  setup (props, context) {
+    const exports = {}
+    const emit = context.emit
+
+    exports.emit = emit
+    exports.computeColor = inject('computeColor')
+    exports.staticVars = inject('staticVars')
+
+    const selectedVirtualDirectiveId = ref(0)
+    exports.selectedVirtualDirectiveId = selectedVirtualDirectiveId
+
+    const selectedVirtualDirective = computed({
+      get () {
+        return props.modelValue[selectedVirtualDirectiveId.value]
+      },
+      set (value) {
+        const newVD = [...props.modelValue]
+        newVD[selectedVirtualDirectiveId.value] = value
+
+        emit('update:modelValue', newVD)
+      }
+    })
+    exports.selectedVirtualDirective = selectedVirtualDirective
+
+    exports.selectedVirtualDirectiveValType = computed({
+      get () {
+        return props.modelValue[selectedVirtualDirectiveId.value].valType
+      },
+      set (value) {
+        const newValType = value
+        let newValue
+        switch (value) {
+          case 'shadow':
+            newValue = '0 0 0 #000000 / 1'
+            break
+          case 'color':
+            newValue = '#000000'
+            break
+          default:
+            newValue = 'none'
+        }
+        const newName = props.modelValue[selectedVirtualDirectiveId.value].name
+        props.modelValue[selectedVirtualDirectiveId.value] = {
+          name: newName,
+          value: newValue,
+          valType: newValType
+        }
+      }
+    })
+
+    const draftVirtualDirectiveValid = ref(true)
+    const draftVirtualDirective = ref({})
+    exports.draftVirtualDirective = draftVirtualDirective
+    const normalizeShadows = inject('normalizeShadows')
+
+    watch(
+      selectedVirtualDirective,
+      (directive) => {
+        switch (directive.valType) {
+          case 'shadow': {
+            if (Array.isArray(directive.value)) {
+              draftVirtualDirective.value = normalizeShadows(directive.value)
+            } else {
+              const splitShadow = directive.value.split(/,/g).map(x => x.trim())
+              draftVirtualDirective.value = normalizeShadows(splitShadow)
+            }
+            break
+          }
+          case 'color':
+            draftVirtualDirective.value = directive.value
+            break
+          default:
+            draftVirtualDirective.value = directive.value
+            break
+        }
+      },
+      { immediate: true }
+    )
+
+    watch(
+      draftVirtualDirective,
+      (directive) => {
+        try {
+          switch (selectedVirtualDirective.value.valType) {
+            case 'shadow': {
+              props.modelValue[selectedVirtualDirectiveId.value].value =
+                directive.map(x => serializeShadow(x)).join(', ')
+              break
+            }
+            default:
+              props.modelValue[selectedVirtualDirectiveId.value].value = directive
+          }
+          draftVirtualDirectiveValid.value = true
+        } catch (e) {
+          console.error('Invalid virtual directive value', e)
+          draftVirtualDirectiveValid.value = false
+        }
+      },
+      { immediate: true }
+    )
+
+    exports.getNewVirtualDirective = () => ({
+      name: 'newDirective',
+      valType: 'generic',
+      value: 'foobar'
+    })
+
+    return exports
+  }
+}
diff --git a/src/components/settings_modal/tabs/style_tab/virtual_directives_tab.vue b/src/components/settings_modal/tabs/style_tab/virtual_directives_tab.vue
new file mode 100644
index 000000000..69f974e9f
--- /dev/null
+++ b/src/components/settings_modal/tabs/style_tab/virtual_directives_tab.vue
@@ -0,0 +1,84 @@
+<script src="./virtual_directives_tab.js"></script>
+
+<template>
+  <div class="setting-section list-editor variables-editor">
+    <label
+      class="list-select-label"
+      for="variables-selector"
+    >
+      {{ $t('settings.style.themes3.editor.variables.label') }}
+      {{ ' ' }}
+    </label>
+    <Select
+      id="variables-selector"
+      v-model="selectedVirtualDirectiveId"
+      class="list-select"
+      size="20"
+    >
+      <option
+        v-for="(p, index) in modelValue"
+        :key="p.name"
+        :value="index"
+      >
+        {{ p.name }}
+      </option>
+    </Select>
+    <SelectMotion
+      class="list-select-movement"
+      :model-value="modelValue"
+      :selected-id="selectedVirtualDirectiveId"
+      :get-add-value="getNewVirtualDirective"
+      @update:model-value="e => emit('update:modelValue', e)"
+      @update:selected-id="e => selectedVirtualDirectiveId = e"
+    />
+    <div class="list-edit-area">
+      <div class="variable-selector">
+        <label
+          class="variable-name-label"
+          for="variables-selector"
+        >
+          {{ $t('settings.style.themes3.editor.variables.name_label') }}
+          {{ ' ' }}
+        </label>
+        <input
+          v-model="selectedVirtualDirective.name"
+          class="input"
+        >
+        <label
+          class="variable-type-label"
+          for="variables-selector"
+        >
+          {{ $t('settings.style.themes3.editor.variables.type_label') }}
+          {{ ' ' }}
+        </label>
+        <Select
+          v-model="selectedVirtualDirectiveValType"
+        >
+          <option value="shadow">
+            {{ $t('settings.style.themes3.editor.variables.type_shadow') }}
+          </option>
+          <option value="color">
+            {{ $t('settings.style.themes3.editor.variables.type_color') }}
+          </option>
+          <option value="generic">
+            {{ $t('settings.style.themes3.editor.variables.type_generic') }}
+          </option>
+        </Select>
+      </div>
+      <ShadowControl
+        v-if="selectedVirtualDirectiveValType === 'shadow'"
+        v-model="draftVirtualDirective"
+        :static-vars="staticVars"
+        :compact="true"
+      />
+      <ColorInput
+        v-if="selectedVirtualDirectiveValType === 'color'"
+        v-model="draftVirtualDirective"
+        name="virtual-directive-color"
+        :fallback="computeColor(draftVirtualDirective)"
+        :label="$t('settings.style.themes3.editor.variables.virtual_color')"
+        :hide-optional-checkbox="true"
+      />
+    </div>
+  </div>
+</template>
diff --git a/src/components/settings_modal/tabs/uploads_tab.vue b/src/components/settings_modal/tabs/uploads_tab.vue
new file mode 100644
index 000000000..375032d6e
--- /dev/null
+++ b/src/components/settings_modal/tabs/uploads_tab.vue
@@ -0,0 +1,26 @@
+<template>
+  <div :label="$t('admin_dash.tabs.uploads')">
+    <div class="setting-section">
+      <h3>{{ $t('admin_dash.uploads.general') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <ChoiceSetting
+            :path="[':pleroma','Pleroma.Upload']"
+            :option-label-map="adaptersLabels"
+          />
+        </li>
+        <h4>{{ $t('admin_dash.mailer.auth') }}</h4>
+        <li>
+          <!-- authentication info -->
+          <StringSetting
+            :path="[':pleroma','Pleroma.Emails.Mailer',':api_key']"
+            :password="true"
+            :subgroup="adapter"
+          />
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script src="./uploads_tab.js"></script>
diff --git a/src/components/settings_modal/tabs/version_tab.js b/src/components/settings_modal/tabs/version_tab.js
deleted file mode 100644
index 616bdadf5..000000000
--- a/src/components/settings_modal/tabs/version_tab.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import { extractCommit } from 'src/services/version/version.service'
-
-const pleromaFeCommitUrl = 'https://git.pleroma.social/pleroma/pleroma-fe/commit/'
-const pleromaBeCommitUrl = 'https://git.pleroma.social/pleroma/pleroma/commit/'
-
-const VersionTab = {
-  data () {
-    const instance = this.$store.state.instance
-    return {
-      backendVersion: instance.backendVersion,
-      frontendVersion: instance.frontendVersion
-    }
-  },
-  computed: {
-    frontendVersionLink () {
-      return pleromaFeCommitUrl + this.frontendVersion
-    },
-    backendVersionLink () {
-      return pleromaBeCommitUrl + extractCommit(this.backendVersion)
-    }
-  }
-}
-
-export default VersionTab
diff --git a/src/components/settings_modal/tabs/version_tab.vue b/src/components/settings_modal/tabs/version_tab.vue
deleted file mode 100644
index 0330d49f8..000000000
--- a/src/components/settings_modal/tabs/version_tab.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<template>
-  <div :label="$t('settings.version.title')">
-    <div class="setting-item">
-      <ul class="setting-list">
-        <li>
-          <p>{{ $t('settings.version.backend_version') }}</p>
-          <ul class="option-list">
-            <li>
-              <a
-                :href="backendVersionLink"
-                target="_blank"
-              >{{ backendVersion }}</a>
-            </li>
-          </ul>
-        </li>
-        <li>
-          <p>{{ $t('settings.version.frontend_version') }}</p>
-          <ul class="option-list">
-            <li>
-              <a
-                :href="frontendVersionLink"
-                target="_blank"
-              >{{ frontendVersion }}</a>
-            </li>
-          </ul>
-        </li>
-      </ul>
-    </div>
-  </div>
-</template>
-<script src="./version_tab.js" />
diff --git a/src/components/shadow_control/shadow_control.js b/src/components/shadow_control/shadow_control.js
index 4521305ea..1722454db 100644
--- a/src/components/shadow_control/shadow_control.js
+++ b/src/components/shadow_control/shadow_control.js
@@ -1,12 +1,17 @@
 import ColorInput from 'src/components/color_input/color_input.vue'
 import OpacityInput from 'src/components/opacity_input/opacity_input.vue'
 import Select from 'src/components/select/select.vue'
+import SelectMotion from 'src/components/select/select_motion.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Popover from 'src/components/popover/popover.vue'
 import ComponentPreview from 'src/components/component_preview/component_preview.vue'
-import { getCssShadow, getCssShadowFilter } from '../../services/theme_data/theme_data.service.js'
+import { rgb2hex } from 'src/services/color_convert/color_convert.js'
+import { serializeShadow } from 'src/services/theme_data/iss_serializer.js'
+import { deserializeShadow } from 'src/services/theme_data/iss_deserializer.js'
+import { getCssShadow, getCssShadowFilter } from 'src/services/theme_data/css_utils.js'
+import { findShadow, findColor } from 'src/services/theme_data/theme_data_3.service.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
-import { throttle } from 'lodash'
+import { throttle, flattenDeep } from 'lodash'
 import {
   faTimes,
   faChevronDown,
@@ -21,50 +26,83 @@ library.add(
   faPlus
 )
 
-const toModel = (object = {}) => ({
-  x: 0,
-  y: 0,
-  blur: 0,
-  spread: 0,
-  inset: false,
-  color: '#000000',
-  alpha: 1,
-  ...object
-})
+const toModel = (input) => {
+  if (typeof input === 'object') {
+    return {
+      x: 0,
+      y: 0,
+      blur: 0,
+      spread: 0,
+      inset: false,
+      color: '#000000',
+      alpha: 1,
+      ...input
+    }
+  } else if (typeof input === 'string') {
+    return input
+  }
+}
 
 export default {
   props: [
-    'modelValue', 'fallback', 'separateInset', 'noPreview', 'disabled'
+    'modelValue',
+    'fallback',
+    'separateInset',
+    'noPreview',
+    'disabled',
+    'staticVars',
+    'compact'
   ],
   emits: ['update:modelValue', 'subShadowSelected'],
   data () {
     return {
       selectedId: 0,
-      // TODO there are some bugs regarding display of array (it's not getting updated when deleting for some reason)
-      cValue: (this.modelValue ?? this.fallback ?? []).map(toModel)
+      invalid: false
     }
   },
   components: {
     ColorInput,
     OpacityInput,
     Select,
+    SelectMotion,
     Checkbox,
     Popover,
     ComponentPreview
   },
-  beforeUpdate () {
-    this.cValue = (this.modelValue ?? this.fallback ?? []).map(toModel)
-  },
   computed: {
-    selected () {
-      const selected = this.cValue[this.selectedId]
-      if (selected) {
-        return { ...selected }
+    cValue: {
+      get () {
+        return (this.modelValue ?? this.fallback ?? []).map(toModel)
+      },
+      set (newVal) {
+        this.$emit('update:modelValue', newVal)
+      }
+    },
+    selectedType: {
+      get () {
+        return typeof this.selected
+      },
+      set (newType) {
+        this.selected = toModel(newType === 'object' ? {} : '')
+      }
+    },
+    selected: {
+      get () {
+        const selected = this.cValue[this.selectedId]
+        if (selected && typeof selected === 'object') {
+          return { ...selected }
+        } else if (typeof selected === 'string') {
+          return selected
+        }
+        return null
+      },
+      set (value) {
+        this.cValue[this.selectedId] = toModel(value)
+        this.$emit('update:modelValue', this.cValue)
       }
-      return null
     },
     present () {
-      return this.selected != null && !this.usingFallback
+      return this.selected != null && this.modelValue != null
     },
     shadowsAreNull () {
       return this.modelValue == null
@@ -72,61 +110,71 @@ export default {
     currentFallback () {
       return this.fallback?.[this.selectedId]
     },
-    moveUpValid () {
-      return this.selectedId > 0
-    },
-    moveDnValid () {
-      return this.selectedId < this.cValue.length - 1
-    },
-    usingFallback () {
-      return this.modelValue == null
+    getColorFallback () {
+      if (this.staticVars && this.selected?.color) {
+        try {
+          const computedColor = findColor(this.selected.color, { dynamicVars: {}, staticVars: this.staticVars }, true)
+          if (computedColor) return rgb2hex(computedColor)
+          return null
+        } catch (e) {
+          console.warn(e)
+          return null
+        }
+      } else {
+        return this.currentFallback?.color
+      }
     },
     style () {
-      if (this.separateInset) {
-        return {
-          filter: getCssShadowFilter(this.cValue),
-          boxShadow: getCssShadow(this.cValue, true)
+      try {
+        let result
+        const serialized = this.cValue.map(x => serializeShadow(x)).join(',')
+        serialized.split(/,/).map(deserializeShadow) // validate
+        const expandedShadow = flattenDeep(findShadow(this.cValue, { dynamicVars: {}, staticVars: this.staticVars }))
+        const fixedShadows = expandedShadow.map(x => ({ ...x, color: rgb2hex(x.color) }))
+
+        if (this.separateInset) {
+          result = {
+            filter: getCssShadowFilter(fixedShadows),
+            boxShadow: getCssShadow(fixedShadows, true)
+          }
+        } else {
+          result = {
+            boxShadow: getCssShadow(fixedShadows)
+          }
         }
-      }
-      return {
-        boxShadow: getCssShadow(this.cValue)
+        this.invalid = false
+        return result
+      } catch (e) {
+        console.error('Invalid shadow', e)
+        this.invalid = true
       }
     }
   },
   watch: {
-    selected (value) {
+    selected () {
       this.$emit('subShadowSelected', this.selectedId)
     }
   },
   methods: {
+    getNewSubshadow () {
+      return toModel(this.selected)
+    },
+    onSelectChange (id) {
+      this.selectedId = id
+    },
+    getSubshadowLabel (shadow, index) {
+      if (typeof shadow === 'object') {
+        return shadow?.name ?? this.$t('settings.style.shadows.shadow_id', { value: index })
+      } else if (typeof shadow === 'string') {
+        return shadow || this.$t('settings.style.shadows.empty_expression')
+      }
+    },
     updateProperty: throttle(function (prop, value) {
       this.cValue[this.selectedId][prop] = value
       if (prop === 'inset' && value === false && this.separateInset) {
         this.cValue[this.selectedId].spread = 0
       }
       this.$emit('update:modelValue', this.cValue)
-    }, 100),
-    add () {
-      this.cValue.push(toModel(this.selected))
-      this.selectedId = Math.max(this.cValue.length - 1, 0)
-      this.$emit('update:modelValue', this.cValue)
-    },
-    del () {
-      this.cValue.splice(this.selectedId, 1)
-      this.selectedId = this.cValue.length === 0 ? undefined : Math.max(this.selectedId - 1, 0)
-      this.$emit('update:modelValue', this.cValue)
-    },
-    moveUp () {
-      const movable = this.cValue.splice(this.selectedId, 1)[0]
-      this.cValue.splice(this.selectedId - 1, 0, movable)
-      this.selectedId -= 1
-      this.$emit('update:modelValue', this.cValue)
-    },
-    moveDn () {
-      const movable = this.cValue.splice(this.selectedId, 1)[0]
-      this.cValue.splice(this.selectedId + 1, 0, movable)
-      this.selectedId += 1
-      this.$emit('update:modelValue', this.cValue)
-    }
+    }, 100)
   }
 }
diff --git a/src/components/shadow_control/shadow_control.scss b/src/components/shadow_control/shadow_control.scss
index dd0490235..0fb7386ec 100644
--- a/src/components/shadow_control/shadow_control.scss
+++ b/src/components/shadow_control/shadow_control.scss
@@ -1,11 +1,33 @@
-.settings-modal .settings-modal-panel .shadow-control {
-  display: flex;
-  flex-wrap: wrap;
+.ShadowControl {
+  display: grid;
+  grid-template-columns: 10em 1fr 1fr;
+  grid-template-rows: 1fr;
+  grid-template-areas: "selector preview tweak";
+  grid-gap: 0.5em;
   justify-content: stretch;
-  grid-gap: 0.25em;
-  margin-bottom: 1em;
+
+  .style-control {
+    display: flex;
+  }
+
+  &.-compact {
+    grid-template-columns: 10em 1fr;
+    grid-template-rows: auto auto;
+    grid-template-areas:
+      "selector preview"
+      "tweak tweak";
+
+    &.-no-preview {
+      grid-template-columns: 1fr;
+      grid-template-rows: 10em 1fr;
+      grid-template-areas:
+        "selector"
+        "tweak";
+    }
+  }
 
   .shadow-switcher {
+    grid-area: selector;
     order: 1;
     flex: 1 0 6em;
     min-width: 6em;
@@ -16,27 +38,18 @@
     .shadow-list {
       flex: 1 0 auto;
     }
-
-    .arrange-buttons {
-      flex: 0 0 auto;
-      display: grid;
-      grid-auto-columns: 1fr;
-      grid-auto-flow: column;
-      margin-top: 0.25em;
-
-      .button-default {
-        margin: 0;
-        padding: 0;
-      }
-    }
   }
 
   .shadow-tweak {
+    grid-area: tweak;
     order: 3;
     flex: 2 0 10em;
     min-width: 10em;
     margin-left: 0.125em;
     margin-right: 0.125em;
+    display: grid;
+    grid-template-rows: auto 1fr;
+    grid-gap: 0.25em;
 
     /* hack */
     .input-boolean {
@@ -52,6 +65,11 @@
       flex: 1 0 5em;
     }
 
+    .shadow-expression {
+      width: 100%;
+      height: 100%;
+    }
+
     .id-control {
       align-items: stretch;
 
@@ -69,6 +87,10 @@
   }
 
   &.-no-preview {
+    grid-template-columns: 10em 1fr;
+    grid-template-rows: 1fr;
+    grid-template-areas: "selector tweak";
+
     .shadow-tweak {
       order: 0;
       flex: 2 0 8em;
@@ -91,15 +113,12 @@
   }
 
   .shadow-preview {
-    order: 2;
-    flex: 3 3 15em;
-    min-width: 10em;
+    grid-area: preview;
     margin-left: 0.125em;
-    align-self: start;
+    place-self: start center;
   }
 }
 
 .inset-tooltip {
-  padding: 0.5em;
   max-width: 30em;
 }
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index e1d201914..4fdae4207 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -1,10 +1,11 @@
 <template>
   <div
-    class="label shadow-control"
-    :class="{ disabled: disabled || !present, '-no-preview': noPreview }"
+    class="ShadowControl label shadow-control"
+    :class="{ disabled: disabled || !present, '-no-preview': noPreview, '-compact': compact }"
   >
     <ComponentPreview
       v-if="!noPreview"
+      :invalid="invalid"
       class="shadow-preview"
       :shadow-control="true"
       :shadow="selected"
@@ -17,8 +18,8 @@
         id="shadow-list"
         v-model="selectedId"
         class="shadow-list"
-        size="10"
-        :disabled="shadowsAreNull"
+        size="4"
+        :disabled="disabled || shadowsAreNull"
       >
         <option
           v-for="(shadow, index) in cValue"
@@ -26,227 +27,209 @@
           :value="index"
           :class="{ '-active': index === Number(selectedId) }"
         >
-          {{ shadow?.name ?? $t('settings.style.shadows.shadow_id', { value: index }) }}
+          {{ getSubshadowLabel(shadow, index) }}
         </option>
       </Select>
-      <div
-        class="id-control btn-group arrange-buttons"
-      >
-        <button
-          class="btn button-default"
-          :disabled="disabled || shadowsAreNull"
-          @click="add"
-        >
-          <FAIcon
-            fixed-width
-            icon="plus"
-          />
-        </button>
-        <button
-          class="btn button-default"
-          :disabled="disabled || !moveUpValid"
-          :class="{ disabled: disabled || !moveUpValid }"
-          @click="moveUp"
-        >
-          <FAIcon
-            fixed-width
-            icon="chevron-up"
-          />
-        </button>
-        <button
-          class="btn button-default"
-          :disabled="disabled || !moveDnValid"
-          :class="{ disabled: disabled || !moveDnValid }"
-          @click="moveDn"
-        >
-          <FAIcon
-            fixed-width
-            icon="chevron-down"
-          />
-        </button>
-        <button
-          class="btn button-default"
-          :disabled="disabled || !present"
-          :class="{ disabled: disabled || !present }"
-          @click="del"
-        >
-          <FAIcon
-            fixed-width
-            icon="times"
-          />
-        </button>
-      </div>
+      <SelectMotion
+        v-model="cValue"
+        :selected-id="selectedId"
+        :get-add-value="getNewSubshadow"
+        :disabled="disabled"
+        @update:selected-id="onSelectChange"
+      />
     </div>
     <div class="shadow-tweak">
-      <div
-        :class="{ disabled: disabled || !present }"
-        class="name-control style-control"
+      <Select
+        v-model="selectedType"
+        :disabled="disabled || !present"
       >
-        <label
-          for="name"
-          class="label"
-          :class="{ faint: disabled || !present }"
-        >
-          {{ $t('settings.style.shadows.name') }}
-        </label>
-        <input
-          id="name"
-          :value="selected?.name"
-          :disabled="disabled || !present"
+        <option value="object">
+          {{ $t('settings.style.shadows.raw') }}
+        </option>
+        <option value="string">
+          {{ $t('settings.style.shadows.expression') }}
+        </option>
+      </Select>
+      <template v-if="selectedType === 'string'">
+        <textarea
+          v-model="selected"
+          class="input shadow-expression"
+          :disabled="disabled || shadowsAreNull"
+          :class="{disabled: disabled || shadowsAreNull}"
+        />
+      </template>
+      <template v-else-if="selectedType === 'object'">
+        <div
           :class="{ disabled: disabled || !present }"
-          name="name"
-          class="input input-string"
-          @input="e => updateProperty('name', e.target.value)"
+          class="name-control style-control"
         >
-      </div>
-      <div
-        :disabled="disabled || !present"
-        class="inset-control style-control"
-      >
-        <Checkbox
-          id="inset"
-          :value="selected?.inset"
-          :disabled="disabled || !present"
-          name="inset"
-          class="input-inset input-boolean"
-          @input="e => updateProperty('inset', e.target.checked)"
-        >
-          <template #before>
-            {{ $t('settings.style.shadows.inset') }}
-          </template>
-        </Checkbox>
-      </div>
-      <div
-        :disabled="disabled || !present"
-        :class="{ disabled: disabled || !present }"
-        class="blur-control style-control"
-      >
-        <label
-          for="blur"
-          class="label"
-          :class="{ faint: disabled || !present }"
-        >
-          {{ $t('settings.style.shadows.blur') }}
-        </label>
-        <input
-          id="blur"
-          :value="selected?.blur"
-          :disabled="disabled || !present"
-          :class="{ disabled: disabled || !present }"
-          name="blur"
-          class="input input-range"
-          type="range"
-          max="20"
-          min="0"
-          @input="e => updateProperty('blur', e.target.value)"
-        >
-        <input
-          :value="selected?.blur"
-          class="input input-number -small"
-          :disabled="disabled || !present"
-          :class="{ disabled: disabled || !present }"
-          type="number"
-          min="0"
-          @input="e => updateProperty('blur', e.target.value)"
-        >
-      </div>
-      <div
-        class="spread-control style-control"
-        :class="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
-      >
-        <label
-          for="spread"
-          class="label"
-          :class="{ faint: disabled || !present || (separateInset && !selected?.inset) }"
-        >
-          {{ $t('settings.style.shadows.spread') }}
-        </label>
-        <input
-          id="spread"
-          :value="selected?.spread"
-          :disabled="disabled || !present || (separateInset && !selected?.inset)"
-          :class="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
-          name="spread"
-          class="input input-range"
-          type="range"
-          max="20"
-          min="-20"
-          @input="e => updateProperty('spread', e.target.value)"
-        >
-        <input
-          :value="selected?.spread"
-          class="input input-number -small"
-          :class="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
-          :disabled="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
-          type="number"
-          @input="e => updateProperty('spread', e.target.value)"
-        >
-      </div>
-      <ColorInput
-        :model-value="selected?.color"
-        :disabled="disabled || !present"
-        :label="$t('settings.style.common.color')"
-        :fallback="currentFallback?.color"
-        :show-optional-tickbox="false"
-        name="shadow"
-        @update:modelValue="e => updateProperty('color', e)"
-      />
-      <OpacityInput
-        :model-value="selected?.alpha"
-        :disabled="disabled || !present"
-        @update:modelValue="e => updateProperty('alpha', e)"
-      />
-      <i18n-t
-        scope="global"
-        keypath="settings.style.shadows.hintV3"
-        :class="{ faint: disabled || !present }"
-        tag="p"
-      >
-        <code>--variable,mod</code>
-      </i18n-t>
-      <Popover
-        v-if="separateInset"
-        trigger="hover"
-      >
-        <template #trigger>
-          <div
-            class="inset-alert alert warning"
+          <label
+            for="name"
+            class="label"
+            :class="{ faint: disabled || !present }"
           >
-            <FAIcon icon="exclamation-triangle" />
-            &nbsp;
-            {{ $t('settings.style.shadows.filter_hint.avatar_inset_short') }}
-          </div>
-        </template>
-        <template #content>
-          <div class="inset-tooltip">
-            <i18n-t
-              scope="global"
-              keypath="settings.style.shadows.filter_hint.always_drop_shadow"
-              tag="p"
+            {{ $t('settings.style.shadows.name') }}
+          </label>
+          <input
+            id="name"
+            :value="selected?.name"
+            :disabled="disabled || !present"
+            :class="{ disabled: disabled || !present }"
+            name="name"
+            class="input input-string"
+            @input="e => updateProperty('name', e.target.value)"
+          >
+        </div>
+        <div
+          :disabled="disabled || !present"
+          class="inset-control style-control"
+        >
+          <Checkbox
+            id="inset"
+            :value="selected?.inset"
+            :disabled="disabled || !present"
+            name="inset"
+            class="input-inset input-boolean"
+            @input="e => updateProperty('inset', e.target.checked)"
+          >
+            <template #before>
+              {{ $t('settings.style.shadows.inset') }}
+            </template>
+          </Checkbox>
+        </div>
+        <div
+          :disabled="disabled || !present"
+          :class="{ disabled: disabled || !present }"
+          class="blur-control style-control"
+        >
+          <label
+            for="blur"
+            class="label"
+            :class="{ faint: disabled || !present }"
+          >
+            {{ $t('settings.style.shadows.blur') }}
+          </label>
+          <input
+            id="blur"
+            :value="selected?.blur"
+            :disabled="disabled || !present"
+            :class="{ disabled: disabled || !present }"
+            name="blur"
+            class="input input-range"
+            type="range"
+            max="20"
+            min="0"
+            @input="e => updateProperty('blur', e.target.value)"
+          >
+          <input
+            :value="selected?.blur"
+            class="input input-number -small"
+            :disabled="disabled || !present"
+            :class="{ disabled: disabled || !present }"
+            type="number"
+            min="0"
+            @input="e => updateProperty('blur', e.target.value)"
+          >
+        </div>
+        <div
+          class="spread-control style-control"
+          :class="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
+        >
+          <label
+            for="spread"
+            class="label"
+            :class="{ faint: disabled || !present || (separateInset && !selected?.inset) }"
+          >
+            {{ $t('settings.style.shadows.spread') }}
+          </label>
+          <input
+            id="spread"
+            :value="selected?.spread"
+            :class="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
+            :disabled="disabled || !present || (separateInset && !selected?.inset)"
+            name="spread"
+            class="input input-range"
+            type="range"
+            max="20"
+            min="-20"
+            @input="e => updateProperty('spread', e.target.value)"
+          >
+          <input
+            :value="selected?.spread"
+            class="input input-number -small"
+            :class="{ disabled: disabled || !present || (separateInset && !selected?.inset) }"
+            :disabled="disabled || !present || (separateInset && !selected?.inset)"
+            type="number"
+            @input="e => updateProperty('spread', e.target.value)"
+          >
+        </div>
+        <ColorInput
+          :model-value="selected?.color"
+          :disabled="disabled || !present"
+          :label="$t('settings.style.common.color')"
+          :fallback="getColorFallback"
+          :compact="true"
+          :show-optional-checkbox="false"
+          name="shadow"
+          @update:model-value="e => updateProperty('color', e)"
+        />
+        <OpacityInput
+          :model-value="selected?.alpha"
+          :disabled="disabled || !present"
+          @update:model-value="e => updateProperty('alpha', e)"
+        />
+        <i18n-t
+          scope="global"
+          keypath="settings.style.shadows.hintV3"
+          :class="{ faint: disabled || !present }"
+          tag="p"
+        >
+          <code>--variable,mod</code>
+        </i18n-t>
+        <Popover
+          v-if="separateInset"
+          trigger="hover"
+        >
+          <template #trigger>
+            <div
+              class="inset-alert alert warning"
             >
-              <code>filter: drop-shadow()</code>
-            </i18n-t>
-            <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
-            <i18n-t
-              scope="global"
-              keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
-              tag="p"
-            >
-              <code>drop-shadow</code>
-              <code>spread-radius</code>
-              <code>inset</code>
-            </i18n-t>
-            <i18n-t
-              scope="global"
-              keypath="settings.style.shadows.filter_hint.inset_classic"
-              tag="p"
-            >
-              <code>box-shadow</code>
-            </i18n-t>
-            <p>{{ $t('settings.style.shadows.filter_hint.spread_zero') }}</p>
-          </div>
-        </template>
-      </Popover>
+              <FAIcon icon="exclamation-triangle" />
+              &nbsp;
+              {{ $t('settings.style.shadows.filter_hint.avatar_inset_short') }}
+            </div>
+          </template>
+          <template #content>
+            <div class="inset-tooltip tooltip">
+              <i18n-t
+                scope="global"
+                keypath="settings.style.shadows.filter_hint.always_drop_shadow"
+                tag="p"
+              >
+                <code>filter: drop-shadow()</code>
+              </i18n-t>
+              <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
+              <i18n-t
+                scope="global"
+                keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
+                tag="p"
+              >
+                <code>drop-shadow</code>
+                <code>spread-radius</code>
+                <code>inset</code>
+              </i18n-t>
+              <i18n-t
+                scope="global"
+                keypath="settings.style.shadows.filter_hint.inset_classic"
+                tag="p"
+              >
+                <code>box-shadow</code>
+              </i18n-t>
+              <p>{{ $t('settings.style.shadows.filter_hint.spread_zero') }}</p>
+            </div>
+          </template>
+        </Popover>
+      </template>
     </div>
   </div>
 </template>
diff --git a/src/components/shout_panel/shout_panel.js b/src/components/shout_panel/shout_panel.js
index fb0c5aa21..af5e90364 100644
--- a/src/components/shout_panel/shout_panel.js
+++ b/src/components/shout_panel/shout_panel.js
@@ -4,6 +4,7 @@ import {
   faBullhorn,
   faTimes
 } from '@fortawesome/free-solid-svg-icons'
+import { useShoutStore } from 'src/stores/shout'
 
 library.add(
   faBullhorn,
@@ -21,12 +22,12 @@ const shoutPanel = {
   },
   computed: {
     messages () {
-      return this.$store.state.shout.messages
+      return useShoutStore().messages
     }
   },
   methods: {
     submit (message) {
-      this.$store.state.shout.channel.push('new_msg', { text: message }, 10000)
+      useShoutStore().channel.push('new_msg', { text: message }, 10000)
       this.currentMessage = ''
     },
     togglePanel () {
@@ -37,7 +38,7 @@ const shoutPanel = {
     }
   },
   watch: {
-    messages (newVal) {
+    messages () {
       const scrollEl = this.$el.querySelector('.chat-window')
       if (!scrollEl) return
       if (scrollEl.scrollTop + scrollEl.offsetHeight + 20 > scrollEl.scrollHeight) {
diff --git a/src/components/shout_panel/shout_panel.vue b/src/components/shout_panel/shout_panel.vue
index 9113211eb..184fe81e0 100644
--- a/src/components/shout_panel/shout_panel.vue
+++ b/src/components/shout_panel/shout_panel.vue
@@ -9,14 +9,14 @@
         :class="{ 'shout-heading': floating }"
         @click.stop.prevent="togglePanel"
       >
-        <div class="title">
+        <h1 class="title">
           {{ $t('shoutbox.title') }}
           <FAIcon
             v-if="floating"
             icon="times"
             class="close-icon"
           />
-        </div>
+        </h1>
       </div>
       <div class="panel-body shout-window">
         <div
@@ -107,8 +107,7 @@
   }
 
   .shout-window {
-    overflow-y: auto;
-    overflow-x: hidden;
+    overflow: hidden auto;
     max-height: 20em;
   }
 
@@ -123,8 +122,8 @@
 
   .shout-avatar {
     img {
-      height: 24px;
-      width: 24px;
+      height: 0.6em;
+      width: 0.6em;
       border-radius: var(--roundness);
       margin-right: 0.5em;
       margin-top: 0.25em;
diff --git a/src/components/side_drawer/side_drawer.js b/src/components/side_drawer/side_drawer.js
index 81c5a6121..7dbd38cb5 100644
--- a/src/components/side_drawer/side_drawer.js
+++ b/src/components/side_drawer/side_drawer.js
@@ -1,4 +1,5 @@
 import { mapState, mapGetters } from 'vuex'
+import { mapState as mapPiniaState } from 'pinia'
 import UserCard from '../user_card/user_card.vue'
 import { unseenNotificationsFromStore } from '../../services/notification_utils/notification_utils'
 import GestureService from '../../services/gesture_service/gesture_service'
@@ -17,8 +18,12 @@ import {
   faCog,
   faInfoCircle,
   faCompass,
-  faList
+  faList,
+  faFilePen
 } from '@fortawesome/free-solid-svg-icons'
+import { useShoutStore } from 'src/stores/shout'
+import { useInterfaceStore } from 'src/stores/interface'
+import { useAnnouncementsStore } from 'src/stores/announcements'
 
 library.add(
   faSignInAlt,
@@ -33,7 +38,8 @@ library.add(
   faCog,
   faInfoCircle,
   faCompass,
-  faList
+  faList,
+  faFilePen
 )
 
 const SideDrawer = {
@@ -54,7 +60,7 @@ const SideDrawer = {
     currentUser () {
       return this.$store.state.users.currentUser
     },
-    shout () { return this.$store.state.shout.joined },
+    shout () { return useShoutStore().joined },
     unseenNotifications () {
       return unseenNotificationsFromStore(this.$store)
     },
@@ -84,8 +90,8 @@ const SideDrawer = {
     },
     timelinesRoute () {
       let name
-      if (this.$store.state.interface.lastTimeline) {
-        name = this.$store.state.interface.lastTimeline
+      if (useInterfaceStore().lastTimeline) {
+        name = useInterfaceStore().lastTimeline
       }
       name = this.currentUser ? 'friends' : 'public-timeline'
       if (USERNAME_ROUTES.has(name)) {
@@ -94,11 +100,14 @@ const SideDrawer = {
         return { name }
       }
     },
-    ...mapState({
-      pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable,
-      supportsAnnouncements: state => state.announcements.supportsAnnouncements
+    ...mapPiniaState(useAnnouncementsStore, {
+      supportsAnnouncements: store => store.supportsAnnouncements,
+      unreadAnnouncementCount: 'unreadAnnouncementCount'
     }),
-    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
+    ...mapState({
+      pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable
+    }),
+    ...mapGetters(['unreadChatCount', 'draftCount'])
   },
   methods: {
     toggleDrawer () {
@@ -115,10 +124,10 @@ const SideDrawer = {
       GestureService.updateSwipe(e, this.closeGesture)
     },
     openSettingsModal () {
-      this.$store.dispatch('openSettingsModal', 'user')
+      useInterfaceStore().openSettingsModal('user')
     },
     openAdminModal () {
-      this.$store.dispatch('openSettingsModal', 'admin')
+      useInterfaceStore().openSettingsModal('admin')
     }
   }
 }
diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index 608b5608e..eda60a96a 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -76,6 +76,21 @@
             /> {{ $t("nav.lists") }}
           </router-link>
         </li>
+        <li
+          v-if="currentUser"
+          @click="toggleDrawer"
+        >
+          <router-link
+            :to="{ name: 'bookmarks' }"
+            class="menu-item"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="bookmark"
+            /> {{ $t("nav.bookmarks") }}
+          </router-link>
+        </li>
         <li
           v-if="currentUser && pleromaChatMessagesAvailable"
           @click="toggleDrawer"
@@ -240,6 +255,27 @@
             </span>
           </router-link>
         </li>
+        <li
+          v-if="currentUser"
+          @click="toggleDrawer"
+        >
+          <router-link
+            :to="{ name: 'drafts' }"
+            class="menu-item"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="file-pen"
+            /> {{ $t('nav.drafts') }}
+            <span
+              v-if="draftCount"
+              class="badge -neutral"
+            >
+              {{ draftCount }}
+            </span>
+          </router-link>
+        </li>
         <li
           v-if="currentUser"
           @click="toggleDrawer"
@@ -376,6 +412,10 @@
   display: flex;
   padding: 0;
   margin: 0;
+
+  .user-info {
+    margin: 1em;
+  }
 }
 
 .side-drawer ul {
diff --git a/src/components/staff_panel/staff_panel.vue b/src/components/staff_panel/staff_panel.vue
index 77155e8b7..86f4bc6c8 100644
--- a/src/components/staff_panel/staff_panel.vue
+++ b/src/components/staff_panel/staff_panel.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="staff-panel">
     <div class="panel panel-default base01-background">
-      <div class="panel-heading timeline-heading base02-background">
+      <div class="panel-heading timeline-heading base02-background -sticky">
         <div class="title">
           {{ $t("about.staff") }}
         </div>
@@ -28,8 +28,7 @@
 
 <style lang="scss">
 .staff-group {
-  padding-left: 1em;
-  padding-top: 1em;
+  padding: 1em;
 
   .basic-user-card {
     padding-left: 0;
diff --git a/src/components/status/post.style.js b/src/components/status/post.style.js
index d0038424e..43e21a16e 100644
--- a/src/components/status/post.style.js
+++ b/src/components/status/post.style.js
@@ -9,23 +9,9 @@ export default {
     'Link',
     'Icon',
     'Border',
-    'Button',
-    'ButtonUnstyled',
-    'RichContent',
-    'Input',
     'Avatar',
-    'Attachment',
     'PollGraph'
   ],
-  validInnerComponentsLite: [
-    'Text',
-    'Link',
-    'Icon',
-    'Border',
-    'ButtonUnstyled',
-    'RichContent',
-    'Avatar'
-  ],
   defaultRules: [
     {
       directives: {
diff --git a/src/components/status/status.js b/src/components/status/status.js
index bf4e42757..eebae459b 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -1,8 +1,3 @@
-import ReplyButton from '../reply_button/reply_button.vue'
-import FavoriteButton from '../favorite_button/favorite_button.vue'
-import ReactButton from '../react_button/react_button.vue'
-import RetweetButton from '../retweet_button/retweet_button.vue'
-import ExtraButtons from '../extra_buttons/extra_buttons.vue'
 import PostStatusForm from '../post_status_form/post_status_form.vue'
 import UserAvatar from '../user_avatar/user_avatar.vue'
 import AvatarList from '../avatar_list/avatar_list.vue'
@@ -16,10 +11,12 @@ import EmojiReactions from '../emoji_reactions/emoji_reactions.vue'
 import UserLink from '../user_link/user_link.vue'
 import MentionsLine from 'src/components/mentions_line/mentions_line.vue'
 import MentionLink from 'src/components/mention_link/mention_link.vue'
+import StatusActionButtons from 'src/components/status_action_buttons/status_action_buttons.vue'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
-import { muteWordHits } from '../../services/status_parser/status_parser.js'
+import { muteFilterHits } from '../../services/status_parser/status_parser.js'
 import { unescape, uniqBy } from 'lodash'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -27,6 +24,7 @@ import {
   faLock,
   faLockOpen,
   faGlobe,
+  faIgloo,
   faTimes,
   faRetweet,
   faReply,
@@ -46,6 +44,7 @@ import {
 library.add(
   faEnvelope,
   faGlobe,
+  faIgloo,
   faLock,
   faLockOpen,
   faTimes,
@@ -102,11 +101,6 @@ const controlledOrUncontrolledSet = (obj, name, val) => {
 const Status = {
   name: 'Status',
   components: {
-    ReplyButton,
-    FavoriteButton,
-    ReactButton,
-    RetweetButton,
-    ExtraButtons,
     PostStatusForm,
     UserAvatar,
     AvatarList,
@@ -119,7 +113,8 @@ const Status = {
     MentionLink,
     MentionsLine,
     UserPopover,
-    UserLink
+    UserLink,
+    StatusActionButtons
   },
   props: [
     'statusoid',
@@ -169,9 +164,6 @@ const Status = {
   },
   computed: {
     ...controlledOrUncontrolledGetters(['replying', 'mediaPlaying']),
-    muteWords () {
-      return this.mergedConfig.muteWords
-    },
     showReasonMutedThread () {
       return (
         this.status.thread_muted ||
@@ -229,8 +221,11 @@ const Status = {
     loggedIn () {
       return !!this.currentUser
     },
-    muteWordHits () {
-      return muteWordHits(this.status, this.muteWords)
+    muteFilterHits () {
+      return muteFilterHits(
+        Object.values(useServerSideStorageStore().prefsStorage.simple.muteFilters),
+        this.status
+      )
     },
     botStatus () {
       return this.status.user.actor_type === 'Service'
@@ -260,18 +255,50 @@ const Status = {
     hasMentionsLine () {
       return this.mentionsLine.length > 0
     },
+    muteReasons () {
+      return [
+        this.userIsMuted ? 'user' : null,
+        this.status.thread_muted ? 'thread' : null,
+        (this.muteFilterHits.length > 0) ? 'filtered' : null,
+        (this.muteBotStatuses && this.botStatus) ? 'bot' : null,
+        (this.muteSensitiveStatuses && this.sensitiveStatus) ? 'nsfw' : null
+      ].filter(_ => _)
+    },
+    muteLocalized () {
+      if (this.muteReasons.length === 0) return null
+      const mainReason = () => {
+        switch (this.muteReasons[0]) {
+          case 'user': return this.$t('status.muted_user')
+          case 'thread': return this.$t('status.thread_muted')
+          case 'filtered':
+            return this.$t(
+              'status.muted_filters',
+              {
+                name: this.muteFilterHits[0].name,
+                filterMore: this.muteFilterHits.length - 1
+              },
+              this.muteFilterHits.length
+            )
+          case 'bot': return this.$t('status.bot_muted')
+          case 'nsfw': return this.$t('status.sensitive_muted')
+        }
+      }
+      if (this.muteReasons.length > 1) {
+        return this.$t(
+          'status.multi_reason_mute',
+          {
+            main: mainReason(),
+            numReasonsMore: this.muteReasons.length - 1
+          },
+          this.muteReasons.length - 1
+        )
+      } else {
+        return mainReason()
+      }
+    },
     muted () {
       if (this.statusoid.user.id === this.currentUser.id) return false
-      const reasonsToMute = this.userIsMuted ||
-        // Thread is muted
-        status.thread_muted ||
-        // Wordfiltered
-        this.muteWordHits.length > 0 ||
-        // bot status
-        (this.muteBotStatuses && this.botStatus && !this.compact) ||
-        // sensitive status
-        (this.muteSensitiveStatuses && this.sensitiveStatus && !this.compact)
-      return !this.unmuted && !this.shouldNotMute && reasonsToMute
+      return !this.unmuted && !this.shouldNotMute && this.muteReasons.length > 0
     },
     userIsMuted () {
       if (this.statusoid.user.id === this.currentUser.id) return false
@@ -279,15 +306,16 @@ const Status = {
       const { reblog } = status
       const relationship = this.$store.getters.relationship(status.user.id)
       const relationshipReblog = reblog && this.$store.getters.relationship(reblog.user.id)
-      return status.muted ||
+      return (status.muted && !status.thread_muted) ||
         // Reprööt of a muted post according to BE
-        (reblog && reblog.muted) ||
+        (reblog && reblog.muted && !reblog.thread_muted) ||
         // Muted user
         relationship.muting ||
         // Muted user of a reprööt
         (relationshipReblog && relationshipReblog.muting)
     },
     shouldNotMute () {
+      if (this.isFocused) return true
       const { status } = this
       const { reblog } = status
       return (
@@ -302,7 +330,7 @@ const Status = {
         // Don't mute statuses in muted conversation when said conversation is opened
         (this.inConversation && status.thread_muted)
         // No excuses if post has muted words
-      ) && !this.muteWordHits.length > 0
+      ) && !this.muteFilterHits.length > 0
     },
     hideMutedUsers () {
       return this.mergedConfig.hideMutedPosts
@@ -321,7 +349,8 @@ const Status = {
         (this.muted && this.hideFilteredStatuses) ||
         (this.userIsMuted && this.hideMutedUsers) ||
         (this.status.thread_muted && this.hideMutedThreads) ||
-        (this.muteWordHits.length > 0 && this.hideWordFilteredPosts)
+        (this.muteFilterHits.length > 0 && this.hideWordFilteredPosts) ||
+          (this.muteFilterHits.some(x => x.hide))
       )
     },
     isFocused () {
@@ -388,9 +417,6 @@ const Status = {
     currentUser () {
       return this.$store.state.users.currentUser
     },
-    betterShadow () {
-      return this.$store.state.interface.browserSupport.cssFilter
-    },
     mergedConfig () {
       return this.$store.getters.mergedConfig
     },
@@ -426,7 +452,7 @@ const Status = {
     },
     scrobblePresent () {
       if (this.mergedConfig.hideScrobbles) return false
-      if (!this.status.user.latestScrobble) return false
+      if (!this.status.user?.latestScrobble) return false
       const value = this.mergedConfig.hideScrobblesAfter.match(/\d+/gs)[0]
       const unit = this.mergedConfig.hideScrobblesAfter.match(/\D+/gs)[0]
       let multiplier = 60 * 1000 // minutes is smallest unit
@@ -448,7 +474,7 @@ const Status = {
       return this.status.user.latestScrobble.artist
     },
     scrobble () {
-      return this.status.user.latestScrobble
+      return this.status.user?.latestScrobble
     }
   },
   methods: {
@@ -460,6 +486,8 @@ const Status = {
           return 'lock-open'
         case 'direct':
           return 'envelope'
+        case 'local':
+          return 'igloo'
         default:
           return 'globe'
       }
@@ -473,6 +501,13 @@ const Status = {
     },
     toggleReplying () {
       this.$emit('interacted')
+      if (this.replying) {
+        this.$refs.postStatusForm.requestClose()
+      } else {
+        this.doToggleReplying()
+      }
+    },
+    doToggleReplying () {
       controlledOrUncontrolledToggle(this, 'replying')
     },
     gotoOriginal (id) {
@@ -505,6 +540,7 @@ const Status = {
       this.controlledToggleThreadDisplay()
     },
     scrollIfHighlighted (highlightId) {
+      if (this.$el.getBoundingClientRect == null) return
       const id = highlightId
       if (this.status.id === id) {
         const rect = this.$el.getBoundingClientRect()
diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 344e4b8ef..897730a07 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -1,8 +1,8 @@
 .Status {
   min-width: 0;
   white-space: normal;
-  word-wrap: break-word;
-  word-break: break-word;
+  overflow-wrap: break-word;
+  text-wrap: pretty;
 
   &:hover {
     --_still-image-img-visibility: visible;
@@ -72,13 +72,14 @@
     text-overflow: ellipsis;
 
     --_still_image-label-scale: 0.25;
-    --emoji-size: 14px;
+    --emoji-size: 1em;
   }
 
   .status-favicon {
-    height: 18px;
-    width: 18px;
+    height: 1.2em;
+    width: 1.2em;
     margin-right: 0.4em;
+    object-fit: contain;
   }
 
   .status-heading {
@@ -92,17 +93,25 @@
 
     a {
       display: inline-block;
-      word-break: break-all;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      overflow-x: hidden;
+      width: 100%
     }
   }
 
   .account-name {
-    min-width: 1.6em;
+    display: inline-block;
+    min-width: 1em;
     margin-right: 0.4em;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     flex: 1 1 0;
+
+    &.unknown {
+      min-width: 8em;
+    }
   }
 
   .heading-left {
@@ -113,10 +122,11 @@
   .heading-right {
     display: flex;
     flex-shrink: 0;
+    align-self: baseline;
 
     .button-unstyled {
-      padding: 5px;
-      margin: -5px;
+      padding: 0.2em;
+      margin: -0.2em;
     }
 
     .svg-inline--fa {
@@ -229,9 +239,9 @@
 
   .repeater-avatar {
     border-radius: var(--roundness);
-    margin-left: 28px;
-    width: 20px;
-    height: 20px;
+    margin-left: 2em; // 3.5 (poster avatar size) - 1.5 (repeater avatar size)
+    width: 1.5em;
+    height: 1.5em;
   }
 
   .repeater-name {
@@ -239,8 +249,8 @@
     margin-right: 0;
 
     .emoji {
-      width: 14px;
-      height: 14px;
+      width: 1em;
+      height: 1em;
       vertical-align: middle;
       object-fit: contain;
     }
@@ -264,13 +274,11 @@
   .status-actions {
     position: relative;
     width: 100%;
-    display: flex;
+    display: grid;
+    grid-template-columns: 1fr;
+    grid-auto-columns: 1fr;
+    grid-auto-flow: column;
     margin-top: var(--status-margin);
-
-    > * {
-      max-width: 4em;
-      flex: 1;
-    }
   }
 
   .muted {
@@ -284,15 +292,8 @@
     gap: 1ex;
 
     & .status-username,
-    & .mute-thread,
-    & .mute-words {
-      word-wrap: normal;
-      word-break: normal;
+    & .mute-reason {
       white-space: nowrap;
-    }
-
-    & .status-username,
-    & .mute-words {
       text-overflow: ellipsis;
       overflow: hidden;
     }
@@ -302,19 +303,7 @@
       flex: 0 1 auto;
       margin-right: 0.2em;
       font-size: smaller;
-    }
-
-    .mute-thread {
-      flex: 0 0 auto;
-    }
-
-    .mute-words {
-      flex: 1 0 5em;
-      margin-left: 0.2em;
-
-      &::before {
-        content: " ";
-      }
+      display: flex;
     }
 
     .unmute {
@@ -383,7 +372,7 @@
     }
   }
 
-  @media all and (max-width: 800px) {
+  @media all and (width <= 800px) {
     .repeater-avatar {
       margin-left: 20px;
     }
@@ -393,7 +382,6 @@
       height: 40px;
 
       // TODO define those other way somehow?
-      // stylelint-disable rscss/class-format
       &.-compact {
         width: 32px;
         height: 32px;
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 7fef69df0..8c78fddc1 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -30,36 +30,8 @@
             :at="false"
           />
         </small>
-        <small
-          v-if="muteSensitiveStatuses && status.nsfw"
-          class="mute-thread"
-        >
-          {{ $t('status.sensitive_muted') }}
-        </small>
-        <small
-          v-if="muteBotStatuses && botStatus"
-          class="mute-thread"
-        >
-          {{ $t('status.bot_muted') }}
-        </small>
-        <small
-          v-if="showReasonMutedThread"
-          class="mute-thread"
-        >
-          <span>
-            {{ $t('status.thread_muted') }}
-          </span>
-          <span
-            v-if="muteWordHits.length > 0"
-          >
-            {{ $t('status.thread_muted_and_words') }}
-          </span>
-        </small>
-        <small
-          class="mute-words"
-          :title="muteWordHits.join(', ')"
-        >
-          {{ muteWordHits.join(', ') }}
+        <small class="mute-reason">
+          {{ muteLocalized }}
         </small>
         <button
           class="unmute button-unstyled"
@@ -93,7 +65,6 @@
           v-if="retweet"
           class="left-side repeater-avatar"
           :show-actor-type-indicator="showActorTypeIndicator"
-          :better-shadow="betterShadow"
           :user="statusoid.user"
         />
         <div class="right-side faint">
@@ -108,6 +79,7 @@
               <RichContent
                 :html="retweeterHtml"
                 :emoji="retweeterUser.emoji"
+                :is-local="retweeterUser.is_local"
               />
             </router-link>
             <router-link
@@ -137,6 +109,7 @@
           class="left-side"
         >
           <a
+            v-if="status.user?.name"
             :href="$router.resolve(userProfileLink).href"
             @click.prevent
           >
@@ -148,11 +121,17 @@
                 class="post-avatar"
                 :show-actor-type-indicator="showActorTypeIndicator"
                 :compact="compact"
-                :better-shadow="betterShadow"
-                :user="status.user"
+                :user="status?.user"
               />
             </UserPopover>
           </a>
+          <UserAvatar
+            v-else
+            :user="status?.user"
+            class="post-avatar"
+            :compact="compact"
+            :title="$t('status.unknown_user_info')"
+          />
         </div>
         <div class="right-side">
           <div
@@ -160,7 +139,10 @@
             class="status-heading"
           >
             <div class="heading-name-row">
-              <div class="heading-left">
+              <div
+                v-if="status.user"
+                class="heading-left"
+              >
                 <h4
                   v-if="status.user.name_html"
                   class="status-username"
@@ -169,6 +151,7 @@
                   <RichContent
                     :html="status.user.name"
                     :emoji="status.user.emoji"
+                    :is-local="status.user.is_local"
                   />
                 </h4>
                 <h4
@@ -311,44 +294,61 @@
                 v-if="isReply"
                 class="glued-label reply-glued-label"
               >
-                <StatusPopover
-                  v-if="!isPreview"
-                  :status-id="status.parent_visible && status.in_reply_to_status_id"
-                  class="reply-to-popover"
-                  style="min-width: 0;"
-                  :class="{ '-strikethrough': !status.parent_visible }"
+                <i18n-t
+                  keypath="status.reply_to_with_arg"
+                  scope="global"
                 >
-                  <button
-                    class="button-unstyled reply-to"
-                    :aria-label="$t('tool_tip.reply')"
-                    @click.prevent="gotoOriginal(status.in_reply_to_status_id)"
-                  >
-                    <FAIcon
-                      class="fa-scale-110 fa-old-padding"
-                      icon="reply"
-                      flip="horizontal"
-                    />
-                    {{ ' ' }}
-                    <span
-                      class="reply-to-text"
+                  <template #replyToWithIcon>
+                    <StatusPopover
+                      v-if="!isPreview"
+                      :status-id="status.parent_visible && status.in_reply_to_status_id"
+                      class="reply-to-popover"
+                      style="min-width: 0;"
+                      :class="{ '-strikethrough': !status.parent_visible }"
                     >
-                      {{ $t('status.reply_to') }}
-                    </span>
-                  </button>
-                </StatusPopover>
+                      <button
+                        class="button-unstyled reply-to"
+                        :aria-label="$t('tool_tip.reply')"
+                        @click.prevent="gotoOriginal(status.in_reply_to_status_id)"
+                      >
+                        <i18n-t
+                          keypath="status.reply_to_with_icon"
+                          scope="global"
+                        >
+                          <template #icon>
+                            <FAIcon
+                              class="fa-scale-110 fa-old-padding"
+                              icon="reply"
+                              flip="horizontal"
+                            />
+                          </template>
+                          <template #replyTo>
+                            <span
+                              class="reply-to-text"
+                            >
+                              {{ $t('status.reply_to') }}
+                            </span>
+                          </template>
+                        </i18n-t>
+                      </button>
+                    </StatusPopover>
 
-                <span
-                  v-else
-                  class="reply-to-no-popover"
-                >
-                  <span class="reply-to-text">{{ $t('status.reply_to') }}</span>
-                </span>
-                <MentionLink
-                  :content="replyToName"
-                  :url="replyProfileLink"
-                  :user-id="status.in_reply_to_user_id"
-                  :user-screen-name="status.in_reply_to_screen_name"
-                />
+                    <span
+                      v-else
+                      class="reply-to-no-popover"
+                    >
+                      <span class="reply-to-text">{{ $t('status.reply_to') }}</span>
+                    </span>
+                  </template>
+                  <template #user>
+                    <MentionLink
+                      :content="replyToName"
+                      :url="replyProfileLink"
+                      :user-id="status.in_reply_to_user_id"
+                      :user-screen-name="status.in_reply_to_screen_name"
+                    />
+                  </template>
+                </i18n-t>
               </span>
 
               <!-- This little wrapper is made for sole purpose of "gluing" -->
@@ -386,6 +386,7 @@
               class="heading-edited-row"
             >
               <i18n-t
+                scope="global"
                 keypath="status.edited_at"
                 tag="span"
               >
@@ -415,7 +416,7 @@
             :controlled-toggle-showing-long-subject="controlledToggleShowingLongSubject"
             @mediaplay="addMediaPlaying($event)"
             @mediapause="removeMediaPlaying($event)"
-            @parseReady="setHeadTailLinks"
+            @parse-ready="setHeadTailLinks"
           />
 
           <article
@@ -443,7 +444,10 @@
             v-else-if="hasInvisibleQuote"
             class="quoted-status -unavailable-prompt"
           >
-            <i18n-t keypath="status.invisible_quote">
+            <i18n-t
+              scope="global"
+              keypath="status.invisible_quote"
+            >
               <template #link>
                 <bdi>
                   <a
@@ -464,10 +468,10 @@
             <button
               v-if="showOtherRepliesAsButton && replies.length > 1"
               class="button-unstyled -link"
-              :title="$tc('status.ancestor_follow', replies.length - 1, { numReplies: replies.length - 1 })"
+              :title="$t('status.ancestor_follow', { numReplies: replies.length - 1 }, replies.length - 1)"
               @click.prevent="dive"
             >
-              {{ $tc('status.replies_list_with_others', replies.length - 1, { numReplies: replies.length - 1 }) }}
+              {{ $t('status.replies_list_with_others', { numReplies: replies.length - 1 }, replies.length - 1) }}
             </button>
             <span
               v-else
@@ -544,37 +548,13 @@
             :status="status"
           />
 
-          <div
+          <StatusActionButtons
             v-if="!noHeading && !isPreview"
-            class="status-actions"
-          >
-            <reply-button
-              :replying="replying"
-              :status="status"
-              @toggle="toggleReplying"
-            />
-            <retweet-button
-              :visibility="status.visibility"
-              :logged-in="loggedIn"
-              :status="status"
-              @click="$emit('interacted')"
-            />
-            <favorite-button
-              :logged-in="loggedIn"
-              :status="status"
-              @click="$emit('interacted')"
-            />
-            <ReactButton
-              v-if="loggedIn"
-              :status="status"
-              @click="$emit('interacted')"
-            />
-            <extra-buttons
-              :status="status"
-              @onError="showError"
-              @onSuccess="clearError"
-            />
-          </div>
+            :status="status"
+            :replying="replying"
+            @toggle-replying="toggleReplying"
+            @interacted="e => $emit('interacted')"
+          />
         </div>
       </div>
       <div
@@ -592,12 +572,6 @@
           <div class="deleted-text">
             {{ $t('status.status_deleted') }}
           </div>
-          <reply-button
-            v-if="replying"
-            :replying="replying"
-            :status="status"
-            @toggle="toggleReplying"
-          />
         </div>
       </div>
       <div
@@ -605,13 +579,17 @@
         class="status-container reply-form"
       >
         <PostStatusForm
+          ref="postStatusForm"
           class="reply-body"
+          :closeable="true"
           :reply-to="status.id"
           :attentions="status.attentions"
           :replied-user="status.user"
           :copy-message-scope="status.visibility"
           :subject="replySubject"
-          @posted="toggleReplying"
+          @posted="doToggleReplying"
+          @draft-done="doToggleReplying"
+          @can-close="doToggleReplying"
         />
       </div>
     </template>
diff --git a/src/components/status_action_buttons/action_button.js b/src/components/status_action_buttons/action_button.js
new file mode 100644
index 000000000..8a65b9184
--- /dev/null
+++ b/src/components/status_action_buttons/action_button.js
@@ -0,0 +1,141 @@
+import StatusBookmarkFolderMenu from 'src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue'
+import EmojiPicker from 'src/components/emoji_picker/emoji_picker.vue'
+import Popover from 'src/components/popover/popover.vue'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faPlus,
+  faMinus,
+  faCheck,
+  faTimes,
+  faWrench,
+
+  faChevronRight,
+  faChevronUp,
+
+  faReply,
+  faRetweet,
+  faStar,
+  faSmileBeam,
+
+  faBookmark,
+  faEyeSlash,
+  faThumbtack,
+  faShareAlt,
+  faExternalLinkAlt,
+  faHistory
+} from '@fortawesome/free-solid-svg-icons'
+import {
+  faStar as faStarRegular,
+  faBookmark as faBookmarkRegular
+} from '@fortawesome/free-regular-svg-icons'
+
+library.add(
+  faPlus,
+  faMinus,
+  faCheck,
+  faTimes,
+  faWrench,
+
+  faChevronRight,
+  faChevronUp,
+
+  faReply,
+  faRetweet,
+  faStar,
+  faStarRegular,
+  faSmileBeam,
+
+  faBookmark,
+  faBookmarkRegular,
+  faEyeSlash,
+  faThumbtack,
+  faShareAlt,
+  faExternalLinkAlt,
+  faHistory
+)
+
+export default {
+  props: [
+    'button',
+    'status',
+    'extra',
+    'status',
+    'funcArg',
+    'getClass',
+    'getComponent',
+    'doAction',
+    'outerClose'
+  ],
+  emits: [
+    'interacted'
+  ],
+  components: {
+    StatusBookmarkFolderMenu,
+    EmojiPicker,
+    Popover
+  },
+  data: () => ({
+    animationState: false
+  }),
+  computed: {
+    buttonClass () {
+      return [
+        this.button.name + '-button',
+        {
+          '-with-extra': this.button.name === 'bookmark',
+          '-extra': this.extra,
+          '-quick': !this.extra
+        }
+      ]
+    },
+    userIsMuted () {
+      return this.$store.getters.relationship(this.status.user.id).muting
+    },
+    threadIsMuted () {
+      return this.status.thread_muted
+    },
+    hideCustomEmoji () {
+      return !this.$store.state.instance.pleromaCustomEmojiReactionsAvailable
+    },
+    buttonInnerClass () {
+      return [
+        this.button.name + '-button',
+        {
+          'main-button': this.extra,
+          'button-unstyled': !this.extra,
+          '-active': this.button.active?.(this.funcArg),
+          disabled: this.button.interactive ? !this.button.interactive(this.funcArg) : false
+        }
+      ]
+    },
+    remoteInteractionLink () {
+      return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
+    }
+  },
+  methods: {
+    addReaction (event) {
+      const emoji = event.insertion
+      const existingReaction = this.status.emoji_reactions.find(r => r.name === emoji)
+      if (existingReaction && existingReaction.me) {
+        this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
+      } else {
+        this.$store.dispatch('reactWithEmoji', { id: this.status.id, emoji })
+      }
+    },
+    doActionWrap (button, close = () => {}) {
+      if (this.button.interactive ? !this.button.interactive(this.funcArg) : false) return
+      this.$emit('interacted')
+      if (button.name === 'emoji') {
+        this.$refs.picker.showPicker()
+      } else {
+        this.animationState = true
+        this.getComponent(button) === 'button' && this.doAction(button)
+        setTimeout(() => {
+          this.animationState = false
+        }, 500)
+        close()
+      }
+    }
+  }
+}
diff --git a/src/components/status_action_buttons/action_button.scss b/src/components/status_action_buttons/action_button.scss
new file mode 100644
index 000000000..df445391a
--- /dev/null
+++ b/src/components/status_action_buttons/action_button.scss
@@ -0,0 +1,121 @@
+@use "../../mixins";
+/* stylelint-disable declaration-no-important */
+
+.quick-action {
+  justify-content: space-between;
+  display: flex;
+  align-items: baseline;
+  align-items: center;
+  height: 1.5em;
+
+  .action-counter {
+    overflow-x: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    margin-left: 1em;
+  }
+
+  .action-button-inner,
+  .extra-button {
+    margin: -0.5em;
+    padding: 0.5em;
+  }
+
+  .separator {
+    display: block;
+    align-self: stretch;
+    width: 1px;
+    background-color: var(--icon);
+    margin-left: 0.75em;
+    margin-right: 0.125em;
+  }
+
+  &.-pin {
+    margin: calc(-2px - 0.25em);
+    padding: 0.25em;
+    border: 2px dashed var(--icon);
+    border-radius: var(--roundness);
+    grid-template-columns: minmax(max-content, 1fr) auto;
+
+    .chevron-icon,
+    .extra-button,
+    .separator {
+      display: none;
+    }
+  }
+
+  .action-button-inner {
+    display: grid;
+    grid-gap: 1em;
+    grid-template-columns: max-content;
+    grid-auto-flow: column;
+    grid-auto-columns: max-content;
+    align-items: center;
+
+    @include mixins.unfocused-style {
+      .focus-marker {
+        visibility: hidden;
+      }
+
+      .active-marker {
+        visibility: visible;
+      }
+    }
+
+    @include mixins.focused-style {
+      .focus-marker {
+        visibility: visible;
+      }
+
+      .active-marker {
+        visibility: hidden;
+      }
+    }
+  }
+}
+
+.action-button {
+  display: grid;
+  grid-auto-flow: column;
+  align-items: center;
+  padding: 0;
+
+  .action-button-inner {
+    &:hover,
+    &.-active {
+      &.reply-button:not(.disabled) {
+        .svg-inline--fa {
+          color: var(--cBlue);
+        }
+      }
+
+      &.retweet-button:not(.disabled) {
+        .svg-inline--fa {
+          color: var(--cGreen);
+        }
+      }
+
+      &.favorite-button:not(.disabled) {
+        .svg-inline--fa {
+          color: var(--cOrange);
+        }
+      }
+    }
+  }
+
+  &.-extra {
+    .action-counter {
+      justify-self: end;
+      margin-right: 1em;
+    }
+
+    .chevron-icon {
+      justify-self: end;
+    }
+
+    .extra-button {
+      justify-self: end;
+      justify-content: end;
+    }
+  }
+}
diff --git a/src/components/status_action_buttons/action_button.vue b/src/components/status_action_buttons/action_button.vue
new file mode 100644
index 000000000..a9aedb9e3
--- /dev/null
+++ b/src/components/status_action_buttons/action_button.vue
@@ -0,0 +1,109 @@
+<template>
+  <div
+    class="action-button"
+    :class="buttonClass"
+  >
+    <component
+      :is="getComponent(button)"
+      class="action-button-inner"
+      :class="buttonInnerClass"
+      role="menuitem"
+      type="button"
+      :title="$t(button.label(funcArg))"
+      target="_blank"
+      :tabindex="0"
+      :disabled="button.interactive ? !button.interactive(funcArg) : false"
+      :href="getComponent(button) == 'a' ? button.link?.(funcArg) || remoteInteractionLink : undefined"
+      @click="doActionWrap(button, outerClose)"
+    >
+      <FALayers>
+        <FAIcon
+          class="fa-scale-110"
+          :icon="button.icon(funcArg)"
+          :spin="!extra && getComponent(button) == 'button' && button.animated?.() && animationState"
+          :style="{ '--fa-animation-duration': '750ms' }"
+          fixed-width
+        />
+        <template v-if="!buttonClass.disabled && (!button.interactive || button?.interactive(funcArg)) && button.toggleable?.(funcArg) && button.active">
+          <FAIcon
+            v-if="button.active(funcArg)"
+            class="active-marker"
+            transform="shrink-6 up-9 right-15"
+            :icon="button.activeIndicator?.(funcArg) || 'check'"
+          />
+          <FAIcon
+            v-if="!button.active(funcArg)"
+            class="focus-marker"
+            transform="shrink-6 up-9 right-15"
+            :icon="button.openIndicator?.(funcArg) || 'plus'"
+          />
+          <FAIcon
+            v-else
+            class="focus-marker"
+            transform="shrink-6 up-9 right-15"
+            :icon="button.closeIndicator?.(funcArg) || 'minus'"
+          />
+        </template>
+      </FALayers>
+      <span
+        v-if="extra"
+        class="action-label"
+      >
+        {{ $t(button.label(funcArg)) }}
+      </span>
+      <FAIcon
+        v-if="button.dropdown?.()"
+        class="chevron-icon"
+        size="lg"
+        :icon="extra ? 'chevron-right' : 'chevron-up'"
+        fixed-width
+      />
+    </component>
+    <span
+      v-if="button.counter?.(funcArg) > 0"
+      class="action-counter"
+    >
+      {{ button.counter?.(funcArg) }}
+    </span>
+    <span
+      v-if="!extra && button.name === 'bookmark'"
+      class="separator"
+    />
+    <Popover
+      v-if="button.name === 'bookmark'"
+      :trigger="extra ? 'hover' : 'click'"
+      :placement="extra ? 'right' : 'top'"
+      :offset="extra ? { x: 10 } : { y: 10 }"
+      :trigger-attrs="{ class: 'extra-button' }"
+    >
+      <template #trigger>
+        <FAIcon
+          class="chevron-icon"
+          size="lg"
+          :icon="extra ? 'chevron-right' : 'chevron-up'"
+          fixed-width
+        />
+      </template>
+      <template #content="{close}">
+        <StatusBookmarkFolderMenu
+          v-if="button.name === 'bookmark'"
+          :status="status"
+          :close="() => { close(); outerClose() }"
+        />
+      </template>
+    </Popover>
+
+    <EmojiPicker
+      v-if="button.name === 'emoji'"
+      ref="picker"
+      :enable-sticker-picker="false"
+      :hide-custom-emoji="hideCustomEmoji"
+      class="emoji-picker-panel"
+      @emoji="addReaction"
+    />
+  </div>
+</template>
+
+<script src="./action_button.js" />
+
+<style lang="scss" src="./action_button.scss" />
diff --git a/src/components/status_action_buttons/action_button_container.js b/src/components/status_action_buttons/action_button_container.js
new file mode 100644
index 000000000..a8f20800b
--- /dev/null
+++ b/src/components/status_action_buttons/action_button_container.js
@@ -0,0 +1,92 @@
+import ActionButton from './action_button.vue'
+import Popover from 'src/components/popover/popover.vue'
+import MuteConfirm from 'src/components/confirm_modal/mute_confirm.vue'
+import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faUser,
+  faGlobe,
+  faFolderTree
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faUser,
+  faGlobe,
+  faFolderTree
+)
+
+export default {
+  components: {
+    ActionButton,
+    Popover,
+    MuteConfirm,
+    UserTimedFilterModal
+  },
+  props: ['button', 'status'],
+  emits: ['interacted'],
+  mounted () {
+    if (this.button.name === 'mute') {
+      this.$store.dispatch('fetchDomainMutes')
+    }
+  },
+  computed: {
+    buttonClass () {
+      return [
+        this.button.name + '-button',
+        {
+          '-with-extra': this.button.name === 'bookmark',
+          '-extra': this.extra,
+          '-quick': !this.extra
+        }
+      ]
+    },
+    user () {
+      return this.status.user
+    },
+    userIsMuted () {
+      return this.$store.getters.relationship(this.user.id).muting
+    },
+    conversationIsMuted () {
+      return this.status.thread_muted
+    },
+    domain () {
+      return this.user.fqn.split('@')[1]
+    },
+    domainIsMuted () {
+      return new Set(this.$store.state.users.currentUser.domainMutes).has(this.domain)
+    }
+  },
+  methods: {
+    unmuteUser () {
+      return this.$store.dispatch('unmuteUser', this.user.id)
+    },
+    unmuteConversation () {
+      return this.$store.dispatch('unmuteConversation', { id: this.status.id })
+    },
+    unmuteDomain () {
+      return this.$store.dispatch('unmuteDomain', this.user.id)
+    },
+    toggleUserMute () {
+      if (this.userIsMuted) {
+        this.unmuteUser()
+      } else {
+        this.$refs.confirmUser.optionallyPrompt()
+      }
+    },
+    toggleConversationMute () {
+      if (this.conversationIsMuted) {
+        this.unmuteConversation()
+      } else {
+        this.$refs.confirmConversation.optionallyPrompt()
+      }
+    },
+    toggleDomainMute () {
+      if (this.domainIsMuted) {
+        this.unmuteDomain()
+      } else {
+        this.$refs.confirmDomain.optionallyPrompt()
+      }
+    }
+  }
+}
diff --git a/src/components/status_action_buttons/action_button_container.vue b/src/components/status_action_buttons/action_button_container.vue
new file mode 100644
index 000000000..b7ff10f3c
--- /dev/null
+++ b/src/components/status_action_buttons/action_button_container.vue
@@ -0,0 +1,106 @@
+<template>
+  <div>
+    <Popover
+      v-if="button.dropdown?.()"
+      :trigger="$attrs.extra ? 'hover' : 'click'"
+      :offset="{ y: 5 }"
+      :placement="$attrs.extra ? 'right' : 'top'"
+    >
+      <template #trigger>
+        <ActionButton
+          :button="button"
+          :status="status"
+          v-bind.prop="$attrs"
+        />
+      </template>
+      <template #content>
+        <div
+          v-if="button.name === 'mute'"
+          :id="`popup-menu-${randomSeed}`"
+          class="dropdown-menu"
+          role="menu"
+        >
+          <div class="menu-item dropdown-item extra-action -icon">
+            <button
+              class="main-button"
+              @click="toggleUserMute"
+            >
+              <FAIcon
+                icon="user"
+                fixed-width
+              />
+              <template v-if="userIsMuted">
+                {{ $t('status.unmute_user') }}
+              </template>
+              <template v-else>
+                {{ $t('status.mute_user') }}
+              </template>
+            </button>
+          </div>
+          <div class="menu-item dropdown-item extra-action -icon">
+            <button
+              class="main-button"
+              @click="toggleConversationMute"
+            >
+              <FAIcon
+                icon="folder-tree"
+                fixed-width
+              />
+              <template v-if="conversationIsMuted">
+                {{ $t('status.unmute_conversation') }}
+              </template>
+              <template v-else>
+                {{ $t('status.mute_conversation') }}
+              </template>
+            </button>
+          </div>
+          <div class="menu-item dropdown-item extra-action -icon">
+            <button
+              class="main-button"
+              @click="toggleDomainMute"
+            >
+              <FAIcon
+                icon="globe"
+                fixed-width
+              />
+              <template v-if="domainIsMuted">
+                {{ $t('status.unmute_domain') }}
+              </template>
+              <template v-else>
+                {{ $t('status.mute_domain') }}
+              </template>
+            </button>
+          </div>
+        </div>
+      </template>
+    </Popover>
+    <ActionButton
+      v-else
+      :button="button"
+      :status="status"
+      v-bind="$attrs"
+      @interacted="e => $emit('interacted')"
+    />
+    <teleport to="#modal">
+      <MuteConfirm
+        ref="confirmConversation"
+        type="conversation"
+        :status="status"
+        :user="user"
+      />
+      <MuteConfirm
+        ref="confirmDomain"
+        type="domain"
+        :status="status"
+        :user="user"
+      />
+      <UserTimedFilterModal
+        ref="confirmUser"
+        :is-mute="true"
+        :user="user"
+      />
+    </teleport>
+  </div>
+</template>
+
+<script src="./action_button_container.js" />
diff --git a/src/components/status_action_buttons/buttons_definitions.js b/src/components/status_action_buttons/buttons_definitions.js
new file mode 100644
index 000000000..bc1e45a98
--- /dev/null
+++ b/src/components/status_action_buttons/buttons_definitions.js
@@ -0,0 +1,260 @@
+import { useEditStatusStore } from 'src/stores/editStatus.js'
+import { useReportsStore } from 'src/stores/reports.js'
+import { useStatusHistoryStore } from 'src/stores/statusHistory.js'
+
+const PRIVATE_SCOPES = new Set(['private', 'direct'])
+const PUBLIC_SCOPES = new Set(['public', 'unlisted'])
+export const BUTTONS = [{
+  // =========
+  // REPLY
+  // =========
+  name: 'reply',
+  label: 'tool_tip.reply',
+  icon: 'reply',
+  active: ({ replying }) => replying,
+  counter: ({ status }) => status.replies_count,
+  anon: true,
+  anonLink: true,
+  toggleable: true,
+  closeIndicator: 'times',
+  activeIndicator: 'none',
+  action ({ emit }) {
+    emit('toggleReplying')
+    return Promise.resolve()
+  }
+}, {
+  // =========
+  // REPEAT
+  // =========
+  name: 'retweet',
+  label: ({ status }) => status.repeated
+    ? 'tool_tip.unrepeat'
+    : 'tool_tip.repeat',
+  icon ({ status, currentUser }) {
+    if (currentUser.id !== status.user.id && PRIVATE_SCOPES.has(status.visibility)) {
+      return 'lock'
+    }
+    return 'retweet'
+  },
+  animated: true,
+  active: ({ status }) => status.repeated,
+  counter: ({ status }) => status.repeat_num,
+  anonLink: true,
+  interactive: ({ status, currentUser }) => !!currentUser && (currentUser.id === status.user.id || !PRIVATE_SCOPES.has(status.visibility)),
+  toggleable: true,
+  confirm: ({ status, getters }) => !status.repeated && getters.mergedConfig.modalOnRepeat,
+  confirmStrings: {
+    title: 'status.repeat_confirm_title',
+    body: 'status.repeat_confirm',
+    confirm: 'status.repeat_confirm_accept_button',
+    cancel: 'status.repeat_confirm_cancel_button'
+  },
+  action ({ status, dispatch }) {
+    if (!status.repeated) {
+      return dispatch('retweet', { id: status.id })
+    } else {
+      return dispatch('unretweet', { id: status.id })
+    }
+  }
+}, {
+  // =========
+  // FAVORITE
+  // =========
+  name: 'favorite',
+  label: ({ status }) => status.favorited
+    ? 'tool_tip.unfavorite'
+    : 'tool_tip.favorite',
+  icon: ({ status }) => status.favorited
+    ? ['fas', 'star']
+    : ['far', 'star'],
+  animated: true,
+  active: ({ status }) => status.favorited,
+  counter: ({ status }) => status.fave_num,
+  anonLink: true,
+  toggleable: true,
+  action ({ status, dispatch }) {
+    if (!status.favorited) {
+      return dispatch('favorite', { id: status.id })
+    } else {
+      return dispatch('unfavorite', { id: status.id })
+    }
+  }
+}, {
+  // =========
+  // EMOJI REACTIONS
+  // =========
+  name: 'emoji',
+  label: 'tool_tip.add_reaction',
+  icon: ['far', 'smile-beam'],
+  anonLink: true
+}, {
+  // =========
+  // MUTE
+  // =========
+  name: 'mute',
+  icon: 'eye-slash',
+  label: 'status.mute_ellipsis',
+  if: ({ loggedIn }) => loggedIn,
+  toggleable: true,
+  dropdown: true
+  // action ({ status, dispatch, emit }) {
+  // }
+}, {
+  // =========
+  // PIN STATUS
+  // =========
+  name: 'pin',
+  icon: 'thumbtack',
+  label: ({ status }) => status.pinned
+    ? 'status.unpin'
+    : 'status.pin',
+  if ({ status, loggedIn, currentUser }) {
+    return loggedIn &&
+      status.user.id === currentUser.id &&
+      PUBLIC_SCOPES.has(status.visibility)
+  },
+  action ({ status, dispatch }) {
+    if (status.pinned) {
+      return dispatch('unpinStatus', status.id)
+    } else {
+      return dispatch('pinStatus', status.id)
+    }
+  }
+}, {
+  // =========
+  // BOOKMARK
+  // =========
+  name: 'bookmark',
+  icon: ({ status }) => status.bookmarked
+    ? ['fas', 'bookmark']
+    : ['far', 'bookmark'],
+  toggleable: true,
+  active: ({ status }) => status.bookmarked,
+  label: ({ status }) => status.bookmarked
+    ? 'status.unbookmark'
+    : 'status.bookmark',
+  if: ({ loggedIn }) => loggedIn,
+  action ({ status, dispatch }) {
+    if (status.bookmarked) {
+      return dispatch('unbookmark', { id: status.id })
+    } else {
+      return dispatch('bookmark', { id: status.id })
+    }
+  }
+}, {
+  // =========
+  // EDIT HISTORY
+  // =========
+  name: 'editHistory',
+  icon: 'history',
+  label: 'status.status_history',
+  if ({ status, state }) {
+    return state.instance.editingAvailable &&
+      status.edited_at !== null
+  },
+  action ({ status }) {
+    const originalStatus = { ...status }
+    const stripFieldsList = [
+      'attachments',
+      'created_at',
+      'emojis',
+      'text',
+      'raw_html',
+      'nsfw',
+      'poll',
+      'summary',
+      'summary_raw_html'
+    ]
+    stripFieldsList.forEach(p => delete originalStatus[p])
+    useStatusHistoryStore().openStatusHistoryModal(originalStatus)
+    return Promise.resolve()
+  }
+}, {
+  // =========
+  // EDIT
+  // =========
+  name: 'edit',
+  icon: 'pen',
+  label: 'status.edit',
+  if ({ status, loggedIn, currentUser, state }) {
+    return loggedIn &&
+      state.instance.editingAvailable &&
+      status.user.id === currentUser.id
+  },
+  action ({ dispatch, status }) {
+    return dispatch('fetchStatusSource', { id: status.id })
+      .then(data => useEditStatusStore().openEditStatusModal({
+        statusId: status.id,
+        subject: data.spoiler_text,
+        statusText: data.text,
+        statusIsSensitive: status.nsfw,
+        statusPoll: status.poll,
+        statusFiles: [...status.attachments],
+        visibility: status.visibility,
+        statusContentType: data.content_type
+      }))
+  }
+}, {
+  // =========
+  // DELETE
+  // =========
+  name: 'delete',
+  icon: 'times',
+  label: 'status.delete',
+  if ({ status, loggedIn, currentUser }) {
+    return loggedIn && (
+      status.user.id === currentUser.id ||
+        currentUser.privileges.includes('messages_delete')
+    )
+  },
+  confirm: ({ getters }) => getters.mergedConfig.modalOnDelete,
+  confirmStrings: {
+    title: 'status.delete_confirm_title',
+    body: 'status.delete_confirm',
+    confirm: 'status.delete_confirm_accept_button',
+    cancel: 'status.delete_confirm_cancel_button'
+  },
+  action ({ dispatch, status }) {
+    return dispatch('deleteStatus', { id: status.id })
+  }
+}, {
+  // =========
+  // SHARE/COPY
+  // =========
+  name: 'share',
+  icon: 'share-alt',
+  label: 'status.copy_link',
+  action ({ state, status, router }) {
+    navigator.clipboard.writeText([
+      state.instance.server,
+      router.resolve({ name: 'conversation', params: { id: status.id } }).href
+    ].join(''))
+    return Promise.resolve()
+  }
+}, {
+  // =========
+  // EXTERNAL
+  // =========
+  name: 'external',
+  icon: 'external-link-alt',
+  label: 'status.external_source',
+  link: ({ status }) => status.external_url
+}, {
+  // =========
+  // REPORT
+  // =========
+  name: 'report',
+  icon: 'flag',
+  label: 'user_card.report',
+  if: ({ loggedIn }) => loggedIn,
+  action ({ status }) {
+    return useReportsStore().openUserReportingModal({ userId: status.user.id, statusIds: [status.id] })
+  }
+}].map(button => {
+  return Object.fromEntries(
+    Object.entries(button).map(([k, v]) => [
+      k,
+      (typeof v === 'function' || k === 'name') ? v : () => v
+    ])
+  )
+})
diff --git a/src/components/status_action_buttons/status_action_buttons.js b/src/components/status_action_buttons/status_action_buttons.js
new file mode 100644
index 000000000..6f84ce8b5
--- /dev/null
+++ b/src/components/status_action_buttons/status_action_buttons.js
@@ -0,0 +1,134 @@
+import { mapState } from 'pinia'
+
+import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
+import ActionButtonContainer from './action_button_container.vue'
+import Popover from 'src/components/popover/popover.vue'
+import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
+
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+
+import { BUTTONS } from './buttons_definitions.js'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faEllipsisH
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faEllipsisH
+)
+
+const StatusActionButtons = {
+  props: ['status', 'replying'],
+  emits: ['toggleReplying', 'interacted'],
+  data () {
+    return {
+      showPin: false,
+      showingConfirmDialog: false,
+      currentConfirmTitle: '',
+      currentConfirmOkText: '',
+      currentConfirmCancelText: '',
+      currentConfirmAction: () => {},
+      randomSeed: genRandomSeed()
+    }
+  },
+  components: {
+    Popover,
+    ConfirmModal,
+    ActionButtonContainer
+  },
+  computed: {
+    ...mapState(useServerSideStorageStore, {
+      pinnedItems: store => new Set(store.prefsStorage.collections.pinnedStatusActions)
+    }),
+    buttons () {
+      return BUTTONS.filter(x => x.if ? x.if(this.funcArg) : true)
+    },
+    quickButtons () {
+      return this.buttons.filter(x => this.pinnedItems.has(x.name))
+    },
+    extraButtons () {
+      return this.buttons.filter(x => !this.pinnedItems.has(x.name))
+    },
+    currentUser () {
+      return this.$store.state.users.currentUser
+    },
+    funcArg () {
+      return {
+        status: this.status,
+        replying: this.replying,
+        emit: this.$emit,
+        dispatch: this.$store.dispatch,
+        state: this.$store.state,
+        getters: this.$store.getters,
+        router: this.$router,
+        currentUser: this.currentUser,
+        loggedIn: !!this.currentUser
+      }
+    },
+    triggerAttrs () {
+      return {
+        title: this.$t('status.more_actions'),
+        'aria-controls': `popup-menu-${this.randomSeed}`,
+        'aria-haspopup': 'menu'
+      }
+    }
+  },
+  methods: {
+    doAction (button) {
+      if (button.confirm?.(this.funcArg)) {
+        // TODO move to action_button
+        this.currentConfirmTitle = this.$t(button.confirmStrings(this.funcArg).title)
+        this.currentConfirmOkText = this.$t(button.confirmStrings(this.funcArg).confirm)
+        this.currentConfirmCancelText = this.$t(button.confirmStrings(this.funcArg).cancel)
+        this.currentConfirmBody = this.$t(button.confirmStrings(this.funcArg).body)
+        this.currentConfirmAction = () => {
+          this.showingConfirmDialog = false
+          this.doActionReal(button)
+        }
+        this.showingConfirmDialog = true
+      } else {
+        this.doActionReal(button)
+      }
+    },
+    doActionReal (button) {
+      button.action(this.funcArg)
+        .then(() => this.$emit('onSuccess'))
+        .catch(err => this.$emit('onError', err.error.error))
+    },
+    onExtraClose () {
+      this.showPin = false
+    },
+    isPinned (button) {
+      return this.pinnedItems.has(button.name)
+    },
+    unpin (button) {
+      useServerSideStorageStore().removeCollectionPreference({ path: 'collections.pinnedStatusActions', value: button.name })
+      useServerSideStorageStore().pushServerSideStorage()
+    },
+    pin (button) {
+      useServerSideStorageStore().addCollectionPreference({ path: 'collections.pinnedStatusActions', value: button.name })
+      useServerSideStorageStore().pushServerSideStorage()
+    },
+    getComponent (button) {
+      if (!this.$store.state.users.currentUser && button.anonLink) {
+        return 'a'
+      } else if (button.action == null && button.link != null) {
+        return 'a'
+      } else {
+        return 'button'
+      }
+    },
+    getClass (button) {
+      return {
+        [button.name + '-button']: true,
+        disabled: button.interactive ? !button.interactive(this.funcArg) : false,
+        '-pin-edit': this.showPin,
+        '-dropdown': button.dropdown?.(),
+        '-active': button.active?.(this.funcArg)
+      }
+    }
+  }
+}
+
+export default StatusActionButtons
diff --git a/src/components/status_action_buttons/status_action_buttons.scss b/src/components/status_action_buttons/status_action_buttons.scss
new file mode 100644
index 000000000..23b86e5bd
--- /dev/null
+++ b/src/components/status_action_buttons/status_action_buttons.scss
@@ -0,0 +1,26 @@
+@use "../../mixins";
+
+.StatusActionButtons {
+  .quick-action-buttons {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(10%, 3em));
+    grid-auto-flow: row dense;
+    grid-auto-rows: 1fr;
+    grid-gap: 1.25em 1em;
+    margin-top: var(--status-margin);
+  }
+
+  .pin-action-button {
+    margin: -0.5em;
+    padding: 0.5em;
+  }
+}
+// popover
+.extra-action-buttons {
+  .extra-action {
+    margin: 0;
+    padding-top: 0;
+    padding-bottom: 0;
+    padding-right: 0;
+  }
+}
diff --git a/src/components/status_action_buttons/status_action_buttons.vue b/src/components/status_action_buttons/status_action_buttons.vue
new file mode 100644
index 000000000..40884425c
--- /dev/null
+++ b/src/components/status_action_buttons/status_action_buttons.vue
@@ -0,0 +1,133 @@
+<template>
+  <div class="StatusActionButtons">
+    <span class="quick-action-buttons">
+      <span
+        v-for="button in quickButtons"
+        :key="button.name"
+        class="quick-action"
+        :class="{ '-pin': showPin, '-toggle': button.dropdown?.() }"
+      >
+        <ActionButtonContainer
+          :class="{ '-pin': showPin }"
+          :button="button"
+          :status="status"
+          :extra="false"
+          :func-arg="funcArg"
+          :get-class="getClass"
+          :get-component="getComponent"
+          :close="() => {}"
+          :do-action="doAction"
+          @interacted="e => $emit('interacted')"
+        />
+        <button
+          v-if="showPin && currentUser"
+          type="button"
+          class="button-unstyled pin-action-button"
+          :title="$t('general.unpin')"
+          :aria-pressed="true"
+          @click.stop.prevent="unpin(button)"
+        >
+          <FAIcon
+            v-if="showPin && currentUser"
+            fixed-width
+            class="fa-scale-110"
+            icon="thumbtack"
+          />
+        </button>
+      </span>
+      <Popover
+        trigger="click"
+        :trigger-attrs="triggerAttrs"
+        :tabindex="0"
+        placement="top"
+        :offset="{ y: 5 }"
+        remove-padding
+        @close="onExtraClose"
+      >
+        <template #trigger>
+          <FAIcon
+            class="fa-scale-110 "
+            icon="ellipsis-h"
+          />
+        </template>
+        <template #content="{close, resize}">
+          <div
+            :id="`popup-menu-${randomSeed}`"
+            class="dropdown-menu extra-action-buttons"
+            role="menu"
+          >
+            <div
+              v-if="currentUser"
+              class="menu-item dropdown-item extra-action -icon"
+            >
+              <button
+                class="main-button"
+                role="menuitem"
+                :tabindex="0"
+                @click.stop="() => { resize(); showPin = !showPin }"
+              >
+                <FAIcon
+                  class="fa-scale-110"
+                  fixed-width
+                  icon="wrench"
+                /><span>{{ $t('nav.edit_pinned') }}</span>
+              </button>
+            </div>
+            <div
+              v-for="button in extraButtons"
+              :key="button.name"
+              class="menu-item dropdown-item extra-action -icon"
+              :disabled="getClass(button).disabled"
+              :class="{ disabled: getClass(button).disabled }"
+            >
+              <ActionButtonContainer
+                :button="button"
+                :status="status"
+                :extra="true"
+                :func-arg="funcArg"
+                :get-class="getClass"
+                :get-component="getComponent"
+                :outer-close="close"
+                :do-action="doAction"
+                @interacted="e => $emit('interacted')"
+              />
+              <button
+                v-if="showPin && currentUser"
+                type="button"
+                class="button-unstyled pin-action-button extra-button"
+                :title="$t('general.pin')"
+                :aria-pressed="false"
+                @click.stop.prevent="pin(button)"
+              >
+                <FAIcon
+                  v-if="showPin && currentUser"
+                  fixed-width
+                  class="fa-scale-110"
+                  transform="rotate-45"
+                  icon="thumbtack"
+                />
+              </button>
+            </div>
+          </div>
+        </template>
+      </Popover>
+    </span>
+
+    <teleport to="#modal">
+      <confirm-modal
+        v-if="showingConfirmDialog"
+        :title="currentConfirmTitle"
+        :confirm-text="currentConfirmOkText"
+        :cancel-text="currentConfirmCancelText"
+        @accepted="currentConfirmAction"
+        @cancelled="showingConfirmDialog = false"
+      >
+        {{ currentConfirmBody }}
+      </confirm-modal>
+    </teleport>
+  </div>
+</template>
+
+<script src="./status_action_buttons.js"></script>
+
+<style lang="scss" src="./status_action_buttons.scss"></style>
diff --git a/src/components/status_body/status_body.js b/src/components/status_body/status_body.js
index b8f6f9a0b..9a56060e8 100644
--- a/src/components/status_body/status_body.js
+++ b/src/components/status_body/status_body.js
@@ -18,10 +18,11 @@ library.add(
   faPollH
 )
 
-const StatusContent = {
-  name: 'StatusContent',
+const StatusBody = {
+  name: 'StatusBody',
   props: [
     'compact',
+    'collapse', // replaces newlines with spaces
     'status',
     'focused',
     'noHeading',
@@ -40,6 +41,7 @@ const StatusContent = {
       parseReadyDone: false
     }
   },
+  emits: ['parseReady'],
   computed: {
     localCollapseSubjectDefault () {
       return this.mergedConfig.collapseMessageWithSubject
@@ -72,12 +74,32 @@ const StatusContent = {
     hideTallStatus () {
       return this.mightHideBecauseTall && !this.showingTall
     },
+    shouldShowToggle () {
+      return this.mightHideBecauseSubject || this.mightHideBecauseTall
+    },
+    toggleButtonClasses () {
+      return {
+        'cw-status-hider': !this.showingMore && this.mightHideBecauseSubject,
+        'tall-status-hider': !this.showingMore && this.mightHideBecauseTall,
+        'status-unhider': this.showingMore,
+      }
+    },
+    toggleText () {
+      if (this.showingMore) {
+        return this.mightHideBecauseSubject ? this.$t('status.hide_content') : this.$t('general.show_less')
+      } else {
+        return this.mightHideBecauseSubject ? this.$t('status.show_content') : this.$t('general.show_more')
+      }
+    },
     showingMore () {
       return (this.mightHideBecauseTall && this.showingTall) || (this.mightHideBecauseSubject && this.expandingSubject)
     },
     attachmentTypes () {
       return this.status.attachments.map(file => fileType.fileType(file.mimetype))
     },
+    collapsedStatus () {
+      return this.status.raw_html.replace(/(\n|<br\s?\/?>)/g, ' ')
+    },
     ...mapGetters(['mergedConfig'])
   },
   components: {
@@ -128,4 +150,4 @@ const StatusContent = {
   }
 }
 
-export default StatusContent
+export default StatusBody
diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss
index 0a467b4f5..a8a7d662a 100644
--- a/src/components/status_body/status_body.scss
+++ b/src/components/status_body/status_body.scss
@@ -14,8 +14,7 @@
   & .summary {
     white-space: pre-wrap;
     overflow-wrap: break-word;
-    word-wrap: break-word;
-    word-break: break-word;
+    text-wrap: pretty;
     line-height: var(--post-line-height);
   }
 
@@ -54,27 +53,40 @@
   }
 
   .text-wrapper {
+    text-overflow: ellipsis;
+    overflow-wrap: break-word;
+    overflow: hidden;
     display: flex;
     flex-flow: column nowrap;
 
     &.-tall-status {
       position: relative;
-      height: 220px;
-      overflow-x: hidden;
-      overflow-y: hidden;
+      height: 16em;
       z-index: 1;
 
       .media-body {
         min-height: 0;
         mask:
-          linear-gradient(to top, white, transparent) bottom/100% 70px no-repeat,
+          linear-gradient(to top, white, transparent) bottom/100% 8em no-repeat,
           linear-gradient(to top, white, white);
 
         /* Autoprefixed seem to ignore this one, and also syntax is different */
+        /* stylelint-disable mask-composite */
+        /* stylelint-disable declaration-property-value-no-unknown */
+        /* stylelint-disable scss/declaration-property-value-no-unknown */
+
+        /* TODO check if this is still needed */
         mask-composite: xor;
+        /* stylelint-enable scss/declaration-property-value-no-unknown */
+        /* stylelint-enable declaration-property-value-no-unknown */
+        /* stylelint-enable mask-composite */
         mask-composite: exclude;
       }
     }
+
+    &.-expanded {
+      overflow: visible;
+    }
   }
 
   & .tall-status-hider,
@@ -82,16 +94,24 @@
   & .status-unhider,
   & .cw-status-hider {
     display: inline-block;
-    word-break: break-all;
+    overflow-wrap: break-word;
+    text-wrap: pretty;
     width: 100%;
     text-align: center;
   }
 
+  .status-unhider {
+    margin-top: auto;
+    position: sticky;
+    bottom: 0;
+    padding-bottom: 1em;
+  }
+
   .tall-status-hider {
     position: absolute;
-    height: 70px;
-    margin-top: 150px;
-    line-height: 110px;
+    height: 5em;
+    margin-top: 10em;
+    line-height: 8em;
     z-index: 2;
   }
 
@@ -102,18 +122,23 @@
 
   & .status-unhider,
   & .cw-status-hider {
-    word-break: break-all;
+    overflow-wrap: break-word;
+    text-wrap: pretty;
 
     svg {
       color: inherit;
     }
   }
 
+  .toggle-button {
+    padding: 0.5em;
+  }
+
   &.-compact {
-    align-items: top;
+    align-items: start;
     flex-direction: row;
 
-    --emoji-size: 16px;
+    --emoji-size: calc(var(--emojiSize, 32px) / 2);
 
     & .body,
     & .attachments {
@@ -131,7 +156,15 @@
       mask-image: linear-gradient(to bottom, white 2em, transparent 3em);
 
       /* Autoprefixed seem to ignore this one, and also syntax is different */
+      /* stylelint-disable mask-composite */
+      /* stylelint-disable declaration-property-value-no-unknown */
+      /* stylelint-disable scss/declaration-property-value-no-unknown */
+
+      /* TODO check if this is still needed */
       mask-composite: xor;
+      /* stylelint-enable scss/declaration-property-value-no-unknown */
+      /* stylelint-enable declaration-property-value-no-unknown */
+      /* stylelint-enable mask-composite */
       mask-composite: exclude;
     }
 
@@ -151,11 +184,11 @@
       line-height: inherit;
       margin: 0;
       border: none;
-      display: inline-block;
     }
 
     .text-wrapper {
       display: inline-block;
+      width: 100%;
     }
   }
 }
diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue
index f21bcc80e..677781d97 100644
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@@ -14,6 +14,7 @@
           :faint="compact"
           :html="status.summary_raw_html"
           :emoji="status.emojis"
+          :is-local="status.isLocal"
         />
         <button
           v-show="longSubject && showingLongSubject"
@@ -31,68 +32,36 @@
         </button>
       </div>
       <div
-        :class="{'-tall-status': hideTallStatus}"
         class="text-wrapper"
+        :class="{'-tall-status': hideTallStatus, '-expanded': showingMore}"
       >
-        <button
-          v-show="hideTallStatus"
-          class="button-unstyled -link tall-status-hider"
-          :class="{ '-focused': focused }"
-          @click.prevent="toggleShowMore"
-        >
-          {{ $t("general.show_more") }}
-        </button>
         <RichContent
           v-if="!hideSubjectStatus && !(singleLine && status.summary_raw_html)"
           :class="{ '-single-line': singleLine }"
           class="text media-body"
           :html="status.raw_html"
+          :collapse="collapse"
           :emoji="status.emojis"
           :handle-links="true"
           :faint="compact"
           :greentext="mergedConfig.greentext"
           :attentions="status.attentions"
-          @parseReady="onParseReady"
+          :is-local="status.is_local"
+          @parse-ready="onParseReady"
         />
-
-        <button
-          v-show="hideSubjectStatus"
-          class="button-unstyled -link cw-status-hider"
-          @click.prevent="toggleShowMore"
+        <div
+          v-show="shouldShowToggle"
+          :class="toggleButtonClasses"
         >
-          {{ $t("status.show_content") }}
-          <FAIcon
-            v-if="attachmentTypes.includes('image')"
-            icon="image"
-          />
-          <FAIcon
-            v-if="attachmentTypes.includes('video')"
-            icon="video"
-          />
-          <FAIcon
-            v-if="attachmentTypes.includes('audio')"
-            icon="music"
-          />
-          <FAIcon
-            v-if="attachmentTypes.includes('unknown')"
-            icon="file"
-          />
-          <FAIcon
-            v-if="status.poll && status.poll.options"
-            icon="poll-h"
-          />
-          <FAIcon
-            v-if="status.card"
-            icon="link"
-          />
-        </button>
-        <button
-          v-show="showingMore && !fullContent"
-          class="button-unstyled -link status-unhider"
-          @click.prevent="toggleShowMore"
-        >
-          {{ tallStatus ? $t("general.show_less") : $t("status.hide_content") }}
-        </button>
+          <button
+            class="btn button-default toggle-button"
+            :class="{ '-focused': focused }"
+            :aria-expanded="showingMore"
+            @click.prevent="toggleShowMore"
+          >
+            {{ toggleText }}
+          </button>
+        </div>
       </div>
     </div>
     <slot v-if="!hideSubjectStatus" />
diff --git a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js
index 50bcb0ca3..72d4f6fda 100644
--- a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js
+++ b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js
@@ -1,24 +1,28 @@
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronRight, faFolder } from '@fortawesome/free-solid-svg-icons'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
 
-import Popover from '../popover/popover.vue'
+import Popover from 'src/components/popover/popover.vue'
+import StillImage from 'src/components/still-image/still-image.vue'
 
 library.add(faChevronRight, faFolder)
 
 const StatusBookmarkFolderMenu = {
   props: [
-    'status'
+    'status',
+    'close'
   ],
   data () {
     return {}
   },
   components: {
-    Popover
+    Popover,
+    StillImage
   },
   computed: {
-    ...mapState({
-      folders: state => state.bookmarkFolders.allFolders
+    ...mapState(useBookmarkFoldersStore, {
+      folders: store => store.allFolders
     }),
     folderId () {
       return this.status.bookmark_folder_id
diff --git a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.scss b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.scss
new file mode 100644
index 000000000..f450e9cd1
--- /dev/null
+++ b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.scss
@@ -0,0 +1,9 @@
+.bookmark-folder-menu {
+  --__horizontal-gap: 0.5em;
+  --_still-image-label-visibility: hidden;
+
+  .emoji {
+    width: var(--__line-height);
+    height: var(--__line-height);
+  }
+}
diff --git a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue
index 70baa60d8..006edbb80 100644
--- a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue
+++ b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.vue
@@ -1,40 +1,35 @@
 <template>
-  <div class="StatusBookmarkFolderMenu">
-    <Popover
-      trigger="hover"
-      placement="left"
-      remove-padding
+  <div class="dropdown-menu bookmark-folder-menu">
+    <div
+      v-for="folder in folders"
+      :key="folder.id"
+      class="menu-item dropdown-item -icon-double"
     >
-      <template #content>
-        <div class="dropdown-menu">
-          <button
-            v-for="folder in folders"
-            :key="folder.id"
-            class="menu-item dropdown-item"
-            @click="toggleFolder(folder.id)"
-          >
-            <span
-              class="input menu-checkbox -radio"
-              :class="{ 'menu-checkbox-checked': status.bookmark_folder_id == folder.id }"
-            />
-            {{ folder.name }}
-          </button>
-        </div>
-      </template>
-      <template #trigger>
-        <button class="menu-item dropdown-item dropdown-item-icon -has-submenu">
-          <FAIcon
-            fixed-width
-            icon="folder"
-          />{{ $t('bookmark_folders.select_folder') }}<FAIcon
-            class="chevron-icon"
-            size="lg"
-            icon="chevron-right"
-          />
-        </button>
-      </template>
-    </Popover>
+      <button
+        class="main-button"
+        @click="toggleFolder(folder.id)"
+        @click.stop="close"
+      >
+        <span
+          class="input menu-checkbox -radio"
+          :class="{ 'menu-checkbox-checked': status.bookmark_folder_id == folder.id }"
+        />
+        <StillImage
+          v-if="folder.emoji_url"
+          :src="folder.emoji_url"
+          class="emoji"
+        />
+        <span
+          v-else
+          class="iconLetter fa-scale-110 fa-old-padding"
+        >
+          {{ folder.name[0] }}
+        </span>
+        {{ ' ' + folder.name }}
+      </button>
+    </div>
   </div>
 </template>
 
 <script src="./status_bookmark_folder_menu.js"></script>
+<style src="./status_bookmark_folder_menu.scss" />
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index 8d8a91dc5..364123f49 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -13,6 +13,7 @@ import {
   faLink,
   faPollH
 } from '@fortawesome/free-solid-svg-icons'
+import { useMediaViewerStore } from 'src/stores/media_viewer'
 
 library.add(
   faCircleNotch,
@@ -52,6 +53,7 @@ const StatusContent = {
   props: [
     'status',
     'compact',
+    'collapse',
     'focused',
     'noHeading',
     'fullContent',
@@ -63,6 +65,7 @@ const StatusContent = {
     'controlledShowingLongSubject',
     'controlledToggleShowingLongSubject'
   ],
+  emits: ['parseReady', 'mediaplay', 'mediapause'],
   data () {
     return {
       uncontrolledShowingTall: this.fullContent || (this.inConversation && this.focused),
@@ -90,6 +93,9 @@ const StatusContent = {
       }
       return true
     },
+    localCollapseSubjectDefault () {
+      return this.mergedConfig.collapseMessageWithSubject
+    },
     attachmentSize () {
       if (this.compact) {
         return 'small'
@@ -127,7 +133,7 @@ const StatusContent = {
     },
     setMedia () {
       const attachments = this.attachmentSize === 'hide' ? this.status.attachments : this.galleryAttachments
-      return () => this.$store.dispatch('setMedia', attachments)
+      return () => useMediaViewerStore().setMedia(attachments)
     }
   }
 }
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index e977d489e..460a0714b 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -14,7 +14,8 @@
       :toggle-showing-tall="toggleShowingTall"
       :toggle-expanding-subject="toggleExpandingSubject"
       :toggle-showing-long-subject="toggleShowingLongSubject"
-      @parseReady="$emit('parseReady', $event)"
+      :collapse="collapse"
+      @parse-ready="$emit('parseReady', $event)"
     >
       <div v-if="status.poll && status.poll.options && !compact">
         <Poll
@@ -23,7 +24,10 @@
         />
       </div>
 
-      <div v-else-if="status.poll && status.poll.options && compact">
+      <div
+        v-else-if="status.poll && status.poll.options && compact"
+        class="poll-icon"
+      >
         <FAIcon
           icon="poll-h"
           size="2x"
@@ -62,5 +66,9 @@
 .StatusContent {
   flex: 1;
   min-width: 0;
+
+  .poll-icon {
+    margin: 0.5em;
+  }
 }
 </style>
diff --git a/src/components/status_history_modal/status_history_modal.js b/src/components/status_history_modal/status_history_modal.js
index 3941a56f8..215f8152e 100644
--- a/src/components/status_history_modal/status_history_modal.js
+++ b/src/components/status_history_modal/status_history_modal.js
@@ -1,6 +1,7 @@
 import { get } from 'lodash'
 import Modal from '../modal/modal.vue'
 import Status from '../status/status.vue'
+import { useStatusHistoryStore } from 'src/stores/statusHistory'
 
 const StatusHistoryModal = {
   components: {
@@ -14,10 +15,10 @@ const StatusHistoryModal = {
   },
   computed: {
     modalActivated () {
-      return this.$store.state.statusHistory.modalActivated
+      return useStatusHistoryStore().modalActivated
     },
     params () {
-      return this.$store.state.statusHistory.params
+      return useStatusHistoryStore().params
     },
     statusId () {
       return this.params.id
@@ -52,7 +53,7 @@ const StatusHistoryModal = {
         })
     },
     closeModal () {
-      this.$store.dispatch('closeStatusHistoryModal')
+      useStatusHistoryStore().closeStatusHistoryModal()
     }
   }
 }
diff --git a/src/components/status_history_modal/status_history_modal.vue b/src/components/status_history_modal/status_history_modal.vue
index 79642e9c8..282878b52 100644
--- a/src/components/status_history_modal/status_history_modal.vue
+++ b/src/components/status_history_modal/status_history_modal.vue
@@ -2,11 +2,13 @@
   <Modal
     v-if="modalActivated"
     class="status-history-modal-view"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
   >
     <div class="status-history-modal-panel panel">
       <div class="panel-heading">
-        {{ $t('status.status_history') }} ({{ historyCount }})
+        <h1 class="title">
+          {{ $t('status.status_history') }} ({{ historyCount }})
+        </h1>
       </div>
       <div class="panel-body">
         <div
diff --git a/src/components/status_popover/status_popover.js b/src/components/status_popover/status_popover.js
index c55bd85bc..2615208d2 100644
--- a/src/components/status_popover/status_popover.js
+++ b/src/components/status_popover/status_popover.js
@@ -34,8 +34,8 @@ const StatusPopover = {
           return
         }
         this.$store.dispatch('fetchStatus', this.statusId)
-          .then(data => (this.error = false))
-          .catch(e => (this.error = true))
+          .then(() => (this.error = false))
+          .catch(() => (this.error = true))
       }
     }
   },
diff --git a/src/components/still-image/still-image-emoji-popover.vue b/src/components/still-image/still-image-emoji-popover.vue
new file mode 100644
index 000000000..8317c6a0c
--- /dev/null
+++ b/src/components/still-image/still-image-emoji-popover.vue
@@ -0,0 +1,189 @@
+<template>
+  <Popover
+    ref="emojiPopover"
+    trigger="click"
+    placement="top"
+    :bound-to="{ x: 'container' }"
+    :offset="{ y: 10 }"
+    @show="fetchEmojiPacksIfAdmin"
+  >
+    <template #trigger>
+      <StillImage v-bind="$attrs" />
+    </template>
+    <template #content>
+      <div class="emoji-popover">
+        <h3>{{ $attrs.title }}</h3>
+
+        <div class="emoji-popover-centered">
+          <StillImage
+            class="emoji"
+            v-bind="$attrs"
+          />
+        </div>
+
+        <div v-if="isUserAdmin && !isLocal">
+          <button
+            class="button button-default btn emoji-popover-button"
+            type="button"
+            :disabled="packName == ''"
+            @click="copyToLocalPack"
+          >
+            {{ $t('admin_dash.emoji.copy_to_pack') }}
+          </button>
+
+          <SelectComponent
+            v-model="packName"
+          >
+            <option
+              value=""
+              disabled
+              hidden
+            >
+              {{ $t('admin_dash.emoji.emoji_pack') }}
+            </option>
+            <option
+              v-for="(pack, listPackName) in knownLocalPacks"
+              :key="listPackName"
+              :label="listPackName"
+            >
+              {{ listPackName }}
+            </option>
+          </SelectComponent>
+        </div>
+      </div>
+    </template>
+  </Popover>
+</template>
+
+<script>
+  import { assign } from 'lodash'
+
+  import StillImage from './still-image.vue'
+  import Popover from 'components/popover/popover.vue'
+  import SelectComponent from 'components/select/select.vue'
+  import { useInterfaceStore } from 'src/stores/interface'
+
+  export default {
+    components: { StillImage, Popover, SelectComponent },
+    props: {
+      shortcode: {
+        type: String,
+        required: true
+      },
+      isLocal: {
+        type: Boolean,
+        required: true
+      }
+    },
+    data() {
+      return {
+        knownLocalPacks: { },
+        packName: ""
+      }
+    },
+    computed: {
+      isUserAdmin () {
+        return this.$store.state.users.currentUser.rights.admin
+      }
+    },
+    methods: {
+      displayError (msg) {
+        useInterfaceStore().pushGlobalNotice({
+          messageKey: 'admin_dash.emoji.error',
+          messageArgs: [msg],
+          level: 'error'
+        })
+      },
+      copyToLocalPack() {
+        this.$store.state.api.backendInteractor.addNewEmojiFile({
+          packName: this.packName,
+          file: this.$attrs.src,
+          shortcode: this.shortcode,
+          filename: ""
+        }).then(resp => resp.json()).then(resp => {
+          if (resp.error !== undefined) {
+            this.displayError(resp.error)
+            return
+          }
+          useInterfaceStore().pushGlobalNotice({
+            messageKey: 'admin_dash.emoji.copied_successfully',
+            messageArgs: [this.shortcode, this.packName],
+            level: 'success'
+          })
+
+          this.$refs.emojiPopover.hidePopover()
+          this.packName = ''
+        })
+      },
+
+      // Copied from emoji_tab.js
+      loadPacksPaginated (listFunction) {
+        const pageSize = 25
+        const allPacks = {}
+
+        return listFunction({ instance: this.$store.state.instance.server, page: 1, pageSize: 0 })
+          .then(data => data.json())
+          .then(data => {
+            if (data.error !== undefined) { return Promise.reject(data.error) }
+
+            let resultingPromise = Promise.resolve({})
+            for (let i = 0; i < Math.ceil(data.count / pageSize); i++) {
+              resultingPromise = resultingPromise.then(() => listFunction({ instance: this.$store.state.instance.server, page: i, pageSize })
+              ).then(data => data.json()).then(pageData => {
+                if (pageData.error !== undefined) { return Promise.reject(pageData.error) }
+
+                assign(allPacks, pageData.packs)
+              })
+            }
+
+            return resultingPromise
+          })
+          .then(() => allPacks)
+          .catch(data => {
+            this.displayError(data)
+          })
+      },
+      fetchEmojiPacksIfAdmin() {
+        if (!this.isUserAdmin) return
+
+        this.loadPacksPaginated(this.$store.state.api.backendInteractor.listEmojiPacks)
+            .then(allPacks => {
+              // Sort by key
+              const sorted = Object.keys(allPacks).sort().reduce((acc, key) => {
+                if (key.length === 0) return acc
+                acc[key] = allPacks[key]
+                return acc
+              }, {})
+              this.knownLocalPacks = sorted
+            })
+      }
+    }
+  }
+</script>
+
+<style>
+  .emoji-popover {
+    margin: 0 0.5em 0.5em;
+    text-align: center;
+
+    .emoji {
+      width: 4.6em;
+      height: 4.6em;
+    }
+
+    .emoji-popover-centered {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .emoji-popover-button {
+      width: 100%;
+      margin-top: 0.5em;
+    }
+
+    .Select {
+      width: 100%;
+    }
+  }
+</style>
diff --git a/src/components/still-image/still-image.vue b/src/components/still-image/still-image.vue
index 57633827e..4459ebd44 100644
--- a/src/components/still-image/still-image.vue
+++ b/src/components/still-image/still-image.vue
@@ -37,10 +37,7 @@
 
   canvas {
     position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
+    inset: 0;
     width: 100%;
     height: 100%;
     object-fit: contain;
diff --git a/src/components/tab_switcher/tab.style.js b/src/components/tab_switcher/tab.style.js
index eac8aaeb5..0cf90993e 100644
--- a/src/components/tab_switcher/tab.style.js
+++ b/src/components/tab_switcher/tab.style.js
@@ -3,7 +3,7 @@ export default {
   selector: '.tab', // CSS selector/prefix
   states: {
     active: '.active',
-    hover: ':hover:not(.disabled)',
+    hover: ':is(:hover, :focus-visible, :has(:focus-visible)):not(.disabled)',
     disabled: '.disabled'
   },
   validInnerComponents: [
@@ -14,14 +14,14 @@ export default {
     {
       directives: {
         background: '--fg',
-        shadow: ['--defaultButtonShadow', '--defaultButtonBevel'],
+        shadow: ['--buttonDefaultShadow', '--buttonDefaultBevel'],
         roundness: 3
       }
     },
     {
       state: ['hover'],
       directives: {
-        shadow: ['--defaultButtonHoverGlow', '--defaultButtonBevel']
+        shadow: ['--buttonDefaultHoverGlow', '--buttonDefaultBevel']
       }
     },
     {
@@ -33,14 +33,14 @@ export default {
     {
       state: ['hover', 'active'],
       directives: {
-        shadow: ['--defaultButtonShadow', '--defaultButtonBevel']
+        shadow: ['--buttonDefaultShadow', '--buttonDefaultBevel']
       }
     },
     {
       state: ['disabled'],
       directives: {
-        background: '$blend(--inheritedBackground, 0.25, --parent)',
-        shadow: ['--defaultButtonBevel']
+        background: '$blend(--inheritedBackground 0.25 --parent)',
+        shadow: ['--buttonDefaultBevel']
       }
     },
     {
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index 027a380a2..af3008459 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -1,9 +1,10 @@
 // eslint-disable-next-line no-unused
 import { h, Fragment } from 'vue'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
 
 import './tab_switcher.scss'
+import { useInterfaceStore } from 'src/stores/interface'
 
 const findFirstUsable = (slots) => slots.findIndex(_ => _.props)
 
@@ -30,11 +31,6 @@ export default {
       type: Boolean,
       default: false
     },
-    sideTabBar: {
-      required: false,
-      type: Boolean,
-      default: false
-    },
     bodyScrollLock: {
       required: false,
       type: Boolean,
@@ -142,38 +138,45 @@ export default {
       if (!props) return
       const active = this.activeIndex === index
       const classes = [ active ? 'active' : 'hidden' ]
-      if (props.fullHeight) {
-        classes.push('full-height')
+      if (props.fullHeight || props['full-height']) {
+        classes.push('-full-height')
       }
-      const renderSlot = (!this.renderOnlyFocused || active)
+      if (props.fullWidth || props['full-width']) {
+        classes.push('-full-width')
+      }
+      let delayRender = slot.props['delay-render']
+      if (delayRender && active) {
+        slot.props['delay-render'] = false
+        delayRender = false
+      }
+      const renderSlot = (!delayRender && (!this.renderOnlyFocused || active))
         ? slot
         : ''
 
       return (
         <div class={classes}>
-          {
-            this.sideTabBar
-              ? <h1 class="mobile-label">{props.label}</h1>
-              : ''
-          }
           {renderSlot}
         </div>
       )
     })
 
     return (
-      <div class={'tab-switcher ' + (this.sideTabBar ? 'side-tabs' : 'top-tabs')}>
+      <div
+        class="tab-switcher top-tabs"
+        ref="root"
+      >
         <div
           class="tabs"
           role="tablist"
+          ref="nav"
         >
           {tabs}
         </div>
         <div
-          ref="contents"
           role="tabpanel"
           class={'contents' + (this.scrollableTabs ? ' scrollable-tabs' : '')}
           v-body-scroll-lock={this.bodyScrollLock}
+          ref="content"
         >
           {contents}
         </div>
diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss
index 4e242b91b..f788ea30e 100644
--- a/src/components/tab_switcher/tab_switcher.scss
+++ b/src/components/tab_switcher/tab_switcher.scss
@@ -12,8 +12,7 @@
 
     > .tabs {
       width: 100%;
-      overflow-y: hidden;
-      overflow-x: auto;
+      overflow: auto hidden;
       padding-top: 5px;
       flex-direction: row;
       flex: 0 0 auto;
@@ -44,7 +43,7 @@
         border-bottom-left-radius: 0;
         border-bottom-right-radius: 0;
         padding-bottom: 99px;
-        margin-bottom: 6px - 99px;
+        margin-bottom: calc(6px - 99px);
       }
     }
 
@@ -53,95 +52,6 @@
     }
   }
 
-  &.side-tabs {
-    flex-direction: row;
-
-    @media all and (max-width: 800px) {
-      overflow-x: auto;
-    }
-
-    > .contents {
-      flex: 1 1 auto;
-    }
-
-    > .tabs {
-      flex: 0 0 auto;
-      overflow-y: auto;
-      overflow-x: hidden;
-      flex-direction: column;
-
-      &::after,
-      &::before {
-        flex-shrink: 0;
-        flex-basis: 0.5em;
-        content: "";
-        border-right: 1px solid;
-        border-right-color: var(--border);
-      }
-
-      &::after {
-        flex-grow: 1;
-      }
-
-      &::before {
-        flex-grow: 0;
-      }
-
-      .tab-wrapper {
-        min-width: 10em;
-        display: flex;
-        flex-direction: column;
-
-        @media all and (max-width: 800px) {
-          min-width: 4em;
-        }
-
-        &:not(.active)::after {
-          top: 0;
-          right: 0;
-          bottom: 0;
-          border-right: 1px solid;
-          border-right-color: var(--border);
-        }
-
-        &::before {
-          flex: 0 0 6px;
-          content: "";
-          border-right: 1px solid;
-          border-right-color: var(--border);
-        }
-
-        &:last-child .tab {
-          margin-bottom: 0;
-        }
-      }
-
-      .tab {
-        flex: 1;
-        box-sizing: content-box;
-        min-width: 10em;
-        min-width: 1px;
-        border-top-right-radius: 0;
-        border-bottom-right-radius: 0;
-        padding-left: 1em;
-        padding-right: calc(1em + 200px);
-        margin-right: -200px;
-        margin-left: 1em;
-
-        @media all and (max-width: 800px) {
-          padding-left: 0.25em;
-          padding-right: calc(0.25em + 200px);
-          margin-right: calc(0.25em - 200px);
-          margin-left: 0.25em;
-
-          .text {
-            display: none;
-          }
-        }
-      }
-    }
-  }
-
   .contents {
     flex: 1 0 auto;
     min-height: 0;
@@ -150,7 +60,7 @@
       display: none;
     }
 
-    .full-height:not(.hidden) {
+    .-full-height:not(.hidden) {
       height: 100%;
       display: flex;
       flex-direction: column;
@@ -160,6 +70,15 @@
       }
     }
 
+    .-full-width:not(.hidden) {
+      display: flex;
+      flex-direction: column;
+
+      > *:not(.mobile-label) {
+        width: auto;
+      }
+    }
+
     &.scrollable-tabs {
       overflow-y: auto;
     }
@@ -181,6 +100,7 @@
 
     &:not(.active) {
       z-index: 4;
+      margin-top: 0.25em;
 
       &:hover {
         z-index: 6;
@@ -193,9 +113,9 @@
     }
 
     img {
-      max-height: 26px;
+      max-height: 1.9em;
       vertical-align: top;
-      margin-top: -5px;
+      margin-top: -0.3em;
     }
   }
 
@@ -233,7 +153,7 @@
     margin-bottom: 0.25em;
     border-bottom: 1px solid var(--border);
 
-    @media all and (min-width: 800px) {
+    @media all and (width >= 800px) {
       display: none;
     }
   }
diff --git a/src/components/terms_of_service_panel/terms_of_service_panel.js b/src/components/terms_of_service_panel/terms_of_service_panel.js
index 4276f8f77..b2dc827bf 100644
--- a/src/components/terms_of_service_panel/terms_of_service_panel.js
+++ b/src/components/terms_of_service_panel/terms_of_service_panel.js
@@ -2,6 +2,9 @@ const TermsOfServicePanel = {
   computed: {
     content () {
       return this.$store.state.instance.tos
+    },
+    embedded () {
+      return this.$store.state.instance.embeddedToS
     }
   }
 }
diff --git a/src/components/terms_of_service_panel/terms_of_service_panel.vue b/src/components/terms_of_service_panel/terms_of_service_panel.vue
index bff0ae74c..aab27aad6 100644
--- a/src/components/terms_of_service_panel/terms_of_service_panel.vue
+++ b/src/components/terms_of_service_panel/terms_of_service_panel.vue
@@ -1,13 +1,21 @@
 <template>
-  <div>
+  <div class="terms-of-service-panel">
     <div class="panel panel-default">
+      <div
+        v-if="!embedded"
+        class="panel-heading -sticky"
+      >
+        <div class="title">
+          {{ $t("about.terms") }}
+        </div>
+      </div>
       <div class="panel-body">
         <!-- eslint-disable vue/no-v-html -->
         <div
           class="tos-content"
           v-html="content"
         />
-      <!-- eslint-enable vue/no-v-html -->
+        <!-- eslint-enable vue/no-v-html -->
       </div>
     </div>
   </div>
@@ -19,4 +27,5 @@
 .tos-content {
   margin: 1em;
 }
+
 </style>
diff --git a/src/components/thread_tree/thread_tree.js b/src/components/thread_tree/thread_tree.js
index 71e637254..2afe4e571 100644
--- a/src/components/thread_tree/thread_tree.js
+++ b/src/components/thread_tree/thread_tree.js
@@ -26,7 +26,7 @@ const ThreadTree = {
     pinnedStatusIdsObject: Object,
     profileUserId: String,
 
-    focused: Function,
+    isFocusedFunction: Function,
     highlight: String,
     getReplies: Function,
     setHighlight: Function,
@@ -81,7 +81,7 @@ const ThreadTree = {
     toggleCurrentProp (name) {
       this.toggleStatusContentProperty(this.status.id, name)
     },
-    setCurrentProp (name, newVal) {
+    setCurrentProp (name) {
       this.setStatusContentProperty(this.status.id, name)
     }
   }
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index 971b7001e..4ffe463fe 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -7,7 +7,7 @@
       :statusoid="status"
       :expandable="!isExpanded"
       :show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
-      :focused="focused(status.id)"
+      :focused="isFocusedFunction(status.id)"
       :in-conversation="isExpanded"
       :highlight="highlight"
       :replies="getReplies(status.id)"
@@ -32,7 +32,7 @@
       :dive="dive ? () => dive(status.id) : undefined"
 
       @goto="setHighlight"
-      @toggleExpanded="toggleExpanded"
+      @toggle-expanded="toggleExpanded"
     />
     <div
       v-if="currentReplies.length && threadShowing"
@@ -52,7 +52,7 @@
         :pinned-status-ids-object="pinnedStatusIdsObject"
         :profile-user-id="profileUserId"
 
-        :focused="focused"
+        :is-focused-function="isFocusedFunction"
         :get-replies="getReplies"
         :highlight="highlight"
         :set-highlight="setHighlight"
@@ -89,7 +89,7 @@
         </template>
         <template #text>
           <span>
-            {{ $tc('status.thread_follow', totalReplyCount[status.id], { numStatus: totalReplyCount[status.id] }) }}
+            {{ $t('status.thread_follow', { numStatus: totalReplyCount[status.id] }, totalReplyCount[status.id]) }}
           </span>
         </template>
       </i18n-t>
@@ -108,7 +108,7 @@
         </template>
         <template #text>
           <span>
-            {{ $tc('status.thread_show_full', totalReplyCount[status.id], { numStatus: totalReplyCount[status.id], depth: totalReplyDepth[status.id] }) }}
+            {{ $t('status.thread_show_full', { numStatus: totalReplyCount[status.id], depth: totalReplyDepth[status.id] }, totalReplyCount[status.id]) }}
           </span>
         </template>
       </i18n-t>
diff --git a/src/components/timeago/timeago.vue b/src/components/timeago/timeago.vue
index bf9184419..bc779e801 100644
--- a/src/components/timeago/timeago.vue
+++ b/src/components/timeago/timeago.vue
@@ -28,6 +28,9 @@ export default {
       }
       return DateUtils.durationStrToMs(this.$store.getters.mergedConfig.absoluteTimeFormatMinAge) <= this.relativeTimeMs
     },
+    time12hFormat () {
+      return this.$store.getters.mergedConfig.absoluteTimeFormat12h === '12h'
+    },
     browserLocale () {
       return localeService.internalToBrowserLocale(this.$i18n.locale)
     },
@@ -40,7 +43,7 @@ export default {
       return this.timeAsDate.toLocaleString(this.browserLocale)
     },
     relativeTimeString () {
-      const timeString = this.$i18n.tc(this.relativeTime.key, this.relativeTime.num, [this.relativeTime.num])
+      const timeString = this.$i18n.t(this.relativeTime.key, [this.relativeTime.num], this.relativeTime.num)
 
       if (typeof this.templateKey === 'string' && this.relativeTime.key !== 'time.now') {
         return this.$i18n.t(this.templateKey, [timeString])
@@ -57,22 +60,26 @@ export default {
         if (DateUtils.isSameDay(this.timeAsDate, now)) {
           return new Intl.DateTimeFormat(this.browserLocale, {
             minute: 'numeric',
-            hour: 'numeric'
+            hour: 'numeric',
+            hour12: this.time12hFormat
           })
         } else if (DateUtils.isSameMonth(this.timeAsDate, now)) {
           return new Intl.DateTimeFormat(this.browserLocale, {
-            hour: 'numeric',
-            day: 'numeric'
+            month: 'short',
+            day: 'numeric',
+            hour12: this.time12hFormat
           })
         } else if (DateUtils.isSameYear(this.timeAsDate, now)) {
           return new Intl.DateTimeFormat(this.browserLocale, {
             month: 'short',
-            day: 'numeric'
+            day: 'numeric',
+            hour12: this.time12hFormat
           })
         } else {
           return new Intl.DateTimeFormat(this.browserLocale, {
             year: 'numeric',
-            month: 'short'
+            month: 'short',
+            hour12: this.time12hFormat
           })
         }
       })()
diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index 9cde9b04c..61cc8affd 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -1,13 +1,15 @@
 import Status from '../status/status.vue'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 import timelineFetcher from '../../services/timeline_fetcher/timeline_fetcher.service.js'
 import Conversation from '../conversation/conversation.vue'
 import TimelineMenu from '../timeline_menu/timeline_menu.vue'
 import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
 import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
+import ScrollTopButton from '../scroll_top_button/scroll_top_button.vue'
 import { debounce, throttle, keyBy } from 'lodash'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch, faCirclePlus, faCog, faMinus, faArrowUp, faCheck } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
 
 library.add(
   faCircleNotch,
@@ -46,6 +48,7 @@ const Timeline = {
   },
   components: {
     Status,
+    ScrollTopButton,
     Conversation,
     TimelineMenu,
     QuickFilterSettings,
@@ -103,8 +106,8 @@ const Timeline = {
     virtualScrollingEnabled () {
       return this.$store.getters.mergedConfig.virtualScrolling
     },
-    ...mapState({
-      mobileLayout: state => state.interface.layoutType === 'mobile'
+    ...mapState(useInterfaceStore, {
+      mobileLayout: store => store.layoutType === 'mobile'
     })
   },
   created () {
@@ -143,9 +146,6 @@ const Timeline = {
     this.$store.commit('setLoading', { timeline: this.timelineName, value: false })
   },
   methods: {
-    scrollToTop () {
-      window.scrollTo({ top: this.$el.offsetTop })
-    },
     stopBlockingClicks: debounce(function () {
       this.blockingClicks = false
     }, 1000),
@@ -240,7 +240,7 @@ const Timeline = {
       // statuses will be nearby statuses before and after it
       this.virtualScrollIndex = approxIndex
     },
-    scrollLoad (e) {
+    scrollLoad () {
       const bodyBRect = document.body.getBoundingClientRect()
       const height = Math.max(bodyBRect.height, -(bodyBRect.y))
       if (this.timeline.loading === false &&
@@ -250,7 +250,6 @@ const Timeline = {
       }
     },
     handleScroll: throttle(function (e) {
-      this.showScrollTop = this.$el.offsetTop < window.scrollY
       this.determineVisibleStatuses()
       this.scrollLoad(e)
     }, 200),
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 862a19729..81dad3bd3 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -1,30 +1,15 @@
 <template>
   <div :class="['Timeline', classes.root]">
-    <div :class="classes.header">
+    <div
+      v-if="!embedded"
+      :class="classes.header"
+    >
       <TimelineMenu
         v-if="!embedded"
         :timeline-name="timelineName"
       />
-      <div
-        v-if="showScrollTop && !embedded"
-        class="rightside-button"
-      >
-        <button
-          class="button-unstyled scroll-to-top-button"
-          type="button"
-          :title="$t('general.scroll_to_top')"
-          @click="scrollToTop"
-        >
-          <FALayers class="fa-scale-110 fa-old-padding-layer">
-            <FAIcon icon="arrow-up" />
-            <FAIcon
-              icon="minus"
-              transform="up-7"
-            />
-          </FALayers>
-        </button>
-      </div>
-      <template v-if="mobileLayout && !embedded">
+      <ScrollTopButton />
+      <template v-if="mobileLayout">
         <div
           v-if="showLoadButton"
           class="rightside-button"
@@ -44,7 +29,7 @@
           </button>
         </div>
         <div
-          v-else-if="!embedded"
+          v-else
           class="loadmore-text faint veryfaint rightside-icon"
           :title="$t('timeline.up_to_date')"
           :aria-disabled="true"
@@ -65,7 +50,7 @@
           {{ loadButtonString }}
         </button>
         <div
-          v-else-if="!embedded"
+          v-else
           class="loadmore-text faint"
           @click.prevent
         >
@@ -73,11 +58,10 @@
         </div>
       </template>
       <QuickFilterSettings
-        v-if="!embedded"
+        v-if="!mobileLayout"
         class="rightside-button"
       />
       <QuickViewSettings
-        v-if="!embedded"
         class="rightside-button"
       />
     </div>
@@ -148,6 +132,8 @@
           />
         </div>
       </teleport>
+      <!-- spacer to avoid having empty shrug -->
+      <span v-if="embedded && footerSlipgate" />
     </div>
   </div>
 </template>
diff --git a/src/components/timeline_menu/timeline_menu.js b/src/components/timeline_menu/timeline_menu.js
index a09bbccad..4c8f7b76e 100644
--- a/src/components/timeline_menu/timeline_menu.js
+++ b/src/components/timeline_menu/timeline_menu.js
@@ -1,14 +1,17 @@
 import Popover from '../popover/popover.vue'
 import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
 import { mapState } from 'vuex'
-import { ListsMenuContent } from '../lists_menu/lists_menu_content.vue'
-import { BookmarkFoldersMenuContent } from '../bookmark_folders_menu/bookmark_folders_menu_content.vue'
+import ListsMenuContent from '../lists_menu/lists_menu_content.vue'
+import BookmarkFoldersMenuContent from '../bookmark_folders_menu/bookmark_folders_menu_content.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { TIMELINES } from 'src/components/navigation/navigation.js'
 import { filterNavigation } from 'src/components/navigation/filter.js'
 import {
   faChevronDown
 } from '@fortawesome/free-solid-svg-icons'
+import { useInterfaceStore } from 'src/stores/interface'
+import { useListsStore } from 'src/stores/lists'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders'
 
 library.add(faChevronDown)
 
@@ -21,7 +24,8 @@ export const timelineNames = (supportsBookmarkFolders) => {
     dms: 'nav.dms',
     'public-timeline': 'nav.public_tl',
     'public-external-timeline': 'nav.twkn',
-    quotes: 'nav.quotes'
+    quotes: 'nav.quotes',
+    bubble: 'nav.bubble'
   }
 }
 
@@ -39,7 +43,7 @@ const TimelineMenu = {
   },
   created () {
     if (timelineNames(this.bookmarkFolders)[this.$route.name]) {
-      this.$store.dispatch('setLastTimeline', this.$route.name)
+      useInterfaceStore().setLastTimeline(this.$route.name)
     }
   },
   computed: {
@@ -55,7 +59,8 @@ const TimelineMenu = {
       currentUser: state => state.users.currentUser,
       privateMode: state => state.instance.private,
       federating: state => state.instance.federating,
-      bookmarkFolders: state => state.instance.pleromaBookmarkFoldersAvailable
+      bookmarkFolders: state => state.instance.pleromaBookmarkFoldersAvailable,
+      bubbleTimeline: state => state.instance.localBubbleInstances.length > 0
     }),
     timelinesList () {
       return filterNavigation(
@@ -65,7 +70,8 @@ const TimelineMenu = {
           isFederating: this.federating,
           isPrivate: this.privateMode,
           currentUser: this.currentUser,
-          supportsBookmarkFolders: this.bookmarkFolders
+          supportsBookmarkFolders: this.bookmarkFolders,
+          supportsBubbleTimeline: this.bubbleTimeline
         }
       )
     }
@@ -95,10 +101,10 @@ const TimelineMenu = {
         return '#' + this.$route.params.tag
       }
       if (route === 'lists-timeline') {
-        return this.$store.getters.findListTitle(this.$route.params.id)
+        return useListsStore().findListTitle(this.$route.params.id)
       }
       if (route === 'bookmark-folder') {
-        return this.$store.getters.findBookmarkFolderName(this.$route.params.id)
+        return useBookmarkFoldersStore().findBookmarkFolderName(this.$route.params.id)
       }
       const i18nkey = timelineNames(this.bookmarkFolders)[this.$route.name]
       return i18nkey ? this.$t(i18nkey) : route
diff --git a/src/components/timeline_menu/timeline_menu.vue b/src/components/timeline_menu/timeline_menu.vue
index bdcfb73d6..717c8a8e8 100644
--- a/src/components/timeline_menu/timeline_menu.vue
+++ b/src/components/timeline_menu/timeline_menu.vue
@@ -29,8 +29,8 @@
       </ul>
     </template>
     <template #trigger>
-      <span class="button-unstyled title timeline-menu-title">
-        <span class="timeline-title">{{ timelineName() }}</span>
+      <span class="button-unstyled timeline-menu-title">
+        <h1 class="title timeline-title">{{ timelineName() }}</h1>
         <span>
           <FAIcon
             size="sm"
diff --git a/src/components/tooltip/tooltip.vue b/src/components/tooltip/tooltip.vue
new file mode 100644
index 000000000..db0a8bef9
--- /dev/null
+++ b/src/components/tooltip/tooltip.vue
@@ -0,0 +1,24 @@
+<template>
+  <Popover trigger="hover">
+    <template #trigger>
+      <slot />
+    </template>
+    <template #content>
+      <div class="tooltip">
+        {{ props.text }}
+      </div>
+    </template>
+  </Popover>
+</template>
+
+<script setup>
+import Popover from 'src/components/popover/popover.vue'
+
+const props = defineProps(['text'])
+</script>
+
+<style lang="scss">
+.tooltip {
+  margin: 0.5em 1em;
+}
+</style>
diff --git a/src/components/top_bar.style.js b/src/components/top_bar.style.js
index 46b3fb562..89c5243db 100644
--- a/src/components/top_bar.style.js
+++ b/src/components/top_bar.style.js
@@ -5,6 +5,7 @@ export default {
     'Link',
     'Text',
     'Icon',
+    // Optimization: don't put heavy components unless needed
     'Button',
     'ButtonUnstyled',
     'Input',
@@ -16,13 +17,42 @@ export default {
         background: '--fg',
         shadow: [{
           x: 0,
-          y: 0,
+          y: 1,
           blur: 4,
           spread: 0,
           color: '#000000',
-          alpha: 0.6
+          alpha: 0.4
+        },
+        {
+          x: 0,
+          y: 2,
+          blur: 7,
+          spread: 0,
+          color: '#000000',
+          alpha: 0.3
         }]
       }
+    },
+    {
+      component: 'Link',
+      parent: {
+        component: 'TopBar'
+      },
+      directives: {
+        textColor: '--text'
+      }
+    },
+    {
+      component: 'Icon',
+      parent: {
+        component: 'ButtonUnstyled',
+        parent: {
+          component: 'TopBar'
+        }
+      },
+      directives: {
+        textColor: '--parent--text'
+      }
     }
   ]
 }
diff --git a/src/components/update_notification/update_notification.js b/src/components/update_notification/update_notification.js
index ddf379f5c..1dbae0bba 100644
--- a/src/components/update_notification/update_notification.js
+++ b/src/components/update_notification/update_notification.js
@@ -1,10 +1,10 @@
 import Modal from 'src/components/modal/modal.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
-import pleromaTan from 'src/assets/pleromatan_apology.png'
-import pleromaTanFox from 'src/assets/pleromatan_apology_fox.png'
 import pleromaTanMask from 'src/assets/pleromatan_apology_mask.png'
 import pleromaTanFoxMask from 'src/assets/pleromatan_apology_fox_mask.png'
 
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+
 import {
   faTimes
 } from '@fortawesome/free-solid-svg-icons'
@@ -14,6 +14,9 @@ library.add(
 
 export const CURRENT_UPDATE_COUNTER = 1
 
+const pleromaTan = '/static/pleromatan_apology.png'
+const pleromaTanFox = '/static/pleromatan_apology_fox.png'
+
 const UpdateNotification = {
   data () {
     return {
@@ -35,8 +38,8 @@ const UpdateNotification = {
     shouldShow () {
       return !this.$store.state.instance.disableUpdateNotification &&
         this.$store.state.users.currentUser &&
-        this.$store.state.serverSideStorage.flagStorage.updateCounter < CURRENT_UPDATE_COUNTER &&
-        !this.$store.state.serverSideStorage.prefsStorage.simple.dontShowUpdateNotifs
+        useServerSideStorageStore().flagStorage.updateCounter < CURRENT_UPDATE_COUNTER &&
+        !useServerSideStorageStore().prefsStorage.simple.dontShowUpdateNotifs
     }
   },
   methods: {
@@ -45,13 +48,13 @@ const UpdateNotification = {
     },
     neverShowAgain () {
       this.toggleShow()
-      this.$store.commit('setFlag', { flag: 'updateCounter', value: CURRENT_UPDATE_COUNTER })
-      this.$store.commit('setPreference', { path: 'simple.dontShowUpdateNotifs', value: true })
-      this.$store.dispatch('pushServerSideStorage')
+      useServerSideStorageStore().setFlag({ flag: 'updateCounter', value: CURRENT_UPDATE_COUNTER })
+      useServerSideStorageStore().setPreference({ path: 'simple.dontShowUpdateNotifs', value: true })
+      useServerSideStorageStore().pushServerSideStorage()
     },
     dismiss () {
-      this.$store.commit('setFlag', { flag: 'updateCounter', value: CURRENT_UPDATE_COUNTER })
-      this.$store.dispatch('pushServerSideStorage')
+      useServerSideStorageStore().setFlag({ flag: 'updateCounter', value: CURRENT_UPDATE_COUNTER })
+      useServerSideStorageStore().pushServerSideStorage()
     }
   },
   mounted () {
diff --git a/src/components/update_notification/update_notification.scss b/src/components/update_notification/update_notification.scss
index fb2edaa4a..23ca3ba2e 100644
--- a/src/components/update_notification/update_notification.scss
+++ b/src/components/update_notification/update_notification.scss
@@ -18,7 +18,7 @@
     padding-left: 1em;
   }
 
-  @media all and (max-width: 800px) {
+  @media all and (width <= 800px) {
     /* For mobile, the modal takes 100% of the available screen.
        This ensures the minimized modal is always 50px above the browser
        bottom bar regardless of whether or not it is visible.
@@ -26,7 +26,7 @@
     width: 100vw;
   }
 
-  @media all and (max-height: 600px) {
+  @media all and (height <= 600px) {
     display: none;
   }
 
diff --git a/src/components/update_notification/update_notification.vue b/src/components/update_notification/update_notification.vue
index 78e70a743..a35c70f86 100644
--- a/src/components/update_notification/update_notification.vue
+++ b/src/components/update_notification/update_notification.vue
@@ -9,9 +9,9 @@
       :class="{ '-peek': !showingMore }"
     >
       <div class="panel-heading">
-        <span class="title">
+        <h1 class="title">
           {{ $t('update.big_update_title') }}
-        </span>
+        </h1>
       </div>
       <div class="panel-body">
         <div
@@ -34,6 +34,7 @@
               class="extra-info-group"
             >
               <i18n-t
+                scope="global"
                 keypath="update.update_bugs"
                 tag="p"
               >
@@ -45,6 +46,7 @@
                 </template>
               </i18n-t>
               <i18n-t
+                scope="global"
                 keypath="update.update_changelog"
                 tag="p"
               >
@@ -57,6 +59,7 @@
               </i18n-t>
               <p class="art-credit">
                 <i18n-t
+                  scope="global"
                   keypath="update.art_by"
                   tag="small"
                 >
diff --git a/src/components/user_avatar/avatar.style.js b/src/components/user_avatar/avatar.style.js
index 812d45a46..d49213476 100644
--- a/src/components/user_avatar/avatar.style.js
+++ b/src/components/user_avatar/avatar.style.js
@@ -11,10 +11,10 @@ export default {
         shadow: [{
           x: 0,
           y: 1,
-          blur: 8,
+          blur: 4,
           spread: 0,
           color: '#000000',
-          alpha: 0.7
+          alpha: 0.2
         }]
       }
     }
diff --git a/src/components/user_avatar/user_avatar.js b/src/components/user_avatar/user_avatar.js
index ffd81f87c..8092ba62b 100644
--- a/src/components/user_avatar/user_avatar.js
+++ b/src/components/user_avatar/user_avatar.js
@@ -1,4 +1,5 @@
 import StillImage from '../still-image/still-image.vue'
+import { useInterfaceStore } from 'src/stores/interface'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 
@@ -13,16 +14,36 @@ library.add(
 )
 
 const UserAvatar = {
-  props: [
-    'user',
-    'betterShadow',
-    'compact',
-    'showActorTypeIndicator'
-  ],
+  props: {
+    // User object to show avatar of
+    user: {
+      required: true,
+      type: Object
+    },
+    // Use less space and use alternative roundness
+    compact: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show small icon indicating if account is a bot or group
+    showActorTypeIndicator : {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Override avatar image URL, useful for profile editing
+    url: {
+      required: false,
+      type: String,
+      default: null
+    }
+  },
   data () {
     return {
       showPlaceholder: false,
-      defaultAvatar: `${this.$store.state.instance.server + this.$store.state.instance.defaultAvatar}`
+      defaultAvatar: `${this.$store.state.instance.server + this.$store.state.instance.defaultAvatar}`,
+      betterShadow: useInterfaceStore().browserSupport.cssFilter
     }
   },
   components: {
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index 83608c505..d9e96d52d 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -8,7 +8,7 @@
       class="avatar"
       :alt="user.screen_name_ui"
       :title="user.screen_name_ui"
-      :src="imgSrc(user.profile_image_url_original)"
+      :src="url ? url : imgSrc(user.profile_image_url_original)"
       :image-load-error="imageLoadError"
       :class="{ '-compact': compact, '-better-shadow': betterShadow }"
     />
@@ -40,12 +40,12 @@
 
   display: inline-block;
   position: relative;
-  width: 48px;
-  height: 48px;
+  width: 3.5em;
+  height: 3.5em;
 
   &.-compact {
-    width: 32px;
-    height: 32px;
+    width: 2.2em;
+    height: 2.2em;
     border-radius: var(--roundness);
   }
 
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index b1fe2e8f3..7daee4b76 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -1,4 +1,8 @@
-import { unitToSeconds } from 'src/services/date_utils/date_utils.js'
+import merge from 'lodash/merge'
+import isEqual from 'lodash/isEqual'
+import unescape from 'lodash/unescape'
+
+import ColorInput from 'src/components/color_input/color_input.vue'
 import UserAvatar from '../user_avatar/user_avatar.vue'
 import RemoteFollow from '../remote_follow/remote_follow.vue'
 import ProgressButton from '../progress_button/progress_button.vue'
@@ -9,9 +13,20 @@ import UserNote from '../user_note/user_note.vue'
 import Select from '../select/select.vue'
 import UserLink from '../user_link/user_link.vue'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
-import ConfirmModal from '../confirm_modal/confirm_modal.vue'
+import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import EmojiInput from 'src/components/emoji_input/emoji_input.vue'
+import DialogModal from 'src/components/dialog_modal/dialog_modal.vue'
+import ImageCropper from 'src/components/image_cropper/image_cropper.vue'
+
+import localeService from 'src/services/locale/locale.service.js'
+import suggestor from 'src/components/emoji_input/suggestor.js'
+
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 import { mapGetters } from 'vuex'
+import { usePostStatusStore } from 'src/stores/post_status'
+import { propsToNative } from 'src/services/attributes_helper/attributes_helper.service.js'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faBell,
@@ -20,71 +35,161 @@ import {
   faExternalLinkAlt,
   faEdit,
   faTimes,
-  faExpandAlt
+  faExpandAlt,
+  faBirthdayCake,
+  faSave,
+  faClockRotateLeft
 } from '@fortawesome/free-solid-svg-icons'
 
+import { useMediaViewerStore } from '../../stores/media_viewer'
+import { useInterfaceStore } from '../../stores/interface'
+
 library.add(
+  faSave,
   faRss,
   faBell,
   faSearchPlus,
   faExternalLinkAlt,
   faEdit,
   faTimes,
-  faExpandAlt
+  faExpandAlt,
+  faBirthdayCake,
+  faClockRotateLeft
 )
 
 export default {
-  props: [
-    'userId',
-    'switcher',
-    'selected',
-    'hideBio',
-    'rounded',
-    'bordered',
-    'avatarAction', // default - open profile, 'zoom' - zoom, function - call function
-    'onClose',
-    'hasNoteEditor'
-  ],
+  props: {
+    // Enables all the options for profile editing, used in settings -> profile tab
+    editable: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    // ID of user to show data of
+    userId: {
+      required: true,
+      type: String
+    },
+    // Use a compact layout that hides bio, stats etc.
+    hideBio: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    // default - open profile, 'zoom' - zoom, function - call function
+    avatarAction: {
+      required: false,
+      type: String,
+      default: 'default'
+    },
+    // Show note editor if supported
+    hasNoteEditor: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show close icon (for popovers)
+    showClose: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show close icon (for popovers)
+    showExpand: {
+      required: false,
+      type: Boolean,
+      default: false
+    }
+  },
+  components: {
+    DialogModal,
+    UserAvatar,
+    Checkbox,
+    RemoteFollow,
+    ModerationTools,
+    AccountActions,
+    ProgressButton,
+    FollowButton,
+    Select,
+    RichContent,
+    UserLink,
+    UserNote,
+    UserTimedFilterModal,
+    ColorInput,
+    EmojiInput,
+    ImageCropper
+  },
   data () {
+    const user = this.$store.getters.findUser(this.userId)
+
     return {
       followRequestInProgress: false,
-      betterShadow: this.$store.state.interface.browserSupport.cssFilter,
-      showingConfirmMute: false,
       muteExpiryAmount: 0,
-      muteExpiryUnit: 'minutes'
+      muteExpiryUnit: 'minutes',
+
+      // Editable stuff
+      editImage: false,
+
+      newName: user.name_unescaped,
+      editingName: false,
+
+      newBio: unescape(user.description),
+      editingBio: false,
+
+      newAvatar: null,
+      newAvatarFile: null,
+
+      newBanner: null,
+      newBannerFile: null,
+
+      newActorType: user.actor_type,
+      newBirthday: user.birthday,
+      newShowBirthday: user.show_birthday,
+      newShowRole: user.show_role,
+
+      newFields: user.fields?.map(field => ({ name: field.name, value: field.value })),
+
+      editingFields: false,
     }
   },
   created () {
     this.$store.dispatch('fetchUserRelationship', this.user.id)
   },
   computed: {
+    somethingToSave () {
+      if (this.newName !== this.user.name_unescaped) return true
+      if (this.newBio !== unescape(this.user.description)) return true
+      if (this.newAvatar !== null) return true
+      if (this.newBanner !== null) return true
+      if (this.newActorType !== this.user.actor_type) return true
+      if (this.newBirthday !== this.user.birthday) return true
+      if (this.newShowBirthday !== this.user.show_birthday) return true
+      if (this.newShowRole !== this.user.show_role) return true
+      if (!isEqual(
+        this.newFields,
+        this.user.fields?.map(field => ({ name: field.name, value: field.value }))
+      )) return true
+      return false
+    },
+    groupActorAvailable () {
+      return this.$store.state.instance.groupActorAvailable
+    },
+    availableActorTypes () {
+      return this.groupActorAvailable ? ['Person', 'Service', 'Group'] : ['Person', 'Service']
+    },
     user () {
       return this.$store.getters.findUser(this.userId)
     },
+    role () {
+      return this.user.role
+    },
     relationship () {
       return this.$store.getters.relationship(this.userId)
     },
-    classes () {
-      return [{
-        '-rounded-t': this.rounded === 'top', // set border-top-left-radius and border-top-right-radius
-        '-rounded': this.rounded === true, // set border-radius for all sides
-        '-bordered': this.bordered === true, // set border for all sides
-        '-popover': !!this.onClose // set popover rounding
-      }]
-    },
-    style () {
-      return {
-        backgroundImage: [
-          'linear-gradient(to bottom, var(--profileTint), var(--profileTint))',
-          `url(${this.user.cover_photo})`
-        ].join(', ')
-      }
-    },
     isOtherUser () {
       return this.user.id !== this.$store.state.users.currentUser.id
     },
     subscribeUrl () {
-      // eslint-disable-next-line no-undef
       const serverUrl = new URL(this.user.statusnet_profile_url)
       return `${serverUrl.protocol}//${serverUrl.host}/main/ostatus`
     },
@@ -95,6 +200,13 @@ export default {
       const days = Math.ceil((new Date() - new Date(this.user.created_at)) / (60 * 60 * 24 * 1000))
       return Math.round(this.user.statuses_count / days)
     },
+    emoji () {
+      return this.$store.state.instance.customEmoji.map(e => ({
+        shortcode: e.displayText,
+        static_url: e.imageUrl,
+        url: e.imageUrl
+      }))
+    },
     userHighlightType: {
       get () {
         const data = this.$store.getters.mergedConfig.highlight[this.user.screen_name]
@@ -120,6 +232,7 @@ export default {
       }
     },
     visibleRole () {
+      if (!this.newShowRole) { return }
       const rights = this.user.rights
       if (!rights) { return }
       const validRole = rights.admin || rights.moderator
@@ -134,7 +247,10 @@ export default {
     },
     showModerationMenu () {
       const privileges = this.loggedIn.privileges
-      return this.loggedIn.role === 'admin' || privileges.includes('users_manage_activation_state') || privileges.includes('users_delete') || privileges.includes('users_manage_tags')
+      return this.loggedIn.role === 'admin' ||
+        privileges.includes('users_manage_activation_state') ||
+        privileges.includes('users_delete') ||
+        privileges.includes('users_manage_tags')
     },
     hasNote () {
       return this.relationship.note
@@ -142,47 +258,84 @@ export default {
     supportsNote () {
       return 'note' in this.relationship
     },
-    shouldConfirmMute () {
-      return this.mergedConfig.modalOnMute
+    muteExpiryAvailable () {
+      return this.user.mute_expires_at !== undefined
     },
-    muteExpiryUnits () {
-      return ['minutes', 'hours', 'days']
+    muteExpiry () {
+      return this.user.mute_expires_at == null
+        ? this.$t('user_card.mute_expires_forever')
+        : this.$t('user_card.mute_expires_at', [new Date(this.user.mute_expires_at).toLocaleString()])
+    },
+    blockExpiryAvailable () {
+      return this.user.block_expires_at !== undefined
+    },
+    blockExpiry () {
+      return this.user.block_expires_at == null
+        ? this.$t('user_card.block_expires_forever')
+        : this.$t('user_card.block_expires_at', [new Date(this.user.mute_expires_at).toLocaleString()])
+    },
+    formattedBirthday () {
+      const browserLocale = localeService.internalToBrowserLocale(this.$i18n.locale)
+      return this.user.birthday && new Date(Date.parse(this.user.birthday)).toLocaleDateString(browserLocale, { timeZone: 'UTC', day: 'numeric', month: 'long', year: 'numeric' })
+    },
+
+    // Editable stuff
+    avatarImgSrc () {
+      const currentUrl = this.user.profile_image_url_original || this.defaultAvatar
+      if (!this.editable) return currentUrl
+      const newUrl = this.newAvatar === null ? this.defaultAvatar : this.newAvatar
+      return (this.newAvatar === null) ? currentUrl : newUrl
+    },
+    bannerImgSrc () {
+      const currentUrl = this.user.cover_photo || this.defaultBanner
+      if (!this.editable) return currentUrl
+      const newUrl = this.newBanner === null ? this.defaultBanner : this.newBanner
+      return (this.newBanner === null) ? currentUrl : newUrl
+    },
+    defaultAvatar () {
+      return this.$store.state.instance.server + this.$store.state.instance.defaultAvatar
+    },
+    defaultBanner () {
+      return this.$store.state.instance.server + this.$store.state.instance.defaultBanner
+    },
+    isDefaultAvatar () {
+      const baseAvatar = this.$store.state.instance.defaultAvatar
+      return !(this.$store.state.users.currentUser.profile_image_url) ||
+      this.$store.state.users.currentUser.profile_image_url.includes(baseAvatar)
+    },
+    isDefaultBanner () {
+      const baseBanner = this.$store.state.instance.defaultBanner
+      return !(this.$store.state.users.currentUser.cover_photo) ||
+      this.$store.state.users.currentUser.cover_photo.includes(baseBanner)
+    },
+    fieldsLimits () {
+      return this.$store.state.instance.fieldsLimits
+    },
+    maxFields () {
+      return this.fieldsLimits ? this.fieldsLimits.maxFields : 0
+    },
+    emojiUserSuggestor () {
+      return suggestor({
+        emoji: [
+          ...this.$store.getters.standardEmojiList,
+          ...this.$store.state.instance.customEmoji
+        ],
+        store: this.$store
+      })
+    },
+    emojiSuggestor () {
+      return suggestor({
+        emoji: [
+          ...this.$store.getters.standardEmojiList,
+          ...this.$store.state.instance.customEmoji
+        ]
+      })
     },
     ...mapGetters(['mergedConfig'])
   },
-  components: {
-    UserAvatar,
-    RemoteFollow,
-    ModerationTools,
-    AccountActions,
-    ProgressButton,
-    FollowButton,
-    Select,
-    RichContent,
-    UserLink,
-    UserNote,
-    ConfirmModal
-  },
   methods: {
-    showConfirmMute () {
-      this.showingConfirmMute = true
-    },
-    hideConfirmMute () {
-      this.showingConfirmMute = false
-    },
     muteUser () {
-      if (!this.shouldConfirmMute) {
-        this.doMuteUser()
-      } else {
-        this.showConfirmMute()
-      }
-    },
-    doMuteUser () {
-      this.$store.dispatch('muteUser', {
-        id: this.user.id,
-        expiresIn: this.shouldConfirmMute ? unitToSeconds(this.muteExpiryUnit, this.muteExpiryAmount) : 0
-      })
-      this.hideConfirmMute()
+      this.$refs.timedMuteDialog.optionallyPrompt()
     },
     unmuteUser () {
       this.$store.dispatch('unmuteUser', this.user.id)
@@ -193,12 +346,6 @@ export default {
     unsubscribeUser () {
       return this.$store.dispatch('unsubscribeUser', this.user.id)
     },
-    setProfileView (v) {
-      if (this.switcher) {
-        const store = this.$store
-        store.commit('setProfileView', { v })
-      }
-    },
     linkClicked ({ target }) {
       if (target.tagName === 'SPAN') {
         target = target.parentNode
@@ -214,24 +361,142 @@ export default {
       )
     },
     openProfileTab () {
-      this.$store.dispatch('openSettingsModalTab', 'profile')
+      useInterfaceStore().openSettingsModalTab('profile')
     },
     zoomAvatar () {
       const attachment = {
         url: this.user.profile_image_url_original,
         mimetype: 'image'
       }
-      this.$store.dispatch('setMedia', [attachment])
-      this.$store.dispatch('setCurrentMedia', attachment)
+      useMediaViewerStore().setMedia([attachment])
+      useMediaViewerStore().setCurrentMedia(attachment)
     },
     mentionUser () {
-      this.$store.dispatch('openPostStatusModal', { profileMention: true, repliedUser: this.user })
+      usePostStatusStore().openPostStatusModal({ profileMention: true, repliedUser: this.user })
     },
     onAvatarClickHandler (e) {
       if (this.onAvatarClick) {
         e.preventDefault()
         this.onAvatarClick()
       }
+    },
+
+    // Editable stuff
+    changeAvatar () {
+      this.editImage = 'avatar'
+    },
+    changeBanner () {
+      this.editImage = 'banner'
+    },
+    submitImage ({ canvas, file }) {
+      if (canvas) {
+        return canvas.toBlob((data) => this.submitImage({ canvas: null, file: data }))
+      }
+
+      const reader = new window.FileReader()
+      reader.onload = (e) => {
+        const dataUrl = e.target.result
+
+        if (this.editImage === 'avatar') {
+          this.newAvatar = dataUrl
+          this.newAvatarFile = file
+        } else {
+          this.newBanner = dataUrl
+          this.newBannerFile = file
+        }
+
+        this.editImage = false
+      }
+
+      reader.readAsDataURL(file)
+
+    },
+    resetImage () {
+      if (this.editImage === 'avatar') {
+        this.newAvatar = null
+        this.newAvatarFile = null
+      } else {
+        this.newBanner = null
+        this.newBannerFile = null
+      }
+      this.editImage = false
+    },
+    addField () {
+      if (this.newFields.length < this.maxFields) {
+        this.newFields.push({ name: '', value: '' })
+      }
+    },
+    deleteField (index) {
+      this.newFields.splice(index, 1)
+    },
+    propsToNative (props) {
+      return propsToNative(props)
+    },
+    cancelImageText () {
+      return
+    },
+    resetState () {
+      const user = this.$store.state.users.currentUser
+
+      this.newName = user.name_unescaped
+      this.newBio = unescape(user.description)
+
+      this.newAvatar = null
+      this.newAvatarFile = null
+
+      this.newBanner = null
+      this.newBannerFile = null
+
+      this.newActorType = user.actor_type
+      this.newBirthday = user.birthday
+      this.newShowBirthday = user.show_birthday
+      this.newShowRole = user.show_role
+
+      this.newFields = user.fields.map(field => ({ name: field.name, value: field.value }))
+    },
+    updateProfile () {
+      const params = {
+        note: this.newBio,
+
+        // Backend notation.
+        display_name: this.newName,
+        fields_attributes: this.newFields.filter(el => el != null),
+        show_role: !!this.newShowRole,
+        birthday: this.newBirthday || '',
+        show_birthday: !!this.newShowBirthday,
+      }
+
+      if (this.actorType) {
+        params.actor_type = this.actorType
+      }
+
+      if (this.newAvatarFile !== null) {
+        params.avatar = this.newAvatarFile
+      }
+
+      if (this.newBannerFile !== null) {
+        params.header = this.newBannerFile
+      }
+
+      this.$store.state.api.backendInteractor
+        .updateProfile({ params })
+        .then((user) => {
+          this.newFields.splice(this.newFields.length)
+          merge(this.newFields, user.fields)
+          this.$store.commit('addNewUsers', [user])
+          this.$store.commit('setCurrentUser', user)
+          this.resetState()
+        })
+        .catch((error) => {
+          this.displayUploadError(error)
+        })
+    },
+    displayUploadError (error) {
+      useInterfaceStore().pushGlobalNotice({
+        messageKey: 'upload.error.message',
+        messageArgs: [error.message],
+        level: 'error'
+      })
     }
   }
 }
diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 70a76d54c..a821b4af1 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -1,56 +1,45 @@
 .user-card {
   position: relative;
   z-index: 1;
+  overflow: hidden;
+  border-top-left-radius: calc(var(--roundness) - 1px);
+  border-top-right-radius: calc(var(--roundness) - 1px);
 
-  &:hover {
-    --_still-image-img-visibility: visible;
-    --_still-image-canvas-visibility: hidden;
-    --_still-image-label-visibility: hidden;
+  // editing headers
+  h4 {
+    line-height: 2;
+    display: flex;
   }
 
-  .panel-heading {
-    padding: 0.5em 0;
-    text-align: center;
-    box-shadow: none;
-    background: transparent;
-    flex-direction: column;
-    align-items: stretch;
-    // create new stacking context
-    position: relative;
-  }
+  h3 {
+    padding-left: 0.6em;
+    margin-bottom: 0;
 
-  .background-image {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    mask:
-      linear-gradient(to top, white, transparent) bottom no-repeat,
-      linear-gradient(to top, white, white);
-    // Autoprefixer seem to ignore this one, and also syntax is different
-    mask-composite: xor;
-    mask-composite: exclude;
-    background-size: cover;
-    mask-size: 100% 60%;
-    border-top-left-radius: calc(var(--__roundnessTop, --panelRadius) - 1px);
-    border-top-right-radius: calc(var(--__roundnessTop, --panelRadius) - 1px);
-    border-bottom-left-radius: calc(var(--__roundnessBottom, --panelRadius) - 1px);
-    border-bottom-right-radius: calc(var(--__roundnessBottom, --panelRadius) - 1px);
-    background-color: var(--profileBg);
-    z-index: -2;
-
-    &.hide-bio {
-      mask-size: 100% 40px;
+    .button-default {
+      font-size: 1rem;
+      line-height: 2;
+      padding: 0 0.6em;
     }
   }
 
+  .input.bio {
+    height: auto; // override settings default textarea size
+  }
+
+  .follow-button {
+    flex: 1 0 auto;
+  }
+
+  .user-card-inner {
+    padding-bottom: 0;
+  }
+
+  &-setting,
   &-bio {
-    text-align: center;
+    color: var(--lightText);
     display: block;
     line-height: 1.3;
-    padding: 1em;
-    margin: 0;
+    padding: 0 0.6em;
 
     img {
       object-fit: contain;
@@ -60,44 +49,127 @@
     }
   }
 
-  &.-rounded-t {
-    border-top-left-radius: var(--roundness);
-    border-top-right-radius: var(--roundness);
-
-    --__roundnessTop: var(--roundness);
-    --__roundnessBottom: 0;
+  .user-card-setting {
+    margin-left: 0.6em;
+    margin-right: 0.6em;
   }
 
-  &.-rounded {
-    border-radius: var(--roundness);
+  .user-card-bio {
+    text-align: center;
+    margin: 0 0.6em;
 
-    --__roundnessTop: var(--roundness);
-    --__roundnessBottom: var(--roundness);
+    &.input {
+      margin: 0 1em;
+
+      textarea {
+        text-align: inherit;
+      }
+    }
+
+    &, * {
+      line-height: 1.5;
+    }
+
+    &.-justify-left {
+      text-align: start;
+    }
   }
 
-  &.-popover {
-    border-radius: var(--roundness);
-
-    --__roundnessTop: var(--roundness);
-    --__roundnessBottom: var(--roundness);
+  &:hover {
+    --_still-image-img-visibility: visible;
+    --_still-image-canvas-visibility: hidden;
+    --_still-image-label-visibility: hidden;
   }
 
-  &.-bordered {
-    border-width: 1px;
-    border-style: solid;
-    border-color: var(--border);
+  .personal-marks {
+    margin: 0.6em;
+    padding: 0.6em;
+
+    &:not(:last-child) {
+      border-bottom: 1px solid var(--border);
+    }
+
+    .highlighter {
+      h4 {
+        margin-top: 0.6em;
+      }
+
+      .userHighlightSel {
+        vertical-align: bottom;
+        margin-left: -0.1em;
+
+        &.-none select {
+          color: var(--textFaint);
+
+          option {
+            color: var(--text);
+            background: var(--background);
+          }
+        }
+      }
+
+      .highlighter-color {
+        vertical-align: bottom;
+        margin-left: 0.6em;
+      }
+    }
+  }
+
+  .header-overlay {
+    position: absolute;
+    inset: 0;
+    right: -1.2em;
+    left: -1.2em;
+    top: -1.4em;
+    mask: linear-gradient(to top, transparent 0, white 5em) bottom no-repeat;
+  }
+
+  .banner-overlay,
+  .banner-image {
+    position: absolute;
+    inset: 0;
+    padding: 0;
+    border-top-left-radius: calc(var(--roundness) - 1px);
+    border-top-right-radius: calc(var(--roundness) - 1px);
+  }
+
+  .banner-image {
+    z-index: -2;
+
+    img {
+      object-fit: cover;
+      height: 100%;
+      width: 100%;
+    }
+  }
+
+  .banner-overlay {
+    background-color: var(--profileTint);
+    opacity: 0.5;
+    pointer-events: none; // let user copy bg url
+    z-index: -1;
+  }
+
+  .bottom-buttons {
+    display: flex;
+    gap: 0.5em;
   }
 }
 
 .user-info {
-  padding: 0 26px;
+  position: relative;
+  text-align: left;
+  display: flex;
+  flex-direction: column;
+  gap: 1em;
 
-  .container {
-    min-width: 0;
-    padding: 16px 0 6px;
+  .user-identity {
+    position: relative;
+    aspect-ratio: 3;
+    min-height: 6em;
     display: flex;
-    align-items: flex-start;
-    max-height: 56px;
+    align-items: flex-end;
+    container: user-card / inline-size;
 
     > * {
       min-width: 0;
@@ -113,23 +185,55 @@
       --_avatarShadowFilter: var(--avatarShadowFilter);
       --_avatarShadowInset: var(--avatarShadowInset);
 
-      width: 56px;
-      height: 56px;
+      width: 7em;
+      width: calc(min(7em, 20cqw));
+      height: 7em;
+      height: calc(min(7em, 20cqw));
       object-fit: cover;
     }
   }
 
+  .other-actions {
+    position: relative;
+    display: inline-grid;
+    grid-auto-flow: column;
+    grid-gap: 0.6em;
+    font-size: 1.25rem;
+    z-index: 2;
+    align-self: end;
+
+    a, button, div {
+      text-align: center;
+      width: 2em;
+      height: 2em;
+      line-height: 2em;
+      padding: 0.6em;
+      margin: -0.6em;
+
+      &.edit-banner-button {
+        width: auto;
+      }
+
+      &:hover .icon {
+        color: var(--textFaint);
+      }
+
+      &:not(:hover) .icon {
+        color: var(--lightText);
+      }
+    }
+  }
+
   &-avatar {
     position: relative;
     cursor: pointer;
+    margin-right: 0.6em;
 
     &.-overlay {
       position: absolute;
-      left: 0;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      background-color: rgb(0 0 0 / 30%);
+      inset: -0.6em;
+      left: -0.6em;
+      right: -1.2em;
       display: flex;
       justify-content: center;
       align-items: center;
@@ -139,59 +243,28 @@
 
       svg {
         color: #fff;
+        margin: 0.5em;
       }
     }
 
     &:hover &.-overlay {
       opacity: 1;
+      background-color: rgb(0 0 0 / 30%);
     }
   }
 
-  .external-link-button,
-  .edit-profile-button {
-    cursor: pointer;
-    width: 2.5em;
-    text-align: center;
-    margin: -0.5em 0;
-    padding: 0.5em 0;
-
-    &:not(:hover) .icon {
-      color: var(--lightText);
-    }
-  }
-
-  .bottom-line {
-    font-weight: light;
-    font-size: 1.1em;
-    align-items: baseline;
-
-    .lock-icon {
-      margin-left: 0.5em;
-    }
-
-    .user-screen-name {
-      color: var(--text);
-      min-width: 1px;
-      flex: 0 1 auto;
-      text-overflow: ellipsis;
-      overflow: hidden;
-    }
-
-    .dailyAvg {
-      min-width: 1px;
-      flex: 0 0 auto;
-      margin-left: 1em;
-      font-size: 0.7em;
-      color: var(--text);
-    }
-
-    .user-role {
-      flex: none;
+  .user-info-avatar.-editable {
+    .-overlay {
+      opacity: 1;
+      place-items: start end;
+      justify-content: end;
     }
   }
 
   .user-summary {
-    display: block;
+    align-self: stretch;
+    display: flex;
+    flex-direction: column;
     margin-left: 0.6em;
     text-align: left;
     text-overflow: ellipsis;
@@ -201,6 +274,13 @@
     // big one
     z-index: 1;
     line-height: 2em;
+    filter: drop-shadow(0 0 0.5em var(--profileTint))
+            drop-shadow(0 0 0.2em var(--profileTint));
+
+    .alert {
+      text-shadow: none;
+    }
+
 
     --emoji-size: 1.7em;
 
@@ -209,86 +289,99 @@
       --link: var(--text) !important;
     }
 
-    .top-line,
+    .name-wrapper {
+      display: flex;
+      align-items: baseline;
+
+      .edit-button {
+        width: 3em;
+        text-align: center;
+
+        &:hover .icon {
+          color: var(--textFaint);
+        }
+
+        &:not(:hover) .icon {
+          color: var(--lightText);
+        }
+      }
+
+      .input,
+      .user-name {
+        flex: 1;
+        font-weight: 600;
+        line-height: 2;
+        margin-right: 1em;
+        text-overflow: ellipsis;
+        overflow: hidden;
+      }
+
+      .input {
+        margin: 0 -0.5em;
+        padding: 0 0.5em;
+      }
+    }
+
+    .top-line {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      flex: 1;
+      // these two normalize position and height when custom emoji are used
+      line-height: 2;
+      margin-bottom: -0.2em;
+      font-size: calc(max(110%, 4cqw));
+    }
+
     .bottom-line {
       display: flex;
-    }
-  }
-
-  .user-name {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    flex: 1 1 auto;
-    margin-right: 1em;
-    font-size: 1.1em;
-  }
-
-  .user-meta {
-    margin-bottom: 0.15em;
-    display: flex;
-    align-items: baseline;
-    line-height: 22px;
-    flex-wrap: wrap;
-
-    .following {
-      flex: 1 0 auto;
-      margin: 0;
-      margin-bottom: 0.25em;
-      text-align: left;
-    }
-
-    .highlighter {
-      flex: 0 1 auto;
-      display: flex;
+      align-items: baseline;
       flex-wrap: wrap;
-      margin-right: -0.5em;
-      align-self: start;
+      white-space: normal;
+      font-weight: 500;
+      font-size: 0.9em;
+      font-size: calc(max(90%, 2.5cqw));
+      line-height: 1.5;
+      margin-top: 0.5em;
+    }
 
-      .userHighlightCl {
-        padding: 2px 10px;
-        flex: 1 0 auto;
-      }
+    .lock-icon {
+      display: inline-block;
+      vertical-align: baseline;
+      overflow-x: hidden;
+      margin: 0 0.35em 0 0.5em;
+    }
 
-      .userHighlightSel {
-        padding-top: 0;
-        padding-bottom: 0;
-        flex: 1 0 auto;
-      }
+    .user-screen-name {
+      color: var(--text);
+      text-overflow: ellipsis;
+      overflow: hidden;
+      display: inline-block;
+    }
 
-      .userHighlightText {
-        width: 70px;
-        flex: 1 0 auto;
-      }
-
-      .userHighlightCl,
-      .userHighlightText,
-      .userHighlightSel {
-        vertical-align: top;
-        margin-right: 0.5em;
-        margin-bottom: 0.25em;
-      }
+    .user-role {
+      display: inline-block;
+      vertical-align: baseline;
     }
   }
 
   .user-interactions {
     position: relative;
     display: flex;
-    flex-flow: row wrap;
-    margin-right: -0.75em;
+    flex-wrap: wrap;
+    gap: 0.6em;
 
     > * {
-      margin: 0 0.75em 0.6em 0;
+      flex: 0 0 8em;
+    }
+
+    .popover-trigger-button, .moderation-tools-button {
+      width: 100%;
+    }
+
+    > .btn-group, > button {
       white-space: nowrap;
-      min-width: 95px;
     }
-
-    button {
-      margin: 0;
-    }
-  }
-
-  .user-note {
-    margin: 0 0.75em 0.6em 0;
   }
 }
 
@@ -296,33 +389,211 @@
   display: none;
 }
 
-.user-counts {
-  display: flex;
-  line-height: 16px;
-  padding: 0.5em 1.5em 0;
-  text-align: center;
-  justify-content: space-between;
-  flex-wrap: wrap;
+.user-extras {
+  padding: 1.2em 0.6em;
+  line-height: 1.5;
+
+  .user-stats {
+    display: block;
+    text-align: center;
+    word-wrap: break-word;
+    width: 100%;
+
+    dl {
+      display: inline;
+      margin-right: 1em;
+      white-space: nowrap;
+    }
+
+    dd {
+      font-weight: bolder;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      margin: 0;
+    }
+
+    dd, dt {
+      display: inline
+    }
+
+    /* stylelint-disable-next-line no-descending-specificity */
+    a {
+      text-decoration: none;
+    }
+  }
+
+  .birthday {
+    width: 100%;
+    text-align: center;
+    white-space: nowrap;
+
+    --icon: var(--text);
+  }
 }
 
-.user-count {
-  flex: 1 0 auto;
-  padding: 0.5em 0;
+.user-profile-fields {
   margin: 0 0.5em;
-
-  h5 {
-    font-size: 1em;
-    font-weight: bolder;
-    margin: 0 0 0.25em;
-  }
-
-  /* stylelint-disable-next-line no-descending-specificity */
-  a {
-    text-decoration: none;
-  }
-}
-
-.mute-expiry {
+  padding: 0 0.5em;
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
+
+  --emoji-size: 1.8em;
+
+  .user-profile-field-add,
+  .user-profile-field {
+    display: flex;
+    align-items: center;
+    margin: 0.25em;
+    border: 1px solid var(--border);
+    border-radius: var(--roundness);
+    line-height: 2em;
+
+    .label {
+      margin-left: 0.5em;
+    }
+  }
+
+  .user-profile-field-add {
+    justify-content: center;
+    margin: 0.25em;
+  }
+
+  .user-profile-field {
+
+    /* stylelint-disable no-descending-specificity */
+    // input is a generic class
+    .input {
+      text-align: inherit;
+      flex: 1;
+    }
+    /* stylelint-enable no-descending-specificity */
+
+    .delete-field {
+      display: inline-block;
+      text-align: center;
+      width: 2em;
+    }
+
+    .user-profile-field-name,
+    .user-profile-field-value,
+    .user-profile-field-add {
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      overflow: hidden;
+      box-sizing: border-box;
+      display: inline-flex;
+
+      &.-edit {
+        padding: 0;
+
+        input {
+          font-weight: inherit;
+        }
+      }
+    }
+
+    .user-profile-field-name {
+      flex: 0 1 50%;
+      font-weight: 600;
+      text-align: right;
+      justify-content: end;
+      color: var(--lightText);
+      min-width: 9em;
+      border-right: 1px solid var(--border);
+      padding-left: 1.2em;
+      padding-right: 0.6em;
+    }
+
+    .user-profile-field-value {
+      flex: 1 1 55%;
+      color: var(--text);
+      padding-left: 0.6em;
+      margin: 0;
+    }
+  }
+}
+
+.edit-image {
+  .panel-body {
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .current-avatar {
+    object-fit: contain;
+  }
+
+  .image-container {
+    display: flex;
+    align-self: center;
+    margin: 0 0 1em;
+    max-height: 30em;
+    max-width: 100%;
+    flex: 1 0 20em;
+    aspect-ratio: 1;
+    gap: 0.5em;
+
+    &.-banner {
+      aspect-ratio: 3;
+      max-width: 100%;
+    }
+
+    .new-image {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .cropper {
+      flex: 1;
+      overflow-x: auto;
+    }
+
+    > * {
+      flex: 1 0 10em;
+      max-height: 100%;
+      aspect-ratio: 1;
+    }
+
+    .separator {
+      min-width: 1.1em;
+      font-size: 500%;
+      align-self: center;
+      flex: 0 1 5em;
+      aspect-ratio: unset;
+    }
+  }
+
+  &.-banner {
+    .images-container {
+      grid-template-rows: 20em 5em 20em;
+      grid-template-columns: 1fr;
+
+      > * {
+        flex: 1 0 10em;
+        width: 100%;
+        aspect-ratio: 3;
+      }
+    }
+
+    .separator {
+      min-height: 1.1em;
+      font-size: 500%;
+      justify-self: center;
+      flex: 0 1 5em;
+      aspect-ratio: unset;
+    }
+  }
+
+  #modal.-mobile & {
+    #pick-image {
+      height: 3em;
+    }
+
+    .image-container {
+      &.-banner {
+        max-height: 10em;
+      }
+    }
+  }
 }
diff --git a/src/components/user_card/user_card.style.js b/src/components/user_card/user_card.style.js
index 34eaa1769..b6e256392 100644
--- a/src/components/user_card/user_card.style.js
+++ b/src/components/user_card/user_card.style.js
@@ -1,40 +1,11 @@
 export default {
   name: 'UserCard',
   selector: '.user-card',
-  validInnerComponents: [
-    'Text',
-    'Link',
-    'Icon',
-    'Button',
-    'ButtonUnstyled',
-    'Input',
-    'RichContent',
-    'Alert'
-  ],
+  notEditable: true,
   defaultRules: [
     {
       directives: {
-        background: '--bg',
-        opacity: 0,
-        roundness: 3,
-        shadow: [{
-          x: 1,
-          y: 1,
-          blur: 4,
-          spread: 0,
-          color: '#000000',
-          alpha: 0.6
-        }],
-        '--profileTint': 'color | $alpha(--background, 0.5)'
-      }
-    },
-    {
-      parent: {
-        component: 'UserCard'
-      },
-      component: 'RichContent',
-      directives: {
-        opacity: 0
+        '--profileTint': 'color | $alpha(--background 1)'
       }
     }
   ]
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 70c4f67df..d6edc021f 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -1,25 +1,26 @@
 <template>
-  <div
-    class="user-card"
-    :class="classes"
-  >
-    <div
-      :class="{ 'hide-bio': hideBio }"
-      :style="style"
-      class="background-image"
-    />
-    <div :class="onClose ? '' : panel-heading -flexible-height">
+  <div class="user-card">
+    <div class="user-card-inner">
       <div class="user-info">
-        <div class="container">
+        <div class="user-identity">
+          <div class="header-overlay">
+            <div class="banner-image">
+              <img
+                :src="bannerImgSrc"
+                :class="{ 'hide-bio': hideBio }"
+              >
+            </div>
+            <div
+              class="banner-overlay"
+              :class="{ 'hide-bio': hideBio }"
+            />
+          </div>
           <a
             v-if="avatarAction === 'zoom'"
             class="user-info-avatar -link"
             @click="zoomAvatar"
           >
-            <UserAvatar
-              :better-shadow="betterShadow"
-              :user="user"
-            />
+            <UserAvatar :user="user" />
             <div class="user-info-avatar -link -overlay">
               <FAIcon
                 class="fa-scale-110 fa-old-padding"
@@ -27,89 +28,165 @@
               />
             </div>
           </a>
+          <button
+            v-else-if="editable"
+            class="user-info-avatar button-unstyled -link"
+            :class="{ '-editable': editable }"
+            @click="changeAvatar"
+          >
+            <UserAvatar
+              :user="user"
+              :url="avatarImgSrc"
+            />
+            <div class="user-info-avatar -link -overlay">
+              <FAIcon
+                class="fa-scale-110 fa-old-padding"
+                icon="pencil"
+              />
+            </div>
+          </button>
           <UserAvatar
             v-else-if="typeof avatarAction === 'function'"
             class="user-info-avatar"
-            :better-shadow="betterShadow"
             :user="user"
             @click="avatarAction"
           />
           <router-link
             v-else
+            class="user-info-avatar"
             :to="userProfileLink(user)"
           >
-            <UserAvatar
-              :better-shadow="betterShadow"
-              :user="user"
-            />
+            <UserAvatar :user="user" />
           </router-link>
           <div class="user-summary">
             <div class="top-line">
-              <router-link
-                :to="userProfileLink(user)"
-                class="user-name"
+              <div
+                class="other-actions"
               >
-                <RichContent
-                  :title="user.name"
-                  :html="user.name"
-                  :emoji="user.emoji"
+                <button
+                  v-if="editable"
+                  :disabled="newName && newName.length === 0"
+                  class="btn button-unstyled edit-banner-button"
+                  @click="changeBanner"
+                >
+                  {{ $t('settings.change_banner') }}
+                  <FAIcon
+                    fixed-width
+                    class="icon"
+                    icon="pencil"
+                    :title="$t('settings.change_banner')"
+                  />
+                </button>
+                <button
+                  v-else-if="!editable && !isOtherUser && user.is_local"
+                  class="button-unstyled edit-profile-button"
+                  @click.stop="openProfileTab"
+                >
+                  <FAIcon
+                    fixed-width
+                    class="icon"
+                    icon="edit"
+                    :title="$t('user_card.edit_profile')"
+                  />
+                </button>
+                <a
+                  v-if="isOtherUser && !user.is_local"
+                  :href="user.statusnet_profile_url"
+                  target="_blank"
+                  class="button-unstyled external-link-button"
+                >
+                  <FAIcon
+                    class="icon"
+                    icon="external-link-alt"
+                  />
+                </a>
+                <AccountActions
+                  v-if="isOtherUser && loggedIn"
+                  :user="user"
+                  :relationship="relationship"
                 />
-              </router-link>
-              <button
-                v-if="!isOtherUser && user.is_local"
-                class="button-unstyled edit-profile-button"
-                @click.stop="openProfileTab"
-              >
-                <FAIcon
-                  fixed-width
-                  class="icon"
-                  icon="edit"
-                  :title="$t('user_card.edit_profile')"
-                />
-              </button>
-              <a
-                v-if="isOtherUser && !user.is_local"
-                :href="user.statusnet_profile_url"
-                target="_blank"
-                class="button-unstyled external-link-button"
-              >
-                <FAIcon
-                  class="icon"
-                  icon="external-link-alt"
-                />
-              </a>
-              <AccountActions
-                v-if="isOtherUser && loggedIn"
-                :user="user"
-                :relationship="relationship"
-              />
-              <router-link
-                v-if="onClose"
-                :to="userProfileLink(user)"
-                class="button-unstyled external-link-button"
-                @click="onClose"
-              >
-                <FAIcon
-                  class="icon"
-                  icon="expand-alt"
-                />
-              </router-link>
-              <button
-                v-if="onClose"
-                class="button-unstyled external-link-button"
-                @click="onClose"
-              >
-                <FAIcon
-                  class="icon"
-                  icon="times"
-                />
-              </button>
+                <router-link
+                  v-if="showExpand"
+                  :to="userProfileLink(user)"
+                  class="button-unstyled external-link-button"
+                  @click="$emit('close')"
+                >
+                  <FAIcon
+                    class="icon"
+                    icon="expand-alt"
+                  />
+                </router-link>
+                <button
+                  v-if="showClose"
+                  class="button-unstyled external-link-button"
+                  @click="$emit('close')"
+                >
+                  <FAIcon
+                    class="icon"
+                    icon="times"
+                  />
+                </button>
+              </div>
+              <div class="name-wrapper">
+                <router-link
+                  v-if="!editable || !editingName"
+                  :to="userProfileLink(user)"
+                  class="user-name"
+                >
+                  <RichContent
+                    :title="editable ? newName : user.name_unescaped"
+                    :html="editable ? newName : user.name_unescaped"
+                    :emoji="editable ? emoji : user.emoji"
+                  />
+                </router-link>
+                <EmojiInput
+                  v-else-if="editingName"
+                  v-model="newName"
+                  enable-emoji-picker
+                  :suggest="emojiSuggestor"
+                >
+                  <template #default="inputProps">
+                    <input
+                      id="username"
+                      v-model="newName"
+                      class="input name-changer"
+                      v-bind="propsToNative(inputProps)"
+                    >
+                  </template>
+                </EmojiInput>
+                <button
+                  v-if="editable"
+                  class="button-unstyled edit-button"
+                  :title="$t('settings.toggle_edit')"
+                  @click="editingName = !editingName"
+                >
+                  <FAIcon
+                    class="icon"
+                    icon="pencil"
+                  />
+                </button>
+              </div>
             </div>
             <div class="bottom-line">
-              <user-link
+              <UserLink
                 class="user-screen-name"
                 :user="user"
               />
+              <span
+                v-if="user.locked"
+                class="lock-icon"
+              >
+                <FAIcon
+                  icon="lock"
+                  size="sm"
+                />
+              </span>
+              <span
+                v-if="relationship.followed_by && loggedIn && isOtherUser"
+                class="alert neutral user-role"
+              >
+                {{ $t('user_card.follows_you') }}
+              </span>
               <template v-if="!hideBio">
                 <span
                   v-if="user.deactivated"
@@ -135,68 +212,22 @@
                 >
                   {{ $t('user_card.group') }}
                 </span>
+                <span
+                  v-if="relationship.muting && muteExpiryAvailable"
+                  class="alert neutral user-role"
+                >
+                  {{ muteExpiry }}
+                </span>
+                <span
+                  v-if="relationship.blocking && blockExpiryAvailable"
+                  class="alert neutral user-role"
+                >
+                  {{ blockExpiry }}
+                </span>
               </template>
-              <span v-if="user.locked">
-                <FAIcon
-                  class="lock-icon"
-                  icon="lock"
-                  size="sm"
-                />
-              </span>
-              <span
-                v-if="!mergedConfig.hideUserStats && !hideBio"
-                class="dailyAvg"
-              >{{ dailyAvg }} {{ $t('user_card.per_day') }}</span>
             </div>
           </div>
         </div>
-        <div class="user-meta">
-          <div
-            v-if="relationship.followed_by && loggedIn && isOtherUser"
-            class="following"
-          >
-            {{ $t('user_card.follows_you') }}
-          </div>
-          <div
-            v-if="isOtherUser && (loggedIn || !switcher)"
-            class="highlighter"
-          >
-            <!-- id's need to be unique, otherwise vue confuses which user-card checkbox belongs to -->
-            <input
-              v-if="userHighlightType !== 'disabled'"
-              :id="'userHighlightColorTx'+user.id"
-              v-model="userHighlightColor"
-              class="input userHighlightText"
-              type="text"
-            >
-            <input
-              v-if="userHighlightType !== 'disabled'"
-              :id="'userHighlightColor'+user.id"
-              v-model="userHighlightColor"
-              class="input userHighlightCl"
-              type="color"
-            >
-            {{ ' ' }}
-            <Select
-              :id="'userHighlightSel'+user.id"
-              v-model="userHighlightType"
-              class="userHighlightSel"
-            >
-              <option value="disabled">
-                {{ $t('user_card.highlight.disabled') }}
-              </option>
-              <option value="solid">
-                {{ $t('user_card.highlight.solid') }}
-              </option>
-              <option value="striped">
-                {{ $t('user_card.highlight.striped') }}
-              </option>
-              <option value="side">
-                {{ $t('user_card.highlight.side') }}
-              </option>
-            </Select>
-          </div>
-        </div>
         <div
           v-if="loggedIn && isOtherUser"
           class="user-interactions"
@@ -208,7 +239,7 @@
             />
             <template v-if="relationship.following">
               <ProgressButton
-                v-if="!relationship.subscribing"
+                v-if="!relationship.notifying"
                 class="btn button-default"
                 :click="subscribeUser"
                 :title="$t('user_card.subscribe')"
@@ -236,35 +267,32 @@
               </ProgressButton>
             </template>
           </div>
-          <div>
-            <button
-              v-if="relationship.muting"
-              class="btn button-default btn-block toggled"
-              :disabled="user.deactivated"
-              @click="unmuteUser"
-            >
-              {{ $t('user_card.muted') }}
-            </button>
-            <button
-              v-else
-              class="btn button-default btn-block"
-              :disabled="user.deactivated"
-              @click="muteUser"
-            >
-              {{ $t('user_card.mute') }}
-            </button>
-          </div>
-          <div>
-            <button
-              class="btn button-default btn-block"
-              :disabled="user.deactivated"
-              @click="mentionUser"
-            >
-              {{ $t('user_card.mention') }}
-            </button>
-          </div>
+          <button
+            v-if="relationship.muting"
+            class="btn button-default btn-mute toggled"
+            :disabled="user.deactivated"
+            @click="unmuteUser"
+          >
+            {{ $t('user_card.muted') }}
+          </button>
+          <button
+            v-else
+            class="btn button-default btn-mute"
+            :disabled="user.deactivated"
+            @click="muteUser"
+          >
+            {{ $t('user_card.mute') }}
+          </button>
+          <button
+            class="btn button-default btn-mention"
+            :disabled="user.deactivated"
+            @click="mentionUser"
+          >
+            {{ $t('user_card.mention') }}
+          </button>
           <ModerationTools
             v-if="showModerationMenu"
+            class="moderation-menu"
             :user="user"
           />
         </div>
@@ -274,95 +302,415 @@
         >
           <RemoteFollow :user="user" />
         </div>
-        <UserNote
-          v-if="loggedIn && isOtherUser && (hasNote || (hasNoteEditor && supportsNote))"
-          :user="user"
-          :relationship="relationship"
-          :editable="hasNoteEditor"
+      </div>
+    </div>
+    <div
+      v-if="!editable && loggedIn && isOtherUser && (hasNote || !hideBio) && !mergedConfig.userCardHidePersonalMarks"
+      class="personal-marks"
+    >
+      <UserNote
+        v-if="hasNote || (hasNoteEditor && supportsNote)"
+        :user="user"
+        :relationship="relationship"
+        :editable="hasNoteEditor"
+      />
+      <div
+        v-if="!hideBio"
+        class="highlighter"
+      >
+        <h4>{{ $t('user_card.highlight_header') }}</h4>
+        <Select
+          :id="'userHighlightSel'+user.id"
+          v-model="userHighlightType"
+          class="userHighlightSel unstyled"
+          :class="{ '-none': userHighlightType === 'disabled' }"
+        >
+          <option value="disabled">
+            {{ $t('user_card.highlight_new.disabled') }}
+          </option>
+          <option value="solid">
+            {{ $t('user_card.highlight_new.solid') }}
+          </option>
+          <option value="striped">
+            {{ $t('user_card.highlight_new.striped') }}
+          </option>
+          <option value="side">
+            {{ $t('user_card.highlight_new.side') }}
+          </option>
+        </Select>
+        <!-- id's need to be unique, otherwise vue confuses which user-card checkbox belongs to -->
+        <ColorInput
+          v-if="userHighlightType !== 'disabled'"
+          v-model="userHighlightColor"
+          class="highlighter-color"
+          :show-optional-checkbox="false"
+          name="'userHighlightColorTx'+user.id"
+          :unstyled="true"
         />
       </div>
     </div>
-    <div v-if="!hideBio">
-      <div
-        v-if="!mergedConfig.hideUserStats && switcher"
-        class="user-counts"
+    <h3 v-if="editable">
+      <span>
+        {{ $t('settings.bio') }}
+      </span>
+      {{ ' ' }}
+      <button
+        class="button-default"
+        @click="editingBio = !editingBio"
       >
-        <div
-          class="user-count"
-          @click.prevent="setProfileView('statuses')"
-        >
-          <h5>{{ $t('user_card.statuses') }}</h5>
-          <span>{{ user.statuses_count }} <br></span>
-        </div>
-        <div
-          class="user-count"
-          @click.prevent="setProfileView('friends')"
-        >
-          <h5>{{ $t('user_card.followees') }}</h5>
-          <span>{{ hideFollowsCount ? $t('user_card.hidden') : user.friends_count }}</span>
-        </div>
-        <div
-          class="user-count"
-          @click.prevent="setProfileView('followers')"
-        >
-          <h5>{{ $t('user_card.followers') }}</h5>
-          <span>{{ hideFollowersCount ? $t('user_card.hidden') : user.followers_count }}</span>
-        </div>
-      </div>
+        {{ $t('settings.toggle_edit') }}
+        <FAIcon
+          class="fa-scale-110 fa-old-padding"
+          icon="pencil"
+        />
+      </button>
+    </h3>
+    <template v-if="!editable || !editingBio">
       <RichContent
         v-if="!hideBio"
         class="user-card-bio"
-        :html="user.description_html"
-        :emoji="user.emoji"
+        :class="{ '-justify-left': mergedConfig.userCardLeftJustify }"
+        :html="editable ? newBio.replace(/\n/g, '<br>') : user.description_html"
+        :emoji="editable ? emoji : user.emoji"
         :handle-links="true"
       />
-    </div>
-    <teleport to="#modal">
-      <confirm-modal
-        v-if="showingConfirmMute"
-        :title="$t('user_card.mute_confirm_title')"
-        :confirm-text="$t('user_card.mute_confirm_accept_button')"
-        :cancel-text="$t('user_card.mute_confirm_cancel_button')"
-        @accepted="doMuteUser"
-        @cancelled="hideConfirmMute"
+    </template>
+    <template v-else-if="editingBio">
+      <EmojiInput
+        v-model="newBio"
+        enable-emoji-picker
+        class="user-card-bio"
+        :class="{ '-justify-left': mergedConfig.userCardLeftJustify }"
+        :suggest="emojiUserSuggestor"
       >
-        <i18n-t
-          keypath="user_card.mute_confirm"
-          tag="div"
+        <template #default="inputProps">
+          <textarea
+            v-model="newBio"
+            class="input bio resize-height"
+            v-bind="propsToNative(inputProps)"
+            :rows="newBio.split(/\n/g).length"
+          />
+        </template>
+      </EmojiInput>
+    </template>
+    <h3 v-if="editable">
+      <span>
+        {{ $t('settings.profile_fields.label') }}
+      </span>
+      {{ ' ' }}
+      <button
+        class="button-default"
+        @click="editingFields = !editingFields"
+      >
+        {{ $t('settings.toggle_edit') }}
+        <FAIcon
+          class="fa-scale-110 fa-old-padding"
+          icon="pencil"
+        />
+      </button>
+    </h3>
+    <template v-if="!editable || !editingFields">
+      <div
+        v-if="!hideBio && user.fields_html && user.fields_html.length > 0"
+        class="user-profile-fields"
+      >
+        <dl
+          v-for="(field, index) in (editable ? newFields : user.fields_html)"
+          :key="index"
+          class="user-profile-field"
         >
-          <template #user>
-            <span
-              v-text="user.screen_name_ui"
+          <dt
+            :title="field.name"
+            class="user-profile-field-name"
+          >
+            <RichContent
+              :html="field.name"
+              :emoji="editable ? emoji : user.emoji"
             />
-          </template>
-        </i18n-t>
-        <div
-          class="mute-expiry"
+          </dt>
+          <dd
+            :title="field.value"
+            class="user-profile-field-value"
+          >
+            <RichContent
+              :html="field.value"
+              :emoji="editable ? emoji : user.emoji"
+            />
+          </dd>
+        </dl>
+      </div>
+    </template>
+    <template v-else-if="editingFields">
+      <div
+        v-if="maxFields > 0"
+        class="user-profile-fields"
+      >
+        <dl
+          v-for="(_, i) in newFields"
+          :key="i"
+          class="user-profile-field"
         >
-          <label>
-            {{ $t('user_card.mute_duration_prompt') }}
-          </label>
-          <input
-            v-model="muteExpiryAmount"
-            type="number"
-            class="expiry-amount hide-number-spinner"
-            :min="0"
+          <dt
+            class="user-profile-field-name -edit"
           >
-          <Select
-            v-model="muteExpiryUnit"
-            unstyled="true"
-            class="expiry-unit"
-          >
-            <option
-              v-for="unit in muteExpiryUnits"
-              :key="unit"
-              :value="unit"
+            <EmojiInput
+              v-model="newFields[i].name"
+              enable-emoji-picker
+              :suggest="emojiSuggestor"
             >
-              {{ $t(`time.${unit}_short`, ['']) }}
+              <template #default="inputProps">
+                <input
+                  v-model="newFields[i].name"
+                  :placeholder="$t('settings.profile_fields.name')"
+                  v-bind="propsToNative(inputProps)"
+                  class="input"
+                >
+              </template>
+            </EmojiInput>
+          </dt>
+          <dd
+            class="user-profile-field-value -edit"
+          >
+            <EmojiInput
+              v-model="newFields[i].value"
+              enable-emoji-picker
+              :suggest="emojiSuggestor"
+            >
+              <template #default="inputProps">
+                <input
+                  v-model="newFields[i].value"
+                  :placeholder="$t('settings.profile_fields.value')"
+                  v-bind="propsToNative(inputProps)"
+                  class="input input"
+                >
+              </template>
+            </EmojiInput>
+            <button
+              class="delete-field button-default -hover-highlight"
+              @click="deleteField(i)"
+            >
+              <!-- TODO something is wrong with v-show here -->
+              <FAIcon
+                v-if="newFields.length > 1"
+                icon="times"
+              />
+            </button>
+          </dd>
+        </dl>
+        <button
+          v-if="newFields.length < maxFields"
+          class="user-profile-field-add add-field button-default -hover-highlight"
+          @click="addField"
+        >
+          <FAIcon
+            icon="plus"
+            class="icon"
+          />
+          <span class="label">
+            {{ $t("settings.profile_fields.add_field") }}
+          </span>
+        </button>
+      </div>
+    </template>
+    <div
+      v-if="!hideBio"
+      class="user-extras"
+    >
+      <span
+        v-if="!editable && !mergedConfig.hideUserStats"
+        class="user-stats"
+      >
+        <dl
+          v-if="!mergedConfig.hideUserStats && !hideBio"
+          class="user-count"
+        >
+          <dd>{{ user.statuses_count }}</dd>
+          {{ ' ' }}
+          <dt>{{ $t('user_card.statuses') }}</dt>
+        </dl>
+        <dl class="user-count">
+          <dd>{{ dailyAvg }}</dd>
+          {{ ' ' }}
+          <dt>{{ $t('user_card.statuses_per_day') }}</dt>
+        </dl>
+        <dl class="user-count">
+          <dd>{{ hideFollowsCount ? $t('user_card.hidden') : user.friends_count }}</dd>
+          {{ ' ' }}
+          <dt>{{ $t('user_card.followees') }}</dt>
+        </dl>
+        <dl class="user-count">
+          <dd>{{ hideFollowersCount ? $t('user_card.hidden') : user.followers_count }}</dd>
+          {{ ' ' }}
+          <dt>{{ $t('user_card.followers') }}</dt>
+        </dl>
+      </span>
+      <template v-if="!hideBio">
+        <div
+          v-if="user.birthday && !editable"
+          class="birthday"
+        >
+          <FAIcon
+            class="fa-old-padding"
+            icon="birthday-cake"
+          />
+          {{ $t('user_card.birthday', { birthday: formattedBirthday }) }}
+        </div>
+        <div
+          v-else-if="editable"
+          class="birthday"
+        >
+          <div>
+            <Checkbox v-model="newShowBirthday">
+              {{ $t('settings.birthday.show_birthday') }}
+            </Checkbox>
+          </div>
+          <FAIcon
+            class="fa-old-padding"
+            icon="birthday-cake"
+          />
+          {{ $t('settings.birthday.label') }}
+          <input
+            id="birthday"
+            v-model="newBirthday"
+            type="date"
+            class="input birthday-input"
+          >
+        </div>
+      </template>
+    </div>
+    <template v-if="editable">
+      <h3>{{ $t('settings.profile_other') }}</h3>
+      <p
+        v-if="role === 'admin' || role === 'moderator'"
+        class="user-card-setting"
+      >
+        <Checkbox v-model="newShowRole">
+          <template v-if="role === 'admin'">
+            {{ $t('settings.show_admin_badge') }}
+          </template>
+          <template v-if="role === 'moderator'">
+            {{ $t('settings.show_moderator_badge') }}
+          </template>
+        </Checkbox>
+      </p>
+      <p class="user-card-setting">
+        <label>
+          {{ $t('settings.actor_type') }}
+          <Select v-model="newActorType">
+            <option
+              v-for="option in availableActorTypes"
+              :key="option"
+              :value="option"
+            >
+              {{ $t('settings.actor_type_' + (option === 'Person' ? 'person_proper' : option)) }}
             </option>
           </Select>
+          <div v-if="groupActorAvailable">
+            <small>
+              {{ $t('settings.actor_type_description') }}
+            </small>
+          </div>
+        </label>
+      </p>
+      <div class="bottom-buttons">
+        <button
+          v-if="editable"
+          :disabled="!somethingToSave"
+          class="btn button-default reset-profile-button"
+          @click="resetState"
+        >
+          {{ $t('settings.reset') }}
+          <FAIcon
+            fixed-width
+            class="icon"
+            icon="clock-rotate-left"
+            :title="$t('user_card.edit_profile')"
+          />
+        </button>
+        <button
+          v-if="editable"
+          :disabled="!somethingToSave"
+          class="btn button-default save-profile-button"
+          @click="updateProfile"
+        >
+          {{ $t('settings.save') }}
+          <FAIcon
+            fixed-width
+            class="icon"
+            icon="save"
+            :title="$t('user_card.edit_profile')"
+          />
+        </button>
+      </div>
+    </template>
+    <teleport to="#modal">
+      <UserTimedFilterModal
+        ref="timedMuteDialog"
+        :user="user"
+        :is-mute="true"
+      />
+    </teleport>
+    <teleport to="#modal">
+      <DialogModal
+        v-if="editImage"
+        class="edit-image"
+      >
+        <template #header>
+          {{ editImage === 'avatar' ? $t('settings.change_avatar') : $t('settings.change_banner') }}
+        </template>
+        <p>
+          {{ editImage === 'avatar' ? $t('settings.avatar_size_instruction') : $t('settings.banner_size_instruction' ) }}
+        </p>
+        <div
+          class="image-container"
+          :class="{ '-banner': editImage === 'banner' }"
+        >
+          <image-cropper
+            ref="cropper"
+            class="cropper"
+            :aspect-ratio="editImage === 'avatar' ? 1 : 3"
+            @submit="submitImage"
+          />
         </div>
-      </confirm-modal>
+        <button
+          id="pick-image"
+          class="button-default btn"
+          type="button"
+          @click="() => $refs.cropper.pickImage()"
+        >
+          {{ $t('settings.select_picture') }}
+        </button>
+        <template #footer>
+          <button
+            class="button-default btn"
+            type="button"
+            @click="editImage = false"
+          >
+            {{ $t('image_cropper.cancel') }}
+          </button>
+          <button
+            :title="editImage === 'avatar' ? $t('settings.reset_avatar') : $t('settings.reset_banner')"
+            class="button-default btn reset-button"
+            @click="resetImage"
+          >
+            {{ editImage === 'avatar' ? $t('settings.reset_avatar') : $t('settings.reset_banner' ) }}
+          </button>
+          <button
+            class="button-default btn"
+            type="button"
+            @click="$refs.cropper.submit(false)"
+          >
+            {{ $t('image_cropper.save_without_cropping') }}
+          </button>
+          <button
+            class="button-default btn"
+            type="button"
+            @click="$refs.cropper.submit(true)"
+          >
+            {{ $t('image_cropper.save') }}
+          </button>
+        </template>
+      </DialogModal>
     </teleport>
   </div>
 </template>
diff --git a/src/components/user_link/user_link.vue b/src/components/user_link/user_link.vue
index efd96e12a..80b941d32 100644
--- a/src/components/user_link/user_link.vue
+++ b/src/components/user_link/user_link.vue
@@ -1,12 +1,16 @@
 <template>
-  <router-link
-    :title="user.screen_name_ui"
-    :to="userProfileLink(user)"
-  >
-    {{ at ? '@' : '' }}{{ user.screen_name_ui }}<UnicodeDomainIndicator
-      :user="user"
-    />
-  </router-link>
+  <div class="user-profile-link">
+    <router-link
+      :title="user.screen_name_ui"
+      :to="userProfileLink(user)"
+    >
+      <slot>
+        {{ at ? '@' : '' }}{{ user.screen_name_ui }}<UnicodeDomainIndicator
+          :user="user"
+        />
+      </slot>
+    </router-link>
+  </div>
 </template>
 
 <script>
diff --git a/src/components/user_list_menu/user_list_menu.js b/src/components/user_list_menu/user_list_menu.js
index 21996031b..1794769dd 100644
--- a/src/components/user_list_menu/user_list_menu.js
+++ b/src/components/user_list_menu/user_list_menu.js
@@ -1,9 +1,10 @@
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronRight } from '@fortawesome/free-solid-svg-icons'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import DialogModal from '../dialog_modal/dialog_modal.vue'
 import Popover from '../popover/popover.vue'
+import { useListsStore } from 'src/stores/lists'
 
 library.add(faChevronRight)
 
@@ -22,8 +23,8 @@ const UserListMenu = {
     this.$store.dispatch('fetchUserInLists', this.user.id)
   },
   computed: {
-    ...mapState({
-      allLists: state => state.lists.allLists
+    ...mapState(useListsStore, {
+      allLists: store => store.allLists
     }),
     inListsSet () {
       return new Set(this.user.inLists.map(x => x.id))
@@ -34,17 +35,22 @@ const UserListMenu = {
         ...list,
         inList: this.inListsSet.has(list.id)
       }))
+    },
+    triggerAttrs () {
+      return {
+        class: 'menu-item dropdown-item -has-submenu'
+      }
     }
   },
   methods: {
     toggleList (listId) {
       if (this.inListsSet.has(listId)) {
-        this.$store.dispatch('removeListAccount', { accountId: this.user.id, listId }).then((response) => {
+        useListsStore().removeListAccount({ accountId: this.user.id, listId }).then((response) => {
           if (!response.ok) { return }
           this.$store.dispatch('fetchUserInLists', this.user.id)
         })
       } else {
-        this.$store.dispatch('addListAccount', { accountId: this.user.id, listId }).then((response) => {
+        useListsStore().addListAccount({ accountId: this.user.id, listId }).then((response) => {
           if (!response.ok) { return }
           this.$store.dispatch('fetchUserInLists', this.user.id)
         })
@@ -75,7 +81,7 @@ const UserListMenu = {
       const user = this.user
       const { id, name } = user
       store.state.api.backendInteractor.deleteUser({ user })
-        .then(e => {
+        .then(() => {
           this.$store.dispatch('markStatusesAsDeleted', status => user.id === status.user.id)
           const isProfile = this.$route.name === 'external-user-profile' || this.$route.name === 'user-profile'
           const isTargetUser = this.$route.params.name === name || this.$route.params.id === id
diff --git a/src/components/user_list_menu/user_list_menu.vue b/src/components/user_list_menu/user_list_menu.vue
index 39ee24519..8b14b61ed 100644
--- a/src/components/user_list_menu/user_list_menu.vue
+++ b/src/components/user_list_menu/user_list_menu.vue
@@ -2,34 +2,39 @@
   <div class="UserListMenu">
     <Popover
       trigger="hover"
-      placement="left"
+      placement="right"
+      :trigger-attrs="triggerAttrs"
       remove-padding
     >
       <template #content>
         <div class="dropdown-menu">
-          <button
+          <div
             v-for="list in lists"
             :key="list.id"
-            class="menu-item dropdown-item"
-            @click="toggleList(list.id)"
+            class="menu-item dropdown-item -icon"
           >
-            <span
-              class="input menu-checkbox"
-              :class="{ 'menu-checkbox-checked': list.inList }"
-            />
-            {{ list.title }}
-          </button>
+            <button
+              class="main-button"
+              @click="toggleList(list.id)"
+            >
+              <span
+                class="input menu-checkbox"
+                :class="{ 'menu-checkbox-checked': list.inList }"
+              />
+              {{ list.title }}
+            </button>
+          </div>
         </div>
       </template>
       <template #trigger>
-        <button class="menu-item dropdown-item -has-submenu">
+        <span class="main-button">
           {{ $t('lists.manage_lists') }}
           <FAIcon
             class="chevron-icon"
             size="lg"
             icon="chevron-right"
           />
-        </button>
+        </span>
       </template>
     </Popover>
   </div>
diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue
index cd1344535..293a47094 100644
--- a/src/components/user_list_popover/user_list_popover.vue
+++ b/src/components/user_list_popover/user_list_popover.vue
@@ -51,7 +51,7 @@
 .user-list-popover {
   padding: 0.5em;
 
-  --emoji-size: 16px;
+  --emoji-size: calc(var(--emojiSize, 32px) / 2);
 
   .user-list-row {
     padding: 0.25em;
diff --git a/src/components/user_note/user_note.js b/src/components/user_note/user_note.js
index 830b2e594..e5ead513c 100644
--- a/src/components/user_note/user_note.js
+++ b/src/components/user_note/user_note.js
@@ -1,19 +1,24 @@
+import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
+
 const UserNote = {
   props: {
     user: Object,
     relationship: Object,
     editable: Boolean
   },
+  components: {
+    PanelLoading
+  },
   data () {
     return {
-      localNote: '',
+      localNote: this.relationship.note,
       editing: false,
       frozen: false
     }
   },
-  computed: {
-    shouldShow () {
-      return this.relationship.note || this.editing
+  watch: {
+    relationship () {
+      this.localNote = this.relationship.note
     }
   },
   methods: {
@@ -21,9 +26,6 @@ const UserNote = {
       this.localNote = this.relationship.note
       this.editing = true
     },
-    cancelEditing () {
-      this.editing = false
-    },
     finalizeEditing () {
       this.frozen = true
 
@@ -37,6 +39,7 @@ const UserNote = {
         })
         .catch(() => {
           this.frozen = false
+          this.editing = false
         })
     }
   }
diff --git a/src/components/user_note/user_note.vue b/src/components/user_note/user_note.vue
index e175ced00..8c4ec3662 100644
--- a/src/components/user_note/user_note.vue
+++ b/src/components/user_note/user_note.vue
@@ -1,46 +1,23 @@
 <template>
   <div
     class="user-note"
+    :class="{ '-frozen': frozen }"
   >
-    <div class="heading">
-      <span>{{ $t('user_card.note') }}</span>
-      <div class="buttons">
-        <button
-          v-show="!editing && editable"
-          class="button-default btn"
-          @click="startEditing"
-        >
-          {{ $t('user_card.edit_note') }}
-        </button>
-        <button
-          v-show="editing"
-          class="button-default btn"
-          :disabled="frozen"
-          @click="finalizeEditing"
-        >
-          {{ $t('user_card.edit_note_apply') }}
-        </button>
-        <button
-          v-show="editing"
-          class="button-default btn"
-          :disabled="frozen"
-          @click="cancelEditing"
-        >
-          {{ $t('user_card.edit_note_cancel') }}
-        </button>
-      </div>
-    </div>
+    <h4>{{ $t('user_card.personal_note') }}</h4>
     <textarea
-      v-show="editing"
       v-model="localNote"
       class="input note-text"
+      :class="{ unstyled: !editing }"
+      rows="1"
+      :placeholder="$t('user_card.note_blank_click')"
+      @focus="startEditing"
+      @blur="finalizeEditing"
     />
     <span
-      v-show="!editing"
-      class="note-text"
-      :class="{ '-blank': !relationship.note }"
+      v-if="frozen"
+      class="overlay"
     >
-      {{ relationship.note || $t('user_card.note_blank') }}
+      <PanelLoading />
     </span>
   </div>
 </template>
@@ -49,38 +26,27 @@
 
 <style lang="scss">
 .user-note {
-  display: flex;
-  flex-direction: column;
+  position: relative;
 
-  .heading {
-    display: flex;
-    flex-direction: row;
+  h4 {
     justify-content: space-between;
-    align-items: center;
-    margin-bottom: 0.75em;
-
-    .btn {
-      min-width: 95px;
-    }
-
-    .buttons {
-      display: flex;
-      flex-direction: row;
-      justify-content: right;
-
-      .btn {
-        margin-left: 0.5em;
-      }
-    }
+    margin-bottom: 0.5em;
   }
 
   .note-text {
     align-self: stretch;
+    min-width: 100%;
+    margin: -0.6em;
   }
 
-  .note-text.-blank {
-    font-style: italic;
-    color: var(--textFaint);
+  .overlay {
+    position: absolute;
+    inset: 0;
+    background-color: rgb(0 0 0 / 30%);
+
+    .panel-loading {
+      font-size: 1em;
+    }
   }
 }
 </style>
diff --git a/src/components/user_panel/user_panel.vue b/src/components/user_panel/user_panel.vue
index 9323b65e7..3f6922c31 100644
--- a/src/components/user_panel/user_panel.vue
+++ b/src/components/user_panel/user_panel.vue
@@ -8,7 +8,6 @@
       <UserCard
         :user-id="user.id"
         :hide-bio="true"
-        rounded="top"
       />
       <PostStatusForm />
     </div>
@@ -28,8 +27,24 @@
     backdrop-filter: var(--backdrop-filter);
   }
 
+  .user-info {
+    margin: 0.6em 0.6em 0;
+
+    .Avatar {
+      width: 5em;
+      width: calc(min(5em, 20cqw));
+      height: 5em;
+      height: calc(min(5em, 20cqw));
+    }
+  }
+
+  .post-status-form {
+    form {
+      margin-top: 0;
+    }
+  }
+
   .signed-in {
-    overflow: visible;
     z-index: 10;
   }
 }
diff --git a/src/components/user_popover/user_popover.vue b/src/components/user_popover/user_popover.vue
index 413b254cc..ea289e53c 100644
--- a/src/components/user_popover/user_popover.vue
+++ b/src/components/user_popover/user_popover.vue
@@ -12,10 +12,12 @@
     <template #content="{close}">
       <UserCard
         class="user-popover"
+        :show-close="true"
+        :show-expand="true"
         :user-id="userId"
         :hide-bio="true"
         :avatar-action="userPopoverAvatarAction == 'close' ? close : userPopoverAvatarAction"
-        :on-close="close"
+        @close="close"
       />
     </template>
   </Popover>
@@ -26,7 +28,26 @@
 <style lang="scss">
 /* popover styles load on-demand, so we need to override */
 /* stylelint-disable block-no-empty */
-.user-popover.popover {
+.user-popover {
+  margin: 0;
+
+  .user-info {
+    width: 100%;
+    margin: 1.2em;
+  }
+
+  .user-identity {
+    aspect-ratio: unset;
+    min-width: calc(min(30em, 98vw));
+  }
+
+  .user-card-inner {
+    display: flex;
+  }
+
+  &.popover {
+    overflow: hidden;
+  }
 }
 /* stylelint-enable block-no-empty */
 
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index 751bfd5a0..a65f1b5ea 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -7,16 +7,13 @@ import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
 import List from '../list/list.vue'
 import withLoadMore from '../../hocs/with_load_more/with_load_more'
-import localeService from 'src/services/locale/locale.service.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
-  faCircleNotch,
-  faBirthdayCake
+  faCircleNotch
 } from '@fortawesome/free-solid-svg-icons'
 
 library.add(
-  faCircleNotch,
-  faBirthdayCake
+  faCircleNotch
 )
 
 const FollowerList = withLoadMore({
@@ -81,11 +78,7 @@ const UserProfile = {
       return this.isUs || !this.user.hide_followers
     },
     favoritesTabVisible () {
-      return this.isUs || !this.user.hide_favorites
-    },
-    formattedBirthday () {
-      const browserLocale = localeService.internalToBrowserLocale(this.$i18n.locale)
-      return this.user.birthday && new Date(Date.parse(this.user.birthday)).toLocaleDateString(browserLocale, { timeZone: 'UTC', day: 'numeric', month: 'long', year: 'numeric' })
+      return this.isUs || (this.$store.state.instance.pleromaPublicFavouritesAvailable && !this.user.hide_favorites)
     }
   },
   methods: {
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 1ec12d0ce..e05e62c46 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -4,54 +4,14 @@
       v-if="user"
       class="user-profile panel panel-default"
     >
-      <div class="panel-body">
+      <div class="panel-body card-wrapper">
         <UserCard
           :user-id="userId"
           :switcher="true"
           :selected="timeline.viewing"
           avatar-action="zoom"
-          rounded="top"
           :has-note-editor="true"
         />
-        <span
-          v-if="!!user.birthday"
-          class="user-birthday"
-        >
-          <FAIcon
-            class="fa-old-padding"
-            icon="birthday-cake"
-          />
-          {{ $t('user_card.birthday', { birthday: formattedBirthday }) }}
-        </span>
-        <div
-          v-if="user.fields_html && user.fields_html.length > 0"
-          class="user-profile-fields"
-        >
-          <dl
-            v-for="(field, index) in user.fields_html"
-            :key="index"
-            class="user-profile-field"
-          >
-            <dt
-              :title="user.fields_text[index].name"
-              class="user-profile-field-name"
-            >
-              <RichContent
-                :html="field.name"
-                :emoji="user.emoji"
-              />
-            </dt>
-            <dd
-              :title="user.fields_text[index].value"
-              class="user-profile-field-value"
-            >
-              <RichContent
-                :html="field.value"
-                :emoji="user.emoji"
-              />
-            </dd>
-          </dl>
-        </div>
       </div>
       <tab-switcher
         :active-tab="tab"
@@ -142,12 +102,17 @@
       class="panel user-profile-placeholder"
     >
       <div class="panel-heading">
-        <div class="title">
+        <h1 class="title">
           {{ $t('settings.profile_tab') }}
-        </div>
+        </h1>
       </div>
-      <div>
-        <span v-if="error">{{ error }}</span>
+      <div class="panel-body">
+        <div
+          v-if="error"
+          class="alert error"
+        >
+          <span class="error-message">{{ error }}</span>
+        </div>
         <FAIcon
           v-else
           spin
@@ -163,78 +128,49 @@
 <style lang="scss">
 .user-profile {
   flex: 2;
-  flex-basis: 500px;
+
+  .card-wrapper {
+    border-top-left-radius: var(--roundness);
+    border-top-right-radius: var(--roundness);
+  }
+
+  .panel-footer {
+    border-bottom-left-radius: var(--roundness);
+    border-bottom-right-radius: var(--roundness);
+  }
 
   // No sticky header on user profile
-  --currentPanelStack: 1;
-
-  .user-birthday {
-    margin: 0 0.75em 0.5em;
-  }
-
-  .user-profile-fields {
-    margin: 0 0.5em;
-
-    img {
-      object-fit: contain;
-      vertical-align: middle;
-      max-width: 100%;
-      max-height: 400px;
-
-      &.emoji {
-        width: 18px;
-        height: 18px;
-      }
-    }
-
-    .user-profile-field {
-      display: flex;
-      margin: 0.25em;
-      border: 1px solid var(--border);
-      border-radius: var(--roundness);
-
-      .user-profile-field-name {
-        flex: 0 1 30%;
-        font-weight: 500;
-        text-align: right;
-        color: var(--lightText);
-        min-width: 120px;
-        border-right: 1px solid var(--border);
-      }
-
-      .user-profile-field-value {
-        flex: 1 1 70%;
-        color: var(--text);
-        margin: 0 0 0 0.25em;
-      }
-
-      .user-profile-field-name,
-      .user-profile-field-value {
-        line-height: 1.3;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        overflow: hidden;
-        padding: 0.5em 1.5em;
-        box-sizing: border-box;
-      }
-    }
-  }
+  --currentPanelStack: 0;
 
   .userlist-placeholder {
     display: flex;
     justify-content: center;
-    align-items: middle;
+    align-items: center;
     padding: 2em;
   }
+
+  .user-info {
+    margin: 1.2em;
+  }
 }
 
 .user-profile-placeholder {
   .panel-body {
     display: flex;
     justify-content: center;
-    align-items: middle;
+    align-items: center;
     padding: 7em;
   }
+
+  .alert {
+    padding: 0.75em 5em;
+    border-width: 2px;
+
+    .error-message {
+      color: var(--text);
+      font-weight: bold;
+    }
+  }
 }
 
 </style>
diff --git a/src/components/user_reporting_modal/user_reporting_modal.js b/src/components/user_reporting_modal/user_reporting_modal.js
index 67fde0844..b94203ec3 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.js
+++ b/src/components/user_reporting_modal/user_reporting_modal.js
@@ -3,6 +3,7 @@ import List from '../list/list.vue'
 import Checkbox from '../checkbox/checkbox.vue'
 import Modal from '../modal/modal.vue'
 import UserLink from '../user_link/user_link.vue'
+import { useReportsStore } from 'src/stores/reports'
 
 const UserReportingModal = {
   components: {
@@ -23,7 +24,7 @@ const UserReportingModal = {
   },
   computed: {
     reportModal () {
-      return this.$store.state.reports.reportModal
+      return useReportsStore().reportModal
     },
     isLoggedIn () {
       return !!this.$store.state.users.currentUser
@@ -63,7 +64,7 @@ const UserReportingModal = {
       this.error = false
     },
     closeModal () {
-      this.$store.dispatch('closeUserReportingModal')
+      useReportsStore().closeUserReportingModal()
     },
     reportUser () {
       this.processing = true
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 2bda509a4..aa5704a97 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -1,16 +1,19 @@
 <template>
   <Modal
     v-if="isOpen"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
   >
     <div class="user-reporting-panel panel">
       <div class="panel-heading">
         <i18n-t
-          tag="div"
+          tag="h1"
           keypath="user_reporting.title"
           class="title"
         >
-          <UserLink :user="user" />
+          <UserLink
+            class="user-link"
+            :user="user"
+          />
         </i18n-t>
       </div>
       <div class="panel-body">
@@ -74,10 +77,14 @@
 <style lang="scss">
 .user-reporting-panel {
   width: 90vw;
-  max-width: 700px;
+  max-width: 50rem;
   min-height: 20vh;
   max-height: 80vh;
 
+  .user-link {
+    display: inline
+  }
+
   .panel-body {
     display: flex;
     flex-direction: column-reverse;
@@ -104,7 +111,7 @@
     }
 
     textarea.form-control {
-      line-height: 16px;
+      line-height: 1.1;
       resize: none;
       overflow: hidden;
       transition: min-height 200ms 100ms;
@@ -143,7 +150,7 @@
     }
   }
 
-  @media all and (min-width: 801px) {
+  @media all and (width >= 801px) {
     .panel-body {
       flex-direction: row;
     }
diff --git a/src/components/user_timed_filter_modal/user_timed_filter_modal.js b/src/components/user_timed_filter_modal/user_timed_filter_modal.js
new file mode 100644
index 000000000..305603cba
--- /dev/null
+++ b/src/components/user_timed_filter_modal/user_timed_filter_modal.js
@@ -0,0 +1,100 @@
+import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
+import Select from 'src/components/select/select.vue'
+import { durationStrToMs } from 'src/services/date_utils/date_utils.js'
+
+const UserTimedFilterModal = {
+  data () {
+    const action = this.isMute
+          ? this.$store.getters.mergedConfig.onMuteDefaultAction
+          : this.$store.getters.mergedConfig.onBlockDefaultAction
+    const doAsk = action === 'ask'
+    const defaultValues = {}
+
+    if (doAsk || action === 'forever') {
+      defaultValues.expiration = 14
+      defaultValues.expirationUnit = 'd'
+      if (action === 'forever') {
+        defaultValues.forever = true
+      }
+    } else {
+      const unit = action.replace(/[0-9,.]+/, '')
+      const value = action.replace(/[^0-9,.]+/, '')
+      defaultValues.expiration = value
+      defaultValues.expirationUnit = unit
+    }
+
+    return {
+      showing: false,
+      forever: false,
+      dontAskAgain: false,
+      ...defaultValues
+    }
+  },
+  components: {
+    ConfirmModal,
+    Select,
+    Checkbox
+  },
+  props: {
+    isMute: Boolean,
+    user: Object
+  },
+  computed: {
+    shouldConfirm () {
+      if (this.isMute) {
+        return this.$store.getters.mergedConfig.onMuteDefaultAction === 'ask'
+      } else {
+        return this.$store.getters.mergedConfig.onBlockDefaultAction === 'ask'
+      }
+    },
+    expiryString () {
+      return this.expiration.toString() + this.expirationUnit
+    },
+    expirySeconds () {
+      return Math.floor(durationStrToMs(this.expiryString) / 1000)
+    },
+    requestBody () {
+      const object = { id: this.user.id }
+      if (!this.forever) {
+        object.expiresIn = this.expirySeconds
+      }
+      return object
+    }
+  },
+  watch: {
+    expiration (newVal) {
+      if (newVal <= 0) {
+        this.expiration = 1
+      }
+    }
+  },
+  methods: {
+    optionallyPrompt () {
+      if (this.shouldConfirm) {
+        this.showing = true
+      } else {
+        this.accept()
+      }
+    },
+    accept () {
+      if (this.isMute) {
+        this.$store.dispatch('muteUser', this.requestBody)
+        if (this.dontAskAgain) {
+          this.$store.dispatch('setOption', { name: 'onMuteDefaultAction', value: this.expiryString })
+        }
+      } else {
+        this.$store.dispatch('blockUser', this.requestBody)
+        if (this.dontAskAgain) {
+          this.$store.dispatch('setOption', { name: 'onBlockDefaultAction', value: this.expiryString })
+        }
+      }
+      this.showing = false
+    },
+    cancel () {
+      this.showing = false
+    }
+  }
+}
+
+export default UserTimedFilterModal
diff --git a/src/components/user_timed_filter_modal/user_timed_filter_modal.scss b/src/components/user_timed_filter_modal/user_timed_filter_modal.scss
new file mode 100644
index 000000000..24388868f
--- /dev/null
+++ b/src/components/user_timed_filter_modal/user_timed_filter_modal.scss
@@ -0,0 +1,13 @@
+.UserTimedFilterModal {
+  .input-dont-ask-again {
+    margin-left: 1em;
+  }
+
+  .input-expire-at {
+    margin-left: 0.25em;
+  }
+
+  .footer-left-checkbox {
+    width: max-content;
+  }
+}
diff --git a/src/components/user_timed_filter_modal/user_timed_filter_modal.vue b/src/components/user_timed_filter_modal/user_timed_filter_modal.vue
new file mode 100644
index 000000000..91c05ad77
--- /dev/null
+++ b/src/components/user_timed_filter_modal/user_timed_filter_modal.vue
@@ -0,0 +1,86 @@
+<template>
+  <confirm-modal
+    v-if="showing"
+    class="UserTimedFilterModal"
+    :title="$t(isMute ? $t('user_card.mute') : $t('user_card.block'))"
+    :confirm-text="$t(isMute ? 'user_card.mute_confirm_accept_button' : 'user_card.block_confirm_accept_button')"
+    :cancel-text="$t(isMute ? 'user_card.mute_confirm_cancel_button' : 'user_card.block_confirm_cancel_button')"
+    @accepted="accept"
+    @cancelled="cancel"
+  >
+    <p>
+      {{ $t(isMute ? 'user_card.expire_mute_message' : 'user_card.expire_block_message', [user.screen_name]) }}
+    </p>
+    <p>
+      {{ $t('user_card.expire_in') }}
+      <input
+        id="userFilterExpires"
+        v-model="expiration"
+        class="input input-expire-in"
+        :class="{ disabled: forever }"
+        :disabled="forever"
+        min="1"
+        type="number"
+      >
+      <Select
+        id="userFilterExpiresUnit"
+        v-model="expirationUnit"
+        class="input unit-input unstyled"
+        :disabled="forever"
+      >
+        <option
+          key="s"
+          value="s"
+        >
+          {{ $t('time.unit.seconds_suffix') }}
+        </option>
+        <option
+          key="m"
+          value="m"
+        >
+          {{ $t('time.unit.minutes_suffix') }}
+        </option>
+        <option
+          key="h"
+          value="h"
+        >
+          {{ $t('time.unit.hours_suffix') }}
+        </option>
+        <option
+          key="d"
+          value="d"
+        >
+          {{ $t('time.unit.days_suffix') }}
+        </option>
+      </Select>
+
+      {{ $t('user_card.mute_or') }}
+
+      <Checkbox
+        id="forever"
+        v-model="forever"
+        name="forever"
+        class="input-forever"
+      >
+        {{ $t('user_card.mute_block_never') }}
+      </Checkbox>
+    </p>
+
+    <template #footerLeft>
+      <div class="footer-left-checkbox">
+        <Checkbox
+          id="dontAskAgain"
+          v-model="dontAskAgain"
+          name="dontAskAgain"
+          class="input-dont-ask-again"
+        >
+          {{ $t(isMute ? 'user_card.dont_ask_again_mute' : 'user_card.dont_ask_again_block') }}
+        </Checkbox>
+      </div>
+    </template>
+  </confirm-modal>
+</template>
+
+<script src="./user_timed_filter_modal.js"></script>
+
+<style lang="scss" src="./user_timed_filter_modal.scss" />
diff --git a/src/components/video_attachment/video_attachment.js b/src/components/video_attachment/video_attachment.js
index 107b89855..c7110f79f 100644
--- a/src/components/video_attachment/video_attachment.js
+++ b/src/components/video_attachment/video_attachment.js
@@ -1,4 +1,3 @@
-
 const VideoAttachment = {
   props: ['attachment', 'controls'],
   data () {
@@ -25,7 +24,7 @@ const VideoAttachment = {
       }
       this.$emit('play')
     },
-    onPaused (e) {
+    onPaused () {
       this.$emit('pause')
     },
     setHasAudio (e) {
diff --git a/src/components/who_to_follow/who_to_follow.js b/src/components/who_to_follow/who_to_follow.js
index 53f05272a..9a3bd9e42 100644
--- a/src/components/who_to_follow/who_to_follow.js
+++ b/src/components/who_to_follow/who_to_follow.js
@@ -15,7 +15,7 @@ const WhoToFollow = {
   },
   methods: {
     showWhoToFollow (reply) {
-      reply.forEach((i, index) => {
+      reply.forEach((i) => {
         this.$store.state.api.backendInteractor.fetchUser({ id: i.acct })
           .then((externalUser) => {
             if (!externalUser.error) {
diff --git a/src/components/who_to_follow/who_to_follow.vue b/src/components/who_to_follow/who_to_follow.vue
index 56543d91b..7cb4d4766 100644
--- a/src/components/who_to_follow/who_to_follow.vue
+++ b/src/components/who_to_follow/who_to_follow.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="panel panel-default">
     <div class="panel-heading">
-      {{ $t('who_to_follow.who_to_follow') }}
+      <h1 class="title">
+        {{ $t('who_to_follow.who_to_follow') }}
+      </h1>
     </div>
     <div class="panel-body">
       <FollowCard
diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.js b/src/components/who_to_follow_panel/who_to_follow_panel.js
index f19ba9481..004f6e7db 100644
--- a/src/components/who_to_follow_panel/who_to_follow_panel.js
+++ b/src/components/who_to_follow_panel/who_to_follow_panel.js
@@ -54,7 +54,7 @@ const WhoToFollowPanel = {
     }
   },
   watch: {
-    user: function (user, oldUser) {
+    user: function () {
       if (this.suggestionsEnabled) {
         getWhoToFollow(this)
       }
@@ -62,7 +62,7 @@ const WhoToFollowPanel = {
   },
   mounted:
     function () {
-      this.usersToFollow = new Array(3).fill().map(x => (
+      this.usersToFollow = new Array(3).fill().map(() => (
         {
           img: this.$store.state.instance.defaultAvatar,
           name: '',
diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.vue b/src/components/who_to_follow_panel/who_to_follow_panel.vue
index 0fecec0bd..92d6f6d7c 100644
--- a/src/components/who_to_follow_panel/who_to_follow_panel.vue
+++ b/src/components/who_to_follow_panel/who_to_follow_panel.vue
@@ -2,9 +2,9 @@
   <div class="who-to-follow-panel">
     <div class="panel panel-default base01-background">
       <div class="panel-heading timeline-heading base02-background base04">
-        <div class="title">
+        <h1 class="title">
           {{ $t('who_to_follow.who_to_follow') }}
-        </div>
+        </h1>
       </div>
       <div class="who-to-follow">
         <p
diff --git a/src/hocs/with_load_more/with_load_more.scss b/src/hocs/with_load_more/with_load_more.scss
index 524e4012f..6b007ac2e 100644
--- a/src/hocs/with_load_more/with_load_more.scss
+++ b/src/hocs/with_load_more/with_load_more.scss
@@ -1,6 +1,6 @@
 .with-load-more {
   &-footer {
-    padding: 10px;
+    padding: 0.9em;
     text-align: center;
     border-top: 1px solid;
     border-top-color: var(--border);
diff --git a/src/hocs/with_subscription/with_subscription.scss b/src/hocs/with_subscription/with_subscription.scss
index 996045b43..8c0af336c 100644
--- a/src/hocs/with_subscription/with_subscription.scss
+++ b/src/hocs/with_subscription/with_subscription.scss
@@ -1,6 +1,6 @@
 .with-subscription {
   &-loading {
-    padding: 10px;
+    padding: 0.7em;
     text-align: center;
 
     .error {
diff --git a/src/i18n/compare b/src/i18n/compare
index 4dc1e47df..94e5aab55 100755
--- a/src/i18n/compare
+++ b/src/i18n/compare
@@ -2,23 +2,23 @@
 const arg = process.argv[2]
 
 if (typeof arg === 'undefined') {
-  console.log('This is a very simple and tiny tool that checks en.json with any other language and')
-  console.log('outputs all the things present in english but missing in foreign language.')
-  console.log('')
-  console.log('Usage: ./compare.js <lang> ')
-  console.log('       or')
-  console.log('       node ./compare.js <lang>')
-  console.log('')
-  console.log('Where <lang> is name of .json file containing language. For ./fi.json it should be:')
-  console.log('      ./compare.js fi ')
-  console.log('')
-  console.log('Limitations: ')
-  console.log('* This program does not work with languages left over in messages.js')
-  console.log('* This program does not check for extra strings present in foreign language but missing')
-  console.log('  in english.js (for now)')
-  console.log('')
-  console.log('There are no other arguments or options. Make an issue if you encounter a bug or want')
-  console.log('some feature to be implemented. Merge requests are welcome as well.')
+  console.info('This is a very simple and tiny tool that checks en.json with any other language and')
+  console.info('outputs all the things present in english but missing in foreign language.')
+  console.info('')
+  console.info('Usage: ./compare.js <lang> ')
+  console.info('       or')
+  console.info('       node ./compare.js <lang>')
+  console.info('')
+  console.info('Where <lang> is name of .json file containing language. For ./fi.json it should be:')
+  console.info('      ./compare.js fi ')
+  console.info('')
+  console.info('Limitations: ')
+  console.info('* This program does not work with languages left over in messages.js')
+  console.info('* This program does not check for extra strings present in foreign language but missing')
+  console.info('  in english.js (for now)')
+  console.info('')
+  console.info('There are no other arguments or options. Make an issue if you encounter a bug or want')
+  console.info('some feature to be implemented. Merge requests are welcome as well.')
   process.exit()
 }
 
@@ -35,10 +35,10 @@ function walker (a, b, path = []) {
     const article = aType[0] === 'o' ? 'an' : 'a'
 
     if (bType === 'undefined') {
-      console.log(`Foreign language is missing ${article} ${aType} at path ${currentPath.join('.')}`)
+      console.warn(`Foreign language is missing ${article} ${aType} at path ${currentPath.join('.')}`)
     } else if (aType === 'object') {
       if (bType !== 'object') {
-        console.log(`Type mismatch! English has ${aType} while foreign has ${bType} at path ${currentPath.join['.']}`)
+        console.warn(`Type mismatch! English has ${aType} while foreign has ${bType} at path ${currentPath.join['.']}`)
       } else {
         walker(aVal, bVal, currentPath)
       }
diff --git a/src/i18n/en.json b/src/i18n/en.json
index c86bdbabd..05a2d5ae5 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -30,7 +30,8 @@
         "media_nsfw_desc": "This instance forces media to be set sensitive in posts on the following instances:"
       }
     },
-    "staff": "Staff"
+    "staff": "Staff",
+    "terms": "Terms of Service"
   },
   "announcements": {
     "page_header": "Announcements",
@@ -116,6 +117,7 @@
     "flash_security": "Note that this can be potentially dangerous since Flash content is still arbitrary code.",
     "flash_fail": "Failed to load flash content, see console for details.",
     "scope_in_timeline": {
+      "local": "Non-federated",
       "direct": "Direct",
       "private": "Followers-only",
       "public": "Public",
@@ -130,6 +132,7 @@
   },
   "importer": {
     "submit": "Submit",
+    "import": "Import",
     "success": "Imported successfully.",
     "error": "An error occured while importing this file."
   },
@@ -170,6 +173,7 @@
     "interactions": "Interactions",
     "dms": "Direct messages",
     "public_tl": "Public timeline",
+    "bubble": "Bubble timeline",
     "timeline": "Timeline",
     "home_timeline": "Home timeline",
     "twkn": "Known Network",
@@ -192,7 +196,8 @@
     "mobile_notifications_close": "Close notifications",
     "mobile_notifications_mark_as_seen": "Mark all as seen",
     "announcements": "Announcements",
-    "quotes": "Quotes"
+    "quotes": "Quotes",
+    "drafts": "Drafts"
   },
   "notifications": {
     "broken_favorite": "Unknown status, searching for it…",
@@ -229,8 +234,10 @@
     "single_choice": "Single choice",
     "multiple_choices": "Multiple choices",
     "expiry": "Poll age",
+    "expires_at": "Poll ends {0}",
     "expires_in": "Poll ends in {0}",
     "expired": "Poll ended {0} ago",
+    "expired_at": "Poll ended {0}",
     "not_enough_options": "Too few unique options in poll",
     "non_anonymous": "Public poll",
     "non_anonymous_title": "Other instances may display the options you voted for"
@@ -285,7 +292,8 @@
       "text/plain": "Plain text",
       "text/html": "HTML",
       "text/markdown": "Markdown",
-      "text/bbcode": "BBCode"
+      "text/bbcode": "BBCode",
+      "text/x.misskeymarkdown": "MFM"
     },
     "content_type_selection": "Post format",
     "content_warning": "Subject (optional)",
@@ -311,7 +319,18 @@
       "private": "Followers-only - post to followers only",
       "public": "Public - post to public timelines",
       "unlisted": "Unlisted - do not post to public timelines"
-    }
+    },
+    "close_confirm_title": "Closing post form",
+    "close_confirm": "What do you want to do with your current writing?",
+    "close_confirm_save_button": "Save",
+    "close_confirm_discard_button": "Discard",
+    "close_confirm_continue_composing_button": "Continue composing",
+    "auto_save_nothing_new": "Nothing new to save.",
+    "auto_save_saved": "Saved.",
+    "auto_save_saving": "Saving...",
+    "save_to_drafts_button": "Save to drafts",
+    "save_to_drafts_and_close_button": "Save to drafts and close",
+    "more_post_actions": "More post actions..."
   },
   "registration": {
     "bio_optional": "Bio (optional)",
@@ -369,20 +388,30 @@
     "actor_type": "This account is:",
     "actor_type_description": "Marking your account as a group will make it automatically repeat statuses that mention it.",
     "actor_type_Person": "a normal user",
+    "actor_type_person_proper": "a person",
     "actor_type_Service": "a bot",
     "actor_type_Group": "a group",
+    "mobile_center_dialog": "Vertically center dialogs on mobile",
     "app_name": "App name",
     "expert_mode": "Show advanced",
     "save": "Save changes",
+    "reset": "Reset changes",
     "security": "Security",
+    "toggle_edit": "Edit",
+    "change_banner": "Change banner",
+    "change_avatar": "Change avatar",
     "setting_changed": "Setting is different from default",
     "setting_server_side": "This setting is tied to your profile and affects all sessions and clients",
     "enter_current_password_to_confirm": "Enter your current password to confirm your identity",
     "post_look_feel": "Posts Look & Feel",
-    "mention_links": "Mention links",
+    "posts": "Posts",
+    "developer": "Developer",
+    "debug": "Debug",
+    "mention_links": "Mention Links",
     "appearance": "Appearance",
     "confirm_new_setting": "Confirm new setting?",
     "confirm_new_question": "Does this look ok? Setting will be reverted in 10 seconds.",
+    "confirm_new_question_countdown": "Does this look ok? Setting will be reverted in 1 second. | Does this look ok? Setting will be reverted in {count} seconds.",
     "revert": "Revert",
     "confirm": "Confirm",
     "text_size": "Text and interface size",
@@ -392,8 +421,48 @@
     "navbar_size": "Top bar size",
     "panel_header_size": "Panel header size",
     "visual_tweaks": "Minor visual tweaks",
-    "theme_debug": "Show what background theme engine assumes when dealing with transparancy (DEBUG)",
+    "theme_debug": "Show what background theme engine assumes when dealing with transparancy",
     "scale_and_layout": "Interface scale and layout",
+    "timelines": "Timelines",
+    "format_and_language": "Format and Language",
+    "confirmations": "Confirmations",
+    "layout": "Layout",
+    "enabled": "Enabled",
+    "clutter": "Clutter",
+    "filter": {
+      "clutter": "Remove clutter",
+      "mute_filter": "Mute Filters",
+      "type": "Filter type",
+      "regexp": "RegExp",
+      "plain": "Simple",
+      "user": "User (Simple)",
+      "user_regexp": "User (RegExp)",
+      "hide": "Hide completely",
+      "name": "Name",
+      "value": "Value",
+      "expires": "Expires",
+      "expired": "Expired",
+      "copy": "Duplicate",
+      "save": "Save",
+      "delete": "Remove",
+      "new": "Create new",
+      "import": "Import",
+      "export": "Export",
+      "regexp_error": "Invalid Regular Expression",
+      "never_expires": "Never",
+      "total_count": "Total {count} custom filter|Total {count} custom filters",
+      "expired_count": "{count} expired filter|{count} expired filters",
+      "custom_filters": "Custom filters",
+      "purge_expired": "Remove expired filters",
+      "import_failure": "The selected file is not a supported Pleroma filter.",
+      "help": {
+        "word": "Simple and RegExp filters test against post's content and subject.",
+        "user": "User filter matches full user handle (user{'@'}domain) in the following: author, reply-to and mentions",
+        "regexp": "Regex variants are more advanced and use {link} to match instead of simple substring search.",
+        "regexp_link": "Regular Expressions",
+        "regexp_url": "https://en.wikipedia.org/wiki/Regular_expression"
+      }
+    },
     "mfa": {
       "otp": "OTP",
       "setup_otp": "Setup OTP",
@@ -427,11 +496,14 @@
     "allow_following_move": "Allow auto-follow when following account moves",
     "attachmentRadius": "Attachments",
     "attachments": "Attachments",
+    "image_compression": "Compress images before uploading",
+    "always_use_jpeg": "Always convert images to JPEG format",
     "avatar": "Avatar",
     "avatarAltRadius": "Avatars (notifications)",
     "avatarRadius": "Avatars",
     "background": "Background",
     "bio": "Bio",
+    "profile_other": "Other",
     "email_language": "Language for receiving emails from the server",
     "block_export": "Block export",
     "block_export_button": "Export your blocks to a csv file",
@@ -471,6 +543,7 @@
     "chatMessageRadius": "Chat message",
     "collapse_subject": "Collapse posts with subjects",
     "composing": "Composing",
+    "replies": "Replying",
     "confirm_new_password": "Confirm new password",
     "current_password": "Current password",
     "confirm_dialogs": "Ask for confirmation when",
@@ -478,6 +551,8 @@
     "confirm_dialogs_unfollow": "unfollowing a user",
     "confirm_dialogs_block": "blocking a user",
     "confirm_dialogs_mute": "muting a user",
+    "confirm_dialogs_mute_domain": "muting domains",
+    "confirm_dialogs_mute_conversation": "muting conversations",
     "confirm_dialogs_delete": "deleting a status",
     "confirm_dialogs_logout": "logging out",
     "confirm_dialogs_approve_follow": "approving a follower",
@@ -505,13 +580,22 @@
     "move_account_error": "Error moving account: {error}",
     "discoverable": "Allow discovery of this account in search results and other services",
     "domain_mutes": "Domains",
-    "avatar_size_instruction": "The recommended minimum size for avatar images is 150x150 pixels.",
+    "avatar_size_instruction": "The recommended minimum size for avatar images is 150x150 pixels. Recommended aspect ratio is 1:1",
+    "banner_size_instruction": "The recommended minimum size for banner images is 450x150 pixels. Recommended aspect ratio is 3:1",
     "pad_emoji": "Pad emoji with spaces when adding from picker",
     "autocomplete_select_first": "Automatically select the first candidate when autocomplete results are available",
+    "unsaved_post_action": "When you try to close an unsaved posting form",
+    "unsaved_post_action_save": "Save it to drafts",
+    "unsaved_post_action_discard": "Discard it",
+    "unsaved_post_action_confirm": "Ask every time",
+    "auto_save_draft": "Save drafts as you compose",
     "emoji_reactions_on_timeline": "Show emoji reactions on timeline",
     "emoji_reactions_scale": "Reactions scale factor",
     "absolute_time_format": "Use absolute time format",
     "absolute_time_format_min_age": "Only use for time older than this amount of time",
+    "absolute_time_format_12h": "Time format",
+    "absolute_time_format_12h_12h": "12 hour format (i.e. 10:00 PM)",
+    "absolute_time_format_12h_24h": "24 hour format (i.e. 22:00)",
     "export_theme": "Save preset",
     "filtering": "Filtering",
     "wordfilter": "Wordfilter",
@@ -521,6 +605,12 @@
     "follow_export_button": "Export your follows to a csv file",
     "follow_import": "Follow import",
     "follow_import_error": "Error importing followers",
+    "import_export": {
+      "title": "Import / Export",
+      "follows": "List of users you follow",
+      "blocks": "List of users you block",
+      "mutes": "List of users you mute"
+    },
     "follows_imported": "Follows imported! Processing them will take a while.",
     "accent": "Accent",
     "foreground": "Foreground",
@@ -547,6 +637,7 @@
     "hide_post_stats": "Hide post statistics (e.g. the number of favorites)",
     "hide_user_stats": "Hide user statistics (e.g. the number of followers)",
     "hide_filtered_statuses": "Hide all filtered posts",
+    "hide_muted_statuses": "Completely hide all muted posts",
     "hide_wordfiltered_statuses": "Hide word-filtered statuses",
     "hide_muted_threads": "Hide muted threads",
     "import_blocks_from_a_csv_file": "Import blocks from a csv file",
@@ -590,6 +681,7 @@
       "label": "Birthday",
       "show_birthday": "Show my birthday"
     },
+    "account_profile_edit": "Edit Profile",
     "account_privacy": "Privacy",
     "use_contain_fit": "Don't crop the attachment in thumbnails",
     "name": "Name",
@@ -655,8 +747,10 @@
     "minimal_scopes_mode": "Minimize post scope selection options",
     "set_new_avatar": "Set new avatar",
     "set_new_profile_background": "Set new profile background",
+    "set_new_background": "Set new background",
     "set_new_profile_banner": "Set new profile banner",
     "reset_avatar": "Reset avatar",
+    "reset_banner": "Reset banner",
     "reset_profile_background": "Reset profile background",
     "reset_profile_banner": "Reset profile banner",
     "reset_avatar_confirm": "Do you really want to reset the avatar?",
@@ -668,7 +762,7 @@
     "subject_line_email": "Like email: \"re: subject\"",
     "subject_line_mastodon": "Like mastodon: copy as is",
     "subject_line_noop": "Do not copy",
-    "force_theme_recompilation_debug": "Disable theme cahe, force recompile on each boot (DEBUG)",
+    "force_theme_recompilation_debug": "Disable theme cahe, force recompile on each boot",
     "conversation_display": "Conversation display style",
     "conversation_display_tree": "Tree-style",
     "conversation_display_tree_quick": "Tree view",
@@ -683,6 +777,9 @@
     "column_sizes_sidebar": "Sidebar",
     "column_sizes_content": "Content",
     "column_sizes_notifs": "Notifications",
+    "layout": "Layout",
+    "scale_and_font": "Scale and Font",
+    "theme_editor_min_width": "Minimum width of theme editor (0 for \"fit-content\")",
     "tree_advanced": "Allow more flexible navigation in tree view",
     "tree_fade_ancestors": "Display ancestors of the current status in faint text",
     "conversation_display_linear": "Linear-style",
@@ -692,6 +789,7 @@
     "conversation_other_replies_button_inside": "Inside statuses",
     "max_depth_in_thread": "Maximum number of levels in thread to display by default",
     "post_status_content_type": "Post status content type",
+    "default_post_status_content_type": "Default post status content type",
     "sensitive_by_default": "Mark posts as sensitive by default",
     "stop_gifs": "Pause animated images until you hover on them",
     "streaming": "Automatically show new posts when scrolled to the top",
@@ -701,12 +799,15 @@
     "use_websockets": "Use websockets (Realtime updates)",
     "text": "Text",
     "theme": "Theme",
+    "theme_old": "Theme editor (old)",
     "theme_help": "Use hex color codes (#rrggbb) to customize your color theme.",
     "theme_help_v2_1": "You can also override certain component's colors and opacity by toggling the checkbox, use \"Clear all\" button to clear all overrides.",
     "theme_help_v2_2": "Icons underneath some entries are background/text contrast indicators, hover over for detailed info. Please keep in mind that when using transparency contrast indicators show the worst possible case.",
     "tooltipRadius": "Tooltips/alerts",
     "type_domains_to_mute": "Search domains to mute",
     "upload_a_photo": "Upload a photo",
+    "upload_picture": "Upload picture",
+    "select_picture": "Select picture",
     "user_settings": "User Settings",
     "values": {
       "false": "no",
@@ -728,8 +829,13 @@
     "user_popover_avatar_action_close": "Close the popover",
     "user_popover_avatar_action_open": "Open profile",
     "user_popover_avatar_overlay": "Show user popover over user avatar",
+    "user_card_left_justify": "Justify user bio to the left",
+    "user_card_hide_personal_marks": "Hide personal marks (highlight/note) in user profiles",
+    "posts_appearance": "Posts Appearance",
     "fun": "Fun",
     "greentext": "Meme arrows",
+    "plaintext_quotes": "Highlight plaintext {0}",
+    "greentext_quotes": ">quotes",
     "show_yous": "Show (You)s",
     "notifications": "Notifications",
     "notification_setting_annoyance": "Annoyance",
@@ -749,12 +855,84 @@
     "enable_web_push_always_show_tip": "Some browsers (Chromium, Chrome) require that push messages always result in a notification, otherwise generic 'Website was updated in background' is shown, enable this to prevent this notification from showing, as Chrome seem to hide push notifications if tab is in focus. Can result in showing duplicate notifications on other browsers.",
     "more_settings": "More settings",
     "style": {
+      "style_section": "Style",
       "custom_theme_used": "(Custom theme)",
+      "custom_style_used": "(Custom style)",
+      "stock_theme_used": "(Stock theme)",
       "themes2_outdated": "Editor for Themes V2 is being phased out and will eventually be replaced with a new one that takes advantage of new Themes V3 engine. It should still work but experience might be degraded and inconsistent.",
       "appearance_tab_note": "Changes on this tab do not affect the theme used, so exported theme will be different from what seen in the UI",
+      "visual_tweaks_section_note": "Changes in this section do not affect the theme used, exported theme will be different from what seen in the UI",
       "update_preview": "Update preview",
       "themes3": {
         "define": "Override",
+        "palette": {
+          "label": "Color schemes",
+          "name_label": "Color scheme name",
+          "import": "Import palette",
+          "export": "Export palette",
+          "apply": "Apply palette",
+          "bg": "Panel background",
+          "fg": "Buttons etc.",
+          "text": "Text",
+          "link": "Links",
+          "accent": "Accent color",
+          "cRed": "Red color",
+          "cBlue": "Blue color",
+          "cGreen": "Green color",
+          "cOrange": "Orange color",
+          "wallpaper": "Wallpaper",
+          "v2_unsupported": "Older v2 themes don't support palettes. Switch to v3 theme to make use of palettes",
+          "bundled": "Bundled palettes",
+          "style": "Palettes provided by selected style",
+          "user": "Custom palette",
+          "imported": "Imported"
+        },
+        "editor": {
+          "title": "Style editor",
+          "reset_style": "Reset",
+          "load_style": "Open from file",
+          "save_style": "Save",
+          "style_name": "Stylesheet name",
+          "style_author": "Made by",
+          "style_license": "License",
+          "style_website": "Website",
+          "component_selector": "Component",
+          "variant_selector": "Variant",
+          "states_selector": "States",
+          "main_tab": "Main",
+          "shadows_tab": "Shadows",
+          "background": "Background color",
+          "text_color": "Text color",
+          "icon_color": "Icon color",
+          "link_color": "Link color",
+          "contrast": "Text contrast",
+          "roundness": "Roundness",
+          "opacity": "Opacity",
+          "border_color": "Border color",
+          "include_in_rule": "Add to rule",
+          "test_string": "TEST",
+          "invalid": "Invalid",
+          "refresh_preview": "Refresh preview",
+          "apply_preview": "Apply",
+          "text_auto": {
+            "label": "Auto-contrast",
+            "no-preserve": "Black or White",
+            "preserve": "Keep color",
+            "no-auto": "Disabled"
+          },
+          "component_tab": "Components style",
+          "palette_tab": "Color schemes",
+          "variables_tab": "Variables (Advanced)",
+          "variables": {
+            "label": "Variables",
+            "name_label": "Name:",
+            "type_label": "Type:",
+            "type_shadow": "Shadow",
+            "type_color": "Color",
+            "type_generic": "Generic",
+            "virtual_color": "Variable color value"
+          }
+        },
         "hacks": {
           "underlay_overrides": "Change underlay",
           "underlay_override_mode_none": "Theme default",
@@ -781,7 +959,8 @@
           "lookup_local_fonts": "Load list of fonts installed on this computer",
           "enter_manually": "Enter font name family manually",
           "entry": "Enter {fontFamily}",
-          "select": "Select font"
+          "select": "Select font",
+          "label": "{label} font"
         }
       },
       "interface_font_user_override": "Override theme/browser font used",
@@ -877,11 +1056,18 @@
         "override": "Override",
         "shadow_id": "Shadow #{value}",
         "offset": "Shadow offset",
+        "zoom": "Zoom",
+        "offset-x": "x:",
+        "offset-y": "y:",
         "light_grid": "Use light checkerboard",
+        "color_override": "Use different color",
         "name": "Name",
         "blur": "Blur",
         "spread": "Spread",
         "inset": "Inset",
+        "raw": "Plain shadow",
+        "expression": "Expression (advanced)",
+        "empty_expression": "Empty expression",
         "hintV3": "For shadows you can also use the {0} notation to use other color slot.",
         "filter_hint": {
           "always_drop_shadow": "Warning, this shadow always uses {0} when browser supports it.",
@@ -914,6 +1100,13 @@
           "post": "Post text",
           "monospace": "Monospaced text"
         },
+        "components_inline": {
+          "interface": "interface",
+          "input": "input fields",
+          "post": "post text",
+          "monospace": "monospaced text"
+        },
+        "override": "Override {0} font",
         "family": "Font name",
         "size": "Size (in px)",
         "weight": "Weight (boldness)",
@@ -944,7 +1137,10 @@
     "reset_value": "Reset",
     "reset_value_tooltip": "Reset draft",
     "hard_reset_value": "Hard reset",
-    "hard_reset_value_tooltip": "Remove setting from storage, forcing use of default value"
+    "hard_reset_value_tooltip": "Remove setting from storage, forcing use of default value",
+    "cache": "Cache",
+    "clear_asset_cache": "Clear asset cache",
+    "clear_emoji_cache": "Clear emoji cache"
   },
   "admin_dash": {
     "window_title": "Administration",
@@ -957,7 +1153,80 @@
       "instance": "Instance",
       "limits": "Limits",
       "frontends": "Front-ends",
-      "emoji": "Emoji"
+      "mailer": "EMails",
+      "media_proxy": "Media Proxy",
+      "emoji": "Emoji",
+      "uploads": "Uploads",
+      "monitoring": "Monitoring",
+      "registrations": "Registrations",
+      "links": "Links",
+      "job_queues": "Job Queues",
+      "auth": "Auth",
+      "posts": "Posts",
+      "rate_limit": "Rate Limits",
+      "http": "HTTP",
+      "federation": "Federation",
+      "other": "Other"
+    },
+    "posts": {
+      "global": "Global settings",
+      "local": "Local posts",
+      "remote": "Remote posts"
+    },
+    "other": {
+      "uncategorized": "Uncategorized",
+      "user_backup": "User Backup",
+      "reports": "Reports",
+      "privileges": "Privileges"
+    },
+    "monitoring": {
+      "builtins": "Built-in Tools",
+      "prometheus": "Prometheus Exporter"
+    },
+    "federation": {
+      "global": "Global settings",
+      "restrictions": "Restrictions",
+      "activitypub": "ActivityPub"
+    },
+    "http": {
+      "outbound": "Outbound HTTP requests"
+    },
+    "auth": {
+      "MFA": "Multi-factor Authentication",
+      "LDAP": "LDAP Settings",
+      "OAuth": "Oauth2 settings",
+      "TOTP": "One-time Passwords (TOTP)",
+      "backup_codes": "Backup codes"
+    },
+    "job_queues": {
+      "Gun": {
+        "title": "Gun queues",
+        "connections_pools": "Gun connections pool",
+        "pools": {
+          "title": "Gun worker pools",
+          "default": "Default pool",
+          "federation": "Federation pool",
+          "media": "Media pool",
+          "rich_media": "Rich media pool",
+          "upload": "Upload pool"
+        }
+      },
+      "Hackney": {
+        "title": "Hackney pools",
+        "federation": "Federation",
+        "media": "Media",
+        "rich_media": "Rich media",
+        "upload": "Upload"
+      },
+      "queues": "Queues"
+    },
+    "rate_limit": {
+      "rate_limit": "Rate Limit",
+      "amount": "Amount",
+      "unauthenticated": "Unauthenticated",
+      "authenticated": "Authenticated",
+      "period": "Time period",
+      "separate": "Separate rate limits for authenticated/unauthenticated users"
     },
     "nodb": {
       "heading": "Database config is disabled",
@@ -969,29 +1238,79 @@
       "native": "Native",
       "kocaptcha": "KoCaptcha"
     },
+    "http": {
+      "outbound": "Outgoing connections",
+      "incoming": "Incoming connections",
+      "security": "HTTP Security",
+      "web_push": "Web Push",
+      "web_push_description": "Web Push VAPID settings. You can use the mix task web_push.gen.keypair to generate it."
+    },
     "instance": {
       "instance": "Instance information",
+      "branding": "Branding",
       "registrations": "User sign-ups",
       "captcha_header": "CAPTCHA",
       "kocaptcha": "KoCaptcha settings",
       "access": "Instance access",
+      "rich_metadata": "Metadata",
       "restrict": {
         "header": "Restrict access for anonymous visitors",
         "description": "Detailed setting for allowing/disallowing access to certain aspects of API. By default (indeterminate state) it will disallow if instance is not public, ticked checkbox means disallow access even if instance is public, unticked means allow access even if instance is private. Please note that unexpected behavior might happen if some settings are set, i.e. if profile access is disabled posts will show without profile information.",
         "timelines": "Timelines access",
         "profiles": "User profiles access",
         "activities": "Statuses/activities access"
-      }
+      },
+      ":unauthenticated": "Unauthenticated",
+      ":all": "Everyone"
+    },
+    "registrations": {
+      "welcome": {
+        "title": "Welcome message",
+        "description": "Send new users a message when they sign up",
+        "direct_message": "Via direct message",
+        "chat_message": "Via chat",
+        "email_message": "Via email"
+      },
+      "restrictions": "Restrictions",
+      "autofollow": "Autofollow"
+    },
+    "links": {
+      "no_scheme": "No scheme",
+      "link_previews": "Link previews",
+      "link_formatter": "Link formatter"
+    },
+    "uploads": {
+      "attachments": "Attachments settings",
+      "upload": "Upload",
+      "local_uploader": "Local files",
+      "filenames": "Filenames, Titles and Descriptions",
+      "uploader_settings": "Uploader settings"
+    },
+    "media_proxy": {
+      "basic": "Basic Settings",
+      "invalidation": "Cache Invalidation",
+      "limits": "Limits",
+      "thumbnails": "Thumbnail Generation",
+      "invalidation_settings": "Cache Invalidation"
+    },
+    "mailer": {
+      "styling": "Styling",
+      "assets": "Assets",
+      "colors": "Color palette",
+      "adapter": "Mailing Adapter",
+      "auth": "Authentication"
     },
     "limits": {
       "arbitrary_limits": "Arbitrary limits",
       "posts": "Post limits",
+      "other": "Misc. limits",
       "uploads": "Attachments limits",
       "users": "User profile limits",
       "profile_fields": "Profile fields limits",
       "user_uploads": "Profile media limits"
     },
     "frontend": {
+      "title": "Frontend management",
       "repository": "Repository link",
       "versions": "Available versions",
       "build_url": "Build URL",
@@ -1015,7 +1334,11 @@
     "emoji": {
       "global_actions": "Global actions",
       "reload": "Reload emoji",
+      "reload_short": "Refresh",
+      "advanced": "Advanced",
       "importFS": "Import emoji from filesystem",
+      "import_pack": "Upload emoji pack",
+      "import_pack_short": "Import",
       "error": "Error: {0}",
       "create_pack": "Create pack",
       "delete_pack": "Delete pack",
@@ -1023,10 +1346,12 @@
       "create": "Create",
       "emoji_packs": "Emoji packs",
       "remote_packs": "Remote packs",
+      "remote_packs_short": "Remote",
       "do_list": "List",
       "remote_pack_instance": "Remote pack instance",
       "emoji_pack": "Emoji pack",
       "edit_pack": "Edit pack",
+      "metadata": "Metadata",
       "description": "Description",
       "homepage": "Homepage",
       "fallback_src": "Fallback source",
@@ -1041,6 +1366,8 @@
       "adding_new": "Adding new emoji",
       "shortcode": "Shortcode",
       "filename": "Filename",
+      "emoji_source": "Emoji file source",
+      "upload_url": "Upload from URL",
       "new_shortcode": "Shortcode, leave blank to infer",
       "new_filename": "Filename, leave blank to infer",
       "delete_confirm": "Are you sure you want to delete {0}?",
@@ -1051,13 +1378,105 @@
       "download_as_name_full": "New name, leave blank to reuse",
       "files": "Files",
       "editing": "Editing {0}",
+      "copying": "Copying {0}",
+      "copy_to": "Copy to",
+      "copy_to_pack": "Copy to local pack",
       "delete_title": "Delete?",
       "metadata_changed": "Metadata different from saved",
       "emoji_changed": "Unsaved emoji file changes, check highlighted emoji",
-      "replace_warning": "This will REPLACE the local pack of the same name"
+      "replace_warning": "This will REPLACE the local pack of the same name",
+      "copied_successfully": "Successfully copied emoji \"{0}\" to pack \"{1}\""
+    },
+    "generic_enforcement": {
+      "if_available": "If available",
+      "always": "Always",
+      "never": "Never"
+    },
+    "instance": {
+      "instance": "Instance information",
+      "pwa": {
+        "manifest": "PWA Manifest",
+        "optional": "(optional)",
+        "no_icons": "No icons defined",
+        "icon": {
+          "purpose": "Icon purpose",
+          "any": "Any",
+          "monochrome": "Monochrome",
+          "maskable": "Maskable"
+        }
+      },
+      "misc_brand": "Miscellaneous elements",
+      "branding": "Branding",
+      "access": "Instance access",
+      "rich_metadata": "Metadata",
+      "restrict": {
+        "header": "Restrict access for anonymous visitors",
+        "description": "Detailed setting for allowing/disallowing access to certain aspects of API. By default (indeterminate state) it will disallow if instance is not public, ticked checkbox means disallow access even if instance is public, unticked means allow access even if instance is private. Please note that unexpected behavior might happen if some settings are set, i.e. if profile access is disabled posts will show without profile information.",
+        "timelines": "Timelines access",
+        "profiles": "User profiles access",
+        "activities": "Statuses/activities access"
+      },
+      ":unauthenticated": "Unauthenticated",
+      ":all": "Everyone"
     },
     "temp_overrides": {
       ":pleroma": {
+        ":connections_pool": {
+          ":max_idle_time": {
+            "label": "Maximum idle time",
+            "description": "Maximum idle time before CONFIRM"
+          },
+          ":retry": {
+            "label": "Retry",
+            "description": "Number of retries for making a connection CONFIRM"
+          }
+        },
+        ":pools": {
+          ":rich_media": {
+            "label": "Rich media",
+            "description": "idk"
+          }
+        },
+        ":rate_limit": {
+          ":oauth_app_creation": {
+            "label": "OAuth app creation",
+            "description": "For registering new OAuth App ID"
+          },
+          ":ap_routes": {
+            "label": "ActivityPub",
+            "description": "Federation endpoints"
+          },
+          ":account_confirmation_resend": {
+            "label": "Account confirmation resend",
+            "description": "How often user can resend confirmation mail"
+          }
+        },
+        "Pleroma_DOT_Formatter": {
+          ":attribute_toggle": {
+            "label": "Set {attr} attribute"
+          },
+          ":truncate_toggle": {
+            "label": "Truncate"
+          },
+          ":class": {
+            "label": "Value"
+          },
+          ":rel": {
+            "label": "Value"
+          }
+        },
+        "Pleroma_DOT_Uploaders_DOT_Uploader": {
+          ":timeout": {
+            "label": "Timeout",
+            "description": "Amount of milliseconds before dropping connection"
+          }
+        },
+        "Pleroma_DOT_Upload": {
+          ":default_description": {
+            "label": "Default description",
+            "description": "Default description to give to a file. Setting it to ':filename' will use file's filename as description."
+          }
+        },
         ":instance": {
           ":public": {
             "label": "Instance is public",
@@ -1075,6 +1494,16 @@
             "label": "Background image",
             "description": "Background image (primarily used by PleromaFE)"
           }
+        },
+        ":http_security": {
+          ":allow_unsafe_eval": {
+            "label": "Allow unsafe-eval",
+            "description": "Allow unsafe evaluation of scripts (required for Flash support)"
+          },
+          ":report_url": {
+            "label": "Report URL",
+            "description": "URL to report security violations to"
+          }
         }
       }
     }
@@ -1083,18 +1512,25 @@
     "unit": {
       "days": "{0} day | {0} days",
       "days_short": "{0}d",
+      "days_suffix": "day(s)",
       "hours": "{0} hour | {0} hours",
       "hours_short": "{0}h",
+      "hours_suffix": "hour(s)",
       "minutes": "{0} minute | {0} minutes",
       "minutes_short": "{0}min",
+      "minutes_suffix": "minute(s)",
       "months": "{0} month | {0} months",
       "months_short": "{0}mo",
+      "months_suffix": "month(s)",
       "seconds": "{0} second | {0} seconds",
       "seconds_short": "{0}s",
+      "seconds_suffix": "second(s)",
       "weeks": "{0} week | {0} weeks",
       "weeks_short": "{0}w",
+      "weeks_suffix": "week(s)",
       "years": "{0} year | {0} years",
-      "years_short": "{0}y"
+      "years_short": "{0}y",
+      "years": "year(s)"
     },
     "in_future": "in {0}",
     "in_past": "{0} ago",
@@ -1116,7 +1552,8 @@
     "socket_reconnected": "Realtime connection established",
     "socket_broke": "Realtime connection lost: CloseEvent code {0}",
     "quick_view_settings": "Quick view settings",
-    "quick_filter_settings": "Quick filter settings"
+    "quick_filter_settings": "Quick filter settings",
+    "filter_settings": "Filter"
   },
   "status": {
     "favorites": "Favorites",
@@ -1140,14 +1577,25 @@
     "delete_confirm_accept_button": "Delete",
     "delete_confirm_cancel_button": "Keep",
     "reply_to": "Reply to",
+    "reply_to_with_icon": "{icon} {replyTo}",
+    "reply_to_with_arg": "{replyToWithIcon} {user}",
     "mentions": "Mentions",
     "replies_list": "Replies:",
     "replies_list_with_others": "Replies (+{numReplies} other): | Replies (+{numReplies} others):",
+    "mute_ellipsis": "Mute…",
+    "mute_user": "Mute user",
+    "unmute_user": "Unmute user",
+    "mute_domain": "Mute domain",
+    "unmute_domain": "Unmute domain",
     "mute_conversation": "Mute conversation",
     "unmute_conversation": "Unmute conversation",
     "status_unavailable": "Status unavailable",
     "copy_link": "Copy link to status",
     "external_source": "External source",
+    "muted_words": "Wordfiltered: {word} | Wordfiltered: {word} and {numWordsMore} more words",
+    "muted_filters": "Filtered: {name} | Wordfiltered: {name} and {filtersMore} more words",
+    "multi_reason_mute": "{main} + one more reason | {main} + {numReasonsMore} more reasons",
+    "muted_user": "User muted",
     "thread_muted": "Thread muted",
     "thread_muted_and_words": ", has words:",
     "sensitive_muted": "Muting sensitive content",
@@ -1157,6 +1605,8 @@
     "show_content": "Show content",
     "hide_content": "Hide content",
     "status_deleted": "This post was deleted",
+    "unknown_user": "unknown user",
+    "unknown_user_info": "Unable to fetch information about this user",
     "nsfw": "NSFW",
     "expand": "Expand",
     "you": "(You)",
@@ -1236,8 +1686,25 @@
     "mute_confirm": "Do you really want to mute {user}?",
     "mute_confirm_accept_button": "Mute",
     "mute_confirm_cancel_button": "Do not mute",
+    "mute_or": "or",
+    "expire_in": "Expire in",
+    "expire_mute_message": "Are you sure you want to mute {0}?",
+    "expire_block_message": "Are you sure you want to block {0}?",
+    "dont_ask_again_mute": "Always mute users this way",
+    "dont_ask_again_block": "Always block users this way",
+    "mute_block_temporarily": "Temporarily",
+    "mute_block_forever": "Forever",
+    "mute_block_never": "Never",
+    "mute_block_ask": "Ask",
+    "default_mute_expiration": "Always mute users",
+    "default_block_expiration": "Always block users",
+    "default_expiration_time": "Expire in",
+    "mute_expires_forever": "Muted forever",
+    "mute_expires_at": "Muted until {0}",
+    "block_expires_forever": "Blocked forever",
+    "block_expires_at": "Blocked until {0}",
     "mute_duration_prompt": "Mute this user for (0 for indefinite time):",
-    "per_day": "per day",
+    "statuses_per_day": "Statuses per day",
     "remote_follow": "Remote follow",
     "remove_follower": "Remove follower",
     "remove_follower_confirm_title": "Remove follower confirmation",
@@ -1278,17 +1745,15 @@
       "delete_user": "Delete user",
       "delete_user_data_and_deactivate_confirmation": "This will permanently delete the data from this account and deactivate it. Are you absolutely sure?"
     },
-    "highlight": {
-      "disabled": "No highlight",
-      "solid": "Solid bg",
-      "striped": "Striped bg",
+    "highlight_new": {
+      "disabled": "Don't highlight",
+      "solid": "Solid background",
+      "striped": "Striped background",
       "side": "Side stripe"
     },
-    "note": "Note",
-    "note_blank": "(None)",
-    "edit_note": "Edit note",
-    "edit_note_apply": "Apply",
-    "edit_note_cancel": "Cancel"
+    "personal_note": "Personal note",
+    "note_blank_click": "Click to add note",
+    "highlight_header": "Highlight user's posts and mentions"
   },
   "user_profile": {
     "timeline_title": "User timeline",
@@ -1310,9 +1775,13 @@
   },
   "tool_tip": {
     "media_upload": "Upload media",
+    "mentions": "Mentions",
     "repeat": "Repeat",
+    "unrepeat": "Unrepeat",
     "reply": "Reply",
+    "add_reaction": "Add reaction",
     "favorite": "Favorite",
+    "unfavorite": "Unfavorite",
     "add_reaction": "Add Reaction",
     "user_settings": "User Settings",
     "accept_follow_request": "Accept follow request",
@@ -1371,6 +1840,9 @@
     "error_sending_message": "Something went wrong when sending the message.",
     "empty_chat_list_placeholder": "You don't have any chats yet. Start a new chat!"
   },
+  "bookmarks": {
+    "manage_bookmark_folders": "Manage bookmark folders"
+  },
   "lists": {
     "lists": "Lists",
     "new": "New List",
@@ -1413,12 +1885,25 @@
   "unicode_domain_indicator": {
     "tooltip": "This domain contains non-ascii characters."
   },
+  "drafts": {
+    "drafts": "Drafts",
+    "no_drafts": "You have no drafts",
+    "empty": "(No content)",
+    "poll_tooltip": "Draft contains a poll",
+    "continue": "Continue composing",
+    "save": "Save without posting",
+    "abandon": "Abandon draft",
+    "abandon_confirm_title": "Abandon confirmation",
+    "abandon_confirm": "Do you really want to abandon this draft?",
+    "abandon_confirm_accept_button": "Abandon",
+    "abandon_confirm_cancel_button": "Keep",
+    "replying": "Replying to {statusLink}",
+    "editing": "Editing {statusLink}",
+    "unavailable": "(unavailable)"
+  },
   "splash": {
     "loading": "Loading...",
     "theme": "Applying theme, please wait warmly...",
-    "instance": "Getting instance info...",
-    "settings": "Applying settings...",
-    "almost": "Reticulating splines...",
     "fun_1": "Drink more water",
     "fun_2": "Take it easy!",
     "fun_3": "Suya...",
diff --git a/src/i18n/fr.json b/src/i18n/fr.json
index 4d421ff13..7b3d43ca7 100644
--- a/src/i18n/fr.json
+++ b/src/i18n/fr.json
@@ -58,7 +58,7 @@
     "yes": "Oui",
     "no": "Non",
     "unpin": "Dégrafer l'élément",
-    "scroll_to_top": "Défiler au début",
+    "scroll_to_top": "Défiler vers le haut",
     "pin": "Agrafer l'élément",
     "generic_error_message": "Une erreur est apparue : {0}",
     "never_show_again": "Ne plus afficher"
@@ -110,7 +110,7 @@
     "mentions": "Mentions",
     "interactions": "Interactions",
     "dms": "Messages directs",
-    "public_tl": "Flux publique",
+    "public_tl": "Flux public",
     "timeline": "Flux personnel",
     "twkn": "Réseau connu",
     "user_search": "Recherche de comptes",
@@ -119,7 +119,7 @@
     "search": "Recherche",
     "administration": "Administration",
     "chats": "Chats",
-    "bookmarks": "Marques-Pages",
+    "bookmarks": "Marque-Pages",
     "timelines": "Flux",
     "home_timeline": "Flux personnel",
     "edit_nav_mobile": "Personnaliser la barre de navigation",
@@ -127,12 +127,14 @@
     "lists": "Listes",
     "edit_pinned": "Éditer les éléments agrafés",
     "edit_finish": "Édition terminée",
-    "mobile_sidebar": "(Dés)activer le panneau latéral",
+    "mobile_sidebar": "Basculer la barre latérale",
     "mobile_notifications_close": "Fermer les notifications",
     "search_close": "Fermer la barre de recherche",
     "announcements": "Annonces",
     "mobile_notifications_mark_as_seen": "Marquer tout comme vu",
-    "quotes": "Citations"
+    "quotes": "Citations",
+    "all_bookmarks": "Tous les marque-pages",
+    "bookmark_folders": "Dossiers des marque-pages"
   },
   "notifications": {
     "broken_favorite": "Message inconnu, recherche en cours…",
@@ -154,7 +156,8 @@
     "configuration_tip_settings": "les préférences",
     "unread_follow_requests": "{num} nouvelle demande de suivi | {num} nouvelles demandes de suivi",
     "configuration_tip": "Vous pouvez personnaliser ce qui est affiché ici dans {theSettings}. {dismiss}",
-    "configuration_tip_dismiss": "Ne plus montrer"
+    "configuration_tip_dismiss": "Ne plus montrer",
+    "subscribed_status": "posté"
   },
   "interactions": {
     "favs_repeats": "Partages et favoris",
@@ -162,7 +165,8 @@
     "load_older": "Chargez d'anciennes interactions",
     "moves": "Migrations de comptes",
     "emoji_reactions": "Émoticônes de réaction",
-    "reports": "Rapports"
+    "reports": "Rapports",
+    "statuses": "Abonnements"
   },
   "post_status": {
     "new_status": "Poster un nouveau statut",
@@ -187,8 +191,8 @@
     },
     "scope": {
       "direct": "Direct - N'envoyer qu'aux personnes mentionnées",
-      "private": "Abonné·e·s uniquement - Seul·e·s vos abonné·e·s verront vos status",
-      "public": "Publique - Afficher dans les flux publics",
+      "private": "Abonné·e·s uniquement - Seul·e·s vos abonné·e·s verront vos statuts",
+      "public": "Public - Afficher dans les flux publics",
       "unlisted": "Non-Listé - Ne pas afficher dans les flux publics"
     },
     "media_description_error": "Échec de téléversement du media, essayez encore",
@@ -345,8 +349,8 @@
     "notification_visibility_mentions": "Mentionnés",
     "notification_visibility_repeats": "Partages",
     "no_rich_text_description": "Ne formatez pas le texte",
-    "no_blocks": "Aucun bloqués",
-    "no_mutes": "Aucun masqués",
+    "no_blocks": "Aucun bloqué",
+    "no_mutes": "Aucun masqué",
     "hide_follows_description": "Ne pas afficher à qui je suis abonné",
     "hide_followers_description": "Ne pas afficher qui est abonné à moi",
     "show_admin_badge": "Afficher le badge d'Admin sur mon profil",
@@ -401,7 +405,7 @@
       "true": "oui"
     },
     "notifications": "Notifications",
-    "notification_mutes": "Pour stopper la récéption de notifications d'un utilisateur particulier, utilisez un masquage.",
+    "notification_mutes": "Pour stopper la réception de notifications d’un utilisateur particulier, utilisez la fonction « masquer ».",
     "notification_blocks": "Bloquer un utilisateur stoppe toute notification et se désabonne de lui.",
     "enable_web_push_notifications": "Activer les notifications de push web",
     "style": {
@@ -505,7 +509,8 @@
           "drop_shadow_syntax": "{0} ne supporte pas le paramètre {1} et mot-clé {2}.",
           "avatar_inset": "Veuillez noter que combiner à la fois les ombres internes et non-internes sur les avatars peut fournir des résultats inattendus avec la transparence des avatars.",
           "spread_zero": "Les ombres avec une dispersion > 0 apparaitrons comme si ils étaient à zéro",
-          "inset_classic": "L'ombre interne utilisera toujours {0}"
+          "inset_classic": "L'ombre interne utilisera toujours {0}",
+          "avatar_inset_short": "Séparer l'ombre incrustée"
         },
         "components": {
           "panel": "Panneau",
@@ -520,7 +525,10 @@
           "buttonPressedHover": "Bouton (cliqué+survol)",
           "input": "Champ de saisie"
         },
-        "hintV3": "Pour les ombres vous pouvez aussi utiliser la notation {0} pour utiliser un autre emplacement de couleur."
+        "hintV3": "Pour les ombres vous pouvez aussi utiliser la notation {0} pour utiliser un autre emplacement de couleur.",
+        "name": "Nom",
+        "offset": "Décalage d'ombre",
+        "light_grid": "Utiliser un damier clair"
       },
       "fonts": {
         "_tab_label": "Polices",
@@ -529,7 +537,8 @@
           "interface": "Interface",
           "input": "Champs de saisie",
           "post": "Post text",
-          "postCode": "Texte à taille fixe dans un article (texte enrichi)"
+          "postCode": "Texte à taille fixe dans un article (texte enrichi)",
+          "monospace": "Texte à espacement fixe"
         },
         "family": "Nom de la police",
         "size": "Taille (en px)",
@@ -549,7 +558,43 @@
         "header_faint": "Tout va bien",
         "checkbox": "J'ai survolé les conditions d'utilisation",
         "link": "un petit lien sympa"
-      }
+      },
+      "themes2_outdated": "L'éditeur pour les thèmes V2 est en train d'être supprimé et sera remplacé par un nouvel éditeur qui tirera parti du nouveau moteur pour les thèmes V3. Il devrait toujours fonctionner, mais l'expérience pourrait être dégradée et incohérente.",
+      "appearance_tab_note": "Dans cet onglet, les changements n'affectent pas le thème utilisé, donc le thème exporté sera différent de ce que vous voyez à l'écran",
+      "themes3": {
+        "define": "Écraser",
+        "hacks": {
+          "underlay_override_mode_none": "Valeurs par défaut du thème",
+          "underlay_overrides": "Changer le fond",
+          "underlay_override_mode_opaque": "Remplacer par une couleur uniforme",
+          "force_interface_roundness": "Écraser les arrondis de l'interface",
+          "underlay_override_mode_transparent": "Retirer complètement (peut casser certains thèmes)",
+          "forced_roundness_mode_disabled": "Utiliser les valeurs par défaut du thème",
+          "forced_roundness_mode_sharp": "Forcer les bords carrés",
+          "forced_roundness_mode_round": "Forcer les bords ronds",
+          "forced_roundness_mode_nonsharp": "Forcer les bords \"pas-vraiment-carrés\" (1 px d'arrondi)"
+        },
+        "font": {
+          "builtin": {
+            "serif": "Serif",
+            "sans-serif": "Sans-serif",
+            "monospace": "Monospace",
+            "inherit": "Inchangé"
+          },
+          "group-builtin": "Polices par défaut du navigateur",
+          "local-unavailable2": "Entrer manuellement une police spécifique",
+          "lookup_local_fonts": "Charger la liste des polices installées sur cet ordinateur",
+          "enter_manually": "Entrer le nom d'une famille de police manuellement",
+          "entry": "Entrer {fontFamily}",
+          "select": "Choisir une police",
+          "local-unavailable1": "Listes des polices indisponibles installées localement",
+          "font_list_unavailable": "Impossible de trouver la police locale : {error}",
+          "group-local": "Polices installées localement"
+        }
+      },
+      "interface_font_user_override": "Écraser le thème ou les polices utilisées",
+      "custom_theme_used": "(Thème personnalisé)",
+      "update_preview": "Mise à jour de l'aperçu"
     },
     "version": {
       "title": "Version",
@@ -576,7 +621,7 @@
     "useStreamingApi": "Recevoir les messages et notifications en temps réel",
     "notification_setting_filters": "Filtres",
     "notification_setting_privacy_option": "Masquer l'expéditeur et le contenu des notifications push",
-    "notification_setting_privacy": "Intimité",
+    "notification_setting_privacy": "Vie privée",
     "hide_followers_count_description": "Masquer le nombre d'abonnés",
     "accent": "Accent",
     "chatMessageRadius": "Message de chat",
@@ -587,7 +632,7 @@
     "mute_import": "Import des masquages",
     "mute_export_button": "Exporter vos masquages dans un fichier CSV",
     "mute_export": "Export des masquages",
-    "notification_setting_hide_notification_contents": "Cacher l'expéditeur et le contenu des notifications push",
+    "notification_setting_hide_notification_contents": "Masquer l’expéditeur et le contenu des notifications « push »",
     "notification_setting_block_from_strangers": "Bloquer les notifications des utilisateur⋅ice⋅s que vous ne suivez pas",
     "virtual_scrolling": "Optimiser le rendu des flux",
     "reset_background_confirm": "Voulez-vraiment réinitialiser l'arrière-plan ?",
@@ -654,7 +699,7 @@
     "hide_bot_indication": "Cacher l'indication d'un robot avec les messages",
     "always_show_post_button": "Toujours montrer le bouton flottant Nouveau Message",
     "hide_muted_threads": "Cacher les fils masqués",
-    "account_privacy": "Intimité",
+    "account_privacy": "Confidentialité",
     "posts": "Messages",
     "disable_sticky_headers": "Ne pas coller les en-têtes des colonnes en haut de l'écran",
     "show_scrollbars": "Montrer les ascenseurs des colonnes",
@@ -674,7 +719,7 @@
     "mention_link_fade_domain": "Estomper les domaines (ex. {'@'}example.org en {'@'}foo{'@'}example.org)",
     "mention_link_bolden_you": "Surligner les mentions qui vous sont destinées",
     "show_yous": "Afficher (Vous)",
-    "setting_server_side": "Cette préférence est liée au profile et affecte toutes les sessions et clients",
+    "setting_server_side": "Cette préférence est liée au profil et affecte toutes les sessions et clients",
     "account_backup": "Sauvegarde de compte",
     "account_backup_description": "Ceci permet de télécharger une archive des informations du compte et vos messages, mais ils ne peuvent pas actuellement être importé dans un compte Pleroma.",
     "add_backup_error": "Erreur à l'ajout d'une nouvelle sauvegarde : {error}",
@@ -699,7 +744,7 @@
     "mention_link_show_avatar_quick": "Afficher l'avatar de l'utilisateur à côté des mentions",
     "navbar_column_stretch": "Élargir la barre de navigation à la taille des colonnes",
     "column_sizes": "Taille des colonnes",
-    "column_sizes_sidebar": "Panneau latéral",
+    "column_sizes_sidebar": "Barre latérale",
     "column_sizes_content": "Contenu",
     "column_sizes_notifs": "Notifications",
     "conversation_display_linear_quick": "Vue linéaire",
@@ -736,11 +781,11 @@
     "hard_reset_value_tooltip": "Supprime le réglage du stockage, force l'utilisation de la valeur par défaut",
     "reset_value_tooltip": "Réinitialiser le brouillon",
     "hard_reset_value": "Remise à zéro",
-    "hide_actor_type_indication": "Cacher le type (robots, groupes, etc.) dans les status",
+    "hide_actor_type_indication": "Cacher le type (robots, groupes, etc.) dans les statuts",
     "notification_extra_follow_requests": "Afficher les nouvelles demandes de suivi",
-    "user_popover_avatar_action": "Action du clic sur l'avatar",
+    "user_popover_avatar_action": "Action lors du clic sur la fenêtre Avatar",
     "user_popover_avatar_action_close": "Fermer la fenêtre contextuelle",
-    "notification_setting_ignore_inactionable_seen": "Ignorer les status de lecture des notifications non actionnables (favoris, répétitions, etc)",
+    "notification_setting_ignore_inactionable_seen": "Ignorer les statuts de lecture des notifications non actionnables (favoris, répétitions, etc)",
     "notification_setting_ignore_inactionable_seen_tip": "Ceci ne marquera pas ces notifications comme lues, et vous recevrez encore les notifications de bureau si vous le décidez",
     "notification_setting_unseen_at_top": "Afficher les notifications non lues au-dessus des autres",
     "notification_setting_filters_chrome_push": "Sur certains navigateurs (chrome), il peut être impossible de filtrer complètement les notifications par type lorsqu'elles arrivent",
@@ -760,16 +805,44 @@
     "notification_extra_chats": "Afficher les discussions non lues",
     "notification_extra_announcements": "Afficher les annonces non lues",
     "notification_extra_tip": "Afficher les astuces de personnalisation pour les notifications extras",
-    "enable_web_push_always_show_tip": "Certains navigateurs (Chromium, Chrome) exigent que les messages push donnent toujours lieu à une notification, sinon le message générique \"Le site web a été mis à jour en arrière-plan\" s'affiche ; activez cette option pour empêcher l'affichage de cette notification, car Chrome semble masquer les notifications push si l'onglet est au centre de l'attention. Cela peut entraîner l'affichage de notifications en double sur d'autres navigateurs.",
-    "user_popover_avatar_overlay": "Afficher la fenêtre contextuelle sur l'avatar de l'utilisateur",
+    "enable_web_push_always_show_tip": "Certains navigateurs (Chromium, Chrome) exigent que les messages push donnent toujours lieu à une notification, sinon le message générique « Le site web a été mis à jour en arrière-plan » s’affiche : activez cette option pour empêcher l’affichage de cette notification, car Chrome semble masquer les notifications push si l’onglet est au centre de l’attention. Ceci peut entraîner l’affichage de notifications en double sur d’autres navigateurs.",
+    "user_popover_avatar_overlay": "Afficher la fiche de l’utilisateur au survol de l’avatar",
     "notification_visibility_in_column": "Afficher la colonne / le tiroir de notifications",
-    "notification_show_extra": "Afficher les extras dans la colonne de notifications"
+    "notification_show_extra": "Afficher les extras dans la colonne de notifications",
+    "units": {
+      "time": {
+        "m": "minutes",
+        "s": "secondes",
+        "h": "heures",
+        "d": "jours"
+      }
+    },
+    "force_theme_recompilation_debug": "Désactiver le cache du thème, forcer la recompilation à chaque démarrage (DEBUG)",
+    "absolute_time_format": "Utiliser le format UTC",
+    "absolute_time_format_min_age": "À n'utiliser que pour les périodes plus anciennes que cette durée",
+    "notification_visibility_statuses": "Abonnements",
+    "mute_sensitive_posts": "Masquer les postes sensibles",
+    "appearance": "Apparence",
+    "confirm_new_setting": "Confirmer le nouveau réglage ?",
+    "confirm_new_question": "Est-ce que tout est ok ? Le réglage sera rétabli dans dix secondes.",
+    "revert": "Rétablir",
+    "confirm": "Confirmer",
+    "text_size": "Taille du texte et de l'interface",
+    "text_size_tip": "Utiliser {0} pour des valeurs absolues, {1} mettra l'échelle du texte à la valeur par défaut du navigateur.",
+    "text_size_tip2": "Les valeurs différentes de {0} pourraient casser les thèmes ou d'autres trucs",
+    "emoji_size": "Taille des émojis",
+    "navbar_size": "Taille de la barre supérieure",
+    "panel_header_size": "Taille du panneau d'en-tête",
+    "visual_tweaks": "Ajustements visuels mineurs",
+    "theme_debug": "Montrer ce que le moteur de thème de l'arrière-plan bricole lorsqu'il travaille avec la transparence (DEBUG)",
+    "scale_and_layout": "Taille et disposition de l'interface",
+    "hide_scrobbles_after": "Masquer les scrobbles plus vieux que"
   },
   "timeline": {
     "collapse": "Fermer",
     "conversation": "Conversation",
     "error_fetching": "Erreur en cherchant les mises à jour",
-    "load_older": "Afficher des status plus ancien",
+    "load_older": "Afficher des statuts plus anciens",
     "no_retweet_hint": "Le message est marqué en abonnés-seulement ou direct et ne peut pas être partagé",
     "repeated": "a partagé",
     "show_new": "Afficher plus",
@@ -795,8 +868,8 @@
     "replies_list": "Réponses :",
     "mute_conversation": "Masquer la conversation",
     "unmute_conversation": "Démasquer la conversation",
-    "status_unavailable": "Status indisponible",
-    "copy_link": "Copier le lien au status",
+    "status_unavailable": "Statut indisponible",
+    "copy_link": "Copier le lien au statut",
     "expand": "Développer",
     "nsfw": "Contenu sensible",
     "status_deleted": "Ce post a été effacé",
@@ -834,23 +907,28 @@
     "move_up": "Décaler la pièce-jointe à gauche",
     "open_gallery": "Ouvrir la galerie",
     "thread_show_full": "Montrer tout le fil ({numStatus} message, {depth} niveaux maximum) | Montrer tout le fil ({numStatus} messages, {depth} niveaux maximum)",
-    "show_all_conversation": "Montrer tout le fil ({numStatus} autre message) | Montrer tout le fil ({numStatus} autre messages)",
-    "edit": "Éditer le status",
+    "show_all_conversation": "Montrer tout le fil ({numStatus} autre message) | Montrer tout le fil ({numStatus} autres messages)",
+    "edit": "Éditer le statuts",
     "edited_at": "(dernière édition {time})",
-    "status_history": "Historique du status",
+    "status_history": "Historique du statut",
     "delete_error": "Erreur de suppression du statut : {0}",
     "repeat_confirm": "Voulez-vous réellement reposter ce statut ?",
     "reaction_count_label": "{num} personne a réagi | {num} personnes ont réagi",
     "repeat_confirm_cancel_button": "Ne pas reposter",
-    "hide_quote": "Masquer les status cités",
-    "display_quote": "Afficher les status cités",
+    "hide_quote": "Masquer les statuts cités",
+    "display_quote": "Afficher les statuts cités",
     "invisible_quote": "Citation de statut non disponible : {link}",
     "delete_confirm_title": "Confirmer la suppression",
     "more_actions": "Plus d'action sur ce statut",
     "delete_confirm_cancel_button": "Conserver",
     "repeat_confirm_title": "Confirmer reposte",
     "repeat_confirm_accept_button": "Reposter",
-    "delete_confirm_accept_button": "Supprimer"
+    "delete_confirm_accept_button": "Supprimer",
+    "sensitive_muted": "Silencer le contenu sensible",
+    "quotes": "Citations",
+    "load_error": "Impossible de charger la publication : {error}",
+    "loading": "En cours de chargement…",
+    "bot_muted": "Silencer le contenu de robots"
   },
   "user_card": {
     "approve": "Accepter",
@@ -929,9 +1007,9 @@
     "unfollow_confirm": "Voulez-vous vraiment arrêter de suivre {user} ?",
     "unfollow_confirm_accept_button": "Ne plus suivre",
     "birthday": "Né(e) le {birthday}",
-    "edit_note": "Éditer note",
+    "edit_note": "Modifier la note",
     "edit_note_apply": "Appliquer",
-    "edit_note_cancel": "Abandonner",
+    "edit_note_cancel": "Annuler",
     "note": "Note",
     "group": "Groupe",
     "unfollow_confirm_title": "Confirmer l'arrêt de suivi",
@@ -943,7 +1021,7 @@
     "remove_follower_confirm_cancel_button": "Conserver",
     "mute_duration_prompt": "Mettre cet utilisateur en sourdine pour (0 pour une durée indéterminée) :",
     "remove_follower_confirm_title": "Confirmation de suppression d'utilisateur",
-    "note_blank": "(Aucun)",
+    "note_blank": "(vide)",
     "mute_confirm": "Voulez-vous vraiment mettre {user} en sourdine ?",
     "mute_confirm_accept_button": "Mettre en sourdine",
     "mute_confirm_cancel_button": "Ne pas mettre en sourdine",
@@ -983,8 +1061,8 @@
     "reject_follow_request": "Rejeter la demande de suivit",
     "bookmark": "Favori",
     "autocomplete_available": "{number} résultat est disponible. Utilisez les touches haut et bas pour naviguer à l'intérieur. | {number} résultats sont disponibles. Utilisez les touches haut et bas pour naviguer à l'intérieur.",
-    "toggle_expand": "Développer ou réduire la notification pour afficher le message dans son intégralité",
-    "toggle_mute": "Développer ou réduire la notification pour révéler le contenu en sourdine"
+    "toggle_expand": "Étendre ou réduire la notification pour montrer les messages en entier",
+    "toggle_mute": "Étendre ou réduire les notifications pour révéler le contenu masqué"
   },
   "upload": {
     "error": {
@@ -1013,11 +1091,11 @@
       "simple": {
         "simple_policies": "Politiques par instances",
         "accept": "Acceptées",
-        "accept_desc": "Cette instance accepte les messages seulement depuis ces instances :",
+        "accept_desc": "Cette instance accepte les messages seulement depuis les instances suivantes :",
         "reject": "Rejetées",
         "reject_desc": "Cette instance n'acceptera pas de message de ces instances :",
         "quarantine": "Quarantaine",
-        "quarantine_desc": "Cette instance enverra seulement des messages publics à ces instances :",
+        "quarantine_desc": "Cette instance enverra uniquement des messages publics aux instances suivantes :",
         "ftl_removal_desc": "Cette instance supprime les instance suivantes du flux fédéré :",
         "media_removal": "Suppression des pièce-jointes",
         "media_removal_desc": "Cette instance supprime le contenu multimédia des instances suivantes :",
@@ -1054,7 +1132,9 @@
     "vote": "Voter",
     "expired": "Sondage terminé il y a {0}",
     "people_voted_count": "{count} voteur | {count} voteurs",
-    "votes_count": "{count} vote | {count} votes"
+    "votes_count": "{count} vote | {count} votes",
+    "non_anonymous": "Sondage public",
+    "non_anonymous_title": "Certaines instances pourraient afficher ce pour quoi vous avez voté"
   },
   "emoji": {
     "emoji": "Émoji",
@@ -1064,7 +1144,7 @@
     "unicode": "émoji unicode",
     "load_all": "Charger tout les {emojiAmount} émojis",
     "load_all_hint": "{saneAmount} émojis chargé, charger tout les émojis peuvent causer des problèmes de performances.",
-    "stickers": "Stickers",
+    "stickers": "Autocollants",
     "keep_open": "Garder ouvert",
     "unicode_groups": {
       "activities": "Activités",
@@ -1072,7 +1152,7 @@
       "flags": "Drapeaux",
       "food-and-drink": "Nourriture & boissons",
       "objects": "Objets",
-      "people-and-body": "Personnes & Corps",
+      "people-and-body": "Humain·e·s & Corps",
       "smileys-and-emotion": "Emoticônes",
       "symbols": "Symboles",
       "travel-and-places": "Voyages & lieux"
@@ -1176,7 +1256,7 @@
     "empty_chat_list_placeholder": "Vous n'avez pas encore de discussions. Démarrez-en une nouvelle !",
     "error_sending_message": "Quelque chose s'est mal passé pendant l'envoi du message.",
     "error_loading_chat": "Quelque chose s'est mal passé au chargement de la discussion.",
-    "delete_confirm": "Voulez-vous vraiment effacer ce message ?",
+    "delete_confirm": "Souhaitez-vous vraiment effacer ce message ?",
     "more": "Plus",
     "empty_message_error": "Impossible d'envoyer un message vide",
     "new": "Nouvelle discussion",
@@ -1213,7 +1293,7 @@
     "art_by": "Œuvre par {linkToArtist}",
     "big_update_content": "Nous n'avons pas fait de nouvelle version depuis un moment, les choses peuvent vous paraitre différentes de vos habitudes.",
     "update_bugs": "Veuillez rapporter les problèmes sur {pleromaGitlab}, comme beaucoup de changements on été fait, même si nous testons entièrement et utilisons la version de dévelopement nous-même, nous avons pu en louper. Les retours et suggestions sont bienvenues sur ce que vous avez pu rencontrer, ou sur comment améliorer Pleroma (BE) et Pleroma-FE.",
-    "big_update_title": "Soyez indulgent avec nous"
+    "big_update_title": "Soyez patients avec nous"
   },
   "unicode_domain_indicator": {
     "tooltip": "Ce domaine contient des caractères non ascii."
@@ -1221,9 +1301,9 @@
   "report": {
     "reporter": "Rapporteur·euse :",
     "reported_user": "Compte rapporté :",
-    "reported_statuses": "Status rapportés :",
-    "notes": "Notes :",
-    "state": "Status :",
+    "reported_statuses": "Statuts rapportés :",
+    "notes": "Notes :",
+    "state": "Statut :",
     "state_open": "Ouvert",
     "state_closed": "Fermé",
     "state_resolved": "Résolut"
@@ -1232,9 +1312,9 @@
     "page_header": "Annonces",
     "title": "Annonce",
     "mark_as_read_action": "Marquer comme lu",
-    "post_form_header": "Faire une annonce",
-    "post_placeholder": "Écrivez le contenu de l'annonce ici...",
-    "post_action": "Envoyer",
+    "post_form_header": "Envoyer l'annonce",
+    "post_placeholder": "Rédiger ici le contenu de l'annonce...",
+    "post_action": "Publier",
     "post_error": "Erreur : {error}",
     "close_error": "Fermer",
     "delete_action": "Supprimer",
@@ -1254,7 +1334,7 @@
       "success_installing_frontend": "Installation réussie de l'interface {version}",
       "failure_installing_frontend": "Échec de l'installation de l'interface {version} : {reason}",
       "default_frontend_unavail": "Les paramètres de l'interface ne sont pas disponibles, ils doivent être configurés dans la base de données",
-      "build_url": "Construction URL",
+      "build_url": "URL de référence",
       "reinstall": "Réinstaller",
       "repository": "Lien du dépôt",
       "versions": "Versions disponibles",
@@ -1306,7 +1386,7 @@
       "restrict": {
         "header": "Restreindre l'accès aux visiteurs anonymes",
         "profiles": "Accès aux profils d'utilisateur",
-        "activities": "Accès aux status/activités",
+        "activities": "Accès aux statuts/activités",
         "description": "Paramètre détaillé permettant d'autoriser/interdire l'accès à certains aspects de l'API. Par défaut (état indéterminé), l'accès est interdit si l'instance n'est pas publique ; si la case est cochée, l'accès est interdit même si l'instance est publique ; si la case n'est pas cochée, l'accès est autorisé même si l'instance est privée. Veuillez noter qu'un comportement inattendu peut se produire si certains paramètres sont définis, par exemple si l'accès au profil est désactivé, les messages s'afficheront sans les informations relatives au profil.",
         "timelines": "Accès aux flux"
       },
@@ -1341,7 +1421,7 @@
       "revert": "Revenir en arrière",
       "add_file": "Ajouter un fichier",
       "adding_new": "Ajouter un nouvel émoji",
-      "shortcode": "Shortcode",
+      "shortcode": "Code court",
       "filename": "Nom du fichier",
       "new_filename": "Nom de fichier, laisser blanc pour inférer",
       "delete_confirm": "Êtes-vous sûr de vouloir supprimer {0} ?",
@@ -1355,7 +1435,8 @@
       "delete_title": "Supprimer ?",
       "metadata_changed": "Métadonnées différentes de celles sauvegardées",
       "emoji_changed": "Modifications du fichier émoji non sauvegardées, vérifier l'émoji surligné",
-      "replace_warning": "Vous allez REMPLACER le pack local qui porte ce nom"
+      "replace_warning": "Vous allez REMPLACER le pack local qui porte ce nom",
+      "new_shortcode": "Shortcode, laissez vide pour déduire"
     },
     "window_title": "Administration",
     "nodb": {
@@ -1380,5 +1461,30 @@
     "old_ui_link": "L'ancien espace d'administration est disponible ici",
     "reset_all": "Tout réinitialiser",
     "commit_all": "Tout sauvegarder"
+  },
+  "splash": {
+    "settings": "Application des paramètres…",
+    "almost": "Réticulation des splines…",
+    "fun_2": "Allez-y doucement !",
+    "fun_3": "Suya…",
+    "fun_4": "Ma machine Pleroma est à pleine puissance !",
+    "loading": "En cours de chargement…",
+    "theme": "Application du thème, veuillez patienter chaleureusement…",
+    "instance": "Récupération des infos de l'instance…",
+    "fun_1": "Buvez plus d'eau",
+    "error": "Quelque chose s'est mal passé"
+  },
+  "bookmark_folders": {
+    "select_folder": "Sélectionnez le dossier des favoris",
+    "create": "Créer le dossier",
+    "emoji": "Emoji",
+    "name": "Nom du dossier",
+    "new": "Nouveau dossier",
+    "delete": "Supprimer le dossier",
+    "update_folder": "Enregistrer les changements",
+    "really_delete": "Voulez-vous vraiment supprimer le dossier ?",
+    "error": "Erreur lors de la manipulation des dossiers de favoris : {0}",
+    "creating_folder": "Création du dossier des favoris",
+    "editing_folder": "Édition du dossier {folderName}"
   }
 }
diff --git a/src/i18n/ja_pedantic.json b/src/i18n/ja_pedantic.json
index 3d895fcdb..a5b500dde 100644
--- a/src/i18n/ja_pedantic.json
+++ b/src/i18n/ja_pedantic.json
@@ -130,7 +130,11 @@
     "edit_finish": "完了",
     "mobile_notifications": "通知を開く (未読あり)",
     "mobile_notifications_close": "通知を閉じる",
-    "announcements": "お知らせ"
+    "announcements": "お知らせ",
+    "all_bookmarks": "全てのブックマーク",
+    "bookmark_folders": "ブックマークフォルダ",
+    "mobile_sidebar": "モバイルのサイドバーを開く",
+    "quotes": "引用"
   },
   "notifications": {
     "broken_favorite": "ステータスが見つかりません。探しています…",
@@ -152,7 +156,8 @@
     "unread_follow_requests": "フォローリクエストが{num}件来ています | フォローリクエストが{num}件来ています",
     "configuration_tip": "ここに表示する通知の種類は{theSettings}にて変更することができます。 {dismiss}",
     "submitted_report": "通報が送信されました",
-    "configuration_tip_settings": "設定"
+    "configuration_tip_settings": "設定",
+    "subscribed_status": "投稿しました"
   },
   "polls": {
     "add_poll": "投票を追加",
@@ -192,7 +197,8 @@
     "load_older": "古い通知を読み込む",
     "moves": "ユーザーの引っ越し",
     "emoji_reactions": "絵文字リアクション",
-    "reports": "通報"
+    "reports": "通報",
+    "statuses": "購読"
   },
   "post_status": {
     "new_status": "投稿する",
@@ -537,11 +543,11 @@
         "inset": "内側",
         "hint": "影の設定では、色の値として --variable を使うことができます。これはCSS3変数です。ただし、透明度の設定は、効かなくなります。",
         "filter_hint": {
-          "always_drop_shadow": "ブラウザーがサポートしていれば、常に {0} が使われます。",
+          "always_drop_shadow": "注意: この影には、ブラウザーがサポートしている場合、常に {0} が使われます。",
           "drop_shadow_syntax": "{0} は、{1} パラメーターと {2} キーワードをサポートしていません。",
-          "avatar_inset": "内側の影と外側の影を同時に使うと、透明なアイコンの表示がおかしくなることがあります。",
-          "spread_zero": "広がりが 0 よりも大きな影は、0 と同じです",
-          "inset_classic": "内側の影は {0} を使います"
+          "avatar_inset": "内側の影と外側の影を同時に使うと、透明なアイコンの表示が変になる場合があることに注意してください。",
+          "spread_zero": "広がりを 0 より大きくしても、表示は 0 と変わりません",
+          "inset_classic": "内側の影には {0} が使われます"
         },
         "components": {
           "panel": "パネル",
@@ -556,7 +562,10 @@
           "buttonPressedHover": "ボタン (ホバー、かつ、押されているとき)",
           "input": "入力欄"
         },
-        "hintV3": "影の場合は、 {0} 表記を使って他の色スロットを使うこともできます。"
+        "hintV3": "影の色には、 {0} 表記を使って他の色スロットに指定した色を再利用することもできます。",
+        "offset": "影のオフセット",
+        "name": "名前",
+        "light_grid": "背景のチェック模様を明るくする"
       },
       "fonts": {
         "_tab_label": "フォント",
@@ -851,7 +860,12 @@
     "emoji_size": "絵文字のサイズ",
     "navbar_size": "トップバーのサイズ",
     "panel_header_size": "パネルヘッダーのサイズ",
-    "notification_visibility_statuses": "購読"
+    "notification_visibility_statuses": "購読",
+    "text_size_tip": "絶対的な値には{0}を使用してください。{1}はブラウザのデフォルトのフォントサイズを基準にスケールされます。",
+    "visual_tweaks": "細かい外観の変更",
+    "absolute_time_format": "時間の表示に絶対表記を使用する",
+    "absolute_time_format_min_age": "これより古い日時に対してのみ使用する:",
+    "theme_debug": "テーマエンジンが透明度を処理する際に見ているものを表示する (デバッグ用)"
   },
   "time": {
     "day": "{0}日",
@@ -992,7 +1006,8 @@
     "sensitive_muted": "閲覧注意な投稿のためミュートされています",
     "load_error": "投稿の読み込みに失敗しました: {error}",
     "loading": "読み込み中…",
-    "quotes": "引用"
+    "quotes": "引用",
+    "bot_muted": "BOTによる投稿のためミュートされています"
   },
   "user_card": {
     "approve": "承認",
@@ -1001,8 +1016,8 @@
     "deny": "拒否",
     "favorites": "お気に入り",
     "follow": "フォロー",
-    "follow_sent": "リクエストを送信しました！",
-    "follow_progress": "リクエストしています…",
+    "follow_sent": "リクエスト完了！",
+    "follow_progress": "リクエスト中…",
     "follow_unfollow": "フォロー解除",
     "followees": "フォロー",
     "followers": "フォロワー",
@@ -1093,7 +1108,8 @@
     "remove_follower_confirm_accept_button": "解除する",
     "mute_confirm_title": "ミュートの確認",
     "deactivated": "無効化済み",
-    "group": "グループ"
+    "group": "グループ",
+    "mute_duration_prompt": "ミュート期間 (0で無期限):"
   },
   "user_profile": {
     "timeline_title": "ユーザータイムライン",
@@ -1354,7 +1370,13 @@
       "files": "ファイル",
       "delete_title": "削除しますか？",
       "metadata_changed": "変更されたメタデータ",
-      "emoji_changed": "保存されていない変更点があります。ハイライトされた絵文字を確認してください"
+      "emoji_changed": "保存されていない変更点があります。ハイライトされた絵文字を確認してください",
+      "importFS": "ファイルシステムから絵文字をインポート",
+      "do_list": "一覧を取得",
+      "remote_pack_instance": "リモートパックを取得するインスタンス",
+      "download_as_name": "パック名",
+      "download_as_name_full": "名前を入力 (空にするとリモートの名前を使用)",
+      "replace_warning": "続行するとローカルにある同名のパックが上書きされます"
     }
   },
   "lists": {
@@ -1417,6 +1439,30 @@
     "edit_action": "編集",
     "start_time_prompt": "開始日時: ",
     "end_time_prompt": "終了日時: ",
-    "all_day_prompt": "終日"
+    "all_day_prompt": "終日",
+    "inactive_message": "このお知らせは無効です"
+  },
+  "splash": {
+    "loading": "読み込み中…",
+    "theme": "テーマを適用中です。お待ちください…",
+    "instance": "インスタンス情報を取得中…",
+    "settings": "設定を適用中…",
+    "fun_2": "ゆっくりしていってね！",
+    "error": "問題が発生しました",
+    "fun_3": "( ˘ω˘)ｽﾔｧ…",
+    "almost": "少女祈祷中…",
+    "fun_4": "俺のPleromaが火を吹くぜ！"
+  },
+  "bookmark_folders": {
+    "emoji": "絵文字",
+    "update_folder": "変更を保存",
+    "really_delete": "本当にフォルダを削除しますか？",
+    "name": "フォルダ名",
+    "editing_folder": "{folderName}フォルダの編集",
+    "creating_folder": "新規ブックマークフォルダの作成",
+    "create": "フォルダを作成",
+    "delete": "フォルダを削除",
+    "error": "ブックマークフォルダの処理中にエラーが発生しました: {0}",
+    "new": "新規フォルダ"
   }
 }
diff --git a/src/i18n/languages.js b/src/i18n/languages.js
index 475bf5ac2..fbb4c8138 100644
--- a/src/i18n/languages.js
+++ b/src/i18n/languages.js
@@ -46,7 +46,7 @@ const ensureFinalFallback = codes => {
   return codeList.includes('en') ? codeList : codeList.concat(['en'])
 }
 
-module.exports = {
+export {
   languages,
   langCodeToJsonName,
   langCodeToCldrName,
diff --git a/src/i18n/messages.js b/src/i18n/messages.js
index 849d98fd3..4501b331f 100644
--- a/src/i18n/messages.js
+++ b/src/i18n/messages.js
@@ -9,23 +9,23 @@
 
 import { isEqual } from 'lodash'
 import { languages, langCodeToJsonName } from './languages.js'
+import enMessages from './en.json'
 
 const ULTIMATE_FALLBACK_LOCALE = 'en'
 
 const hasLanguageFile = (code) => languages.includes(code)
 
+const languageFileMap = import.meta.glob('./*.json')
+
 const loadLanguageFile = (code) => {
-  return import(
-    /* webpackInclude: /\.json$/ */
-    /* webpackChunkName: "i18n/[request]" */
-    `./${langCodeToJsonName(code)}.json`
-  )
+  const jsonName = langCodeToJsonName(code)
+  return languageFileMap[`./${jsonName}.json`]()
 }
 
 const messages = {
   languages,
   default: {
-    en: require('./en.json').default
+    en: enMessages
   },
   setLanguage: async (i18n, language) => {
     const languages = (Array.isArray(language) ? language : [language]).filter(k => k)
diff --git a/src/i18n/nan-TW.json b/src/i18n/nan-TW.json
index 44a693dd5..26821aae6 100644
--- a/src/i18n/nan-TW.json
+++ b/src/i18n/nan-TW.json
@@ -235,7 +235,7 @@
   "emoji": {
     "stickers": "貼圖",
     "emoji": "繪文字",
-    "keep_open": "Hōo 揀選仔開 leh",
+    "keep_open": "Hōo 揀選器開 leh",
     "search_emoji": "Tshuē 繪文字",
     "add_emoji": "插繪文字",
     "custom": "定製 ê 繪文字",
@@ -988,7 +988,7 @@
     "repeat_confirm_accept_button": "轉送",
     "repeat_confirm_title": "轉送ê確認",
     "repeat_confirm": "Lí kám真ê beh轉送tsit ê狀態？",
-    "delete": "Thâi掉身份",
+    "delete": "Thâi掉狀態",
     "delete_error": "Thâi狀態ê時出tshê：{0}",
     "mentions": "提起",
     "move_down": "Kā附件suá kàu正pîng",
diff --git a/src/i18n/service_worker_messages.js b/src/i18n/service_worker_messages.js
index a4e6d60ad..0c62453c7 100644
--- a/src/i18n/service_worker_messages.js
+++ b/src/i18n/service_worker_messages.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-webpack-loader-syntax */
 // This module exports only the notification part of the i18n,
 // which is useful for the service worker
 
diff --git a/src/lib/event_target_polyfill.js b/src/lib/event_target_polyfill.js
index 2042c7706..c8edd1445 100644
--- a/src/lib/event_target_polyfill.js
+++ b/src/lib/event_target_polyfill.js
@@ -1,9 +1,11 @@
 import EventTargetPolyfill from '@ungap/event-target'
 
 try {
-  /* eslint-disable no-new  */
-  new EventTarget()
-  /* eslint-enable no-new  */
-} catch (e) {
+  // for some reason eslint both likes and dislikes
+  // no-new here so we just call something useless
+  // so it stops reporting this file
+  const et = new EventTarget()
+  et.dispatchEvent()
+} catch {
   window.EventTarget = EventTargetPolyfill
 }
diff --git a/src/lib/persisted_state.js b/src/lib/persisted_state.js
index 22ba1e7f0..878d95aa8 100644
--- a/src/lib/persisted_state.js
+++ b/src/lib/persisted_state.js
@@ -1,6 +1,7 @@
 import merge from 'lodash.merge'
-import localforage from 'localforage'
 import { each, get, set, cloneDeep } from 'lodash'
+import { useInterfaceStore } from 'src/stores/interface'
+import { storage } from './storage.js'
 
 let loaded = false
 
@@ -17,7 +18,6 @@ const saveImmedeatelyActions = [
   'markNotificationsAsSeen',
   'clearCurrentUser',
   'setCurrentUser',
-  'setServerSideStorage',
   'setHighlight',
   'setOption',
   'setClientData',
@@ -26,7 +26,7 @@ const saveImmedeatelyActions = [
 ]
 
 const defaultStorage = (() => {
-  return localforage
+  return storage
 })()
 
 export default function createPersistedState ({
@@ -76,12 +76,12 @@ export default function createPersistedState ({
               .then(success => {
                 if (typeof success !== 'undefined') {
                   if (mutation.type === 'setOption' || mutation.type === 'setCurrentUser') {
-                    store.dispatch('settingsSaved', { success })
+                    useInterfaceStore().settingsSaved({ success })
                   }
                 }
               }, error => {
                 if (mutation.type === 'setOption' || mutation.type === 'setCurrentUser') {
-                  store.dispatch('settingsSaved', { error })
+                  useInterfaceStore().settingsSaved({ error })
                 }
               })
           }
@@ -93,3 +93,160 @@ export default function createPersistedState ({
     }
   })
 }
+
+/**
+ * This persists state for pinia, which falls back to read from the vuex state
+ * if pinia persisted state does not exist.
+ *
+ * When you migrate a module from vuex to pinia, you have to keep the original name.
+ * If the module was called `xxx`, the name of the store has to be `xxx` too.
+ *
+ * This adds one property to the store, $persistLoaded, which is a promise
+ * that resolves when the initial state is loaded. If the plugin is not enabled,
+ * $persistLoaded is a promise that resolves immediately.
+ * If we are not able to get the stored state because storage.getItem() throws or
+ * rejects, $persistLoaded will be a rejected promise with the thrown error.
+ *
+ * Call signature:
+ *
+ * defineStore(name, {
+ *   ...,
+ *   // setting the `persist` property enables this plugin
+ *   // IMPORTANT: by default it is disabled, you have to set `persist` to at least an empty object
+ *   persist: {
+ *     // set to list of individual paths, or undefined/unset to persist everything
+ *     paths: [],
+ *     // function to call after loading initial state
+ *     // if afterLoad is a function, it must return a state object that will be sent to `store.$patch`, or a promise to the state object
+ *     // by default afterLoad is undefined
+ *     afterLoad: (originalState) => {
+ *       // ...
+ *       return modifiedState
+ *     },
+ *     // if it exists, only persist state after these actions
+ *     // if it doesn't exist or is undefined, persist state after every mutation of the state
+ *     saveImmediatelyActions: [],
+ *     // what to do after successfully saving the state
+ *     onSaveSuccess: () => {},
+ *     // what to do after there is an error saving the state
+ *     onSaveError: () => {}
+ *   }
+ * })
+ *
+ */
+export const piniaPersistPlugin = ({
+  vuexKey = 'vuex-lz',
+  keyFunction = (id) => `pinia-local-${id}`,
+  storage = defaultStorage,
+  reducer = defaultReducer
+} = {}) => ({ store, options }) => {
+  if (!options.persist) {
+    return {
+      $persistLoaded: Promise.resolve()
+    }
+  }
+
+  let resolveLoaded
+  let rejectLoaded
+  const loadedPromise = new Promise((resolve, reject) => {
+    resolveLoaded = resolve
+    rejectLoaded = reject
+  })
+
+  const {
+    afterLoad,
+    paths = [],
+    saveImmediatelyActions,
+    onSaveSuccess = () => {},
+    onSaveError = () => {}
+  } = options.persist || {}
+
+  const loadedGuard = { loaded: false }
+  const key = keyFunction(store.$id)
+  const getState = async () => {
+    const id = store.$id
+    const value = await storage.getItem(key)
+    if (value) {
+      return value
+    }
+
+    const fallbackValue = await storage.getItem(vuexKey)
+    if (fallbackValue && fallbackValue[id]) {
+      console.info(`Migrating ${id} store data from vuex to pinia`)
+      const res = fallbackValue[id]
+      await storage.setItem(key, res)
+      return res
+    }
+
+    return {}
+  }
+
+  const setState = (state) => {
+    if (!loadedGuard.loaded) {
+      console.info('waiting for old state to be loaded...')
+      return Promise.reject()
+    } else {
+      return storage.setItem(key, state)
+    }
+  }
+
+  const getMaybeAugmentedState = async () => {
+    const savedRawState = await getState()
+    if (typeof afterLoad === 'function') {
+      try {
+        return await afterLoad(savedRawState)
+      } catch (e) {
+        console.error('Error running afterLoad:', e)
+        return savedRawState
+      }
+    } else {
+      return savedRawState
+    }
+  }
+
+  const persistCurrentState = async (state) => {
+    const stateClone = cloneDeep(state)
+    const stateToPersist = reducer(stateClone, paths)
+    try {
+      const res = await setState(stateToPersist)
+      onSaveSuccess(res)
+    } catch (e) {
+      console.error('Cannot persist state:', e)
+      onSaveError(e)
+    }
+  }
+
+  getMaybeAugmentedState()
+    .then(savedState => {
+      if (savedState) {
+        store.$patch(savedState)
+      }
+
+      loadedGuard.loaded = true
+      resolveLoaded()
+
+      // only subscribe after we have done setting the initial state
+      if (!saveImmediatelyActions) {
+        store.$subscribe(async (_mutation, state) => {
+          await persistCurrentState(state)
+        })
+      } else {
+        store.$onAction(({
+          name,
+          store,
+          after,
+        }) => {
+          if (saveImmediatelyActions.includes(name)) {
+            after(() => persistCurrentState(store.$state))
+          }
+        })
+      }
+    }, error => {
+      console.error('Cannot load storage:', error)
+      rejectLoaded(error)
+    })
+
+  return {
+    $persistLoaded: loadedPromise
+  }
+}
diff --git a/src/lib/push_notifications_plugin.js b/src/lib/push_notifications_plugin.js
index f75bb8230..85f9e794f 100644
--- a/src/lib/push_notifications_plugin.js
+++ b/src/lib/push_notifications_plugin.js
@@ -1,8 +1,10 @@
+import { useInterfaceStore } from 'src/stores/interface'
+
 export default (store) => {
   store.subscribe((mutation, state) => {
     const vapidPublicKey = state.instance.vapidPublicKey
     const webPushNotification = state.config.webPushNotifications
-    const permission = state.interface.notificationPermission === 'granted'
+    const permission = useInterfaceStore().notificationPermission === 'granted'
     const user = state.users.currentUser
 
     const isUserMutation = mutation.type === 'setCurrentUser'
diff --git a/src/lib/storage.js b/src/lib/storage.js
new file mode 100644
index 000000000..25a49abc9
--- /dev/null
+++ b/src/lib/storage.js
@@ -0,0 +1,3 @@
+import localforage from 'localforage'
+
+export const storage = localforage
diff --git a/src/main.js b/src/main.js
index bcfc80b0e..1cd1afe6c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,36 +1,22 @@
+/* global process */
 import { createStore } from 'vuex'
+import { createPinia } from 'pinia'
 
 import 'custom-event-polyfill'
 import './lib/event_target_polyfill.js'
 
-import interfaceModule from './modules/interface.js'
-import instanceModule from './modules/instance.js'
-import statusesModule from './modules/statuses.js'
-import notificationsModule from './modules/notifications.js'
-import listsModule from './modules/lists.js'
-import usersModule from './modules/users.js'
-import apiModule from './modules/api.js'
-import configModule from './modules/config.js'
-import profileConfigModule from './modules/profileConfig.js'
-import serverSideStorageModule from './modules/serverSideStorage.js'
-import adminSettingsModule from './modules/adminSettings.js'
-import shoutModule from './modules/shout.js'
-import oauthModule from './modules/oauth.js'
-import authFlowModule from './modules/auth_flow.js'
-import mediaViewerModule from './modules/media_viewer.js'
-import oauthTokensModule from './modules/oauth_tokens.js'
-import reportsModule from './modules/reports.js'
-import pollsModule from './modules/polls.js'
-import postStatusModule from './modules/postStatus.js'
-import editStatusModule from './modules/editStatus.js'
-import statusHistoryModule from './modules/statusHistory.js'
-import chatsModule from './modules/chats.js'
-import announcementsModule from './modules/announcements.js'
-import bookmarkFoldersModule from './modules/bookmark_folders.js'
+// Polyfill for Array.prototype.toSorted (ES2023)
+if (!Array.prototype.toSorted) {
+  Array.prototype.toSorted = function(compareFn) {
+    return [...this].sort(compareFn)
+  }
+}
+
+import vuexModules from './modules/index.js'
 
 import { createI18n } from 'vue-i18n'
 
-import createPersistedState from './lib/persisted_state.js'
+import createPersistedState, { piniaPersistPlugin } from './lib/persisted_state.js'
 import pushNotifications from './lib/push_notifications_plugin.js'
 
 import messages from './i18n/messages.js'
@@ -68,11 +54,25 @@ const persistedStateOptions = {
     throbber.classList.add('dead')
     document.querySelector('#status').textContent = i18n.global.t('splash.error')
     console.error('PleromaFE failed to initialize: ', e)
+    document.querySelector('#statusError').textContent = e
+    document.querySelector('#statusStack').textContent = e.stack
+    document.querySelector('#statusError').style = 'display: block'
+    document.querySelector('#statusStack').style = 'display: block'
+  }
+
+  window.splashError = e => splashError(i18n, e)
+  window.splashUpdate = key => {
+    if (document.querySelector('#status')) {
+      document.querySelector('#status').textContent = i18n.global.t(key)
+    }
   }
 
   try {
     let storageError
     const plugins = [pushNotifications]
+    const pinia = createPinia()
+    pinia.use(piniaPersistPlugin())
+
     try {
       const persistedState = await createPersistedState(persistedStateOptions)
       plugins.push(persistedState)
@@ -80,51 +80,23 @@ const persistedStateOptions = {
       console.error('Storage error', e)
       storageError = e
     }
-    document.querySelector('#mascot').src = `/static/pleromatan_apology${isFox}.png`
+    document.querySelector('#splash').classList.remove('initial-hidden')
+    document.querySelector('#mascot').src = `/static/pleromatan_apology${isFox}_small.webp`
     document.querySelector('#status').removeAttribute('class')
     document.querySelector('#status').textContent = i18n.global.t('splash.loading')
     document.querySelector('#splash-credit').textContent = i18n.global.t('update.art_by', { linkToArtist: 'pipivovott' })
     const store = createStore({
-      modules: {
-        i18n: {
-          getters: {
-            i18n: () => i18n.global
-          }
-        },
-        interface: interfaceModule,
-        instance: instanceModule,
-        // TODO refactor users/statuses modules, they depend on each other
-        users: usersModule,
-        statuses: statusesModule,
-        notifications: notificationsModule,
-        lists: listsModule,
-        api: apiModule,
-        config: configModule,
-        profileConfig: profileConfigModule,
-        serverSideStorage: serverSideStorageModule,
-        adminSettings: adminSettingsModule,
-        shout: shoutModule,
-        oauth: oauthModule,
-        authFlow: authFlowModule,
-        mediaViewer: mediaViewerModule,
-        oauthTokens: oauthTokensModule,
-        reports: reportsModule,
-        polls: pollsModule,
-        postStatus: postStatusModule,
-        editStatus: editStatusModule,
-        statusHistory: statusHistoryModule,
-        chats: chatsModule,
-        announcements: announcementsModule,
-        bookmarkFolders: bookmarkFoldersModule
-      },
+      modules: vuexModules,
       plugins,
+      options: {
+        devtools: process.env.NODE_ENV !== 'production'
+      },
       strict: false // Socket modifies itself, let's ignore this for now.
       // strict: process.env.NODE_ENV !== 'production'
     })
-    if (storageError) {
-      store.dispatch('pushGlobalNotice', { messageKey: 'errors.storage_unavailable', level: 'error' })
-    }
-    return await afterStoreSetup({ store, i18n })
+    window.vuex = store
+    // Temporarily passing pinia and vuex stores along with storageError result until migration is fully complete.
+    return await afterStoreSetup({ pinia, store, storageError, i18n })
   } catch (e) {
     splashError(i18n, e)
   }
diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js
index ef28f6e0b..8fb500393 100644
--- a/src/modules/adminSettings.js
+++ b/src/modules/adminSettings.js
@@ -60,7 +60,7 @@ const adminSettingsStorage = {
     }
   },
   actions: {
-    loadFrontendsStuff ({ state, rootState, dispatch, commit }) {
+    loadFrontendsStuff ({ rootState, commit }) {
       rootState.api.backendInteractor.fetchAvailableFrontends()
         .then(frontends => commit('setAvailableFrontends', { frontends }))
     },
@@ -84,9 +84,10 @@ const adminSettingsStorage = {
           .then(backendDescriptions => dispatch('setInstanceAdminDescriptions', { backendDescriptions }))
       }
     },
-    setInstanceAdminSettings ({ state, commit, dispatch }, { backendDbConfig }) {
+    setInstanceAdminSettings ({ state, commit }, { backendDbConfig }) {
       const config = state.config || {}
       const modifiedPaths = new Set()
+
       backendDbConfig.configs.forEach(c => {
         const path = [c.group, c.key]
         if (c.db) {
@@ -94,21 +95,48 @@ const adminSettingsStorage = {
           // Using strings for modified paths for easier searching
           c.db.forEach(x => modifiedPaths.add([...path, x].join(' -> ')))
         }
-        const convert = (value) => {
+
+        // we need to preserve tuples on second level only, possibly third
+        // but it's not a case right now.
+        const convert = (value, preserveTuples, preserveTuplesLv2) => {
           if (Array.isArray(value) && value.length > 0 && value[0].tuple) {
-            return value.reduce((acc, c) => {
-              return { ...acc, [c.tuple[0]]: convert(c.tuple[1]) }
-            }, {})
+            if (!preserveTuples) {
+              return value.reduce((acc, c) => {
+                return { ...acc, [c.tuple[0]]: convert(c.tuple[1], preserveTuplesLv2) }
+              }, {})
+            } else {
+              return value.map(x => x.tuple)
+            }
           } else {
-            return value
+            if (!preserveTuples) {
+              return value
+            } else {
+              return value.tuple
+            }
           }
         }
-        set(config, path, convert(c.value))
+        // for most stuff we want maps since those are more convenient
+        // however this doesn't allow for multiple values per same key
+        // so for those cases we want to preserve tuples as-is
+        // right now it's made exclusively for :pleroma.:rate_limit
+        // so it might not work properly elsewhere
+        const preserveTuples = path.find(x => x === ':rate_limit')
+        set(config, path, convert(c.value, false, preserveTuples))
       })
+      console.log('CONFIG', JSON.parse(JSON.stringify(config)))
+      // patching http adapter config to be easier to handle
+      const adapter = config[':pleroma'][':http'][':adapter']
+      if (Array.isArray(adapter)) {
+        config[':pleroma'][':http'][':adapter'] = {
+          [':ssl_options']: {
+            [':versions']: []
+          }
+        }
+      }
       commit('updateAdminSettings', { config, modifiedPaths })
       commit('resetAdminDraft')
     },
-    setInstanceAdminDescriptions ({ state, commit, dispatch }, { backendDescriptions }) {
+    setInstanceAdminDescriptions ({ commit }, { backendDescriptions }) {
       const convert = ({ children, description, label, key = '<ROOT>', group, suggestions }, path, acc) => {
         const newPath = group ? [group, key] : [key]
         const obj = { description, label, suggestions }
@@ -121,13 +149,15 @@ const adminSettingsStorage = {
       }
 
       const descriptions = {}
+
       backendDescriptions.forEach(d => convert(d, '', descriptions))
+      console.log('DESCRIPTIONS', descriptions)
       commit('updateAdminDescriptions', { descriptions })
     },
 
     // This action takes draft state, diffs it with live config state and then pushes
     // only differences between the two. Difference detection only work up to subkey (third) level.
-    pushAdminDraft ({ rootState, state, commit, dispatch }) {
+    pushAdminDraft ({ rootState, state, dispatch }) {
       // TODO cleanup paths in modifiedPaths
       const convert = (value) => {
         if (typeof value !== 'object') {
@@ -177,7 +207,7 @@ const adminSettingsStorage = {
         .then(() => rootState.api.backendInteractor.fetchInstanceDBConfig())
         .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig }))
     },
-    pushAdminSetting ({ rootState, state, commit, dispatch }, { path, value }) {
+    pushAdminSetting ({ rootState, dispatch }, { path, value }) {
       const [group, key, ...rest] = Array.isArray(path) ? path : path.split(/\./g)
       const clone = {} // not actually cloning the entire thing to avoid excessive writes
       set(clone, rest, value)
@@ -205,8 +235,8 @@ const adminSettingsStorage = {
         .then(() => rootState.api.backendInteractor.fetchInstanceDBConfig())
         .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig }))
     },
-    resetAdminSetting ({ rootState, state, commit, dispatch }, { path }) {
-      const [group, key, subkey] = path.split(/\./g)
+    resetAdminSetting ({ rootState, state, dispatch }, { path }) {
+      const [group, key, subkey] = Array.isArray(path) ? path : path.split(/\./g)
 
       state.modifiedPaths.delete(path)
 
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
deleted file mode 100644
index 4504263bf..000000000
--- a/src/modules/announcements.js
+++ /dev/null
@@ -1,135 +0,0 @@
-const FETCH_ANNOUNCEMENT_INTERVAL_MS = 1000 * 60 * 5
-
-export const defaultState = {
-  announcements: [],
-  supportsAnnouncements: true,
-  fetchAnnouncementsTimer: undefined
-}
-
-export const mutations = {
-  setAnnouncements (state, announcements) {
-    state.announcements = announcements
-  },
-  setAnnouncementRead (state, { id, read }) {
-    const index = state.announcements.findIndex(a => a.id === id)
-
-    if (index < 0) {
-      return
-    }
-
-    state.announcements[index].read = read
-  },
-  setFetchAnnouncementsTimer (state, timer) {
-    state.fetchAnnouncementsTimer = timer
-  },
-  setSupportsAnnouncements (state, supportsAnnouncements) {
-    state.supportsAnnouncements = supportsAnnouncements
-  }
-}
-
-export const getters = {
-  unreadAnnouncementCount (state, _getters, rootState) {
-    if (!rootState.users.currentUser) {
-      return 0
-    }
-
-    const unread = state.announcements.filter(announcement => !(announcement.inactive || announcement.read))
-    return unread.length
-  }
-}
-
-const announcements = {
-  state: defaultState,
-  mutations,
-  getters,
-  actions: {
-    fetchAnnouncements (store) {
-      if (!store.state.supportsAnnouncements) {
-        return Promise.resolve()
-      }
-
-      const currentUser = store.rootState.users.currentUser
-      const isAdmin = currentUser && currentUser.privileges.includes('announcements_manage_announcements')
-
-      const getAnnouncements = async () => {
-        if (!isAdmin) {
-          return store.rootState.api.backendInteractor.fetchAnnouncements()
-        }
-
-        const all = await store.rootState.api.backendInteractor.adminFetchAnnouncements()
-        const visible = await store.rootState.api.backendInteractor.fetchAnnouncements()
-        const visibleObject = visible.reduce((a, c) => {
-          a[c.id] = c
-          return a
-        }, {})
-        const getWithinVisible = announcement => visibleObject[announcement.id]
-
-        all.forEach(announcement => {
-          const visibleAnnouncement = getWithinVisible(announcement)
-          if (!visibleAnnouncement) {
-            announcement.inactive = true
-          } else {
-            announcement.read = visibleAnnouncement.read
-          }
-        })
-
-        return all
-      }
-
-      return getAnnouncements()
-        .then(announcements => {
-          store.commit('setAnnouncements', announcements)
-        })
-        .catch(error => {
-          // If and only if backend does not support announcements, it would return 404.
-          // In this case, silently ignores it.
-          if (error && error.statusCode === 404) {
-            store.commit('setSupportsAnnouncements', false)
-          } else {
-            throw error
-          }
-        })
-    },
-    markAnnouncementAsRead (store, id) {
-      return store.rootState.api.backendInteractor.dismissAnnouncement({ id })
-        .then(() => {
-          store.commit('setAnnouncementRead', { id, read: true })
-        })
-    },
-    startFetchingAnnouncements (store) {
-      if (store.state.fetchAnnouncementsTimer) {
-        return
-      }
-
-      const interval = setInterval(() => store.dispatch('fetchAnnouncements'), FETCH_ANNOUNCEMENT_INTERVAL_MS)
-      store.commit('setFetchAnnouncementsTimer', interval)
-
-      return store.dispatch('fetchAnnouncements')
-    },
-    stopFetchingAnnouncements (store) {
-      const interval = store.state.fetchAnnouncementsTimer
-      store.commit('setFetchAnnouncementsTimer', undefined)
-      clearInterval(interval)
-    },
-    postAnnouncement (store, { content, startsAt, endsAt, allDay }) {
-      return store.rootState.api.backendInteractor.postAnnouncement({ content, startsAt, endsAt, allDay })
-        .then(() => {
-          return store.dispatch('fetchAnnouncements')
-        })
-    },
-    editAnnouncement (store, { id, content, startsAt, endsAt, allDay }) {
-      return store.rootState.api.backendInteractor.editAnnouncement({ id, content, startsAt, endsAt, allDay })
-        .then(() => {
-          return store.dispatch('fetchAnnouncements')
-        })
-    },
-    deleteAnnouncement (store, id) {
-      return store.rootState.api.backendInteractor.deleteAnnouncement({ id })
-        .then(() => {
-          return store.dispatch('fetchAnnouncements')
-        })
-    }
-  }
-}
-
-export default announcements
diff --git a/src/modules/api.js b/src/modules/api.js
index 23364fcd6..ab8d7162f 100644
--- a/src/modules/api.js
+++ b/src/modules/api.js
@@ -2,6 +2,8 @@ import backendInteractorService from '../services/backend_interactor_service/bac
 import { WSConnectionStatus } from '../services/api/api.service.js'
 import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
 import { Socket } from 'phoenix'
+import { useShoutStore } from 'src/stores/shout.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
 
 const retryTimeout = (multiplier) => 1000 * multiplier
 
@@ -25,7 +27,7 @@ const api = {
     addFetcher (state, { fetcherName, fetcher }) {
       state.fetchers[fetcherName] = fetcher
     },
-    removeFetcher (state, { fetcherName, fetcher }) {
+    removeFetcher (state, { fetcherName }) {
       state.fetchers[fetcherName].stop()
       delete state.fetchers[fetcherName]
     },
@@ -87,6 +89,9 @@ const api = {
           const { state, commit, dispatch, rootState } = store
           const timelineData = rootState.statuses.timelines.friends
           state.mastoUserSocket = state.backendInteractor.startUserSocket({ store })
+          state.mastoUserSocket.addEventListener('pleroma:authenticated', () => {
+            state.mastoUserSocket.subscribe('user')
+          })
           state.mastoUserSocket.addEventListener(
             'message',
             ({ detail: message }) => {
@@ -131,7 +136,7 @@ const api = {
           state.mastoUserSocket.addEventListener('open', () => {
             // Do not show notification when we just opened up the page
             if (state.mastoUserSocketStatus !== WSConnectionStatus.STARTING_INITIAL) {
-              dispatch('pushGlobalNotice', {
+              useInterfaceStore().pushGlobalNotice({
                 level: 'success',
                 messageKey: 'timeline.socket_reconnected',
                 timeout: 5000
@@ -173,7 +178,7 @@ const api = {
                 dispatch('startFetchingTimeline', { timeline: 'friends' })
                 dispatch('startFetchingNotifications')
                 dispatch('startFetchingChats')
-                dispatch('pushGlobalNotice', {
+                useInterfaceStore().pushGlobalNotice({
                   level: 'error',
                   messageKey: 'timeline.socket_broke',
                   messageArgs: [code],
@@ -206,6 +211,7 @@ const api = {
       statusId = false,
       bookmarkFolderId = false
     }) {
+      if (timeline === 'favourites' && !store.rootState.instance.pleromaPublicFavouritesAvailable) return
       if (store.state.fetchers[timeline]) return
 
       const fetcher = store.state.backendInteractor.startFetchingTimeline({
@@ -276,6 +282,7 @@ const api = {
     // Bookmark folders
     startFetchingBookmarkFolders (store) {
       if (store.state.fetchers.bookmarkFolders) return
+      if (!store.rootState.instance.pleromaBookmarkFoldersAvailable) return
       const fetcher = store.state.backendInteractor.startFetchingBookmarkFolders({ store })
       store.commit('addFetcher', { fetcherName: 'bookmarkFolders', fetcher })
     },
@@ -289,7 +296,7 @@ const api = {
     setWsToken (store, token) {
       store.commit('setWsToken', token)
     },
-    initializeSocket ({ dispatch, commit, state, rootState }) {
+    initializeSocket ({ commit, state, rootState }) {
       // Set up websocket connection
       const token = state.wsToken
       if (rootState.instance.shoutAvailable && typeof token !== 'undefined' && state.socket === null) {
@@ -297,7 +304,7 @@ const api = {
         socket.connect()
 
         commit('setSocket', socket)
-        dispatch('initializeShout', socket)
+        useShoutStore().initializeShout(socket)
       }
     },
     disconnectFromSocket ({ commit, state }) {
diff --git a/src/modules/auth_flow.js b/src/modules/auth_flow.js
deleted file mode 100644
index 956d40e80..000000000
--- a/src/modules/auth_flow.js
+++ /dev/null
@@ -1,84 +0,0 @@
-const PASSWORD_STRATEGY = 'password'
-const TOKEN_STRATEGY = 'token'
-
-// MFA strategies
-const TOTP_STRATEGY = 'totp'
-const RECOVERY_STRATEGY = 'recovery'
-
-// initial state
-const state = {
-  settings: {},
-  strategy: PASSWORD_STRATEGY,
-  initStrategy: PASSWORD_STRATEGY // default strategy from config
-}
-
-const resetState = (state) => {
-  state.strategy = state.initStrategy
-  state.settings = {}
-}
-
-// getters
-const getters = {
-  settings: (state, getters) => {
-    return state.settings
-  },
-  requiredPassword: (state, getters, rootState) => {
-    return state.strategy === PASSWORD_STRATEGY
-  },
-  requiredToken: (state, getters, rootState) => {
-    return state.strategy === TOKEN_STRATEGY
-  },
-  requiredTOTP: (state, getters, rootState) => {
-    return state.strategy === TOTP_STRATEGY
-  },
-  requiredRecovery: (state, getters, rootState) => {
-    return state.strategy === RECOVERY_STRATEGY
-  }
-}
-
-// mutations
-const mutations = {
-  setInitialStrategy (state, strategy) {
-    if (strategy) {
-      state.initStrategy = strategy
-      state.strategy = strategy
-    }
-  },
-  requirePassword (state) {
-    state.strategy = PASSWORD_STRATEGY
-  },
-  requireToken (state) {
-    state.strategy = TOKEN_STRATEGY
-  },
-  requireMFA (state, { settings }) {
-    state.settings = settings
-    state.strategy = TOTP_STRATEGY // default strategy of MFA
-  },
-  requireRecovery (state) {
-    state.strategy = RECOVERY_STRATEGY
-  },
-  requireTOTP (state) {
-    state.strategy = TOTP_STRATEGY
-  },
-  abortMFA (state) {
-    resetState(state)
-  }
-}
-
-// actions
-const actions = {
-  // eslint-disable-next-line camelcase
-  async login ({ state, dispatch, commit }, { access_token }) {
-    commit('setToken', access_token, { root: true })
-    await dispatch('loginUser', access_token, { root: true })
-    resetState(state)
-  }
-}
-
-export default {
-  namespaced: true,
-  state,
-  getters,
-  mutations,
-  actions
-}
diff --git a/src/modules/bookmark_folders.js b/src/modules/bookmark_folders.js
deleted file mode 100644
index c276adf4b..000000000
--- a/src/modules/bookmark_folders.js
+++ /dev/null
@@ -1,66 +0,0 @@
-import { remove, find } from 'lodash'
-
-export const defaultState = {
-  allFolders: []
-}
-
-export const mutations = {
-  setBookmarkFolders (state, value) {
-    state.allFolders = value
-  },
-  setBookmarkFolder (state, { id, name, emoji, emoji_url: emojiUrl }) {
-    const entry = find(state.allFolders, { id })
-    if (!entry) {
-      state.allFolders.push({ id, name, emoji, emoji_url: emojiUrl })
-    } else {
-      entry.name = name
-      entry.emoji = emoji
-      entry.emoji_url = emojiUrl
-    }
-  },
-  deleteBookmarkFolder (state, { folderId }) {
-    remove(state.allFolders, folder => folder.id === folderId)
-  }
-}
-
-const actions = {
-  setBookmarkFolders ({ commit }, value) {
-    commit('setBookmarkFolders', value)
-  },
-  createBookmarkFolder ({ rootState, commit }, { name, emoji }) {
-    return rootState.api.backendInteractor.createBookmarkFolder({ name, emoji })
-      .then((folder) => {
-        commit('setBookmarkFolder', folder)
-        return folder
-      })
-  },
-  setBookmarkFolder ({ rootState, commit }, { folderId, name, emoji }) {
-    return rootState.api.backendInteractor.updateBookmarkFolder({ folderId, name, emoji })
-      .then((folder) => {
-        commit('setBookmarkFolder', folder)
-        return folder
-      })
-  },
-  deleteBookmarkFolder ({ rootState, commit }, { folderId }) {
-    rootState.api.backendInteractor.deleteBookmarkFolder({ folderId })
-    commit('deleteBookmarkFolder', { folderId })
-  }
-}
-
-export const getters = {
-  findBookmarkFolderName: state => id => {
-    const folder = state.allFolders.find(folder => folder.id === id)
-
-    if (!folder) return
-    return folder.name
-  }
-}
-
-const bookmarkFolders = {
-  state: defaultState,
-  mutations,
-  actions,
-  getters
-}
-
-export default bookmarkFolders
diff --git a/src/modules/chats.js b/src/modules/chats.js
index 0f1540db2..b7a1a5c23 100644
--- a/src/modules/chats.js
+++ b/src/modules/chats.js
@@ -53,7 +53,7 @@ const chats = {
     stopFetchingChats ({ commit }) {
       commit('setChatListFetcher', { fetcher: undefined })
     },
-    fetchChats ({ dispatch, rootState, commit }, params = {}) {
+    fetchChats ({ dispatch, rootState }) {
       return rootState.api.backendInteractor.chats()
         .then(({ chats }) => {
           dispatch('addNewChats', { chats })
@@ -73,13 +73,13 @@ const chats = {
     },
 
     // Opened Chats
-    startFetchingCurrentChat ({ commit, dispatch }, { fetcher }) {
+    startFetchingCurrentChat ({ dispatch }, { fetcher }) {
       dispatch('setCurrentChatFetcher', { fetcher })
     },
-    setCurrentChatFetcher ({ rootState, commit }, { fetcher }) {
+    setCurrentChatFetcher ({ commit }, { fetcher }) {
       commit('setCurrentChatFetcher', { fetcher })
     },
-    addOpenedChat ({ rootState, commit, dispatch }, { chat }) {
+    addOpenedChat ({ commit, dispatch }, { chat }) {
       commit('addOpenedChat', { dispatch, chat: parseChat(chat) })
       dispatch('addNewUsers', [chat.account])
     },
@@ -89,7 +89,7 @@ const chats = {
     resetChatNewMessageCount ({ commit }, value) {
       commit('resetChatNewMessageCount', value)
     },
-    clearCurrentChat ({ rootState, commit, dispatch }, value) {
+    clearCurrentChat ({ commit }) {
       commit('setCurrentChatId', { chatId: undefined })
       commit('setCurrentChatFetcher', { fetcher: undefined })
     },
@@ -111,7 +111,7 @@ const chats = {
       dispatch('clearCurrentChat')
       commit('resetChats', { commit })
     },
-    clearOpenedChats ({ rootState, commit, dispatch, rootGetters }) {
+    clearOpenedChats ({ commit }) {
       commit('clearOpenedChats', { commit })
     },
     handleMessageError ({ commit }, value) {
@@ -122,7 +122,7 @@ const chats = {
     }
   },
   mutations: {
-    setChatListFetcher (state, { commit, fetcher }) {
+    setChatListFetcher (state, { fetcher }) {
       const prevFetcher = state.chatListFetcher
       if (prevFetcher) {
         prevFetcher.stop()
@@ -136,7 +136,7 @@ const chats = {
       }
       state.fetcher = fetcher && fetcher()
     },
-    addOpenedChat (state, { _dispatch, chat }) {
+    addOpenedChat (state, { chat }) {
       state.currentChatId = chat.id
       state.openedChats[chat.id] = chat
 
@@ -165,7 +165,7 @@ const chats = {
         }
       })
     },
-    updateChat (state, { _dispatch, chat: updatedChat, _rootGetters }) {
+    updateChat (state, { chat: updatedChat }) {
       const chat = getChatById(state, updatedChat.id)
       if (chat) {
         chat.lastMessage = updatedChat.lastMessage
@@ -175,7 +175,7 @@ const chats = {
       if (!chat) { state.chatList.data.unshift(updatedChat) }
       state.chatList.idStore[updatedChat.id] = updatedChat
     },
-    deleteChat (state, { _dispatch, id, _rootGetters }) {
+    deleteChat (state, { id }) {
       state.chats.data = state.chats.data.filter(conversation =>
         conversation.last_status.id !== id
       )
@@ -206,7 +206,7 @@ const chats = {
         chatService.deleteMessage(chatMessageService, messageId)
       }
     },
-    resetChatNewMessageCount (state, _value) {
+    resetChatNewMessageCount (state) {
       const chatMessageService = state.openedChatMessageServices[state.currentChatId]
       chatService.resetNewMessageCount(chatMessageService)
     },
diff --git a/src/modules/config.js b/src/modules/config.js
index 835dcce40..8b4691341 100644
--- a/src/modules/config.js
+++ b/src/modules/config.js
@@ -3,12 +3,17 @@ import { applyConfig } from '../services/style_setter/style_setter.js'
 import messages from '../i18n/messages'
 import { set } from 'lodash'
 import localeService from '../services/locale/locale.service.js'
+import { useI18nStore } from 'src/stores/i18n.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
+
+import { instanceDefaultConfig, defaultState } from './default_config_state.js'
 
 const BACKEND_LANGUAGE_COOKIE_NAME = 'userLanguage'
 const APPEARANCE_SETTINGS_KEYS = new Set([
   'sidebarColumnWidth',
   'contentColumnWidth',
   'notifsColumnWidth',
+  'themeEditorMinWidth',
   'textSize',
   'navbarSize',
   'panelHeaderSize',
@@ -17,8 +22,6 @@ const APPEARANCE_SETTINGS_KEYS = new Set([
   'emojiReactionsScale'
 ])
 
-const browserLocale = (window.navigator.language || 'en').split('-')[0]
-
 /* TODO this is a bit messy.
  * We need to declare settings with their types and also deal with
  * instance-default settings in some way, hopefully try to avoid copy-pasta
@@ -30,170 +33,17 @@ export const multiChoiceProperties = [
   'conversationDisplay', // tree | linear
   'conversationOtherRepliesButton', // below | inside
   'mentionLinkDisplay', // short | full_for_remote | full
-  'userPopoverAvatarAction' // close | zoom | open
+  'userPopoverAvatarAction', // close | zoom | open
+  'unsavedPostAction' // save | discard | confirm
 ]
 
-export const defaultState = {
-  expertLevel: 0, // used to track which settings to show and hide
-
-  // Theme  stuff
-  theme: undefined, // Very old theme store, stores preset name, still in use
-
-  // V1
-  colors: {}, // VERY old theme store, just colors of V1, probably not even used anymore
-
-  // V2
-  customTheme: undefined, // "snapshot", previously was used as actual theme store for V2 so it's still used in case of PleromaFE downgrade event.
-  customThemeSource: undefined, // "source", stores original theme data
-
-  // V3
-  themeDebug: false, // debug mode that uses computed backgrounds instead of real ones to debug contrast functions
-  forceThemeRecompilation: false, //  flag that forces recompilation on boot even if cache exists
-  theme3hacks: { // Hacks, user overrides that are independent of theme used
-    underlay: 'none',
-    fonts: {
-      interface: undefined,
-      input: undefined,
-      post: undefined,
-      monospace: undefined
-    }
-  },
-
-  hideISP: false,
-  hideInstanceWallpaper: false,
-  hideShoutbox: false,
-  // bad name: actually hides posts of muted USERS
-  hideMutedPosts: undefined, // instance default
-  hideMutedThreads: undefined, // instance default
-  hideWordFilteredPosts: undefined, // instance default
-  muteBotStatuses: undefined, // instance default
-  muteSensitiveStatuses: undefined, // instance default
-  collapseMessageWithSubject: undefined, // instance default
-  padEmoji: true,
-  hideAttachments: false,
-  hideAttachmentsInConv: false,
-  hideScrobbles: false,
-  hideScrobblesAfter: '2d',
-  maxThumbnails: 16,
-  hideNsfw: true,
-  preloadImage: true,
-  loopVideo: true,
-  loopVideoSilentOnly: true,
-  streaming: false,
-  emojiReactionsOnTimeline: true,
-  alwaysShowNewPostButton: false,
-  autohideFloatingPostButton: false,
-  pauseOnUnfocused: true,
-  stopGifs: true,
-  replyVisibility: 'all',
-  thirdColumnMode: 'notifications',
-  notificationVisibility: {
-    follows: true,
-    mentions: true,
-    statuses: true,
-    likes: true,
-    repeats: true,
-    moves: true,
-    emojiReactions: true,
-    followRequest: true,
-    reports: true,
-    chatMention: true,
-    polls: true
-  },
-  notificationNative: {
-    follows: true,
-    mentions: true,
-    statuses: true,
-    likes: false,
-    repeats: false,
-    moves: false,
-    emojiReactions: false,
-    followRequest: true,
-    reports: true,
-    chatMention: true,
-    polls: true
-  },
-  webPushNotifications: false,
-  webPushAlwaysShowNotifications: false,
-  muteWords: [],
-  highlight: {},
-  interfaceLanguage: browserLocale,
-  hideScopeNotice: false,
-  useStreamingApi: false,
-  sidebarRight: undefined, // instance default
-  scopeCopy: undefined, // instance default
-  subjectLineBehavior: undefined, // instance default
-  alwaysShowSubjectInput: undefined, // instance default
-  postContentType: undefined, // instance default
-  minimalScopesMode: undefined, // instance default
-  // This hides statuses filtered via a word filter
-  hideFilteredStatuses: undefined, // instance default
-  modalOnRepeat: undefined, // instance default
-  modalOnUnfollow: undefined, // instance default
-  modalOnBlock: undefined, // instance default
-  modalOnMute: undefined, // instance default
-  modalOnDelete: undefined, // instance default
-  modalOnLogout: undefined, // instance default
-  modalOnApproveFollow: undefined, // instance default
-  modalOnDenyFollow: undefined, // instance default
-  modalOnRemoveUserFromFollowers: undefined, // instance default
-  playVideosInModal: false,
-  useOneClickNsfw: false,
-  useContainFit: true,
-  disableStickyHeaders: false,
-  showScrollbars: false,
-  userPopoverAvatarAction: 'open',
-  userPopoverOverlay: false,
-  sidebarColumnWidth: '25rem',
-  contentColumnWidth: '45rem',
-  notifsColumnWidth: '25rem',
-  emojiReactionsScale: undefined,
-  textSize: undefined, // instance default
-  emojiSize: undefined, // instance default
-  navbarSize: undefined, // instance default
-  panelHeaderSize: undefined, // instance default
-  forcedRoundness: undefined, // instance default
-  navbarColumnStretch: false,
-  greentext: undefined, // instance default
-  useAtIcon: undefined, // instance default
-  mentionLinkDisplay: undefined, // instance default
-  mentionLinkShowTooltip: undefined, // instance default
-  mentionLinkShowAvatar: undefined, // instance default
-  mentionLinkFadeDomain: undefined, // instance default
-  mentionLinkShowYous: undefined, // instance default
-  mentionLinkBoldenYou: undefined, // instance default
-  hidePostStats: undefined, // instance default
-  hideBotIndication: undefined, // instance default
-  hideUserStats: undefined, // instance default
-  virtualScrolling: undefined, // instance default
-  sensitiveByDefault: undefined, // instance default
-  conversationDisplay: undefined, // instance default
-  conversationTreeAdvanced: undefined, // instance default
-  conversationOtherRepliesButton: undefined, // instance default
-  conversationTreeFadeAncestors: undefined, // instance default
-  showExtraNotifications: undefined, // instance default
-  showExtraNotificationsTip: undefined, // instance default
-  showChatsInExtraNotifications: undefined, // instance default
-  showAnnouncementsInExtraNotifications: undefined, // instance default
-  showFollowRequestsInExtraNotifications: undefined, // instance default
-  maxDepthInThread: undefined, // instance default
-  autocompleteSelect: undefined, // instance default
-  closingDrawerMarksAsSeen: undefined, // instance default
-  unseenAtTop: undefined, // instance default
-  ignoreInactionableSeen: undefined, // instance default
-  useAbsoluteTimeFormat: undefined, // instance defualt
-  absoluteTimeFormatMinAge: undefined // instance default
-}
-
 // caching the instance default properties
-export const instanceDefaultProperties = Object.entries(defaultState)
-  .filter(([key, value]) => value === undefined)
-  .map(([key, value]) => key)
+export const instanceDefaultProperties = Object.keys(instanceDefaultConfig)
 
 const config = {
   state: { ...defaultState },
   getters: {
-    defaultConfig (state, getters, rootState, rootGetters) {
+    defaultConfig (state, getters, rootState) {
       const { instance } = rootState
       return {
         ...defaultState,
@@ -207,7 +57,7 @@ const config = {
       return {
         ...defaultConfig,
         // Do not override with undefined
-        ...Object.fromEntries(Object.entries(state).filter(([k, v]) => v !== undefined))
+        ...Object.fromEntries(Object.entries(state).filter(([, v]) => v !== undefined))
       }
     }
   },
@@ -243,11 +93,11 @@ const config = {
         name => dispatch('setOption', { name, value: data[name] })
       )
     },
-    setHighlight ({ commit, dispatch }, { user, color, type }) {
+    setHighlight ({ commit }, { user, color, type }) {
       commit('setHighlight', { user, color, type })
     },
-    setOptionTemporarily ({ commit, dispatch, state, rootState }, { name, value }) {
-      if (rootState.interface.temporaryChangesTimeoutId !== null) {
+    setOptionTemporarily ({ commit, dispatch, state }, { name, value }) {
+      if (useInterfaceStore().temporaryChangesTimeoutId !== null) {
         console.warn('Can\'t track more than one temporary change')
         return
       }
@@ -257,16 +107,15 @@ const config = {
 
       const confirm = () => {
         dispatch('setOption', { name, value })
-        commit('clearTemporaryChanges')
+        useInterfaceStore().clearTemporaryChanges()
       }
 
       const revert = () => {
         commit('setOptionTemporarily', { name, value: oldValue })
-        commit('clearTemporaryChanges')
+        useInterfaceStore().clearTemporaryChanges()
       }
 
-      commit('setTemporaryChanges', {
-        timeoutId: setTimeout(revert, 10000),
+      useInterfaceStore().setTemporaryChanges({
         confirm,
         revert
       })
@@ -303,7 +152,7 @@ const config = {
           applyConfig(state)
         }
         if (name.startsWith('theme3hacks')) {
-          dispatch('setTheme', { recompile: true })
+          dispatch('applyTheme', { recompile: true })
         }
         switch (name) {
           case 'theme':
@@ -315,7 +164,7 @@ const config = {
             break
           }
           case 'interfaceLanguage':
-            messages.setLanguage(this.getters.i18n, value)
+            messages.setLanguage(useI18nStore().i18n, value)
             dispatch('loadUnicodeEmojiData', value)
             Cookies.set(
               BACKEND_LANGUAGE_COOKIE_NAME,
@@ -323,7 +172,7 @@ const config = {
             )
             break
           case 'thirdColumnMode':
-            dispatch('setLayoutWidth', undefined)
+            useInterfaceStore().setLayoutWidth(undefined)
             break
         }
       }
diff --git a/src/modules/config_declaration.js b/src/modules/config_declaration.js
new file mode 100644
index 000000000..e3328d448
--- /dev/null
+++ b/src/modules/config_declaration.js
@@ -0,0 +1,42 @@
+export const CONFIG_MIGRATION = 1
+import { v4 as uuidv4 } from 'uuid';
+
+// for future use
+/*
+const simpleDeclaration = {
+  store: 'server-side',
+  migrationFlag: 'configMigration',
+  migration(serverside, rootState) {
+    serverside.setPreference({ path: 'simple.' + field, value: rootState.config[oldField ?? field] })
+  }
+}
+*/
+
+export const declarations = [
+  {
+    field: 'muteFilters',
+    store: 'server-side',
+    migrationFlag: 'configMigration',
+    migrationNum: 1,
+    description: 'Mute filters, wordfilter/regexp/etc',
+    valueType: 'complex',
+    migration (serverside, rootState) {
+      rootState.config.muteWords.forEach((word, order) => {
+        const uniqueId = uuidv4()
+
+        serverside.setPreference({
+          path: 'simple.muteFilters.' + uniqueId,
+          value: {
+            type: 'word',
+            value: word,
+            name: word,
+            enabled: true,
+            expires: null,
+            hide: false,
+            order
+          }
+        })
+      })
+    }
+  }
+]
diff --git a/src/modules/default_config_state.js b/src/modules/default_config_state.js
new file mode 100644
index 000000000..46cbf9ab5
--- /dev/null
+++ b/src/modules/default_config_state.js
@@ -0,0 +1,222 @@
+const browserLocale = (window.navigator.language || 'en').split('-')[0]
+
+/// Instance config entries provided by static config or pleroma api
+/// Put settings here only if it does not make sense for a normal user
+/// to override it.
+export const staticOrApiConfigDefault = {
+  theme: 'pleroma-dark',
+  palette: null,
+  style: null,
+  defaultAvatar: '/images/avi.png',
+  defaultBanner: '/images/banner.png',
+  background: '/static/aurora_borealis.jpg',
+  embeddedToS: true,
+  logo: '/static/logo.svg',
+  logoMargin: '.2em',
+  logoMask: true,
+  logoLeft: false,
+  redirectRootLogin: '/main/friends',
+  redirectRootNoLogin: '/main/all',
+  hideSitename: false,
+  nsfwCensorImage: undefined,
+  showFeaturesPanel: true,
+  showInstanceSpecificPanel: false,
+}
+
+/// This object contains setting entries that makes sense
+/// at the user level. The defaults can also be overriden by
+/// instance admins in the frontend_configuration endpoint or static config.
+export const instanceDefaultConfig = {
+  expertLevel: 0, // used to track which settings to show and hide
+  hideISP: false,
+  hideInstanceWallpaper: false,
+  hideShoutbox: false,
+  // bad name: actually hides posts of muted USERS
+  hideMutedPosts: false,
+  hideMutedThreads: true,
+  hideWordFilteredPosts: false,
+  muteBotStatuses: false,
+  muteSensitiveStatuses: false,
+  collapseMessageWithSubject: false,
+  padEmoji: true,
+  hideAttachments: false,
+  hideAttachmentsInConv: false,
+  hideScrobbles: false,
+  hideScrobblesAfter: '2d',
+  maxThumbnails: 16,
+  hideNsfw: true,
+  preloadImage: true,
+  loopVideo: true,
+  loopVideoSilentOnly: true,
+  /// This is not the streaming API configuration, but rather an option
+  /// for automatically loading new posts into the timeline without
+  /// the user clicking the Show New button.
+  streaming: false,
+  emojiReactionsOnTimeline: true,
+  alwaysShowNewPostButton: false,
+  autohideFloatingPostButton: false,
+  pauseOnUnfocused: true,
+  stopGifs: true,
+  replyVisibility: 'all',
+  thirdColumnMode: 'notifications',
+  notificationVisibility: {
+    follows: true,
+    mentions: true,
+    statuses: true,
+    likes: true,
+    repeats: true,
+    moves: true,
+    emojiReactions: true,
+    followRequest: true,
+    reports: true,
+    chatMention: true,
+    polls: true
+  },
+  notificationNative: {
+    follows: true,
+    mentions: true,
+    statuses: true,
+    likes: false,
+    repeats: false,
+    moves: false,
+    emojiReactions: false,
+    followRequest: true,
+    reports: true,
+    chatMention: true,
+    polls: true
+  },
+  webPushNotifications: false,
+  webPushAlwaysShowNotifications: false,
+  interfaceLanguage: browserLocale,
+  hideScopeNotice: false,
+  useStreamingApi: false,
+  sidebarRight: false,
+  scopeCopy: true,
+  subjectLineBehavior: 'email',
+  alwaysShowSubjectInput: true,
+  postContentType: 'text/plain',
+  minimalScopesMode: false,
+
+  // This hides statuses filtered via a word filter
+  hideFilteredStatuses: false,
+
+  // Confirmations
+  modalOnRepeat: false,
+  modalOnUnfollow: false,
+  modalOnBlock: true,
+  modalOnMute: false,
+  modalOnMuteConversation: false,
+  modalOnMuteDomain: true,
+  modalOnDelete: true,
+  modalOnLogout: true,
+  modalOnApproveFollow: false,
+  modalOnDenyFollow: false,
+  modalOnRemoveUserFromFollowers: false,
+
+  // Expiry confirmations/default actions
+  onMuteDefaultAction: 'ask',
+  onBlockDefaultAction: 'ask',
+
+  modalMobileCenter: false,
+  playVideosInModal: false,
+  useOneClickNsfw: false,
+  useContainFit: true,
+  disableStickyHeaders: false,
+  showScrollbars: false,
+  userPopoverAvatarAction: 'open',
+  userPopoverOverlay: false,
+  userCardLeftJustify: false,
+  userCardHidePersonalMarks: false,
+  sidebarColumnWidth: '25rem',
+  contentColumnWidth: '45rem',
+  notifsColumnWidth: '25rem',
+  themeEditorMinWidth: '0rem',
+  emojiReactionsScale: 0.5,
+  textSize: '1rem',
+  emojiSize: '2.2rem',
+  navbarSize: '3.5rem',
+  panelHeaderSize: '3.2rem',
+  forcedRoundness: -1,
+  navbarColumnStretch: false,
+  greentext: false,
+  mentionLinkDisplay: 'short',
+  mentionLinkShowTooltip: true,
+  mentionLinkShowAvatar: false,
+  mentionLinkFadeDomain: true,
+  mentionLinkShowYous: false,
+  mentionLinkBoldenYou: true,
+  hidePostStats: false,
+  hideBotIndication: false,
+  hideUserStats: false,
+  virtualScrolling: true,
+  sensitiveByDefault: false,
+  conversationDisplay: 'linear',
+  conversationTreeAdvanced: false,
+  conversationOtherRepliesButton: 'below',
+  conversationTreeFadeAncestors: false,
+  showExtraNotifications: true,
+  showExtraNotificationsTip: true,
+  showChatsInExtraNotifications: true,
+  showAnnouncementsInExtraNotifications: true,
+  showFollowRequestsInExtraNotifications: true,
+  maxDepthInThread: 6,
+  autocompleteSelect: false,
+  closingDrawerMarksAsSeen: true,
+  unseenAtTop: false,
+  ignoreInactionableSeen: false,
+  unsavedPostAction: 'confirm',
+  autoSaveDraft: false,
+  useAbsoluteTimeFormat: false,
+  absoluteTimeFormatMinAge: '0d',
+  absoluteTime12h: '24h',
+  imageCompression: true,
+  alwaysUseJpeg: false
+}
+
+export const makeUndefined = c => Object.fromEntries(Object.keys(c).map(key => [key, undefined]))
+
+/// For properties with special processing or properties that does not
+/// make sense to be overriden on a instance-wide level.
+export const defaultState = {
+  // Set these to undefined so it does not interfere with default settings check
+  ...makeUndefined(instanceDefaultConfig),
+
+  // Special processing
+  // Theme  stuff
+  theme: undefined, // Very old theme store, stores preset name, still in use
+
+  // V1
+  colors: {}, // VERY old theme store, just colors of V1, probably not even used anymore
+
+  // V2
+  customTheme: undefined, // "snapshot", previously was used as actual theme store for V2 so it's still used in case of PleromaFE downgrade event.
+  customThemeSource: undefined, // "source", stores original theme data
+
+  // V3
+  style: null,
+  styleCustomData: null,
+  palette: null,
+  paletteCustomData: null,
+  themeDebug: false, // debug mode that uses computed backgrounds instead of real ones to debug contrast functions
+  forceThemeRecompilation: false, //  flag that forces recompilation on boot even if cache exists
+  theme3hacks: { // Hacks, user overrides that are independent of theme used
+    underlay: 'none',
+    fonts: {
+      interface: undefined,
+      input: undefined,
+      post: undefined,
+      monospace: undefined
+    }
+  },
+
+  // Special handling: These fields are not of a primitive type, and
+  // might cause problems with current code because it specifically checks
+  // them in state.config (not getters.mergedConfig).
+
+  // Specifically, muteWords is now deprecated in favour of a server-side configuration.
+  muteWords: [],
+  highlight: {},
+
+  // If there are any configurations that does not make sense to
+  // have instance-wide default, put it here and explain why.
+}
diff --git a/src/modules/drafts.js b/src/modules/drafts.js
new file mode 100644
index 000000000..7a38fe2d5
--- /dev/null
+++ b/src/modules/drafts.js
@@ -0,0 +1,86 @@
+import { storage } from 'src/lib/storage.js'
+
+export const defaultState = {
+  drafts: {}
+}
+
+export const mutations = {
+  addOrSaveDraft (state, { draft }) {
+    state.drafts[draft.id] = draft
+  },
+  abandonDraft (state, { id }) {
+    delete state.drafts[id]
+  },
+  loadDrafts (state, data) {
+    state.drafts = data
+  }
+}
+
+const storageKey = 'pleroma-fe-drafts'
+
+/*
+ * Note: we do not use the persist state plugin because
+ * it is not impossible for a user to have two windows at
+ * the same time. The persist state plugin is just overriding
+ * everything with the current state. This isn't good because
+ * if a draft is created in one window and another draft is
+ * created in another, the draft in the first window will just
+ * be overriden.
+ * Here, we can't guarantee 100% atomicity unless one uses
+ * different keys, which will just pollute the whole storage.
+ * It is indeed best to have backend support for this.
+ */
+const getStorageData = async () => ((await storage.getItem(storageKey)) || {})
+
+const saveDraftToStorage = async (draft) => {
+  const currentData = await getStorageData()
+  currentData[draft.id] = JSON.parse(JSON.stringify(draft))
+  await storage.setItem(storageKey, currentData)
+}
+
+const deleteDraftFromStorage = async (id) => {
+  const currentData = await getStorageData()
+  delete currentData[id]
+  await storage.setItem(storageKey, currentData)
+}
+
+export const actions = {
+  async addOrSaveDraft (store, { draft }) {
+    const id = draft.id || (new Date().getTime()).toString()
+    const draftWithId = { ...draft, id }
+    store.commit('addOrSaveDraft', { draft: draftWithId })
+    await saveDraftToStorage(draftWithId)
+    return id
+  },
+  async abandonDraft (store, { id }) {
+    store.commit('abandonDraft', { id })
+    await deleteDraftFromStorage(id)
+  },
+  async loadDrafts (store) {
+    const currentData = await getStorageData()
+    store.commit('loadDrafts', currentData)
+  }
+}
+
+export const getters = {
+  draftsByTypeAndRefId (state) {
+    return (type, refId) => {
+      return Object.values(state.drafts).filter(draft => draft.type === type && draft.refId === refId)
+    }
+  },
+  draftsArray (state) {
+    return Object.values(state.drafts)
+  },
+  draftCount (state) {
+    return Object.values(state.drafts).length
+  }
+}
+
+const drafts = {
+  state: defaultState,
+  mutations,
+  getters,
+  actions
+}
+
+export default drafts
diff --git a/src/modules/editStatus.js b/src/modules/editStatus.js
deleted file mode 100644
index fd3165191..000000000
--- a/src/modules/editStatus.js
+++ /dev/null
@@ -1,25 +0,0 @@
-const editStatus = {
-  state: {
-    params: null,
-    modalActivated: false
-  },
-  mutations: {
-    openEditStatusModal (state, params) {
-      state.params = params
-      state.modalActivated = true
-    },
-    closeEditStatusModal (state) {
-      state.modalActivated = false
-    }
-  },
-  actions: {
-    openEditStatusModal ({ commit }, params) {
-      commit('openEditStatusModal', params)
-    },
-    closeEditStatusModal ({ commit }) {
-      commit('closeEditStatusModal')
-    }
-  }
-}
-
-export default editStatus
diff --git a/src/modules/errors.js b/src/modules/errors.js
deleted file mode 100644
index d2e241008..000000000
--- a/src/modules/errors.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { capitalize } from 'lodash'
-
-export function humanizeErrors (errors) {
-  return Object.entries(errors).reduce((errs, [k, val]) => {
-    const message = val.reduce((acc, message) => {
-      const key = capitalize(k.replace(/_/g, ' '))
-      return acc + [key, message].join(' ') + '. '
-    }, '')
-    return [...errs, message]
-  }, [])
-}
diff --git a/src/modules/index.js b/src/modules/index.js
new file mode 100644
index 000000000..fd233585d
--- /dev/null
+++ b/src/modules/index.js
@@ -0,0 +1,23 @@
+import instance from './instance.js'
+import statuses from './statuses.js'
+import notifications from './notifications.js'
+import users from './users.js'
+import api from './api.js'
+import config from './config.js'
+import profileConfig from './profileConfig.js'
+import adminSettings from './adminSettings.js'
+import drafts from './drafts.js'
+import chats from './chats.js'
+
+export default {
+  instance,
+  statuses,
+  notifications,
+  users,
+  api,
+  config,
+  profileConfig,
+  adminSettings,
+  drafts,
+  chats
+}
diff --git a/src/modules/instance.js b/src/modules/instance.js
index dac167933..1595dc6a4 100644
--- a/src/modules/instance.js
+++ b/src/modules/instance.js
@@ -1,6 +1,10 @@
 import apiService from '../services/api/api.service.js'
 import { instanceDefaultProperties } from './config.js'
-import { langCodeToCldrName, ensureFinalFallback } from '../i18n/languages.js'
+import { ensureFinalFallback } from '../i18n/languages.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
+// See build/emojis_plugin for more details
+import { annotationsLoader } from 'virtual:pleroma-fe/emoji-annotations'
+import { staticOrApiConfigDefault, instanceDefaultConfig } from './default_config_state.js';
 
 const SORTED_EMOJI_GROUP_IDS = [
   'smileys-and-emotion',
@@ -42,85 +46,22 @@ const defaultState = {
   registrationOpen: true,
   server: 'http://localhost:4040/',
   textlimit: 5000,
+  themesIndex: undefined,
+  stylesIndex: undefined,
+  palettesIndex: undefined,
   themeData: undefined, // used for theme editor v2
   vapidPublicKey: undefined,
 
   // Stuff from static/config.json
-  alwaysShowSubjectInput: true,
-  defaultAvatar: '/images/avi.png',
-  defaultBanner: '/images/banner.png',
-  background: '/static/aurora_borealis.jpg',
-  collapseMessageWithSubject: false,
-  greentext: false,
-  useAtIcon: false,
-  mentionLinkDisplay: 'short',
-  mentionLinkShowTooltip: true,
-  mentionLinkShowAvatar: false,
-  mentionLinkFadeDomain: true,
-  mentionLinkShowYous: false,
-  mentionLinkBoldenYou: true,
-  hideFilteredStatuses: false,
-  // bad name: actually hides posts of muted USERS
-  hideMutedPosts: false,
-  hideMutedThreads: true,
-  hideWordFilteredPosts: false,
-  hidePostStats: false,
-  hideBotIndication: false,
-  hideSitename: false,
-  hideUserStats: false,
-  muteBotStatuses: false,
-  muteSensitiveStatuses: false,
-  modalOnRepeat: false,
-  modalOnUnfollow: false,
-  modalOnBlock: true,
-  modalOnMute: false,
-  modalOnDelete: true,
-  modalOnLogout: true,
-  modalOnApproveFollow: false,
-  modalOnDenyFollow: false,
-  modalOnRemoveUserFromFollowers: false,
   loginMethod: 'password',
-  logo: '/static/logo.svg',
-  logoMargin: '.2em',
-  logoMask: true,
-  logoLeft: false,
   disableUpdateNotification: false,
-  minimalScopesMode: false,
-  nsfwCensorImage: undefined,
-  postContentType: 'text/plain',
-  redirectRootLogin: '/main/friends',
-  redirectRootNoLogin: '/main/all',
-  scopeCopy: true,
-  showFeaturesPanel: true,
-  showInstanceSpecificPanel: false,
-  sidebarRight: false,
-  subjectLineBehavior: 'email',
-  theme: 'pleroma-dark',
-  emojiReactionsScale: 0.5,
-  textSize: '14px',
-  emojiSize: '2.2rem',
-  navbarSize: '3.5rem',
-  panelHeaderSize: '3.2rem',
-  forcedRoundness: -1,
+
   fontsOverride: {},
-  virtualScrolling: true,
-  sensitiveByDefault: false,
-  conversationDisplay: 'linear',
-  conversationTreeAdvanced: false,
-  conversationOtherRepliesButton: 'below',
-  conversationTreeFadeAncestors: false,
-  showExtraNotifications: true,
-  showExtraNotificationsTip: true,
-  showChatsInExtraNotifications: true,
-  showAnnouncementsInExtraNotifications: true,
-  showFollowRequestsInExtraNotifications: true,
-  maxDepthInThread: 6,
-  autocompleteSelect: false,
-  closingDrawerMarksAsSeen: true,
-  unseenAtTop: false,
-  ignoreInactionableSeen: false,
-  useAbsoluteTimeFormat: false,
-  absoluteTimeFormatMinAge: '0d',
+
+  // Instance-wide configurations that should not be changed by individual users
+  ...staticOrApiConfigDefault,
+  // Instance admins can override default settings for the whole instance
+  ...instanceDefaultConfig,
 
   // Nasty stuff
   customEmoji: [],
@@ -128,7 +69,7 @@ const defaultState = {
   emoji: {},
   emojiFetched: false,
   unicodeEmojiAnnotations: {},
-  pleromaBackend: true,
+  pleromaExtensionsAvailable: true,
   postFormats: [],
   restrictedNicknames: [],
   safeDM: true,
@@ -141,12 +82,16 @@ const defaultState = {
   pleromaChatMessagesAvailable: false,
   pleromaCustomEmojiReactionsAvailable: false,
   pleromaBookmarkFoldersAvailable: false,
+  pleromaPublicFavouritesAvailable: true,
+  statusNotificationTypeAvailable: true,
   gopherAvailable: false,
   mediaProxyAvailable: false,
   suggestionsEnabled: false,
   suggestionsWeb: '',
   quotingAvailable: false,
   groupActorAvailable: false,
+  blockExpiration: false,
+  localBubbleInstances: [], // Akkoma
 
   // Html stuff
   instanceSpecificPanelContent: '',
@@ -154,6 +99,7 @@ const defaultState = {
 
   // Version Information
   backendVersion: '',
+  backendRepository: '',
   frontendVersion: '',
 
   pollsAvailable: false,
@@ -166,10 +112,7 @@ const defaultState = {
 }
 
 const loadAnnotations = (lang) => {
-  return import(
-    /* webpackChunkName: "emoji-annotations/[request]" */
-    `@kazvmoe-infra/unicode-emoji-json/annotations/${langCodeToCldrName(lang)}.json`
-  )
+  return annotationsLoader[lang]()
     .then(k => k.default)
 }
 
@@ -280,7 +223,7 @@ const instance = {
       commit('setInstanceOption', { name, value })
       switch (name) {
         case 'name':
-          dispatch('setPageTitle')
+          useInterfaceStore().setPageTitle()
           break
         case 'shoutAvailable':
           if (value) {
@@ -291,7 +234,7 @@ const instance = {
     },
     async getStaticEmoji ({ commit }) {
       try {
-        const values = (await import(/* webpackChunkName: 'emoji' */ '../../static/emoji.json')).default
+        const values = (await import('/src/assets/emoji.json')).default
 
         const emoji = Object.keys(values).reduce((res, groupId) => {
           res[groupId] = values[groupId].map(e => ({
@@ -303,8 +246,7 @@ const instance = {
         }, {})
         commit('setInstanceOption', { name: 'emoji', value: injectRegionalIndicators(emoji) })
       } catch (e) {
-        console.warn("Can't load static emoji")
-        console.warn(e)
+        console.warn("Can't load static emoji\n", e)
       }
     },
 
@@ -328,7 +270,10 @@ const instance = {
 
     async getCustomEmoji ({ commit, state }) {
       try {
-        const res = await window.fetch('/api/pleroma/emoji.json')
+        let res = await window.fetch('/api/v1/pleroma/emoji')
+        if (!res.ok) {
+          res = await window.fetch('/api/pleroma/emoji.json')
+        }
         if (res.ok) {
           const result = await res.json()
           const values = Array.isArray(result) ? Object.assign({}, ...result) : result
@@ -371,8 +316,7 @@ const instance = {
           throw (res)
         }
       } catch (e) {
-        console.warn("Can't load custom emojis")
-        console.warn(e)
+        console.warn("Can't load custom emojis\n", e)
       }
     },
     fetchEmoji ({ dispatch, state }) {
@@ -393,8 +337,7 @@ const instance = {
         })
         commit('setKnownDomains', result)
       } catch (e) {
-        console.warn("Can't load known domains")
-        console.warn(e)
+        console.warn("Can't load known domains\n", e)
       }
     }
   }
diff --git a/src/modules/interface.js b/src/modules/interface.js
deleted file mode 100644
index 57bfe0c61..000000000
--- a/src/modules/interface.js
+++ /dev/null
@@ -1,402 +0,0 @@
-import { getPreset, applyTheme, tryLoadCache } from '../services/style_setter/style_setter.js'
-import { CURRENT_VERSION, generatePreset } from 'src/services/theme_data/theme_data.service.js'
-import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
-
-const defaultState = {
-  localFonts: null,
-  themeApplied: false,
-  temporaryChangesTimeoutId: null, // used for temporary options that revert after a timeout
-  temporaryChangesConfirm: () => {}, // used for applying temporary options
-  temporaryChangesRevert: () => {}, // used for reverting temporary options
-  settingsModalState: 'hidden',
-  settingsModalLoadedUser: false,
-  settingsModalLoadedAdmin: false,
-  settingsModalTargetTab: null,
-  settingsModalMode: 'user',
-  settings: {
-    currentSaveStateNotice: null,
-    noticeClearTimeout: null,
-    notificationPermission: null
-  },
-  browserSupport: {
-    cssFilter: window.CSS && window.CSS.supports && (
-      window.CSS.supports('filter', 'drop-shadow(0 0)') ||
-      window.CSS.supports('-webkit-filter', 'drop-shadow(0 0)')
-    ),
-    localFonts: typeof window.queryLocalFonts === 'function'
-  },
-  layoutType: 'normal',
-  globalNotices: [],
-  layoutHeight: 0,
-  lastTimeline: null
-}
-
-const interfaceMod = {
-  state: defaultState,
-  mutations: {
-    settingsSaved (state, { success, error }) {
-      if (success) {
-        if (state.noticeClearTimeout) {
-          clearTimeout(state.noticeClearTimeout)
-        }
-        state.settings.currentSaveStateNotice = { error: false, data: success }
-        state.settings.noticeClearTimeout = setTimeout(() => delete state.settings.currentSaveStateNotice, 2000)
-      } else {
-        state.settings.currentSaveStateNotice = { error: true, errorData: error }
-      }
-    },
-    setTemporaryChanges (state, { timeoutId, confirm, revert }) {
-      state.temporaryChangesTimeoutId = timeoutId
-      state.temporaryChangesConfirm = confirm
-      state.temporaryChangesRevert = revert
-    },
-    clearTemporaryChanges (state) {
-      clearTimeout(state.temporaryChangesTimeoutId)
-      state.temporaryChangesTimeoutId = null
-      state.temporaryChangesConfirm = () => {}
-      state.temporaryChangesRevert = () => {}
-    },
-    setThemeApplied (state) {
-      state.themeApplied = true
-    },
-    setNotificationPermission (state, permission) {
-      state.notificationPermission = permission
-    },
-    setLayoutType (state, value) {
-      state.layoutType = value
-    },
-    closeSettingsModal (state) {
-      state.settingsModalState = 'hidden'
-    },
-    togglePeekSettingsModal (state) {
-      switch (state.settingsModalState) {
-        case 'minimized':
-          state.settingsModalState = 'visible'
-          return
-        case 'visible':
-          state.settingsModalState = 'minimized'
-          return
-        default:
-          throw new Error('Illegal minimization state of settings modal')
-      }
-    },
-    openSettingsModal (state, value) {
-      state.settingsModalMode = value
-      state.settingsModalState = 'visible'
-      if (value === 'user') {
-        if (!state.settingsModalLoadedUser) {
-          state.settingsModalLoadedUser = true
-        }
-      } else if (value === 'admin') {
-        if (!state.settingsModalLoadedAdmin) {
-          state.settingsModalLoadedAdmin = true
-        }
-      }
-    },
-    setSettingsModalTargetTab (state, value) {
-      state.settingsModalTargetTab = value
-    },
-    pushGlobalNotice (state, notice) {
-      state.globalNotices.push(notice)
-    },
-    removeGlobalNotice (state, notice) {
-      state.globalNotices = state.globalNotices.filter(n => n !== notice)
-    },
-    setLayoutHeight (state, value) {
-      state.layoutHeight = value
-    },
-    setLayoutWidth (state, value) {
-      state.layoutWidth = value
-    },
-    setLastTimeline (state, value) {
-      state.lastTimeline = value
-    },
-    setFontsList (state, value) {
-      // Set is used here so that we filter out duplicate fonts (possibly same font but with different weight)
-      state.localFonts = [...(new Set(value.map(font => font.family))).values()]
-    }
-  },
-  actions: {
-    setPageTitle ({ rootState }, option = '') {
-      document.title = `${option} ${rootState.instance.name}`
-    },
-    settingsSaved ({ commit, dispatch }, { success, error }) {
-      commit('settingsSaved', { success, error })
-    },
-    setNotificationPermission ({ commit }, permission) {
-      commit('setNotificationPermission', permission)
-    },
-    closeSettingsModal ({ commit }) {
-      commit('closeSettingsModal')
-    },
-    openSettingsModal ({ commit }, value = 'user') {
-      commit('openSettingsModal', value)
-    },
-    togglePeekSettingsModal ({ commit }) {
-      commit('togglePeekSettingsModal')
-    },
-    clearSettingsModalTargetTab ({ commit }) {
-      commit('setSettingsModalTargetTab', null)
-    },
-    openSettingsModalTab ({ commit }, value) {
-      commit('setSettingsModalTargetTab', value)
-      commit('openSettingsModal', 'user')
-    },
-    pushGlobalNotice (
-      { commit, dispatch, state },
-      {
-        messageKey,
-        messageArgs = {},
-        level = 'error',
-        timeout = 0
-      }) {
-      const notice = {
-        messageKey,
-        messageArgs,
-        level
-      }
-      commit('pushGlobalNotice', notice)
-      // Adding a new element to array wraps it in a Proxy, which breaks the comparison
-      // TODO: Generate UUID or something instead or relying on !== operator?
-      const newNotice = state.globalNotices[state.globalNotices.length - 1]
-      if (timeout) {
-        setTimeout(() => dispatch('removeGlobalNotice', newNotice), timeout)
-      }
-      return newNotice
-    },
-    removeGlobalNotice ({ commit }, notice) {
-      commit('removeGlobalNotice', notice)
-    },
-    setLayoutHeight ({ commit }, value) {
-      commit('setLayoutHeight', value)
-    },
-    // value is optional, assuming it was cached prior
-    setLayoutWidth ({ commit, state, rootGetters, rootState }, value) {
-      let width = value
-      if (value !== undefined) {
-        commit('setLayoutWidth', value)
-      } else {
-        width = state.layoutWidth
-      }
-      const mobileLayout = width <= 800
-      const normalOrMobile = mobileLayout ? 'mobile' : 'normal'
-      const { thirdColumnMode } = rootGetters.mergedConfig
-      if (thirdColumnMode === 'none' || !rootState.users.currentUser) {
-        commit('setLayoutType', normalOrMobile)
-      } else {
-        const wideLayout = width >= 1300
-        commit('setLayoutType', wideLayout ? 'wide' : normalOrMobile)
-      }
-    },
-    queryLocalFonts ({ commit, dispatch, state }) {
-      if (state.localFonts !== null) return
-      commit('setFontsList', [])
-      if (!state.browserSupport.localFonts) {
-        return
-      }
-      window
-        .queryLocalFonts()
-        .then((fonts) => {
-          commit('setFontsList', fonts)
-        })
-        .catch((e) => {
-          dispatch('pushGlobalNotice', {
-            messageKey: 'settings.style.themes3.font.font_list_unavailable',
-            messageArgs: {
-              error: e
-            },
-            level: 'error'
-          })
-        })
-    },
-    setLastTimeline ({ commit }, value) {
-      commit('setLastTimeline', value)
-    },
-    setTheme ({ commit, rootState }, { themeName, themeData, recompile, saveData } = {}) {
-      const {
-        theme: instanceThemeName
-      } = rootState.instance
-
-      const {
-        theme: userThemeName,
-        customTheme: userThemeSnapshot,
-        customThemeSource: userThemeSource,
-        forceThemeRecompilation,
-        themeDebug,
-        theme3hacks
-      } = rootState.config
-
-      const actualThemeName = userThemeName || instanceThemeName
-
-      const forceRecompile = forceThemeRecompilation || recompile
-
-      let promise = null
-
-      if (themeData) {
-        promise = Promise.resolve(normalizeThemeData(themeData))
-      } else if (themeName) {
-        promise = getPreset(themeName).then(themeData => normalizeThemeData(themeData))
-      } else if (userThemeSource || userThemeSnapshot) {
-        promise = Promise.resolve(normalizeThemeData({
-          _pleroma_theme_version: 2,
-          theme: userThemeSnapshot,
-          source: userThemeSource
-        }))
-      } else if (actualThemeName && actualThemeName !== 'custom') {
-        promise = getPreset(actualThemeName).then(themeData => {
-          const realThemeData = normalizeThemeData(themeData)
-          if (actualThemeName === instanceThemeName) {
-            // This sole line is the reason why this whole block is above the recompilation check
-            commit('setInstanceOption', { name: 'themeData', value: { theme: realThemeData } })
-          }
-          return realThemeData
-        })
-      } else {
-        throw new Error('Cannot load any theme!')
-      }
-
-      // If we're not not forced to recompile try using
-      // cache (tryLoadCache return true if load successful)
-      if (!forceRecompile && !themeDebug && tryLoadCache()) {
-        commit('setThemeApplied')
-        return
-      }
-
-      promise
-        .then(realThemeData => {
-          const theme2ruleset = convertTheme2To3(realThemeData)
-
-          if (saveData) {
-            commit('setOption', { name: 'theme', value: themeName || actualThemeName })
-            commit('setOption', { name: 'customTheme', value: realThemeData })
-            commit('setOption', { name: 'customThemeSource', value: realThemeData })
-          }
-          const hacks = []
-
-          Object.entries(theme3hacks).forEach(([key, value]) => {
-            switch (key) {
-              case 'fonts': {
-                Object.entries(theme3hacks.fonts).forEach(([fontKey, font]) => {
-                  if (!font?.family) return
-                  switch (fontKey) {
-                    case 'interface':
-                      hacks.push({
-                        component: 'Root',
-                        directives: {
-                          '--font': 'generic | ' + font.family
-                        }
-                      })
-                      break
-                    case 'input':
-                      hacks.push({
-                        component: 'Input',
-                        directives: {
-                          '--font': 'generic | ' + font.family
-                        }
-                      })
-                      break
-                    case 'post':
-                      hacks.push({
-                        component: 'RichContent',
-                        directives: {
-                          '--font': 'generic | ' + font.family
-                        }
-                      })
-                      break
-                    case 'monospace':
-                      hacks.push({
-                        component: 'Root',
-                        directives: {
-                          '--monoFont': 'generic | ' + font.family
-                        }
-                      })
-                      break
-                  }
-                })
-                break
-              }
-              case 'underlay': {
-                if (value !== 'none') {
-                  const newRule = {
-                    component: 'Underlay',
-                    directives: {}
-                  }
-                  if (value === 'opaque') {
-                    newRule.directives.opacity = 1
-                    newRule.directives.background = '--wallpaper'
-                  }
-                  if (value === 'transparent') {
-                    newRule.directives.opacity = 0
-                  }
-                  hacks.push(newRule)
-                }
-                break
-              }
-            }
-          })
-
-          const ruleset = [
-            ...theme2ruleset,
-            ...hacks
-          ]
-
-          applyTheme(
-            ruleset,
-            () => commit('setThemeApplied'),
-            themeDebug
-          )
-        })
-
-      return promise
-    }
-  }
-}
-
-export default interfaceMod
-
-export const normalizeThemeData = (input) => {
-  if (Array.isArray(input)) {
-    const themeData = { colors: {} }
-    themeData.colors.bg = input[1]
-    themeData.colors.fg = input[2]
-    themeData.colors.text = input[3]
-    themeData.colors.link = input[4]
-    themeData.colors.cRed = input[5]
-    themeData.colors.cGreen = input[6]
-    themeData.colors.cBlue = input[7]
-    themeData.colors.cOrange = input[8]
-    return generatePreset(themeData).theme
-  }
-
-  let themeData, themeSource
-
-  if (input.themeFileVerison === 1) {
-    // this might not be even used at all, some leftover of unimplemented code in V2 editor
-    return generatePreset(input).theme
-  } else if (
-    Object.prototype.hasOwnProperty.call(input, '_pleroma_theme_version') ||
-      Object.prototype.hasOwnProperty.call(input, 'source') ||
-      Object.prototype.hasOwnProperty.call(input, 'theme')
-  ) {
-    // We got passed a full theme file
-    themeData = input.theme
-    themeSource = input.source
-  } else if (Object.prototype.hasOwnProperty.call(input, 'themeEngineVersion')) {
-    // We got passed a source/snapshot
-    themeData = input
-    themeSource = input
-  }
-  // New theme presets don't have 'theme' property, they use 'source'
-
-  let out // shout, shout let it all out
-  if (themeSource && themeSource.themeEngineVersion === CURRENT_VERSION) {
-    // There are some themes in wild that have completely broken source
-    out = { ...(themeData || {}), ...themeSource }
-  } else {
-    out = themeData
-  }
-
-  // generatePreset here basically creates/updates "snapshot",
-  // while also fixing the 2.2 -> 2.3 colors/shadows/etc
-  return generatePreset(out).theme
-}
diff --git a/src/modules/lists.js b/src/modules/lists.js
deleted file mode 100644
index 22fed8005..000000000
--- a/src/modules/lists.js
+++ /dev/null
@@ -1,130 +0,0 @@
-import { remove, find } from 'lodash'
-
-export const defaultState = {
-  allLists: [],
-  allListsObject: {}
-}
-
-export const mutations = {
-  setLists (state, value) {
-    state.allLists = value
-  },
-  setList (state, { listId, title }) {
-    if (!state.allListsObject[listId]) {
-      state.allListsObject[listId] = { accountIds: [] }
-    }
-    state.allListsObject[listId].title = title
-
-    const entry = find(state.allLists, { id: listId })
-    if (!entry) {
-      state.allLists.push({ id: listId, title })
-    } else {
-      entry.title = title
-    }
-  },
-  setListAccounts (state, { listId, accountIds }) {
-    if (!state.allListsObject[listId]) {
-      state.allListsObject[listId] = { accountIds: [] }
-    }
-    state.allListsObject[listId].accountIds = accountIds
-  },
-  addListAccount (state, { listId, accountId }) {
-    if (!state.allListsObject[listId]) {
-      state.allListsObject[listId] = { accountIds: [] }
-    }
-    state.allListsObject[listId].accountIds.push(accountId)
-  },
-  removeListAccount (state, { listId, accountId }) {
-    if (!state.allListsObject[listId]) {
-      state.allListsObject[listId] = { accountIds: [] }
-    }
-    const { accountIds } = state.allListsObject[listId]
-    const set = new Set(accountIds)
-    set.delete(accountId)
-    state.allListsObject[listId].accountIds = [...set]
-  },
-  deleteList (state, { listId }) {
-    delete state.allListsObject[listId]
-    remove(state.allLists, list => list.id === listId)
-  }
-}
-
-const actions = {
-  setLists ({ commit }, value) {
-    commit('setLists', value)
-  },
-  createList ({ rootState, commit }, { title }) {
-    return rootState.api.backendInteractor.createList({ title })
-      .then((list) => {
-        commit('setList', { listId: list.id, title })
-        return list
-      })
-  },
-  fetchList ({ rootState, commit }, { listId }) {
-    return rootState.api.backendInteractor.getList({ listId })
-      .then((list) => commit('setList', { listId: list.id, title: list.title }))
-  },
-  fetchListAccounts ({ rootState, commit }, { listId }) {
-    return rootState.api.backendInteractor.getListAccounts({ listId })
-      .then((accountIds) => commit('setListAccounts', { listId, accountIds }))
-  },
-  setList ({ rootState, commit }, { listId, title }) {
-    rootState.api.backendInteractor.updateList({ listId, title })
-    commit('setList', { listId, title })
-  },
-  setListAccounts ({ rootState, commit }, { listId, accountIds }) {
-    const saved = rootState.lists.allListsObject[listId].accountIds || []
-    const added = accountIds.filter(id => !saved.includes(id))
-    const removed = saved.filter(id => !accountIds.includes(id))
-    commit('setListAccounts', { listId, accountIds })
-    if (added.length > 0) {
-      rootState.api.backendInteractor.addAccountsToList({ listId, accountIds: added })
-    }
-    if (removed.length > 0) {
-      rootState.api.backendInteractor.removeAccountsFromList({ listId, accountIds: removed })
-    }
-  },
-  addListAccount ({ rootState, commit }, { listId, accountId }) {
-    return rootState
-      .api
-      .backendInteractor
-      .addAccountsToList({ listId, accountIds: [accountId] })
-      .then((result) => {
-        commit('addListAccount', { listId, accountId })
-        return result
-      })
-  },
-  removeListAccount ({ rootState, commit }, { listId, accountId }) {
-    return rootState
-      .api
-      .backendInteractor
-      .removeAccountsFromList({ listId, accountIds: [accountId] })
-      .then((result) => {
-        commit('removeListAccount', { listId, accountId })
-        return result
-      })
-  },
-  deleteList ({ rootState, commit }, { listId }) {
-    rootState.api.backendInteractor.deleteList({ listId })
-    commit('deleteList', { listId })
-  }
-}
-
-export const getters = {
-  findListTitle: state => id => {
-    if (!state.allListsObject[id]) return
-    return state.allListsObject[id].title
-  },
-  findListAccounts: state => id => {
-    return [...state.allListsObject[id].accountIds]
-  }
-}
-
-const lists = {
-  state: defaultState,
-  mutations,
-  actions,
-  getters
-}
-
-export default lists
diff --git a/src/modules/media_viewer.js b/src/modules/media_viewer.js
deleted file mode 100644
index ebcba01d4..000000000
--- a/src/modules/media_viewer.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import fileTypeService from '../services/file_type/file_type.service.js'
-const supportedTypes = new Set(['image', 'video', 'audio', 'flash'])
-
-const mediaViewer = {
-  state: {
-    media: [],
-    currentIndex: 0,
-    activated: false
-  },
-  mutations: {
-    setMedia (state, media) {
-      state.media = media
-    },
-    setCurrentMedia (state, index) {
-      state.activated = true
-      state.currentIndex = index
-    },
-    close (state) {
-      state.activated = false
-    }
-  },
-  actions: {
-    setMedia ({ commit }, attachments) {
-      const media = attachments.filter(attachment => {
-        const type = fileTypeService.fileType(attachment.mimetype)
-        return supportedTypes.has(type)
-      })
-      commit('setMedia', media)
-    },
-    setCurrentMedia ({ commit, state }, current) {
-      const index = state.media.indexOf(current)
-      commit('setCurrentMedia', index || 0)
-    },
-    closeMediaViewer ({ commit }) {
-      commit('close')
-    }
-  }
-}
-
-export default mediaViewer
diff --git a/src/modules/notifications.js b/src/modules/notifications.js
index c1f5a63e7..c5c607922 100644
--- a/src/modules/notifications.js
+++ b/src/modules/notifications.js
@@ -1,4 +1,5 @@
 import apiService from '../services/api/api.service.js'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
 
 import {
   isStatusNotification,
@@ -11,6 +12,8 @@ import {
   closeAllDesktopNotifications
 } from '../services/desktop_notification_utils/desktop_notification_utils.js'
 
+import { useReportsStore } from 'src/stores/reports.js'
+
 const emptyNotifications = () => ({
   desktopNotificationSilence: true,
   maxId: 0,
@@ -34,7 +37,10 @@ export const notifications = {
       })
     },
     clearNotifications (state) {
-      state = emptyNotifications()
+      const blankState = defaultState()
+      Object.keys(state).forEach(k => {
+        state[k] = blankState[k]
+      })
     },
     updateNotificationsMinMaxId (state, id) {
       state.maxId = id > state.maxId ? id : state.maxId
@@ -65,7 +71,7 @@ export const notifications = {
     }
   },
   actions: {
-    addNewNotifications (store, { notifications, older }) {
+    addNewNotifications (store, { notifications }) {
       const { commit, dispatch, state, rootState } = store
       const validNotifications = notifications.filter((notification) => {
         // If invalid notification, update ids but don't add it to store
@@ -94,7 +100,7 @@ export const notifications = {
 
       validNotifications.forEach(notification => {
         if (notification.type === 'pleroma:report') {
-          dispatch('addReport', notification.report)
+          useReportsStore().addReport(notification.report)
         }
 
         if (notification.type === 'pleroma:emoji_reaction') {
@@ -107,7 +113,11 @@ export const notifications = {
           commit('updateNotificationsMinMaxId', notification.id)
           commit('addNewNotifications', { notifications: [notification] })
 
-          maybeShowNotification(store, notification)
+          maybeShowNotification(
+            store,
+            Object.values(useServerSideStorageStore().prefsStorage.simple.muteFilters),
+            notification
+          )
         } else if (notification.seen) {
           state.idStore[notification.id].seen = true
         }
@@ -128,10 +138,10 @@ export const notifications = {
         }
       }
     },
-    setNotificationsLoading ({ rootState, commit }, { value }) {
+    setNotificationsLoading ({ commit }, { value }) {
       commit('setNotificationsLoading', { value })
     },
-    setNotificationsSilence ({ rootState, commit }, { value }) {
+    setNotificationsSilence ({ commit }, { value }) {
       commit('setNotificationsSilence', { value })
     },
     markNotificationsAsSeen ({ rootState, state, commit }) {
@@ -153,14 +163,14 @@ export const notifications = {
         closeDesktopNotification(rootState, { id })
       })
     },
-    dismissNotificationLocal ({ rootState, commit }, { id }) {
+    dismissNotificationLocal ({ commit }, { id }) {
       commit('dismissNotification', { id })
     },
     dismissNotification ({ rootState, commit }, { id }) {
       commit('dismissNotification', { id })
       rootState.api.backendInteractor.dismissNotification({ id })
     },
-    updateNotification ({ rootState, commit }, { id, updater }) {
+    updateNotification ({ commit }, { id, updater }) {
       commit('updateNotification', { id, updater })
     }
   }
diff --git a/src/modules/oauth.js b/src/modules/oauth.js
deleted file mode 100644
index 038bc3f38..000000000
--- a/src/modules/oauth.js
+++ /dev/null
@@ -1,47 +0,0 @@
-const oauth = {
-  state: {
-    clientId: false,
-    clientSecret: false,
-    /* App token is authentication for app without any user, used mostly for
-     * MastoAPI's registration of new users, stored so that we can fall back to
-     * it on logout
-     */
-    appToken: false,
-    /* User token is authentication for app with user, this is for every calls
-     * that need authorized user to be successful (i.e. posting, liking etc)
-     */
-    userToken: false
-  },
-  mutations: {
-    setClientData (state, { clientId, clientSecret }) {
-      state.clientId = clientId
-      state.clientSecret = clientSecret
-    },
-    setAppToken (state, token) {
-      state.appToken = token
-    },
-    setToken (state, token) {
-      state.userToken = token
-    },
-    clearToken (state) {
-      state.userToken = false
-      // state.token is userToken with older name, coming from persistent state
-      // let's clear it as well, since it is being used as a fallback of state.userToken
-      delete state.token
-    }
-  },
-  getters: {
-    getToken: state => () => {
-      // state.token is userToken with older name, coming from persistent state
-      // added here for smoother transition, otherwise user will be logged out
-      return state.userToken || state.token || state.appToken
-    },
-    getUserToken: state => () => {
-      // state.token is userToken with older name, coming from persistent state
-      // added here for smoother transition, otherwise user will be logged out
-      return state.userToken || state.token
-    }
-  }
-}
-
-export default oauth
diff --git a/src/modules/oauth_tokens.js b/src/modules/oauth_tokens.js
deleted file mode 100644
index 907cae4ac..000000000
--- a/src/modules/oauth_tokens.js
+++ /dev/null
@@ -1,26 +0,0 @@
-const oauthTokens = {
-  state: {
-    tokens: []
-  },
-  actions: {
-    fetchTokens ({ rootState, commit }) {
-      rootState.api.backendInteractor.fetchOAuthTokens().then((tokens) => {
-        commit('swapTokens', tokens)
-      })
-    },
-    revokeToken ({ rootState, commit, state }, id) {
-      rootState.api.backendInteractor.revokeOAuthToken({ id }).then((response) => {
-        if (response.status === 201) {
-          commit('swapTokens', state.tokens.filter(token => token.id !== id))
-        }
-      })
-    }
-  },
-  mutations: {
-    swapTokens (state, tokens) {
-      state.tokens = tokens
-    }
-  }
-}
-
-export default oauthTokens
diff --git a/src/modules/polls.js b/src/modules/polls.js
deleted file mode 100644
index 1c4f98a49..000000000
--- a/src/modules/polls.js
+++ /dev/null
@@ -1,69 +0,0 @@
-import { merge } from 'lodash'
-
-const polls = {
-  state: {
-    // Contains key = id, value = number of trackers for this poll
-    trackedPolls: {},
-    pollsObject: {}
-  },
-  mutations: {
-    mergeOrAddPoll (state, poll) {
-      const existingPoll = state.pollsObject[poll.id]
-      // Make expired-state change trigger re-renders properly
-      poll.expired = Date.now() > Date.parse(poll.expires_at)
-      if (existingPoll) {
-        state.pollsObject[poll.id] = merge(existingPoll, poll)
-      } else {
-        state.pollsObject[poll.id] = poll
-      }
-    },
-    trackPoll (state, pollId) {
-      const currentValue = state.trackedPolls[pollId]
-      if (currentValue) {
-        state.trackedPolls[pollId] = currentValue + 1
-      } else {
-        state.trackedPolls[pollId] = 1
-      }
-    },
-    untrackPoll (state, pollId) {
-      const currentValue = state.trackedPolls[pollId]
-      if (currentValue) {
-        state.trackedPolls[pollId] = currentValue - 1
-      } else {
-        state.trackedPolls[pollId] = 0
-      }
-    }
-  },
-  actions: {
-    mergeOrAddPoll ({ commit }, poll) {
-      commit('mergeOrAddPoll', poll)
-    },
-    updateTrackedPoll ({ rootState, dispatch, commit }, pollId) {
-      rootState.api.backendInteractor.fetchPoll({ pollId }).then(poll => {
-        setTimeout(() => {
-          if (rootState.polls.trackedPolls[pollId]) {
-            dispatch('updateTrackedPoll', pollId)
-          }
-        }, 30 * 1000)
-        commit('mergeOrAddPoll', poll)
-      })
-    },
-    trackPoll ({ rootState, commit, dispatch }, pollId) {
-      if (!rootState.polls.trackedPolls[pollId]) {
-        setTimeout(() => dispatch('updateTrackedPoll', pollId), 30 * 1000)
-      }
-      commit('trackPoll', pollId)
-    },
-    untrackPoll ({ commit }, pollId) {
-      commit('untrackPoll', pollId)
-    },
-    votePoll ({ rootState, commit }, { id, pollId, choices }) {
-      return rootState.api.backendInteractor.vote({ pollId, choices }).then(poll => {
-        commit('mergeOrAddPoll', poll)
-        return poll
-      })
-    }
-  }
-}
-
-export default polls
diff --git a/src/modules/postStatus.js b/src/modules/postStatus.js
deleted file mode 100644
index d3bea1378..000000000
--- a/src/modules/postStatus.js
+++ /dev/null
@@ -1,31 +0,0 @@
-const postStatus = {
-  state: {
-    params: null,
-    modalActivated: false
-  },
-  mutations: {
-    openPostStatusModal (state, params) {
-      state.params = params
-      state.modalActivated = true
-    },
-    closePostStatusModal (state) {
-      state.modalActivated = false
-    },
-    resetPostStatusModal (state) {
-      state.params = null
-    }
-  },
-  actions: {
-    openPostStatusModal ({ commit }, params) {
-      commit('openPostStatusModal', params)
-    },
-    closePostStatusModal ({ commit }) {
-      commit('closePostStatusModal')
-    },
-    resetPostStatusModal ({ commit }) {
-      commit('resetPostStatusModal')
-    }
-  }
-}
-
-export default postStatus
diff --git a/src/modules/profileConfig.js b/src/modules/profileConfig.js
index 2cb2014ac..e5b6acae5 100644
--- a/src/modules/profileConfig.js
+++ b/src/modules/profileConfig.js
@@ -118,7 +118,7 @@ const profileConfig = {
     }
   },
   actions: {
-    setProfileOption ({ rootState, state, commit, dispatch }, { name, value }) {
+    setProfileOption ({ rootState, state, commit }, { name, value }) {
       const oldValue = get(state, name)
       const map = settingsMap[name]
       if (!map) throw new Error('Invalid server-side setting')
diff --git a/src/modules/reports.js b/src/modules/reports.js
deleted file mode 100644
index 925792c03..000000000
--- a/src/modules/reports.js
+++ /dev/null
@@ -1,64 +0,0 @@
-import filter from 'lodash/filter'
-
-const reports = {
-  state: {
-    reportModal: {
-      userId: null,
-      statuses: [],
-      preTickedIds: [],
-      activated: false
-    },
-    reports: {}
-  },
-  mutations: {
-    openUserReportingModal (state, { userId, statuses, preTickedIds }) {
-      state.reportModal.userId = userId
-      state.reportModal.statuses = statuses
-      state.reportModal.preTickedIds = preTickedIds
-      state.reportModal.activated = true
-    },
-    closeUserReportingModal (state) {
-      state.reportModal.activated = false
-    },
-    setReportState (reportsState, { id, state }) {
-      reportsState.reports[id].state = state
-    },
-    addReport (state, report) {
-      state.reports[report.id] = report
-    }
-  },
-  actions: {
-    openUserReportingModal ({ rootState, commit }, { userId, statusIds = [] }) {
-      const preTickedStatuses = statusIds.map(id => rootState.statuses.allStatusesObject[id])
-      const preTickedIds = statusIds
-      const statuses = preTickedStatuses.concat(
-        filter(rootState.statuses.allStatuses,
-          status => status.user.id === userId && !preTickedIds.includes(status.id)
-        )
-      )
-      commit('openUserReportingModal', { userId, statuses, preTickedIds })
-    },
-    closeUserReportingModal ({ commit }) {
-      commit('closeUserReportingModal')
-    },
-    setReportState ({ commit, dispatch, rootState }, { id, state }) {
-      const oldState = rootState.reports.reports[id].state
-      commit('setReportState', { id, state })
-      rootState.api.backendInteractor.setReportState({ id, state }).catch(e => {
-        console.error('Failed to set report state', e)
-        dispatch('pushGlobalNotice', {
-          level: 'error',
-          messageKey: 'general.generic_error_message',
-          messageArgs: [e.message],
-          timeout: 5000
-        })
-        commit('setReportState', { id, state: oldState })
-      })
-    },
-    addReport ({ commit }, report) {
-      commit('addReport', report)
-    }
-  }
-}
-
-export default reports
diff --git a/src/modules/shout.js b/src/modules/shout.js
deleted file mode 100644
index 88aefbfea..000000000
--- a/src/modules/shout.js
+++ /dev/null
@@ -1,46 +0,0 @@
-const shout = {
-  state: {
-    messages: [],
-    channel: { state: '' },
-    joined: false
-  },
-  mutations: {
-    setChannel (state, channel) {
-      state.channel = channel
-    },
-    addMessage (state, message) {
-      state.messages.push(message)
-      state.messages = state.messages.slice(-19, 20)
-    },
-    setMessages (state, messages) {
-      state.messages = messages.slice(-19, 20)
-    },
-    setJoined (state, joined) {
-      state.joined = joined
-    }
-  },
-  actions: {
-    initializeShout (store, socket) {
-      const channel = socket.channel('chat:public')
-      channel.joinPush.receive('ok', () => {
-        store.commit('setJoined', true)
-      })
-      channel.onClose(() => {
-        store.commit('setJoined', false)
-      })
-      channel.onError(() => {
-        store.commit('setJoined', false)
-      })
-      channel.on('new_msg', (msg) => {
-        store.commit('addMessage', msg)
-      })
-      channel.on('messages', ({ messages }) => {
-        store.commit('setMessages', messages)
-      })
-      channel.join()
-      store.commit('setChannel', channel)
-    }
-  }
-}
-
-export default shout
diff --git a/src/modules/statusHistory.js b/src/modules/statusHistory.js
deleted file mode 100644
index db3d6d4be..000000000
--- a/src/modules/statusHistory.js
+++ /dev/null
@@ -1,25 +0,0 @@
-const statusHistory = {
-  state: {
-    params: {},
-    modalActivated: false
-  },
-  mutations: {
-    openStatusHistoryModal (state, params) {
-      state.params = params
-      state.modalActivated = true
-    },
-    closeStatusHistoryModal (state) {
-      state.modalActivated = false
-    }
-  },
-  actions: {
-    openStatusHistoryModal ({ commit }, params) {
-      commit('openStatusHistoryModal', params)
-    },
-    closeStatusHistoryModal ({ commit }) {
-      commit('closeStatusHistoryModal')
-    }
-  }
-}
-
-export default statusHistory
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 5822c533c..30959d0ab 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -13,6 +13,7 @@ import {
   omitBy
 } from 'lodash'
 import apiService from '../services/api/api.service.js'
+import { useInterfaceStore } from 'src/stores/interface'
 
 const emptyTl = (userId = 0) => ({
   statuses: [],
@@ -38,6 +39,7 @@ export const defaultState = () => ({
   conversationsObject: {},
   maxId: 0,
   favorites: new Set(),
+  pleromaScrobblesAvailable: true, // not reported in nodeinfo
   timelines: {
     mentions: emptyTl(),
     public: emptyTl(),
@@ -49,7 +51,8 @@ export const defaultState = () => ({
     tag: emptyTl(),
     dms: emptyTl(),
     bookmarks: emptyTl(),
-    list: emptyTl()
+    list: emptyTl(),
+    bubble: emptyTl()
   }
 })
 
@@ -107,17 +110,31 @@ const sortTimeline = (timeline) => {
 }
 
 const getLatestScrobble = (state, user) => {
+  const scrobblesSupport = state.pleromaScrobblesAvailable
+
+  if (!scrobblesSupport || !user.name || user.id === 'undefined') {
+    return
+  }
+
   if (state.scrobblesNextFetch[user.id] && state.scrobblesNextFetch[user.id] > Date.now()) {
     return
   }
 
   state.scrobblesNextFetch[user.id] = Date.now() + 24 * 60 * 60 * 1000
+  if (!scrobblesSupport) return
   apiService.fetchScrobbles({ accountId: user.id }).then((scrobbles) => {
+    if (scrobbles?.error) {
+      state.pleromaScrobblesAvailable = false
+      return
+    }
+
     if (scrobbles.length > 0) {
       user.latestScrobble = scrobbles[0]
 
       state.scrobblesNextFetch[user.id] = Date.now() + 60 * 1000
     }
+  }).catch(e => {
+    console.warn('cannot fetch scrobbles', e)
   })
 }
 
@@ -222,7 +239,7 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
     return status
   }
 
-  const favoriteStatus = (favorite, counter) => {
+  const favoriteStatus = (favorite) => {
     const status = find(allStatuses, { id: favorite.in_reply_to_status_id })
     if (status) {
       // This is our favorite, so the relevant bit.
@@ -272,12 +289,12 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
         favoriteStatus(favorite)
       }
     },
-    follow: (follow) => {
+    follow: () => {
       // NOOP, it is known status but we don't do anything about it for now
     },
     default: (unknown) => {
-      console.log('unknown status type')
-      console.log(unknown)
+      console.warn('unknown status type')
+      console.warn(unknown)
     }
   }
 
@@ -432,7 +449,7 @@ export const mutations = {
     newStatus.fave_num = newStatus.favoritedBy.length
     newStatus.favorited = !!newStatus.favoritedBy.find(({ id }) => currentUser.id === id)
   },
-  addEmojiReactionsBy (state, { id, emojiReactions, currentUser }) {
+  addEmojiReactionsBy (state, { id, emojiReactions }) {
     const status = state.allStatusesObject[id]
     status.emoji_reactions = emojiReactions
   },
@@ -491,26 +508,26 @@ export const mutations = {
 const statuses = {
   state: defaultState(),
   actions: {
-    addNewStatuses ({ rootState, commit, dispatch, state }, { statuses, showImmediately = false, timeline = false, noIdUpdate = false, userId, pagination }) {
+    addNewStatuses ({ rootState, commit }, { statuses, showImmediately = false, timeline = false, noIdUpdate = false, userId, pagination }) {
       commit('addNewStatuses', { statuses, showImmediately, timeline, noIdUpdate, user: rootState.users.currentUser, userId, pagination })
     },
     fetchStatus ({ rootState, dispatch }, id) {
       return rootState.api.backendInteractor.fetchStatus({ id })
         .then((status) => dispatch('addNewStatuses', { statuses: [status] }))
     },
-    fetchStatusSource ({ rootState, dispatch }, status) {
+    fetchStatusSource ({ rootState }, status) {
       return apiService.fetchStatusSource({ id: status.id, credentials: rootState.users.currentUser.credentials })
     },
-    fetchStatusHistory ({ rootState, dispatch }, status) {
+    fetchStatusHistory (_, status) {
       return apiService.fetchStatusHistory({ status })
     },
-    deleteStatus ({ rootState, commit, dispatch }, status) {
+    deleteStatus ({ rootState, commit }, status) {
       apiService.deleteStatus({ id: status.id, credentials: rootState.users.currentUser.credentials })
-        .then((_) => {
+        .then(() => {
           commit('setDeleted', { status })
         })
         .catch((e) => {
-          dispatch('pushGlobalNotice', {
+          useInterfaceStore().pushGlobalNotice({
             level: 'error',
             messageKey: 'status.delete_error',
             messageArgs: [e.message],
@@ -549,11 +566,11 @@ const statuses = {
       rootState.api.backendInteractor.unpinOwnStatus({ id: statusId })
         .then((status) => dispatch('addNewStatuses', { statuses: [status] }))
     },
-    muteConversation ({ rootState, commit }, statusId) {
+    muteConversation ({ rootState, commit }, { id: statusId }) {
       return rootState.api.backendInteractor.muteConversation({ id: statusId })
         .then((status) => commit('setMutedStatus', status))
     },
-    unmuteConversation ({ rootState, commit }, statusId) {
+    unmuteConversation ({ rootState, commit }, { id: statusId }) {
       return rootState.api.backendInteractor.unmuteConversation({ id: statusId })
         .then((status) => commit('setMutedStatus', status))
     },
@@ -583,10 +600,10 @@ const statuses = {
           commit('setBookmarkedConfirm', { status })
         })
     },
-    queueFlush ({ rootState, commit }, { timeline, id }) {
+    queueFlush ({ commit }, { timeline, id }) {
       commit('queueFlush', { timeline, id })
     },
-    queueFlushAll ({ rootState, commit }) {
+    queueFlushAll ({ commit }) {
       commit('queueFlushAll')
     },
     fetchFavsAndRepeats ({ rootState, commit }, id) {
@@ -604,7 +621,7 @@ const statuses = {
 
       commit('addOwnReaction', { id, emoji, currentUser })
       rootState.api.backendInteractor.reactWithEmoji({ id, emoji }).then(
-        ok => {
+        () => {
           dispatch('fetchEmojiReactionsBy', id)
         }
       )
@@ -615,7 +632,7 @@ const statuses = {
 
       commit('removeOwnReaction', { id, emoji, currentUser })
       rootState.api.backendInteractor.unreactWithEmoji({ id, emoji }).then(
-        ok => {
+        () => {
           dispatch('fetchEmojiReactionsBy', id)
         }
       )
diff --git a/src/modules/users.js b/src/modules/users.js
index 47b43c6f6..5563a280e 100644
--- a/src/modules/users.js
+++ b/src/modules/users.js
@@ -1,9 +1,17 @@
+import { compact, map, each, mergeWith, last, concat, uniq, isArray } from 'lodash'
+
 import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
 import { windowWidth, windowHeight } from '../services/window_utils/window_utils'
+import apiService from '../services/api/api.service.js'
 import oauthApi from '../services/new_api/oauth.js'
-import { compact, map, each, mergeWith, last, concat, uniq, isArray } from 'lodash'
 import { registerPushNotifications, unregisterPushNotifications } from '../services/sw/sw.js'
 
+import { useInterfaceStore } from 'src/stores/interface.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useServerSideStorageStore } from 'src/stores/serverSideStorage'
+
+import { declarations } from 'src/modules/config_declaration'
+
 // TODO: Unify with mergeOrAdd in statuses.js
 export const mergeOrAdd = (arr, obj, item) => {
   if (!item) { return false }
@@ -35,11 +43,19 @@ const getNotificationPermission = () => {
   return Promise.resolve(Notification.permission)
 }
 
-const blockUser = (store, id) => {
-  return store.rootState.api.backendInteractor.blockUser({ id })
+const blockUser = (store, args) => {
+  const id = args.id
+  const expiresIn = typeof args === 'object' ? args.expiresIn : 0
+
+  const predictedRelationship = store.state.relationships[id] || { id }
+  store.commit('updateUserRelationship', [predictedRelationship])
+  store.commit('addBlockId', id)
+
+  return store.rootState.api.backendInteractor.blockUser({ id, expiresIn })
     .then((relationship) => {
       store.commit('updateUserRelationship', [relationship])
       store.commit('addBlockId', id)
+
       store.commit('removeStatus', { timeline: 'friends', userId: id })
       store.commit('removeStatus', { timeline: 'public', userId: id })
       store.commit('removeStatus', { timeline: 'publicAndExternal', userId: id })
@@ -66,7 +82,6 @@ const muteUser = (store, args) => {
   const expiresIn = typeof args === 'object' ? args.expiresIn : 0
 
   const predictedRelationship = store.state.relationships[id] || { id }
-  predictedRelationship.muting = true
   store.commit('updateUserRelationship', [predictedRelationship])
   store.commit('addMuteId', id)
 
@@ -352,20 +367,20 @@ const users = {
           return blocks
         })
     },
-    blockUser (store, id) {
-      return blockUser(store, id)
+    blockUser (store, data) {
+      return blockUser(store, data)
     },
-    unblockUser (store, id) {
-      return unblockUser(store, id)
+    unblockUser (store, data) {
+      return unblockUser(store, data)
     },
     removeUserFromFollowers (store, id) {
       return removeUserFromFollowers(store, id)
     },
-    blockUsers (store, ids = []) {
-      return Promise.all(ids.map(id => blockUser(store, id)))
+    blockUsers (store, data = []) {
+      return Promise.all(data.map(d => blockUser(store, d)))
     },
-    unblockUsers (store, ids = []) {
-      return Promise.all(ids.map(id => unblockUser(store, id)))
+    unblockUsers (store, data = []) {
+      return Promise.all(data.map(d => unblockUser(store, d)))
     },
     editUserNote (store, args) {
       return editUserNote(store, args)
@@ -388,8 +403,8 @@ const users = {
           return mutes
         })
     },
-    muteUser (store, id) {
-      return muteUser(store, id)
+    muteUser (store, data) {
+      return muteUser(store, data)
     },
     unmuteUser (store, id) {
       return unmuteUser(store, id)
@@ -400,11 +415,11 @@ const users = {
     showReblogs (store, id) {
       return showReblogs(store, id)
     },
-    muteUsers (store, ids = []) {
-      return Promise.all(ids.map(id => muteUser(store, id)))
+    muteUsers (store, data = []) {
+      return Promise.all(data.map(d => muteUser(store, d)))
     },
     unmuteUsers (store, ids = []) {
-      return Promise.all(ids.map(id => unmuteUser(store, id)))
+      return Promise.all(ids.map(d => unmuteUser(store, d)))
     },
     fetchDomainMutes (store) {
       return store.rootState.api.backendInteractor.fetchDomainMutes()
@@ -452,11 +467,11 @@ const users = {
       commit('clearFollowers', userId)
     },
     subscribeUser ({ rootState, commit }, id) {
-      return rootState.api.backendInteractor.subscribeUser({ id })
+      return rootState.api.backendInteractor.followUser({ id, notify: true })
         .then((relationship) => commit('updateUserRelationship', [relationship]))
     },
     unsubscribeUser ({ rootState, commit }, id) {
-      return rootState.api.backendInteractor.unsubscribeUser({ id })
+      return rootState.api.backendInteractor.followUser({ id, notify: false })
         .then((relationship) => commit('updateUserRelationship', [relationship]))
     },
     toggleActivationStatus ({ rootState, commit }, { user }) {
@@ -508,8 +523,8 @@ const users = {
 
       const notificationsObject = store.rootState.notifications.idStore
       const relevantNotifications = Object.entries(notificationsObject)
-        .filter(([k, val]) => notificationIds.includes(k))
-        .map(([k, val]) => val)
+        .filter(([k]) => notificationIds.includes(k))
+        .map(([, val]) => val)
 
       // Reconnect users to notifications
       each(relevantNotifications, (notification) => {
@@ -524,18 +539,18 @@ const users = {
         })
     },
     async signUp (store, userInfo) {
+      const oauthStore = useOAuthStore()
       store.commit('signUpPending')
 
-      const rootState = store.rootState
-
       try {
-        const data = await rootState.api.backendInteractor.register(
-          { params: { ...userInfo } }
+        const token = await oauthStore.ensureAppToken()
+        const data = await apiService.register(
+          { credentials: token, params: { ...userInfo } }
         )
 
         if (data.access_token) {
           store.commit('signUpSuccess')
-          store.commit('setToken', data.access_token)
+          oauthStore.setToken(data.access_token)
           store.dispatch('loginUser', data.access_token)
           return 'ok'
         } else { // Request succeeded, but user cannot login yet.
@@ -553,19 +568,16 @@ const users = {
     },
 
     logout (store) {
-      const { oauth, instance } = store.rootState
+      const oauth = useOAuthStore()
+      const { instance } = store.rootState
 
-      const data = {
-        ...oauth,
-        commit: store.commit,
-        instance: instance.server
-      }
-
-      return oauthApi.getOrCreateApp(data)
+      // NOTE: No need to verify the app still exists, because if it doesn't,
+      // the token will be invalid too
+      return oauth.ensureApp()
         .then((app) => {
           const params = {
             app,
-            instance: data.instance,
+            instance: instance.server,
             token: oauth.userToken
           }
 
@@ -574,9 +586,9 @@ const users = {
         .then(() => {
           store.commit('clearCurrentUser')
           store.dispatch('disconnectFromSocket')
-          store.commit('clearToken')
+          oauth.clearToken()
           store.dispatch('stopFetchingTimeline', 'friends')
-          store.commit('setBackendInteractor', backendInteractorService(store.getters.getToken()))
+          store.commit('setBackendInteractor', backendInteractorService(oauth.getToken))
           store.dispatch('stopFetchingNotifications')
           store.dispatch('stopFetchingLists')
           store.dispatch('stopFetchingBookmarkFolders')
@@ -584,9 +596,9 @@ const users = {
           store.commit('clearNotifications')
           store.commit('resetStatuses')
           store.dispatch('resetChats')
-          store.dispatch('setLastTimeline', 'public-timeline')
-          store.dispatch('setLayoutWidth', windowWidth())
-          store.dispatch('setLayoutHeight', windowHeight())
+          useInterfaceStore().setLastTimeline('public-timeline')
+          useInterfaceStore().setLayoutWidth(windowWidth())
+          useInterfaceStore().setLayoutHeight(windowHeight())
           store.commit('clearServerSideStorage')
         })
     },
@@ -594,6 +606,7 @@ const users = {
       return new Promise((resolve, reject) => {
         const commit = store.commit
         const dispatch = store.dispatch
+        const rootState = store.rootState
         commit('beginLogin')
         store.rootState.api.backendInteractor.verifyCredentials(accessToken)
           .then((data) => {
@@ -605,17 +618,46 @@ const users = {
               user.muteIds = []
               user.domainMutes = []
               commit('setCurrentUser', user)
-              commit('setServerSideStorage', user)
+
+              useServerSideStorageStore().setServerSideStorage(user)
               commit('addNewUsers', [user])
 
               dispatch('fetchEmoji')
 
               getNotificationPermission()
-                .then(permission => commit('setNotificationPermission', permission))
+                .then(permission => useInterfaceStore().setNotificationPermission(permission))
 
               // Set our new backend interactor
               commit('setBackendInteractor', backendInteractorService(accessToken))
-              dispatch('pushServerSideStorage')
+
+              // Do server-side storage migrations
+
+              // Debug snippet to clean up storage and reset migrations
+              /*
+              // Reset wordfilter
+              Object.keys(
+                useServerSideStorageStore().prefsStorage.simple.muteFilters
+              ).forEach(key => {
+                useServerSideStorageStore().unsetPreference({ path: 'simple.muteFilters.' + key, value: null })
+              })
+
+              // Reset flag to 0 to re-run migrations
+              useServerSideStorageStore().setFlag({ flag: 'configMigration', value: 0 })
+              /**/
+
+              const { configMigration } = useServerSideStorageStore().flagStorage
+              declarations
+                .filter(x => {
+                  return x.store === 'server-side' &&
+                    x.migrationNum > 0 &&
+                    x.migrationNum > configMigration
+                })
+                .toSorted((a, b) => a.configMigration - b.configMigration)
+                .forEach(value => {
+                  value.migration(useServerSideStorageStore(), store.rootState)
+                  useServerSideStorageStore().setFlag({ flag: 'configMigration', value: value.migrationNum })
+                  useServerSideStorageStore().pushServerSideStorage()
+                })
 
               if (user.token) {
                 dispatch('setWsToken', user.token)
@@ -631,8 +673,10 @@ const users = {
                 // Start fetching notifications
                 dispatch('startFetchingNotifications')
 
-                // Start fetching chats
-                dispatch('startFetchingChats')
+                if (rootState.instance.pleromaChatMessagesAvailable) {
+                  // Start fetching chats
+                  dispatch('startFetchingChats')
+                }
               }
 
               dispatch('startFetchingLists')
@@ -658,8 +702,8 @@ const users = {
               // Get user mutes
               dispatch('fetchMutes')
 
-              dispatch('setLayoutWidth', windowWidth())
-              dispatch('setLayoutHeight', windowHeight())
+              useInterfaceStore().setLayoutWidth(windowWidth())
+              useInterfaceStore().setLayoutHeight(windowHeight())
 
               // Fetch our friends
               store.rootState.api.backendInteractor.fetchFriends({ id: user.id })
@@ -671,7 +715,7 @@ const users = {
 
               // remove authentication token on client/authentication errors
               if ([400, 401, 403, 422].includes(response.status)) {
-                commit('clearToken')
+                useOAuthStore().clearToken()
               }
 
               if (response.status === 401) {
diff --git a/src/panel.scss b/src/panel.scss
index e974e7f6d..8d9c2896b 100644
--- a/src/panel.scss
+++ b/src/panel.scss
@@ -2,6 +2,7 @@
 .panel {
   --__panel-background: var(--background);
   --__panel-backdrop-filter: var(--backdrop-filter);
+  --_shadow: var(--shadow);
 
   .tab-switcher .tabs {
     background: var(--__panel-background);
@@ -24,12 +25,9 @@
   &::after {
     content: "";
     position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
+    inset: 0;
     z-index: 5;
-    box-shadow: var(--shadow);
+    box-shadow: var(--_shadow);
     pointer-events: none;
   }
 }
@@ -106,15 +104,14 @@
   &::before {
     content: "";
     position: absolute;
-    top: 0;
-    bottom: 0;
-    right: 0;
-    left: 0;
+    inset: 0;
     pointer-events: none;
   }
 
   .title {
     font-size: 1.3em;
+    margin: 0;
+    font-weight: normal;
   }
 
   .alert {
@@ -152,11 +149,13 @@
     linear-gradient(to bottom, var(--background), var(--background)),
     linear-gradient(to bottom, var(--__panel-background), var(--__panel-background));
 
+  --_shadow: var(--shadow);
+
   &::after {
     background-color: var(--background);
     z-index: -2;
     border-radius: var(--roundness) var(--roundness) 0 0;
-    box-shadow: var(--shadow);
+    box-shadow: var(--_shadow);
   }
 
   &:not(.-flexible-height) {
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 94c123601..219090890 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -15,7 +15,7 @@ const TAG_USER_URL = '/api/pleroma/admin/users/tag'
 const PERMISSION_GROUP_URL = (screenName, right) => `/api/pleroma/admin/users/${screenName}/permission_group/${right}`
 const ACTIVATE_USER_URL = '/api/pleroma/admin/users/activate'
 const DEACTIVATE_USER_URL = '/api/pleroma/admin/users/deactivate'
-const ADMIN_USERS_URL = '/api/pleroma/admin/users'
+const ADMIN_USERS_URL = '/api/v1/pleroma/admin/users'
 const SUGGESTIONS_URL = '/api/v1/suggestions'
 const NOTIFICATION_SETTINGS_URL = '/api/pleroma/notification_settings'
 const NOTIFICATION_READ_URL = '/api/v1/pleroma/notifications/read'
@@ -61,6 +61,7 @@ const MASTODON_LIST_TIMELINE_URL = id => `/api/v1/timelines/list/${id}`
 const MASTODON_LIST_ACCOUNTS_URL = id => `/api/v1/lists/${id}/accounts`
 const MASTODON_TAG_TIMELINE_URL = tag => `/api/v1/timelines/tag/${tag}`
 const MASTODON_BOOKMARK_TIMELINE_URL = '/api/v1/bookmarks'
+const AKKOMA_BUBBLE_TIMELINE_URL = '/api/v1/timelines/bubble'
 const MASTODON_USER_BLOCKS_URL = '/api/v1/blocks/'
 const MASTODON_USER_MUTES_URL = '/api/v1/mutes/'
 const MASTODON_BLOCK_USER_URL = id => `/api/v1/accounts/${id}/block`
@@ -68,8 +69,6 @@ const MASTODON_UNBLOCK_USER_URL = id => `/api/v1/accounts/${id}/unblock`
 const MASTODON_MUTE_USER_URL = id => `/api/v1/accounts/${id}/mute`
 const MASTODON_UNMUTE_USER_URL = id => `/api/v1/accounts/${id}/unmute`
 const MASTODON_REMOVE_USER_FROM_FOLLOWERS = id => `/api/v1/accounts/${id}/remove_from_followers`
-const MASTODON_SUBSCRIBE_USER = id => `/api/v1/pleroma/accounts/${id}/subscribe`
-const MASTODON_UNSUBSCRIBE_USER = id => `/api/v1/pleroma/accounts/${id}/unsubscribe`
 const MASTODON_USER_NOTE_URL = id => `/api/v1/accounts/${id}/note`
 const MASTODON_BOOKMARK_STATUS_URL = id => `/api/v1/statuses/${id}/bookmark`
 const MASTODON_UNBOOKMARK_STATUS_URL = id => `/api/v1/statuses/${id}/unbookmark`
@@ -101,7 +100,7 @@ const PLEROMA_CHAT_URL = id => `/api/v1/pleroma/chats/by-account-id/${id}`
 const PLEROMA_CHAT_MESSAGES_URL = id => `/api/v1/pleroma/chats/${id}/messages`
 const PLEROMA_CHAT_READ_URL = id => `/api/v1/pleroma/chats/${id}/read`
 const PLEROMA_DELETE_CHAT_MESSAGE_URL = (chatId, messageId) => `/api/v1/pleroma/chats/${chatId}/messages/${messageId}`
-const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
+const PLEROMA_ADMIN_REPORTS = '/api/v1/pleroma/admin/reports'
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
 const PLEROMA_ANNOUNCEMENTS_URL = '/api/v1/pleroma/admin/announcements'
 const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
@@ -113,16 +112,17 @@ const PLEROMA_USER_FAVORITES_TIMELINE_URL = id => `/api/v1/pleroma/accounts/${id
 const PLEROMA_BOOKMARK_FOLDERS_URL = '/api/v1/pleroma/bookmark_folders'
 const PLEROMA_BOOKMARK_FOLDER_URL = id => `/api/v1/pleroma/bookmark_folders/${id}`
 
-const PLEROMA_ADMIN_CONFIG_URL = '/api/pleroma/admin/config'
-const PLEROMA_ADMIN_DESCRIPTIONS_URL = '/api/pleroma/admin/config/descriptions'
-const PLEROMA_ADMIN_FRONTENDS_URL = '/api/pleroma/admin/frontends'
-const PLEROMA_ADMIN_FRONTENDS_INSTALL_URL = '/api/pleroma/admin/frontends/install'
+const PLEROMA_ADMIN_CONFIG_URL = '/api/v1/pleroma/admin/config'
+const PLEROMA_ADMIN_DESCRIPTIONS_URL = '/api/v1/pleroma/admin/config/descriptions'
+const PLEROMA_ADMIN_FRONTENDS_URL = '/api/v1/pleroma/admin/frontends'
+const PLEROMA_ADMIN_FRONTENDS_INSTALL_URL = '/api/v1/pleroma/admin/frontends/install'
 
 const PLEROMA_EMOJI_RELOAD_URL = '/api/pleroma/admin/reload_emoji'
 const PLEROMA_EMOJI_IMPORT_FS_URL = '/api/pleroma/emoji/packs/import'
 const PLEROMA_EMOJI_PACKS_URL = (page, pageSize) => `/api/v1/pleroma/emoji/packs?page=${page}&page_size=${pageSize}`
 const PLEROMA_EMOJI_PACK_URL = (name) => `/api/v1/pleroma/emoji/pack?name=${name}`
 const PLEROMA_EMOJI_PACKS_DL_REMOTE_URL = '/api/v1/pleroma/emoji/packs/download'
+const PLEROMA_EMOJI_PACKS_DL_REMOTE_ZIP_URL = '/api/v1/pleroma/emoji/packs/download_zip'
 const PLEROMA_EMOJI_PACKS_LS_REMOTE_URL =
   (url, page, pageSize) => `/api/v1/pleroma/emoji/packs/remote?url=${url}&page=${page}&page_size=${pageSize}`
 const PLEROMA_EMOJI_UPDATE_FILE_URL = (name) => `/api/v1/pleroma/emoji/packs/files?name=${name}`
@@ -216,12 +216,41 @@ const updateProfileImages = ({ credentials, avatar = null, avatarName = null, ba
 }
 
 const updateProfile = ({ credentials, params }) => {
+  const formData = new FormData();
+
+  for(const name in params) {
+    if (name === 'fields_attributes') {
+      params[name].forEach((param, i) => {
+        formData.append(name + `[${i}][name]`, param.name)
+        formData.append(name + `[${i}][value]`, param.value)
+      })
+    } else {
+      if (typeof params[name] === 'object') {
+        console.warn('Object detected in updateProfile API call. This will not work, use updateProfileJSON instead.')
+        console.warn('Object:\n' + JSON.stringify(params[name], null, 2))
+      }
+      formData.append(name, params[name]);
+    }
+  }
+
+  return fetch(MASTODON_PROFILE_UPDATE_URL, {
+    headers: authHeaders(credentials),
+    method: 'PATCH',
+    body: formData
+  })
+    .then((data) => data.json())
+    .then((data) => parseUser(data))
+}
+
+const updateProfileJSON = ({ credentials, params }) => {
   return promisedRequest({
     url: MASTODON_PROFILE_UPDATE_URL,
-    method: 'PATCH',
-    payload: params,
-    credentials
-  }).then((data) => parseUser(data))
+    credentials,
+    payload: params ,
+    method: 'PATCH'
+  })
+    .then((data) => data.json())
+    .then((data) => parseUser(data))
 }
 
 // Params needed:
@@ -275,6 +304,7 @@ const followUser = ({ id, credentials, ...options }) => {
   const url = MASTODON_FOLLOW_URL(id)
   const form = {}
   if (options.reblogs !== undefined) { form.reblogs = options.reblogs }
+  if (options.notify !== undefined) { form.notify = options.notify }
   return fetch(url, {
     body: JSON.stringify(form),
     headers: {
@@ -320,11 +350,18 @@ const unmuteConversation = ({ id, credentials }) => {
     .then((data) => parseStatus(data))
 }
 
-const blockUser = ({ id, credentials }) => {
-  return fetch(MASTODON_BLOCK_USER_URL(id), {
-    headers: authHeaders(credentials),
-    method: 'POST'
-  }).then((data) => data.json())
+const blockUser = ({ id, expiresIn, credentials }) => {
+  const payload = {}
+  if (expiresIn) {
+    payload.duration = expiresIn
+  }
+
+  return promisedRequest({
+    url: MASTODON_BLOCK_USER_URL(id),
+    credentials,
+    method: 'POST',
+    payload
+  })
 }
 
 const unblockUser = ({ id, credentials }) => {
@@ -708,7 +745,8 @@ const fetchTimeline = ({
     publicFavorites: PLEROMA_USER_FAVORITES_TIMELINE_URL,
     tag: MASTODON_TAG_TIMELINE_URL,
     bookmarks: MASTODON_BOOKMARK_TIMELINE_URL,
-    quotes: PLEROMA_STATUS_QUOTES_URL
+    quotes: PLEROMA_STATUS_QUOTES_URL,
+    bubble: AKKOMA_BUBBLE_TIMELINE_URL
   }
   const isNotifications = timeline === 'notifications'
   const params = []
@@ -758,7 +796,7 @@ const fetchTimeline = ({
   if (replyVisibility !== 'all') {
     params.push(['reply_visibility', replyVisibility])
   }
-  if (includeTypes.length > 0) {
+  if (includeTypes.size > 0) {
     includeTypes.forEach(type => {
       params.push(['include_types[]', type])
     })
@@ -1173,21 +1211,19 @@ const muteUser = ({ id, expiresIn, credentials }) => {
   if (expiresIn) {
     payload.expires_in = expiresIn
   }
-  return promisedRequest({ url: MASTODON_MUTE_USER_URL(id), credentials, method: 'POST', payload })
+
+  return promisedRequest({
+    url: MASTODON_MUTE_USER_URL(id),
+    credentials,
+    method: 'POST',
+    payload
+  })
 }
 
 const unmuteUser = ({ id, credentials }) => {
   return promisedRequest({ url: MASTODON_UNMUTE_USER_URL(id), credentials, method: 'POST' })
 }
 
-const subscribeUser = ({ id, credentials }) => {
-  return promisedRequest({ url: MASTODON_SUBSCRIBE_USER(id), credentials, method: 'POST' })
-}
-
-const unsubscribeUser = ({ id, credentials }) => {
-  return promisedRequest({ url: MASTODON_UNSUBSCRIBE_USER(id), credentials, method: 'POST' })
-}
-
 const fetchBlocks = ({ maxId, credentials }) => {
   const query = new URLSearchParams({ with_relationships: true })
   if (maxId) {
@@ -1375,7 +1411,7 @@ const search2 = ({ credentials, q, resolve, limit, offset, following, type }) =>
   }
 
   if (type) {
-    params.push(['following', type])
+    params.push(['type', type])
   }
 
   params.push(['with_relationships', true])
@@ -1493,17 +1529,18 @@ const deleteAnnouncement = ({ id, credentials }) => {
   })
 }
 
-export const getMastodonSocketURI = ({ credentials, stream, args = {} }) => {
-  return Object.entries({
-    ...(credentials
-      ? { access_token: credentials }
-      : {}
-    ),
-    stream,
-    ...args
-  }).reduce((acc, [key, val]) => {
-    return acc + `${key}=${val}&`
-  }, MASTODON_STREAMING + '?')
+export const getMastodonSocketURI = ({ credentials, stream, args = {} }, base) => {
+  const url = new URL(MASTODON_STREAMING, base)
+  if (credentials) {
+    url.searchParams.append('access_token', credentials)
+  }
+  if (stream) {
+    url.searchParams.append('stream', stream)
+  }
+  Object.entries(args).forEach(([key, val]) => {
+    url.searchParams.append(key, val)
+  })
+  return url
 }
 
 const MASTODON_STREAMING_EVENTS = new Set([
@@ -1515,7 +1552,8 @@ const MASTODON_STREAMING_EVENTS = new Set([
 ])
 
 const PLEROMA_STREAMING_EVENTS = new Set([
-  'pleroma:chat_update'
+  'pleroma:chat_update',
+  'pleroma:respond'
 ])
 
 // A thin wrapper around WebSocket API that allows adding a pre-processor to it
@@ -1523,7 +1561,8 @@ const PLEROMA_STREAMING_EVENTS = new Set([
 export const ProcessedWS = ({
   url,
   preprocessor = handleMastoWS,
-  id = 'Unknown'
+  id = 'Unknown',
+  credentials
 }) => {
   const eventTarget = new EventTarget()
   const socket = new WebSocket(url)
@@ -1538,6 +1577,12 @@ export const ProcessedWS = ({
   }
   socket.addEventListener('open', (wsEvent) => {
     console.debug(`[WS][${id}] Socket connected`, wsEvent)
+    if (credentials) {
+      socket.send(JSON.stringify({
+        type: 'pleroma:authenticate',
+        token: credentials
+      }))
+    }
   })
   socket.addEventListener('error', (wsEvent) => {
     console.debug(`[WS][${id}] Socket errored`, wsEvent)
@@ -1558,19 +1603,47 @@ export const ProcessedWS = ({
   })
   /**/
 
+  const onAuthenticated = () => {
+    eventTarget.dispatchEvent(new CustomEvent('pleroma:authenticated'))
+  }
+
   proxy(socket, 'open')
   proxy(socket, 'close')
-  proxy(socket, 'message', preprocessor)
+  proxy(socket, 'message', (event) => preprocessor(event, { onAuthenticated }))
   proxy(socket, 'error')
 
   // 1000 = Normal Closure
   eventTarget.close = () => { socket.close(1000, 'Shutting down socket') }
   eventTarget.getState = () => socket.readyState
+  eventTarget.subscribe = (stream, args = {}) => {
+    console.debug(
+      `[WS][${id}] Subscribing to stream ${stream} with args`,
+      args
+    )
+    socket.send(JSON.stringify({
+      type: 'subscribe',
+      stream,
+      ...args
+    }))
+  }
+  eventTarget.unsubscribe = (stream, args = {}) => {
+    console.debug(
+      `[WS][${id}] Unsubscribing from stream ${stream} with args`,
+      args
+    )
+    socket.send(JSON.stringify({
+      type: 'unsubscribe',
+      stream,
+      ...args
+    }))
+  }
 
   return eventTarget
 }
 
-export const handleMastoWS = (wsEvent) => {
+export const handleMastoWS = (wsEvent, {
+  onAuthenticated = () => {}
+} = {}) => {
   const { data } = wsEvent
   if (!data) return
   const parsedEvent = JSON.parse(data)
@@ -1581,7 +1654,18 @@ export const handleMastoWS = (wsEvent) => {
       return { event, id: payload }
     }
     const data = payload ? JSON.parse(payload) : null
-    if (event === 'update') {
+    if (event === 'pleroma:respond') {
+      if (data.type === 'pleroma:authenticate') {
+        if (data.result === 'success') {
+          console.debug('[WS] Successfully authenticated')
+          onAuthenticated()
+        } else {
+          console.error('[WS] Unable to authenticate:', data.error)
+          wsEvent.target.close()
+        }
+      }
+      return null
+    } else if (event === 'update') {
       return { event, status: parseStatus(data) }
     } else if (event === 'status.update') {
       return { event, status: parseStatus(data) }
@@ -1864,6 +1948,18 @@ const downloadRemoteEmojiPack = ({ instance, packName, as }) => {
   )
 }
 
+const downloadRemoteEmojiPackZIP = ({ url, packName, file }) => {
+  const data = new FormData()
+  if (file) data.set('file', file)
+  if (url) data.set('url', url)
+  data.set('name', packName)
+
+  return fetch(
+    PLEROMA_EMOJI_PACKS_DL_REMOTE_ZIP_URL,
+    { method: 'POST', body: data }
+  )
+}
+
 const saveEmojiPackMetadata = ({ name, newData }) => {
   return fetch(
     PLEROMA_EMOJI_PACK_URL(name),
@@ -1978,8 +2074,6 @@ const apiService = {
   fetchMutes,
   muteUser,
   unmuteUser,
-  subscribeUser,
-  unsubscribeUser,
   fetchBlocks,
   fetchOAuthTokens,
   revokeOAuthToken,
@@ -1994,6 +2088,7 @@ const apiService = {
   getCaptcha,
   updateProfileImages,
   updateProfile,
+  updateProfileJSON,
   importMutes,
   importBlocks,
   importFollows,
@@ -2071,6 +2166,7 @@ const apiService = {
   deleteEmojiFile,
   listRemoteEmojiPacks,
   downloadRemoteEmojiPack,
+  downloadRemoteEmojiPackZIP,
   fetchBookmarkFolders,
   createBookmarkFolder,
   updateBookmarkFolder,
diff --git a/src/services/backend_interactor_service/backend_interactor_service.js b/src/services/backend_interactor_service/backend_interactor_service.js
index 49785d08e..ca3cac53d 100644
--- a/src/services/backend_interactor_service/backend_interactor_service.js
+++ b/src/services/backend_interactor_service/backend_interactor_service.js
@@ -36,8 +36,8 @@ const backendInteractorService = credentials => ({
 
   startUserSocket ({ store }) {
     const serv = store.rootState.instance.server.replace('http', 'ws')
-    const url = serv + getMastodonSocketURI({ credentials, stream: 'user' })
-    return ProcessedWS({ url, id: 'User' })
+    const url = getMastodonSocketURI({}, serv)
+    return ProcessedWS({ url, id: 'Unified', credentials })
   },
 
   ...Object.entries(apiService).reduce((acc, [key, func]) => {
diff --git a/src/services/bookmark_folders_fetcher/bookmark_folders_fetcher.service.js b/src/services/bookmark_folders_fetcher/bookmark_folders_fetcher.service.js
index 2181ab67b..ac83311ca 100644
--- a/src/services/bookmark_folders_fetcher/bookmark_folders_fetcher.service.js
+++ b/src/services/bookmark_folders_fetcher/bookmark_folders_fetcher.service.js
@@ -1,10 +1,11 @@
 import apiService from '../api/api.service.js'
 import { promiseInterval } from '../promise_interval/promise_interval.js'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
 
-const fetchAndUpdate = ({ store, credentials }) => {
+const fetchAndUpdate = ({ credentials }) => {
   return apiService.fetchBookmarkFolders({ credentials })
     .then(bookmarkFolders => {
-      store.commit('setBookmarkFolders', bookmarkFolders)
+      useBookmarkFoldersStore().setBookmarkFolders(bookmarkFolders)
     }, () => {})
     .catch(() => {})
 }
diff --git a/src/services/color_convert/color_convert.js b/src/services/color_convert/color_convert.js
index d92bbbe05..aadbc90ff 100644
--- a/src/services/color_convert/color_convert.js
+++ b/src/services/color_convert/color_convert.js
@@ -1,7 +1,7 @@
-import { invertLightness, contrastRatio } from 'chromatism'
+import { invertLightness, contrastRatio, convert } from 'chromatism'
 
 // useful for visualizing color when debugging
-export const consoleColor = (color) => console.log('%c##########', 'background: ' + color + '; color: ' + color)
+// const consoleColor = (color) => console.debug('%c##########', 'background: ' + color + '; color: ' + color)
 
 /**
  * Convert r, g, b values into hex notation. All components are [0-255]
@@ -52,15 +52,6 @@ const c2linear = (bit) => {
   }
 }
 
-/**
- * Converts sRGB into linear RGB
- * @param {Object} srgb - sRGB color
- * @returns {Object} linear rgb color
- */
-const srgbToLinear = (srgb) => {
-  return 'rgb'.split('').reduce((acc, c) => { acc[c] = c2linear(srgb[c]); return acc }, {})
-}
-
 /**
  * Calculates relative luminance for given color
  * https://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
@@ -70,7 +61,10 @@ const srgbToLinear = (srgb) => {
  * @returns {Number} relative luminance
  */
 export const relativeLuminance = (srgb) => {
-  const { r, g, b } = srgbToLinear(srgb)
+  const r = c2linear(srgb.r)
+  const g = c2linear(srgb.g)
+  const b = c2linear(srgb.b)
+
   return 0.2126 * r + 0.7152 * g + 0.0722 * b
 }
 
@@ -101,6 +95,32 @@ export const getContrastRatioLayers = (text, layers, bedrock) => {
   return getContrastRatio(alphaBlendLayers(bedrock, layers), text)
 }
 
+/**
+ * Blending of two solid colors with a user-defined operator: origin +- value
+ *
+ * @param {Object} origin - base color
+ * @param {Object} value - modification argument
+ * @param {string} operator - math operator to use
+ */
+export const arithmeticBlend = (origin, value, operator) => {
+  const func = (a, b) => {
+    switch (operator) {
+      case '+':
+        return Math.min(a + b, 255)
+      case '-':
+        return Math.max(a - b, 0)
+      default:
+        return a
+    }
+  }
+
+  return {
+    r: func(origin.r, value.r),
+    g: func(origin.g, value.g),
+    b: func(origin.b, value.b),
+  }
+}
+
 /**
  * This performs alpha blending between solid background and semi-transparent foreground
  *
@@ -110,13 +130,17 @@ export const getContrastRatioLayers = (text, layers, bedrock) => {
  * @returns {Object} sRGB of resulting color
  */
 export const alphaBlend = (fg, fga, bg) => {
-  if (fga === 1 || typeof fga === 'undefined') return fg
-  return 'rgb'.split('').reduce((acc, c) => {
-    // Simplified https://en.wikipedia.org/wiki/Alpha_compositing#Alpha_blending
-    // for opaque bg and transparent fg
-    acc[c] = (fg[c] * fga + bg[c] * (1 - fga))
-    return acc
-  }, {})
+  if (fga === 1 || typeof fga === 'undefined') {
+    return fg
+  }
+
+  // Simplified https://en.wikipedia.org/wiki/Alpha_compositing#Alpha_blending
+  // for opaque bg and transparent fg
+  return {
+    r: (fg.r * fga + bg.r * (1 - fga)),
+    g: (fg.g * fga + bg.g * (1 - fga)),
+    b: (fg.b * fga + bg.b * (1 - fga))
+  }
 }
 
 /**
@@ -130,10 +154,11 @@ export const alphaBlendLayers = (bedrock, layers) => layers.reduce((acc, [color,
 }, bedrock)
 
 export const invert = (rgb) => {
-  return 'rgb'.split('').reduce((acc, c) => {
-    acc[c] = 255 - rgb[c]
-    return acc
-  }, {})
+  return {
+    r: 255 - rgb.r,
+    g: 255 - rgb.g,
+    b: 255 - rgb.b
+  }
 }
 
 /**
@@ -144,6 +169,7 @@ export const invert = (rgb) => {
  */
 export const hex2rgb = (hex) => {
   const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)
+
   return result
     ? {
         r: parseInt(result[1], 16),
@@ -161,11 +187,13 @@ export const hex2rgb = (hex) => {
  * @returns {Object} result
  */
 export const mixrgb = (a, b) => {
-  return 'rgb'.split('').reduce((acc, k) => {
-    acc[k] = (a[k] + b[k]) / 2
-    return acc
-  }, {})
+  return {
+    r: (a.r + b.r) / 2,
+    g: (a.g + b.g) / 2,
+    b: (a.b + b.b) / 2
+  }
 }
+
 /**
  * Converts rgb object into a CSS rgba() color
  *
@@ -173,7 +201,33 @@ export const mixrgb = (a, b) => {
  * @returns {String} CSS rgba() color
  */
 export const rgba2css = function (rgba) {
-  return `rgba(${Math.floor(rgba.r)}, ${Math.floor(rgba.g)}, ${Math.floor(rgba.b)}, ${rgba.a ?? 1})`
+  const base = {
+    r: 0,
+    g: 0,
+    b: 0,
+    a: 1
+  }
+
+  if (rgba !== null) {
+    if (rgba.r !== undefined && !isNaN(rgba.r)) {
+      base.r = rgba.r
+    }
+    if (rgba.g !== undefined && !isNaN(rgba.g)) {
+      base.g = rgba.g
+    }
+    if (rgba.b !== undefined && !isNaN(rgba.b)) {
+      base.b = rgba.b
+    }
+    if (rgba.a !== undefined && !isNaN(rgba.a)) {
+      base.a = rgba.a
+    }
+  } else {
+    base.r = 255
+    base.g = 255
+    base.b = 255
+  }
+
+  return `rgba(${Math.floor(base.r)}, ${Math.floor(base.g)}, ${Math.floor(base.b)}, ${base.a})`
 }
 
 /**
@@ -187,19 +241,37 @@ export const rgba2css = function (rgba) {
  * @param {Boolean} preserve - try to preserve intended text color's hue/saturation (i.e. no BW)
  */
 export const getTextColor = function (bg, text, preserve) {
-  const contrast = getContrastRatio(bg, text)
-
-  if (contrast < 4.5) {
-    const base = typeof text.a !== 'undefined' ? { a: text.a } : {}
-    const result = Object.assign(base, invertLightness(text).rgb)
-    if (!preserve && getContrastRatio(bg, result) < 4.5) {
+  const originalContrast = getContrastRatio(bg, text)
+  if (!preserve) {
+    if (originalContrast < 4.5) {
       // B&W
       return contrastRatio(bg, text).rgb
     }
-    // Inverted color
-    return result
   }
-  return text
+
+  const originalColor = convert(text).hex
+  const invertedColor = invertLightness(originalColor).hex
+  const invertedContrast = getContrastRatio(bg, convert(invertedColor).rgb)
+  let workColor
+
+  if (invertedContrast > originalContrast) {
+    workColor = invertedColor
+  } else {
+    workColor = originalColor
+  }
+
+  let contrast = getContrastRatio(bg, text)
+  const result = convert(rgb2hex(workColor)).hsl
+  const delta = result.l >= 50 ? 1 : -1
+  const multiplier = 1
+  while (contrast < 4.5 && result.l > 20 && result.l < 80) {
+    result.l += delta * multiplier
+    result.l = Math.min(100, Math.max(0, result.l))
+    contrast = getContrastRatio(bg, convert(result).rgb)
+  }
+
+  const base = typeof text.a !== 'undefined' ? { a: text.a } : {}
+  return Object.assign(convert(result).rgb, base)
 }
 
 /**
diff --git a/src/services/desktop_notification_utils/desktop_notification_utils.js b/src/services/desktop_notification_utils/desktop_notification_utils.js
index 80b8c6e0a..7f1493056 100644
--- a/src/services/desktop_notification_utils/desktop_notification_utils.js
+++ b/src/services/desktop_notification_utils/desktop_notification_utils.js
@@ -29,7 +29,7 @@ export const closeDesktopNotification = (rootState, { id }) => {
   }
 }
 
-export const closeAllDesktopNotifications = (rootState) => {
+export const closeAllDesktopNotifications = () => {
   if (!('Notification' in window && window.Notification.permission === 'granted')) return
 
   if (isSWSupported()) {
diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
index 550543e0b..28f1bc2aa 100644
--- a/src/services/entity_normalizer/entity_normalizer.service.js
+++ b/src/services/entity_normalizer/entity_normalizer.service.js
@@ -1,5 +1,5 @@
 import escape from 'escape-html'
-import parseLinkHeader from 'parse-link-header'
+import { parseLinkHeader } from '@web3-storage/parse-link-header'
 import { isStatusNotification } from '../notification_utils/notification_utils.js'
 import punycode from 'punycode.js'
 
@@ -51,6 +51,8 @@ export const parseUser = (data) => {
     output.screen_name = data.acct
     output.fqn = data.fqn
     output.statusnet_profile_url = data.url
+    output.mute_expires_at = data.mute_expires_at
+    output.block_expires_at = data.block_expires_at
 
     // There's nothing else to get
     if (mastoShort) {
@@ -91,6 +93,8 @@ export const parseUser = (data) => {
 
     output.bot = data.bot
 
+    output.privileges = []
+
     if (data.pleroma) {
       if (data.pleroma.settings_store) {
         output.storage = data.pleroma.settings_store['pleroma-fe']
@@ -317,20 +321,18 @@ export const parseStatus = (data) => {
 
     output.edited_at = data.edited_at
 
+    const { pleroma } = data
+
     if (data.pleroma) {
-      const { pleroma } = data
       output.text = pleroma.content ? data.pleroma.content['text/plain'] : data.content
       output.summary = pleroma.spoiler_text ? data.pleroma.spoiler_text['text/plain'] : data.spoiler_text
       output.statusnet_conversation_id = data.pleroma.conversation_id
       output.is_local = pleroma.local
-      output.in_reply_to_screen_name = data.pleroma.in_reply_to_account_acct
+      output.in_reply_to_screen_name = pleroma.in_reply_to_account_acct
       output.thread_muted = pleroma.thread_muted
       output.emoji_reactions = pleroma.emoji_reactions
       output.parent_visible = pleroma.parent_visible === undefined ? true : pleroma.parent_visible
-      output.quote = pleroma.quote ? parseStatus(pleroma.quote) : undefined
-      output.quote_id = pleroma.quote_id ? pleroma.quote_id : (output.quote ? output.quote.id : undefined)
-      output.quote_url = pleroma.quote_url
-      output.quote_visible = pleroma.quote_visible
+      output.quote_visible = pleroma.quote_visible || true
       output.quotes_count = pleroma.quotes_count
       output.bookmark_folder_id = pleroma.bookmark_folder
     } else {
@@ -338,6 +340,12 @@ export const parseStatus = (data) => {
       output.summary = data.spoiler_text
     }
 
+    const quoteRaw = pleroma?.quote || data.quote
+    const quoteData =  quoteRaw ? parseStatus(quoteRaw) : undefined
+    output.quote = quoteData
+    output.quote_id = data.quote?.id ?? data.quote_id ?? quoteData?.id ?? pleroma.quote_id
+    output.quote_url = data.quote?.url ?? quoteData?.url ?? pleroma.quote_url
+
     output.in_reply_to_status_id = data.in_reply_to_id
     output.in_reply_to_user_id = data.in_reply_to_account_id
     output.replies_count = data.replies_count
@@ -442,7 +450,9 @@ export const parseNotification = (data) => {
   if (masto) {
     output.type = mastoDict[data.type] || data.type
     output.seen = data.pleroma.is_seen
-    output.status = isStatusNotification(output.type) ? parseStatus(data.status) : null
+    // TODO: null check should be a temporary fix, I guess.
+    // Investigate why backend does this.
+    output.status = isStatusNotification(output.type) && data.status !== null ? parseStatus(data.status) : null
     output.target = output.type !== 'move'
       ? null
       : parseUser(data.target)
@@ -482,8 +492,8 @@ export const parseLinkHeaderPagination = (linkHeader, opts = {}) => {
   const flakeId = opts.flakeId
   const parsedLinkHeader = parseLinkHeader(linkHeader)
   if (!parsedLinkHeader) return
-  const maxId = parsedLinkHeader.next.max_id
-  const minId = parsedLinkHeader.prev.min_id
+  const maxId = parsedLinkHeader.next?.max_id
+  const minId = parsedLinkHeader.prev?.min_id
 
   return {
     maxId: flakeId ? maxId : parseInt(maxId, 10),
diff --git a/src/services/errors/errors.js b/src/services/errors/errors.js
index 50372e5ed..f0cc6dad7 100644
--- a/src/services/errors/errors.js
+++ b/src/services/errors/errors.js
@@ -1,4 +1,14 @@
-import { humanizeErrors } from '../../modules/errors'
+import { capitalize } from 'lodash'
+
+function humanizeErrors (errors) {
+  return Object.entries(errors).reduce((errs, [k, val]) => {
+    const message = val.reduce((acc, message) => {
+      const key = capitalize(k.replace(/_/g, ' '))
+      return acc + [key, message].join(' ') + '. '
+    }, '')
+    return [...errs, message]
+  }, [])
+}
 
 export function StatusCodeError (statusCode, body, options, response) {
   this.name = 'StatusCodeError'
@@ -48,7 +58,7 @@ export class RegistrationError extends Error {
       } else {
         this.message = error
       }
-    } catch (e) {
+    } catch {
       // can't parse it, so just treat it like a string
       this.message = error
     }
diff --git a/src/services/export_import/export_import.js b/src/services/export_import/export_import.js
index 7fee0ad33..dc1172e6d 100644
--- a/src/services/export_import/export_import.js
+++ b/src/services/export_import/export_import.js
@@ -2,15 +2,23 @@ import utf8 from 'utf8'
 
 export const newExporter = ({
   filename = 'data',
+  mime = 'application/json',
+  extension = 'json',
   getExportedObject
 }) => ({
   exportData () {
-    const stringified = utf8.encode(JSON.stringify(getExportedObject(), null, 2)) // Pretty-print and indent with 2 spaces
+    let stringified
+    if (mime === 'application/json') {
+      stringified = utf8.encode(JSON.stringify(getExportedObject(), null, 2)) // Pretty-print and indent with 2 spaces
+    } else {
+      stringified = utf8.encode(getExportedObject()) // Pretty-print and indent with 2 spaces
+    }
 
     // Create an invisible link with a data url and simulate a click
     const e = document.createElement('a')
-    e.setAttribute('download', `${filename}.json`)
-    e.setAttribute('href', 'data:application/json;base64,' + window.btoa(stringified))
+    const realFilename = typeof filename === 'function' ? filename() : filename
+    e.setAttribute('download', `${realFilename}.${extension}`)
+    e.setAttribute('href', `data:${mime};base64, ${window.btoa(stringified)}`)
     e.style.display = 'none'
 
     document.body.appendChild(e)
@@ -20,6 +28,8 @@ export const newExporter = ({
 })
 
 export const newImporter = ({
+  accept = '.json',
+  parser = (string) => JSON.parse(string),
   onImport,
   onImportFailure,
   validator = () => true
@@ -27,18 +37,19 @@ export const newImporter = ({
   importData () {
     const filePicker = document.createElement('input')
     filePicker.setAttribute('type', 'file')
-    filePicker.setAttribute('accept', '.json')
+    filePicker.setAttribute('accept', accept)
 
     filePicker.addEventListener('change', event => {
       if (event.target.files[0]) {
-        // eslint-disable-next-line no-undef
+        const filename = event.target.files[0].name
+
         const reader = new FileReader()
         reader.onload = ({ target }) => {
           try {
-            const parsed = JSON.parse(target.result)
-            const validationResult = validator(parsed)
+            const parsed = parser(target.result, filename)
+            const validationResult = validator(parsed, filename)
             if (validationResult === true) {
-              onImport(parsed)
+              onImport(parsed, filename)
             } else {
               onImportFailure({ validationResult })
             }
diff --git a/src/services/favicon_service/favicon_service.js b/src/services/favicon_service/favicon_service.js
index df603bb46..9cbe65449 100644
--- a/src/services/favicon_service/favicon_service.js
+++ b/src/services/favicon_service/favicon_service.js
@@ -1,3 +1,19 @@
+const checkCanvasExtractPermission = () => {
+  const canvas = document.createElement('canvas');
+  canvas.width = 1;
+  canvas.height = 1;
+
+  const ctx = canvas.getContext('2d');
+  if (!ctx) return false;
+
+  ctx.fillStyle = '#0f161e';
+  ctx.fillRect(0, 0, 1, 1);
+
+  const { data } = ctx.getImageData(0, 0, 1, 1);
+
+  return data.join(',') === '15,22,30,255';
+};
+
 const createFaviconService = () => {
   const favicons = []
   const faviconWidth = 128
@@ -5,6 +21,8 @@ const createFaviconService = () => {
   const badgeRadius = 32
 
   const initFaviconService = () => {
+    if (!checkCanvasExtractPermission()) return;
+
     const nodes = document.querySelectorAll('link[rel="icon"]')
     nodes.forEach(favicon => {
       if (favicon) {
diff --git a/src/services/follow_manipulate/follow_manipulate.js b/src/services/follow_manipulate/follow_manipulate.js
index 08f4c4d63..41c0acc75 100644
--- a/src/services/follow_manipulate/follow_manipulate.js
+++ b/src/services/follow_manipulate/follow_manipulate.js
@@ -16,7 +16,7 @@ const fetchRelationship = (attempt, userId, store) => new Promise((resolve, reje
   }
 })
 
-export const requestFollow = (userId, store) => new Promise((resolve, reject) => {
+export const requestFollow = (userId, store) => new Promise((resolve) => {
   store.state.api.backendInteractor.followUser({ id: userId })
     .then((updated) => {
       store.commit('updateUserRelationship', [updated])
@@ -41,7 +41,7 @@ export const requestFollow = (userId, store) => new Promise((resolve, reject) =>
     })
 })
 
-export const requestUnfollow = (userId, store) => new Promise((resolve, reject) => {
+export const requestUnfollow = (userId, store) => new Promise((resolve) => {
   store.state.api.backendInteractor.unfollowUser({ id: userId })
     .then((updated) => {
       store.commit('updateUserRelationship', [updated])
diff --git a/src/services/gesture_service/gesture_service.js b/src/services/gesture_service/gesture_service.js
index 265a7f25e..74e3b3291 100644
--- a/src/services/gesture_service/gesture_service.js
+++ b/src/services/gesture_service/gesture_service.js
@@ -1,4 +1,3 @@
-
 const DIRECTION_LEFT = [-1, 0]
 const DIRECTION_RIGHT = [1, 0]
 const DIRECTION_UP = [0, -1]
@@ -185,7 +184,7 @@ class SwipeAndClickGesture {
     }
   }
 
-  click (event) {
+  click () {
     if (!this._preventNextClick) {
       this.swipelessClickCallback()
     }
diff --git a/src/services/html_converter/utility.service.js b/src/services/html_converter/utility.service.js
index f8e62dfea..894b9ab05 100644
--- a/src/services/html_converter/utility.service.js
+++ b/src/services/html_converter/utility.service.js
@@ -23,7 +23,7 @@ export const getAttrs = (tag, filter) => {
     .replace(/\/?$/, '')
     .trim()
   const attrs = Array.from(innertag.matchAll(/([a-z]+[a-z0-9-]*)(?:=("[^"]+?"|'[^']+?'))?/gi))
-    .map(([trash, key, value]) => [key, value])
+    .map(([, key, value]) => [key, value])
     .map(([k, v]) => {
       if (!v) return [k, true]
       return [k, v.substring(1, v.length - 1)]
diff --git a/src/services/lists_fetcher/lists_fetcher.service.js b/src/services/lists_fetcher/lists_fetcher.service.js
index 8d9dae666..5d3c9ed23 100644
--- a/src/services/lists_fetcher/lists_fetcher.service.js
+++ b/src/services/lists_fetcher/lists_fetcher.service.js
@@ -1,10 +1,11 @@
+import { useListsStore } from 'src/stores/lists.js'
 import apiService from '../api/api.service.js'
 import { promiseInterval } from '../promise_interval/promise_interval.js'
 
-const fetchAndUpdate = ({ store, credentials }) => {
+const fetchAndUpdate = ({ credentials }) => {
   return apiService.fetchLists({ credentials })
     .then(lists => {
-      store.commit('setLists', lists)
+      useListsStore().setLists(lists)
     }, () => {})
     .catch(() => {})
 }
diff --git a/src/services/new_api/oauth.js b/src/services/new_api/oauth.js
index a4b7cbf07..d077110c8 100644
--- a/src/services/new_api/oauth.js
+++ b/src/services/new_api/oauth.js
@@ -1,12 +1,20 @@
 import { reduce } from 'lodash'
+import { StatusCodeError } from 'src/services/errors/errors.js'
 
 const REDIRECT_URI = `${window.location.origin}/oauth-callback`
 
-export const getOrCreateApp = ({ clientId, clientSecret, instance, commit }) => {
-  if (clientId && clientSecret) {
-    return Promise.resolve({ clientId, clientSecret })
+export const getJsonOrError = async (response) => {
+  if (response.ok) {
+    return response.json()
+      .catch((error) => {
+        throw new StatusCodeError(response.status, error, {}, response)
+      })
+  } else {
+    throw new StatusCodeError(response.status, await response.text(), {}, response)
   }
+}
 
+export const createApp = (instance) => {
   const url = `${instance}/api/v1/apps`
   const form = new window.FormData()
 
@@ -19,9 +27,16 @@ export const getOrCreateApp = ({ clientId, clientSecret, instance, commit }) =>
     method: 'POST',
     body: form
   })
-    .then((data) => data.json())
+    .then(getJsonOrError)
     .then((app) => ({ clientId: app.client_id, clientSecret: app.client_secret }))
-    .then((app) => commit('setClientData', app) || app)
+}
+
+export const verifyAppToken = ({ instance, appToken }) => {
+  return window.fetch(`${instance}/api/v1/apps/verify_credentials`, {
+    method: 'GET',
+    headers: { Authorization: `Bearer ${appToken}` }
+  })
+    .then(getJsonOrError)
 }
 
 const login = ({ instance, clientId }) => {
@@ -92,7 +107,7 @@ export const getClientToken = ({ clientId, clientSecret, instance }) => {
   return window.fetch(url, {
     method: 'POST',
     body: form
-  }).then((data) => data.json())
+  }).then(getJsonOrError)
 }
 const verifyOTPCode = ({ app, instance, mfaToken, code }) => {
   const url = `${instance}/oauth/mfa/challenge`
@@ -144,7 +159,6 @@ const oauth = {
   login,
   getToken,
   getTokenWithCredentials,
-  getOrCreateApp,
   verifyOTPCode,
   verifyRecoveryCode,
   revokeToken
diff --git a/src/services/notification_utils/notification_utils.js b/src/services/notification_utils/notification_utils.js
index 831b27f63..74fd91204 100644
--- a/src/services/notification_utils/notification_utils.js
+++ b/src/services/notification_utils/notification_utils.js
@@ -1,5 +1,7 @@
-import { muteWordHits } from '../status_parser/status_parser.js'
+import { muteFilterHits } from '../status_parser/status_parser.js'
 import { showDesktopNotification } from '../desktop_notification_utils/desktop_notification_utils.js'
+import { useI18nStore } from 'src/stores/i18n.js'
+import { useAnnouncementsStore } from 'src/stores/announcements'
 
 import FaviconService from 'src/services/favicon_service/favicon_service.js'
 
@@ -56,21 +58,20 @@ const sortById = (a, b) => {
   }
 }
 
-const isMutedNotification = (store, notification) => {
-  if (!notification.status) return
-  const rootGetters = store.rootGetters || store.getters
-  return notification.status.muted || muteWordHits(notification.status, rootGetters.mergedConfig.muteWords).length > 0
+const isMutedNotification = (notification) => {
+  if (!notification.status) return false
+  if (notification.status.muted) return true
+  return muteFilterHits(notification.status).length > 0
 }
 
 export const maybeShowNotification = (store, notification) => {
   const rootState = store.rootState || store.state
-  const rootGetters = store.rootGetters || store.getters
 
   if (notification.seen) return
   if (!visibleTypes(store).includes(notification.type)) return
-  if (notification.type === 'mention' && isMutedNotification(store, notification)) return
+  if (notification.type === 'mention' && isMutedNotification(notification)) return
 
-  const notificationObject = prepareNotificationObject(notification, rootGetters.i18n)
+  const notificationObject = prepareNotificationObject(notification, useI18nStore().i18n)
   showDesktopNotification(rootState, notificationObject)
 }
 
@@ -169,7 +170,7 @@ export const countExtraNotifications = (store) => {
 
   return [
     mergedConfig.showChatsInExtraNotifications ? rootGetters.unreadChatCount : 0,
-    mergedConfig.showAnnouncementsInExtraNotifications ? rootGetters.unreadAnnouncementCount : 0,
+    mergedConfig.showAnnouncementsInExtraNotifications ? useAnnouncementsStore().unreadAnnouncementCount : 0,
     mergedConfig.showFollowRequestsInExtraNotifications ? rootGetters.followRequestCount : 0
   ].reduce((a, c) => a + c, 0)
 }
diff --git a/src/services/notifications_fetcher/notifications_fetcher.service.js b/src/services/notifications_fetcher/notifications_fetcher.service.js
index 32854fed5..fbe9d233b 100644
--- a/src/services/notifications_fetcher/notifications_fetcher.service.js
+++ b/src/services/notifications_fetcher/notifications_fetcher.service.js
@@ -1,9 +1,14 @@
+import { useInterfaceStore } from 'src/stores/interface.js'
 import apiService from '../api/api.service.js'
 import { promiseInterval } from '../promise_interval/promise_interval.js'
 
+const update = ({ store, notifications, older }) => {
+  store.dispatch('addNewNotifications', { notifications, older })
+}
+//
 // For using include_types when fetching notifications.
 // Note: chat_mention excluded as pleroma-fe polls them separately
-const mastoApiNotificationTypes = [
+const mastoApiNotificationTypes = new Set([
   'mention',
   'status',
   'favourite',
@@ -13,21 +18,22 @@ const mastoApiNotificationTypes = [
   'move',
   'poll',
   'pleroma:emoji_reaction',
-  'pleroma:chat_mention',
-  'pleroma:report'
-]
-
-const update = ({ store, notifications, older }) => {
-  store.dispatch('addNewNotifications', { notifications, older })
-}
+  'pleroma:report',
+  'test231'
+])
 
 const fetchAndUpdate = ({ store, credentials, older = false, since }) => {
+
   const args = { credentials }
   const { getters } = store
   const rootState = store.rootState || store.state
   const timelineData = rootState.notifications
   const hideMutedPosts = getters.mergedConfig.hideMutedPosts
 
+  if (rootState.instance.pleromaChatMessagesAvailable) {
+    mastoApiNotificationTypes.add('pleroma:chat_mention')
+  }
+
   args.includeTypes = mastoApiNotificationTypes
   args.withMuted = !hideMutedPosts
 
@@ -71,14 +77,24 @@ const fetchNotifications = ({ store, args, older }) => {
   return apiService.fetchTimeline(args)
     .then((response) => {
       if (response.errors) {
-        throw new Error(`${response.status} ${response.statusText}`)
+        if (response.status === 400 && response.statusText.includes('Invalid value for enum')) {
+          response
+            .statusText
+            .matchAll(/(\w+) - Invalid value for enum./g)
+            .toArray()
+            .map(x => x[1])
+            .forEach(x => mastoApiNotificationTypes.delete(x))
+          return fetchNotifications({ store, args, older })
+        } else {
+          throw new Error(`${response.status} ${response.statusText}`)
+        }
       }
       const notifications = response.data
       update({ store, notifications, older })
       return notifications
     })
     .catch((error) => {
-      store.dispatch('pushGlobalNotice', {
+      useInterfaceStore().pushGlobalNotice({
         level: 'error',
         messageKey: 'notifications.error',
         messageArgs: [error.message],
diff --git a/src/services/poll/poll.service.js b/src/services/poll/poll.service.js
new file mode 100644
index 000000000..90f8e87ae
--- /dev/null
+++ b/src/services/poll/poll.service.js
@@ -0,0 +1,36 @@
+import * as DateUtils from 'src/services/date_utils/date_utils.js'
+import { uniq } from 'lodash'
+
+const pollFallbackValues = {
+  pollType: 'single',
+  options: ['', ''],
+  expiryAmount: 10,
+  expiryUnit: 'minutes'
+}
+
+const pollFallback = (object, attr) => {
+  return object[attr] !== undefined ? object[attr] : pollFallbackValues[attr]
+}
+
+const pollFormToMasto = (poll) => {
+  const expiresIn = DateUtils.unitToSeconds(
+    pollFallback(poll, 'expiryUnit'),
+    pollFallback(poll, 'expiryAmount')
+  )
+
+  const options = uniq(pollFallback(poll, 'options').filter(option => option !== ''))
+  if (options.length < 2) {
+    return { errorKey: 'polls.not_enough_options' }
+  }
+
+  return {
+    options,
+    multiple: pollFallback(poll, 'pollType') === 'multiple',
+    expiresIn
+  }
+}
+
+export {
+  pollFallback,
+  pollFormToMasto
+}
diff --git a/src/services/promise_interval/promise_interval.js b/src/services/promise_interval/promise_interval.js
index 0c0a66a01..0f9abaf13 100644
--- a/src/services/promise_interval/promise_interval.js
+++ b/src/services/promise_interval/promise_interval.js
@@ -1,4 +1,3 @@
-
 // promiseInterval - replacement for setInterval for promises, starts counting
 // the interval only after a promise is done instead of immediately.
 // - promiseCall is a function that returns a promise, it's called the first
diff --git a/src/services/ruffle_service/ruffle_service.js b/src/services/ruffle_service/ruffle_service.js
index 7411dd962..b317f08eb 100644
--- a/src/services/ruffle_service/ruffle_service.js
+++ b/src/services/ruffle_service/ruffle_service.js
@@ -1,11 +1,12 @@
 const createRuffleService = () => {
   let ruffleInstance = null
 
-  const getRuffle = () => new Promise((resolve, reject) => {
+  const getRuffle = async () => new Promise((resolve, reject) => {
     if (ruffleInstance) {
       resolve(ruffleInstance)
       return
     }
+
     // Ruffle needs these to be set before it's loaded
     // https://github.com/ruffle-rs/ruffle/issues/3952
     window.RufflePlayer = {}
diff --git a/src/services/status_parser/status_parser.js b/src/services/status_parser/status_parser.js
index ed0f6d572..19a349532 100644
--- a/src/services/status_parser/status_parser.js
+++ b/src/services/status_parser/status_parser.js
@@ -1,11 +1,60 @@
-import { filter } from 'lodash'
-
-export const muteWordHits = (status, muteWords) => {
+export const muteFilterHits = (muteFilters, status) => {
   const statusText = status.text.toLowerCase()
   const statusSummary = status.summary.toLowerCase()
-  const hits = filter(muteWords, (muteWord) => {
-    return statusText.includes(muteWord.toLowerCase()) || statusSummary.includes(muteWord.toLowerCase())
-  })
+  const replyToUser = status.in_reply_to_screen_name?.toLowerCase()
+  const poster = status.user.screen_name?.toLowerCase()
+  const mentions = (status.attentions || []).map(att => att.screen_name.toLowerCase())
 
-  return hits
+
+  return muteFilters.toSorted((a,b) => b.order - a.order).map(filter => {
+    const { hide, expires, name, value, type, enabled} = filter
+    if (!enabled) return false
+    if (value === '') return false
+    if (expires !== null && expires < Date.now()) return false
+    switch (type) {
+      case 'word': {
+        const lowercaseValue = value.toLowerCase()
+        if (statusText.toLowerCase().includes(lowercaseValue) || statusSummary.toLowerCase().includes(lowercaseValue)) {
+          return { hide, name }
+        }
+        break
+      }
+      case 'regexp': {
+        try {
+          const re = new RegExp(value, 'i')
+          if (re.test(statusText) || re.test(statusSummary)) {
+            return { hide, name }
+          }
+          return false
+        } catch {
+          return false
+        }
+      }
+      case 'user': {
+        if (
+          poster.includes(value) ||
+            replyToUser.includes(value) ||
+            mentions.some(mention => mention.includes(value))
+        ) {
+          return { hide, name }
+        }
+        break
+      }
+      case 'user_regexp': {
+        try {
+          const re = new RegExp(value, 'i')
+          if (
+            re.test(poster) ||
+              re.test(replyToUser) ||
+              mentions.some(mention => re.test(mention))
+          ) {
+            return { hide, name }
+          }
+          return false
+        } catch {
+          return false
+        }
+      }
+    }
+  }).filter(_ => _)
 }
diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js
index c1603f39f..90c6180f4 100644
--- a/src/services/style_setter/style_setter.js
+++ b/src/services/style_setter/style_setter.js
@@ -1,80 +1,97 @@
-import { hex2rgb } from '../color_convert/color_convert.js'
 import { init, getEngineChecksum } from '../theme_data/theme_data_3.service.js'
 import { getCssRules } from '../theme_data/css_utils.js'
-import { defaultState } from '../../modules/config.js'
-import { chunk } from 'lodash'
+import { defaultState } from 'src/modules/default_config_state.js'
+import { chunk, throttle } from 'lodash'
+import localforage from 'localforage'
 
 // On platforms where this is not supported, it will return undefined
 // Otherwise it will return an array
 const supportsAdoptedStyleSheets = !!document.adoptedStyleSheets
 
-const createStyleSheet = (id) => {
-  if (supportsAdoptedStyleSheets) {
-    return {
-      el: null,
-      sheet: new CSSStyleSheet(),
-      rules: []
+const stylesheets = {}
+
+export const createStyleSheet = (id, priority = 1000) => {
+  if (stylesheets[id]) return stylesheets[id]
+  const newStyleSheet = {
+    rules: [],
+    ready: false,
+    priority,
+    clear () {
+      this.rules = []
+    },
+    addRule (rule) {
+      let newRule = rule
+      if (!CSS.supports?.('backdrop-filter', 'blur()')) {
+        newRule = newRule.replace(/backdrop-filter:[^;]+;/g, '') // Remove backdrop-filter
+      }
+
+      // firefox doesn't like invalid selectors
+      if (!CSS.supports?.('selector(::-webkit-scrollbar)') && newRule.startsWith('::-webkit')) {
+        return
+      }
+      this.rules.push(
+        newRule
+          .replace(/var\(--shadowFilter\)[^;]*;/g, '') // Remove shadowFilter references
+      )
     }
   }
 
-  const el = document.getElementById(id)
-  // Clear all rules in it
-  for (let i = el.sheet.cssRules.length - 1; i >= 0; --i) {
-    el.sheet.deleteRule(i)
-  }
-
-  return {
-    el,
-    sheet: el.sheet,
-    rules: []
-  }
+  stylesheets[id] = newStyleSheet
+  return newStyleSheet
 }
 
-const EAGER_STYLE_ID = 'pleroma-eager-styles'
-const LAZY_STYLE_ID = 'pleroma-lazy-styles'
 
-const adoptStyleSheets = (styles) => {
+export const adoptStyleSheets = throttle(() => {
   if (supportsAdoptedStyleSheets) {
-    document.adoptedStyleSheets = styles.map(s => s.sheet)
+    document.adoptedStyleSheets = Object
+      .values(stylesheets)
+      .filter(x => x.ready)
+      .sort((a, b) => a.priority - b.priority)
+      .map(sheet => {
+        const css = new CSSStyleSheet()
+        sheet.rules.forEach(r => css.insertRule(r))
+        return css
+      })
+  } else {
+    const holder = document.getElementById('custom-styles-holder')
+
+    for (let i = holder.sheet.cssRules.length - 1; i >= 0; --i) {
+      holder.sheet.deleteRule(i)
+    }
+
+    Object
+      .values(stylesheets)
+      .filter(x => x.ready)
+      .sort((a, b) => a.priority - b.priority)
+      .forEach(sheet => {
+        sheet.rules.forEach(r => holder.sheet.insertRule(r))
+      })
   }
   // Some older browsers do not support document.adoptedStyleSheets.
   // In this case, we use the <style> elements.
   // Since the <style> elements we need are already in the DOM, there
   // is nothing to do here.
-}
+}, 500)
+
+
+const EAGER_STYLE_ID = 'pleroma-eager-styles'
+const LAZY_STYLE_ID = 'pleroma-lazy-styles'
 
 export const generateTheme = (inputRuleset, callbacks, debug) => {
   const {
-    onNewRule = (rule, isLazy) => {},
+    onNewRule = () => {},
     onLazyFinished = () => {},
     onEagerFinished = () => {}
   } = callbacks
 
   const themes3 = init({
     inputRuleset,
-    // Assuming that "worst case scenario background" is panel background since it's the most likely one
-    ultimateBackgroundColor: inputRuleset[0].directives['--bg'].split('|')[1].trim(),
     debug
   })
 
   getCssRules(themes3.eager, debug).forEach(rule => {
     // Hacks to support multiple selectors on same component
-    if (rule.match(/::-webkit-scrollbar-button/)) {
-      const parts = rule.split(/[{}]/g)
-      const newRule = [
-        parts[0],
-        ', ',
-        parts[0].replace(/button/, 'thumb'),
-        ', ',
-        parts[0].replace(/scrollbar-button/, 'resizer'),
-        ' {',
-        parts[1],
-        '}'
-      ].join('')
-      onNewRule(newRule, false)
-    } else {
-      onNewRule(rule, false)
-    }
+    onNewRule(rule, false)
   })
   onEagerFinished()
 
@@ -88,22 +105,7 @@ export const generateTheme = (inputRuleset, callbacks, debug) => {
     const chunk = chunks[counter]
     Promise.all(chunk.map(x => x())).then(result => {
       getCssRules(result.filter(x => x), debug).forEach(rule => {
-        if (rule.match(/\.modal-view/)) {
-          const parts = rule.split(/[{}]/g)
-          const newRule = [
-            parts[0],
-            ', ',
-            parts[0].replace(/\.modal-view/, '#modal'),
-            ', ',
-            parts[0].replace(/\.modal-view/, '.shout-panel'),
-            ' {',
-            parts[1],
-            '}'
-          ].join('')
-          onNewRule(newRule, true)
-        } else {
-          onNewRule(rule, true)
-        }
+        onNewRule(rule, true)
       })
       // const t1 = performance.now()
       // console.debug('Chunk ' + counter + ' took ' + (t1 - t0) + 'ms')
@@ -120,65 +122,68 @@ export const generateTheme = (inputRuleset, callbacks, debug) => {
   return { lazyProcessFunc: processChunk }
 }
 
-export const tryLoadCache = () => {
-  const json = localStorage.getItem('pleroma-fe-theme-cache')
-  if (!json) return null
-  let cache
+export const tryLoadCache = async () => {
+  console.info('Trying to load compiled theme data from cache')
+  const cache = await localforage.getItem('pleromafe-theme-cache')
+  if (!cache) return null
   try {
-    cache = JSON.parse(json)
+    if (cache.engineChecksum === getEngineChecksum()) {
+      const eagerStyles = createStyleSheet(EAGER_STYLE_ID, 10)
+      const lazyStyles = createStyleSheet(LAZY_STYLE_ID, 20)
+
+      cache.data[0].forEach(rule => eagerStyles.addRule(rule))
+      cache.data[1].forEach(rule => lazyStyles.addRule(rule))
+
+      eagerStyles.ready = true
+      lazyStyles.ready = true
+
+      console.info(`Loaded theme from cache`)
+      return true
+    } else {
+      console.warn('Engine checksum doesn\'t match, cache not usable, clearing')
+      localStorage.removeItem('pleroma-fe-theme-cache')
+    }
   } catch (e) {
-    console.error('Failed to decode theme cache:', e)
+    console.error('Failed to load theme cache:', e)
     return false
   }
-  if (cache.engineChecksum === getEngineChecksum()) {
-    const eagerStyles = createStyleSheet(EAGER_STYLE_ID)
-    const lazyStyles = createStyleSheet(LAZY_STYLE_ID)
-
-    cache.data[0].forEach(rule => eagerStyles.sheet.insertRule(rule, 'index-max'))
-    cache.data[1].forEach(rule => lazyStyles.sheet.insertRule(rule, 'index-max'))
-
-    adoptStyleSheets([eagerStyles, lazyStyles])
-
-    return true
-  } else {
-    console.warn('Engine checksum doesn\'t match, cache not usable, clearing')
-    localStorage.removeItem('pleroma-fe-theme-cache')
-  }
 }
 
-export const applyTheme = (input, onFinish = (data) => {}, debug) => {
-  const eagerStyles = createStyleSheet(EAGER_STYLE_ID)
-  const lazyStyles = createStyleSheet(LAZY_STYLE_ID)
+export const applyTheme = (
+  input,
+  onEagerFinish = () => {},
+  onFinish = () => {},
+  debug
+) => {
+  const eagerStyles = createStyleSheet(EAGER_STYLE_ID, 10)
+  const lazyStyles = createStyleSheet(LAZY_STYLE_ID, 20)
+
+  eagerStyles.clear()
+  lazyStyles.clear()
 
   const { lazyProcessFunc } = generateTheme(
     input,
     {
       onNewRule (rule, isLazy) {
         if (isLazy) {
-          lazyStyles.sheet.insertRule(rule, 'index-max')
-          lazyStyles.rules.push(rule)
+          lazyStyles.addRule(rule)
         } else {
-          eagerStyles.sheet.insertRule(rule, 'index-max')
-          eagerStyles.rules.push(rule)
+          eagerStyles.addRule(rule)
         }
       },
       onEagerFinished () {
-        adoptStyleSheets([eagerStyles])
+        eagerStyles.ready = true
+        adoptStyleSheets()
+        onEagerFinish()
+        console.info('Eager part of theme finished, waiting for lazy part to finish to store cache')
       },
       onLazyFinished () {
-        adoptStyleSheets([eagerStyles, lazyStyles])
+        lazyStyles.ready = true
+        adoptStyleSheets()
         const cache = { engineChecksum: getEngineChecksum(), data: [eagerStyles.rules, lazyStyles.rules] }
         onFinish(cache)
-        try {
-          localStorage.setItem('pleroma-fe-theme-cache', JSON.stringify(cache))
-        } catch (e) {
-          localStorage.removeItem('pleroma-fe-theme-cache')
-          try {
-            localStorage.setItem('pleroma-fe-theme-cache', JSON.stringify(cache))
-          } catch (e) {
-            console.warn('cannot save cache!', e)
-          }
-        }
+        localforage.setItem('pleromafe-theme-cache', cache)
+        console.info('Theme cache stored')
       }
     },
     debug
@@ -191,6 +196,7 @@ const extractStyleConfig = ({
   sidebarColumnWidth,
   contentColumnWidth,
   notifsColumnWidth,
+  themeEditorMinWidth,
   emojiReactionsScale,
   emojiSize,
   navbarSize,
@@ -202,6 +208,7 @@ const extractStyleConfig = ({
     sidebarColumnWidth,
     contentColumnWidth,
     notifsColumnWidth,
+    themeEditorMinWidth: parseInt(themeEditorMinWidth) === 0 ? 'fit-content' : themeEditorMinWidth,
     emojiReactionsScale,
     emojiSize,
     navbarSize,
@@ -229,87 +236,85 @@ const extractStyleConfig = ({
 
 const defaultStyleConfig = extractStyleConfig(defaultState)
 
-export const applyConfig = (input, i18n) => {
+export const applyConfig = (input) => {
   const config = extractStyleConfig(input)
 
   if (config === defaultStyleConfig) {
     return
   }
 
-  const head = document.head
-
   const rules = Object
     .entries(config)
-    .filter(([k, v]) => v)
+    .filter(([, v]) => v)
     .map(([k, v]) => `--${k}: ${v}`).join(';')
 
-  document.getElementById('style-config')?.remove()
-  const styleEl = document.createElement('style')
-  styleEl.id = 'style-config'
-  head.appendChild(styleEl)
-  const styleSheet = styleEl.sheet
+  const styleSheet = createStyleSheet('theme-holder', 30)
 
-  styleSheet.toString()
-  styleSheet.insertRule(`:root { ${rules} }`, 'index-max')
+  styleSheet.clear()
+  styleSheet.addRule(`:root { ${rules} }`)
 
+  // TODO find a way to make this not apply to theme previews
   if (Object.prototype.hasOwnProperty.call(config, 'forcedRoundness')) {
-    styleSheet.insertRule(` * {
+    styleSheet.addRule(` *:not(.preview-block) {
         --roundness: var(--forcedRoundness) !important;
-    }`, 'index-max')
+    }`)
   }
+  styleSheet.ready = true
+  adoptStyleSheets()
 }
 
-export const getThemes = () => {
+export const getResourcesIndex = async (url, parser = JSON.parse) => {
   const cache = 'no-store'
+  const customUrl = url.replace(/\.(\w+)$/, '.custom.$1')
+  let builtin
+  let custom
 
-  return window.fetch('/static/styles.json', { cache })
-    .then((data) => data.json())
-    .then((themes) => {
-      return Object.entries(themes).map(([k, v]) => {
-        let promise = null
+  const resourceTransform = (resources) => {
+    return Object
+      .entries(resources)
+      .map(([k, v]) => {
         if (typeof v === 'object') {
-          promise = Promise.resolve(v)
+          return [k, () => Promise.resolve(v)]
         } else if (typeof v === 'string') {
-          promise = window.fetch(v, { cache })
-            .then((data) => data.json())
-            .catch((e) => {
-              console.error(e)
-              return null
-            })
+          return [
+            k,
+            () => window
+              .fetch(v, { cache })
+              .then(data => data.text())
+              .then(text => parser(text))
+              .catch(e => {
+                console.error(e)
+                return null
+              })
+          ]
+        } else {
+          console.error(`Unknown resource format - ${k} is a ${typeof v}`)
+          return [k, null]
         }
-        return [k, promise]
       })
-    })
-    .then((promises) => {
-      return promises
-        .reduce((acc, [k, v]) => {
-          acc[k] = v
-          return acc
-        }, {})
-    })
-}
-
-export const getPreset = (val) => {
-  return getThemes()
-    .then((themes) => themes[val] ? themes[val] : themes['pleroma-dark'])
-    .then((theme) => {
-      const isV1 = Array.isArray(theme)
-      const data = isV1 ? {} : theme.theme
-
-      if (isV1) {
-        const bg = hex2rgb(theme[1])
-        const fg = hex2rgb(theme[2])
-        const text = hex2rgb(theme[3])
-        const link = hex2rgb(theme[4])
-
-        const cRed = hex2rgb(theme[5] || '#FF0000')
-        const cGreen = hex2rgb(theme[6] || '#00FF00')
-        const cBlue = hex2rgb(theme[7] || '#0000FF')
-        const cOrange = hex2rgb(theme[8] || '#E3FF00')
-
-        data.colors = { bg, fg, text, link, cRed, cBlue, cGreen, cOrange }
-      }
-
-      return { theme: data, source: theme.source }
-    })
+  }
+
+  try {
+    const builtinData = await window.fetch(url, { cache })
+    const builtinResources = await builtinData.json()
+    builtin = resourceTransform(builtinResources)
+  } catch {
+    builtin = []
+    console.warn(`Builtin resources at ${url} unavailable`)
+  }
+
+  try {
+    const customData = await window.fetch(customUrl, { cache })
+    const customResources = await customData.json()
+    custom = resourceTransform(customResources)
+  } catch {
+    custom = []
+    console.warn(`Custom resources at ${customUrl} unavailable`)
+  }
+
+  const total = [...custom, ...builtin]
+  if (total.length === 0) {
+    return Promise.reject(new Error(`Resource at ${url} and ${customUrl} completely unavailable. Panicking`))
+  }
+  return Promise.resolve(Object.fromEntries(total))
 }
diff --git a/src/services/sw/sw.js b/src/services/sw/sw.js
index b25f6328d..8c5edc9ed 100644
--- a/src/services/sw/sw.js
+++ b/src/services/sw/sw.js
@@ -1,5 +1,4 @@
-import runtime from 'serviceworker-webpack5-plugin/lib/runtime'
-
+/* global process */
 function urlBase64ToUint8Array (base64String) {
   const padding = '='.repeat((4 - base64String.length % 4) % 4)
   const base64 = (base64String + padding)
@@ -19,7 +18,9 @@ function isPushSupported () {
 }
 
 function getOrCreateServiceWorker () {
-  return runtime.register()
+  if (!isSWSupported()) return
+  const swType = process.env.HAS_MODULE_SERVICE_WORKER ? 'module' : 'classic'
+  return navigator.serviceWorker.register('/sw-pleroma.js', { type: swType })
     .catch((err) => console.error('Unable to get or create a service worker.', err))
 }
 
@@ -98,14 +99,14 @@ export async function initServiceWorker (store) {
 
 export async function showDesktopNotification (content) {
   if (!isSWSupported) return
-  const { active: sw } = await window.navigator.serviceWorker.getRegistration()
+  const { active: sw } = (await window.navigator.serviceWorker.getRegistration()) || {}
   if (!sw) return console.error('No serviceworker found!')
   sw.postMessage({ type: 'desktopNotification', content })
 }
 
 export async function closeDesktopNotification ({ id }) {
   if (!isSWSupported) return
-  const { active: sw } = await window.navigator.serviceWorker.getRegistration()
+  const { active: sw } = (await window.navigator.serviceWorker.getRegistration()) || {}
   if (!sw) return console.error('No serviceworker found!')
   if (id >= 0) {
     sw.postMessage({ type: 'desktopNotificationClose', content: { id } })
@@ -116,7 +117,7 @@ export async function closeDesktopNotification ({ id }) {
 
 export async function updateFocus () {
   if (!isSWSupported) return
-  const { active: sw } = await window.navigator.serviceWorker.getRegistration()
+  const { active: sw } = (await window.navigator.serviceWorker.getRegistration()) || {}
   if (!sw) return console.error('No serviceworker found!')
   sw.postMessage({ type: 'updateFocus' })
 }
@@ -138,7 +139,7 @@ export function unregisterPushNotifications (token) {
         .then((registration) => {
           return unsubscribePush(registration).then((result) => [registration, result])
         })
-        .then(([registration, unsubResult]) => {
+        .then(([, unsubResult]) => {
           if (!unsubResult) {
             console.warn('Push subscription cancellation wasn\'t successful')
           }
@@ -146,3 +147,11 @@ export function unregisterPushNotifications (token) {
     ]).catch((e) => console.warn(`Failed to disable Web Push Notifications: ${e.message}`))
   }
 }
+
+export const shouldCache = process.env.NODE_ENV === 'production'
+export const cacheKey = 'pleroma-fe'
+export const emojiCacheKey = 'pleroma-fe-emoji'
+
+export const clearCache = (key) => caches.delete(key)
+
+export { getOrCreateServiceWorker }
diff --git a/src/services/theme_data/css_utils.js b/src/services/theme_data/css_utils.js
index 9bce48340..48935ea0e 100644
--- a/src/services/theme_data/css_utils.js
+++ b/src/services/theme_data/css_utils.js
@@ -2,25 +2,6 @@ import { convert } from 'chromatism'
 
 import { hex2rgb, rgba2css } from '../color_convert/color_convert.js'
 
-export const parseCssShadow = (text) => {
-  const dimensions = /(\d[a-z]*\s?){2,4}/.exec(text)?.[0]
-  const inset = /inset/.exec(text)?.[0]
-  const color = text.replace(dimensions, '').replace(inset, '')
-
-  const [x, y, blur = 0, spread = 0] = dimensions.split(/ /).filter(x => x).map(x => x.trim())
-  const isInset = inset?.trim() === 'inset'
-  const colorString = color.split(/ /).filter(x => x).map(x => x.trim())[0]
-
-  return {
-    x,
-    y,
-    blur,
-    spread,
-    inset: isInset,
-    color: colorString
-  }
-}
-
 export const getCssColorString = (color, alpha = 1) => rgba2css({ ...convert(color).rgb, a: alpha })
 
 export const getCssShadow = (input, usesDropShadow) => {
@@ -84,6 +65,9 @@ export const getCssRules = (rules, debug) => rules.map(rule => {
         ].join(';\n  ')
       }
       case 'shadow': {
+        if (!rule.dynamicVars.shadow) {
+          return ''
+        }
         return '  ' + [
           '--shadow: ' + getCssShadow(rule.dynamicVars.shadow),
           '--shadowFilter: ' + getCssShadowFilter(rule.dynamicVars.shadow),
@@ -98,7 +82,7 @@ export const getCssRules = (rules, debug) => rules.map(rule => {
           `
         }
         if (v === 'transparent') {
-          if (rule.component === 'Root') return []
+          if (rule.component === 'Root') return null
           return [
             rule.directives.backgroundNoCssColor !== 'yes' ? ('background-color: ' + v) : '',
             '  --background: ' + v
@@ -130,7 +114,7 @@ export const getCssRules = (rules, debug) => rules.map(rule => {
       }
       default:
         if (k.startsWith('--')) {
-          const [type, value] = v.split('|').map(x => x.trim()) // woah, Extreme!
+          const [type, value] = v.split('|').map(x => x.trim())
           switch (type) {
             case 'color': {
               const color = rule.dynamicVars[k]
@@ -143,21 +127,20 @@ export const getCssRules = (rules, debug) => rules.map(rule => {
             case 'generic':
               return k + ': ' + value
             default:
-              return ''
+              return null
           }
         }
-        return ''
+        return null
     }
-  }).filter(x => x).map(x => '  ' + x).join(';\n')
+  }).filter(x => x).map(x => '  ' + x + ';').join('\n')
 
   return [
     header,
-    directives + ';',
+    directives,
     (rule.component === 'Text' && rule.state.indexOf('faint') < 0 && rule.directives.textNoCssColor !== 'yes') ? '  color: var(--text);' : '',
-    '',
     virtualDirectives,
     footer
-  ].join('\n')
+  ].filter(x => x).join('\n')
 }).filter(x => x)
 
 export const getScopedVersion = (rules, newScope) => {
diff --git a/src/services/theme_data/iss_deserializer.js b/src/services/theme_data/iss_deserializer.js
index 909e9411a..a69a18576 100644
--- a/src/services/theme_data/iss_deserializer.js
+++ b/src/services/theme_data/iss_deserializer.js
@@ -1,10 +1,11 @@
 import { flattenDeep } from 'lodash'
 
-const parseShadow = string => {
-  const modes = ['_full', 'inset', 'x', 'y', 'blur', 'spread', 'color', 'alpha']
+export const deserializeShadow = string => {
+  const modes = ['_full', 'inset', 'x', 'y', 'blur', 'spread', 'color', 'alpha', 'name']
   const regexPrep = [
     // inset keyword (optional)
-    '^(?:(inset)\\s+)?',
+    '^',
+    '(?:(inset)\\s+)?',
     // x
     '(?:(-?[0-9]+(?:\\.[0-9]+)?)\\s+)',
     // y
@@ -14,27 +15,39 @@ const parseShadow = string => {
     // spread (optional)
     '(?:(-?[0-9]+(?:\\.[0-9]+)?)\\s+)?',
     // either hex, variable or function
-    '(#[0-9a-f]{6}|--[a-z\\-_]+|\\$[a-z\\-()_]+)',
+    '(#[0-9a-f]{6}|--[a-z0-9\\-_]+|\\$[a-z0-9\\-()_ ]+)',
     // opacity (optional)
-    '(?:\\s+\\/\\s+([0-9]+(?:\\.[0-9]+)?)\\s*)?$'
+    '(?:\\s+\\/\\s+([0-9]+(?:\\.[0-9]+)?)\\s*)?',
+    // name
+    '(?:\\s+#(\\w+)\\s*)?',
+    '$'
   ].join('')
   const regex = new RegExp(regexPrep, 'gis') // global, (stable) indices, single-string
   const result = regex.exec(string)
   if (result == null) {
-    return string
+    if (string.startsWith('$') || string.startsWith('--')) {
+      return string
+    } else {
+      throw new Error(`Invalid shadow definition: '${string}'`)
+    }
   } else {
     const numeric = new Set(['x', 'y', 'blur', 'spread', 'alpha'])
-    const { x, y, blur, spread, alpha, inset, color } = Object.fromEntries(modes.map((mode, i) => {
+    const { x, y, blur, spread, alpha, inset, color, name } = Object.fromEntries(modes.map((mode, i) => {
       if (numeric.has(mode)) {
-        return [mode, Number(result[i])]
+        const number = Number(result[i])
+        if (Number.isNaN(number)) {
+          if (mode === 'alpha') return [mode, 1]
+          return [mode, 0]
+        }
+        return [mode, number]
       } else if (mode === 'inset') {
         return [mode, !!result[i]]
       } else {
         return [mode, result[i]]
       }
-    }).filter(([k, v]) => v !== false).slice(1))
+    }).filter(([, v]) => v !== false).slice(1))
 
-    return { x, y, blur, spread, color, alpha, inset }
+    return { x, y, blur, spread, color, alpha, inset, name }
   }
 }
 // this works nearly the same as HTML tree converter
@@ -136,12 +149,12 @@ export const deserialize = (input) => {
 
       output.directives = Object.fromEntries(content.map(d => {
         const [property, value] = d.split(':')
-        let realValue = value.trim()
+        let realValue = (value || '').trim()
         if (property === 'shadow') {
           if (realValue === 'none') {
             realValue = []
           } else {
-            realValue = value.split(',').map(v => parseShadow(v.trim()))
+            realValue = value.split(',').map(v => deserializeShadow(v.trim()))
           }
         } if (!Number.isNaN(Number(value))) {
           realValue = Number(value)
diff --git a/src/services/theme_data/iss_serializer.js b/src/services/theme_data/iss_serializer.js
index 8b7cf5d88..ce3551224 100644
--- a/src/services/theme_data/iss_serializer.js
+++ b/src/services/theme_data/iss_serializer.js
@@ -1,8 +1,13 @@
 import { unroll } from './iss_utils.js'
+import { deserializeShadow } from './iss_deserializer.js'
 
-const serializeShadow = s => {
+export const serializeShadow = (s) => {
   if (typeof s === 'object') {
-    return `${s.inset ? 'inset ' : ''}${s.x} ${s.y} ${s.blur} ${s.spread} ${s.color} / ${s.alpha}`
+    const inset = s.inset ? 'inset ' : ''
+    const name = s.name ? ` #${s.name} ` : ''
+    const result = `${inset}${s.x} ${s.y} ${s.blur} ${s.spread} ${s.color} / ${s.alpha}${name}`
+    deserializeShadow(result) // Verify that output is valid and parseable
+    return result
   } else {
     return s
   }
diff --git a/src/services/theme_data/iss_utils.js b/src/services/theme_data/iss_utils.js
index 75f8dd93c..a12991485 100644
--- a/src/services/theme_data/iss_utils.js
+++ b/src/services/theme_data/iss_utils.js
@@ -56,43 +56,74 @@ export const getAllPossibleCombinations = (array) => {
  *
  * @returns {String} CSS selector (or path)
  */
-export const genericRuleToSelector = components => (rule, ignoreOutOfTreeSelector, isParent) => {
+export const genericRuleToSelector = components => (rule, ignoreOutOfTreeSelector, liteMode, children) => {
+  const isParent = !!children
   if (!rule && !isParent) return null
   const component = components[rule.component]
-  const { states = {}, variants = {}, selector, outOfTreeSelector } = component
+  const { states = {}, variants = {}, outOfTreeSelector } = component
 
-  const applicableStates = ((rule.state || []).filter(x => x !== 'normal')).map(state => states[state])
+  const expand = (array = [], subArray = []) => {
+    if (array.length === 0) return subArray.map(x => [x])
+    if (subArray.length === 0) return array.map(x => [x])
+    return array.map(a => {
+      return subArray.map(b => [a, b])
+    }).flat()
+  }
+
+  let componentSelectors = Array.isArray(component.selector) ? component.selector : [component.selector]
+  if (ignoreOutOfTreeSelector || liteMode) componentSelectors = [componentSelectors[0]]
+  componentSelectors = componentSelectors.map(selector => {
+    if (selector === ':root') {
+      return ''
+    } else if (isParent) {
+      return selector
+    } else {
+      if (outOfTreeSelector && !ignoreOutOfTreeSelector) return outOfTreeSelector
+      return selector
+    }
+  })
 
   const applicableVariantName = (rule.variant || 'normal')
-  let applicableVariant = ''
+  let variantSelectors = null
   if (applicableVariantName !== 'normal') {
-    applicableVariant = variants[applicableVariantName]
+    variantSelectors = variants[applicableVariantName]
   } else {
-    applicableVariant = variants?.normal ?? ''
+    variantSelectors = variants?.normal ?? ''
   }
+  variantSelectors = Array.isArray(variantSelectors) ? variantSelectors : [variantSelectors]
+  if (ignoreOutOfTreeSelector || liteMode) variantSelectors = [variantSelectors[0]]
 
-  let realSelector
-  if (selector === ':root') {
-    realSelector = ''
-  } else if (isParent) {
-    realSelector = selector
-  } else {
-    if (outOfTreeSelector && !ignoreOutOfTreeSelector) realSelector = outOfTreeSelector
-    else realSelector = selector
-  }
+  const applicableStates = (rule.state || []).filter(x => x !== 'normal')
+  // const applicableStates = (rule.state || [])
+  const statesSelectors = applicableStates.map(state => {
+    const selector = states[state] || ''
+    let arraySelector = Array.isArray(selector) ? selector : [selector]
+    if (ignoreOutOfTreeSelector || liteMode) arraySelector = [arraySelector[0]]
+    arraySelector
+      .sort((a) => {
+        if (a.startsWith(':')) return 1
+        if (/^[a-z]/.exec(a)) return -1
+        else return 0
+      })
+      .join('')
+    return arraySelector
+  })
 
-  const selectors = [realSelector, applicableVariant, ...applicableStates]
-    .sort((a, b) => {
-      if (a.startsWith(':')) return 1
-      if (/^[a-z]/.exec(a)) return -1
-      else return 0
-    })
-    .join('')
+  const statesSelectorsFlat = statesSelectors.reduce((acc, s) => {
+    return expand(acc, s).map(st => st.join(''))
+  }, [])
+
+  const componentVariant = expand(componentSelectors, variantSelectors).map(cv => cv.join(''))
+  const componentVariantStates = expand(componentVariant, statesSelectorsFlat).map(cvs => cvs.join(''))
+  const selectors = expand(componentVariantStates, children).map(cvsc => cvsc.join(' '))
+  /*
+  */
 
   if (rule.parent) {
-    return (genericRuleToSelector(components)(rule.parent, ignoreOutOfTreeSelector, true) + ' ' + selectors).trim()
+    return genericRuleToSelector(components)(rule.parent, ignoreOutOfTreeSelector, liteMode, selectors)
   }
-  return selectors.trim()
+
+  return selectors.join(', ').trim()
 }
 
 /**
diff --git a/src/services/theme_data/pleromafe.t3.js b/src/services/theme_data/pleromafe.t3.js
deleted file mode 100644
index db612a5b5..000000000
--- a/src/services/theme_data/pleromafe.t3.js
+++ /dev/null
@@ -1,2 +0,0 @@
-export const sampleRules = [
-]
diff --git a/src/services/theme_data/theme2_to_theme3.js b/src/services/theme_data/theme2_to_theme3.js
index bcc0c961b..0c3383283 100644
--- a/src/services/theme_data/theme2_to_theme3.js
+++ b/src/services/theme_data/theme2_to_theme3.js
@@ -244,9 +244,6 @@ export const convertTheme2To3 = (data) => {
         case 'tooltip':
           rule.component = 'Popover'
           break
-        case 'attachment':
-          rule.component = 'Attachment'
-          break
         case 'ChatMessage':
           rule.component = 'Button'
           break
@@ -354,10 +351,6 @@ export const convertTheme2To3 = (data) => {
         newRules.push({ ...rule, state: ['toggled'] })
         newRules.push({ ...rule, state: ['toggled', 'focus'] })
         newRules.push({ ...rule, state: ['pressed', 'focus'] })
-      }
-      if (key === 'buttonHover') {
-        newRules.push({ ...rule, state: ['toggled', 'hover'] })
-        newRules.push({ ...rule, state: ['pressed', 'hover'] })
         newRules.push({ ...rule, state: ['toggled', 'focus', 'hover'] })
         newRules.push({ ...rule, state: ['pressed', 'focus', 'hover'] })
       }
diff --git a/src/services/theme_data/theme3_slot_functions.js b/src/services/theme_data/theme3_slot_functions.js
index 074a88f0c..f534b19f4 100644
--- a/src/services/theme_data/theme3_slot_functions.js
+++ b/src/services/theme_data/theme3_slot_functions.js
@@ -1,9 +1,9 @@
 import { convert, brightness } from 'chromatism'
-import { alphaBlend, getTextColor, relativeLuminance } from '../color_convert/color_convert.js'
+import { alphaBlend, arithmeticBlend, getTextColor, relativeLuminance } from '../color_convert/color_convert.js'
 
 export const process = (text, functions, { findColor, findShadow }, { dynamicVars, staticVars }) => {
-  const { funcName, argsString } = /\$(?<funcName>\w+)\((?<argsString>[#a-zA-Z0-9-,.'"\s]*)\)/.exec(text).groups
-  const args = argsString.split(/,/g).map(a => a.trim())
+  const { funcName, argsString } = /\$(?<funcName>\w+)\((?<argsString>[#a-zA-Z0-9-+,.'"\s]*)\)/.exec(text).groups
+  const args = argsString.split(/ /g).map(a => a.trim())
 
   const func = functions[funcName]
   if (args.length < func.argsNeeded) {
@@ -15,6 +15,11 @@ export const process = (text, functions, { findColor, findShadow }, { dynamicVar
 export const colorFunctions = {
   alpha: {
     argsNeeded: 2,
+    documentation: 'Changes alpha value of the color only to be used for CSS variables',
+    args: [
+      'color: source color used',
+      'amount: alpha value'
+    ],
     exec: (args, { findColor }, { dynamicVars, staticVars }) => {
       const [color, amountArg] = args
 
@@ -23,8 +28,32 @@ export const colorFunctions = {
       return { ...colorArg, a: amount }
     }
   },
+  brightness: {
+    argsNeeded: 2,
+    document: 'Changes brightness/lightness of color in HSL colorspace',
+    args: [
+      'color: source color used',
+      'amount: lightness value'
+    ],
+    exec: (args, { findColor }, { dynamicVars, staticVars }) => {
+      const [color, amountArg] = args
+
+      const colorArg = convert(findColor(color, { dynamicVars, staticVars })).hsl
+      colorArg.l += Number(amountArg)
+      return { ...convert(colorArg).rgb }
+    }
+  },
   textColor: {
     argsNeeded: 2,
+    documentation: 'Get text color with adequate contrast for given background and intended text color. Same function is used internally',
+    args: [
+      'background: color of backdrop where text will be shown',
+      'foreground: intended text color',
+      `[preserve]: (optional) intended color preservation:
+'preserve' - try to preserve the color
+'no-preserve' - if can't get adequate color - fall back to black or white
+'no-auto' - don't do anything (useless as a color function)`
+    ],
     exec: (args, { findColor }, { dynamicVars, staticVars }) => {
       const [backgroundArg, foregroundArg, preserve = 'preserve'] = args
 
@@ -36,6 +65,12 @@ export const colorFunctions = {
   },
   blend: {
     argsNeeded: 3,
+    documentation: 'Alpha blending between two colors',
+    args: [
+      'background: bottom layer color',
+      'amount: opacity of top layer',
+      'foreground: upper layer color'
+    ],
     exec: (args, { findColor }, { dynamicVars, staticVars }) => {
       const [backgroundArg, amountArg, foregroundArg] = args
 
@@ -46,15 +81,55 @@ export const colorFunctions = {
       return alphaBlend(background, amount, foreground)
     }
   },
-  mod: {
+  shift: {
     argsNeeded: 2,
+    documentation: 'Arithmetic blend between two colors',
+    args: [
+      'origin: base color',
+      'value: shift value',
+      'operator: math operator to use (+ or -)'
+    ],
+    exec: (args, { findColor }, { dynamicVars, staticVars }) => {
+      const [originArg, valueArg, operatorArg] = args
+
+      const origin = convert(findColor(originArg, { dynamicVars, staticVars })).rgb
+      const value = convert(findColor(valueArg, { dynamicVars, staticVars })).rgb
+
+      return arithmeticBlend(origin, value, operatorArg)
+    }
+  },
+  boost: {
+    argsNeeded: 2,
+    documentation: 'If given color is dark makes it darker, if color is light - makes it lighter',
+    args: [
+      'color: source color',
+      'amount: how much darken/brighten the color'
+    ],
     exec: (args, { findColor }, { dynamicVars, staticVars }) => {
       const [colorArg, amountArg] = args
 
       const color = convert(findColor(colorArg, { dynamicVars, staticVars })).rgb
       const amount = Number(amountArg)
 
-      const effectiveBackground = dynamicVars.lowerLevelBackground
+      const isLight = relativeLuminance(color) < 0.5
+      const mod = isLight ? -1 : 1
+      return brightness(amount * mod, color).rgb
+    }
+  },
+  mod: {
+    argsNeeded: 2,
+    documentation: 'Old function that increases or decreases brightness depending if background color is dark or light. Advised against using it as it might give unexpected results.',
+    args: [
+      'color: source color',
+      'amount: how much darken/brighten the color'
+    ],
+    exec: (args, { findColor }, { dynamicVars, staticVars }) => {
+      const [colorArg, amountArg] = args
+
+      const color = convert(findColor(colorArg, { dynamicVars, staticVars })).rgb
+      const amount = Number(amountArg)
+
+      const effectiveBackground = dynamicVars.lowerLevelBackground ?? color
       const isLightOnDark = relativeLuminance(convert(effectiveBackground).rgb) < 0.5
       const mod = isLightOnDark ? 1 : -1
       return brightness(amount * mod, color).rgb
@@ -65,7 +140,15 @@ export const colorFunctions = {
 export const shadowFunctions = {
   borderSide: {
     argsNeeded: 3,
-    exec: (args, { findColor }) => {
+    documentation: 'Simulate a border on a side with a shadow, best works on inset border',
+    args: [
+      'color: border color',
+      'side: string indicating on which side border should be, takes either one word or two words joined by dash (i.e. "left" or "bottom-right")',
+      'width: border width (thickness)',
+      '[alpha]: (Optional) border opacity, defaults to 1 (fully opaque)',
+      '[inset]: (Optional) whether border should be on the inside or outside, defaults to inside'
+    ],
+    exec: (args) => {
       const [color, side, alpha = '1', widthArg = '1', inset = 'inset'] = args
 
       const width = Number(widthArg)
diff --git a/src/services/theme_data/theme_data.service.js b/src/services/theme_data/theme_data.service.js
index ef7ec645e..3cd2bf36c 100644
--- a/src/services/theme_data/theme_data.service.js
+++ b/src/services/theme_data/theme_data.service.js
@@ -218,7 +218,7 @@ export const getLayerSlot = (
  */
 export const SLOT_ORDERED = topoSort(
   Object.entries(SLOT_INHERITANCE)
-    .sort(([aK, aV], [bK, bV]) => ((aV && aV.priority) || 0) - ((bV && bV.priority) || 0))
+    .sort(([, aV], [, bV]) => ((aV && aV.priority) || 0) - ((bV && bV.priority) || 0))
     .reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})
 )
 
@@ -226,7 +226,7 @@ export const SLOT_ORDERED = topoSort(
  * All opacity slots used in color slots, their default values and affected
  * color slots.
  */
-export const OPACITIES = Object.entries(SLOT_INHERITANCE).reduce((acc, [k, v]) => {
+export const OPACITIES = Object.entries(SLOT_INHERITANCE).reduce((acc, [k]) => {
   const opacity = getOpacitySlot(k, SLOT_INHERITANCE, getDependencies)
   if (opacity) {
     return {
@@ -489,7 +489,7 @@ export const generateColors = (themeData) => {
   return {
     rules: {
       colors: Object.entries(htmlColors.complete)
-        .filter(([k, v]) => v)
+        .filter(([, v]) => v)
         .map(([k, v]) => `--${k}: ${v}`)
         .join(';')
     },
@@ -506,10 +506,10 @@ export const generateRadii = (input) => {
   if (typeof input.btnRadius !== 'undefined') {
     inputRadii = Object
       .entries(input)
-      .filter(([k, v]) => k.endsWith('Radius'))
+      .filter(([k]) => k.endsWith('Radius'))
       .reduce((acc, e) => { acc[e[0].split('Radius')[0]] = e[1]; return acc }, {})
   }
-  const radii = Object.entries(inputRadii).filter(([k, v]) => v).reduce((acc, [k, v]) => {
+  const radii = Object.entries(inputRadii).filter(([, v]) => v).reduce((acc, [k, v]) => {
     acc[k] = v
     return acc
   }, {
@@ -526,7 +526,7 @@ export const generateRadii = (input) => {
 
   return {
     rules: {
-      radii: Object.entries(radii).filter(([k, v]) => v).map(([k, v]) => `--${k}Radius: ${v}px`).join(';')
+      radii: Object.entries(radii).filter(([, v]) => v).map(([k, v]) => `--${k}Radius: ${v}px`).join(';')
     },
     theme: {
       radii
@@ -535,8 +535,8 @@ export const generateRadii = (input) => {
 }
 
 export const generateFonts = (input) => {
-  const fonts = Object.entries(input.fonts || {}).filter(([k, v]) => v).reduce((acc, [k, v]) => {
-    acc[k] = Object.entries(v).filter(([k, v]) => v).reduce((acc, [k, v]) => {
+  const fonts = Object.entries(input.fonts || {}).filter(([, v]) => v).reduce((acc, [k, v]) => {
+    acc[k] = Object.entries(v).filter(([, v]) => v).reduce((acc, [k, v]) => {
       acc[k] = v
       return acc
     }, acc[k])
@@ -560,7 +560,7 @@ export const generateFonts = (input) => {
     rules: {
       fonts: Object
         .entries(fonts)
-        .filter(([k, v]) => v)
+        .filter(([, v]) => v)
         .map(([k, v]) => `--${k}Font: ${v.family}`).join(';')
     },
     theme: {
diff --git a/src/services/theme_data/theme_data_3.service.js b/src/services/theme_data/theme_data_3.service.js
index 3c2f8a637..78aad4488 100644
--- a/src/services/theme_data/theme_data_3.service.js
+++ b/src/services/theme_data/theme_data_3.service.js
@@ -22,7 +22,7 @@ import {
   normalizeCombination,
   findRules
 } from './iss_utils.js'
-import { parseCssShadow } from './css_utils.js'
+import { deserializeShadow } from './iss_deserializer.js'
 
 // Ensuring the order of components
 const components = {
@@ -32,23 +32,25 @@ const components = {
   Link: null,
   Icon: null,
   Border: null,
+  PanelHeader: null,
   Panel: null,
   Chat: null,
-  ChatMessage: null
+  ChatMessage: null,
+  Button: null
 }
 
-const findShadow = (shadows, { dynamicVars, staticVars }) => {
+export const findShadow = (shadows, { dynamicVars, staticVars }) => {
   return (shadows || []).map(shadow => {
     let targetShadow
     if (typeof shadow === 'string') {
       if (shadow.startsWith('$')) {
         targetShadow = process(shadow, shadowFunctions, { findColor, findShadow }, { dynamicVars, staticVars })
       } else if (shadow.startsWith('--')) {
-        const [variable] = shadow.split(/,/g).map(str => str.trim()) // discarding modifier since it's not supported
-        const variableSlot = variable.substring(2)
+        // modifiers are completely unsupported here
+        const variableSlot = shadow.substring(2)
         return findShadow(staticVars[variableSlot], { dynamicVars, staticVars })
       } else {
-        targetShadow = parseCssShadow(shadow)
+        targetShadow = deserializeShadow(shadow)
       }
     } else {
       targetShadow = shadow
@@ -62,54 +64,64 @@ const findShadow = (shadows, { dynamicVars, staticVars }) => {
   })
 }
 
-const findColor = (color, { dynamicVars, staticVars }) => {
-  if (typeof color !== 'string' || (!color.startsWith('--') && !color.startsWith('$'))) return color
-  let targetColor = null
-  if (color.startsWith('--')) {
-    const [variable, modifier] = color.split(/,/g).map(str => str.trim())
-    const variableSlot = variable.substring(2)
-    if (variableSlot === 'stack') {
-      const { r, g, b } = dynamicVars.stacked
-      targetColor = { r, g, b }
-    } else if (variableSlot.startsWith('parent')) {
-      if (variableSlot === 'parent') {
-        const { r, g, b } = dynamicVars.lowerLevelBackground
+export const findColor = (color, { dynamicVars, staticVars }) => {
+  try {
+    if (typeof color !== 'string' || (!color.startsWith('--') && !color.startsWith('$'))) return color
+    let targetColor = null
+    if (color.startsWith('--')) {
+      // Modifier support is pretty much for v2 themes only
+      const [variable, modifier] = color.split(/,/g).map(str => str.trim())
+      const variableSlot = variable.substring(2)
+      if (variableSlot === 'stack') {
+        const { r, g, b } = dynamicVars.stacked
         targetColor = { r, g, b }
+      } else if (variableSlot.startsWith('parent')) {
+        if (variableSlot === 'parent') {
+          const { r, g, b } = dynamicVars.lowerLevelBackground ?? {}
+          targetColor = { r, g, b }
+        } else {
+          const virtualSlot = variableSlot.replace(/^parent/, '')
+          targetColor = convert(dynamicVars.lowerLevelVirtualDirectivesRaw[virtualSlot]).rgb
+        }
       } else {
-        const virtualSlot = variableSlot.replace(/^parent/, '')
-        targetColor = convert(dynamicVars.lowerLevelVirtualDirectivesRaw[virtualSlot]).rgb
+        const staticVar = staticVars[variableSlot]
+        const dynamicVar = dynamicVars[variableSlot]
+        if (!staticVar && !dynamicVar) {
+          console.warn(dynamicVars, variableSlot, dynamicVars[variableSlot])
+          console.warn(`Couldn't find variable "${variableSlot}", falling back to magenta. Variables are:
+Static:
+${JSON.stringify(staticVars, null, 2)}
+Dynamic:
+${JSON.stringify(dynamicVars, null, 2)}`)
+        }
+        targetColor = convert(staticVar ?? dynamicVar ?? '#FF00FF').rgb
       }
-    } else {
-      switch (variableSlot) {
-        case 'inheritedBackground':
-          targetColor = convert(dynamicVars.inheritedBackground).rgb
-          break
-        case 'background':
-          targetColor = convert(dynamicVars.background).rgb
-          break
-        default:
-          targetColor = convert(staticVars[variableSlot]).rgb
+
+      if (modifier) {
+        const effectiveBackground = dynamicVars.lowerLevelBackground ?? targetColor
+        const isLightOnDark = relativeLuminance(convert(effectiveBackground).rgb) < 0.5
+        const mod = isLightOnDark ? 1 : -1
+        targetColor = brightness(Number.parseFloat(modifier) * mod, targetColor).rgb
       }
     }
 
-    if (modifier) {
-      const effectiveBackground = dynamicVars.lowerLevelBackground ?? targetColor
-      const isLightOnDark = relativeLuminance(convert(effectiveBackground).rgb) < 0.5
-      const mod = isLightOnDark ? 1 : -1
-      targetColor = brightness(Number.parseFloat(modifier) * mod, targetColor).rgb
+    if (color.startsWith('$')) {
+      try {
+        targetColor = process(color, colorFunctions, { findColor }, { dynamicVars, staticVars })
+      } catch (e) {
+        console.error('Failure executing color function', e ,'\n Function: ' + color)
+        targetColor = '#FF00FF'
+      }
     }
+    // Color references other color
+    return targetColor
+  } catch (e) {
+    throw new Error(`Couldn't find color "${color}", variables are:
+Static:
+${JSON.stringify(staticVars, null, 2)}
+Dynamic:
+${JSON.stringify(dynamicVars, null, 2)}\nError: ${e}`)
   }
-
-  if (color.startsWith('$')) {
-    try {
-      targetColor = process(color, colorFunctions, { findColor }, { dynamicVars, staticVars })
-    } catch (e) {
-      console.error('Failure executing color function', e)
-      targetColor = '#FF00FF'
-    }
-  }
-  // Color references other color
-  return targetColor
 }
 
 const getTextColorAlpha = (directives, intendedTextColor, dynamicVars, staticVars) => {
@@ -134,15 +146,37 @@ const getTextColorAlpha = (directives, intendedTextColor, dynamicVars, staticVar
 }
 
 // Loading all style.js[on] files dynamically
-const componentsContext = require.context('src', true, /\.style.js(on)?$/)
-componentsContext.keys().forEach(key => {
-  const component = componentsContext(key).default
+const componentsContext = import.meta.glob(
+  ['/src/**/*.style.js', '/src/**/*.style.json'],
+  { eager: true }
+)
+Object.keys(componentsContext).forEach(key => {
+  const component = componentsContext[key].default
   if (components[component.name] != null) {
     console.warn(`Component in file ${key} is trying to override existing component ${component.name}! You have collisions/duplicates!`)
   }
   components[component.name] = component
 })
 
+Object.keys(components).forEach(key => {
+  if (key === 'Root') return
+  components.Root.validInnerComponents = components.Root.validInnerComponents || []
+  components.Root.validInnerComponents.push(key)
+})
+
+Object.keys(components).forEach(key => {
+  const component = components[key]
+  const { validInnerComponents = [] } = component
+  validInnerComponents.forEach(inner => {
+    const child = components[inner]
+    component.possibleChildren = component.possibleChildren || []
+    component.possibleChildren.push(child)
+    child.possibleParents = child.possibleParents || []
+    child.possibleParents.push(component)
+  })
+})
+
+
 const engineChecksum = sum(components)
 
 const ruleToSelector = genericRuleToSelector(components)
@@ -164,19 +198,19 @@ export const getEngineChecksum = () => engineChecksum
  * @param {boolean} onlyNormalState - only use components 'normal' states, meant for generating theme
  *   previews since states are the biggest factor for compilation time and are completely unnecessary
  *   when previewing multiple themes at same time
- * @param {string} rootComponentName - [UNTESTED] which component to start from, meant for previewing a
- *   part of the theme (i.e. just the button) for themes 3 editor.
  */
 export const init = ({
   inputRuleset,
   ultimateBackgroundColor,
   debug = false,
   liteMode = false,
+  editMode = false,
   onlyNormalState = false,
-  rootComponentName = 'Root'
+  initialStaticVars = {}
 }) => {
+  const rootComponentName = 'Root'
   if (!inputRuleset) throw new Error('Ruleset is null or undefined!')
-  const staticVars = {}
+  const staticVars = { ...initialStaticVars }
   const stacked = {}
   const computed = {}
 
@@ -218,8 +252,8 @@ export const init = ({
       bScore += b.component === 'Text' ? 1 : 0
 
       // Debug
-      a.specifityScore = aScore
-      b.specifityScore = bScore
+      a._specificityScore = aScore
+      b._specificityScore = bScore
 
       if (aScore === bScore) {
         return ai - bi
@@ -228,211 +262,243 @@ export const init = ({
     })
     .map(({ data }) => data)
 
+  if (!ultimateBackgroundColor) {
+    console.warn('No ultimate background color provided, falling back to panel color')
+    const rootRule = ruleset.findLast((x) => (x.component === 'Root' && x.directives?.['--bg']))
+    ultimateBackgroundColor = rootRule.directives['--bg'].split('|')[1].trim()
+  }
+
   const virtualComponents = new Set(Object.values(components).filter(c => c.virtual).map(c => c.name))
+  const transparentComponents = new Set(Object.values(components).filter(c => c.transparent).map(c => c.name))
+  const nonEditableComponents = new Set(Object.values(components).filter(c => c.notEditable).map(c => c.name))
+  const extraCompileComponents = new Set([])
+
+  Object.values(components).forEach(component => {
+    const relevantRules = ruleset.filter(r => r.component === component.name)
+    const backgrounds = relevantRules.map(r => r.directives.background).filter(x => x)
+    const opacities = relevantRules.map(r => r.directives.opacity).filter(x => x)
+    if (
+      backgrounds.some(x => x.match(/--parent/)) ||
+        opacities.some(x => x != null && x < 1))
+    {
+      extraCompileComponents.add(component.name)
+    }
+  })
 
   const processCombination = (combination) => {
-    const selector = ruleToSelector(combination, true)
-    const cssSelector = ruleToSelector(combination)
+    try {
+      const selector = ruleToSelector(combination, true)
+      const cssSelector = ruleToSelector(combination)
 
-    const parentSelector = selector.split(/ /g).slice(0, -1).join(' ')
-    const soloSelector = selector.split(/ /g).slice(-1)[0]
+      const parentSelector = selector.split(/ /g).slice(0, -1).join(' ')
+      const soloSelector = selector.split(/ /g).slice(-1)[0]
 
-    const lowerLevelSelector = parentSelector
-    const lowerLevelBackground = computed[lowerLevelSelector]?.background
-    const lowerLevelVirtualDirectives = computed[lowerLevelSelector]?.virtualDirectives
-    const lowerLevelVirtualDirectivesRaw = computed[lowerLevelSelector]?.virtualDirectivesRaw
+      const lowerLevelSelector = parentSelector
+      let lowerLevelBackground = computed[lowerLevelSelector]?.background
+      if (editMode && !lowerLevelBackground) {
+        // FIXME hack for editor until it supports handling component backgrounds
+        lowerLevelBackground = '#00FFFF'
+      }
+      const lowerLevelVirtualDirectives = computed[lowerLevelSelector]?.virtualDirectives
+      const lowerLevelVirtualDirectivesRaw = computed[lowerLevelSelector]?.virtualDirectivesRaw
 
-    const dynamicVars = computed[selector] || {
-      lowerLevelBackground,
-      lowerLevelVirtualDirectives,
-      lowerLevelVirtualDirectivesRaw
-    }
-
-    // Inheriting all of the applicable rules
-    const existingRules = ruleset.filter(findRules(combination))
-    const computedDirectives =
-          existingRules
-            .map(r => r.directives)
-            .reduce((acc, directives) => ({ ...acc, ...directives }), {})
-    const computedRule = {
-      ...combination,
-      directives: computedDirectives
-    }
-
-    computed[selector] = computed[selector] || {}
-    computed[selector].computedRule = computedRule
-    computed[selector].dynamicVars = dynamicVars
-
-    if (virtualComponents.has(combination.component)) {
-      const virtualName = [
-        '--',
-        combination.component.toLowerCase(),
-        combination.variant === 'normal'
-          ? ''
-          : combination.variant[0].toUpperCase() + combination.variant.slice(1).toLowerCase(),
-        ...sortBy(combination.state.filter(x => x !== 'normal')).map(state => state[0].toUpperCase() + state.slice(1).toLowerCase())
-      ].join('')
-
-      let inheritedTextColor = computedDirectives.textColor
-      let inheritedTextAuto = computedDirectives.textAuto
-      let inheritedTextOpacity = computedDirectives.textOpacity
-      let inheritedTextOpacityMode = computedDirectives.textOpacityMode
-      const lowerLevelTextSelector = [...selector.split(/ /g).slice(0, -1), soloSelector].join(' ')
-      const lowerLevelTextRule = computed[lowerLevelTextSelector]
-
-      if (inheritedTextColor == null || inheritedTextOpacity == null || inheritedTextOpacityMode == null) {
-        inheritedTextColor = computedDirectives.textColor ?? lowerLevelTextRule.textColor
-        inheritedTextAuto = computedDirectives.textAuto ?? lowerLevelTextRule.textAuto
-        inheritedTextOpacity = computedDirectives.textOpacity ?? lowerLevelTextRule.textOpacity
-        inheritedTextOpacityMode = computedDirectives.textOpacityMode ?? lowerLevelTextRule.textOpacityMode
+      const dynamicVars = computed[selector] || {
+        lowerLevelSelector,
+        lowerLevelBackground,
+        lowerLevelVirtualDirectives,
+        lowerLevelVirtualDirectivesRaw
       }
 
-      const newTextRule = {
-        ...computedRule,
-        directives: {
-          ...computedRule.directives,
-          textColor: inheritedTextColor,
-          textAuto: inheritedTextAuto ?? 'preserve',
-          textOpacity: inheritedTextOpacity,
-          textOpacityMode: inheritedTextOpacityMode
-        }
-      }
-
-      dynamicVars.inheritedBackground = lowerLevelBackground
-      dynamicVars.stacked = convert(stacked[lowerLevelSelector]).rgb
-
-      const intendedTextColor = convert(findColor(inheritedTextColor, { dynamicVars, staticVars })).rgb
-      const textColor = newTextRule.directives.textAuto === 'no-auto'
-        ? intendedTextColor
-        : getTextColor(
-          convert(stacked[lowerLevelSelector]).rgb,
-          intendedTextColor,
-          newTextRule.directives.textAuto === 'preserve'
-        )
-      const virtualDirectives = computed[lowerLevelSelector].virtualDirectives || {}
-      const virtualDirectivesRaw = computed[lowerLevelSelector].virtualDirectivesRaw || {}
-
-      // Storing color data in lower layer to use as custom css properties
-      virtualDirectives[virtualName] = getTextColorAlpha(newTextRule.directives, textColor, dynamicVars)
-      virtualDirectivesRaw[virtualName] = textColor
-
-      computed[lowerLevelSelector].virtualDirectives = virtualDirectives
-      computed[lowerLevelSelector].virtualDirectivesRaw = virtualDirectivesRaw
-
-      return {
-        dynamicVars,
-        selector: cssSelector.split(/ /g).slice(0, -1).join(' '),
-        ...combination,
-        directives: {},
-        virtualDirectives: {
-          [virtualName]: getTextColorAlpha(newTextRule.directives, textColor, dynamicVars)
-        },
-        virtualDirectivesRaw: {
-          [virtualName]: textColor
-        }
-      }
-    } else {
-      computed[selector] = computed[selector] || {}
-
-      // TODO: DEFAULT TEXT COLOR
-      const lowerLevelStackedBackground = stacked[lowerLevelSelector] || convert(ultimateBackgroundColor).rgb
-
-      if (computedDirectives.background) {
-        let inheritRule = null
-        const variantRules = ruleset.filter(
-          findRules({
-            component: combination.component,
-            variant: combination.variant,
-            parent: combination.parent
-          })
-        )
-        const lastVariantRule = variantRules[variantRules.length - 1]
-        if (lastVariantRule) {
-          inheritRule = lastVariantRule
-        } else {
-          const normalRules = ruleset.filter(findRules({
-            component: combination.component,
-            parent: combination.parent
-          }))
-          const lastNormalRule = normalRules[normalRules.length - 1]
-          inheritRule = lastNormalRule
-        }
-
-        const inheritSelector = ruleToSelector({ ...inheritRule, parent: combination.parent }, true)
-        const inheritedBackground = computed[inheritSelector].background
-
-        dynamicVars.inheritedBackground = inheritedBackground
-
-        const rgb = convert(findColor(computedDirectives.background, { dynamicVars, staticVars })).rgb
-
-        if (!stacked[selector]) {
-          let blend
-          const alpha = computedDirectives.opacity ?? 1
-          if (alpha >= 1) {
-            blend = rgb
-          } else if (alpha <= 0) {
-            blend = lowerLevelStackedBackground
-          } else {
-            blend = alphaBlend(rgb, computedDirectives.opacity, lowerLevelStackedBackground)
-          }
-          stacked[selector] = blend
-          computed[selector].background = { ...rgb, a: computedDirectives.opacity ?? 1 }
-        }
-      }
-
-      if (computedDirectives.shadow) {
-        dynamicVars.shadow = flattenDeep(findShadow(flattenDeep(computedDirectives.shadow), { dynamicVars, staticVars }))
-      }
-
-      if (!stacked[selector]) {
-        computedDirectives.background = 'transparent'
-        computedDirectives.opacity = 0
-        stacked[selector] = lowerLevelStackedBackground
-        computed[selector].background = { ...lowerLevelStackedBackground, a: 0 }
-      }
-
-      dynamicVars.stacked = stacked[selector]
-      dynamicVars.background = computed[selector].background
-
-      const dynamicSlots = Object.entries(computedDirectives).filter(([k, v]) => k.startsWith('--'))
-
-      dynamicSlots.forEach(([k, v]) => {
-        const [type, ...value] = v.split('|').map(x => x.trim()) // woah, Extreme!
-        switch (type) {
-          case 'color': {
-            const color = findColor(value[0], { dynamicVars, staticVars })
-            dynamicVars[k] = color
-            if (combination.component === 'Root') {
-              staticVars[k.substring(2)] = color
-            }
-            break
-          }
-          case 'shadow': {
-            const shadow = value
-            dynamicVars[k] = shadow
-            if (combination.component === 'Root') {
-              staticVars[k.substring(2)] = shadow
-            }
-            break
-          }
-          case 'generic': {
-            dynamicVars[k] = value
-            if (combination.component === 'Root') {
-              staticVars[k.substring(2)] = value
-            }
-            break
-          }
-        }
-      })
-
-      const rule = {
-        dynamicVars,
-        selector: cssSelector,
+      // Inheriting all of the applicable rules
+      const existingRules = ruleset.filter(findRules(combination))
+      const computedDirectives =
+            existingRules
+              .map(r => r.directives)
+              .reduce((acc, directives) => ({ ...acc, ...directives }), {})
+      const computedRule = {
         ...combination,
         directives: computedDirectives
       }
 
-      return rule
+      computed[selector] = computed[selector] || {}
+      computed[selector].computedRule = computedRule
+      computed[selector].dynamicVars = dynamicVars
+
+      // avoid putting more stuff into actual CSS
+      computed[selector].virtualDirectives = {}
+      // but still be able to access it i.e. from --parent
+      computed[selector].virtualDirectivesRaw = computed[lowerLevelSelector]?.virtualDirectivesRaw || {}
+
+      if (virtualComponents.has(combination.component)) {
+        const virtualName = [
+          '--',
+          combination.component.toLowerCase(),
+          combination.variant === 'normal'
+            ? ''
+            : combination.variant[0].toUpperCase() + combination.variant.slice(1).toLowerCase(),
+          ...sortBy(combination.state.filter(x => x !== 'normal')).map(state => state[0].toUpperCase() + state.slice(1).toLowerCase())
+        ].join('')
+
+        let inheritedTextColor = computedDirectives.textColor
+        let inheritedTextAuto = computedDirectives.textAuto
+        let inheritedTextOpacity = computedDirectives.textOpacity
+        let inheritedTextOpacityMode = computedDirectives.textOpacityMode
+        const lowerLevelTextSelector = [...selector.split(/ /g).slice(0, -1), soloSelector].join(' ')
+        const lowerLevelTextRule = computed[lowerLevelTextSelector]
+
+        if (inheritedTextColor == null || inheritedTextOpacity == null || inheritedTextOpacityMode == null) {
+          inheritedTextColor = computedDirectives.textColor ?? lowerLevelTextRule.textColor
+          inheritedTextAuto = computedDirectives.textAuto ?? lowerLevelTextRule.textAuto
+          inheritedTextOpacity = computedDirectives.textOpacity ?? lowerLevelTextRule.textOpacity
+          inheritedTextOpacityMode = computedDirectives.textOpacityMode ?? lowerLevelTextRule.textOpacityMode
+        }
+
+        const newTextRule = {
+          ...computedRule,
+          directives: {
+            ...computedRule.directives,
+            textColor: inheritedTextColor,
+            textAuto: inheritedTextAuto ?? 'preserve',
+            textOpacity: inheritedTextOpacity,
+            textOpacityMode: inheritedTextOpacityMode
+          }
+        }
+
+        dynamicVars.inheritedBackground = lowerLevelBackground
+        dynamicVars.stacked = convert(stacked[lowerLevelSelector]).rgb
+
+        const intendedTextColor = convert(findColor(inheritedTextColor, { dynamicVars, staticVars })).rgb
+        const textColor = newTextRule.directives.textAuto === 'no-auto'
+          ? intendedTextColor
+          : getTextColor(
+            convert(stacked[lowerLevelSelector]).rgb,
+            intendedTextColor,
+            newTextRule.directives.textAuto === 'preserve'
+          )
+        const virtualDirectives = { ...(computed[lowerLevelSelector].virtualDirectives || {}) }
+        const virtualDirectivesRaw = { ...(computed[lowerLevelSelector].virtualDirectivesRaw || {}) }
+
+        // Storing color data in lower layer to use as custom css properties
+        virtualDirectives[virtualName] = getTextColorAlpha(newTextRule.directives, textColor, dynamicVars)
+        virtualDirectivesRaw[virtualName] = textColor
+
+        computed[lowerLevelSelector].virtualDirectives = virtualDirectives
+        computed[lowerLevelSelector].virtualDirectivesRaw = virtualDirectivesRaw
+
+        return {
+          dynamicVars,
+          selector: cssSelector.split(/ /g).slice(0, -1).join(' '),
+          ...combination,
+          directives: {},
+          virtualDirectives,
+          virtualDirectivesRaw
+        }
+      } else {
+        computed[selector] = computed[selector] || {}
+
+        // TODO: DEFAULT TEXT COLOR
+        const lowerLevelStackedBackground = stacked[lowerLevelSelector] || convert(ultimateBackgroundColor).rgb
+
+        if (computedDirectives.background) {
+          let inheritRule = null
+          const variantRules = ruleset.filter(
+            findRules({
+              component: combination.component,
+              variant: combination.variant,
+              parent: combination.parent
+            })
+          )
+          const lastVariantRule = variantRules[variantRules.length - 1]
+          if (lastVariantRule) {
+            inheritRule = lastVariantRule
+          } else {
+            const normalRules = ruleset.filter(findRules({
+              component: combination.component,
+              parent: combination.parent
+            }))
+            const lastNormalRule = normalRules[normalRules.length - 1]
+            inheritRule = lastNormalRule
+          }
+
+          const inheritSelector = ruleToSelector({ ...inheritRule, parent: combination.parent }, true)
+          const inheritedBackground = computed[inheritSelector].background
+
+          dynamicVars.inheritedBackground = inheritedBackground
+
+          const rgb = convert(findColor(computedDirectives.background, { dynamicVars, staticVars })).rgb
+
+          if (!stacked[selector]) {
+            let blend
+            const alpha = computedDirectives.opacity ?? 1
+            if (alpha >= 1) {
+              blend = rgb
+            } else if (alpha <= 0) {
+              blend = lowerLevelStackedBackground
+            } else {
+              blend = alphaBlend(rgb, computedDirectives.opacity, lowerLevelStackedBackground)
+            }
+            stacked[selector] = blend
+            computed[selector].background = { ...rgb, a: computedDirectives.opacity ?? 1 }
+          }
+        }
+
+        if (computedDirectives.shadow) {
+          dynamicVars.shadow = flattenDeep(findShadow(flattenDeep(computedDirectives.shadow), { dynamicVars, staticVars }))
+        }
+
+        if (!stacked[selector]) {
+          computedDirectives.background = 'transparent'
+          computedDirectives.opacity = 0
+          stacked[selector] = lowerLevelStackedBackground
+          computed[selector].background = { ...lowerLevelStackedBackground, a: 0 }
+        }
+
+        dynamicVars.stacked = stacked[selector]
+        dynamicVars.background = computed[selector].background
+
+        const dynamicSlots = Object.entries(computedDirectives).filter(([k]) => k.startsWith('--'))
+
+        dynamicSlots.forEach(([k, v]) => {
+          const [type, value] = v.split('|').map(x => x.trim()) // woah, Extreme!
+          switch (type) {
+            case 'color': {
+              const color = findColor(value, { dynamicVars, staticVars })
+              dynamicVars[k] = color
+              if (combination.component === rootComponentName) {
+                staticVars[k.substring(2)] = color
+              }
+              break
+            }
+            case 'shadow': {
+              const shadow = value.split(/,/g).map(s => s.trim()).filter(x => x)
+              dynamicVars[k] = shadow
+              if (combination.component === rootComponentName) {
+                staticVars[k.substring(2)] = shadow
+              }
+              break
+            }
+            case 'generic': {
+              dynamicVars[k] = value
+              if (combination.component === rootComponentName) {
+                staticVars[k.substring(2)] = value
+              }
+              break
+            }
+          }
+        })
+
+        const rule = {
+          dynamicVars,
+          selector: cssSelector,
+          ...combination,
+          directives: computedDirectives
+        }
+
+        return rule
+      }
+    } catch (e) {
+      const { component, variant, state } = combination
+      throw new Error(`Error processing combination ${component}.${variant}:${state.join(':')}: ${e}`)
     }
   }
 
@@ -443,11 +509,25 @@ export const init = ({
       variants: originalVariants = {}
     } = component
 
-    const validInnerComponents = (
-      liteMode
-        ? (component.validInnerComponentsLite || component.validInnerComponents)
-        : component.validInnerComponents
-    ) || []
+    let validInnerComponents
+    if (editMode) {
+      const temp = (component.validInnerComponentsLite || component.validInnerComponents || [])
+      validInnerComponents = temp
+        .filter(c => virtualComponents.has(c) && !nonEditableComponents.has(c))
+    } else if (liteMode) {
+      validInnerComponents = (component.validInnerComponentsLite || component.validInnerComponents || [])
+    } else if (component.name === 'Root' || component.states != null || component.background?.includes('--parent')) {
+      validInnerComponents = component.validInnerComponents || []
+    } else {
+      validInnerComponents = component
+        .validInnerComponents
+          ?.filter(
+            c => virtualComponents.has(c)
+              || transparentComponents.has(c)
+              || extraCompileComponents.has(c)
+          )
+          || []
+    }
 
     // Normalizing states and variants to always include "normal"
     const states = { normal: '', ...originalStates }
@@ -460,7 +540,7 @@ export const init = ({
 
     // Optimization: we only really need combinations without "normal" because all states implicitly have it
     const permutationStateKeys = Object.keys(states).filter(s => s !== 'normal')
-    const stateCombinations = onlyNormalState
+    const stateCombinations = (onlyNormalState && !virtualComponents.has(component.name))
       ? [
           ['normal']
         ]
@@ -489,7 +569,17 @@ export const init = ({
       combination.component = component.name
       combination.lazy = component.lazy || parent?.lazy
       combination.parent = parent
-      if (combination.state.indexOf('hover') >= 0) {
+      if (!liteMode && combination.state.indexOf('hover') >= 0) {
+        combination.lazy = true
+      }
+
+      if (
+        !liteMode &&
+        parent?.component !== 'Root' &&
+          !virtualComponents.has(component.name) &&
+          !transparentComponents.has(component.name) &&
+          extraCompileComponents.has(component.name)
+      ) {
         combination.lazy = true
       }
 
@@ -538,6 +628,7 @@ export const init = ({
     lazy,
     eager,
     staticVars,
-    engineChecksum
+    engineChecksum,
+    themeChecksum: sum([lazy, eager])
   }
 }
diff --git a/src/services/timeline_fetcher/timeline_fetcher.service.js b/src/services/timeline_fetcher/timeline_fetcher.service.js
index e288f99e4..f64646593 100644
--- a/src/services/timeline_fetcher/timeline_fetcher.service.js
+++ b/src/services/timeline_fetcher/timeline_fetcher.service.js
@@ -2,6 +2,7 @@ import { camelCase } from 'lodash'
 
 import apiService from '../api/api.service.js'
 import { promiseInterval } from '../promise_interval/promise_interval.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
 
 const update = ({ store, statuses, timeline, showImmediately, userId, listId, pagination }) => {
   const ccTimeline = camelCase(timeline)
@@ -53,7 +54,7 @@ const fetchAndUpdate = ({
   args.bookmarkFolderId = bookmarkFolderId
   args.tag = tag
   args.withMuted = !hideMutedPosts
-  if (loggedIn && ['friends', 'public', 'publicAndExternal'].includes(timeline)) {
+  if (loggedIn && ['friends', 'public', 'publicAndExternal', 'bubble'].includes(timeline)) {
     args.replyVisibility = replyVisibility
   }
 
@@ -62,6 +63,10 @@ const fetchAndUpdate = ({
   return apiService.fetchTimeline(args)
     .then(response => {
       if (response.errors) {
+        if (timeline === 'favorites') {
+          rootState.instance.pleromaPublicFavouritesAvailable = false
+          return
+        }
         throw new Error(`${response.status} ${response.statusText}`)
       }
 
@@ -73,7 +78,7 @@ const fetchAndUpdate = ({
       return { statuses, pagination }
     })
     .catch((error) => {
-      store.dispatch('pushGlobalNotice', {
+      useInterfaceStore().pushGlobalNotice({
         level: 'error',
         messageKey: 'timeline.error',
         messageArgs: [error.message],
diff --git a/src/services/user_highlighter/user_highlighter.js b/src/services/user_highlighter/user_highlighter.js
index b5f580405..244c5b2ff 100644
--- a/src/services/user_highlighter/user_highlighter.js
+++ b/src/services/user_highlighter/user_highlighter.js
@@ -46,7 +46,7 @@ const highlightStyle = (prefs) => {
 
 const highlightClass = (user) => {
   return 'USER____' + user.screen_name
-    .replace(/\./g, '_')
+    ?.replace(/\./g, '_')
     .replace(/@/g, '_AT_')
 }
 
diff --git a/src/services/version/version.service.js b/src/services/version/version.service.js
deleted file mode 100644
index 2e11bf3a1..000000000
--- a/src/services/version/version.service.js
+++ /dev/null
@@ -1,6 +0,0 @@
-
-export const extractCommit = versionString => {
-  const regex = /-g(\w+)/i
-  const matches = versionString.match(regex)
-  return matches ? matches[1] : ''
-}
diff --git a/src/services/window_utils/window_utils.js b/src/services/window_utils/window_utils.js
index 909088dbc..c33785363 100644
--- a/src/services/window_utils/window_utils.js
+++ b/src/services/window_utils/window_utils.js
@@ -1,4 +1,3 @@
-
 export const windowWidth = () =>
   window.innerWidth ||
   document.documentElement.clientWidth ||
diff --git a/src/stores/announcements.js b/src/stores/announcements.js
new file mode 100644
index 000000000..5ee279835
--- /dev/null
+++ b/src/stores/announcements.js
@@ -0,0 +1,115 @@
+import { defineStore } from 'pinia'
+
+const FETCH_ANNOUNCEMENT_INTERVAL_MS = 1000 * 60 * 5
+
+export const useAnnouncementsStore = defineStore('announcements', {
+  state: () => ({
+    announcements: [],
+    supportsAnnouncements: true,
+    fetchAnnouncementsTimer: undefined
+  }),
+  getters: {
+    unreadAnnouncementCount () {
+      if (!window.vuex.state.users.currentUser) {
+        return 0
+      }
+
+      const unread = this.announcements.filter(announcement => !(announcement.inactive || announcement.read))
+      return unread.length
+    }
+  },
+  actions: {
+    fetchAnnouncements () {
+      if (!this.supportsAnnouncements) {
+        return Promise.resolve()
+      }
+
+      const currentUser = window.vuex.state.users.currentUser
+      const isAdmin = currentUser && currentUser.privileges.includes('announcements_manage_announcements')
+
+      const getAnnouncements = async () => {
+        if (!isAdmin) {
+          return window.vuex.state.api.backendInteractor.fetchAnnouncements()
+        }
+
+        const all = await window.vuex.state.api.backendInteractor.adminFetchAnnouncements()
+        const visible = await window.vuex.state.api.backendInteractor.fetchAnnouncements()
+        const visibleObject = visible.reduce((a, c) => {
+          a[c.id] = c
+          return a
+        }, {})
+        const getWithinVisible = announcement => visibleObject[announcement.id]
+
+        all.forEach(announcement => {
+          const visibleAnnouncement = getWithinVisible(announcement)
+          if (!visibleAnnouncement) {
+            announcement.inactive = true
+          } else {
+            announcement.read = visibleAnnouncement.read
+          }
+        })
+
+        return all
+      }
+
+      return getAnnouncements()
+        .then(announcements => {
+          this.announcements = announcements
+        })
+        .catch(error => {
+          // If and only if backend does not support announcements, it would return 404.
+          // In this case, silently ignores it.
+          if (error && error.statusCode === 404) {
+            this.supportsAnnouncements = false
+          } else {
+            throw error
+          }
+        })
+    },
+    markAnnouncementAsRead (id) {
+      return window.vuex.state.api.backendInteractor.dismissAnnouncement({ id })
+        .then(() => {
+          const index = this.announcements.findIndex(a => a.id === id)
+
+          if (index < 0) {
+            return
+          }
+
+          this.announcements[index].read = true
+        })
+    },
+    startFetchingAnnouncements () {
+      if (this.fetchAnnouncementsTimer) {
+        return
+      }
+
+      const interval = setInterval(() => this.fetchAnnouncements(), FETCH_ANNOUNCEMENT_INTERVAL_MS)
+      this.fetchAnnouncementsTimer = interval
+
+      return this.fetchAnnouncements()
+    },
+    stopFetchingAnnouncements () {
+      const interval = this.fetchAnnouncementsTimer
+      this.fetchAnnouncementsTimer = undefined
+      clearInterval(interval)
+    },
+    postAnnouncement ({ content, startsAt, endsAt, allDay }) {
+      return window.vuex.state.api.backendInteractor.postAnnouncement({ content, startsAt, endsAt, allDay })
+        .then(() => {
+          return this.fetchAnnouncements()
+        })
+    },
+    editAnnouncement ({ id, content, startsAt, endsAt, allDay }) {
+      return window.vuex.state.api.backendInteractor.editAnnouncement({ id, content, startsAt, endsAt, allDay })
+        .then(() => {
+          return this.fetchAnnouncements()
+        })
+    },
+    deleteAnnouncement (id) {
+      return window.vuex.state.api.backendInteractor.deleteAnnouncement({ id })
+        .then(() => {
+          return this.fetchAnnouncements()
+        })
+    }
+  }
+})
diff --git a/src/stores/auth_flow.js b/src/stores/auth_flow.js
new file mode 100644
index 000000000..e41a9bc5e
--- /dev/null
+++ b/src/stores/auth_flow.js
@@ -0,0 +1,69 @@
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { defineStore } from 'pinia'
+
+const PASSWORD_STRATEGY = 'password'
+const TOKEN_STRATEGY = 'token'
+
+// MFA strategies
+const TOTP_STRATEGY = 'totp'
+const RECOVERY_STRATEGY = 'recovery'
+
+export const useAuthFlowStore = defineStore('authFlow', {
+  // initial state
+  state: () => ({
+    settings: {},
+    strategy: PASSWORD_STRATEGY,
+    initStrategy: PASSWORD_STRATEGY // default strategy from config
+  }),
+  // getters
+  getters: {
+    requiredPassword: (state) => {
+      return state.strategy === PASSWORD_STRATEGY
+    },
+    requiredToken: (state) => {
+      return state.strategy === TOKEN_STRATEGY
+    },
+    requiredTOTP: (state) => {
+      return state.strategy === TOTP_STRATEGY
+    },
+    requiredRecovery: (state) => {
+      return state.strategy === RECOVERY_STRATEGY
+    },
+  },
+  actions: {
+    setInitialStrategy (strategy) {
+      if (strategy) {
+        this.initStrategy = strategy
+        this.strategy = strategy
+      }
+    },
+    requirePassword () {
+      this.strategy = PASSWORD_STRATEGY
+    },
+    requireToken () {
+      this.strategy = TOKEN_STRATEGY
+    },
+    requireMFA ({ settings }) {
+      this.settings = settings
+      this.strategy = TOTP_STRATEGY // default strategy of MFA
+    },
+    requireRecovery () {
+      this.strategy = RECOVERY_STRATEGY
+    },
+    requireTOTP () {
+      this.strategy = TOTP_STRATEGY
+    },
+    abortMFA () {
+      this.resetState()
+    },
+    resetState () {
+      this.strategy = this.initStrategy
+      this.settings = {}
+    },
+    async login ({ access_token: accessToken }) {
+      useOAuthStore().setToken(accessToken)
+      await window.vuex.dispatch('loginUser', accessToken, { root: true })
+      this.resetState()
+    }
+  }
+})
\ No newline at end of file
diff --git a/src/stores/bookmark_folders.js b/src/stores/bookmark_folders.js
new file mode 100644
index 000000000..79f373b0a
--- /dev/null
+++ b/src/stores/bookmark_folders.js
@@ -0,0 +1,51 @@
+import { remove, find } from 'lodash'
+import { defineStore } from 'pinia'
+
+export const useBookmarkFoldersStore = defineStore('bookmarkFolders', {
+  state: () => ({
+    allFolders: []
+  }),
+  getters: {
+    findBookmarkFolderName () {
+      return (id) => {
+        const folder = this.allFolders.find(folder => folder.id === id)
+  
+        if (!folder) return
+        return folder.name
+      }
+    }
+  },
+  actions: {
+    setBookmarkFolders (value) {
+      this.allFolders = value
+    },
+    setBookmarkFolder ({ id, name, emoji, emoji_url: emojiUrl }) {
+      const entry = find(this.allFolders, { id })
+      if (!entry) {
+        this.allFolders.push({ id, name, emoji, emoji_url: emojiUrl })
+      } else {
+        entry.name = name
+        entry.emoji = emoji
+        entry.emoji_url = emojiUrl
+      }
+    },
+    createBookmarkFolder ({ name, emoji }) {
+      return window.vuex.state.api.backendInteractor.createBookmarkFolder({ name, emoji })
+        .then((folder) => {
+          this.setBookmarkFolder(folder)
+          return folder
+        })
+    },
+    updateBookmarkFolder ({ folderId, name, emoji }) {
+      return window.vuex.state.api.backendInteractor.updateBookmarkFolder({ folderId, name, emoji })
+        .then((folder) => {
+          this.setBookmarkFolder(folder)
+          return folder
+        })
+    },
+    deleteBookmarkFolder ({ folderId }) {
+      window.vuex.state.api.backendInteractor.deleteBookmarkFolder({ folderId })
+      remove(this.allFolders, folder => folder.id === folderId)
+    }
+  }
+})
diff --git a/src/stores/editStatus.js b/src/stores/editStatus.js
new file mode 100644
index 000000000..9ead99192
--- /dev/null
+++ b/src/stores/editStatus.js
@@ -0,0 +1,17 @@
+import { defineStore } from 'pinia'
+
+export const useEditStatusStore = defineStore('editStatus', {
+  state: () => ({
+    params: null,
+    modalActivated: false
+  }),
+  actions: {
+    openEditStatusModal (params) {
+      this.params = params
+      this.modalActivated = true
+    },
+    closeEditStatusModal () {
+      this.modalActivated = false
+    }
+  }
+})
diff --git a/src/stores/i18n.js b/src/stores/i18n.js
new file mode 100644
index 000000000..d038b30a4
--- /dev/null
+++ b/src/stores/i18n.js
@@ -0,0 +1,14 @@
+import { defineStore } from 'pinia'
+
+export const useI18nStore = defineStore('i18n', {
+  state: () => ({
+    i18n: null
+  }),
+  actions: {
+    setI18n (newI18n) {
+      this.$patch({
+        i18n: newI18n.global
+      })
+    }
+  }
+})
diff --git a/src/stores/interface.js b/src/stores/interface.js
new file mode 100644
index 000000000..51ed42f65
--- /dev/null
+++ b/src/stores/interface.js
@@ -0,0 +1,700 @@
+import { defineStore } from 'pinia'
+
+import { CURRENT_VERSION, generatePreset } from 'src/services/theme_data/theme_data.service.js'
+import { getResourcesIndex, applyTheme, tryLoadCache } from '../services/style_setter/style_setter.js'
+import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
+import { deserialize } from '../services/theme_data/iss_deserializer.js'
+
+export const useInterfaceStore = defineStore('interface', {
+  state: () => ({
+    localFonts: null,
+    themeApplied: false,
+    themeChangeInProgress: false,
+    themeVersion: 'v3',
+    styleNameUsed: null,
+    styleDataUsed: null,
+    useStylePalette: false, // hack for applying styles from appearance tab
+    paletteNameUsed: null,
+    paletteDataUsed: null,
+    themeNameUsed: null,
+    themeDataUsed: null,
+    temporaryChangesTimeoutId: null,
+    temporaryChangesCountdown: -1,     // used for temporary options that revert after a timeout
+    temporaryChangesConfirm: () => {}, // used for applying temporary options
+    temporaryChangesRevert: () => {},  // used for reverting temporary options
+    settingsModalState: 'hidden',
+    settingsModalLoadedUser: false,
+    settingsModalLoadedAdmin: false,
+    settingsModalTargetTab: null,
+    settingsModalMode: 'user',
+    settings: {
+      currentSaveStateNotice: null,
+      noticeClearTimeout: null,
+      notificationPermission: null
+    },
+    browserSupport: {
+      cssFilter: window.CSS && window.CSS.supports && (
+        window.CSS.supports('filter', 'drop-shadow(0 0)') ||
+        window.CSS.supports('-webkit-filter', 'drop-shadow(0 0)')
+      ),
+      localFonts: typeof window.queryLocalFonts === 'function'
+    },
+    layoutType: 'normal',
+    globalNotices: [],
+    layoutHeight: 0,
+    lastTimeline: null
+  }),
+  actions: {
+    setTemporaryChanges ({ confirm, revert }) {
+      this.temporaryChangesCountdown = 10
+      this.temporaryChangesConfirm = confirm
+      this.temporaryChangesRevert = revert
+      const countdownFunc = () => {
+        if (this.temporaryChangesCountdown === 1) {
+          this.temporaryChangesRevert()
+          this.clearTemporaryChanges()
+        } else {
+          this.temporaryChangesCountdown--
+          this.temporaryChangesTimeoutId = setTimeout(countdownFunc, 1000)
+        }
+      }
+      this.temporaryChangesTimeoutId = setTimeout(countdownFunc, 1000)
+    },
+    clearTemporaryChanges () {
+      this.temporaryChangesTimeoutId ?? clearTimeout(this.temporaryChangesTimeoutId)
+      this.temporaryChangesTimeoutId = null
+      this.temporaryChangesCountdown = -1
+      this.temporaryChangesConfirm = () => {}
+      this.temporaryChangesRevert = () => {}
+    },
+    setPageTitle (option = '') {
+      try {
+        document.title = `${option} ${window.vuex.state.instance.name}`
+      } catch (error) {
+        console.error(`${error}`)
+      }
+    },
+    settingsSaved ({ success, error }) {
+      if (success) {
+        if (this.noticeClearTimeout) {
+          clearTimeout(this.noticeClearTimeout)
+        }
+        this.settings.currentSaveStateNotice = { error: false, data: success }
+        this.settings.noticeClearTimeout = setTimeout(() => delete this.settings.currentSaveStateNotice, 2000)
+      } else {
+        this.settings.currentSaveStateNotice = { error: true, errorData: error }
+      }
+    },
+    setNotificationPermission (permission) {
+      this.notificationPermission = permission
+    },
+    closeSettingsModal () {
+      this.settingsModalState = 'hidden'
+    },
+    openSettingsModal (value) {
+      this.settingsModalMode = value
+      this.settingsModalState = 'visible'
+      if (value === 'user') {
+        if (!this.settingsModalLoadedUser) {
+          this.settingsModalLoadedUser = true
+        }
+      } else if (value === 'admin') {
+        if (!this.settingsModalLoadedAdmin) {
+          this.settingsModalLoadedAdmin = true
+        }
+      }
+    },
+    togglePeekSettingsModal () {
+      switch (this.settingsModalState) {
+        case 'minimized':
+          this.settingsModalState = 'visible'
+          return
+        case 'visible':
+          this.settingsModalState = 'minimized'
+          return
+        default:
+          throw new Error('Illegal minimization state of settings modal')
+      }
+    },
+    clearSettingsModalTargetTab () {
+      this.settingsModalTargetTab = null
+    },
+    openSettingsModalTab (value, mode = 'user') {
+      this.settingsModalTargetTab = value
+      this.openSettingsModal(mode)
+    },
+    removeGlobalNotice (notice) {
+      this.globalNotices = this.globalNotices.filter(n => n !== notice)
+    },
+    pushGlobalNotice (
+      {
+        messageKey,
+        messageArgs = {},
+        level = 'error',
+        timeout = 0
+      }) {
+      const notice = {
+        messageKey,
+        messageArgs,
+        level
+      }
+
+      this.globalNotices.push(notice)
+
+      // Adding a new element to array wraps it in a Proxy, which breaks the comparison
+      // TODO: Generate UUID or something instead or relying on !== operator?
+      const newNotice = this.globalNotices[this.globalNotices.length - 1]
+      if (timeout) {
+        setTimeout(() => this.removeGlobalNotice(newNotice), timeout)
+      }
+
+      return newNotice
+    },
+    setLayoutHeight (value) {
+      this.layoutHeight = value
+    },
+    setLayoutWidth (value) {
+      let width = value
+      if (value !== undefined) {
+        this.layoutWidth = value
+      } else {
+        width = this.layoutWidth
+      }
+
+      const mobileLayout = width <= 800
+      const normalOrMobile = mobileLayout ? 'mobile' : 'normal'
+      const { thirdColumnMode } = window.vuex.getters.mergedConfig
+      if (thirdColumnMode === 'none' || !window.vuex.state.users.currentUser) {
+        this.layoutType = normalOrMobile
+      } else {
+        const wideLayout = width >= 1300
+        this.layoutType = wideLayout ? 'wide' : normalOrMobile
+      }
+    },
+    setFontsList (value) {
+      this.localFonts = [...(new Set(value.map(font => font.family))).values()]
+    },
+    queryLocalFonts () {
+      if (this.localFonts !== null) return
+      this.setFontsList([])
+
+      if (!this.browserSupport.localFonts) {
+        return
+      }
+      window
+        .queryLocalFonts()
+        .then((fonts) => {
+          this.setFontsList(fonts)
+        })
+        .catch((e) => {
+          this.pushGlobalNotice({
+            messageKey: 'settings.style.themes3.font.font_list_unavailable',
+            messageArgs: {
+              error: e
+            },
+            level: 'error'
+          })
+        })
+    },
+    setLastTimeline (value) {
+      this.lastTimeline = value
+    },
+    async fetchPalettesIndex () {
+      try {
+        const value = await getResourcesIndex('/static/palettes/index.json')
+        window.vuex.commit('setInstanceOption', { name: 'palettesIndex', value })
+        return value
+      } catch (e) {
+        console.error('Could not fetch palettes index', e)
+        window.vuex.commit('setInstanceOption', { name: 'palettesIndex', value: { _error: e } })
+        return Promise.resolve({})
+      }
+    },
+    setPalette (value) {
+      this.resetThemeV3Palette()
+      this.resetThemeV2()
+
+      window.vuex.commit('setOption', { name: 'palette', value })
+
+      this.applyTheme({ recompile: true })
+    },
+    setPaletteCustom (value) {
+      this.resetThemeV3Palette()
+      this.resetThemeV2()
+
+      window.vuex.commit('setOption', { name: 'paletteCustomData', value })
+
+      this.applyTheme({ recompile: true })
+    },
+    async fetchStylesIndex () {
+      try {
+        const value = await getResourcesIndex(
+          '/static/styles/index.json',
+          deserialize
+        )
+        window.vuex.commit('setInstanceOption', { name: 'stylesIndex', value })
+        return value
+      } catch (e) {
+        console.error('Could not fetch styles index', e)
+        window.vuex.commit('setInstanceOption', { name: 'stylesIndex', value: { _error: e } })
+        return Promise.resolve({})
+      }
+    },
+    setStyle (value) {
+      this.resetThemeV3()
+      this.resetThemeV2()
+      this.resetThemeV3Palette()
+
+      window.vuex.commit('setOption', { name: 'style', value })
+      this.useStylePalette = true
+
+      this.applyTheme({ recompile: true }).then(() => {
+        this.useStylePalette = false
+      })
+    },
+    setStyleCustom (value) {
+      this.resetThemeV3()
+      this.resetThemeV2()
+      this.resetThemeV3Palette()
+
+      window.vuex.commit('setOption', { name: 'styleCustomData', value })
+
+      this.useStylePalette = true
+      this.applyTheme({ recompile: true }).then(() => {
+        this.useStylePalette = false
+      })
+    },
+    async fetchThemesIndex () {
+      try {
+        const value = await getResourcesIndex('/static/styles.json')
+        window.vuex.commit('setInstanceOption', { name: 'themesIndex', value })
+        return value
+      } catch (e) {
+        console.error('Could not fetch themes index', e)
+        window.vuex.commit('setInstanceOption', { name: 'themesIndex', value: { _error: e } })
+        return Promise.resolve({})
+      }
+    },
+    setTheme (value) {
+      this.resetThemeV3()
+      this.resetThemeV3Palette()
+      this.resetThemeV2()
+
+      window.vuex.commit('setOption', { name: 'theme', value })
+
+      this.applyTheme({ recompile: true })
+    },
+    setThemeCustom (value) {
+      this.resetThemeV3()
+      this.resetThemeV3Palette()
+      this.resetThemeV2()
+
+      window.vuex.commit('setOption', { name: 'customTheme', value })
+      window.vuex.commit('setOption', { name: 'customThemeSource', value })
+
+      this.applyTheme({ recompile: true })
+    },
+    resetThemeV3 () {
+      window.vuex.commit('setOption', { name: 'style', value: null })
+      window.vuex.commit('setOption', { name: 'styleCustomData', value: null })
+    },
+    resetThemeV3Palette () {
+      window.vuex.commit('setOption', { name: 'palette', value: null })
+      window.vuex.commit('setOption', { name: 'paletteCustomData', value: null })
+    },
+    resetThemeV2 () {
+      window.vuex.commit('setOption', { name: 'theme', value: null })
+      window.vuex.commit('setOption', { name: 'customTheme', value: null })
+      window.vuex.commit('setOption', { name: 'customThemeSource', value: null })
+    },
+    async getThemeData () {
+      const getData = async (resource, index, customData, name) => {
+        const capitalizedResource = resource[0].toUpperCase() + resource.slice(1)
+        const result = {}
+
+        if (customData) {
+          result.nameUsed = 'custom' // custom data overrides name
+          result.dataUsed = customData
+        } else {
+          result.nameUsed = name
+
+          if (result.nameUsed == null) {
+            result.dataUsed = null
+            return result
+          }
+
+          let fetchFunc = index[result.nameUsed]
+          // Fallbacks
+          if (!fetchFunc) {
+            if (resource === 'style' || resource === 'palette') {
+              return result
+            }
+            const newName = Object.keys(index)[0]
+            fetchFunc = index[newName]
+            console.warn(`${capitalizedResource} with id '${this.styleNameUsed}' not found, trying back to '${newName}'`)
+            if (!fetchFunc) {
+              console.warn(`${capitalizedResource} doesn't have a fallback, defaulting to stock.`)
+              fetchFunc = () => Promise.resolve(null)
+            }
+          }
+          result.dataUsed = await fetchFunc()
+        }
+        return result
+      }
+
+      const {
+        style: instanceStyleName,
+        palette: instancePaletteName
+      } = window.vuex.state.instance
+
+      let {
+        theme: instanceThemeV2Name,
+        themesIndex,
+        stylesIndex,
+        palettesIndex
+      } = window.vuex.state.instance
+
+      const {
+        style: userStyleName,
+        styleCustomData: userStyleCustomData,
+        palette: userPaletteName,
+        paletteCustomData: userPaletteCustomData
+      } = window.vuex.state.config
+
+      let {
+        theme: userThemeV2Name,
+        customTheme: userThemeV2Snapshot,
+        customThemeSource: userThemeV2Source
+      } = window.vuex.state.config
+
+      let majorVersionUsed
+
+      console.debug(
+        `User V3 palette: ${userPaletteName}, style: ${userStyleName} , custom: ${!!userStyleCustomData}`
+      )
+      console.debug(
+        `User V2 name: ${userThemeV2Name}, source: ${!!userThemeV2Source}, snapshot: ${!!userThemeV2Snapshot}`
+      )
+
+      console.debug(`Instance V3 palette: ${instancePaletteName}, style: ${instanceStyleName}`)
+      console.debug('Instance V2 theme: ' + instanceThemeV2Name)
+
+      if (userPaletteName || userPaletteCustomData ||
+          userStyleName || userStyleCustomData ||
+          (
+            // User V2 overrides instance V3
+            (instancePaletteName ||
+             instanceStyleName) &&
+              instanceThemeV2Name == null &&
+              userThemeV2Name == null
+          )
+      ) {
+        // Palette and/or style overrides V2 themes
+        instanceThemeV2Name = null
+        userThemeV2Name = null
+        userThemeV2Source = null
+        userThemeV2Snapshot = null
+
+        majorVersionUsed = 'v3'
+      } else if (
+        (userThemeV2Name ||
+          userThemeV2Snapshot ||
+          userThemeV2Source ||
+         instanceThemeV2Name)
+      ) {
+        majorVersionUsed = 'v2'
+      } else {
+        // if all fails fallback to v3
+        majorVersionUsed = 'v3'
+      }
+
+      if (majorVersionUsed === 'v3') {
+        const result = await Promise.all([
+          this.fetchPalettesIndex(),
+          this.fetchStylesIndex()
+        ])
+
+        palettesIndex = result[0]
+        stylesIndex = result[1]
+      } else {
+        // Promise.all just to be uniform with v3
+        const result = await Promise.all([
+          this.fetchThemesIndex()
+        ])
+
+        themesIndex = result[0]
+      }
+
+      this.themeVersion = majorVersionUsed
+
+      console.debug('Version used', majorVersionUsed)
+
+      if (majorVersionUsed === 'v3') {
+        this.themeDataUsed = null
+        this.themeNameUsed = null
+
+        const style = await getData(
+          'style',
+          stylesIndex,
+          userStyleCustomData,
+          userStyleName || instanceStyleName
+        )
+        this.styleNameUsed = style.nameUsed
+        this.styleDataUsed = style.dataUsed
+
+        let firstStylePaletteName = null
+        style
+          .dataUsed
+          ?.filter(x => x.component === '@palette')
+          .map(x => {
+            const cleanDirectives = Object.fromEntries(
+              Object
+                .entries(x.directives)
+                .filter(([k]) => k)
+            )
+
+            return { name: x.variant, ...cleanDirectives }
+          })
+          .forEach(palette => {
+            const key = 'style.' + palette.name.toLowerCase().replace(/ /g, '_')
+            if (!firstStylePaletteName) firstStylePaletteName = key
+            palettesIndex[key] = () => Promise.resolve(palette)
+          })
+
+        const palette = await getData(
+          'palette',
+          palettesIndex,
+          userPaletteCustomData,
+          this.useStylePalette ? firstStylePaletteName : (userPaletteName || instancePaletteName)
+        )
+
+        if (this.useStylePalette) {
+          window.vuex.commit('setOption', { name: 'palette', value: firstStylePaletteName })
+        }
+
+        this.paletteNameUsed = palette.nameUsed
+        this.paletteDataUsed = palette.dataUsed
+
+        if (this.paletteDataUsed) {
+          this.paletteDataUsed.link = this.paletteDataUsed.link || this.paletteDataUsed.accent
+          this.paletteDataUsed.accent = this.paletteDataUsed.accent || this.paletteDataUsed.link
+        }
+        if (Array.isArray(this.paletteDataUsed)) {
+          const [
+            name,
+            bg,
+            fg,
+            text,
+            link,
+            cRed = '#FF0000',
+            cGreen = '#00FF00',
+            cBlue = '#0000FF',
+            cOrange = '#E3FF00'
+          ] = palette.dataUsed
+          this.paletteDataUsed = {
+            name,
+            bg,
+            fg,
+            text,
+            link,
+            accent: link,
+            cRed,
+            cBlue,
+            cGreen,
+            cOrange
+          }
+        }
+        console.debug('Palette data used', palette.dataUsed)
+      } else {
+        this.styleNameUsed = null
+        this.styleDataUsed = null
+        this.paletteNameUsed = null
+        this.paletteDataUsed = null
+
+        const theme = await getData(
+          'theme',
+          themesIndex,
+          userThemeV2Source || userThemeV2Snapshot,
+          userThemeV2Name || instanceThemeV2Name
+        )
+        this.themeNameUsed = theme.nameUsed
+        this.themeDataUsed = theme.dataUsed
+      }
+    },
+    async setThemeApplied () {
+      this.themeApplied = true
+    },
+    async applyTheme (
+      { recompile = false } = {}
+    ) {
+      console.log('Apply')
+      const {
+        forceThemeRecompilation,
+        themeDebug,
+        theme3hacks
+      } = window.vuex.state.config
+      this.themeChangeInProgress = true
+      // If we're not forced to recompile try using
+      // cache (tryLoadCache return true if load successful)
+
+      const forceRecompile = forceThemeRecompilation || recompile
+
+      await this.getThemeData()
+
+      if (!forceRecompile && !themeDebug && await tryLoadCache()) {
+        this.themeChangeInProgress = false
+        return this.setThemeApplied()
+      }
+      window.splashUpdate('splash.theme')
+
+      try {
+        const paletteIss = (() => {
+          if (!this.paletteDataUsed) return null
+          const result = {
+            component: 'Root',
+            directives: {}
+          }
+
+          Object
+            .entries(this.paletteDataUsed)
+            .filter(([k]) => k !== 'name')
+            .forEach(([k, v]) => {
+              let issRootDirectiveName
+              switch (k) {
+                case 'background':
+                  issRootDirectiveName = 'bg'
+                  break
+                case 'foreground':
+                  issRootDirectiveName = 'fg'
+                  break
+                default:
+                  issRootDirectiveName = k
+              }
+              result.directives['--' + issRootDirectiveName] = 'color | ' + v
+            })
+          return result
+        })()
+
+        const theme2ruleset = this.themeDataUsed && convertTheme2To3(normalizeThemeData(this.themeDataUsed))
+        const hacks = []
+
+        Object.entries(theme3hacks).forEach(([key, value]) => {
+          switch (key) {
+            case 'fonts': {
+              Object.entries(theme3hacks.fonts).forEach(([fontKey, font]) => {
+                if (!font?.family) return
+                switch (fontKey) {
+                  case 'interface':
+                    hacks.push({
+                      component: 'Root',
+                      directives: {
+                        '--font': 'generic | ' + font.family
+                      }
+                    })
+                    break
+                  case 'input':
+                    hacks.push({
+                      component: 'Input',
+                      directives: {
+                        '--font': 'generic | ' + font.family
+                      }
+                    })
+                    break
+                  case 'post':
+                    hacks.push({
+                      component: 'RichContent',
+                      directives: {
+                        '--font': 'generic | ' + font.family
+                      }
+                    })
+                    break
+                  case 'monospace':
+                    hacks.push({
+                      component: 'Root',
+                      directives: {
+                        '--monoFont': 'generic | ' + font.family
+                      }
+                    })
+                    break
+                }
+              })
+              break
+            }
+            case 'underlay': {
+              if (value !== 'none') {
+                const newRule = {
+                  component: 'Underlay',
+                  directives: {}
+                }
+                if (value === 'opaque') {
+                  newRule.directives.opacity = 1
+                  newRule.directives.background = '--wallpaper'
+                }
+                if (value === 'transparent') {
+                  newRule.directives.opacity = 0
+                }
+                hacks.push(newRule)
+              }
+              break
+            }
+          }
+        })
+
+        const rulesetArray = [
+          theme2ruleset,
+          this.styleDataUsed,
+          paletteIss,
+          hacks
+        ].filter(x => x)
+
+        return applyTheme(
+          rulesetArray.flat(),
+          () => this.setThemeApplied(),
+          () => {
+            this.themeChangeInProgress = false
+          },
+          themeDebug
+        )
+      } catch (e) {
+        window.splashError(e)
+      }
+    }
+  }
+})
+
+export const normalizeThemeData = (input) => {
+  let themeData, themeSource
+
+  if (input.themeFileVerison === 1) {
+    // this might not be even used at all, some leftover of unimplemented code in V2 editor
+    return generatePreset(input).theme
+  } else if (
+    Object.prototype.hasOwnProperty.call(input, '_pleroma_theme_version') ||
+      Object.prototype.hasOwnProperty.call(input, 'source') ||
+      Object.prototype.hasOwnProperty.call(input, 'theme')
+  ) {
+    // We got passed a full theme file
+    themeData = input.theme
+    themeSource = input.source
+  } else if (
+    Object.prototype.hasOwnProperty.call(input, 'themeEngineVersion') ||
+      Object.prototype.hasOwnProperty.call(input, 'colors')
+  ) {
+    // We got passed a source/snapshot
+    themeData = input
+    themeSource = input
+  }
+  // New theme presets don't have 'theme' property, they use 'source'
+
+  let out // shout, shout let it all out
+  if (themeSource && themeSource.themeEngineVersion === CURRENT_VERSION) {
+    // There are some themes in wild that have completely broken source
+    out = { ...(themeData || {}), ...themeSource }
+  } else {
+    out = themeData
+  }
+
+  // generatePreset here basically creates/updates "snapshot",
+  // while also fixing the 2.2 -> 2.3 colors/shadows/etc
+  return generatePreset(out).theme
+}
diff --git a/src/stores/lists.js b/src/stores/lists.js
new file mode 100644
index 000000000..fbe2746fb
--- /dev/null
+++ b/src/stores/lists.js
@@ -0,0 +1,110 @@
+import { defineStore } from 'pinia'
+
+import { remove, find } from 'lodash'
+
+export const useListsStore = defineStore('lists', {
+  state: () => ({
+    allLists: [],
+    allListsObject: {}
+  }),
+  getters: {
+    findListTitle () {
+      return (id) => {
+        if (!this.allListsObject[id]) return
+        return this.allListsObject[id].title
+      }
+    },
+    findListAccounts () {
+      return (id) => [...this.allListsObject[id].accountIds]
+    }
+  },
+  actions: {
+    setLists (value) {
+      this.allLists = value
+    },
+    createList ({ title }) {
+      return window.vuex.state.api.backendInteractor.createList({ title })
+        .then((list) => {
+          this.setList({ listId: list.id, title })
+          return list
+        })
+    },
+    fetchList ({ listId }) {
+      return window.vuex.state.api.backendInteractor.getList({ listId })
+        .then((list) => this.setList({ listId: list.id, title: list.title }))
+    },
+    fetchListAccounts ({ listId }) {
+      return window.vuex.state.api.backendInteractor.getListAccounts({ listId })
+        .then((accountIds) => {
+          if (!this.allListsObject[listId]) {
+            this.allListsObject[listId] = { accountIds: [] }
+          }
+          this.allListsObject[listId].accountIds = accountIds
+        })
+    },
+    setList ({ listId, title }) {
+      if (!this.allListsObject[listId]) {
+        this.allListsObject[listId] = { accountIds: [] }
+      }
+      this.allListsObject[listId].title = title
+
+      const entry = find(this.allLists, { id: listId })
+      if (!entry) {
+        this.allLists.push({ id: listId, title })
+      } else {
+        entry.title = title
+      }
+    },
+    setListAccounts ({ listId, accountIds }) {
+      const saved = this.allListsObject[listId]?.accountIds || []
+      const added = accountIds.filter(id => !saved.includes(id))
+      const removed = saved.filter(id => !accountIds.includes(id))
+      if (!this.allListsObject[listId]) {
+        this.allListsObject[listId] = { accountIds: [] }
+      }
+      this.allListsObject[listId].accountIds = accountIds
+      if (added.length > 0) {
+        window.vuex.state.api.backendInteractor.addAccountsToList({ listId, accountIds: added })
+      }
+      if (removed.length > 0) {
+        window.vuex.state.api.backendInteractor.removeAccountsFromList({ listId, accountIds: removed })
+      }
+    },
+    addListAccount ({ listId, accountId }) {
+      return window.vuex.state
+        .api
+        .backendInteractor
+        .addAccountsToList({ listId, accountIds: [accountId] })
+        .then((result) => {
+          if (!this.allListsObject[listId]) {
+            this.allListsObject[listId] = { accountIds: [] }
+          }
+          this.allListsObject[listId].accountIds.push(accountId)
+          return result
+        })
+    },
+    removeListAccount ({ listId, accountId }) {
+      return window.vuex.state
+        .api
+        .backendInteractor
+        .removeAccountsFromList({ listId, accountIds: [accountId] })
+        .then((result) => {
+          if (!this.allListsObject[listId]) {
+            this.allListsObject[listId] = { accountIds: [] }
+          }
+          const { accountIds } = this.allListsObject[listId]
+          const set = new Set(accountIds)
+          set.delete(accountId)
+          this.allListsObject[listId].accountIds = [...set]
+
+          return result
+        })
+    },
+    deleteList ({ listId }) {
+      window.vuex.state.api.backendInteractor.deleteList({ listId })
+
+      delete this.allListsObject[listId]
+      remove(this.allLists, list => list.id === listId)
+    }
+  }
+})
diff --git a/src/stores/media_viewer.js b/src/stores/media_viewer.js
new file mode 100644
index 000000000..0e0e18289
--- /dev/null
+++ b/src/stores/media_viewer.js
@@ -0,0 +1,30 @@
+import { defineStore } from 'pinia'
+import fileTypeService from '../services/file_type/file_type.service.js'
+
+const supportedTypes = new Set(['image', 'video', 'audio', 'flash'])
+
+export const useMediaViewerStore = defineStore('mediaViewer', {
+  state: () => ({
+    media: [],
+    currentIndex: 0,
+    activated: false
+  }),
+  actions: {
+    setMedia (attachments) {
+      const media = attachments.filter(attachment => {
+        const type = fileTypeService.fileType(attachment.mimetype)
+        return supportedTypes.has(type)
+      })
+
+      this.media = media
+    },
+    setCurrentMedia (current) {
+      const index = this.media.indexOf(current)
+      this.activated = true
+      this.currentIndex = index
+    },
+    closeMediaViewer () {
+      this.activated = false
+    }
+  }
+})
diff --git a/src/stores/oauth.js b/src/stores/oauth.js
new file mode 100644
index 000000000..b9978596d
--- /dev/null
+++ b/src/stores/oauth.js
@@ -0,0 +1,157 @@
+import { defineStore } from 'pinia'
+import { createApp, getClientToken, verifyAppToken } from 'src/services/new_api/oauth.js'
+
+// status codes about verifyAppToken (GET /api/v1/apps/verify_credentials)
+const isAppTokenRejected = error => (
+  // Pleroma API docs say it returns 422 when unauthorized
+  error.statusCode === 422 ||
+  // but it actually returns 400 (as of 2.9.0)
+  // NOTE: don't try to match against the error message, it is translatable
+  error.statusCode === 400 ||
+  // and Mastodon docs say it returns 401
+  error.statusCode === 401
+)
+
+// status codes about getAppToken (GET /oauth/token)
+const isClientDataRejected = error => (
+  // Mastodon docs say it returns 401
+  error.statusCode === 401 ||
+  // but Pleroma actually returns 400 (as of 2.9.0)
+  // NOTE: don't try to match against the error message, it is translatable
+  error.statusCode === 400
+)
+
+export const useOAuthStore = defineStore('oauth', {
+  state: () => ({
+    clientId: false,
+    clientSecret: false,
+    /* App token is authentication for app without any user, used mostly for
+     * MastoAPI's registration of new users, stored so that we can fall back to
+     * it on logout
+     */
+    appToken: false,
+    /* User token is authentication for app with user, this is for every calls
+     * that need authorized user to be successful (i.e. posting, liking etc)
+     */
+    userToken: false
+  }),
+  getters: {
+    getToken () {
+      return this.userToken || this.appToken
+    },
+    getUserToken () {
+      return this.userToken
+    }
+  },
+  actions: {
+    setClientData ({ clientId, clientSecret }) {
+      this.clientId = clientId
+      this.clientSecret = clientSecret
+    },
+    setAppToken (token) {
+      this.appToken = token
+    },
+    setToken (token) {
+      this.userToken = token
+    },
+    clearToken () {
+      this.userToken = false
+    },
+    async createApp () {
+      const { state } = window.vuex
+      const instance = state.instance.server
+      const app = await createApp(instance)
+      this.setClientData(app)
+      return app
+    },
+    /// Use this if you want to get the client id and secret but are not interested
+    /// in whether they are valid.
+    /// @return {{ clientId: string, clientSecret: string }} An object representing the app
+    async ensureApp () {
+      if (this.clientId && this.clientSecret) {
+        return {
+          clientId: this.clientId,
+          clientSecret: this.clientSecret
+        }
+      } else {
+        return this.createApp()
+      }
+    },
+    async getAppToken () {
+      const { state } = window.vuex
+      const instance = state.instance.server
+      const res = await getClientToken({
+        clientId: this.clientId,
+        clientSecret: this.clientSecret,
+        instance
+      })
+      this.setAppToken(res.access_token)
+      return res.access_token
+    },
+    /// Use this if you want to ensure the app is still valid to use.
+    /// @return {string} The access token to the app (not attached to any user)
+    async ensureAppToken () {
+      const { state } = window.vuex
+      if (this.appToken) {
+        try {
+          await verifyAppToken({
+            instance: state.instance.server,
+            appToken: this.appToken
+          })
+          return this.appToken
+        } catch (e) {
+          if (!isAppTokenRejected(e)) {
+            // The server did not reject our token, but we encountered other problems. Maybe the server is down.
+            throw e
+          } else {
+            // The app token is rejected, so it is no longer useful.
+            this.setAppToken(false)
+          }
+        }
+      }
+
+      // appToken is not available, or is rejected: try to get a new one.
+      // First, make sure the client id and client secret are filled.
+      try {
+        await this.ensureApp()
+      } catch (e) {
+        console.error('Cannot create app', e)
+        throw e
+      }
+
+      // Note that at this step, the client id and secret may be invalid
+      // (because the backend may have already deleted the app due to no user login)
+      try {
+        return await this.getAppToken()
+      } catch (e) {
+        if (!isClientDataRejected(e)) {
+          // Non-credentials problem, fail fast
+          console.error('Cannot get app token', e)
+          throw e
+        } else {
+          // the client id and secret are invalid, so we should clear them
+          // and re-create our app
+          this.setClientData({
+            clientId: false,
+            clientSecret: false
+          })
+          await this.createApp()
+          // try once again to get the token
+          return await this.getAppToken()
+        }
+      }
+    }
+  },
+  persist: {
+    afterLoad (state) {
+      // state.token is userToken with older name, coming from persistent state
+      if (state.token && !state.userToken) {
+        state.userToken = state.token
+      }
+      if ('token' in state) {
+        delete state.token
+      }
+      return state
+    }
+  }
+})
diff --git a/src/stores/oauth_tokens.js b/src/stores/oauth_tokens.js
new file mode 100644
index 000000000..ee9886672
--- /dev/null
+++ b/src/stores/oauth_tokens.js
@@ -0,0 +1,24 @@
+import { defineStore } from 'pinia'
+
+export const useOAuthTokensStore = defineStore('oauthTokens', {
+  state: () => ({
+    tokens: []
+  }),
+  actions: {
+    fetchTokens () {
+      window.vuex.state.api.backendInteractor.fetchOAuthTokens().then((tokens) => {
+        this.swapTokens(tokens)
+      })
+    },
+    revokeToken (id) {
+      window.vuex.state.api.backendInteractor.revokeOAuthToken({ id }).then((response) => {
+        if (response.status === 201) {
+          this.swapTokens(this.tokens.filter(token => token.id !== id))
+        }
+      })
+    },
+    swapTokens (tokens) {
+      this.tokens = tokens
+    }
+  }
+});
\ No newline at end of file
diff --git a/src/stores/polls.js b/src/stores/polls.js
new file mode 100644
index 000000000..3bc01037b
--- /dev/null
+++ b/src/stores/polls.js
@@ -0,0 +1,57 @@
+import { merge } from 'lodash'
+import { defineStore } from 'pinia'
+
+export const usePollsStore = defineStore('polls', {
+  state: () => ({
+    // Contains key = id, value = number of trackers for this poll
+    trackedPolls: {},
+    pollsObject: {}
+  }),
+  actions: {
+    mergeOrAddPoll (poll) {
+      const existingPoll = this.pollsObject[poll.id]
+      // Make expired-state change trigger re-renders properly
+      poll.expired = Date.now() > Date.parse(poll.expires_at)
+      if (existingPoll) {
+        this.pollsObject[poll.id] = merge(existingPoll, poll)
+      } else {
+        this.pollsObject[poll.id] = poll
+      }
+    },
+    updateTrackedPoll (pollId) {
+      window.vuex.state.api.backendInteractor.fetchPoll({ pollId }).then(poll => {
+        setTimeout(() => {
+          if (this.trackedPolls[pollId]) {
+            this.updateTrackedPoll(pollId)
+          }
+        }, 30 * 1000)
+        this.mergeOrAddPoll(poll)
+      })
+    },
+    trackPoll (pollId) {
+      if (!this.trackedPolls[pollId]) {
+        setTimeout(() => this.updateTrackedPoll(pollId), 30 * 1000)
+      }
+      const currentValue = this.trackedPolls[pollId]
+      if (currentValue) {
+        this.trackedPolls[pollId] = currentValue + 1
+      } else {
+        this.trackedPolls[pollId] = 1
+      }
+    },
+    untrackPoll (pollId) {
+      const currentValue = this.trackedPolls[pollId]
+      if (currentValue) {
+        this.trackedPolls[pollId] = currentValue - 1
+      } else {
+        this.trackedPolls[pollId] = 0
+      }
+    },
+    votePoll ({ pollId, choices }) {
+      return window.vuex.state.api.backendInteractor.vote({ pollId, choices }).then(poll => {
+        this.mergeOrAddPoll(poll)
+        return poll
+      })
+    }
+  }
+})
diff --git a/src/stores/post_status.js b/src/stores/post_status.js
new file mode 100644
index 000000000..a19b0dbdd
--- /dev/null
+++ b/src/stores/post_status.js
@@ -0,0 +1,20 @@
+import { defineStore } from 'pinia'
+
+export const usePostStatusStore = defineStore('postStatus', {
+  state: () => ({
+    params: null,
+    modalActivated: false
+  }),
+  actions: {
+    openPostStatusModal (params) {
+      this.params = params
+      this.modalActivated = true
+    },
+    closePostStatusModal () {
+      this.modalActivated = false
+    },
+    resetPostStatusModal () {
+      this.params = null
+    }
+  }
+})
diff --git a/src/stores/reports.js b/src/stores/reports.js
new file mode 100644
index 000000000..18080d4e7
--- /dev/null
+++ b/src/stores/reports.js
@@ -0,0 +1,52 @@
+import { defineStore } from 'pinia'
+
+import filter from 'lodash/filter'
+import { useInterfaceStore } from 'src/stores/interface'
+
+export const useReportsStore = defineStore('reports', {
+  state: () => ({
+    reportModal: {
+      userId: null,
+      statuses: [],
+      preTickedIds: [],
+      activated: false
+    },
+    reports: {}
+  }),
+  actions: {
+    openUserReportingModal ({ userId, statusIds = [] }) {
+      const preTickedStatuses = statusIds.map(id => window.vuex.state.statuses.allStatusesObject[id])
+      const preTickedIds = statusIds
+      const statuses = preTickedStatuses.concat(
+        filter(window.vuex.state.statuses.allStatuses,
+          status => status.user.id === userId && !preTickedIds.includes(status.id)
+        )
+      )
+
+      this.reportModal.userId = userId
+      this.reportModal.statuses = statuses
+      this.reportModal.preTickedIds = preTickedIds
+      this.reportModal.activated = true
+    },
+    closeUserReportingModal () {
+      this.reportModal.activated = false
+    },
+    setReportState ({ id, state }) {
+      const oldState = this.reports[id].state
+      this.reports[id].state = state
+      window.vuex.state.api.backendInteractor.setReportState({ id, state }).catch(e => {
+        console.error('Failed to set report state', e)
+        useInterfaceStore().pushGlobalNotice({
+          level: 'error',
+          messageKey: 'general.generic_error_message',
+          messageArgs: [e.message],
+          timeout: 5000
+        })
+        this.reports[id].state = oldState
+      })
+    },
+    addReport (report) {
+      this.reports[report.id] = report
+    }
+  }
+})
diff --git a/src/modules/serverSideStorage.js b/src/stores/serverSideStorage.js
similarity index 50%
rename from src/modules/serverSideStorage.js
rename to src/stores/serverSideStorage.js
index c55f54fdd..40f69c7c2 100644
--- a/src/modules/serverSideStorage.js
+++ b/src/stores/serverSideStorage.js
@@ -1,5 +1,19 @@
+import { defineStore } from 'pinia'
 import { toRaw } from 'vue'
-import { isEqual, cloneDeep, set, get, clamp, flatten, groupBy, findLastIndex, takeRight, uniqWith } from 'lodash'
+import {
+  isEqual,
+  cloneDeep,
+  set,
+  unset,
+  get,
+  clamp,
+  flatten,
+  groupBy,
+  findLastIndex,
+  takeRight,
+  uniqWith,
+  merge as _merge
+} from 'lodash'
 import { CURRENT_UPDATE_COUNTER } from 'src/components/update_notification/update_notification.js'
 
 export const VERSION = 1
@@ -14,6 +28,7 @@ export const defaultState = {
   // storage of flags - stuff that can only be set and incremented
   flagStorage: {
     updateCounter: 0, // Counter for most recent update notification seen
+    configMigration: 0, // Counter for config -> server-side migrations
     reset: 0 // special flag that can be used to force-reset all flags, debug purposes only
     // special reset codes:
     // 1000: trim keys to those known by currently running FE
@@ -23,9 +38,11 @@ export const defaultState = {
     _journal: [],
     simple: {
       dontShowUpdateNotifs: false,
-      collapseNav: false
+      collapseNav: false,
+      muteFilters: {}
     },
     collections: {
+      pinnedStatusActions: ['reply', 'retweet', 'favorite', 'emoji'],
       pinnedNavItems: ['home', 'dms', 'chats']
     }
   },
@@ -65,11 +82,16 @@ const _verifyPrefs = (state) => {
     simple: {},
     collections: {}
   }
+
+  // Simple
   Object.entries(defaultState.prefsStorage.simple).forEach(([k, v]) => {
     if (typeof v === 'number' || typeof v === 'boolean') return
+    if (typeof v === 'object' && v != null) return
     console.warn(`Preference simple.${k} as invalid type, reinitializing`)
     set(state.prefsStorage.simple, k, defaultState.prefsStorage.simple[k])
   })
+
+  // Collections
   Object.entries(defaultState.prefsStorage.collections).forEach(([k, v]) => {
     if (Array.isArray(v)) return
     console.warn(`Preference collections.${k} as invalid type, reinitializing`)
@@ -77,7 +99,7 @@ const _verifyPrefs = (state) => {
   })
 }
 
-export const _getRecentData = (cache, live) => {
+export const _getRecentData = (cache, live, isTest) => {
   const result = { recent: null, stale: null, needUpload: false }
   const cacheValid = _checkValidity(cache || {})
   const liveValid = _checkValidity(live || {})
@@ -110,6 +132,18 @@ export const _getRecentData = (cache, live) => {
     console.debug('Both sources are invalid, start from scratch')
     result.needUpload = true
   }
+
+  const merge = (a, b) => ({
+    _user: a._user ?? b._user,
+    _version: a._version ?? b._version,
+    _timestamp: a._timestamp ?? b._timestamp,
+    needUpload: b.needUpload ?? a.needUpload,
+    prefsStorage: _merge(a.prefsStorage, b.prefsStorage),
+    flagStorage: _merge(a.flagStorage, b.flagStorage)
+  })
+  result.recent = isTest ? result.recent : (result.recent && merge(defaultState, result.recent))
+  result.stale = isTest ? result.stale : (result.stale && merge(defaultState, result.stale))
+
   return result
 }
 
@@ -175,7 +209,7 @@ const _mergeJournal = (...journals) => {
     .sort((a, b) => a.timestamp > b.timestamp ? 1 : -1)
 }
 
-export const _mergePrefs = (recent, stale, allFlagKeys) => {
+export const _mergePrefs = (recent, stale) => {
   if (!stale) return recent
   if (!recent) return stale
   const { _journal: recentJournal, ...recentData } = recent
@@ -192,15 +226,29 @@ export const _mergePrefs = (recent, stale, allFlagKeys) => {
    */
   const resultOutput = { ...recentData }
   const totalJournal = _mergeJournal(staleJournal, recentJournal)
-  totalJournal.forEach(({ path, timestamp, operation, command, args }) => {
+  totalJournal.forEach(({ path, operation, args }) => {
     if (path.startsWith('_')) {
-      console.error(`journal contains entry to edit internal (starts with _) field '${path}', something is incorrect here, ignoring.`)
-      return
+      throw new Error(`journal contains entry to edit internal (starts with _) field '${path}', something is incorrect here, ignoring.`)
     }
     switch (operation) {
       case 'set':
+        if (path.startsWith('collections') || path.startsWith('objectCollections')) {
+          throw new Error('Illegal operation "set" on a collection')
+        }
+        if (path.split(/\./g).length <= 1) {
+          throw new Error(`Calling set on depth <= 1 (path: ${path}) is not allowed`)
+        }
         set(resultOutput, path, args[0])
         break
+      case 'unset':
+        if (path.startsWith('collections') || path.startsWith('objectCollections')) {
+          throw new Error('Illegal operation "unset" on a collection')
+        }
+        if (path.split(/\./g).length <= 2) {
+          throw new Error(`Calling unset on depth <= 2 (path: ${path})  is not allowed`)
+        }
+        unset(resultOutput, path)
+        break
       case 'addToCollection':
         set(resultOutput, path, Array.from(new Set(get(resultOutput, path)).add(args[0])))
         break
@@ -216,7 +264,7 @@ export const _mergePrefs = (recent, stale, allFlagKeys) => {
         break
       }
       default:
-        console.error(`Unknown journal operation: '${operation}', did we forget to run reverse migrations beforehand?`)
+        throw new Error(`Unknown journal operation: '${operation}', did we forget to run reverse migrations beforehand?`)
     }
   })
   return { ...resultOutput, _journal: totalJournal }
@@ -277,159 +325,194 @@ export const _doMigrations = (cache) => {
   return cache
 }
 
-export const mutations = {
-  clearServerSideStorage (state, userData) {
-    state = { ...cloneDeep(defaultState) }
+export const useServerSideStorageStore = defineStore('serverSideStorage', {
+  state() {
+    return cloneDeep(defaultState)
   },
-  setServerSideStorage (state, userData) {
-    const live = userData.storage
-    state.raw = live
-    let cache = state.cache
-    if (cache && cache._user !== userData.fqn) {
-      console.warn('cache belongs to another user! reinitializing local cache!')
-      cache = null
-    }
-
-    cache = _doMigrations(cache)
-
-    let { recent, stale, needsUpload } = _getRecentData(cache, live)
-
-    const userNew = userData.created_at > NEW_USER_DATE
-    const flagsTemplate = userNew ? newUserFlags : defaultState.flagStorage
-    let dirty = false
-
-    if (recent === null) {
-      console.debug(`Data is empty, initializing for ${userNew ? 'new' : 'existing'} user`)
-      recent = _wrapData({
-        flagStorage: { ...flagsTemplate },
-        prefsStorage: { ...defaultState.prefsStorage }
-      })
-    }
-
-    if (!needsUpload && recent && stale) {
-      console.debug('Checking if data needs merging...')
-      // discarding timestamps and versions
-      const { _timestamp: _0, _version: _1, ...recentData } = recent
-      const { _timestamp: _2, _version: _3, ...staleData } = stale
-      dirty = !isEqual(recentData, staleData)
-      console.debug(`Data ${dirty ? 'needs' : 'doesn\'t need'} merging`)
-    }
-
-    const allFlagKeys = _getAllFlags(recent, stale)
-    let totalFlags
-    let totalPrefs
-    if (dirty) {
-      // Merge the flags
-      console.debug('Merging the data...')
-      totalFlags = _mergeFlags(recent, stale, allFlagKeys)
-      _verifyPrefs(recent)
-      _verifyPrefs(stale)
-      totalPrefs = _mergePrefs(recent.prefsStorage, stale.prefsStorage)
-    } else {
-      totalFlags = recent.flagStorage
-      totalPrefs = recent.prefsStorage
-    }
-
-    totalFlags = _resetFlags(totalFlags)
-
-    recent.flagStorage = { ...flagsTemplate, ...totalFlags }
-    recent.prefsStorage = { ...defaultState.prefsStorage, ...totalPrefs }
-
-    state.dirty = dirty || needsUpload
-    state.cache = recent
-    // set local timestamp to smaller one if we don't have any changes
-    if (stale && recent && !state.dirty) {
-      state.cache._timestamp = Math.min(stale._timestamp, recent._timestamp)
-    }
-    state.flagStorage = state.cache.flagStorage
-    state.prefsStorage = state.cache.prefsStorage
-  },
-  setFlag (state, { flag, value }) {
-    state.flagStorage[flag] = value
-    state.dirty = true
-  },
-  setPreference (state, { path, value }) {
-    if (path.startsWith('_')) {
-      console.error(`tried to edit internal (starts with _) field '${path}', ignoring.`)
-      return
-    }
-    set(state.prefsStorage, path, value)
-    state.prefsStorage._journal = [
-      ...state.prefsStorage._journal,
-      { operation: 'set', path, args: [value], timestamp: Date.now() }
-    ]
-    state.dirty = true
-  },
-  addCollectionPreference (state, { path, value }) {
-    if (path.startsWith('_')) {
-      console.error(`tried to edit internal (starts with _) field '${path}', ignoring.`)
-      return
-    }
-    const collection = new Set(get(state.prefsStorage, path))
-    collection.add(value)
-    set(state.prefsStorage, path, [...collection])
-    state.prefsStorage._journal = [
-      ...state.prefsStorage._journal,
-      { operation: 'addToCollection', path, args: [value], timestamp: Date.now() }
-    ]
-    state.dirty = true
-  },
-  removeCollectionPreference (state, { path, value }) {
-    if (path.startsWith('_')) {
-      console.error(`tried to edit internal (starts with _) field '${path}', ignoring.`)
-      return
-    }
-    const collection = new Set(get(state.prefsStorage, path))
-    collection.delete(value)
-    set(state.prefsStorage, path, [...collection])
-    state.prefsStorage._journal = [
-      ...state.prefsStorage._journal,
-      { operation: 'removeFromCollection', path, args: [value], timestamp: Date.now() }
-    ]
-    state.dirty = true
-  },
-  reorderCollectionPreference (state, { path, value, movement }) {
-    if (path.startsWith('_')) {
-      console.error(`tried to edit internal (starts with _) field '${path}', ignoring.`)
-      return
-    }
-    const collection = get(state.prefsStorage, path)
-    const newCollection = _moveItemInArray(collection, value, movement)
-    set(state.prefsStorage, path, newCollection)
-    state.prefsStorage._journal = [
-      ...state.prefsStorage._journal,
-      { operation: 'arrangeCollection', path, args: [value], timestamp: Date.now() }
-    ]
-    state.dirty = true
-  },
-  updateCache (state, { username }) {
-    state.prefsStorage._journal = _mergeJournal(state.prefsStorage._journal)
-    state.cache = _wrapData({
-      flagStorage: toRaw(state.flagStorage),
-      prefsStorage: toRaw(state.prefsStorage)
-    }, username)
-  }
-}
-
-const serverSideStorage = {
-  state: {
-    ...cloneDeep(defaultState)
-  },
-  mutations,
   actions: {
-    pushServerSideStorage ({ state, rootState, commit }, { force = false } = {}) {
-      const needPush = state.dirty || force
+    setFlag ({ flag, value }) {
+      this.flagStorage[flag] = value
+      this.dirty = true
+    },
+    setPreference ({ path, value }) {
+      if (path.startsWith('_')) {
+        throw new Error(`Tried to edit internal (starts with _) field '${path}', ignoring.`)
+      }
+      if (path.startsWith('collections') || path.startsWith('objectCollections')) {
+        throw new Error(`Invalid operation 'set' for collection field '${path}', ignoring.`)
+      }
+      if (path.split(/\./g).length <= 1) {
+        throw new Error(`Calling set on depth <= 1 (path: ${path}) is not allowed`)
+      }
+      if (path.split(/\./g).length > 3) {
+        throw new Error(`Calling set on depth > 3 (path: ${path})  is not allowed`)
+      }
+      set(this.prefsStorage, path, value)
+      this.prefsStorage._journal = [
+        ...this.prefsStorage._journal,
+        { operation: 'set', path, args: [value], timestamp: Date.now() }
+      ]
+      this.dirty = true
+    },
+    unsetPreference ({ path, value }) {
+      if (path.startsWith('_')) {
+        throw new Error(`Tried to edit internal (starts with _) field '${path}', ignoring.`)
+      }
+      if (path.startsWith('collections') || path.startsWith('objectCollections')) {
+        throw new Error(`Invalid operation 'unset' for collection field '${path}', ignoring.`)
+      }
+      if (path.split(/\./g).length <= 2) {
+        throw new Error(`Calling unset on depth <= 2 (path: ${path})  is not allowed`)
+      }
+      if (path.split(/\./g).length > 3) {
+        throw new Error(`Calling unset on depth > 3 (path: ${path})  is not allowed`)
+      }
+      unset(this.prefsStorage, path, value)
+      this.prefsStorage._journal = [
+        ...this.prefsStorage._journal,
+        { operation: 'unset', path, args: [], timestamp: Date.now() }
+      ]
+      this.dirty = true
+    },
+    addCollectionPreference ({ path, value }) {
+      if (path.startsWith('_')) {
+        throw new Error(`tried to edit internal (starts with _) field '${path}'`)
+      }
+      if (path.startsWith('collections')) {
+        const collection = new Set(get(this.prefsStorage, path))
+        collection.add(value)
+        set(this.prefsStorage, path, [...collection])
+      } else if (path.startsWith('objectCollections')) {
+        const { _key } = value
+        if (!_key && typeof _key !== 'string') {
+          throw new Error('Object for storage is missing _key field!')
+        }
+        const collection = new Set(get(this.prefsStorage, path + '.index'))
+        collection.add(_key)
+        set(this.prefsStorage, path + '.index', [...collection])
+        set(this.prefsStorage, path + '.data.' + _key, value)
+      }
+      this.prefsStorage._journal = [
+        ...this.prefsStorage._journal,
+        { operation: 'addToCollection', path, args: [value], timestamp: Date.now() }
+      ]
+      this.dirty = true
+    },
+    removeCollectionPreference ({ path, value }) {
+      if (path.startsWith('_')) {
+        throw new Error(`tried to edit internal (starts with _) field '${path}', ignoring.`)
+      }
+      const collection = new Set(get(this.prefsStorage, path))
+      collection.delete(value)
+      set(this.prefsStorage, path, [...collection])
+      this.prefsStorage._journal = [
+        ...this.prefsStorage._journal,
+        { operation: 'removeFromCollection', path, args: [value], timestamp: Date.now() }
+      ]
+      this.dirty = true
+    },
+    reorderCollectionPreference ({ path, value, movement }) {
+      if (path.startsWith('_')) {
+        throw new Error(`tried to edit internal (starts with _) field '${path}', ignoring.`)
+      }
+      const collection = get(this.prefsStorage, path)
+      const newCollection = _moveItemInArray(collection, value, movement)
+      set(this.prefsStorage, path, newCollection)
+      this.prefsStorage._journal = [
+        ...this.prefsStorage._journal,
+        { operation: 'arrangeCollection', path, args: [value], timestamp: Date.now() }
+      ]
+      this.dirty = true
+    },
+    updateCache ({ username }) {
+      this.prefsStorage._journal = _mergeJournal(this.prefsStorage._journal)
+      this.cache = _wrapData({
+        flagStorage: toRaw(this.flagStorage),
+        prefsStorage: toRaw(this.prefsStorage)
+      }, username)
+    },
+    clearServerSideStorage () {
+      const blankState = { ...cloneDeep(defaultState) }
+      Object.keys(this).forEach(k => {
+        this[k] = blankState[k]
+      })
+    },
+    setServerSideStorage (userData) {
+      const live = userData.storage
+      this.raw = live
+      let cache = this.cache
+      if (cache && cache._user !== userData.fqn) {
+        console.warn('Cache belongs to another user! reinitializing local cache!')
+        cache = null
+      }
+
+      cache = _doMigrations(cache)
+
+      let { recent, stale, needUpload } = _getRecentData(cache, live)
+
+      const userNew = userData.created_at > NEW_USER_DATE
+      const flagsTemplate = userNew ? newUserFlags : defaultState.flagStorage
+      let dirty = false
+
+      if (recent === null) {
+        console.debug(`Data is empty, initializing for ${userNew ? 'new' : 'existing'} user`)
+        recent = _wrapData({
+          flagStorage: { ...flagsTemplate },
+          prefsStorage: { ...defaultState.prefsStorage }
+        })
+      }
+
+      if (!needUpload && recent && stale) {
+        console.debug('Checking if data needs merging...')
+        // discarding timestamps and versions
+        /* eslint-disable no-unused-vars */
+        const { _timestamp: _0, _version: _1, ...recentData } = recent
+        const { _timestamp: _2, _version: _3, ...staleData } = stale
+        /* eslint-enable no-unused-vars */
+        dirty = !isEqual(recentData, staleData)
+        console.debug(`Data ${dirty ? 'needs' : 'doesn\'t need'} merging`)
+      }
+
+      const allFlagKeys = _getAllFlags(recent, stale)
+      let totalFlags
+      let totalPrefs
+      if (dirty) {
+        // Merge the flags
+        console.debug('Merging the data...')
+        totalFlags = _mergeFlags(recent, stale, allFlagKeys)
+        _verifyPrefs(recent)
+        _verifyPrefs(stale)
+        totalPrefs = _mergePrefs(recent.prefsStorage, stale.prefsStorage)
+      } else {
+        totalFlags = recent.flagStorage
+        totalPrefs = recent.prefsStorage
+      }
+
+      totalFlags = _resetFlags(totalFlags)
+
+      recent.flagStorage = { ...flagsTemplate, ...totalFlags }
+      recent.prefsStorage = { ...defaultState.prefsStorage, ...totalPrefs }
+
+      this.dirty = dirty || needUpload
+      this.cache = recent
+      // set local timestamp to smaller one if we don't have any changes
+      if (stale && recent && !this.dirty) {
+        this.cache._timestamp = Math.min(stale._timestamp, recent._timestamp)
+      }
+      this.flagStorage = this.cache.flagStorage
+      this.prefsStorage = this.cache.prefsStorage
+    },
+    pushServerSideStorage ({ force = false } = {}) {
+      const needPush = this.dirty || force
       if (!needPush) return
-      commit('updateCache', { username: rootState.users.currentUser.fqn })
-      const params = { pleroma_settings_store: { 'pleroma-fe': state.cache } }
-      rootState.api.backendInteractor
-        .updateProfile({ params })
+      this.updateCache({ username: window.vuex.state.users.currentUser.fqn })
+      const params = { pleroma_settings_store: { 'pleroma-fe': this.cache } }
+      window.vuex.state.api.backendInteractor
+        .updateProfileJSON({ params })
         .then((user) => {
-          commit('setServerSideStorage', user)
-          state.dirty = false
+          this.setServerSideStorage(user)
+          this.dirty = false
         })
     }
   }
-}
-
-export default serverSideStorage
+})
diff --git a/src/stores/shout.js b/src/stores/shout.js
new file mode 100644
index 000000000..105e80e6f
--- /dev/null
+++ b/src/stores/shout.js
@@ -0,0 +1,32 @@
+import { defineStore } from 'pinia'
+
+export const useShoutStore = defineStore('shout', {
+  state: () => ({
+    messages: [],
+    channel: { state: '' },
+    joined: false
+  }),
+  actions: {
+    initializeShout (socket) {
+      const channel = socket.channel('chat:public')
+      channel.joinPush.receive('ok', () => {
+        this.joined = true
+      })
+      channel.onClose(() => {
+        this.joined = false
+      })
+      channel.onError(() => {
+        this.joined = false
+      })
+      channel.on('new_msg', (msg) => {
+        this.messages.push(msg)
+        this.messages = this.messages.slice(-19, 20)
+      })
+      channel.on('messages', ({ messages }) => {
+        this.messages = messages.slice(-19, 20)
+      })
+      channel.join()
+      this.channel = channel
+    }
+  }
+})
diff --git a/src/stores/statusHistory.js b/src/stores/statusHistory.js
new file mode 100644
index 000000000..0d3c54c89
--- /dev/null
+++ b/src/stores/statusHistory.js
@@ -0,0 +1,17 @@
+import { defineStore } from 'pinia'
+
+export const useStatusHistoryStore = defineStore('statusHistory', {
+  state: () => ({
+    params: {},
+    modalActivated: false
+  }),
+  actions: {
+    openStatusHistoryModal (params) {
+      this.params = params
+      this.modalActivated = true
+    },
+    closeStatusHistoryModal () {
+      this.modalActivated = false
+    }
+  }
+})
diff --git a/src/sw.js b/src/sw.js
index 8d790446a..834c68e7f 100644
--- a/src/sw.js
+++ b/src/sw.js
@@ -1,10 +1,15 @@
 /* eslint-env serviceworker */
 
-import localForage from 'localforage'
+import 'virtual:pleroma-fe/service_worker_env'
+import { storage } from 'src/lib/storage.js'
 import { parseNotification } from './services/entity_normalizer/entity_normalizer.service.js'
 import { prepareNotificationObject } from './services/notification_utils/notification_utils.js'
+import { shouldCache, cacheKey, emojiCacheKey } from './services/sw/sw.js'
 import { createI18n } from 'vue-i18n'
-import messages from './i18n/service_worker_messages.js'
+// Collects all messages for service workers
+// Needed because service workers cannot use dynamic imports
+// See /build/sw_plugin.js for more information
+import messages from 'virtual:pleroma-fe/service_worker_messages'
 
 const i18n = createI18n({
   // By default, use the browser locale, we will update it if neccessary
@@ -25,7 +30,7 @@ function getWindowClients () {
 }
 
 const setSettings = async () => {
-  const vuexState = await localForage.getItem('vuex-lz')
+  const vuexState = await storage.getItem('vuex-lz')
   const locale = vuexState.config.interfaceLanguage || 'en'
   i18n.locale = locale
   const notificationsNativeArray = Object.entries(vuexState.config.notificationNative)
@@ -33,7 +38,7 @@ const setSettings = async () => {
 
   state.allowedNotificationTypes = new Set(
     notificationsNativeArray
-      .filter(([k, v]) => v)
+      .filter(([, v]) => v)
       .map(([k]) => {
         switch (k) {
           case 'mentions':
@@ -82,6 +87,80 @@ const showPushNotification = async (event) => {
   return Promise.resolve()
 }
 
+const cacheFiles = self.serviceWorkerOption.assets
+const isEmoji = req => {
+  if (req.method !== 'GET') {
+    return false
+  }
+  const url = new URL(req.url)
+
+  return url.pathname.startsWith('/emoji/')
+}
+const isNotMedia = req => {
+  if (req.method !== 'GET') {
+    return false
+  }
+  const url = new URL(req.url)
+  return !url.pathname.startsWith('/media/')
+}
+const isAsset = req => {
+  const url = new URL(req.url)
+  return cacheFiles.includes(url.pathname)
+}
+
+const isSuccessful = (resp) => {
+  if (!resp.ok) {
+    return false
+  }
+  if ((new URL(resp.url)).pathname === '/index.html') {
+    // For index.html itself, there is no fallback possible.
+    return true
+  }
+  const type = resp.headers.get('Content-Type')
+  // Backend will revert to index.html if the file does not exist, so text/html for emojis and assets is a failure
+  return type && !type.includes('text/html')
+}
+
+self.addEventListener('install', async (event) => {
+  if (shouldCache) {
+    event.waitUntil((async () => {
+      // Do not preload i18n and emoji annotations to speed up loading
+      const shouldPreload = (route) => {
+        return !route.startsWith('/static/js/i18n/') && !route.startsWith('/static/js/emoji-annotations/')
+      }
+      const cache = await caches.open(cacheKey)
+      await Promise.allSettled(cacheFiles.filter(shouldPreload).map(async (route) => {
+        // https://developer.mozilla.org/en-US/docs/Web/API/Cache/add
+        // originally we used addAll() but it will raise a problem in one edge case:
+        // when the file for the route is not found, backend will return index.html with code 200
+        // but it's wrong, and it's cached, so we end up with a bad cache.
+        // this can happen when you refresh when you are in the process of upgrading
+        // the frontend.
+        const resp = await fetch(route)
+        if (isSuccessful(resp)) {
+          await cache.put(route, resp)
+        }
+      }))
+    })())
+  }
+})
+
+self.addEventListener('activate', async (event) => {
+  if (shouldCache) {
+    event.waitUntil((async () => {
+      const cache = await caches.open(cacheKey)
+      const keys = await cache.keys()
+      await Promise.all(
+        keys.filter(request => {
+          const url = new URL(request.url)
+          const shouldKeep = cacheFiles.includes(url.pathname)
+          return !shouldKeep
+        }).map(k => cache.delete(k))
+      )
+    })())
+  }
+})
+
 self.addEventListener('push', async (event) => {
   if (event.data) {
     // Supposedly, we HAVE to return a promise inside waitUntil otherwise it will
@@ -139,3 +218,36 @@ self.addEventListener('notificationclick', (event) => {
     if (clients.openWindow) return clients.openWindow('/')
   }))
 })
+
+self.addEventListener('fetch', (event) => {
+  // Do not mess up with remote things
+  const isSameOrigin = (new URL(event.request.url)).origin === self.location.origin
+  if (shouldCache && event.request.method === 'GET' && isSameOrigin && isNotMedia(event.request)) {
+    // this is a bit spammy
+    // console.debug('[Service worker] fetch:', event.request.url)
+    event.respondWith((async () => {
+      const r = await caches.match(event.request)
+      const isEmojiReq = isEmoji(event.request)
+
+      if (r && isSuccessful(r)) {
+        console.debug('[Service worker] already cached:', event.request.url)
+        return r
+      }
+
+      try {
+        const response = await fetch(event.request)
+        if (response.ok &&
+            isSuccessful(response) &&
+            (isEmojiReq || isAsset(event.request))) {
+          console.debug(`[Service worker] caching ${isEmojiReq ? 'emoji' : 'asset'}:`, event.request.url)
+          const cache = await caches.open(isEmojiReq ? emojiCacheKey : cacheKey)
+          await cache.put(event.request.clone(), response.clone())
+        }
+        return response
+      } catch (e) {
+        console.error('[Service worker] error when caching emoji:', e)
+        throw e
+      }
+    })())
+  }
+})
diff --git a/static/styles.json b/static/styles.json
deleted file mode 100644
index 23f57c65e..000000000
--- a/static/styles.json
+++ /dev/null
@@ -1,17 +0,0 @@
-{
-  "pleroma-dark": "/static/themes/pleroma-dark.json",
-  "pleroma-light": "/static/themes/pleroma-light.json",
-  "pleroma-amoled": [ "Pleroma Dark AMOLED", "#000000", "#111111", "#b0b0b1", "#d8a070", "#aa0000", "#0fa00f", "#0095ff", "#d59500"],
-  "classic-dark": [ "Classic Dark", "#161c20", "#282e32", "#b9b9b9", "#baaa9c", "#d31014", "#0fa00f", "#0095ff", "#ffa500" ],
-  "bird": [ "Bird", "#f8fafd", "#e6ecf0", "#14171a", "#0084b8", "#e0245e", "#17bf63", "#1b95e0", "#fab81e"],
-  "ir-black": [ "Ir Black", "#000000", "#242422", "#b5b3aa", "#ff6c60", "#FF6C60", "#A8FF60", "#96CBFE", "#FFFFB6" ],
-  "monokai": [ "Monokai", "#272822", "#383830", "#f8f8f2", "#f92672", "#F92672", "#a6e22e", "#66d9ef", "#f4bf75" ],
-
-  "redmond-xx": "/static/themes/redmond-xx.json",
-  "redmond-xx-se": "/static/themes/redmond-xx-se.json",
-  "redmond-xxi": "/static/themes/redmond-xxi.json",
-  "breezy-dark": "/static/themes/breezy-dark.json",
-  "breezy-light": "/static/themes/breezy-light.json",
-  "mammal": "/static/themes/mammal.json",
-  "paper": "/static/themes/paper.json"
-}
diff --git a/test/fixtures/mock_api.js b/test/fixtures/mock_api.js
new file mode 100644
index 000000000..3f9e72955
--- /dev/null
+++ b/test/fixtures/mock_api.js
@@ -0,0 +1,62 @@
+import { test as testBase } from 'vitest'
+import { setupWorker } from 'msw/browser'
+import { http, HttpResponse } from 'msw'
+
+// https://mswjs.io/docs/recipes/vitest-browser-mode
+export const injectMswToTest = (defaultHandlers) => {
+  const worker = setupWorker(...defaultHandlers)
+
+  return testBase.extend({
+    worker: [
+      async ({}, use) => {
+        await worker.start()
+
+        await use(worker)
+
+        worker.resetHandlers()
+        worker.stop()
+      },
+      {
+        auto: true
+      }
+    ],
+  })
+}
+
+export const testServer = 'https://test.server.example'
+
+export const authApis = [
+  http.post(`${testServer}/api/v1/apps`, () => {
+    return HttpResponse.json({
+      client_id: 'test-id',
+      client_secret: 'test-secret'
+    })
+  }),
+  http.get(`${testServer}/api/v1/apps/verify_credentials`, ({ request }) => {
+    const authHeader = request.headers.get('Authorization')
+    if (authHeader === 'Bearer test-app-token' ||
+        authHeader === 'Bearer also-good-app-token') {
+      return HttpResponse.json({})
+    } else {
+      // Pleroma 2.9.0 gives the following respoonse upon error
+      return HttpResponse.json({ error: { detail: 'Internal server error' } }, {
+        status: 400
+      })
+    }
+  }),
+  http.post(`${testServer}/oauth/token`, async ({ request }) => {
+    const data = await request.formData()
+
+    if (data.get('client_id') === 'test-id' &&
+       data.get('client_secret') === 'test-secret' &&
+       data.get('grant_type') === 'client_credentials' &&
+       data.has('redirect_uri')) {
+      return HttpResponse.json({ access_token: 'test-app-token' })
+    } else {
+      // Pleroma 2.9.0 gives the following respoonse upon error
+      return HttpResponse.json({ error: 'Invalid credentials' }, {
+        status: 400
+      })
+    }
+  })
+]
diff --git a/test/fixtures/mock_store.js b/test/fixtures/mock_store.js
new file mode 100644
index 000000000..3bfdf0fca
--- /dev/null
+++ b/test/fixtures/mock_store.js
@@ -0,0 +1,21 @@
+import { createStore } from 'vuex'
+import { cloneDeep } from 'lodash'
+import vuexModules from 'src/modules/index.js'
+
+const tweakModules = modules => {
+  const res = {}
+  Object.entries(modules).forEach(([name, module]) => {
+    const m = { ...module }
+    m.state = cloneDeep(module.state)
+    res[name] = m
+  })
+  return res
+}
+
+const makeMockStore = () => {
+  return createStore({
+    modules: tweakModules(vuexModules),
+  })
+}
+
+export default makeMockStore
diff --git a/test/fixtures/setup_test.js b/test/fixtures/setup_test.js
new file mode 100644
index 000000000..6da2e4c9d
--- /dev/null
+++ b/test/fixtures/setup_test.js
@@ -0,0 +1,126 @@
+import { config } from '@vue/test-utils'
+import { createRouter, createMemoryHistory } from 'vue-router'
+import VueVirtualScroller from 'vue-virtual-scroller'
+import routes from 'src/boot/routes'
+import makeMockStore from './mock_store'
+
+export const $t = msg => msg
+const $i18n = { t: msg => msg }
+
+const applyAfterStore = (store, afterStore) => {
+  afterStore(store)
+  return store
+}
+
+const getDefaultOpts = ({ afterStore = () => {} } = {}) => ({
+  global: {
+    plugins: [
+      applyAfterStore(makeMockStore(), afterStore),
+      VueVirtualScroller,
+      createRouter({
+        history: createMemoryHistory(),
+        routes: routes({ state: {
+          users: {
+            currentUser: {}
+          },
+          instance: {}
+        }})
+      }),
+      (Vue) => { Vue.directive('body-scroll-lock', {}) }
+    ],
+    components: {
+    },
+    stubs: {
+      I18nT: true,
+      teleport: true,
+      FAIcon: true,
+      FALayers: true,
+    },
+    mocks: {
+      $t,
+      $i18n
+    }
+  }
+})
+
+// https://github.com/vuejs/vue-test-utils/issues/960
+const customBehaviors = () => {
+  const filterByText = keyword => {
+    const match = keyword instanceof RegExp
+          ? (target) => target && keyword.test(target)
+          : (target) => keyword === target
+
+    return wrapper => (
+      match(wrapper.text()) ||
+        match(wrapper.attributes('aria-label')) ||
+        match(wrapper.attributes('title'))
+    )
+  }
+
+  return {
+    findComponentByText(searchedComponent, text) {
+      return this.findAllComponents(searchedComponent)
+        .filter(filterByText(text))
+        .at(0)
+    },
+    findByText(searchedElement, text) {
+      return this.findAll(searchedElement)
+        .filter(filterByText(text))
+        .at(0)
+    },
+  };
+};
+
+config.plugins.VueWrapper.install(customBehaviors)
+
+export const mountOpts = (allOpts = {}) => {
+  const { afterStore, ...opts } = allOpts
+  const defaultOpts = getDefaultOpts({ afterStore })
+  const mergedOpts = {
+    ...opts,
+    global: {
+      ...defaultOpts.global
+    }
+  }
+
+  if (opts.global) {
+    mergedOpts.global.plugins = mergedOpts.global.plugins.concat(opts.global.plugins || [])
+    Object.entries(opts.global).forEach(([k, v]) => {
+      if (k === 'plugins') {
+        return
+      }
+      if (defaultOpts.global[k]) {
+        mergedOpts.global[k] = {
+          ...defaultOpts.global[k],
+          ...v,
+        }
+      } else {
+        mergedOpts.global[k] = v
+      }
+    })
+  }
+
+  return mergedOpts
+}
+
+// https://stackoverflow.com/questions/78033718/how-can-i-wait-for-an-emitted-event-of-a-mounted-component-in-vue-test-utils
+export const waitForEvent = (wrapper, event, {
+  timeout = 1000,
+  timesEmitted = 1
+} = {}) => {
+  const tick = 10
+
+  return vi.waitFor(
+    () => {
+      const e = wrapper.emitted(event)
+      if (e && e.length >= timesEmitted) {
+        return
+      }
+      throw new Error('event is not emitted')
+    },
+    {
+      timeout,
+      interval: tick
+    }
+  )
+}
diff --git a/test/unit/.eslintrc b/test/unit/.eslintrc
deleted file mode 100644
index 959a4f4b5..000000000
--- a/test/unit/.eslintrc
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "env": {
-    "mocha": true
-  },
-  "globals": {
-    "expect": true,
-    "sinon": true
-  }
-}
diff --git a/test/unit/index.js b/test/unit/index.js
deleted file mode 100644
index 83a2dcdba..000000000
--- a/test/unit/index.js
+++ /dev/null
@@ -1,9 +0,0 @@
-// require all test files (files that ends with .spec.js)
-const testsContext = require.context('./specs', true, /\.spec$/)
-testsContext.keys().forEach(testsContext)
-
-// require all src files except main.js for coverage.
-// you can also change this to match only the subset of files that
-// you want coverage for.
-// const srcContext = require.context('../../src', true, /^\.\/(?!main(\.js)?$)/)
-// srcContext.keys().forEach(srcContext)
diff --git a/test/unit/karma.conf.js b/test/unit/karma.conf.js
deleted file mode 100644
index e773181cc..000000000
--- a/test/unit/karma.conf.js
+++ /dev/null
@@ -1,73 +0,0 @@
-// This is a karma config file. For more details see
-//   http://karma-runner.github.io/0.13/config/configuration-file.html
-// we are also using it with karma-webpack
-//   https://github.com/webpack/karma-webpack
-
-// var path = require('path')
-const merge = require('webpack-merge')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const baseConfig = require('../../build/webpack.base.conf')
-const utils = require('../../build/utils')
-const webpack = require('webpack')
-// var projectRoot = path.resolve(__dirname, '../../')
-
-const webpackConfig = merge(baseConfig, {
-  // use inline sourcemap for karma-sourcemap-loader
-  module: {
-    rules: utils.styleLoaders()
-  },
-  devtool: 'inline-source-map',
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env': require('../../config/test.env')
-    }),
-    new HtmlWebpackPlugin({
-      filename: 'index.html',
-      template: 'index.html',
-      inject: true
-    })
-  ]
-})
-
-// no need for app entry during tests
-delete webpackConfig.entry
-
-module.exports = function (config) {
-  config.set({
-    // to run in additional browsers:
-    // 1. install corresponding karma launcher
-    //    http://karma-runner.github.io/0.13/config/browsers.html
-    // 2. add it to the `browsers` array below.
-    browsers: ['FirefoxHeadless'],
-    frameworks: ['mocha', 'sinon-chai'],
-    reporters: ['mocha'],
-    customLaunchers: {
-      FirefoxHeadless: {
-        base: 'Firefox',
-        flags: [
-          '-headless'
-        ]
-      }
-    },
-    files: [
-      './index.js'
-    ],
-    preprocessors: {
-      './index.js': ['webpack', 'sourcemap']
-    },
-    webpack: webpackConfig,
-    webpackMiddleware: {
-      noInfo: true
-    },
-    mochaReporter: {
-      showDiff: true
-    },
-    coverageReporter: {
-      dir: './coverage',
-      reporters: [
-        { type: 'lcov', subdir: '.' },
-        { type: 'text-summary' }
-      ]
-    }
-  })
-}
diff --git a/test/unit/specs/components/draft.spec.js b/test/unit/specs/components/draft.spec.js
new file mode 100644
index 000000000..b00f447cd
--- /dev/null
+++ b/test/unit/specs/components/draft.spec.js
@@ -0,0 +1,153 @@
+import { mount, flushPromises } from '@vue/test-utils'
+import { nextTick } from 'vue'
+import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
+import { mountOpts, waitForEvent, $t } from '../../../fixtures/setup_test'
+
+const autoSaveOrNot = (caseFn, caseTitle, runFn) => {
+  caseFn(`${caseTitle} with auto-save`, function () {
+    return runFn.bind(this)(true)
+  })
+
+  caseFn(`${caseTitle} with no auto-save`, function () {
+    return runFn.bind(this)(false)
+  })
+}
+
+const saveManually = async (wrapper) => {
+  const morePostActions = wrapper.findByText('button', $t('post_status.more_post_actions'))
+  await morePostActions.trigger('click')
+
+  const btn = wrapper.findByText('button', $t('post_status.save_to_drafts_button'))
+  await btn.trigger('click')
+}
+
+const waitSaveTime = 4000
+
+afterEach(() => {
+  vi.useRealTimers()
+})
+
+describe('Draft saving', () => {
+  autoSaveOrNot(it, 'should save when the button is clicked', async (autoSave) => {
+    const wrapper = mount(PostStatusForm, mountOpts())
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'autoSaveDraft',
+      value: autoSave
+    })
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+
+    const textarea = wrapper.get('textarea')
+    await textarea.setValue('mew mew')
+
+    await saveManually(wrapper)
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(1)
+    expect(wrapper.vm.$store.getters.draftsArray[0].status).to.equal('mew mew')
+  })
+
+  it('should auto-save if it is enabled', async function () {
+    vi.useFakeTimers()
+    const wrapper = mount(PostStatusForm, mountOpts())
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'autoSaveDraft',
+      value: true
+    })
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+    const textarea = wrapper.get('textarea')
+    await textarea.setValue('mew mew')
+
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+    await vi.advanceTimersByTimeAsync(waitSaveTime)
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(1)
+    expect(wrapper.vm.$store.getters.draftsArray[0].status).to.equal('mew mew')
+  })
+
+  it('should auto-save when close if auto-save is on', async () => {
+    const wrapper = mount(PostStatusForm, mountOpts({
+      props: {
+        closeable: true
+      }
+    }))
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'autoSaveDraft',
+      value: true
+    })
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+    const textarea = wrapper.get('textarea')
+    await textarea.setValue('mew mew')
+    wrapper.vm.requestClose()
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(1)
+    await waitForEvent(wrapper, 'can-close')
+  })
+
+  it('should save when close if auto-save is off, and unsavedPostAction is save', async () => {
+    const wrapper = mount(PostStatusForm, mountOpts({
+      props: {
+        closeable: true
+      }
+    }))
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'autoSaveDraft',
+      value: false
+    })
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'unsavedPostAction',
+      value: 'save'
+    })
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+    const textarea = wrapper.get('textarea')
+    await textarea.setValue('mew mew')
+    wrapper.vm.requestClose()
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(1)
+    await waitForEvent(wrapper, 'can-close')
+  })
+
+  it('should discard when close if auto-save is off, and unsavedPostAction is discard', async () => {
+    const wrapper = mount(PostStatusForm, mountOpts({
+      props: {
+        closeable: true
+      }
+    }))
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'autoSaveDraft',
+      value: false
+    })
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'unsavedPostAction',
+      value: 'discard'
+    })
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+    const textarea = wrapper.get('textarea')
+    await textarea.setValue('mew mew')
+    wrapper.vm.requestClose()
+    await waitForEvent(wrapper, 'can-close')
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+  })
+
+  it('should confirm when close if auto-save is off, and unsavedPostAction is confirm', async () => {
+    const wrapper = mount(PostStatusForm, mountOpts({
+      props: {
+        closeable: true
+      }
+    }))
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'autoSaveDraft',
+      value: false
+    })
+    await wrapper.vm.$store.dispatch('setOption', {
+      name: 'unsavedPostAction',
+      value: 'confirm'
+    })
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(0)
+    const textarea = wrapper.get('textarea')
+    await textarea.setValue('mew mew')
+    wrapper.vm.requestClose()
+    await nextTick()
+    const saveButton = wrapper.findByText('button', $t('post_status.close_confirm_save_button'))
+    expect(saveButton).to.be.ok
+    await saveButton.trigger('click')
+    console.log('clicked')
+    expect(wrapper.vm.$store.getters.draftCount).to.equal(1)
+    await flushPromises()
+    await waitForEvent(wrapper, 'can-close')
+  })
+})
diff --git a/test/unit/specs/components/emoji_input.spec.js b/test/unit/specs/components/emoji_input.spec.js
index 03deece38..8f4a6c6f9 100644
--- a/test/unit/specs/components/emoji_input.spec.js
+++ b/test/unit/specs/components/emoji_input.spec.js
@@ -18,7 +18,13 @@ const generateInput = (value, padEmoji = true) => {
         $t: (msg) => msg
       },
       stubs: {
-        FAIcon: true
+        FAIcon: true,
+        Popover: {
+          template: `<div><slot trigger /></div>`,
+          methods: {
+            updateStyles () {}
+          }
+        }
       },
       directives: {
         'click-outside': vClickOutside
@@ -104,43 +110,37 @@ describe('EmojiInput', () => {
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('Eat some spam!:spam:')
     })
 
-    it('correctly sets caret after insertion at beginning', (done) => {
+    it('correctly sets caret after insertion at beginning', async () => {
       const initialString = '1234'
       const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: 0 })
       wrapper.vm.insert({ insertion: '1234', keepOpen: false })
-      wrapper.vm.$nextTick(() => {
-        expect(wrapper.vm.caret).to.eql(5)
-        done()
-      })
+      await wrapper.vm.$nextTick()
+      expect(wrapper.vm.caret).to.eql(5)
     })
 
-    it('correctly sets caret after insertion at end', (done) => {
+    it('correctly sets caret after insertion at end', async () => {
       const initialString = '1234'
       const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length })
       wrapper.vm.insert({ insertion: '1234', keepOpen: false })
-      wrapper.vm.$nextTick(() => {
-        expect(wrapper.vm.caret).to.eql(10)
-        done()
-      })
+      await wrapper.vm.$nextTick()
+      expect(wrapper.vm.caret).to.eql(10)
     })
 
-    it('correctly sets caret after insertion if padEmoji setting is set to false', (done) => {
+    it('correctly sets caret after insertion if padEmoji setting is set to false', async () => {
       const initialString = '1234'
       const wrapper = generateInput(initialString, false)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length })
       wrapper.vm.insert({ insertion: '1234', keepOpen: false })
-      wrapper.vm.$nextTick(() => {
-        expect(wrapper.vm.caret).to.eql(8)
-        done()
-      })
+      await wrapper.vm.$nextTick()
+      expect(wrapper.vm.caret).to.eql(8)
     })
   })
 })
diff --git a/test/unit/specs/components/rich_content.spec.js b/test/unit/specs/components/rich_content.spec.js
index 427eb5ed0..3234edba0 100644
--- a/test/unit/specs/components/rich_content.spec.js
+++ b/test/unit/specs/components/rich_content.spec.js
@@ -218,7 +218,7 @@ describe('RichContent', () => {
     const html = p('Ebin :DDDD :spurdo:')
     const expected = p(
       'Ebin :DDDD ',
-      '<anonymous-stub src="about:blank" alt=":spurdo:" class="emoji img" title=":spurdo:"></anonymous-stub>'
+      '<anonymous-stub shortcode="spurdo" islocal="true" class="emoji img" src="about:blank" title=":spurdo:" alt=":spurdo:"></anonymous-stub>'
     )
 
     const wrapper = shallowMount(RichContent, {
@@ -539,7 +539,6 @@ describe('RichContent', () => {
       `,
       props: ['handleLinks', 'attentions', 'vhtml']
     }
-    console.log(1)
 
     const ptest = (handleLinks, vhtml) => {
       const t0 = performance.now()
@@ -562,11 +561,11 @@ describe('RichContent', () => {
       return `Mount: ${t1 - t0}ms, destroy: ${t2 - t1}ms, avg ${(t1 - t0) / amount}ms - ${(t2 - t1) / amount}ms per item`
     }
 
-    console.log(`${amount} items with links handling:`)
-    console.log(ptest(true))
-    console.log(`${amount} items without links handling:`)
-    console.log(ptest(false))
-    console.log(`${amount} items plain v-html:`)
-    console.log(ptest(false, true))
+    console.debug(`${amount} items with links handling:`)
+    console.debug(ptest(true))
+    console.debug(`${amount} items without links handling:`)
+    console.debug(ptest(false))
+    console.debug(`${amount} items plain v-html:`)
+    console.debug(ptest(false, true))
   })
 })
diff --git a/test/unit/specs/components/user_profile.spec.js b/test/unit/specs/components/user_profile.spec.js
index dc0b938aa..022bcf393 100644
--- a/test/unit/specs/components/user_profile.spec.js
+++ b/test/unit/specs/components/user_profile.spec.js
@@ -17,7 +17,7 @@ const testGetters = {
   findUser: state => getters.findUser(state.users),
   findUserByName: state => getters.findUserByName(state.users),
   relationship: state => getters.relationship(state.users),
-  mergedConfig: state => ({
+  mergedConfig: () => ({
     colors: '',
     highlight: {},
     customTheme: {
diff --git a/test/unit/specs/lib/persisted_state.spec.js b/test/unit/specs/lib/persisted_state.spec.js
new file mode 100644
index 000000000..95bbbc4b7
--- /dev/null
+++ b/test/unit/specs/lib/persisted_state.spec.js
@@ -0,0 +1,307 @@
+import { setActivePinia, createPinia, defineStore } from 'pinia'
+import { createApp } from 'vue'
+import { flushPromises } from '@vue/test-utils'
+import { piniaPersistPlugin } from 'src/lib/persisted_state.js'
+
+const app = createApp({})
+
+const getMockStorage = () => {
+  let state = {}
+
+  return {
+    getItem: vi.fn(async key => {
+      console.log('get:', key, state[key])
+      return state[key]
+    }),
+    setItem: vi.fn(async (key, value) => {
+      console.log('set:', key, value)
+      state[key] = value
+    }),
+    _clear: () => {
+      state = {}
+    }
+  }
+}
+
+let mockStorage
+
+beforeEach(() => {
+  mockStorage = getMockStorage()
+  const pinia = createPinia().use(piniaPersistPlugin({ storage: mockStorage }))
+  app.use(pinia)
+  setActivePinia(pinia)
+})
+
+describe('piniaPersistPlugin', () => {
+  describe('initial state', () => {
+    test('it does not load anything if it is not enabled', async () => {
+      await mockStorage.setItem('pinia-local-test', { a: 3 })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 })
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(test.a).to.eql(1)
+      expect(test.b).to.eql(2)
+    })
+
+    test('$persistLoaded rejects if getItem() throws', async () => {
+      const error = new Error('unable to get storage')
+      mockStorage.getItem = vi.fn(async () => {
+        throw error
+      })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2, c: { d: 4, e: 5 } }),
+        persist: {}
+      })
+
+      const test = useTestStore()
+      await expect(test.$persistLoaded).rejects.toThrowError(error)
+    })
+
+    test('it loads from pinia storage', async () => {
+      await mockStorage.setItem('pinia-local-test', { a: 3, c: { d: 0 } })
+      await mockStorage.setItem('vuex-lz', { test: { a: 4 } })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2, c: { d: 4, e: 5 } }),
+        persist: {}
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(test.a).to.eql(3)
+      expect(test.b).to.eql(2)
+      expect(test.c.d).to.eql(0)
+      expect(test.c.e).to.eql(5)
+    })
+
+    test('it loads from vuex storage as fallback', async () => {
+      await mockStorage.setItem('vuex-lz', { test: { a: 4, c: { d: 0 } } })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2, c: { d: 4, e: 5 } }),
+        persist: {}
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(test.a).to.eql(4)
+      expect(test.b).to.eql(2)
+      expect(test.c.d).to.eql(0)
+      expect(test.c.e).to.eql(5)
+    })
+
+    test('it loads from vuex storage and writes it into pinia storage', async () => {
+      await mockStorage.setItem('vuex-lz', { test: { a: 4, c: { d: 0 } } })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2, c: { d: 4, e: 5 } }),
+        persist: {
+          afterLoad (state) {
+            return {
+              ...state,
+              a: 5
+            }
+          }
+        }
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 4, c: { d: 0 } })
+      expect(test.a).to.eql(5)
+      expect(test.b).to.eql(2)
+      expect(test.c.d).to.eql(0)
+      expect(test.c.e).to.eql(5)
+    })
+
+    test('it does not modify state if there is nothing to load', async () => {
+      await mockStorage.setItem('vuex-lz', { test2: { a: 4 } })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        persist: {}
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(test.a).to.eql(1)
+      expect(test.b).to.eql(2)
+    })
+  })
+
+  describe('paths', () => {
+    test('it saves everything if paths is unspecified', async () => {
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        persist: {}
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      test.$patch({ a: 3 })
+      await flushPromises()
+      expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 3, b: 2 })
+    })
+
+    test('it saves only specified paths', async () => {
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2, c: { d: 4, e: 5 } }),
+        persist: {
+          paths: ['a', 'c.d']
+        }
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      test.$patch({ a: 3 })
+      await flushPromises()
+      expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 3, c: { d: 4 } })
+    })
+  })
+
+  test('it only saves after load', async () => {
+    const onSaveError = vi.fn()
+    const onSaveSuccess = vi.fn()
+    const useTestStore = defineStore('test', {
+      state: () => ({ a: 1, b: 2 }),
+      persist: {
+        onSaveSuccess,
+        onSaveError
+      }
+    })
+
+    const test = useTestStore()
+    test.$patch({ a: 3 })
+    expect(await mockStorage.getItem('pinia-local-test')).to.eql(undefined)
+    // NOTE: it should not even have tried to save, because the subscribe function
+    // is called only after loading the initial state.
+    expect(mockStorage.setItem).not.toHaveBeenCalled()
+    // this asserts that it has not called setState() in persistCurrentState()
+    expect(onSaveError).not.toHaveBeenCalled()
+    expect(onSaveSuccess).not.toHaveBeenCalled()
+    await test.$persistLoaded
+    test.$patch({ a: 4 })
+    expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 4, b: 2 })
+  })
+
+  describe('saveImmediatelyActions', () => {
+    test('it should only persist state after specified actions', async () => {
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        actions: {
+          increaseA () {
+            ++this.a
+          },
+          increaseB () {
+            ++this.b
+          }
+        },
+        persist: {
+          saveImmediatelyActions: ['increaseA']
+        }
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      await test.increaseA()
+      expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 2, b: 2 })
+      await test.increaseB()
+      expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 2, b: 2 })
+      await test.increaseA()
+      expect(await mockStorage.getItem('pinia-local-test')).to.eql({ a: 3, b: 3 })
+    })
+  })
+
+  describe('onSaveSuccess / onSaveError', () => {
+    test('onSaveSuccess is called after setState', async () => {
+      const onSaveSuccess = vi.fn()
+      const onSaveError = vi.fn()
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        persist: {
+          onSaveSuccess,
+          onSaveError
+        }
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      test.$patch({ a: 3 })
+      await flushPromises()
+      expect(onSaveSuccess).toHaveBeenCalledTimes(1)
+      expect(onSaveError).toHaveBeenCalledTimes(0)
+      test.$patch({ a: 4 })
+      await flushPromises()
+      expect(onSaveSuccess).toHaveBeenCalledTimes(2)
+      expect(onSaveError).toHaveBeenCalledTimes(0)
+    })
+
+    test('onSaveError is called after setState fails', async () => {
+      mockStorage.setItem = vi.fn(async () => {
+        throw new Error('cannot save')
+      })
+      const onSaveSuccess = vi.fn()
+      const onSaveError = vi.fn()
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        persist: {
+          onSaveSuccess,
+          onSaveError
+        }
+      })
+
+      const test = useTestStore()
+      await test.$persistLoaded
+      await test.$patch({ a: 3 })
+      expect(onSaveSuccess).toHaveBeenCalledTimes(0)
+      expect(onSaveError).toHaveBeenCalledTimes(1)
+      await test.$patch({ a: 4 })
+      expect(onSaveSuccess).toHaveBeenCalledTimes(0)
+      expect(onSaveError).toHaveBeenCalledTimes(2)
+    })
+  })
+
+  describe('afterLoad', () => {
+    test('it is called with the saved state object', async () => {
+      await mockStorage.setItem('pinia-local-test', { a: 2 })
+      const afterLoad = vi.fn(async orig => {
+        return { a: orig.a + 1 }
+      })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        persist: {
+          afterLoad
+        }
+      })
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(afterLoad).toHaveBeenCalledTimes(1)
+      expect(afterLoad).toHaveBeenCalledWith({ a: 2 })
+      expect(test.a).to.eql(3)
+    })
+
+    test('it is called with empty object if there is no saved state', async () => {
+      const afterLoad = vi.fn(async () => {
+        return { a: 3 }
+      })
+
+      const useTestStore = defineStore('test', {
+        state: () => ({ a: 1, b: 2 }),
+        persist: {
+          afterLoad
+        }
+      })
+      const test = useTestStore()
+      await test.$persistLoaded
+      expect(afterLoad).toHaveBeenCalledTimes(1)
+      expect(afterLoad).toHaveBeenCalledWith({})
+      expect(test.a).to.eql(3)
+    })
+  })
+})
diff --git a/test/unit/specs/modules/lists.spec.js b/test/unit/specs/modules/lists.spec.js
deleted file mode 100644
index e43106eac..000000000
--- a/test/unit/specs/modules/lists.spec.js
+++ /dev/null
@@ -1,83 +0,0 @@
-import { cloneDeep } from 'lodash'
-import { defaultState, mutations, getters } from '../../../../src/modules/lists.js'
-
-describe('The lists module', () => {
-  describe('mutations', () => {
-    it('updates array of all lists', () => {
-      const state = cloneDeep(defaultState)
-      const list = { id: '1', title: 'testList' }
-
-      mutations.setLists(state, [list])
-      expect(state.allLists).to.have.length(1)
-      expect(state.allLists).to.eql([list])
-    })
-
-    it('adds a new list with a title, updating the title for existing lists', () => {
-      const state = cloneDeep(defaultState)
-      const list = { id: '1', title: 'testList' }
-      const modList = { id: '1', title: 'anotherTestTitle' }
-
-      mutations.setList(state, { listId: list.id, title: list.title })
-      expect(state.allListsObject[list.id]).to.eql({ title: list.title, accountIds: [] })
-      expect(state.allLists).to.have.length(1)
-      expect(state.allLists[0]).to.eql(list)
-
-      mutations.setList(state, { listId: modList.id, title: modList.title })
-      expect(state.allListsObject[modList.id]).to.eql({ title: modList.title, accountIds: [] })
-      expect(state.allLists).to.have.length(1)
-      expect(state.allLists[0]).to.eql(modList)
-    })
-
-    it('adds a new list with an array of IDs, updating the IDs for existing lists', () => {
-      const state = cloneDeep(defaultState)
-      const list = { id: '1', accountIds: ['1', '2', '3'] }
-      const modList = { id: '1', accountIds: ['3', '4', '5'] }
-
-      mutations.setListAccounts(state, { listId: list.id, accountIds: list.accountIds })
-      expect(state.allListsObject[list.id]).to.eql({ accountIds: list.accountIds })
-
-      mutations.setListAccounts(state, { listId: modList.id, accountIds: modList.accountIds })
-      expect(state.allListsObject[modList.id]).to.eql({ accountIds: modList.accountIds })
-    })
-
-    it('deletes a list', () => {
-      const state = {
-        allLists: [{ id: '1', title: 'testList' }],
-        allListsObject: {
-          1: { title: 'testList', accountIds: ['1', '2', '3'] }
-        }
-      }
-      const listId = '1'
-
-      mutations.deleteList(state, { listId })
-      expect(state.allLists).to.have.length(0)
-      expect(state.allListsObject).to.eql({})
-    })
-  })
-
-  describe('getters', () => {
-    it('returns list title', () => {
-      const state = {
-        allLists: [{ id: '1', title: 'testList' }],
-        allListsObject: {
-          1: { title: 'testList', accountIds: ['1', '2', '3'] }
-        }
-      }
-      const id = '1'
-
-      expect(getters.findListTitle(state)(id)).to.eql('testList')
-    })
-
-    it('returns list accounts', () => {
-      const state = {
-        allLists: [{ id: '1', title: 'testList' }],
-        allListsObject: {
-          1: { title: 'testList', accountIds: ['1', '2', '3'] }
-        }
-      }
-      const id = '1'
-
-      expect(getters.findListAccounts(state)(id)).to.eql(['1', '2', '3'])
-    })
-  })
-})
diff --git a/test/unit/specs/modules/serverSideStorage.spec.js b/test/unit/specs/modules/serverSideStorage.spec.js
index 2e43263ae..607bf9263 100644
--- a/test/unit/specs/modules/serverSideStorage.spec.js
+++ b/test/unit/specs/modules/serverSideStorage.spec.js
@@ -1,4 +1,5 @@
 import { cloneDeep } from 'lodash'
+import { setActivePinia, createPinia } from 'pinia'
 
 import {
   VERSION,
@@ -10,49 +11,50 @@ import {
   _mergeFlags,
   _mergePrefs,
   _resetFlags,
-  mutations,
   defaultState,
-  newUserFlags
-} from 'src/modules/serverSideStorage.js'
+  newUserFlags,
+  useServerSideStorageStore,
+} from 'src/stores/serverSideStorage.js'
 
 describe('The serverSideStorage module', () => {
+  beforeEach(() => {
+    setActivePinia(createPinia())
+  })
+
   describe('mutations', () => {
     describe('setServerSideStorage', () => {
-      const { setServerSideStorage } = mutations
       const user = {
         created_at: new Date('1999-02-09'),
         storage: {}
       }
 
       it('should initialize storage if none present', () => {
-        const state = cloneDeep(defaultState)
-        setServerSideStorage(state, user)
-        expect(state.cache._version).to.eql(VERSION)
-        expect(state.cache._timestamp).to.be.a('number')
-        expect(state.cache.flagStorage).to.eql(defaultState.flagStorage)
-        expect(state.cache.prefsStorage).to.eql(defaultState.prefsStorage)
+        const store = useServerSideStorageStore()
+        store.setServerSideStorage(store, user)
+        expect(store.cache._version).to.eql(VERSION)
+        expect(store.cache._timestamp).to.be.a('number')
+        expect(store.cache.flagStorage).to.eql(defaultState.flagStorage)
+        expect(store.cache.prefsStorage).to.eql(defaultState.prefsStorage)
       })
 
       it('should initialize storage with proper flags for new users if none present', () => {
-        const state = cloneDeep(defaultState)
-        setServerSideStorage(state, { ...user, created_at: new Date() })
-        expect(state.cache._version).to.eql(VERSION)
-        expect(state.cache._timestamp).to.be.a('number')
-        expect(state.cache.flagStorage).to.eql(newUserFlags)
-        expect(state.cache.prefsStorage).to.eql(defaultState.prefsStorage)
+        const store = useServerSideStorageStore()
+        store.setServerSideStorage({ ...user, created_at: new Date() })
+        expect(store.cache._version).to.eql(VERSION)
+        expect(store.cache._timestamp).to.be.a('number')
+        expect(store.cache.flagStorage).to.eql(newUserFlags)
+        expect(store.cache.prefsStorage).to.eql(defaultState.prefsStorage)
       })
 
       it('should merge flags even if remote timestamp is older', () => {
-        const state = {
-          ...cloneDeep(defaultState),
-          cache: {
-            _timestamp: Date.now(),
-            _version: VERSION,
-            ...cloneDeep(defaultState)
-          }
+        const store = useServerSideStorageStore()
+        store.cache = {
+          _timestamp: Date.now(),
+          _version: VERSION,
+          ...cloneDeep(defaultState)
         }
-        setServerSideStorage(
-          state,
+
+        store.setServerSideStorage(
           {
             ...user,
             storage: {
@@ -68,19 +70,18 @@ describe('The serverSideStorage module', () => {
             }
           }
         )
-        expect(state.cache.flagStorage).to.eql({
+
+        expect(store.cache.flagStorage).to.eql({
           ...defaultState.flagStorage,
           updateCounter: 1
         })
       })
 
       it('should reset local timestamp to remote if contents are the same', () => {
-        const state = {
-          ...cloneDeep(defaultState),
-          cache: null
-        }
-        setServerSideStorage(
-          state,
+        const store = useServerSideStorageStore()
+        store.cache = null
+
+        store.setServerSideStorage(
           {
             ...user,
             storage: {
@@ -93,72 +94,95 @@ describe('The serverSideStorage module', () => {
             }
           }
         )
-        expect(state.cache._timestamp).to.eql(123)
-        expect(state.flagStorage.updateCounter).to.eql(999)
-        expect(state.cache.flagStorage.updateCounter).to.eql(999)
+        expect(store.cache._timestamp).to.eql(123)
+        expect(store.flagStorage.updateCounter).to.eql(999)
+        expect(store.cache.flagStorage.updateCounter).to.eql(999)
       })
 
       it('should remote version if local missing', () => {
-        const state = cloneDeep(defaultState)
-        setServerSideStorage(state, user)
-        expect(state.cache._version).to.eql(VERSION)
-        expect(state.cache._timestamp).to.be.a('number')
-        expect(state.cache.flagStorage).to.eql(defaultState.flagStorage)
+        const store = useServerSideStorageStore()
+        store.setServerSideStorage(store, user)
+        expect(store.cache._version).to.eql(VERSION)
+        expect(store.cache._timestamp).to.be.a('number')
+        expect(store.cache.flagStorage).to.eql(defaultState.flagStorage)
       })
     })
     describe('setPreference', () => {
-      const { setPreference, updateCache, addCollectionPreference, removeCollectionPreference } = mutations
-
       it('should set preference and update journal log accordingly', () => {
-        const state = cloneDeep(defaultState)
-        setPreference(state, { path: 'simple.testing', value: 1 })
-        expect(state.prefsStorage.simple.testing).to.eql(1)
-        expect(state.prefsStorage._journal.length).to.eql(1)
-        expect(state.prefsStorage._journal[0]).to.eql({
+        const store = useServerSideStorageStore()
+        store.setPreference({ path: 'simple.testing', value: 1 })
+        expect(store.prefsStorage.simple.testing).to.eql(1)
+        expect(store.prefsStorage._journal.length).to.eql(1)
+        expect(store.prefsStorage._journal[0]).to.eql({
           path: 'simple.testing',
           operation: 'set',
           args: [1],
           // should have A timestamp, we don't really care what it is
-          timestamp: state.prefsStorage._journal[0].timestamp
+          timestamp: store.prefsStorage._journal[0].timestamp
         })
       })
 
       it('should keep journal to a minimum', () => {
-        const state = cloneDeep(defaultState)
-        setPreference(state, { path: 'simple.testing', value: 1 })
-        setPreference(state, { path: 'simple.testing', value: 2 })
-        addCollectionPreference(state, { path: 'collections.testing', value: 2 })
-        removeCollectionPreference(state, { path: 'collections.testing', value: 2 })
-        updateCache(state, { username: 'test' })
-        expect(state.prefsStorage.simple.testing).to.eql(2)
-        expect(state.prefsStorage.collections.testing).to.eql([])
-        expect(state.prefsStorage._journal.length).to.eql(2)
-        expect(state.prefsStorage._journal[0]).to.eql({
+        const store = useServerSideStorageStore()
+        store.setPreference({ path: 'simple.testing', value: 1 })
+        store.setPreference({ path: 'simple.testing', value: 2 })
+        store.addCollectionPreference({ path: 'collections.testing', value: 2 })
+        store.removeCollectionPreference({ path: 'collections.testing', value: 2 })
+        store.updateCache({ username: 'test' })
+        expect(store.prefsStorage.simple.testing).to.eql(2)
+        expect(store.prefsStorage.collections.testing).to.eql([])
+        expect(store.prefsStorage._journal.length).to.eql(2)
+        expect(store.prefsStorage._journal[0]).to.eql({
           path: 'simple.testing',
           operation: 'set',
           args: [2],
           // should have A timestamp, we don't really care what it is
-          timestamp: state.prefsStorage._journal[0].timestamp
+          timestamp: store.prefsStorage._journal[0].timestamp
         })
-        expect(state.prefsStorage._journal[1]).to.eql({
+        expect(store.prefsStorage._journal[1]).to.eql({
           path: 'collections.testing',
           operation: 'removeFromCollection',
           args: [2],
           // should have A timestamp, we don't really care what it is
-          timestamp: state.prefsStorage._journal[1].timestamp
+          timestamp: store.prefsStorage._journal[1].timestamp
         })
       })
 
       it('should remove duplicate entries from journal', () => {
-        const state = cloneDeep(defaultState)
-        setPreference(state, { path: 'simple.testing', value: 1 })
-        setPreference(state, { path: 'simple.testing', value: 1 })
-        addCollectionPreference(state, { path: 'collections.testing', value: 2 })
-        addCollectionPreference(state, { path: 'collections.testing', value: 2 })
-        updateCache(state, { username: 'test' })
-        expect(state.prefsStorage.simple.testing).to.eql(1)
-        expect(state.prefsStorage.collections.testing).to.eql([2])
-        expect(state.prefsStorage._journal.length).to.eql(2)
+        const store = useServerSideStorageStore()
+        store.setPreference({ path: 'simple.testing', value: 1 })
+        store.setPreference({ path: 'simple.testing', value: 1 })
+        store.addCollectionPreference({ path: 'collections.testing', value: 2 })
+        store.addCollectionPreference({ path: 'collections.testing', value: 2 })
+        store.updateCache({ username: 'test' })
+        expect(store.prefsStorage.simple.testing).to.eql(1)
+        expect(store.prefsStorage.collections.testing).to.eql([2])
+        expect(store.prefsStorage._journal.length).to.eql(2)
+      })
+
+      it('should remove depth = 3 set/unset entries from journal', () => {
+        const store = useServerSideStorageStore()
+        store.setPreference({ path: 'simple.object.foo', value: 1 })
+        store.unsetPreference({ path: 'simple.object.foo' })
+        store.updateCache(store, { username: 'test' })
+        expect(store.prefsStorage.simple.object).to.not.have.property('foo')
+        expect(store.prefsStorage._journal.length).to.eql(1)
+      })
+
+      it('should not allow unsetting depth <= 2', () => {
+        const store = useServerSideStorageStore()
+        store.setPreference({ path: 'simple.object.foo', value: 1 })
+        expect(() => store.unsetPreference({ path: 'simple' })).to.throw()
+        expect(() => store.unsetPreference({ path: 'simple.object' })).to.throw()
+      })
+
+      it('should not allow (un)setting depth > 3', () => {
+        const store = useServerSideStorageStore()
+        store.setPreference({ path: 'simple.object', value: {} })
+        expect(() => store.setPreference({ path: 'simple.object.lv3', value: 1 })).to.not.throw()
+        expect(() => store.setPreference({ path: 'simple.object.lv3.lv4', value: 1})).to.throw()
+        expect(() => store.unsetPreference({ path: 'simple.object.lv3', value: 1 })).to.not.throw()
+        expect(() => store.unsetPreference({ path: 'simple.object.lv3.lv4', value: 1})).to.throw()
       })
     })
   })
@@ -176,33 +200,33 @@ describe('The serverSideStorage module', () => {
     })
     describe('_getRecentData', () => {
       it('should handle nulls correctly', () => {
-        expect(_getRecentData(null, null)).to.eql({ recent: null, stale: null, needUpload: true })
+        expect(_getRecentData(null, null, true)).to.eql({ recent: null, stale: null, needUpload: true })
       })
 
       it('doesn\'t choke on invalid data', () => {
-        expect(_getRecentData({ a: 1 }, { b: 2 })).to.eql({ recent: null, stale: null, needUpload: true })
+        expect(_getRecentData({ a: 1 }, { b: 2 }, true)).to.eql({ recent: null, stale: null, needUpload: true })
       })
 
       it('should prefer the valid non-null correctly, needUpload works properly', () => {
         const nonNull = { _version: VERSION, _timestamp: 1 }
-        expect(_getRecentData(nonNull, null)).to.eql({ recent: nonNull, stale: null, needUpload: true })
-        expect(_getRecentData(null, nonNull)).to.eql({ recent: nonNull, stale: null, needUpload: false })
+        expect(_getRecentData(nonNull, null, true)).to.eql({ recent: nonNull, stale: null, needUpload: true })
+        expect(_getRecentData(null, nonNull, true)).to.eql({ recent: nonNull, stale: null, needUpload: false })
       })
 
       it('should prefer the one with higher timestamp', () => {
         const a = { _version: VERSION, _timestamp: 1 }
         const b = { _version: VERSION, _timestamp: 2 }
 
-        expect(_getRecentData(a, b)).to.eql({ recent: b, stale: a, needUpload: false })
-        expect(_getRecentData(b, a)).to.eql({ recent: b, stale: a, needUpload: false })
+        expect(_getRecentData(a, b, true)).to.eql({ recent: b, stale: a, needUpload: false })
+        expect(_getRecentData(b, a, true)).to.eql({ recent: b, stale: a, needUpload: false })
       })
 
       it('case where both are same', () => {
         const a = { _version: VERSION, _timestamp: 3 }
         const b = { _version: VERSION, _timestamp: 3 }
 
-        expect(_getRecentData(a, b)).to.eql({ recent: b, stale: a, needUpload: false })
-        expect(_getRecentData(b, a)).to.eql({ recent: b, stale: a, needUpload: false })
+        expect(_getRecentData(a, b, true)).to.eql({ recent: b, stale: a, needUpload: false })
+        expect(_getRecentData(b, a, true)).to.eql({ recent: b, stale: a, needUpload: false })
       })
     })
 
@@ -315,6 +339,58 @@ describe('The serverSideStorage module', () => {
           ]
         })
       })
+
+      it('should work with objects', () => {
+        expect(
+          _mergePrefs(
+            // RECENT
+            {
+              simple: { lv2: { lv3: 'foo' } },
+              _journal: [
+                { path: 'simple.lv2.lv3', operation: 'set', args: ['foo'], timestamp: 2 }
+              ]
+            },
+            // STALE
+            {
+              simple: { lv2: { lv3: 'bar' } },
+              _journal: [
+                { path: 'simple.lv2.lv3', operation: 'set', args: ['bar'], timestamp: 4 }
+              ]
+            }
+          )
+        ).to.eql({
+          simple: { lv2: { lv3: 'bar' } },
+          _journal: [
+            { path: 'simple.lv2.lv3', operation: 'set', args: ['bar'], timestamp: 4 }
+          ]
+        })
+      })
+
+      it('should work with unset', () => {
+        expect(
+          _mergePrefs(
+            // RECENT
+            {
+              simple: { lv2: { lv3: 'foo' } },
+              _journal: [
+                { path: 'simple.lv2.lv3', operation: 'set', args: ['foo'], timestamp: 2 }
+              ]
+            },
+            // STALE
+            {
+              simple: { lv2: {} },
+              _journal: [
+                { path: 'simple.lv2.lv3', operation: 'unset', args: [], timestamp: 4 }
+              ]
+            }
+          )
+        ).to.eql({
+          simple: { lv2: {} },
+          _journal: [
+            { path: 'simple.lv2.lv3', operation: 'unset', args: [], timestamp: 4 }
+          ]
+        })
+      })
     })
 
     describe('_resetFlags', () => {
diff --git a/test/unit/specs/modules/statuses.spec.js b/test/unit/specs/modules/statuses.spec.js
index 0d83a9f8a..66652fa50 100644
--- a/test/unit/specs/modules/statuses.spec.js
+++ b/test/unit/specs/modules/statuses.spec.js
@@ -1,6 +1,6 @@
 import { defaultState, mutations, prepareStatus } from '../../../../src/modules/statuses.js'
 
-// eslint-disable-next-line camelcase
+ 
 const makeMockStatus = ({ id, text, type = 'status' }) => {
   return {
     id,
diff --git a/test/unit/specs/services/date_utils/date_utils.spec.js b/test/unit/specs/services/date_utils/date_utils.spec.js
index bd1efe816..951c51cd8 100644
--- a/test/unit/specs/services/date_utils/date_utils.spec.js
+++ b/test/unit/specs/services/date_utils/date_utils.spec.js
@@ -1,5 +1,8 @@
 import * as DateUtils from 'src/services/date_utils/date_utils.js'
 
+beforeEach(() => { vi.useFakeTimers() })
+afterEach(() => { vi.useRealTimers() })
+
 describe('DateUtils', () => {
   describe('relativeTime', () => {
     it('returns now with low enough amount of seconds', () => {
diff --git a/test/unit/specs/services/html_converter/html_line_converter.spec.js b/test/unit/specs/services/html_converter/html_line_converter.spec.js
index 86bd7e8b0..e0ac00d6c 100644
--- a/test/unit/specs/services/html_converter/html_line_converter.spec.js
+++ b/test/unit/specs/services/html_converter/html_line_converter.spec.js
@@ -78,7 +78,7 @@ describe('html_line_converter', () => {
     })
   })
   describe('with processor that replaces lines with word "_" should match expected line when', () => {
-    const processorReplace = (line) => '_'
+    const processorReplace = () => '_'
     it('fed with regular HTML with newlines', () => {
       const input = '1<br/>2<p class="lol">3 4</p> 5 \n 6 <p > 7 <br> 8 </p> <br>\n<br/>'
       const output = '_<br/>_<p class="lol">_</p>_\n_<p >_<br>_</p> <br>\n<br/>'
diff --git a/test/unit/specs/services/theme_data/iss_deserializer.spec.js b/test/unit/specs/services/theme_data/iss_deserializer.spec.js
index 6eb25dfe9..bc52c7f64 100644
--- a/test/unit/specs/services/theme_data/iss_deserializer.spec.js
+++ b/test/unit/specs/services/theme_data/iss_deserializer.spec.js
@@ -1,10 +1,13 @@
 import { deserialize } from 'src/services/theme_data/iss_deserializer.js'
 import { serialize } from 'src/services/theme_data/iss_serializer.js'
-const componentsContext = require.context('src', true, /\.style.js(on)?$/)
+const componentsContext = import.meta.glob(
+  ['/src/**/*.style.js', '/src/**/*.style.json'],
+  { eager: true }
+)
 
 describe('ISS (de)serialization', () => {
-  componentsContext.keys().forEach(key => {
-    const component = componentsContext(key).default
+  Object.keys(componentsContext).forEach(key => {
+    const component = componentsContext[key].default
 
     it(`(De)serialization of component ${component.name} works`, () => {
       const normalized = component.defaultRules.map(x => ({ component: component.name, ...x }))
@@ -21,17 +24,17 @@ describe('ISS (de)serialization', () => {
   const onlyComponent = componentsContext('./components/panel_header.style.js').default
   it.only(`(De)serialization of component ${onlyComponent.name} works`, () => {
     const normalized = onlyComponent.defaultRules.map(x => ({ component: onlyComponent.name, ...x }))
-    console.log('BEGIN INPUT ================')
-    console.log(normalized)
-    console.log('END INPUT ==================')
+    console.debug('BEGIN INPUT ================')
+    console.debug(normalized)
+    console.debug('END INPUT ==================')
     const serialized = serialize(normalized)
-    console.log('BEGIN SERIAL ===============')
-    console.log(serialized)
-    console.log('END SERIAL =================')
+    console.debug('BEGIN SERIAL ===============')
+    console.debug(serialized)
+    console.debug('END SERIAL =================')
     const deserialized = deserialize(serialized)
-    console.log('BEGIN DESERIALIZED =========')
-    console.log(serialized)
-    console.log('END DESERIALIZED ===========')
+    console.debug('BEGIN DESERIALIZED =========')
+    console.debug(serialized)
+    console.debug('END DESERIALIZED ===========')
 
     // for some reason comparing objects directly fails the assert
     expect(JSON.stringify(deserialized, null, 2)).to.equal(JSON.stringify(normalized, null, 2))
diff --git a/test/unit/specs/services/theme_data/sanity_checks.spec.js b/test/unit/specs/services/theme_data/sanity_checks.spec.js
index f94c6a086..b9053f377 100644
--- a/test/unit/specs/services/theme_data/sanity_checks.spec.js
+++ b/test/unit/specs/services/theme_data/sanity_checks.spec.js
@@ -16,10 +16,10 @@ const checkColors = (output) => {
 }
 
 describe('Theme Data utility functions', () => {
-  const context = require.context('static/themes/', false, /\.json$/)
-  context.keys().forEach((key) => {
+  const context = import.meta.glob('/public/static/themes/*.json', { import: 'default', eager: true })
+  Object.keys(context).forEach((key) => {
     it(`Should render all colors for ${key} properly`, () => {
-      const { theme, source } = context(key)
+      const { theme, source } = context[key]
       const data = source || theme
       const colors = getColors(data.colors, data.opacity, 1)
       checkColors(colors)
diff --git a/test/unit/specs/services/theme_data/theme_data3.spec.js b/test/unit/specs/services/theme_data/theme_data3.spec.js
index b76ea5969..0d197ec39 100644
--- a/test/unit/specs/services/theme_data/theme_data3.spec.js
+++ b/test/unit/specs/services/theme_data/theme_data3.spec.js
@@ -1,4 +1,3 @@
-// import { topoSort } from 'src/services/theme_data/theme_data.service.js'
 import {
   getAllPossibleCombinations
 } from 'src/services/theme_data/iss_utils.js'
@@ -63,8 +62,6 @@ describe('Theme Data 3', () => {
   })
 
   describe('init', function () {
-    this.timeout(5000)
-
     it('Test initialization without anything', () => {
       const out = init({ inputRuleset: [], ultimateBackgroundColor: '#DEADAF' })
 
@@ -120,6 +117,7 @@ describe('Theme Data 3', () => {
             opacity: 0.5
           }
         }],
+        onlyNormalState: true,
         ultimateBackgroundColor: '#DEADAF'
       })
 
@@ -142,9 +140,9 @@ describe('Theme Data 3', () => {
 
       */
 
-      expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.r').that.is.closeTo(88.8, 0.01)
-      expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.g').that.is.closeTo(133.2, 0.01)
-      expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.b').that.is.closeTo(134, 0.01)
+      expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.r').that.is.closeTo(111, 0.01)
+      expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.g').that.is.closeTo(150.5, 0.01)
+      expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.b').that.is.closeTo(151.5, 0.01)
     })
   })
 })
diff --git a/test/unit/specs/services/version/version.service.spec.js b/test/unit/specs/services/version/version.service.spec.js
deleted file mode 100644
index 519145ee1..000000000
--- a/test/unit/specs/services/version/version.service.spec.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { extractCommit } from 'src/services/version/version.service.js'
-
-describe('extractCommit', () => {
-  it('return short commit hash following "-g" characters', () => {
-    expect(extractCommit('1.0.0-45-g5e7aeebc')).to.eql('5e7aeebc')
-  })
-
-  it('return short commit hash without branch name', () => {
-    expect(extractCommit('1.0.0-45-g5e7aeebc-branch')).to.eql('5e7aeebc')
-  })
-})
diff --git a/test/unit/specs/stores/lists.spec.js b/test/unit/specs/stores/lists.spec.js
new file mode 100644
index 000000000..992355a7f
--- /dev/null
+++ b/test/unit/specs/stores/lists.spec.js
@@ -0,0 +1,93 @@
+import { createPinia, setActivePinia } from 'pinia'
+import { useListsStore } from 'src/stores/lists.js'
+import { createStore } from 'vuex'
+import apiModule from 'src/modules/api.js'
+
+setActivePinia(createPinia())
+const store = useListsStore()
+window.vuex = createStore({
+  modules: {
+    api: apiModule
+  }
+})
+
+describe('The lists store', () => {
+  describe('actions', () => {
+    it('updates array of all lists', () => {
+      store.$reset()
+      const list = { id: '1', title: 'testList' }
+
+      store.setLists([list])
+      expect(store.allLists).to.have.length(1)
+      expect(store.allLists).to.eql([list])
+    })
+
+    it('adds a new list with a title, updating the title for existing lists', () => {
+      store.$reset()
+      const list = { id: '1', title: 'testList' }
+      const modList = { id: '1', title: 'anotherTestTitle' }
+
+      store.setList({ listId: list.id, title: list.title })
+      expect(store.allListsObject[list.id]).to.eql({ title: list.title, accountIds: [] })
+      expect(store.allLists).to.have.length(1)
+      expect(store.allLists[0]).to.eql(list)
+
+      store.setList({ listId: modList.id, title: modList.title })
+      expect(store.allListsObject[modList.id]).to.eql({ title: modList.title, accountIds: [] })
+      expect(store.allLists).to.have.length(1)
+      expect(store.allLists[0]).to.eql(modList)
+    })
+
+    it('adds a new list with an array of IDs, updating the IDs for existing lists', () => {
+      store.$reset()
+      const list = { id: '1', accountIds: ['1', '2', '3'] }
+      const modList = { id: '1', accountIds: ['3', '4', '5'] }
+
+      store.setListAccounts({ listId: list.id, accountIds: list.accountIds })
+      expect(store.allListsObject[list.id].accountIds).to.eql(list.accountIds)
+
+      store.setListAccounts({ listId: modList.id, accountIds: modList.accountIds })
+      expect(store.allListsObject[modList.id].accountIds).to.eql(modList.accountIds)
+    })
+
+    it('deletes a list', () => {
+      store.$patch({
+        allLists: [{ id: '1', title: 'testList' }],
+        allListsObject: {
+          1: { title: 'testList', accountIds: ['1', '2', '3'] }
+        }
+      })
+      const listId = '1'
+
+      store.deleteList({ listId })
+      expect(store.allLists).to.have.length(0)
+      expect(store.allListsObject).to.eql({})
+    })
+  })
+
+  describe('getters', () => {
+    it('returns list title', () => {
+      store.$patch({
+        allLists: [{ id: '1', title: 'testList' }],
+        allListsObject: {
+          1: { title: 'testList', accountIds: ['1', '2', '3'] }
+        }
+      })
+      const id = '1'
+
+      expect(store.findListTitle(id)).to.eql('testList')
+    })
+
+    it('returns list accounts', () => {
+      store.$patch({
+        allLists: [{ id: '1', title: 'testList' }],
+        allListsObject: {
+          1: { title: 'testList', accountIds: ['1', '2', '3'] }
+        }
+      })
+      const id = '1'
+
+      expect(store.findListAccounts(id)).to.eql(['1', '2', '3'])
+    })
+  })
+})
diff --git a/test/unit/specs/stores/oauth.spec.js b/test/unit/specs/stores/oauth.spec.js
new file mode 100644
index 000000000..309fddde2
--- /dev/null
+++ b/test/unit/specs/stores/oauth.spec.js
@@ -0,0 +1,202 @@
+import { createApp } from 'vue'
+import { createStore } from 'vuex'
+import { createPinia, setActivePinia } from 'pinia'
+import { http, HttpResponse } from 'msw'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { injectMswToTest, authApis, testServer } from '/test/fixtures/mock_api.js'
+
+const test = injectMswToTest(authApis)
+
+const vuexStore = createStore({
+  modules: {
+    instance: {
+      state: () => ({ server: testServer })
+    }
+  }
+})
+const app = createApp({})
+app.use(vuexStore)
+window.vuex = vuexStore
+
+const getStore = (defaultStateInjection) => {
+  const pinia = createPinia().use(({ store }) => {
+    if (store.$id === 'oauth') {
+      store.$patch(defaultStateInjection)
+    }
+  })
+  app.use(pinia)
+  setActivePinia(pinia)
+  return useOAuthStore()
+}
+
+
+describe('createApp', () => {
+  test('it should use create an app and record client id and secret', async () => {
+    const store = getStore()
+    const app = await store.createApp()
+    expect(store.clientId).to.eql('test-id')
+    expect(store.clientSecret).to.eql('test-secret')
+    expect(app.clientId).to.eql('test-id')
+    expect(app.clientSecret).to.eql('test-secret')
+  })
+
+  test('it should throw and not update if failed', async ({ worker }) => {
+    worker.use(
+      http.post(`${testServer}/api/v1/apps`, () => {
+        return HttpResponse.text('Throttled', { status: 429 })
+      })
+    )
+
+    const store = getStore()
+    const res = store.createApp()
+    await expect(res).rejects.toThrowError('Throttled')
+    expect(store.clientId).to.eql(false)
+    expect(store.clientSecret).to.eql(false)
+  })
+})
+
+describe('ensureApp', () => {
+  test('it should create an app if it does not exist', async () => {
+    const store = getStore()
+    const app = await store.ensureApp()
+    expect(store.clientId).to.eql('test-id')
+    expect(store.clientSecret).to.eql('test-secret')
+    expect(app.clientId).to.eql('test-id')
+    expect(app.clientSecret).to.eql('test-secret')
+  })
+
+  test('it should not create an app if it exists', async ({ worker }) => {
+    worker.use(
+      http.post(`${testServer}/api/v1/apps`, () => {
+        return HttpResponse.text('Should not call this API', { status: 400 })
+      })
+    )
+
+    const store = getStore({
+      clientId: 'another-id',
+      clientSecret: 'another-secret'
+    })
+    const app = await store.ensureApp()
+    expect(store.clientId).to.eql('another-id')
+    expect(store.clientSecret).to.eql('another-secret')
+    expect(app.clientId).to.eql('another-id')
+    expect(app.clientSecret).to.eql('another-secret')
+  })
+})
+
+describe('getAppToken', () => {
+  test('it should get app token and set it in state', async () => {
+    const store = getStore({
+      clientId: 'test-id',
+      clientSecret: 'test-secret'
+    })
+    const token = await store.getAppToken()
+    expect(token).to.eql('test-app-token')
+    expect(store.appToken).to.eql('test-app-token')
+  })
+
+  test('it should throw and not set state if it cannot get app token', async () => {
+    const store = getStore({
+      clientId: 'bad-id',
+      clientSecret: 'bad-secret'
+    })
+    await expect(store.getAppToken()).rejects.toThrowError('400')
+    expect(store.appToken).to.eql(false)
+  })
+})
+
+describe('ensureAppToken', () => {
+  test('it should work if the state is empty', async () => {
+    const store = getStore()
+    const token = await store.ensureAppToken()
+    expect(token).to.eql('test-app-token')
+    expect(store.appToken).to.eql('test-app-token')
+  })
+
+  test('it should work if we already have a working token', async () => {
+    const store = getStore({
+      appToken: 'also-good-app-token'
+    })
+    const token = await store.ensureAppToken()
+    expect(token).to.eql('also-good-app-token')
+    expect(store.appToken).to.eql('also-good-app-token')
+  })
+
+  test('it should work if we have a bad token but good app credentials', async ({ worker }) => {
+    worker.use(
+      http.post(`${testServer}/api/v1/apps`, () => {
+        return HttpResponse.text('Should not call this API', { status: 400 })
+      })
+    )
+    const store = getStore({
+      appToken: 'bad-app-token',
+      clientId: 'test-id',
+      clientSecret: 'test-secret'
+    })
+    const token = await store.ensureAppToken()
+    expect(token).to.eql('test-app-token')
+    expect(store.appToken).to.eql('test-app-token')
+  })
+
+  test('it should work if we have no token but good app credentials', async ({ worker }) => {
+    worker.use(
+      http.post(`${testServer}/api/v1/apps`, () => {
+        return HttpResponse.text('Should not call this API', { status: 400 })
+      })
+    )
+    const store = getStore({
+      clientId: 'test-id',
+      clientSecret: 'test-secret'
+    })
+    const token = await store.ensureAppToken()
+    expect(token).to.eql('test-app-token')
+    expect(store.appToken).to.eql('test-app-token')
+  })
+
+  test('it should work if we have no token and bad app credentials', async () => {
+    const store = getStore({
+      clientId: 'bad-id',
+      clientSecret: 'bad-secret'
+    })
+    const token = await store.ensureAppToken()
+    expect(token).to.eql('test-app-token')
+    expect(store.appToken).to.eql('test-app-token')
+    expect(store.clientId).to.eql('test-id')
+    expect(store.clientSecret).to.eql('test-secret')
+  })
+
+  test('it should work if we have bad token and bad app credentials', async () => {
+    const store = getStore({
+      appToken: 'bad-app-token',
+      clientId: 'bad-id',
+      clientSecret: 'bad-secret'
+    })
+    const token = await store.ensureAppToken()
+    expect(token).to.eql('test-app-token')
+    expect(store.appToken).to.eql('test-app-token')
+    expect(store.clientId).to.eql('test-id')
+    expect(store.clientSecret).to.eql('test-secret')
+  })
+
+  test('it should throw if we cannot create an app', async ({ worker }) => {
+    worker.use(
+      http.post(`${testServer}/api/v1/apps`, () => {
+        return HttpResponse.text('Throttled', { status: 429 })
+      })
+    )
+
+    const store = getStore()
+    await expect(store.ensureAppToken()).rejects.toThrowError('Throttled')
+  })
+
+  test('it should throw if we cannot obtain app token', async ({ worker }) => {
+    worker.use(
+      http.post(`${testServer}/oauth/token`, () => {
+        return HttpResponse.text('Throttled', { status: 429 })
+      })
+    )
+
+    const store = getStore()
+    await expect(store.ensureAppToken()).rejects.toThrowError('Throttled')
+  })
+})
diff --git a/tools/emoji_merger.js b/tools/emoji_merger.js
index a74e847ed..4d3039612 100644
--- a/tools/emoji_merger.js
+++ b/tools/emoji_merger.js
@@ -9,7 +9,7 @@
 */
 
 // Existing emojis we have
-const oldEmojiFilename = '../static/emoji.json'
+const oldEmojiFilename = '../src/assets/emoji.json'
 
 // The file downloaded from https://gist.github.com/oliveratgithub/0bf11a9aff0d6da7b46f1490f86a71eb
 const newEmojiFilename = 'emojis.json'
@@ -60,7 +60,7 @@ const run = () => {
   }, {})
 
   fs.writeFile(outputFilename, JSON.stringify(sorted, null, 2), 'utf8', (err) => {
-    if (err) console.log('Error writing file', err)
+    if (err) console.error('Error writing file', err)
   })
 }
 
diff --git a/vite.config.js b/vite.config.js
new file mode 100644
index 000000000..0b4d0db90
--- /dev/null
+++ b/vite.config.js
@@ -0,0 +1,216 @@
+import { fileURLToPath } from 'node:url'
+import { dirname, resolve } from 'node:path'
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import vueJsx from '@vitejs/plugin-vue-jsx'
+import stylelint from 'vite-plugin-stylelint'
+import eslint from 'vite-plugin-eslint2'
+import emojisPlugin from './build/emojis_plugin.js'
+import { devSwPlugin, buildSwPlugin, swMessagesPlugin } from './build/sw_plugin.js'
+import copyPlugin from './build/copy_plugin.js'
+import { getCommitHash } from './build/commit_hash.js'
+import mswPlugin from './build/msw_plugin.js'
+
+const localConfigPath = '<projectRoot>/config/local.json'
+const getLocalDevSettings = async () => {
+  try {
+    const settings = (await import('./config/local.json')).default
+    if (settings.target && settings.target.endsWith('/')) {
+      // replacing trailing slash since it can conflict with some apis
+      // and that's how actual BE reports its url
+      settings.target = settings.target.replace(/\/$/, '')
+    }
+    console.info(`Using local dev server settings (${localConfigPath}):`)
+    console.info(JSON.stringify(settings, null, 2))
+    return settings
+  } catch (e) {
+    console.info(`Local dev server settings not found (${localConfigPath}), using default`, e)
+    return {}
+  }
+}
+
+const projectRoot = dirname(fileURLToPath(import.meta.url))
+
+const getTransformSWSettings = (settings) => {
+  if ('transformSW' in settings) {
+    return settings.transformSW
+  } else {
+    console.info(
+      '`transformSW` is not present in your local settings.\n' +
+        'This option controls whether the service worker should be bundled and transformed into iife (immediately-invoked function expression) during development.\n' +
+        'If set to false, the service worker will be served as-is, as an ES Module.\n' +
+        'Some browsers (e.g. Firefox) does not support ESM service workers.\n' +
+        'To avoid surprises, it is defaulted to true, but this can be slow.\n' +
+        'If you are using a browser that supports ESM service workers, you can set this option to false.\n' +
+        `No matter your choice, you can set the transformSW option in ${localConfigPath} in to disable this message.`
+    )
+    return true
+  }
+}
+
+export default defineConfig(async ({ mode, command }) => {
+  const settings = await getLocalDevSettings()
+  const target = settings.target || 'http://localhost:4000/'
+  const transformSW = getTransformSWSettings(settings)
+  const proxy = {
+    '/api': {
+      target,
+      changeOrigin: true,
+      cookieDomainRewrite: 'localhost',
+      ws: true
+    },
+    '/nodeinfo': {
+      target,
+      changeOrigin: true,
+      cookieDomainRewrite: 'localhost'
+    },
+    '/socket': {
+      target,
+      changeOrigin: true,
+      cookieDomainRewrite: 'localhost',
+      ws: true,
+      headers: {
+        'Origin': target
+      }
+    },
+    '/oauth': {
+      target,
+      changeOrigin: true,
+      cookieDomainRewrite: 'localhost'
+    }
+  }
+
+  const swSrc = 'src/sw.js'
+  const swDest = 'sw-pleroma.js'
+  const alias = {
+    src: '/src',
+    components: '/src/components',
+    ...(mode === 'test' ? { vue: 'vue/dist/vue.esm-bundler.js' } : {})
+  }
+
+  return {
+    plugins: [
+      vue({
+        template: {
+          compilerOptions: {
+            isCustomElement(tag) {
+              if (tag === 'pinch-zoom') {
+                return true
+              }
+              if (tag.startsWith('cropper-')) {
+                return true
+              }
+              return false
+            }
+          }
+        }
+      }),
+      vueJsx(),
+      devSwPlugin({ swSrc, swDest, transformSW, alias }),
+      buildSwPlugin({ swSrc, swDest }),
+      swMessagesPlugin(),
+      emojisPlugin(),
+      copyPlugin({
+        inUrl: '/static/ruffle',
+        inFs: resolve(projectRoot, 'node_modules/@ruffle-rs/ruffle')
+      }),
+      eslint({
+        lintInWorker: true,
+        lintOnStart: true,
+        cacheLocation: resolve(projectRoot, 'node_modules/.cache/eslintcache')
+      }),
+      stylelint({
+        lintInWorker: true,
+        lintOnStart: true,
+        cacheLocation: resolve(projectRoot, 'node_modules/.cache/stylelintcache')
+      }),
+      ...(mode === 'test' ? [mswPlugin()] : [])
+    ],
+    optimizeDeps: {
+      // For unknown reasons, during vitest, vite will re-optimize the following
+      // deps, causing the test to reload, so add them here so that it will not
+      // reload during tests
+      include: [
+        'custom-event-polyfill',
+        'vue-i18n',
+        '@ungap/event-target',
+        'lodash.merge',
+        'body-scroll-lock',
+        '@kazvmoe-infra/pinch-zoom-element'
+      ]
+    },
+    css: {
+      devSourcemap: true
+    },
+    resolve: {
+      alias
+    },
+    define: {
+      'process.env': JSON.stringify({
+        NODE_ENV: mode === 'test' ? 'testing' : command === 'serve' ? 'development' : 'production',
+        HAS_MODULE_SERVICE_WORKER: command === 'serve' && !transformSW
+      }),
+      'COMMIT_HASH': JSON.stringify(command === 'serve' ? 'DEV' : getCommitHash()),
+      'DEV_OVERRIDES': JSON.stringify(command === 'serve' ? settings : undefined),
+      '__VUE_OPTIONS_API__': true,
+      '__VUE_PROD_DEVTOOLS__': false,
+      '__VUE_PROD_HYDRATION_MISMATCH_DETAILS__': false
+    },
+    build: {
+      sourcemap: true,
+      rollupOptions: {
+        input: {
+          main: 'index.html'
+        },
+        output: {
+          inlineDynamicImports: false,
+          entryFileNames (chunkInfo) {
+            const id = chunkInfo.facadeModuleId
+            if (id.endsWith(swSrc)) {
+              return swDest
+            } else {
+              return 'static/js/[name].[hash].js'
+            }
+          },
+          chunkFileNames (chunkInfo) {
+            if (chunkInfo.facadeModuleId) {
+              if (chunkInfo.facadeModuleId.includes('node_modules/@kazvmoe-infra/unicode-emoji-json/annotations/')) {
+                return 'static/js/emoji-annotations/[name].[hash].js'
+              } else if (chunkInfo.facadeModuleId.includes('src/i18n/')) {
+                return 'static/js/i18n/[name].[hash].js'
+              }
+            }
+            return 'static/js/[name].[hash].js'
+          },
+          assetFileNames (assetInfo) {
+            const name = assetInfo.names?.[0] || ''
+            if (/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(name)) {
+              return 'static/img/[name].[hash][extname]'
+            } else if (/\.css$/.test(name)) {
+              return 'static/css/[name].[hash][extname]'
+            } else {
+              return 'static/misc/[name].[hash][extname]'
+            }
+          }
+        }
+      },
+    },
+    server: {
+      ...(mode === 'test' ? {} : { proxy }),
+      port: Number(process.env.PORT) || 8080
+    },
+    preview: {
+      proxy
+    },
+    test: {
+      globals: true,
+      browser: {
+        enabled: true,
+        provider: 'playwright',
+        instances: [
+          { browser: 'firefox' }
+        ]
+      }
+    }
+  }
+})
diff --git a/yarn.lock b/yarn.lock
index 231e35d97..32a3b93c8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2,1716 +2,1097 @@
 # yarn lockfile v1
 
 
-"@ampproject/remapping@^2.1.0":
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.1.2.tgz#4edca94973ded9630d20101cd8559cedb8d8bd34"
-  integrity sha512-hoyByceqwKirw7w3Z7gnIIZC3Wx3J484Y3L/cMpXFbr7d9ZQj2mODrirNzcJa+SM3UlpWXYvKV4RlRpFXlWgXg==
-  dependencies:
-    "@jridgewell/trace-mapping" "^0.3.0"
-
 "@ampproject/remapping@^2.2.0":
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.0.tgz#56c133824780de3174aed5ab6834f3026790154d"
-  integrity sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.3.0.tgz#ed441b6fa600072520ce18b43d2c8cc8caecc7f4"
+  integrity sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==
   dependencies:
-    "@jridgewell/gen-mapping" "^0.1.0"
-    "@jridgewell/trace-mapping" "^0.3.9"
+    "@jridgewell/gen-mapping" "^0.3.5"
+    "@jridgewell/trace-mapping" "^0.3.24"
 
-"@babel/code-frame@7.0.0", "@babel/code-frame@^7.0.0":
+"@asamuzakjp/css-color@^3.1.1":
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/@asamuzakjp/css-color/-/css-color-3.1.1.tgz#41a612834dafd9353b89855b37baa8a03fb67bf2"
+  integrity sha512-hpRD68SV2OMcZCsrbdkccTw5FXjNDLo5OuqSHyHZfwweGsDWZwDJ2+gONyNAbazZclobMirACLw0lk8WVxIqxA==
+  dependencies:
+    "@csstools/css-calc" "^2.1.2"
+    "@csstools/css-color-parser" "^3.0.8"
+    "@csstools/css-parser-algorithms" "^3.0.4"
+    "@csstools/css-tokenizer" "^3.0.3"
+    lru-cache "^10.4.3"
+
+"@babel/code-frame@7.0.0":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.0.0.tgz#06e2ab19bdb535385559aabb5ba59729482800f8"
   integrity sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==
   dependencies:
     "@babel/highlight" "^7.0.0"
 
-"@babel/code-frame@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.18.6.tgz#3b25d38c89600baa2dcc219edfa88a74eb2c427a"
-  integrity sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==
+"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.26.2":
+  version "7.26.2"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.26.2.tgz#4b5fab97d33338eff916235055f0ebc21e573a85"
+  integrity sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==
   dependencies:
-    "@babel/highlight" "^7.18.6"
-
-"@babel/code-frame@^7.21.4":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.21.4.tgz#d0fa9e4413aca81f2b23b9442797bda1826edb39"
-  integrity sha512-LYvhNKfwWSPpocw8GI7gpK2nq3HSDuEPC/uSYaALSJu9xjsalaaYFOq0Pwt5KmVqwEbZlDu81aLXwBOmD/Fv9g==
-  dependencies:
-    "@babel/highlight" "^7.18.6"
-
-"@babel/code-frame@^7.22.13", "@babel/code-frame@^7.23.5":
-  version "7.23.5"
-  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.23.5.tgz#9009b69a8c602293476ad598ff53e4562e15c244"
-  integrity sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==
-  dependencies:
-    "@babel/highlight" "^7.23.4"
-    chalk "^2.4.2"
-
-"@babel/code-frame@^7.24.1":
-  version "7.24.2"
-  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.24.2.tgz#718b4b19841809a58b29b68cde80bc5e1aa6d9ae"
-  integrity sha512-y5+tLQyV8pg3fsiln67BVLD1P13Eg4lh5RW9mF0zUuvLrv9uIQ4MCL+CRT+FTsBlBjcIan6PGsLcBN0m3ClUyQ==
-  dependencies:
-    "@babel/highlight" "^7.24.2"
+    "@babel/helper-validator-identifier" "^7.25.9"
+    js-tokens "^4.0.0"
     picocolors "^1.0.0"
 
-"@babel/compat-data@^7.17.7":
-  version "7.17.7"
-  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.17.7.tgz#078d8b833fbbcc95286613be8c716cef2b519fa2"
-  integrity sha512-p8pdE6j0a29TNGebNm7NzYZWB3xVZJBZ7XGs42uAKzQo8VQ3F0By/cQCtUEABwIqw5zo6WA4NbmxsfzADzMKnQ==
+"@babel/code-frame@^7.10.4", "@babel/code-frame@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.27.1.tgz#200f715e66d52a23b221a9435534a91cc13ad5be"
+  integrity sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.27.1"
+    js-tokens "^4.0.0"
+    picocolors "^1.1.1"
 
-"@babel/compat-data@^7.18.8":
-  version "7.18.8"
-  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.18.8.tgz#2483f565faca607b8535590e84e7de323f27764d"
-  integrity sha512-HSmX4WZPPK3FUxYp7g2T6EyO8j96HlZJlxmKPSh6KAcqwyDrfx7hKjXpAW/0FhFfTJsR0Yt4lAjLI2coMptIHQ==
+"@babel/compat-data@^7.27.2", "@babel/compat-data@^7.27.7", "@babel/compat-data@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.28.0.tgz#9fc6fd58c2a6a15243cd13983224968392070790"
+  integrity sha512-60X7qkglvrap8mn1lh2ebxXdZYtUcpd7gsmy9kLaBJ4i/WdY8PqTSdxyA8qraikqKQK5C1KRBKXqznrVapyNaw==
 
-"@babel/compat-data@^7.20.5":
-  version "7.20.5"
-  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.20.5.tgz#86f172690b093373a933223b4745deeb6049e733"
-  integrity sha512-KZXo2t10+/jxmkhNXc7pZTqRvSOIvVv/+lJwHS+B2rErwOyjuVRh60yVpb7liQ1U5t7lLJ1bz+t8tSypUZdm0g==
+"@babel/core@7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.28.4.tgz#12a550b8794452df4c8b084f95003bce1742d496"
+  integrity sha512-2BCOP7TN8M+gVDj7/ht3hsaO/B/n5oDbiAyyvnRlNOs+u1o+JWNYTQrmpuNp1/Wq2gcFrI01JAW+paEKDMx/CA==
+  dependencies:
+    "@babel/code-frame" "^7.27.1"
+    "@babel/generator" "^7.28.3"
+    "@babel/helper-compilation-targets" "^7.27.2"
+    "@babel/helper-module-transforms" "^7.28.3"
+    "@babel/helpers" "^7.28.4"
+    "@babel/parser" "^7.28.4"
+    "@babel/template" "^7.27.2"
+    "@babel/traverse" "^7.28.4"
+    "@babel/types" "^7.28.4"
+    "@jridgewell/remapping" "^2.3.5"
+    convert-source-map "^2.0.0"
+    debug "^4.1.0"
+    gensync "^1.0.0-beta.2"
+    json5 "^2.2.3"
+    semver "^6.3.1"
 
-"@babel/compat-data@^7.21.5":
-  version "7.21.7"
-  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.21.7.tgz#61caffb60776e49a57ba61a88f02bedd8714f6bc"
-  integrity sha512-KYMqFYTaenzMK4yUtf4EW9wc4N9ef80FsbMtkwool5zpwl4YrT1SdWYSTRcT94KO4hannogdS+LxY7L+arP3gA==
-
-"@babel/core@7.21.8":
-  version "7.21.8"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.21.8.tgz#2a8c7f0f53d60100ba4c32470ba0281c92aa9aa4"
-  integrity sha512-YeM22Sondbo523Sz0+CirSPnbj9bG3P0CdHcBZdqUuaeOaYEFbOLoGU7lebvGP6P5J/WE9wOn7u7C4J9HvS1xQ==
+"@babel/core@^7.27.1":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.28.3.tgz#aceddde69c5d1def69b839d09efa3e3ff59c97cb"
+  integrity sha512-yDBHV9kQNcr2/sUr9jghVyz9C3Y5G2zUM2H2lo+9mKv4sFgbA8s8Z9t8D1jiTkGoO/NoIfKMyKWr4s6CN23ZwQ==
   dependencies:
     "@ampproject/remapping" "^2.2.0"
-    "@babel/code-frame" "^7.21.4"
-    "@babel/generator" "^7.21.5"
-    "@babel/helper-compilation-targets" "^7.21.5"
-    "@babel/helper-module-transforms" "^7.21.5"
-    "@babel/helpers" "^7.21.5"
-    "@babel/parser" "^7.21.8"
-    "@babel/template" "^7.20.7"
-    "@babel/traverse" "^7.21.5"
-    "@babel/types" "^7.21.5"
-    convert-source-map "^1.7.0"
+    "@babel/code-frame" "^7.27.1"
+    "@babel/generator" "^7.28.3"
+    "@babel/helper-compilation-targets" "^7.27.2"
+    "@babel/helper-module-transforms" "^7.28.3"
+    "@babel/helpers" "^7.28.3"
+    "@babel/parser" "^7.28.3"
+    "@babel/template" "^7.27.2"
+    "@babel/traverse" "^7.28.3"
+    "@babel/types" "^7.28.2"
+    convert-source-map "^2.0.0"
     debug "^4.1.0"
     gensync "^1.0.0-beta.2"
-    json5 "^2.2.2"
-    semver "^6.3.0"
+    json5 "^2.2.3"
+    semver "^6.3.1"
 
-"@babel/core@^7.12.3":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.18.10.tgz#39ad504991d77f1f3da91be0b8b949a5bc466fb8"
-  integrity sha512-JQM6k6ENcBFKVtWvLavlvi/mPcpYZ3+R+2EySDEMSMbp7Mn4FexlbbJVrx2R7Ijhr01T8gyqrOaABWIOgxeUyw==
-  dependencies:
-    "@ampproject/remapping" "^2.1.0"
-    "@babel/code-frame" "^7.18.6"
-    "@babel/generator" "^7.18.10"
-    "@babel/helper-compilation-targets" "^7.18.9"
-    "@babel/helper-module-transforms" "^7.18.9"
-    "@babel/helpers" "^7.18.9"
-    "@babel/parser" "^7.18.10"
-    "@babel/template" "^7.18.10"
-    "@babel/traverse" "^7.18.10"
-    "@babel/types" "^7.18.10"
-    convert-source-map "^1.7.0"
-    debug "^4.1.0"
-    gensync "^1.0.0-beta.2"
-    json5 "^2.2.1"
-    semver "^6.3.0"
-
-"@babel/eslint-parser@7.21.8":
-  version "7.21.8"
-  resolved "https://registry.yarnpkg.com/@babel/eslint-parser/-/eslint-parser-7.21.8.tgz#59fb6fc4f3b017ab86987c076226ceef7b2b2ef2"
-  integrity sha512-HLhI+2q+BP3sf78mFUZNCGc10KEmoUqtUT1OCdMZsN+qr4qFeLUod62/zAnF3jNQstwyasDkZnVXwfK2Bml7MQ==
+"@babel/eslint-parser@7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/eslint-parser/-/eslint-parser-7.28.4.tgz#80dd86e0aeaae9704411a044db60e1ae6477d93f"
+  integrity sha512-Aa+yDiH87980jR6zvRfFuCR1+dLb00vBydhTL+zI992Rz/wQhSvuxjmOOuJOgO3XmakO6RykRGD2S1mq1AtgHA==
   dependencies:
     "@nicolo-ribaudo/eslint-scope-5-internals" "5.1.1-v1"
     eslint-visitor-keys "^2.1.0"
-    semver "^6.3.0"
+    semver "^6.3.1"
 
-"@babel/generator@^7.18.10":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.18.10.tgz#794f328bfabdcbaf0ebf9bf91b5b57b61fa77a2a"
-  integrity sha512-0+sW7e3HjQbiHbj1NeU/vN8ornohYlacAfZIaXhdoGweQqgcNy69COVciYYqEXJ/v+9OBA7Frxm4CVAuNqKeNA==
+"@babel/generator@^7.27.0":
+  version "7.27.0"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.27.0.tgz#764382b5392e5b9aff93cadb190d0745866cbc2c"
+  integrity sha512-VybsKvpiN1gU1sdMZIp7FcqphVVKEwcuj02x73uvcHE0PTihx1nlBcowYWhDwjpoAXRv43+gDzyggGnn1XZhVw==
   dependencies:
-    "@babel/types" "^7.18.10"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    jsesc "^2.5.1"
-
-"@babel/generator@^7.18.7":
-  version "7.18.7"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.18.7.tgz#2aa78da3c05aadfc82dbac16c99552fc802284bd"
-  integrity sha512-shck+7VLlY72a2w9c3zYWuE1pwOKEiQHV7GTUbSnhyl5eu3i04t30tBY82ZRWrDfo3gkakCFtevExnxbkf2a3A==
-  dependencies:
-    "@babel/types" "^7.18.7"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    jsesc "^2.5.1"
-
-"@babel/generator@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.18.9.tgz#68337e9ea8044d6ddc690fb29acae39359cca0a5"
-  integrity sha512-wt5Naw6lJrL1/SGkipMiFxJjtyczUWTP38deiP1PO60HsBjDeKk08CGC3S8iVuvf0FmTdgKwU1KIXzSKL1G0Ug==
-  dependencies:
-    "@babel/types" "^7.18.9"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    jsesc "^2.5.1"
-
-"@babel/generator@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.20.7.tgz#f8ef57c8242665c5929fe2e8d82ba75460187b4a"
-  integrity sha512-7wqMOJq8doJMZmP4ApXTzLxSr7+oO2jroJURrVEp6XShrQUObV8Tq/D0NCcoYg2uHqUrjzO0zwBjoYzelxK+sw==
-  dependencies:
-    "@babel/types" "^7.20.7"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    jsesc "^2.5.1"
-
-"@babel/generator@^7.21.4":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.21.4.tgz#64a94b7448989f421f919d5239ef553b37bb26bc"
-  integrity sha512-NieM3pVIYW2SwGzKoqfPrQsf4xGs9M9AIG3ThppsSRmO+m7eQhmI6amajKMUeIO37wFfsvnvcxQFx6x6iqxDnA==
-  dependencies:
-    "@babel/types" "^7.21.4"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    "@jridgewell/trace-mapping" "^0.3.17"
-    jsesc "^2.5.1"
-
-"@babel/generator@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.21.5.tgz#c0c0e5449504c7b7de8236d99338c3e2a340745f"
-  integrity sha512-SrKK/sRv8GesIW1bDagf9cCG38IOMYZusoe1dfg0D8aiUe3Amvoj1QtjTPAWcfrZFvIwlleLb0gxzQidL9w14w==
-  dependencies:
-    "@babel/types" "^7.21.5"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    "@jridgewell/trace-mapping" "^0.3.17"
-    jsesc "^2.5.1"
-
-"@babel/generator@^7.24.1":
-  version "7.24.1"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.24.1.tgz#e67e06f68568a4ebf194d1c6014235344f0476d0"
-  integrity sha512-DfCRfZsBcrPEHUfuBMgbJ1Ut01Y/itOs+hY2nFLgqsqXd52/iSiVq5TITtUasIUgm+IIKdY2/1I7auiQOEeC9A==
-  dependencies:
-    "@babel/types" "^7.24.0"
+    "@babel/parser" "^7.27.0"
+    "@babel/types" "^7.27.0"
     "@jridgewell/gen-mapping" "^0.3.5"
     "@jridgewell/trace-mapping" "^0.3.25"
-    jsesc "^2.5.1"
+    jsesc "^3.0.2"
 
-"@babel/helper-annotate-as-pure@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz#bb2339a7534a9c128e3102024c60760a3a7f3862"
-  integrity sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==
+"@babel/generator@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.28.3.tgz#9626c1741c650cbac39121694a0f2d7451b8ef3e"
+  integrity sha512-3lSpxGgvnmZznmBkCRnVREPUFJv2wrv9iAoFDvADJc0ypmdOxdUtcLeBgBJ6zE0PMeTKnxeQzyk0xTBq4Ep7zw==
   dependencies:
-    "@babel/types" "^7.16.7"
+    "@babel/parser" "^7.28.3"
+    "@babel/types" "^7.28.2"
+    "@jridgewell/gen-mapping" "^0.3.12"
+    "@jridgewell/trace-mapping" "^0.3.28"
+    jsesc "^3.0.2"
 
-"@babel/helper-annotate-as-pure@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.18.6.tgz#eaa49f6f80d5a33f9a5dd2276e6d6e451be0a6bb"
-  integrity sha512-duORpUiYrEpzKIop6iNbjnwKLAKnJ47csTyRACyEmWj0QdUrm5aqNJGHSSEQSUAvNW0ojX0dOmK9dZduvkfeXA==
+"@babel/helper-annotate-as-pure@^7.25.9":
+  version "7.25.9"
+  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.25.9.tgz#d8eac4d2dc0d7b6e11fa6e535332e0d3184f06b4"
+  integrity sha512-gv7320KBUFJz1RnylIg5WWYPRXKZ884AGkYpgpWW02TH66Dl+HaC1t1CKd0z3R4b6hdYEcmrNZHUmfCP+1u3/g==
   dependencies:
-    "@babel/types" "^7.18.6"
+    "@babel/types" "^7.25.9"
 
-"@babel/helper-builder-binary-assignment-operator-visitor@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.18.6.tgz#f14d640ed1ee9246fb33b8255f08353acfe70e6a"
-  integrity sha512-KT10c1oWEpmrIRYnthbzHgoOf6B+Xd6a5yhdbNtdhtG7aO1or5HViuf1TQR36xY/QprXA5nvxO6nAjhJ4y38jw==
+"@babel/helper-annotate-as-pure@^7.27.1", "@babel/helper-annotate-as-pure@^7.27.3":
+  version "7.27.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz#f31fd86b915fc4daf1f3ac6976c59be7084ed9c5"
+  integrity sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==
   dependencies:
-    "@babel/helper-explode-assignable-expression" "^7.18.6"
-    "@babel/types" "^7.18.6"
+    "@babel/types" "^7.27.3"
 
-"@babel/helper-compilation-targets@^7.17.7", "@babel/helper-compilation-targets@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.18.9.tgz#69e64f57b524cde3e5ff6cc5a9f4a387ee5563bf"
-  integrity sha512-tzLCyVmqUiFlcFoAPLA/gL9TeYrF61VLNtb+hvkuVaB5SUjW7jcfrglBIX1vUIoT7CLP3bBlIMeyEsIl2eFQNg==
+"@babel/helper-compilation-targets@^7.27.1", "@babel/helper-compilation-targets@^7.27.2":
+  version "7.27.2"
+  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.27.2.tgz#46a0f6efab808d51d29ce96858dd10ce8732733d"
+  integrity sha512-2+1thGUUWWjLTYTHZWK1n8Yga0ijBz1XAhUXcKy81rd5g6yh7hGqMp45v7cadSbEHc9G3OTv45SyneRN3ps4DQ==
   dependencies:
-    "@babel/compat-data" "^7.18.8"
-    "@babel/helper-validator-option" "^7.18.6"
-    browserslist "^4.20.2"
-    semver "^6.3.0"
-
-"@babel/helper-compilation-targets@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.20.7.tgz#a6cd33e93629f5eb473b021aac05df62c4cd09bb"
-  integrity sha512-4tGORmfQcrc+bvrjb5y3dG9Mx1IOZjsHqQVUz7XCNHO+iTmqxWnVg3KRygjGmpRLJGdQSKuvFinbIb0CnZwHAQ==
-  dependencies:
-    "@babel/compat-data" "^7.20.5"
-    "@babel/helper-validator-option" "^7.18.6"
-    browserslist "^4.21.3"
+    "@babel/compat-data" "^7.27.2"
+    "@babel/helper-validator-option" "^7.27.1"
+    browserslist "^4.24.0"
     lru-cache "^5.1.1"
-    semver "^6.3.0"
+    semver "^6.3.1"
 
-"@babel/helper-compilation-targets@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.21.5.tgz#631e6cc784c7b660417421349aac304c94115366"
-  integrity sha512-1RkbFGUKex4lvsB9yhIfWltJM5cZKUftB2eNajaDv3dCMEp49iBG0K14uH8NnX9IPux2+mK7JGEOB0jn48/J6w==
+"@babel/helper-create-class-features-plugin@^7.27.1", "@babel/helper-create-class-features-plugin@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.28.3.tgz#3e747434ea007910c320c4d39a6b46f20f371d46"
+  integrity sha512-V9f6ZFIYSLNEbuGA/92uOvYsGCJNsuA8ESZ4ldc09bWk/j8H8TKiPw8Mk1eG6olpnO0ALHJmYfZvF4MEE4gajg==
   dependencies:
-    "@babel/compat-data" "^7.21.5"
-    "@babel/helper-validator-option" "^7.21.0"
-    browserslist "^4.21.3"
-    lru-cache "^5.1.1"
-    semver "^6.3.0"
-
-"@babel/helper-create-class-features-plugin@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.18.6.tgz#6f15f8459f3b523b39e00a99982e2c040871ed72"
-  integrity sha512-YfDzdnoxHGV8CzqHGyCbFvXg5QESPFkXlHtvdCkesLjjVMT2Adxe4FGUR5ChIb3DxSaXO12iIOCWoXdsUVwnqw==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    "@babel/helper-environment-visitor" "^7.18.6"
-    "@babel/helper-function-name" "^7.18.6"
-    "@babel/helper-member-expression-to-functions" "^7.18.6"
-    "@babel/helper-optimise-call-expression" "^7.18.6"
-    "@babel/helper-replace-supers" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-
-"@babel/helper-create-class-features-plugin@^7.21.0":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.21.4.tgz#3a017163dc3c2ba7deb9a7950849a9586ea24c18"
-  integrity sha512-46QrX2CQlaFRF4TkwfTt6nJD7IHq8539cCL7SDpqWSDeJKY1xylKKY5F/33mJhLZ3mFvKv2gGrVS6NkyF6qs+Q==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-function-name" "^7.21.0"
-    "@babel/helper-member-expression-to-functions" "^7.21.0"
-    "@babel/helper-optimise-call-expression" "^7.18.6"
-    "@babel/helper-replace-supers" "^7.20.7"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.20.0"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-
-"@babel/helper-create-regexp-features-plugin@^7.16.7":
-  version "7.17.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.17.0.tgz#1dcc7d40ba0c6b6b25618997c5dbfd310f186fe1"
-  integrity sha512-awO2So99wG6KnlE+TPs6rn83gCz5WlEePJDTnLEqbchMVrBeAujURVphRdigsk094VhvZehFoNOihSlcBjwsXA==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    regexpu-core "^5.0.1"
+    "@babel/helper-annotate-as-pure" "^7.27.3"
+    "@babel/helper-member-expression-to-functions" "^7.27.1"
+    "@babel/helper-optimise-call-expression" "^7.27.1"
+    "@babel/helper-replace-supers" "^7.27.1"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.27.1"
+    "@babel/traverse" "^7.28.3"
+    semver "^6.3.1"
 
 "@babel/helper-create-regexp-features-plugin@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.18.6.tgz#3e35f4e04acbbf25f1b3534a657610a000543d3c"
-  integrity sha512-7LcpH1wnQLGrI+4v+nPp+zUvIkF9x0ddv1Hkdue10tg3gmRnLy97DXh4STiOf1qeIInyD69Qv5kKSZzKD8B/7A==
+  version "7.27.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.27.0.tgz#0e41f7d38c2ebe06ebd9cf0e02fb26019c77cd95"
+  integrity sha512-fO8l08T76v48BhpNRW/nQ0MxfnSdoSKUJBMjubOAYffsVuGG5qOfMq7N6Es7UJvi7Y8goXXo07EfcHZXDPuELQ==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    regexpu-core "^5.1.0"
+    "@babel/helper-annotate-as-pure" "^7.25.9"
+    regexpu-core "^6.2.0"
+    semver "^6.3.1"
 
-"@babel/helper-create-regexp-features-plugin@^7.20.5":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.21.4.tgz#40411a8ab134258ad2cf3a3d987ec6aa0723cee5"
-  integrity sha512-M00OuhU+0GyZ5iBBN9czjugzWrEq2vDpf/zCYHxxf93ul/Q5rv+a5h+/+0WnI1AebHNVtl5bFV0qsJoH23DbfA==
+"@babel/helper-create-regexp-features-plugin@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.27.1.tgz#05b0882d97ba1d4d03519e4bce615d70afa18c53"
+  integrity sha512-uVDC72XVf8UbrH5qQTc18Agb8emwjTiZrQE11Nv3CuBEZmVvTwwE9CBUEvHku06gQCAyYf8Nv6ja1IN+6LMbxQ==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    regexpu-core "^5.3.1"
+    "@babel/helper-annotate-as-pure" "^7.27.1"
+    regexpu-core "^6.2.0"
+    semver "^6.3.1"
 
-"@babel/helper-define-polyfill-provider@^0.3.3":
-  version "0.3.3"
-  resolved "https://registry.yarnpkg.com/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.3.3.tgz#8612e55be5d51f0cd1f36b4a5a83924e89884b7a"
-  integrity sha512-z5aQKU4IzbqCC1XH0nAqfsFLMVSo22SBKUc0BxGrLkolTdPTructy0ToNnlO2zA4j9Q/7pjMZf0DSY+DSTYzww==
+"@babel/helper-define-polyfill-provider@^0.6.5":
+  version "0.6.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.5.tgz#742ccf1cb003c07b48859fc9fa2c1bbe40e5f753"
+  integrity sha512-uJnGFcPsWQK8fvjgGP5LZUZZsYGIoPeRjSF5PGwrelYgq7Q15/Ft9NGFp1zglwgIv//W0uG4BevRuSJRyylZPg==
   dependencies:
-    "@babel/helper-compilation-targets" "^7.17.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
-    debug "^4.1.1"
+    "@babel/helper-compilation-targets" "^7.27.2"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    debug "^4.4.1"
     lodash.debounce "^4.0.8"
-    resolve "^1.14.2"
-    semver "^6.1.2"
+    resolve "^1.22.10"
 
-"@babel/helper-environment-visitor@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.18.6.tgz#b7eee2b5b9d70602e59d1a6cad7dd24de7ca6cd7"
-  integrity sha512-8n6gSfn2baOY+qlp+VSzsosjCVGFqWKmDF0cCWOybh52Dw3SEyoWR1KrhMJASjLwIEkkAufZ0xvr+SxLHSpy2Q==
+"@babel/helper-globals@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-globals/-/helper-globals-7.28.0.tgz#b9430df2aa4e17bc28665eadeae8aa1d985e6674"
+  integrity sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==
 
-"@babel/helper-environment-visitor@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.18.9.tgz#0c0cee9b35d2ca190478756865bb3528422f51be"
-  integrity sha512-3r/aACDJ3fhQ/EVgFy0hpj8oHyHpQc+LPtJoY9SzTThAsStm4Ptegq92vqKoE3vD706ZVFWITnMnxucw+S9Ipg==
-
-"@babel/helper-environment-visitor@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.21.5.tgz#c769afefd41d171836f7cb63e295bedf689d48ba"
-  integrity sha512-IYl4gZ3ETsWocUWgsFZLM5i1BYx9SoemminVEXadgLBa9TdeorzgLKm8wWLA6J1N/kT3Kch8XIk1laNzYoHKvQ==
-
-"@babel/helper-environment-visitor@^7.22.20":
-  version "7.22.20"
-  resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz#96159db61d34a29dba454c959f5ae4a649ba9167"
-  integrity sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==
-
-"@babel/helper-explode-assignable-expression@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.18.6.tgz#41f8228ef0a6f1a036b8dfdfec7ce94f9a6bc096"
-  integrity sha512-eyAYAsQmB80jNfg4baAtLeWAQHfHFiR483rzFK+BhETlGZaQC9bsfrugfXDCbRHLQbIA7U5NxhhOxN7p/dWIcg==
+"@babel/helper-member-expression-to-functions@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.27.1.tgz#ea1211276be93e798ce19037da6f06fbb994fa44"
+  integrity sha512-E5chM8eWjTp/aNoVpcbfM7mLxu9XGLWYise2eBKGQomAk/Mb4XoxyqXTZbuTohbsl8EKqdlMhnDI2CCLfcs9wA==
   dependencies:
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-function-name@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.18.6.tgz#8334fecb0afba66e6d87a7e8c6bb7fed79926b83"
-  integrity sha512-0mWMxV1aC97dhjCah5U5Ua7668r5ZmSC2DLfH2EZnf9c3/dHZKiFa5pRLMH5tjSl471tY6496ZWk/kjNONBxhw==
-  dependencies:
-    "@babel/template" "^7.18.6"
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-function-name@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.18.9.tgz#940e6084a55dee867d33b4e487da2676365e86b0"
-  integrity sha512-fJgWlZt7nxGksJS9a0XdSaI4XvpExnNIgRP+rVefWh5U7BL8pPuir6SJUmFKRfjWQ51OtWSzwOxhaH/EBWWc0A==
-  dependencies:
-    "@babel/template" "^7.18.6"
-    "@babel/types" "^7.18.9"
-
-"@babel/helper-function-name@^7.19.0":
-  version "7.19.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.19.0.tgz#941574ed5390682e872e52d3f38ce9d1bef4648c"
-  integrity sha512-WAwHBINyrpqywkUH0nTnNgI5ina5TFn85HKS0pbPDfxFfhyR/aNQEn4hGi1P1JyT//I0t4OgXUlofzWILRvS5w==
-  dependencies:
-    "@babel/template" "^7.18.10"
-    "@babel/types" "^7.19.0"
-
-"@babel/helper-function-name@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.21.0.tgz#d552829b10ea9f120969304023cd0645fa00b1b4"
-  integrity sha512-HfK1aMRanKHpxemaY2gqBmL04iAPOPRj7DxtNbiDOrJK+gdwkiNRVpCpUJYbUT+aZyemKN8brqTOxzCaG6ExRg==
-  dependencies:
-    "@babel/template" "^7.20.7"
-    "@babel/types" "^7.21.0"
-
-"@babel/helper-function-name@^7.23.0":
-  version "7.23.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz#1f9a3cdbd5b2698a670c30d2735f9af95ed52759"
-  integrity sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==
-  dependencies:
-    "@babel/template" "^7.22.15"
-    "@babel/types" "^7.23.0"
-
-"@babel/helper-hoist-variables@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.18.6.tgz#d4d2c8fb4baeaa5c68b99cc8245c56554f926678"
-  integrity sha512-UlJQPkFqFULIcyW5sbzgbkxn2FKRgwWiRexcuaR8RNJRy8+LLveqPjwZV/bwrLZCN0eUHD/x8D0heK1ozuoo6Q==
-  dependencies:
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-hoist-variables@^7.22.5":
-  version "7.22.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz#c01a007dac05c085914e8fb652b339db50d823bb"
-  integrity sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==
-  dependencies:
-    "@babel/types" "^7.22.5"
-
-"@babel/helper-member-expression-to-functions@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.18.6.tgz#44802d7d602c285e1692db0bad9396d007be2afc"
-  integrity sha512-CeHxqwwipekotzPDUuJOfIMtcIHBuc7WAzLmTYWctVigqS5RktNMQ5bEwQSuGewzYnCtTWa3BARXeiLxDTv+Ng==
-  dependencies:
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-member-expression-to-functions@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.20.7.tgz#a6f26e919582275a93c3aa6594756d71b0bb7f05"
-  integrity sha512-9J0CxJLq315fEdi4s7xK5TQaNYjZw+nDVpVqr1axNGKzdrdwYBD5b4uKv3n75aABG0rCCTK8Im8Ww7eYfMrZgw==
-  dependencies:
-    "@babel/types" "^7.20.7"
-
-"@babel/helper-member-expression-to-functions@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.21.0.tgz#319c6a940431a133897148515877d2f3269c3ba5"
-  integrity sha512-Muu8cdZwNN6mRRNG6lAYErJ5X3bRevgYR2O8wN0yn7jJSnGDu6eG59RfT29JHxGUovyfrh6Pj0XzmR7drNVL3Q==
-  dependencies:
-    "@babel/types" "^7.21.0"
+    "@babel/traverse" "^7.27.1"
+    "@babel/types" "^7.27.1"
 
 "@babel/helper-module-imports@^7.0.0-beta.49":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.0.0.tgz#96081b7111e486da4d2cd971ad1a4fe216cc2e3d"
+  version "7.25.9"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.25.9.tgz#e7f8d20602ebdbf9ebbea0a0751fb0f2a4141715"
+  integrity sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==
   dependencies:
-    "@babel/types" "^7.0.0"
+    "@babel/traverse" "^7.25.9"
+    "@babel/types" "^7.25.9"
 
-"@babel/helper-module-imports@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.18.6.tgz#1e3ebdbbd08aad1437b428c50204db13c5a3ca6e"
-  integrity sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA==
+"@babel/helper-module-imports@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz#7ef769a323e2655e126673bb6d2d6913bbead204"
+  integrity sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==
   dependencies:
-    "@babel/types" "^7.18.6"
+    "@babel/traverse" "^7.27.1"
+    "@babel/types" "^7.27.1"
 
-"@babel/helper-module-imports@^7.21.4":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.21.4.tgz#ac88b2f76093637489e718a90cec6cf8a9b029af"
-  integrity sha512-orajc5T2PsRYUN3ZryCEFeMDYwyw09c/pZeaQEZPH0MpKzSvn3e0uXsDBu3k03VI+9DBiRo+l22BfKTpKwa/Wg==
+"@babel/helper-module-transforms@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.27.1.tgz#e1663b8b71d2de948da5c4fb2a20ca4f3ec27a6f"
+  integrity sha512-9yHn519/8KvTU5BjTVEEeIM3w9/2yXNKoD82JifINImhpKkARMJKPP59kLo+BafpdN5zgNeIcS4jsGDmd3l58g==
   dependencies:
-    "@babel/types" "^7.21.4"
+    "@babel/helper-module-imports" "^7.27.1"
+    "@babel/helper-validator-identifier" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
 
-"@babel/helper-module-imports@~7.22.15":
-  version "7.22.15"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz#16146307acdc40cc00c3b2c647713076464bdbf0"
-  integrity sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==
+"@babel/helper-module-transforms@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.28.3.tgz#a2b37d3da3b2344fe085dab234426f2b9a2fa5f6"
+  integrity sha512-gytXUbs8k2sXS9PnQptz5o0QnpLL51SwASIORY6XaBKF88nsOT0Zw9szLqlSGQDP/4TljBAD5y98p2U1fqkdsw==
   dependencies:
-    "@babel/types" "^7.22.15"
+    "@babel/helper-module-imports" "^7.27.1"
+    "@babel/helper-validator-identifier" "^7.27.1"
+    "@babel/traverse" "^7.28.3"
 
-"@babel/helper-module-transforms@^7.18.6":
-  version "7.18.8"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.18.8.tgz#4f8408afead0188cfa48672f9d0e5787b61778c8"
-  integrity sha512-che3jvZwIcZxrwh63VfnFTUzcAM9v/lznYkkRxIBGMPt1SudOKHAEec0SIRCfiuIzTcF7VGj/CaTT6gY4eWxvA==
+"@babel/helper-optimise-call-expression@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.27.1.tgz#c65221b61a643f3e62705e5dd2b5f115e35f9200"
+  integrity sha512-URMGH08NzYFhubNSGJrpUEphGKQwMQYBySzat5cAByY1/YgIRkULnIy3tAMeszlL/so2HbeilYloUmSpd7GdVw==
   dependencies:
-    "@babel/helper-environment-visitor" "^7.18.6"
-    "@babel/helper-module-imports" "^7.18.6"
-    "@babel/helper-simple-access" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/helper-validator-identifier" "^7.18.6"
-    "@babel/template" "^7.18.6"
-    "@babel/traverse" "^7.18.8"
-    "@babel/types" "^7.18.8"
+    "@babel/types" "^7.27.1"
 
-"@babel/helper-module-transforms@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.18.9.tgz#5a1079c005135ed627442df31a42887e80fcb712"
-  integrity sha512-KYNqY0ICwfv19b31XzvmI/mfcylOzbLtowkw+mfvGPAQ3kfCnMLYbED3YecL5tPd8nAYFQFAd6JHp2LxZk/J1g==
+"@babel/helper-plugin-utils@^7.0.0", "@babel/helper-plugin-utils@^7.18.6":
+  version "7.26.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.26.5.tgz#18580d00c9934117ad719392c4f6585c9333cc35"
+  integrity sha512-RS+jZcRdZdRFzMyr+wcsaqOmld1/EqTghfaBGQQd/WnRdzdlvSZ//kF7U8VQTxf1ynZ4cjUcYgjVGx13ewNPMg==
+
+"@babel/helper-plugin-utils@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.27.1.tgz#ddb2f876534ff8013e6c2b299bf4d39b3c51d44c"
+  integrity sha512-1gn1Up5YXka3YYAHGKpbideQ5Yjf1tDa9qYcgysz+cNCXukyLl6DjPXhD3VRwSb8c0J9tA4b2+rHEZtc6R0tlw==
+
+"@babel/helper-remap-async-to-generator@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.27.1.tgz#4601d5c7ce2eb2aea58328d43725523fcd362ce6"
+  integrity sha512-7fiA521aVw8lSPeI4ZOD3vRFkoqkJcS+z4hFo82bFSH/2tNd6eJ5qCVMS5OzDmZh/kaHQeBaeyxK6wljcPtveA==
   dependencies:
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-module-imports" "^7.18.6"
-    "@babel/helper-simple-access" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/helper-validator-identifier" "^7.18.6"
-    "@babel/template" "^7.18.6"
-    "@babel/traverse" "^7.18.9"
-    "@babel/types" "^7.18.9"
+    "@babel/helper-annotate-as-pure" "^7.27.1"
+    "@babel/helper-wrap-function" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
 
-"@babel/helper-module-transforms@^7.20.11":
-  version "7.21.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.21.2.tgz#160caafa4978ac8c00ac66636cb0fa37b024e2d2"
-  integrity sha512-79yj2AR4U/Oqq/WOV7Lx6hUjau1Zfo4cI+JLAVYeMV5XIlbOhmjEk5ulbTc9fMpmlojzZHkUUxAiK+UKn+hNQQ==
+"@babel/helper-replace-supers@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.27.1.tgz#b1ed2d634ce3bdb730e4b52de30f8cccfd692bc0"
+  integrity sha512-7EHz6qDZc8RYS5ElPoShMheWvEgERonFCs7IAonWLLUTXW59DP14bCZt89/GKyreYn8g3S83m21FelHKbeDCKA==
   dependencies:
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-module-imports" "^7.18.6"
-    "@babel/helper-simple-access" "^7.20.2"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    "@babel/template" "^7.20.7"
-    "@babel/traverse" "^7.21.2"
-    "@babel/types" "^7.21.2"
+    "@babel/helper-member-expression-to-functions" "^7.27.1"
+    "@babel/helper-optimise-call-expression" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
 
-"@babel/helper-module-transforms@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.21.5.tgz#d937c82e9af68d31ab49039136a222b17ac0b420"
-  integrity sha512-bI2Z9zBGY2q5yMHoBvJ2a9iX3ZOAzJPm7Q8Yz6YeoUjU/Cvhmi2G4QyTNyPBqqXSgTjUxRg3L0xV45HvkNWWBw==
+"@babel/helper-skip-transparent-expression-wrappers@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.27.1.tgz#62bb91b3abba8c7f1fec0252d9dbea11b3ee7a56"
+  integrity sha512-Tub4ZKEXqbPjXgWLl2+3JpQAYBJ8+ikpQ2Ocj/q/r0LwE3UhENh7EUabyHjz2kCEsrRY83ew2DQdHluuiDQFzg==
   dependencies:
-    "@babel/helper-environment-visitor" "^7.21.5"
-    "@babel/helper-module-imports" "^7.21.4"
-    "@babel/helper-simple-access" "^7.21.5"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    "@babel/template" "^7.20.7"
-    "@babel/traverse" "^7.21.5"
-    "@babel/types" "^7.21.5"
+    "@babel/traverse" "^7.27.1"
+    "@babel/types" "^7.27.1"
 
-"@babel/helper-optimise-call-expression@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.18.6.tgz#9369aa943ee7da47edab2cb4e838acf09d290ffe"
-  integrity sha512-HP59oD9/fEHQkdcbgFCnbmgH5vIQTJbxh2yf+CdM89/glUNnuzr87Q8GIjGEnOktTROemO0Pe0iPAYbqZuOUiA==
+"@babel/helper-string-parser@^7.25.9":
+  version "7.25.9"
+  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz#1aabb72ee72ed35789b4bbcad3ca2862ce614e8c"
+  integrity sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==
+
+"@babel/helper-string-parser@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz#54da796097ab19ce67ed9f88b47bb2ec49367687"
+  integrity sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==
+
+"@babel/helper-validator-identifier@^7.25.9", "@babel/helper-validator-identifier@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz#a7054dcc145a967dd4dc8fee845a57c1316c9df8"
+  integrity sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==
+
+"@babel/helper-validator-option@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz#fa52f5b1e7db1ab049445b421c4471303897702f"
+  integrity sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==
+
+"@babel/helper-wrap-function@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.27.1.tgz#b88285009c31427af318d4fe37651cd62a142409"
+  integrity sha512-NFJK2sHUvrjo8wAU/nQTWU890/zB2jj0qBcCbZbbf+005cAsv6tMjXz31fBign6M5ov1o0Bllu+9nbqkfsjjJQ==
   dependencies:
-    "@babel/types" "^7.18.6"
+    "@babel/template" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
+    "@babel/types" "^7.27.1"
 
-"@babel/helper-plugin-utils@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.0.0.tgz#bbb3fbee98661c569034237cc03967ba99b4f250"
-  integrity sha512-CYAOUCARwExnEixLdB6sDm2dIJ/YgEAKDM1MOeMeZu9Ld/bDgVo8aiWrXwcY7OBh+1Ea2uUcVRcxKk0GJvW7QA==
-
-"@babel/helper-plugin-utils@^7.10.4", "@babel/helper-plugin-utils@^7.12.13", "@babel/helper-plugin-utils@^7.14.5", "@babel/helper-plugin-utils@^7.16.7", "@babel/helper-plugin-utils@^7.8.0", "@babel/helper-plugin-utils@^7.8.3":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz#aa3a8ab4c3cceff8e65eb9e73d87dc4ff320b2f5"
-  integrity sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==
-
-"@babel/helper-plugin-utils@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.6.tgz#9448974dd4fb1d80fefe72e8a0af37809cd30d6d"
-  integrity sha512-gvZnm1YAAxh13eJdkb9EWHBnF3eAub3XTLCZEehHT2kWxiKVRL64+ae5Y6Ivne0mVHmMYKT+xWgZO+gQhuLUBg==
-
-"@babel/helper-plugin-utils@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.9.tgz#4b8aea3b069d8cb8a72cdfe28ddf5ceca695ef2f"
-  integrity sha512-aBXPT3bmtLryXaoJLyYPXPlSD4p1ld9aYeR+sJNOZjJJGiOpb+fKfh3NkcCu7J54nUJwCERPBExCCpyCOHnu/w==
-
-"@babel/helper-plugin-utils@^7.19.0":
-  version "7.19.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.19.0.tgz#4796bb14961521f0f8715990bee2fb6e51ce21bf"
-  integrity sha512-40Ryx7I8mT+0gaNxm8JGTZFUITNqdLAgdg0hXzeVZxVD6nFsdhQvip6v8dqkRHzsz1VFpFAaOCHNn0vKBL7Czw==
-
-"@babel/helper-plugin-utils@^7.20.2":
-  version "7.20.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.20.2.tgz#d1b9000752b18d0877cff85a5c376ce5c3121629"
-  integrity sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ==
-
-"@babel/helper-plugin-utils@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.21.5.tgz#345f2377d05a720a4e5ecfa39cbf4474a4daed56"
-  integrity sha512-0WDaIlXKOX/3KfBK/dwP1oQGiPh6rjMkT7HIRv7i5RR2VUMwrx5ZL0dwBkKx7+SW1zwNdgjHd34IMk5ZjTeHVg==
-
-"@babel/helper-plugin-utils@^7.22.5":
-  version "7.22.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz#dd7ee3735e8a313b9f7b05a773d892e88e6d7295"
-  integrity sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==
-
-"@babel/helper-remap-async-to-generator@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.18.9.tgz#997458a0e3357080e54e1d79ec347f8a8cd28519"
-  integrity sha512-dI7q50YKd8BAv3VEfgg7PS7yD3Rtbi2J1XMXaalXO0W0164hYLnh8zpjRS0mte9MfVp/tltvr/cfdXPvJr1opA==
+"@babel/helpers@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.28.3.tgz#b83156c0a2232c133d1b535dd5d3452119c7e441"
+  integrity sha512-PTNtvUQihsAsDHMOP5pfobP8C6CM4JWXmP8DrEIt46c3r2bf87Ua1zoqevsMo9g+tWDwgWrFP5EIxuBx5RudAw==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-wrap-function" "^7.18.9"
-    "@babel/types" "^7.18.9"
+    "@babel/template" "^7.27.2"
+    "@babel/types" "^7.28.2"
 
-"@babel/helper-replace-supers@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.18.6.tgz#efedf51cfccea7b7b8c0f00002ab317e7abfe420"
-  integrity sha512-fTf7zoXnUGl9gF25fXCWE26t7Tvtyn6H4hkLSYhATwJvw2uYxd3aoXplMSe0g9XbwK7bmxNes7+FGO0rB/xC0g==
+"@babel/helpers@^7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.28.4.tgz#fe07274742e95bdf7cf1443593eeb8926ab63827"
+  integrity sha512-HFN59MmQXGHVyYadKLVumYsA9dBFun/ldYxipEjzA4196jpLZd8UjEEBLkbEkvfYreDqJhZxYAWFPtrfhNpj4w==
   dependencies:
-    "@babel/helper-environment-visitor" "^7.18.6"
-    "@babel/helper-member-expression-to-functions" "^7.18.6"
-    "@babel/helper-optimise-call-expression" "^7.18.6"
-    "@babel/traverse" "^7.18.6"
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-replace-supers@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.20.7.tgz#243ecd2724d2071532b2c8ad2f0f9f083bcae331"
-  integrity sha512-vujDMtB6LVfNW13jhlCrp48QNslK6JXi7lQG736HVbHz/mbf4Dc7tIRh1Xf5C0rF7BP8iiSxGMCmY6Ci1ven3A==
-  dependencies:
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-member-expression-to-functions" "^7.20.7"
-    "@babel/helper-optimise-call-expression" "^7.18.6"
-    "@babel/template" "^7.20.7"
-    "@babel/traverse" "^7.20.7"
-    "@babel/types" "^7.20.7"
-
-"@babel/helper-simple-access@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.18.6.tgz#d6d8f51f4ac2978068df934b569f08f29788c7ea"
-  integrity sha512-iNpIgTgyAvDQpDj76POqg+YEt8fPxx3yaNBg3S30dxNKm2SWfYhD0TGrK/Eu9wHpUW63VQU894TsTg+GLbUa1g==
-  dependencies:
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-simple-access@^7.20.2":
-  version "7.20.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.20.2.tgz#0ab452687fe0c2cfb1e2b9e0015de07fc2d62dd9"
-  integrity sha512-+0woI/WPq59IrqDYbVGfshjT5Dmk/nnbdpcF8SnMhhXObpTq2KNBdLFRFrkVdbDOyUmHBCxzm5FHV1rACIkIbA==
-  dependencies:
-    "@babel/types" "^7.20.2"
-
-"@babel/helper-simple-access@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.21.5.tgz#d697a7971a5c39eac32c7e63c0921c06c8a249ee"
-  integrity sha512-ENPDAMC1wAjR0uaCUwliBdiSl1KBJAVnMTzXqi64c2MG8MPR6ii4qf7bSXDqSFbr4W6W028/rf5ivoHop5/mkg==
-  dependencies:
-    "@babel/types" "^7.21.5"
-
-"@babel/helper-skip-transparent-expression-wrappers@^7.20.0":
-  version "7.20.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.20.0.tgz#fbe4c52f60518cab8140d77101f0e63a8a230684"
-  integrity sha512-5y1JYeNKfvnT8sZcK9DVRtpTbGiomYIHviSP3OQWmDPU3DeH4a1ZlT/N2lyQ5P8egjcRaT/Y9aNqUxK0WsnIIg==
-  dependencies:
-    "@babel/types" "^7.20.0"
-
-"@babel/helper-split-export-declaration@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.18.6.tgz#7367949bc75b20c6d5a5d4a97bba2824ae8ef075"
-  integrity sha512-bde1etTx6ZyTmobl9LLMMQsaizFVZrquTEHOqKeQESMKo4PlObf+8+JA25ZsIpZhT/WEd39+vOdLXAFG/nELpA==
-  dependencies:
-    "@babel/types" "^7.18.6"
-
-"@babel/helper-split-export-declaration@^7.22.6":
-  version "7.22.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz#322c61b7310c0997fe4c323955667f18fcefb91c"
-  integrity sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==
-  dependencies:
-    "@babel/types" "^7.22.5"
-
-"@babel/helper-string-parser@^7.18.10":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.18.10.tgz#181f22d28ebe1b3857fa575f5c290b1aaf659b56"
-  integrity sha512-XtIfWmeNY3i4t7t4D2t02q50HvqHybPqW2ki1kosnvWCwuCMeo81Jf0gwr85jy/neUdg5XDdeFE/80DXiO+njw==
-
-"@babel/helper-string-parser@^7.19.4":
-  version "7.19.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.19.4.tgz#38d3acb654b4701a9b77fb0615a96f775c3a9e63"
-  integrity sha512-nHtDoQcuqFmwYNYPz3Rah5ph2p8PFeFCsZk9A/48dPc/rGocJ5J3hAAZ7pb76VWX3fZKu+uEr/FhH5jLx7umrw==
-
-"@babel/helper-string-parser@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.21.5.tgz#2b3eea65443c6bdc31c22d037c65f6d323b6b2bd"
-  integrity sha512-5pTUx3hAJaZIdW99sJ6ZUUgWq/Y+Hja7TowEnLNMm1VivRgZQL3vpBY3qUACVsvw+yQU6+YgfBVmcbLaZtrA1w==
-
-"@babel/helper-string-parser@^7.23.4":
-  version "7.23.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz#9478c707febcbbe1ddb38a3d91a2e054ae622d83"
-  integrity sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==
-
-"@babel/helper-validator-identifier@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz#e8c602438c4a8195751243da9031d1607d247cad"
-  integrity sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==
-
-"@babel/helper-validator-identifier@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.18.6.tgz#9c97e30d31b2b8c72a1d08984f2ca9b574d7a076"
-  integrity sha512-MmetCkz9ej86nJQV+sFCxoGGrUbU3q02kgLciwkrt9QqEB7cP39oKEY0PakknEO0Gu20SskMRi+AYZ3b1TpN9g==
-
-"@babel/helper-validator-identifier@^7.19.1":
-  version "7.19.1"
-  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.19.1.tgz#7eea834cf32901ffdc1a7ee555e2f9c27e249ca2"
-  integrity sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==
-
-"@babel/helper-validator-identifier@^7.22.20":
-  version "7.22.20"
-  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz#c4ae002c61d2879e724581d96665583dbc1dc0e0"
-  integrity sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==
-
-"@babel/helper-validator-option@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.18.6.tgz#bf0d2b5a509b1f336099e4ff36e1a63aa5db4db8"
-  integrity sha512-XO7gESt5ouv/LRJdrVjkShckw6STTaB7l9BrpBaAHDeF5YZT+01PCwmR0SJHnkW6i8OwW/EVWRShfi4j2x+KQw==
-
-"@babel/helper-validator-option@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.21.0.tgz#8224c7e13ace4bafdc4004da2cf064ef42673180"
-  integrity sha512-rmL/B8/f0mKS2baE9ZpyTcTavvEuWhTTW8amjzXNvYG4AwBsqTLikfXsEofsJEfKHf+HQVQbFOHy6o+4cnC/fQ==
-
-"@babel/helper-wrap-function@^7.18.9":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.18.10.tgz#a7fcd3ab9b1be4c9b52cf7d7fdc1e88c2ce93396"
-  integrity sha512-95NLBP59VWdfK2lyLKe6eTMq9xg+yWKzxzxbJ1wcYNi1Auz200+83fMDADjRxBvc2QQor5zja2yTQzXGhk2GtQ==
-  dependencies:
-    "@babel/helper-function-name" "^7.18.9"
-    "@babel/template" "^7.18.10"
-    "@babel/traverse" "^7.18.10"
-    "@babel/types" "^7.18.10"
-
-"@babel/helpers@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.18.9.tgz#4bef3b893f253a1eced04516824ede94dcfe7ff9"
-  integrity sha512-Jf5a+rbrLoR4eNdUmnFu8cN5eNJT6qdTdOg5IHIzq87WwyRw9PwguLFOWYgktN/60IP4fgDUawJvs7PjQIzELQ==
-  dependencies:
-    "@babel/template" "^7.18.6"
-    "@babel/traverse" "^7.18.9"
-    "@babel/types" "^7.18.9"
-
-"@babel/helpers@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.21.5.tgz#5bac66e084d7a4d2d9696bdf0175a93f7fb63c08"
-  integrity sha512-BSY+JSlHxOmGsPTydUkPf1MdMQ3M81x5xGCOVgWM3G8XH77sJ292Y2oqcp0CbbgxhqBuI46iUz1tT7hqP7EfgA==
-  dependencies:
-    "@babel/template" "^7.20.7"
-    "@babel/traverse" "^7.21.5"
-    "@babel/types" "^7.21.5"
+    "@babel/template" "^7.27.2"
+    "@babel/types" "^7.28.4"
 
 "@babel/highlight@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.0.0.tgz#f710c38c8d458e6dd9a201afb637fcb781ce99e4"
+  version "7.25.9"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.25.9.tgz#8141ce68fc73757946f983b343f1231f4691acc6"
+  integrity sha512-llL88JShoCsth8fF8R4SJnIn+WLvR6ccFxu1H3FlMhDontdcmZWf2HgIZ7AIqV3Xcck1idlohrN4EUBQz6klbw==
   dependencies:
-    chalk "^2.0.0"
-    esutils "^2.0.2"
-    js-tokens "^4.0.0"
-
-"@babel/highlight@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.18.6.tgz#81158601e93e2563795adcbfbdf5d64be3f2ecdf"
-  integrity sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==
-  dependencies:
-    "@babel/helper-validator-identifier" "^7.18.6"
-    chalk "^2.0.0"
-    js-tokens "^4.0.0"
-
-"@babel/highlight@^7.23.4":
-  version "7.23.4"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.23.4.tgz#edaadf4d8232e1a961432db785091207ead0621b"
-  integrity sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==
-  dependencies:
-    "@babel/helper-validator-identifier" "^7.22.20"
-    chalk "^2.4.2"
-    js-tokens "^4.0.0"
-
-"@babel/highlight@^7.24.2":
-  version "7.24.2"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.24.2.tgz#3f539503efc83d3c59080a10e6634306e0370d26"
-  integrity sha512-Yac1ao4flkTxTteCDZLEvdxg2fZfz1v8M4QpaGypq/WPDqg3ijHYbDfs+LG5hvzSoqaSZ9/Z9lKSP3CjZjv+pA==
-  dependencies:
-    "@babel/helper-validator-identifier" "^7.22.20"
+    "@babel/helper-validator-identifier" "^7.25.9"
     chalk "^2.4.2"
     js-tokens "^4.0.0"
     picocolors "^1.0.0"
 
-"@babel/parser@^7.14.7":
-  version "7.18.11"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.11.tgz#68bb07ab3d380affa9a3f96728df07969645d2d9"
-  integrity sha512-9JKn5vN+hDt0Hdqn1PiJ2guflwP+B6Ga8qbDuoF0PzzVhrzsKIJo8yGqVk6CmMHiMei9w1C1Bp9IMJSIK+HPIQ==
+"@babel/parser@^7.27.0":
+  version "7.27.0"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.27.0.tgz#3d7d6ee268e41d2600091cbd4e145ffee85a44ec"
+  integrity sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==
+  dependencies:
+    "@babel/types" "^7.27.0"
 
-"@babel/parser@^7.16.4":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.8.tgz#2817fb9d885dd8132ea0f8eb615a6388cca1c240"
-  integrity sha512-BoHhDJrJXqcg+ZL16Xv39H9n+AqJ4pcDrQBGZN+wHxIysrLZ3/ECwCBUch/1zUNhnsXULcONU3Ei5Hmkfk6kiQ==
+"@babel/parser@^7.27.2", "@babel/parser@^7.28.0", "@babel/parser@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.28.3.tgz#d2d25b814621bca5fe9d172bc93792547e7a2a71"
+  integrity sha512-7+Ey1mAgYqFAx2h0RuoxcQT5+MlG3GTV0TQrgr7/ZliKsm/MNDxVVutlWaziMq7wJNAz8MTqz55XLpWvva6StA==
+  dependencies:
+    "@babel/types" "^7.28.2"
 
-"@babel/parser@^7.18.10":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.10.tgz#94b5f8522356e69e8277276adf67ed280c90ecc1"
-  integrity sha512-TYk3OA0HKL6qNryUayb5UUEhM/rkOQozIBEA5ITXh5DWrSp0TlUQXMyZmnWxG/DizSWBeeQ0Zbc5z8UGaaqoeg==
+"@babel/parser@^7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.28.4.tgz#da25d4643532890932cc03f7705fe19637e03fa8"
+  integrity sha512-yZbBqeM6TkpP9du/I2pUZnJsRMGGvOuIrhjzC1AwHwW+6he4mni6Bp/m8ijn0iOuZuPI2BfkCoSRunpyjnrQKg==
+  dependencies:
+    "@babel/types" "^7.28.4"
 
-"@babel/parser@^7.18.6", "@babel/parser@^7.18.8":
-  version "7.18.8"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.8.tgz#822146080ac9c62dac0823bb3489622e0bc1cbdf"
-  integrity sha512-RSKRfYX20dyH+elbJK2uqAkVyucL+xXzhqlMD5/ZXx+dAAwpyB7HsvnHe/ZUGOF+xLr5Wx9/JoXVTj6BQE2/oA==
+"@babel/plugin-bugfix-firefox-class-in-computed-class-key@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.27.1.tgz#61dd8a8e61f7eb568268d1b5f129da3eee364bf9"
+  integrity sha512-QPG3C9cCVRQLxAVwmefEmwdTanECuUBMQZ/ym5kiw3XKCGA7qkuQLcjWWHcrD/GKbn/WmJwaezfuuAOcyKlRPA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
 
-"@babel/parser@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.9.tgz#f2dde0c682ccc264a9a8595efd030a5cc8fd2539"
-  integrity sha512-9uJveS9eY9DJ0t64YbIBZICtJy8a5QrDEVdiLCG97fVLpDTpGX7t8mMSb6OWw6Lrnjqj4O8zwjELX3dhoMgiBg==
+"@babel/plugin-bugfix-safari-class-field-initializer-scope@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-safari-class-field-initializer-scope/-/plugin-bugfix-safari-class-field-initializer-scope-7.27.1.tgz#43f70a6d7efd52370eefbdf55ae03d91b293856d"
+  integrity sha512-qNeq3bCKnGgLkEXUuFry6dPlGfCdQNZbn7yUAPCInwAJHMU7THJfrBSozkcWq5sNM6RcF3S8XyQL2A52KNR9IA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/parser@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.20.7.tgz#66fe23b3c8569220817d5feb8b9dcdc95bb4f71b"
-  integrity sha512-T3Z9oHybU+0vZlY9CiDSJQTD5ZapcW18ZctFMi0MOAl/4BjFF4ul7NVSARLdbGO5vDqy9eQiGTV0LtKfvCYvcg==
+"@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.27.1.tgz#beb623bd573b8b6f3047bd04c32506adc3e58a72"
+  integrity sha512-g4L7OYun04N1WyqMNjldFwlfPCLVkgB54A/YCXICZYBsvJJE3kByKv9c9+R/nAfmIfjl2rKYLNyMHboYbZaWaA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/parser@^7.21.4":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.4.tgz#94003fdfc520bbe2875d4ae557b43ddb6d880f17"
-  integrity sha512-alVJj7k7zIxqBZ7BTRhz0IqJFxW1VJbm6N8JbcYhQ186df9ZBPbZBmWSqAMXwHGsCJdYks7z/voa3ibiS5bCIw==
+"@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.27.1.tgz#e134a5479eb2ba9c02714e8c1ebf1ec9076124fd"
+  integrity sha512-oO02gcONcD5O1iTLi/6frMJBIwWEHceWGSGqrpCmEL8nogiS6J9PBlE48CaK20/Jx1LuRml9aDftLgdjXT8+Cw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.27.1"
+    "@babel/plugin-transform-optional-chaining" "^7.27.1"
 
-"@babel/parser@^7.21.5", "@babel/parser@^7.21.8":
-  version "7.21.8"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.8.tgz#642af7d0333eab9c0ad70b14ac5e76dbde7bfdf8"
-  integrity sha512-6zavDGdzG3gUqAdWvlLFfk+36RilI+Pwyuuh7HItyeScCWP3k6i8vKclAQ0bM/0y/Kz/xiwvxhMv9MgTJP5gmA==
+"@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.28.3.tgz#373f6e2de0016f73caf8f27004f61d167743742a"
+  integrity sha512-b6YTX108evsvE4YgWyQ921ZAFFQm3Bn+CA3+ZXlNVnPhx+UfsVURoPjfGAPCjBgrqo30yX/C2nZGX96DxvR9Iw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/traverse" "^7.28.3"
 
-"@babel/parser@^7.22.15", "@babel/parser@^7.23.6":
-  version "7.23.6"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.6.tgz#ba1c9e512bda72a47e285ae42aff9d2a635a9e3b"
-  integrity sha512-Z2uID7YJ7oNvAI20O9X0bblw7Qqs8Q2hFy0R9tAfnfLkp5MW0UH9eUvnDSnFwKZ0AvgS1ucqR4KzvVHgnke1VQ==
+"@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2":
+  version "7.21.0-placeholder-for-preset-env.2"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz#7844f9289546efa9febac2de4cfe358a050bd703"
+  integrity sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==
 
-"@babel/parser@^7.23.9", "@babel/parser@^7.24.0", "@babel/parser@^7.24.1":
-  version "7.24.1"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.24.1.tgz#1e416d3627393fab1cb5b0f2f1796a100ae9133a"
-  integrity sha512-Zo9c7N3xdOIQrNip7Lc9wvRPzlRtovHVE4lkz8WEDr7uYh/GMQhSiIgFxGIArRHYdJE5kxtZjAf8rT0xhdLCzg==
+"@babel/plugin-syntax-import-assertions@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.27.1.tgz#88894aefd2b03b5ee6ad1562a7c8e1587496aecd"
+  integrity sha512-UT/Jrhw57xg4ILHLFnzFpPDlMbcdEicaAtjPQpbj9wa8T4r5KVWCimHcL/460g8Ht0DMxDyjsLgiWSkVjnwPFg==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.18.6":
+"@babel/plugin-syntax-import-attributes@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.27.1.tgz#34c017d54496f9b11b61474e7ea3dfd5563ffe07"
+  integrity sha512-oFT0FrKHgF53f4vOsZGi2Hh3I35PfSmVs4IBFLFj4dnafP+hIWDLg3VyKmUHfLoLHlyxY4C7DGtmHuJgn+IGww==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
+
+"@babel/plugin-syntax-jsx@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.27.1.tgz#2f9beb5eff30fa507c5532d107daac7b888fa34c"
+  integrity sha512-y8YTNIeKoyhGd9O0Jiyzyyqk8gdjnumGTQPsz0xOZOQ2RmkVJeZ1vmmfIvFEKqucBG6axJGBZDE/7iI5suUI/w==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
+
+"@babel/plugin-syntax-typescript@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.27.1.tgz#5147d29066a793450f220c63fa3a9431b7e6dd18"
+  integrity sha512-xfYCBMxveHrRMnAWl1ZlPXOZjzkN82THFvLhQhFXFt81Z5HnN+EtUkZhv/zcKpmT3fzmWZB0ywiBrbC3vogbwQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.27.1"
+
+"@babel/plugin-syntax-unicode-sets-regex@^7.18.6":
   version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.18.6.tgz#da5b8f9a580acdfbe53494dba45ea389fb09a4d2"
-  integrity sha512-Dgxsyg54Fx1d4Nge8UnvTrED63vrwOdPmyvPzlNN/boaliRP54pm3pGzZD1SJUwrBA+Cs/xdG8kXX6Mn/RfISQ==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-
-"@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.20.7.tgz#d9c85589258539a22a901033853101a6198d4ef1"
-  integrity sha512-sbr9+wNE5aXMBBFBICk01tt7sBf2Oc9ikRFEcem/ZORup9IMUdNhW7/wVLEbbtlWOsEubJet46mHAL2C8+2jKQ==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.20.0"
-    "@babel/plugin-proposal-optional-chaining" "^7.20.7"
-
-"@babel/plugin-proposal-async-generator-functions@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.20.7.tgz#bfb7276d2d573cb67ba379984a2334e262ba5326"
-  integrity sha512-xMbiLsn/8RK7Wq7VeVytytS2L6qE69bXPB10YCmMdDZbKF4okCqY74pI/jJQ/8U0b/F6NrT2+14b8/P9/3AMGA==
-  dependencies:
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-remap-async-to-generator" "^7.18.9"
-    "@babel/plugin-syntax-async-generators" "^7.8.4"
-
-"@babel/plugin-proposal-class-properties@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.18.6.tgz#b110f59741895f7ec21a6fff696ec46265c446a3"
-  integrity sha512-cumfXOF0+nzZrrN8Rf0t7M+tF6sZc7vhQwYQck9q1/5w2OExlD+b4v4RpMJFaV1Z7WcDRgO6FqvxqxGlwo+RHQ==
-  dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.18.6"
-
-"@babel/plugin-proposal-class-static-block@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-static-block/-/plugin-proposal-class-static-block-7.21.0.tgz#77bdd66fb7b605f3a61302d224bdfacf5547977d"
-  integrity sha512-XP5G9MWNUskFuP30IfFSEFB0Z6HzLIUcjYM4bYOPHXl7eiJ9HFv8tWj6TXTN5QODiEhDZAeI4hLok2iHFFV4hw==
-  dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.21.0"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/plugin-syntax-class-static-block" "^7.14.5"
-
-"@babel/plugin-proposal-dynamic-import@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.18.6.tgz#72bcf8d408799f547d759298c3c27c7e7faa4d94"
-  integrity sha512-1auuwmK+Rz13SJj36R+jqFPMJWyKEDd7lLSdOj4oJK0UTgGueSAtkrCvz9ewmgyU/P941Rv2fQwZJN8s6QruXw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-    "@babel/plugin-syntax-dynamic-import" "^7.8.3"
-
-"@babel/plugin-proposal-export-namespace-from@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.18.9.tgz#5f7313ab348cdb19d590145f9247540e94761203"
-  integrity sha512-k1NtHyOMvlDDFeb9G5PhUXuGj8m/wiwojgQVEhJ/fsVsMCpLyOP4h0uGEjYJKrRI+EVPlb5Jk+Gt9P97lOGwtA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.9"
-    "@babel/plugin-syntax-export-namespace-from" "^7.8.3"
-
-"@babel/plugin-proposal-json-strings@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.18.6.tgz#7e8788c1811c393aff762817e7dbf1ebd0c05f0b"
-  integrity sha512-lr1peyn9kOdbYc0xr0OdHTZ5FMqS6Di+H0Fz2I/JwMzGmzJETNeOFq2pBySw6X/KFL5EWDjlJuMsUGRFb8fQgQ==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-    "@babel/plugin-syntax-json-strings" "^7.8.3"
-
-"@babel/plugin-proposal-logical-assignment-operators@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-logical-assignment-operators/-/plugin-proposal-logical-assignment-operators-7.20.7.tgz#dfbcaa8f7b4d37b51e8bfb46d94a5aea2bb89d83"
-  integrity sha512-y7C7cZgpMIjWlKE5T7eJwp+tnRYM89HmRvWM5EQuB5BoHEONjmQ8lSNmBUwOyy/GFRsohJED51YBF79hE1djug==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/plugin-syntax-logical-assignment-operators" "^7.10.4"
-
-"@babel/plugin-proposal-nullish-coalescing-operator@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.18.6.tgz#fdd940a99a740e577d6c753ab6fbb43fdb9467e1"
-  integrity sha512-wQxQzxYeJqHcfppzBDnm1yAY0jSRkUXR2z8RePZYrKwMKgMlE8+Z6LUno+bd6LvbGh8Gltvy74+9pIYkr+XkKA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-    "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.3"
-
-"@babel/plugin-proposal-numeric-separator@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-numeric-separator/-/plugin-proposal-numeric-separator-7.18.6.tgz#899b14fbafe87f053d2c5ff05b36029c62e13c75"
-  integrity sha512-ozlZFogPqoLm8WBr5Z8UckIoE4YQ5KESVcNudyXOR8uqIkliTEgJ3RoketfG6pmzLdeZF0H/wjE9/cCEitBl7Q==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-    "@babel/plugin-syntax-numeric-separator" "^7.10.4"
-
-"@babel/plugin-proposal-object-rest-spread@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.20.7.tgz#aa662940ef425779c75534a5c41e9d936edc390a"
-  integrity sha512-d2S98yCiLxDVmBmE8UjGcfPvNEUbA1U5q5WxaWFUGRzJSVAZqm5W6MbPct0jxnegUZ0niLeNX+IOzEs7wYg9Dg==
-  dependencies:
-    "@babel/compat-data" "^7.20.5"
-    "@babel/helper-compilation-targets" "^7.20.7"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/plugin-syntax-object-rest-spread" "^7.8.3"
-    "@babel/plugin-transform-parameters" "^7.20.7"
-
-"@babel/plugin-proposal-optional-catch-binding@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.18.6.tgz#f9400d0e6a3ea93ba9ef70b09e72dd6da638a2cb"
-  integrity sha512-Q40HEhs9DJQyaZfUjjn6vE8Cv4GmMHCYuMGIWUnlxH6400VGxOuwWsPt4FxXxJkC/5eOzgn0z21M9gMT4MOhbw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-    "@babel/plugin-syntax-optional-catch-binding" "^7.8.3"
-
-"@babel/plugin-proposal-optional-chaining@^7.20.7", "@babel/plugin-proposal-optional-chaining@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.21.0.tgz#886f5c8978deb7d30f678b2e24346b287234d3ea"
-  integrity sha512-p4zeefM72gpmEe2fkUr/OnOXpWEf8nAgk7ZYVqqfFiyIG7oFfVZcCrU64hWn5xp4tQ9LkV4bTIa5rD0KANpKNA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.20.0"
-    "@babel/plugin-syntax-optional-chaining" "^7.8.3"
-
-"@babel/plugin-proposal-private-methods@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-methods/-/plugin-proposal-private-methods-7.18.6.tgz#5209de7d213457548a98436fa2882f52f4be6bea"
-  integrity sha512-nutsvktDItsNn4rpGItSNV2sz1XwS+nfU0Rg8aCx3W3NOKVzdMjJRu0O5OkgDp3ZGICSTbgRpxZoWsxoKRvbeA==
-  dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.18.6"
-
-"@babel/plugin-proposal-private-property-in-object@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0.tgz#19496bd9883dd83c23c7d7fc45dcd9ad02dfa1dc"
-  integrity sha512-ha4zfehbJjc5MmXBlHec1igel5TJXXLDDRbuJ4+XT2TJcyD9/V1919BA8gMvsdHcNMBy4WBUBiRb3nw/EQUtBw==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    "@babel/helper-create-class-features-plugin" "^7.21.0"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/plugin-syntax-private-property-in-object" "^7.14.5"
-
-"@babel/plugin-proposal-unicode-property-regex@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.18.6.tgz#af613d2cd5e643643b65cded64207b15c85cb78e"
-  integrity sha512-2BShG/d5yoZyXZfVePH91urL5wTG6ASZU9M4o03lKK8u8UW1y08OMttBSOADTcJrnPMpvDXRG3G8fyLh4ovs8w==
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-unicode-sets-regex/-/plugin-syntax-unicode-sets-regex-7.18.6.tgz#d49a3b3e6b52e5be6740022317580234a6a47357"
+  integrity sha512-727YkEAPwSIQTv5im8QHz3upqp92JTWhidIC81Tdx4VJYIte/VndKf1qKrfnnhPLiPghStWfvC/iFaMCQu7Nqg==
   dependencies:
     "@babel/helper-create-regexp-features-plugin" "^7.18.6"
     "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-proposal-unicode-property-regex@^7.4.4":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.16.7.tgz#635d18eb10c6214210ffc5ff4932552de08188a2"
-  integrity sha512-QRK0YI/40VLhNVGIjRNAAQkEHws0cswSdFFjpFyt943YmJIU1da9uW63Iu6NFV6CxTZW5eTDCrwZUstBWgp/Rg==
+"@babel/plugin-transform-arrow-functions@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.27.1.tgz#6e2061067ba3ab0266d834a9f94811196f2aba9a"
+  integrity sha512-8Z4TGic6xW70FKThA5HYEKKyBpOOsucTOD1DjU3fZxDg+K3zBJcXMFnt/4yQiZnf5+MiOMSXQ9PaEK/Ilh1DeA==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-async-generators@^7.8.4":
-  version "7.8.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generators-7.8.4.tgz#a983fb1aeb2ec3f6ed042a210f640e90e786fe0d"
-  integrity sha512-tycmZxkGfZaxhMRbXlPXuVFpdWlXpir2W4AMhSJgRKzk/eDlIXOhb2LHWoLpDF7TEHylV5zNhykX6KAgHJmTNw==
+"@babel/plugin-transform-async-generator-functions@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.28.0.tgz#1276e6c7285ab2cd1eccb0bc7356b7a69ff842c2"
+  integrity sha512-BEOdvX4+M765icNPZeidyADIvQ1m1gmunXufXxvRESy/jNNyfovIqUyE7MVgGBjWktCoJlzvFA1To2O4ymIO3Q==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-remap-async-to-generator" "^7.27.1"
+    "@babel/traverse" "^7.28.0"
 
-"@babel/plugin-syntax-class-properties@^7.12.13":
-  version "7.12.13"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.12.13.tgz#b5c987274c4a3a82b89714796931a6b53544ae10"
-  integrity sha512-fm4idjKla0YahUNgFNLCB0qySdsoPiZP3iQE3rky0mBUtMZ23yDJ9SJdg6dXTSDnulOVqiF3Hgr9nbXvXTQZYA==
+"@babel/plugin-transform-async-to-generator@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.27.1.tgz#9a93893b9379b39466c74474f55af03de78c66e7"
+  integrity sha512-NREkZsZVJS4xmTr8qzE5y8AfIPqsdQfRuUiLRTEzb7Qii8iFWCyDKaUV2c0rCuh4ljDZ98ALHP/PetiBV2nddA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.12.13"
+    "@babel/helper-module-imports" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-remap-async-to-generator" "^7.27.1"
 
-"@babel/plugin-syntax-class-static-block@^7.14.5":
-  version "7.14.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-class-static-block/-/plugin-syntax-class-static-block-7.14.5.tgz#195df89b146b4b78b3bf897fd7a257c84659d406"
-  integrity sha512-b+YyPmr6ldyNnM6sqYeMWE+bgJcJpO6yS4QD7ymxgH34GBPNDM/THBh8iunyvKIZztiwLH4CJZ0RxTk9emgpjw==
+"@babel/plugin-transform-block-scoped-functions@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.27.1.tgz#558a9d6e24cf72802dd3b62a4b51e0d62c0f57f9"
+  integrity sha512-cnqkuOtZLapWYZUYM5rVIdv1nXYuFVIltZ6ZJ7nIj585QsjKM5dhL2Fu/lICXZ1OyIAFc7Qy+bvDAtTXqGrlhg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.14.5"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-dynamic-import@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz#62bf98b2da3cd21d626154fc96ee5b3cb68eacb3"
-  integrity sha512-5gdGbFon+PszYzqs83S3E5mpi7/y/8M9eC90MRTZfduQOYW76ig6SOSPNe41IG5LoP3FGBn2N0RjVDSQiS94kQ==
+"@babel/plugin-transform-block-scoping@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.28.0.tgz#e7c50cbacc18034f210b93defa89638666099451"
+  integrity sha512-gKKnwjpdx5sER/wl0WN0efUBFzF/56YZO0RJrSYP4CljXnP31ByY7fol89AzomdlLNzI36AvOTmYHsnZTCkq8Q==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-export-namespace-from@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-export-namespace-from/-/plugin-syntax-export-namespace-from-7.8.3.tgz#028964a9ba80dbc094c915c487ad7c4e7a66465a"
-  integrity sha512-MXf5laXo6c1IbEbegDmzGPwGNTsHZmEy6QGznu5Sh2UCWvueywb2ee+CCE4zQiZstxU9BMoQO9i6zUFSY0Kj0Q==
+"@babel/plugin-transform-class-properties@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.27.1.tgz#dd40a6a370dfd49d32362ae206ddaf2bb082a925"
+  integrity sha512-D0VcalChDMtuRvJIu3U/fwWjf8ZMykz5iZsg77Nuj821vCKI3zCyRLwRdWbsuJ/uRwZhZ002QtCqIkwC/ZkvbA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-create-class-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-import-assertions@^7.20.0":
-  version "7.20.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.20.0.tgz#bb50e0d4bea0957235390641209394e87bdb9cc4"
-  integrity sha512-IUh1vakzNoWalR8ch/areW7qFopR2AEw03JlG7BbrDqmQ4X3q9uuipQwSGrUn7oGiemKjtSLDhNtQHzMHr1JdQ==
+"@babel/plugin-transform-class-static-block@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.28.3.tgz#d1b8e69b54c9993bc558203e1f49bfc979bfd852"
+  integrity sha512-LtPXlBbRoc4Njl/oh1CeD/3jC+atytbnf/UqLoqTDcEYGUPj022+rvfkbDYieUrSj3CaV4yHDByPE+T2HwfsJg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.19.0"
+    "@babel/helper-create-class-features-plugin" "^7.28.3"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-import-meta@^7.10.4":
-  version "7.10.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.10.4.tgz#ee601348c370fa334d2207be158777496521fd51"
-  integrity sha512-Yqfm+XDx0+Prh3VSeEQCPU81yC+JWZ2pDPFSS4ZdpfZhp4MkFMaDC1UqseovEKwSUpnIL7+vK+Clp7bfh0iD7g==
+"@babel/plugin-transform-classes@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.28.3.tgz#598297260343d0edbd51cb5f5075e07dee91963a"
+  integrity sha512-DoEWC5SuxuARF2KdKmGUq3ghfPMO6ZzR12Dnp5gubwbeWJo4dbNWXJPVlwvh4Zlq6Z7YVvL8VFxeSOJgjsx4Sg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.10.4"
+    "@babel/helper-annotate-as-pure" "^7.27.3"
+    "@babel/helper-compilation-targets" "^7.27.2"
+    "@babel/helper-globals" "^7.28.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-replace-supers" "^7.27.1"
+    "@babel/traverse" "^7.28.3"
 
-"@babel/plugin-syntax-json-strings@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz#01ca21b668cd8218c9e640cb6dd88c5412b2c96a"
-  integrity sha512-lY6kdGpWHvjoe2vk4WrAapEuBR69EMxZl+RoGRhrFGNYVK8mOPAW8VfbT/ZgrFbXlDNiiaxQnAtgVCZ6jv30EA==
+"@babel/plugin-transform-computed-properties@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.27.1.tgz#81662e78bf5e734a97982c2b7f0a793288ef3caa"
+  integrity sha512-lj9PGWvMTVksbWiDT2tW68zGS/cyo4AkZ/QTp0sQT0mjPopCmrSkzxeXkznjqBxzDI6TclZhOJbBmbBLjuOZUw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/template" "^7.27.1"
 
-"@babel/plugin-syntax-jsx@^7.23.3":
-  version "7.23.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.23.3.tgz#8f2e4f8a9b5f9aa16067e142c1ac9cd9f810f473"
-  integrity sha512-EB2MELswq55OHUoRZLGg/zC7QWUKfNLpE57m/S2yr1uEneIgsTgrSzXP3NXEsMkVn76OlaVVnzN+ugObuYGwhg==
+"@babel/plugin-transform-destructuring@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.28.0.tgz#0f156588f69c596089b7d5b06f5af83d9aa7f97a"
+  integrity sha512-v1nrSMBiKcodhsyJ4Gf+Z0U/yawmJDBOTpEB3mcQY52r9RIyPneGyAS/yM6seP/8I+mWI3elOMtT5dB8GJVs+A==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.22.5"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/traverse" "^7.28.0"
 
-"@babel/plugin-syntax-logical-assignment-operators@^7.10.4":
-  version "7.10.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz#ca91ef46303530448b906652bac2e9fe9941f699"
-  integrity sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig==
+"@babel/plugin-transform-dotall-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.27.1.tgz#aa6821de864c528b1fecf286f0a174e38e826f4d"
+  integrity sha512-gEbkDVGRvjj7+T1ivxrfgygpT7GUd4vmODtYpbs0gZATdkX8/iSnOtZSxiZnsgm1YjTgjI6VKBGSJJevkrclzw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.10.4"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-nullish-coalescing-operator@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-nullish-coalescing-operator/-/plugin-syntax-nullish-coalescing-operator-7.8.3.tgz#167ed70368886081f74b5c36c65a88c03b66d1a9"
-  integrity sha512-aSff4zPII1u2QD7y+F8oDsz19ew4IGEJg9SVW+bqwpwtfFleiQDMdzA/R+UlWDzfnHFCxxleFT0PMIrR36XLNQ==
+"@babel/plugin-transform-duplicate-keys@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.27.1.tgz#f1fbf628ece18e12e7b32b175940e68358f546d1"
+  integrity sha512-MTyJk98sHvSs+cvZ4nOauwTTG1JeonDjSGvGGUNHreGQns+Mpt6WX/dVzWBHgg+dYZhkC4X+zTDfkTU+Vy9y7Q==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-numeric-separator@^7.10.4":
-  version "7.10.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.4.tgz#b9b070b3e33570cd9fd07ba7fa91c0dd37b9af97"
-  integrity sha512-9H6YdfkcK/uOnY/K7/aA2xpzaAgkQn37yzWUMRK7OaPOqOpGS1+n0H5hxT9AUw9EsSjPW8SVyMJwYRtWs3X3ug==
+"@babel/plugin-transform-duplicate-named-capturing-groups-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-named-capturing-groups-regex/-/plugin-transform-duplicate-named-capturing-groups-regex-7.27.1.tgz#5043854ca620a94149372e69030ff8cb6a9eb0ec"
+  integrity sha512-hkGcueTEzuhB30B3eJCbCYeCaaEQOmQR0AdvzpD4LoN0GXMWzzGSuRrxR2xTnCrvNbVwK9N6/jQ92GSLfiZWoQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.10.4"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-object-rest-spread@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.8.3.tgz#60e225edcbd98a640332a2e72dd3e66f1af55871"
-  integrity sha512-XoqMijGZb9y3y2XskN+P1wUGiVwWZ5JmoDRwx5+3GmEplNyVM2s2Dg8ILFQm8rWM48orGy5YpI5Bl8U1y7ydlA==
+"@babel/plugin-transform-dynamic-import@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.27.1.tgz#4c78f35552ac0e06aa1f6e3c573d67695e8af5a4"
+  integrity sha512-MHzkWQcEmjzzVW9j2q8LGjwGWpG2mjwaaB0BNQwst3FIjqsg8Ct/mIZlvSPJvfi9y2AC8mi/ktxbFVL9pZ1I4A==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-optional-catch-binding@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.8.3.tgz#6111a265bcfb020eb9efd0fdfd7d26402b9ed6c1"
-  integrity sha512-6VPD0Pc1lpTqw0aKoeRTMiB+kWhAoT24PA+ksWSBrFtl5SIRVpZlwN3NNPQjehA2E/91FV3RjLWoVTglWcSV3Q==
+"@babel/plugin-transform-explicit-resource-management@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-explicit-resource-management/-/plugin-transform-explicit-resource-management-7.28.0.tgz#45be6211b778dbf4b9d54c4e8a2b42fa72e09a1a"
+  integrity sha512-K8nhUcn3f6iB+P3gwCv/no7OdzOZQcKchW6N389V6PD8NUWKZHzndOd9sPDVbMoBsbmjMqlB4L9fm+fEFNVlwQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/plugin-transform-destructuring" "^7.28.0"
 
-"@babel/plugin-syntax-optional-chaining@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.8.3.tgz#4f69c2ab95167e0180cd5336613f8c5788f7d48a"
-  integrity sha512-KoK9ErH1MBlCPxV0VANkXW2/dw4vlbGDrFgz8bmUsBGYkFRcbRwMh6cIJubdPrkxRwuGdtCk0v/wPTKbQgBjkg==
+"@babel/plugin-transform-exponentiation-operator@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.27.1.tgz#fc497b12d8277e559747f5a3ed868dd8064f83e1"
+  integrity sha512-uspvXnhHvGKf2r4VVtBpeFnuDWsJLQ6MF6lGJLC89jBR1uoVeqM416AZtTuhTezOfgHicpJQmoD5YUakO/YmXQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-private-property-in-object@^7.14.5":
-  version "7.14.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-private-property-in-object/-/plugin-syntax-private-property-in-object-7.14.5.tgz#0dc6671ec0ea22b6e94a1114f857970cd39de1ad"
-  integrity sha512-0wVnp9dxJ72ZUJDV27ZfbSj6iHLoytYZmh3rFcxNnvsJF3ktkzLDZPy/mA17HGsaQT3/DQsWYX1f1QGWkCoVUg==
+"@babel/plugin-transform-export-namespace-from@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.27.1.tgz#71ca69d3471edd6daa711cf4dfc3400415df9c23"
+  integrity sha512-tQvHWSZ3/jH2xuq/vZDy0jNn+ZdXJeM8gHvX4lnJmsc3+50yPlWdZXIc5ay+umX+2/tJIqHqiEqcJvxlmIvRvQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.14.5"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-syntax-top-level-await@^7.14.5":
-  version "7.14.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.14.5.tgz#c1cfdadc35a646240001f06138247b741c34d94c"
-  integrity sha512-hx++upLv5U1rgYfwe1xBQUhRmU41NEvpUvrp8jkrSCdvGSnM5/qdRMtylJ6PG5OFkBaHkbTAKTnd3/YyESRHFw==
+"@babel/plugin-transform-for-of@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.27.1.tgz#bc24f7080e9ff721b63a70ac7b2564ca15b6c40a"
+  integrity sha512-BfbWFFEJFQzLCQ5N8VocnCtA8J1CLkNTe2Ms2wocj75dd6VpiqS5Z5quTYcUoo4Yq+DN0rtikODccuv7RU81sw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.14.5"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.27.1"
 
-"@babel/plugin-transform-arrow-functions@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.21.5.tgz#9bb42a53de447936a57ba256fbf537fc312b6929"
-  integrity sha512-wb1mhwGOCaXHDTcsRYMKF9e5bbMgqwxtqa2Y1ifH96dXJPwbuLX9qHy3clhrxVqgMz7nyNXs8VkxdH8UBcjKqA==
+"@babel/plugin-transform-function-name@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.27.1.tgz#4d0bf307720e4dce6d7c30fcb1fd6ca77bdeb3a7"
+  integrity sha512-1bQeydJF9Nr1eBCMMbC+hdwmRlsv5XYOMu03YSWFwNs0HsAmtSxxF1fyuYPqemVldVyFmlCU7w8UE14LupUSZQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.21.5"
+    "@babel/helper-compilation-targets" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
 
-"@babel/plugin-transform-async-to-generator@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.20.7.tgz#dfee18623c8cb31deb796aa3ca84dda9cea94354"
-  integrity sha512-Uo5gwHPT9vgnSXQxqGtpdufUiWp96gk7yiP4Mp5bm1QMkEmLXBO7PAGYbKoJ6DhAwiNkcHFBol/x5zZZkL/t0Q==
+"@babel/plugin-transform-json-strings@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.27.1.tgz#a2e0ce6ef256376bd527f290da023983527a4f4c"
+  integrity sha512-6WVLVJiTjqcQauBhn1LkICsR2H+zm62I3h9faTDKt1qP4jn2o72tSvqMwtGFKGTpojce0gJs+76eZ2uCHRZh0Q==
   dependencies:
-    "@babel/helper-module-imports" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-remap-async-to-generator" "^7.18.9"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-block-scoped-functions@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.18.6.tgz#9187bf4ba302635b9d70d986ad70f038726216a8"
-  integrity sha512-ExUcOqpPWnliRcPqves5HJcJOvHvIIWfuS4sroBUenPuMdmW+SMHDakmtS7qOo13sVppmUijqeTv7qqGsvURpQ==
+"@babel/plugin-transform-literals@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.27.1.tgz#baaefa4d10a1d4206f9dcdda50d7d5827bb70b24"
+  integrity sha512-0HCFSepIpLTkLcsi86GG3mTUzxV5jpmbv97hTETW3yzrAij8aqlD36toB1D0daVFJM8NK6GvKO0gslVQmm+zZA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-block-scoping@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.21.0.tgz#e737b91037e5186ee16b76e7ae093358a5634f02"
-  integrity sha512-Mdrbunoh9SxwFZapeHVrwFmri16+oYotcZysSzhNIVDwIAb1UV+kvnxULSYq9J3/q5MDG+4X6w8QVgD1zhBXNQ==
+"@babel/plugin-transform-logical-assignment-operators@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.27.1.tgz#890cb20e0270e0e5bebe3f025b434841c32d5baa"
+  integrity sha512-SJvDs5dXxiae4FbSL1aBJlG4wvl594N6YEVVn9e3JGulwioy6z3oPjx/sQBO3Y4NwUu5HNix6KJ3wBZoewcdbw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-classes@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.21.0.tgz#f469d0b07a4c5a7dbb21afad9e27e57b47031665"
-  integrity sha512-RZhbYTCEUAe6ntPehC4hlslPWosNHDox+vAs4On/mCLRLfoDVHf6hVEd7kuxr1RnHwJmxFfUM3cZiZRmPxJPXQ==
+"@babel/plugin-transform-member-expression-literals@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.27.1.tgz#37b88ba594d852418e99536f5612f795f23aeaf9"
+  integrity sha512-hqoBX4dcZ1I33jCSWcXrP+1Ku7kdqXf1oeah7ooKOIiAdKQ+uqftgCFNOSzA5AMS2XIHEYeGFg4cKRCdpxzVOQ==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.18.6"
-    "@babel/helper-compilation-targets" "^7.20.7"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-function-name" "^7.21.0"
-    "@babel/helper-optimise-call-expression" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-replace-supers" "^7.20.7"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    globals "^11.1.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-computed-properties@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.21.5.tgz#3a2d8bb771cd2ef1cd736435f6552fe502e11b44"
-  integrity sha512-TR653Ki3pAwxBxUe8srfF3e4Pe3FTA46uaNHYyQwIoM4oWKSoOZiDNyHJ0oIoDIUPSRQbQG7jzgVBX3FPVne1Q==
+"@babel/plugin-transform-modules-amd@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.27.1.tgz#a4145f9d87c2291fe2d05f994b65dba4e3e7196f"
+  integrity sha512-iCsytMg/N9/oFq6n+gFTvUYDZQOMK5kEdeYxmxt91fcJGycfxVP9CnrxoliM0oumFERba2i8ZtwRUCMhvP1LnA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.21.5"
-    "@babel/template" "^7.20.7"
+    "@babel/helper-module-transforms" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-destructuring@^7.21.3":
-  version "7.21.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.21.3.tgz#73b46d0fd11cd6ef57dea8a381b1215f4959d401"
-  integrity sha512-bp6hwMFzuiE4HqYEyoGJ/V2LeIWn+hLVKc4pnj++E5XQptwhtcGmSayM029d/j2X1bPKGTlsyPwAubuU22KhMA==
+"@babel/plugin-transform-modules-commonjs@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.27.1.tgz#8e44ed37c2787ecc23bdc367f49977476614e832"
+  integrity sha512-OJguuwlTYlN0gBZFRPqwOGNWssZjfIUdS7HMYtN8c1KmwpwHFBwTeFZrg9XZa+DFTitWOW5iTAG7tyCUPsCCyw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-module-transforms" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-dotall-regex@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.18.6.tgz#b286b3e7aae6c7b861e45bed0a2fafd6b1a4fef8"
-  integrity sha512-6S3jpun1eEbAxq7TdjLotAsl4WpQI9DxfkycRcKrjhQYzU87qpXdknpBg/e+TdcMehqGnLFi7tnFUBR02Vq6wg==
+"@babel/plugin-transform-modules-systemjs@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.27.1.tgz#00e05b61863070d0f3292a00126c16c0e024c4ed"
+  integrity sha512-w5N1XzsRbc0PQStASMksmUeqECuzKuTJer7kFagK8AXgpCMkeDMO5S+aaFb7A51ZYDF7XI34qsTX+fkHiIm5yA==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-module-transforms" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-validator-identifier" "^7.27.1"
+    "@babel/traverse" "^7.27.1"
 
-"@babel/plugin-transform-dotall-regex@^7.4.4":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.16.7.tgz#6b2d67686fab15fb6a7fd4bd895d5982cfc81241"
-  integrity sha512-Lyttaao2SjZF6Pf4vk1dVKv8YypMpomAbygW+mU5cYP3S5cWTfCJjG8xV6CFdzGFlfWK81IjL9viiTvpb6G7gQ==
+"@babel/plugin-transform-modules-umd@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.27.1.tgz#63f2cf4f6dc15debc12f694e44714863d34cd334"
+  integrity sha512-iQBE/xC5BV1OxJbp6WG7jq9IWiD+xxlZhLrdwpPkTX3ydmXdvoCpyfJN7acaIBZaOqTfr76pgzqBJflNbeRK+w==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-module-transforms" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-duplicate-keys@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.18.9.tgz#687f15ee3cdad6d85191eb2a372c4528eaa0ae0e"
-  integrity sha512-d2bmXCtZXYc59/0SanQKbiWINadaJXqtvIQIzd4+hNwkWBgyCd5F/2t1kXoUdvPMrxzPvhK6EMQRROxsue+mfw==
+"@babel/plugin-transform-named-capturing-groups-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.27.1.tgz#f32b8f7818d8fc0cc46ee20a8ef75f071af976e1"
+  integrity sha512-SstR5JYy8ddZvD6MhV0tM/j16Qds4mIpJTOd1Yu9J9pJjH93bxHECF7pgtc28XvkzTD6Pxcm/0Z73Hvk7kb3Ng==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.9"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-exponentiation-operator@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.18.6.tgz#421c705f4521888c65e91fdd1af951bfefd4dacd"
-  integrity sha512-wzEtc0+2c88FVR34aQmiz56dxEkxr2g8DQb/KfaFa1JYXOFVsbhvAonFN6PwVWj++fKmku8NP80plJ5Et4wqHw==
+"@babel/plugin-transform-new-target@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.27.1.tgz#259c43939728cad1706ac17351b7e6a7bea1abeb"
+  integrity sha512-f6PiYeqXQ05lYq3TIfIDu/MtliKUbNwkGApPUvyo6+tc7uaR4cPjPe7DFPr15Uyycg2lZU6btZ575CuQoYh7MQ==
   dependencies:
-    "@babel/helper-builder-binary-assignment-operator-visitor" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-for-of@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.21.5.tgz#e890032b535f5a2e237a18535f56a9fdaa7b83fc"
-  integrity sha512-nYWpjKW/7j/I/mZkGVgHJXh4bA1sfdFnJoOXwJuj4m3Q2EraO/8ZyrkCau9P5tbHQk01RMSt6KYLCsW7730SXQ==
+"@babel/plugin-transform-nullish-coalescing-operator@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.27.1.tgz#4f9d3153bf6782d73dd42785a9d22d03197bc91d"
+  integrity sha512-aGZh6xMo6q9vq1JGcw58lZ1Z0+i0xB2x0XaauNIUXd6O1xXc3RwoWEBlsTQrY4KQ9Jf0s5rgD6SiNkaUdJegTA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.21.5"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-function-name@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.18.9.tgz#cc354f8234e62968946c61a46d6365440fc764e0"
-  integrity sha512-WvIBoRPaJQ5yVHzcnJFor7oS5Ls0PYixlTYE63lCj2RtdQEl15M68FXQlxnG6wdraJIXRdR7KI+hQ7q/9QjrCQ==
+"@babel/plugin-transform-numeric-separator@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.27.1.tgz#614e0b15cc800e5997dadd9bd6ea524ed6c819c6"
+  integrity sha512-fdPKAcujuvEChxDBJ5c+0BTaS6revLV7CJL08e4m3de8qJfNIuCc2nc7XJYOjBoTMJeqSmwXJ0ypE14RCjLwaw==
   dependencies:
-    "@babel/helper-compilation-targets" "^7.18.9"
-    "@babel/helper-function-name" "^7.18.9"
-    "@babel/helper-plugin-utils" "^7.18.9"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-literals@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.18.9.tgz#72796fdbef80e56fba3c6a699d54f0de557444bc"
-  integrity sha512-IFQDSRoTPnrAIrI5zoZv73IFeZu2dhu6irxQjY9rNjTT53VmKg9fenjvoiOWOkJ6mm4jKVPtdMzBY98Fp4Z4cg==
+"@babel/plugin-transform-object-rest-spread@^7.28.0":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.28.0.tgz#d23021857ffd7cd809f54d624299b8086402ed8d"
+  integrity sha512-9VNGikXxzu5eCiQjdE4IZn8sb9q7Xsk5EXLDBKUYg1e/Tve8/05+KJEtcxGxAgCY5t/BpKQM+JEL/yT4tvgiUA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.9"
+    "@babel/helper-compilation-targets" "^7.27.2"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/plugin-transform-destructuring" "^7.28.0"
+    "@babel/plugin-transform-parameters" "^7.27.7"
+    "@babel/traverse" "^7.28.0"
 
-"@babel/plugin-transform-member-expression-literals@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.18.6.tgz#ac9fdc1a118620ac49b7e7a5d2dc177a1bfee88e"
-  integrity sha512-qSF1ihLGO3q+/g48k85tUjD033C29TNTVB2paCwZPVmOsjn9pClvYYrM2VeJpBY2bcNkuny0YUyTNRyRxJ54KA==
+"@babel/plugin-transform-object-super@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.27.1.tgz#1c932cd27bf3874c43a5cac4f43ebf970c9871b5"
+  integrity sha512-SFy8S9plRPbIcxlJ8A6mT/CxFdJx/c04JEctz4jf8YZaVS2px34j7NXRrlGlHkN/M2gnpL37ZpGRGVFLd3l8Ng==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-replace-supers" "^7.27.1"
 
-"@babel/plugin-transform-modules-amd@^7.20.11":
-  version "7.20.11"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.20.11.tgz#3daccca8e4cc309f03c3a0c4b41dc4b26f55214a"
-  integrity sha512-NuzCt5IIYOW0O30UvqktzHYR2ud5bOWbY0yaxWZ6G+aFzOMJvrs5YHNikrbdaT15+KNO31nPOy5Fim3ku6Zb5g==
+"@babel/plugin-transform-optional-catch-binding@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.27.1.tgz#84c7341ebde35ccd36b137e9e45866825072a30c"
+  integrity sha512-txEAEKzYrHEX4xSZN4kJ+OfKXFVSWKB2ZxM9dpcE3wT7smwkNmXo5ORRlVzMVdJbD+Q8ILTgSD7959uj+3Dm3Q==
   dependencies:
-    "@babel/helper-module-transforms" "^7.20.11"
-    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-modules-commonjs@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.21.5.tgz#d69fb947eed51af91de82e4708f676864e5e47bc"
-  integrity sha512-OVryBEgKUbtqMoB7eG2rs6UFexJi6Zj6FDXx+esBLPTCxCNxAY9o+8Di7IsUGJ+AVhp5ncK0fxWUBd0/1gPhrQ==
+"@babel/plugin-transform-optional-chaining@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.27.1.tgz#874ce3c4f06b7780592e946026eb76a32830454f"
+  integrity sha512-BQmKPPIuc8EkZgNKsv0X4bPmOoayeu4F1YCwx2/CfmDSXDbp7GnzlUH+/ul5VGfRg1AoFPsrIThlEBj2xb4CAg==
   dependencies:
-    "@babel/helper-module-transforms" "^7.21.5"
-    "@babel/helper-plugin-utils" "^7.21.5"
-    "@babel/helper-simple-access" "^7.21.5"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.27.1"
 
-"@babel/plugin-transform-modules-systemjs@^7.20.11":
-  version "7.20.11"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.20.11.tgz#467ec6bba6b6a50634eea61c9c232654d8a4696e"
-  integrity sha512-vVu5g9BPQKSFEmvt2TA4Da5N+QVS66EX21d8uoOihC+OCpUoGvzVsXeqFdtAEfVa5BILAeFt+U7yVmLbQnAJmw==
+"@babel/plugin-transform-parameters@^7.27.7":
+  version "7.27.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.27.7.tgz#1fd2febb7c74e7d21cf3b05f7aebc907940af53a"
+  integrity sha512-qBkYTYCb76RRxUM6CcZA5KRu8K4SM8ajzVeUgVdMVO9NN9uI/GaVmBg/WKJJGnNokV9SY8FxNOVWGXzqzUidBg==
   dependencies:
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-module-transforms" "^7.20.11"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-validator-identifier" "^7.19.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-modules-umd@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.18.6.tgz#81d3832d6034b75b54e62821ba58f28ed0aab4b9"
-  integrity sha512-dcegErExVeXcRqNtkRU/z8WlBLnvD4MRnHgNs3MytRO1Mn1sHRyhbcpYbVMGclAqOjdW+9cfkdZno9dFdfKLfQ==
+"@babel/plugin-transform-private-methods@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.27.1.tgz#fdacbab1c5ed81ec70dfdbb8b213d65da148b6af"
+  integrity sha512-10FVt+X55AjRAYI9BrdISN9/AQWHqldOeZDUoLyif1Kn05a56xVBXb8ZouL8pZ9jem8QpXaOt8TS7RHUIS+GPA==
   dependencies:
-    "@babel/helper-module-transforms" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-create-class-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-named-capturing-groups-regex@^7.20.5":
-  version "7.20.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.20.5.tgz#626298dd62ea51d452c3be58b285d23195ba69a8"
-  integrity sha512-mOW4tTzi5iTLnw+78iEq3gr8Aoq4WNRGpmSlrogqaiCBoR1HFhpU4JkpQFOHfeYx3ReVIFWOQJS4aZBRvuZ6mA==
+"@babel/plugin-transform-private-property-in-object@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.27.1.tgz#4dbbef283b5b2f01a21e81e299f76e35f900fb11"
+  integrity sha512-5J+IhqTi1XPa0DXF83jYOaARrX+41gOewWbkPyjMNRDqgOCqdffGh8L3f/Ek5utaEBZExjSAzcyjmV9SSAWObQ==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.20.5"
-    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-annotate-as-pure" "^7.27.1"
+    "@babel/helper-create-class-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-new-target@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.18.6.tgz#d128f376ae200477f37c4ddfcc722a8a1b3246a8"
-  integrity sha512-DjwFA/9Iu3Z+vrAn+8pBUGcjhxKguSMlsFqeCKbhb9BAV756v0krzVK04CRDi/4aqmk8BsHb4a/gFcaA5joXRw==
+"@babel/plugin-transform-property-literals@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.27.1.tgz#07eafd618800591e88073a0af1b940d9a42c6424"
+  integrity sha512-oThy3BCuCha8kDZ8ZkgOg2exvPYUlprMukKQXI1r1pJ47NCvxfkEy8vK+r/hT9nF0Aa4H1WUPZZjHTFtAhGfmQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-object-super@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.18.6.tgz#fb3c6ccdd15939b6ff7939944b51971ddc35912c"
-  integrity sha512-uvGz6zk+pZoS1aTZrOvrbj6Pp/kK2mp45t2B+bTDre2UgsZZ8EZLSJtUg7m/no0zOJUWgFONpB7Zv9W2tSaFlA==
+"@babel/plugin-transform-regenerator@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.28.3.tgz#b8eee0f8aed37704bbcc932fd0b1a0a34d0b7344"
+  integrity sha512-K3/M/a4+ESb5LEldjQb+XSrpY0nF+ZBFlTCbSnKaYAMfD8v33O6PMs4uYnOk19HlcsI8WMu3McdFPTiQHF/1/A==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
-    "@babel/helper-replace-supers" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-parameters@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.20.7.tgz#0ee349e9d1bc96e78e3b37a7af423a4078a7083f"
-  integrity sha512-WiWBIkeHKVOSYPO0pWkxGPfKeWrCJyD3NJ53+Lrp/QMSZbsVPovrVl2aWZ19D/LTVnaDv5Ap7GJ/B2CTOZdrfA==
+"@babel/plugin-transform-regexp-modifiers@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regexp-modifiers/-/plugin-transform-regexp-modifiers-7.27.1.tgz#df9ba5577c974e3f1449888b70b76169998a6d09"
+  integrity sha512-TtEciroaiODtXvLZv4rmfMhkCv8jx3wgKpL68PuiPh2M4fvz5jhsA7697N1gMvkvr/JTF13DrFYyEbY9U7cVPA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-parameters@^7.21.3":
-  version "7.21.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.21.3.tgz#18fc4e797cf6d6d972cb8c411dbe8a809fa157db"
-  integrity sha512-Wxc+TvppQG9xWFYatvCGPvZ6+SIUxQ2ZdiBP+PHYMIjnPXD+uThCshaz4NZOnODAtBjjcVQQ/3OKs9LW28purQ==
+"@babel/plugin-transform-reserved-words@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.27.1.tgz#40fba4878ccbd1c56605a4479a3a891ac0274bb4"
+  integrity sha512-V2ABPHIJX4kC7HegLkYoDpfg9PVmuWy/i6vUM5eGK22bx4YVFD3M5F0QQnWQoDs6AGsUWTVOopBiMFQgHaSkVw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-property-literals@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.18.6.tgz#e22498903a483448e94e032e9bbb9c5ccbfc93a3"
-  integrity sha512-cYcs6qlgafTud3PAzrrRNbQtfpQ8+y/+M5tKmksS9+M1ckbH6kzY8MrexEM9mcA6JDsukE19iIRvAyYl463sMg==
+"@babel/plugin-transform-runtime@7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.28.3.tgz#f5990a1b2d2bde950ed493915e0719841c8d0eaa"
+  integrity sha512-Y6ab1kGqZ0u42Zv/4a7l0l72n9DKP/MKoKWaUSBylrhNZO2prYuqFOLbn5aW5SIFXwSH93yfjbgllL8lxuGKLg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-module-imports" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    babel-plugin-polyfill-corejs2 "^0.4.14"
+    babel-plugin-polyfill-corejs3 "^0.13.0"
+    babel-plugin-polyfill-regenerator "^0.6.5"
+    semver "^6.3.1"
 
-"@babel/plugin-transform-regenerator@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.21.5.tgz#576c62f9923f94bcb1c855adc53561fd7913724e"
-  integrity sha512-ZoYBKDb6LyMi5yCsByQ5jmXsHAQDDYeexT1Szvlmui+lADvfSecr5Dxd/PkrTC3pAD182Fcju1VQkB4oCp9M+w==
+"@babel/plugin-transform-shorthand-properties@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.27.1.tgz#532abdacdec87bfee1e0ef8e2fcdee543fe32b90"
+  integrity sha512-N/wH1vcn4oYawbJ13Y/FxcQrWk63jhfNa7jef0ih7PHSIHX2LB7GWE1rkPrOnka9kwMxb6hMl19p7lidA+EHmQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.21.5"
-    regenerator-transform "^0.15.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-reserved-words@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.18.6.tgz#b1abd8ebf8edaa5f7fe6bbb8d2133d23b6a6f76a"
-  integrity sha512-oX/4MyMoypzHjFrT1CdivfKZ+XvIPMFXwwxHp/r0Ddy2Vuomt4HDFGmft1TAY2yiTKiNSsh3kjBAzcM8kSdsjA==
+"@babel/plugin-transform-spread@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.27.1.tgz#1a264d5fc12750918f50e3fe3e24e437178abb08"
+  integrity sha512-kpb3HUqaILBJcRFVhFUs6Trdd4mkrzcGXss+6/mxUd273PfbWqSDHRzMT2234gIg2QYfAjvXLSquP1xECSg09Q==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.27.1"
 
-"@babel/plugin-transform-runtime@7.21.4":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.21.4.tgz#2e1da21ca597a7d01fc96b699b21d8d2023191aa"
-  integrity sha512-1J4dhrw1h1PqnNNpzwxQ2UBymJUF8KuPjAAnlLwZcGhHAIqUigFW7cdK6GHoB64ubY4qXQNYknoUeks4Wz7CUA==
+"@babel/plugin-transform-sticky-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.27.1.tgz#18984935d9d2296843a491d78a014939f7dcd280"
+  integrity sha512-lhInBO5bi/Kowe2/aLdBAawijx+q1pQzicSgnkB6dUPc1+RC8QmJHKf2OjvU+NZWitguJHEaEmbV6VWEouT58g==
   dependencies:
-    "@babel/helper-module-imports" "^7.21.4"
-    "@babel/helper-plugin-utils" "^7.20.2"
-    babel-plugin-polyfill-corejs2 "^0.3.3"
-    babel-plugin-polyfill-corejs3 "^0.6.0"
-    babel-plugin-polyfill-regenerator "^0.4.1"
-    semver "^6.3.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-shorthand-properties@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.18.6.tgz#6d6df7983d67b195289be24909e3f12a8f664dc9"
-  integrity sha512-eCLXXJqv8okzg86ywZJbRn19YJHU4XUa55oz2wbHhaQVn/MM+XhukiT7SYqp/7o00dg52Rj51Ny+Ecw4oyoygw==
+"@babel/plugin-transform-template-literals@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.27.1.tgz#1a0eb35d8bb3e6efc06c9fd40eb0bcef548328b8"
+  integrity sha512-fBJKiV7F2DxZUkg5EtHKXQdbsbURW3DZKQUWphDum0uRP6eHGGa/He9mc0mypL680pb+e/lDIthRohlv8NCHkg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-spread@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.20.7.tgz#c2d83e0b99d3bf83e07b11995ee24bf7ca09401e"
-  integrity sha512-ewBbHQ+1U/VnH1fxltbJqDeWBU1oNLG8Dj11uIv3xVf7nrQu0bPGe5Rf716r7K5Qz+SqtAOVswoVunoiBtGhxw==
+"@babel/plugin-transform-typeof-symbol@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.27.1.tgz#70e966bb492e03509cf37eafa6dcc3051f844369"
+  integrity sha512-RiSILC+nRJM7FY5srIyc4/fGIwUhyDuuBSdWn4y6yT6gm652DpCHZjIipgn6B7MQ1ITOUnAKWixEUjQRIBIcLw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.20.0"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-sticky-regex@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.18.6.tgz#c6706eb2b1524028e317720339583ad0f444adcc"
-  integrity sha512-kfiDrDQ+PBsQDO85yj1icueWMfGfJFKN1KCkndygtu/C9+XUfydLC8Iv5UYJqRwy4zk8EcplRxEOeLyjq1gm6Q==
+"@babel/plugin-transform-typescript@^7.27.1":
+  version "7.28.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.28.0.tgz#796cbd249ab56c18168b49e3e1d341b72af04a6b"
+  integrity sha512-4AEiDEBPIZvLQaWlc9liCavE0xRM0dNca41WtBeM3jgFptfUOSG9z0uteLhq6+3rq+WB6jIvUwKDTpXEHPJ2Vg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-annotate-as-pure" "^7.27.3"
+    "@babel/helper-create-class-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.27.1"
+    "@babel/plugin-syntax-typescript" "^7.27.1"
 
-"@babel/plugin-transform-template-literals@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.18.9.tgz#04ec6f10acdaa81846689d63fae117dd9c243a5e"
-  integrity sha512-S8cOWfT82gTezpYOiVaGHrCbhlHgKhQt8XH5ES46P2XWmX92yisoZywf5km75wv5sYcXDUCLMmMxOLCtthDgMA==
+"@babel/plugin-transform-unicode-escapes@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.27.1.tgz#3e3143f8438aef842de28816ece58780190cf806"
+  integrity sha512-Ysg4v6AmF26k9vpfFuTZg8HRfVWzsh1kVfowA23y9j/Gu6dOuahdUVhkLqpObp3JIv27MLSii6noRnuKN8H0Mg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.9"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-typeof-symbol@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.18.9.tgz#c8cea68263e45addcd6afc9091429f80925762c0"
-  integrity sha512-SRfwTtF11G2aemAZWivL7PD+C9z52v9EvMqH9BuYbabyPuKUvSWks3oCg6041pT925L4zVFqaVBeECwsmlguEw==
+"@babel/plugin-transform-unicode-property-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.27.1.tgz#bdfe2d3170c78c5691a3c3be934c8c0087525956"
+  integrity sha512-uW20S39PnaTImxp39O5qFlHLS9LJEmANjMG7SxIhap8rCHqu0Ik+tLEPX5DKmHn6CsWQ7j3lix2tFOa5YtL12Q==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.18.9"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-unicode-escapes@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.21.5.tgz#1e55ed6195259b0e9061d81f5ef45a9b009fb7f2"
-  integrity sha512-LYm/gTOwZqsYohlvFUe/8Tujz75LqqVC2w+2qPHLR+WyWHGCZPN1KBpJCJn+4Bk4gOkQy/IXKIge6az5MqwlOg==
+"@babel/plugin-transform-unicode-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.27.1.tgz#25948f5c395db15f609028e370667ed8bae9af97"
+  integrity sha512-xvINq24TRojDuyt6JGtHmkVkrfVV3FPT16uytxImLeBZqW3/H52yN+kM1MGuyPkIQxrzKwPHs5U/MP3qKyzkGw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.21.5"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/plugin-transform-unicode-regex@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.18.6.tgz#194317225d8c201bbae103364ffe9e2cea36cdca"
-  integrity sha512-gE7A6Lt7YLnNOL3Pb9BNeZvi+d8l7tcRrG4+pwJjK9hD2xX4mEvjlQW60G9EEmfXVYRPv9VRQcyegIVHCql/AA==
+"@babel/plugin-transform-unicode-sets-regex@^7.27.1":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.27.1.tgz#6ab706d10f801b5c72da8bb2548561fa04193cd1"
+  integrity sha512-EtkOujbc4cgvb0mlpQefi4NTPBzhSIevblFevACNLUspmrALgmEBdL/XfnyyITfd8fKBZrZys92zOWcik7j9Tw==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.18.6"
-    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-create-regexp-features-plugin" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
 
-"@babel/preset-env@7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.21.5.tgz#db2089d99efd2297716f018aeead815ac3decffb"
-  integrity sha512-wH00QnTTldTbf/IefEVyChtRdw5RJvODT/Vb4Vcxq1AZvtXj6T0YeX0cAcXhI6/BdGuiP3GcNIL4OQbI2DVNxg==
+"@babel/preset-env@7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.28.3.tgz#2b18d9aff9e69643789057ae4b942b1654f88187"
+  integrity sha512-ROiDcM+GbYVPYBOeCR6uBXKkQpBExLl8k9HO1ygXEyds39j+vCCsjmj7S8GOniZQlEs81QlkdJZe76IpLSiqpg==
   dependencies:
-    "@babel/compat-data" "^7.21.5"
-    "@babel/helper-compilation-targets" "^7.21.5"
-    "@babel/helper-plugin-utils" "^7.21.5"
-    "@babel/helper-validator-option" "^7.21.0"
-    "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression" "^7.18.6"
-    "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining" "^7.20.7"
-    "@babel/plugin-proposal-async-generator-functions" "^7.20.7"
-    "@babel/plugin-proposal-class-properties" "^7.18.6"
-    "@babel/plugin-proposal-class-static-block" "^7.21.0"
-    "@babel/plugin-proposal-dynamic-import" "^7.18.6"
-    "@babel/plugin-proposal-export-namespace-from" "^7.18.9"
-    "@babel/plugin-proposal-json-strings" "^7.18.6"
-    "@babel/plugin-proposal-logical-assignment-operators" "^7.20.7"
-    "@babel/plugin-proposal-nullish-coalescing-operator" "^7.18.6"
-    "@babel/plugin-proposal-numeric-separator" "^7.18.6"
-    "@babel/plugin-proposal-object-rest-spread" "^7.20.7"
-    "@babel/plugin-proposal-optional-catch-binding" "^7.18.6"
-    "@babel/plugin-proposal-optional-chaining" "^7.21.0"
-    "@babel/plugin-proposal-private-methods" "^7.18.6"
-    "@babel/plugin-proposal-private-property-in-object" "^7.21.0"
-    "@babel/plugin-proposal-unicode-property-regex" "^7.18.6"
-    "@babel/plugin-syntax-async-generators" "^7.8.4"
-    "@babel/plugin-syntax-class-properties" "^7.12.13"
-    "@babel/plugin-syntax-class-static-block" "^7.14.5"
-    "@babel/plugin-syntax-dynamic-import" "^7.8.3"
-    "@babel/plugin-syntax-export-namespace-from" "^7.8.3"
-    "@babel/plugin-syntax-import-assertions" "^7.20.0"
-    "@babel/plugin-syntax-import-meta" "^7.10.4"
-    "@babel/plugin-syntax-json-strings" "^7.8.3"
-    "@babel/plugin-syntax-logical-assignment-operators" "^7.10.4"
-    "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.3"
-    "@babel/plugin-syntax-numeric-separator" "^7.10.4"
-    "@babel/plugin-syntax-object-rest-spread" "^7.8.3"
-    "@babel/plugin-syntax-optional-catch-binding" "^7.8.3"
-    "@babel/plugin-syntax-optional-chaining" "^7.8.3"
-    "@babel/plugin-syntax-private-property-in-object" "^7.14.5"
-    "@babel/plugin-syntax-top-level-await" "^7.14.5"
-    "@babel/plugin-transform-arrow-functions" "^7.21.5"
-    "@babel/plugin-transform-async-to-generator" "^7.20.7"
-    "@babel/plugin-transform-block-scoped-functions" "^7.18.6"
-    "@babel/plugin-transform-block-scoping" "^7.21.0"
-    "@babel/plugin-transform-classes" "^7.21.0"
-    "@babel/plugin-transform-computed-properties" "^7.21.5"
-    "@babel/plugin-transform-destructuring" "^7.21.3"
-    "@babel/plugin-transform-dotall-regex" "^7.18.6"
-    "@babel/plugin-transform-duplicate-keys" "^7.18.9"
-    "@babel/plugin-transform-exponentiation-operator" "^7.18.6"
-    "@babel/plugin-transform-for-of" "^7.21.5"
-    "@babel/plugin-transform-function-name" "^7.18.9"
-    "@babel/plugin-transform-literals" "^7.18.9"
-    "@babel/plugin-transform-member-expression-literals" "^7.18.6"
-    "@babel/plugin-transform-modules-amd" "^7.20.11"
-    "@babel/plugin-transform-modules-commonjs" "^7.21.5"
-    "@babel/plugin-transform-modules-systemjs" "^7.20.11"
-    "@babel/plugin-transform-modules-umd" "^7.18.6"
-    "@babel/plugin-transform-named-capturing-groups-regex" "^7.20.5"
-    "@babel/plugin-transform-new-target" "^7.18.6"
-    "@babel/plugin-transform-object-super" "^7.18.6"
-    "@babel/plugin-transform-parameters" "^7.21.3"
-    "@babel/plugin-transform-property-literals" "^7.18.6"
-    "@babel/plugin-transform-regenerator" "^7.21.5"
-    "@babel/plugin-transform-reserved-words" "^7.18.6"
-    "@babel/plugin-transform-shorthand-properties" "^7.18.6"
-    "@babel/plugin-transform-spread" "^7.20.7"
-    "@babel/plugin-transform-sticky-regex" "^7.18.6"
-    "@babel/plugin-transform-template-literals" "^7.18.9"
-    "@babel/plugin-transform-typeof-symbol" "^7.18.9"
-    "@babel/plugin-transform-unicode-escapes" "^7.21.5"
-    "@babel/plugin-transform-unicode-regex" "^7.18.6"
-    "@babel/preset-modules" "^0.1.5"
-    "@babel/types" "^7.21.5"
-    babel-plugin-polyfill-corejs2 "^0.3.3"
-    babel-plugin-polyfill-corejs3 "^0.6.0"
-    babel-plugin-polyfill-regenerator "^0.4.1"
-    core-js-compat "^3.25.1"
-    semver "^6.3.0"
+    "@babel/compat-data" "^7.28.0"
+    "@babel/helper-compilation-targets" "^7.27.2"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/helper-validator-option" "^7.27.1"
+    "@babel/plugin-bugfix-firefox-class-in-computed-class-key" "^7.27.1"
+    "@babel/plugin-bugfix-safari-class-field-initializer-scope" "^7.27.1"
+    "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression" "^7.27.1"
+    "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining" "^7.27.1"
+    "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly" "^7.28.3"
+    "@babel/plugin-proposal-private-property-in-object" "7.21.0-placeholder-for-preset-env.2"
+    "@babel/plugin-syntax-import-assertions" "^7.27.1"
+    "@babel/plugin-syntax-import-attributes" "^7.27.1"
+    "@babel/plugin-syntax-unicode-sets-regex" "^7.18.6"
+    "@babel/plugin-transform-arrow-functions" "^7.27.1"
+    "@babel/plugin-transform-async-generator-functions" "^7.28.0"
+    "@babel/plugin-transform-async-to-generator" "^7.27.1"
+    "@babel/plugin-transform-block-scoped-functions" "^7.27.1"
+    "@babel/plugin-transform-block-scoping" "^7.28.0"
+    "@babel/plugin-transform-class-properties" "^7.27.1"
+    "@babel/plugin-transform-class-static-block" "^7.28.3"
+    "@babel/plugin-transform-classes" "^7.28.3"
+    "@babel/plugin-transform-computed-properties" "^7.27.1"
+    "@babel/plugin-transform-destructuring" "^7.28.0"
+    "@babel/plugin-transform-dotall-regex" "^7.27.1"
+    "@babel/plugin-transform-duplicate-keys" "^7.27.1"
+    "@babel/plugin-transform-duplicate-named-capturing-groups-regex" "^7.27.1"
+    "@babel/plugin-transform-dynamic-import" "^7.27.1"
+    "@babel/plugin-transform-explicit-resource-management" "^7.28.0"
+    "@babel/plugin-transform-exponentiation-operator" "^7.27.1"
+    "@babel/plugin-transform-export-namespace-from" "^7.27.1"
+    "@babel/plugin-transform-for-of" "^7.27.1"
+    "@babel/plugin-transform-function-name" "^7.27.1"
+    "@babel/plugin-transform-json-strings" "^7.27.1"
+    "@babel/plugin-transform-literals" "^7.27.1"
+    "@babel/plugin-transform-logical-assignment-operators" "^7.27.1"
+    "@babel/plugin-transform-member-expression-literals" "^7.27.1"
+    "@babel/plugin-transform-modules-amd" "^7.27.1"
+    "@babel/plugin-transform-modules-commonjs" "^7.27.1"
+    "@babel/plugin-transform-modules-systemjs" "^7.27.1"
+    "@babel/plugin-transform-modules-umd" "^7.27.1"
+    "@babel/plugin-transform-named-capturing-groups-regex" "^7.27.1"
+    "@babel/plugin-transform-new-target" "^7.27.1"
+    "@babel/plugin-transform-nullish-coalescing-operator" "^7.27.1"
+    "@babel/plugin-transform-numeric-separator" "^7.27.1"
+    "@babel/plugin-transform-object-rest-spread" "^7.28.0"
+    "@babel/plugin-transform-object-super" "^7.27.1"
+    "@babel/plugin-transform-optional-catch-binding" "^7.27.1"
+    "@babel/plugin-transform-optional-chaining" "^7.27.1"
+    "@babel/plugin-transform-parameters" "^7.27.7"
+    "@babel/plugin-transform-private-methods" "^7.27.1"
+    "@babel/plugin-transform-private-property-in-object" "^7.27.1"
+    "@babel/plugin-transform-property-literals" "^7.27.1"
+    "@babel/plugin-transform-regenerator" "^7.28.3"
+    "@babel/plugin-transform-regexp-modifiers" "^7.27.1"
+    "@babel/plugin-transform-reserved-words" "^7.27.1"
+    "@babel/plugin-transform-shorthand-properties" "^7.27.1"
+    "@babel/plugin-transform-spread" "^7.27.1"
+    "@babel/plugin-transform-sticky-regex" "^7.27.1"
+    "@babel/plugin-transform-template-literals" "^7.27.1"
+    "@babel/plugin-transform-typeof-symbol" "^7.27.1"
+    "@babel/plugin-transform-unicode-escapes" "^7.27.1"
+    "@babel/plugin-transform-unicode-property-regex" "^7.27.1"
+    "@babel/plugin-transform-unicode-regex" "^7.27.1"
+    "@babel/plugin-transform-unicode-sets-regex" "^7.27.1"
+    "@babel/preset-modules" "0.1.6-no-external-plugins"
+    babel-plugin-polyfill-corejs2 "^0.4.14"
+    babel-plugin-polyfill-corejs3 "^0.13.0"
+    babel-plugin-polyfill-regenerator "^0.6.5"
+    core-js-compat "^3.43.0"
+    semver "^6.3.1"
 
-"@babel/preset-modules@^0.1.5":
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/@babel/preset-modules/-/preset-modules-0.1.5.tgz#ef939d6e7f268827e1841638dc6ff95515e115d9"
-  integrity sha512-A57th6YRG7oR3cq/yt/Y84MvGgE0eJG2F1JLhKuyG+jFxEgrd/HAMJatiFtmOiZurz+0DkrvbheCLaV5f2JfjA==
+"@babel/preset-modules@0.1.6-no-external-plugins":
+  version "0.1.6-no-external-plugins"
+  resolved "https://registry.yarnpkg.com/@babel/preset-modules/-/preset-modules-0.1.6-no-external-plugins.tgz#ccb88a2c49c817236861fee7826080573b8a923a"
+  integrity sha512-HrcgcIESLm9aIR842yhJ5RWan/gebQUJ6E/E5+rf0y9o6oj7w0Br+sWuL6kEQ/o/AdfvR1Je9jG18/gnpwjEyA==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-proposal-unicode-property-regex" "^7.4.4"
-    "@babel/plugin-transform-dotall-regex" "^7.4.4"
     "@babel/types" "^7.4.4"
     esutils "^2.0.2"
 
-"@babel/register@7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/register/-/register-7.21.0.tgz#c97bf56c2472e063774f31d344c592ebdcefa132"
-  integrity sha512-9nKsPmYDi5DidAqJaQooxIhsLJiNMkGr8ypQ8Uic7cIox7UCDsM7HuUGxdGT7mSDTYbqzIdsOWzfBton/YJrMw==
+"@babel/register@7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/register/-/register-7.28.3.tgz#abd8a3753480c799bdaf9c9092d6745d16e052c2"
+  integrity sha512-CieDOtd8u208eI49bYl4z1J22ySFw87IGwE+IswFEExH7e3rLgKb0WNQeumnacQ1+VoDJLYI5QFA3AJZuyZQfA==
   dependencies:
     clone-deep "^4.0.1"
     find-cache-dir "^2.0.0"
     make-dir "^2.1.0"
-    pirates "^4.0.5"
+    pirates "^4.0.6"
     source-map-support "^0.5.16"
 
-"@babel/regjsgen@^0.8.0":
-  version "0.8.0"
-  resolved "https://registry.yarnpkg.com/@babel/regjsgen/-/regjsgen-0.8.0.tgz#f0ba69b075e1f05fb2825b7fad991e7adbb18310"
-  integrity sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA==
+"@babel/runtime@7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.28.4.tgz#a70226016fabe25c5783b2f22d3e1c9bc5ca3326"
+  integrity sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==
 
-"@babel/runtime@7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.21.5.tgz#8492dddda9644ae3bda3b45eabe87382caee7200"
-  integrity sha512-8jI69toZqqcsnqGGqwGS4Qb1VwLOEp4hz+CXPywcvjs60u3B4Pom/U/7rm4W8tMOYEB+E9wgD0mW1l3r8qlI9Q==
-  dependencies:
-    regenerator-runtime "^0.13.11"
+"@babel/runtime@^7.12.5":
+  version "7.27.1"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.27.1.tgz#9fce313d12c9a77507f264de74626e87fd0dc541"
+  integrity sha512-1x3D2xEk2fRo3PAhwQwu5UubzgiVWSXTBfWpVd2Mx2AzRqJuDJCsgaDVZ7HB5iGzDW1Hl1sWN2mFyKjmR9uAog==
 
-"@babel/runtime@^7.8.4":
-  version "7.17.7"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.7.tgz#a5f3328dc41ff39d803f311cfe17703418cf9825"
-  integrity sha512-L6rvG9GDxaLgFjg41K+5Yv9OMrU98sWe+Ykmc6FDJW/+vYZMhdOMKkISgzptMaERHvS2Y2lw9MDRm2gHhlQQoA==
+"@babel/template@^7.27.0":
+  version "7.27.0"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.27.0.tgz#b253e5406cc1df1c57dcd18f11760c2dbf40c0b4"
+  integrity sha512-2ncevenBqXI6qRMukPlXwHKHchC7RyMuu4xv5JBXRfOGVcTy1mXCD12qrp7Jsoxll1EV3+9sE4GugBVRjT2jFA==
   dependencies:
-    regenerator-runtime "^0.13.4"
+    "@babel/code-frame" "^7.26.2"
+    "@babel/parser" "^7.27.0"
+    "@babel/types" "^7.27.0"
 
-"@babel/template@^7.18.10":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.18.10.tgz#6f9134835970d1dbf0835c0d100c9f38de0c5e71"
-  integrity sha512-TI+rCtooWHr3QJ27kJxfjutghu44DLnasDMwpDqCXVTal9RLp3RSYNh4NdBrRP2cQAoG9A8juOQl6P6oZG4JxA==
+"@babel/template@^7.27.1", "@babel/template@^7.27.2":
+  version "7.27.2"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.27.2.tgz#fa78ceed3c4e7b63ebf6cb39e5852fca45f6809d"
+  integrity sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw==
   dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/parser" "^7.18.10"
-    "@babel/types" "^7.18.10"
+    "@babel/code-frame" "^7.27.1"
+    "@babel/parser" "^7.27.2"
+    "@babel/types" "^7.27.1"
 
-"@babel/template@^7.18.6":
-  version "7.18.6"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.18.6.tgz#1283f4993e00b929d6e2d3c72fdc9168a2977a31"
-  integrity sha512-JoDWzPe+wgBsTTgdnIma3iHNFC7YVJoPssVBDjiHfNlyt4YcunDtcDOUmfVDfCK5MfdsaIoX9PkijPhjH3nYUw==
+"@babel/traverse@^7.25.9":
+  version "7.27.0"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.27.0.tgz#11d7e644779e166c0442f9a07274d02cd91d4a70"
+  integrity sha512-19lYZFzYVQkkHkl4Cy4WrAVcqBkgvV2YM2TU3xG6DIwO7O3ecbDPfW3yM3bjAGcqcQHi+CCtjMR3dIEHxsd6bA==
   dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/parser" "^7.18.6"
-    "@babel/types" "^7.18.6"
-
-"@babel/template@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.20.7.tgz#a15090c2839a83b02aa996c0b4994005841fd5a8"
-  integrity sha512-8SegXApWe6VoNw0r9JHpSteLKTpTiLZ4rMlGIm9JQ18KiCtyQiAMEazujAHrUS5flrcqYZa75ukev3P6QmUwUw==
-  dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/parser" "^7.20.7"
-    "@babel/types" "^7.20.7"
-
-"@babel/template@^7.22.15":
-  version "7.22.15"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.22.15.tgz#09576efc3830f0430f4548ef971dde1350ef2f38"
-  integrity sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==
-  dependencies:
-    "@babel/code-frame" "^7.22.13"
-    "@babel/parser" "^7.22.15"
-    "@babel/types" "^7.22.15"
-
-"@babel/template@^7.23.9":
-  version "7.24.0"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.24.0.tgz#c6a524aa93a4a05d66aaf31654258fae69d87d50"
-  integrity sha512-Bkf2q8lMB0AFpX0NFEqSbx1OkTHf0f+0j82mkw+ZpzBnkk7e9Ql0891vlfgi+kHwOk8tQjiQHpqh4LaSa0fKEA==
-  dependencies:
-    "@babel/code-frame" "^7.23.5"
-    "@babel/parser" "^7.24.0"
-    "@babel/types" "^7.24.0"
-
-"@babel/traverse@^7.18.10":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.18.10.tgz#37ad97d1cb00efa869b91dd5d1950f8a6cf0cb08"
-  integrity sha512-J7ycxg0/K9XCtLyHf0cz2DqDihonJeIo+z+HEdRe9YuT8TY4A66i+Ab2/xZCEW7Ro60bPCBBfqqboHSamoV3+g==
-  dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/generator" "^7.18.10"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-function-name" "^7.18.9"
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/parser" "^7.18.10"
-    "@babel/types" "^7.18.10"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
-"@babel/traverse@^7.18.6", "@babel/traverse@^7.18.8":
-  version "7.18.8"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.18.8.tgz#f095e62ab46abf1da35e5a2011f43aee72d8d5b0"
-  integrity sha512-UNg/AcSySJYR/+mIcJQDCv00T+AqRO7j/ZEJLzpaYtgM48rMg5MnkJgyNqkzo88+p4tfRvZJCEiwwfG6h4jkRg==
-  dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/generator" "^7.18.7"
-    "@babel/helper-environment-visitor" "^7.18.6"
-    "@babel/helper-function-name" "^7.18.6"
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/parser" "^7.18.8"
-    "@babel/types" "^7.18.8"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
-"@babel/traverse@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.18.9.tgz#deeff3e8f1bad9786874cb2feda7a2d77a904f98"
-  integrity sha512-LcPAnujXGwBgv3/WHv01pHtb2tihcyW1XuL9wd7jqh1Z8AQkTd+QVjMrMijrln0T7ED3UXLIy36P9Ao7W75rYg==
-  dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/generator" "^7.18.9"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-function-name" "^7.18.9"
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/parser" "^7.18.9"
-    "@babel/types" "^7.18.9"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
-"@babel/traverse@^7.20.7":
-  version "7.20.8"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.20.8.tgz#e3a23eb04af24f8bbe8a8ba3eef6155b77df0b08"
-  integrity sha512-/RNkaYDeCy4MjyV70+QkSHhxbvj2JO/5Ft2Pa880qJOG8tWrqcT/wXUuCCv43yogfqPzHL77Xu101KQPf4clnQ==
-  dependencies:
-    "@babel/code-frame" "^7.18.6"
-    "@babel/generator" "^7.20.7"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-function-name" "^7.19.0"
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/parser" "^7.20.7"
-    "@babel/types" "^7.20.7"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
-"@babel/traverse@^7.21.2":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.21.4.tgz#a836aca7b116634e97a6ed99976236b3282c9d36"
-  integrity sha512-eyKrRHKdyZxqDm+fV1iqL9UAHMoIg0nDaGqfIOd8rKH17m5snv7Gn4qgjBoFfLz9APvjFU/ICT00NVCv1Epp8Q==
-  dependencies:
-    "@babel/code-frame" "^7.21.4"
-    "@babel/generator" "^7.21.4"
-    "@babel/helper-environment-visitor" "^7.18.9"
-    "@babel/helper-function-name" "^7.21.0"
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/parser" "^7.21.4"
-    "@babel/types" "^7.21.4"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
-"@babel/traverse@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.21.5.tgz#ad22361d352a5154b498299d523cf72998a4b133"
-  integrity sha512-AhQoI3YjWi6u/y/ntv7k48mcrCXmus0t79J9qPNlk/lAsFlCiJ047RmbfMOawySTHtywXhbXgpx/8nXMYd+oFw==
-  dependencies:
-    "@babel/code-frame" "^7.21.4"
-    "@babel/generator" "^7.21.5"
-    "@babel/helper-environment-visitor" "^7.21.5"
-    "@babel/helper-function-name" "^7.21.0"
-    "@babel/helper-hoist-variables" "^7.18.6"
-    "@babel/helper-split-export-declaration" "^7.18.6"
-    "@babel/parser" "^7.21.5"
-    "@babel/types" "^7.21.5"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
-"@babel/traverse@^7.23.9":
-  version "7.24.1"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.24.1.tgz#d65c36ac9dd17282175d1e4a3c49d5b7988f530c"
-  integrity sha512-xuU6o9m68KeqZbQuDt2TcKSxUw/mrsvavlEqQ1leZ/B+C9tk6E4sRWy97WaXgvq5E+nU3cXMxv3WKOCanVMCmQ==
-  dependencies:
-    "@babel/code-frame" "^7.24.1"
-    "@babel/generator" "^7.24.1"
-    "@babel/helper-environment-visitor" "^7.22.20"
-    "@babel/helper-function-name" "^7.23.0"
-    "@babel/helper-hoist-variables" "^7.22.5"
-    "@babel/helper-split-export-declaration" "^7.22.6"
-    "@babel/parser" "^7.24.1"
-    "@babel/types" "^7.24.0"
+    "@babel/code-frame" "^7.26.2"
+    "@babel/generator" "^7.27.0"
+    "@babel/parser" "^7.27.0"
+    "@babel/template" "^7.27.0"
+    "@babel/types" "^7.27.0"
     debug "^4.3.1"
     globals "^11.1.0"
 
-"@babel/types@^7.0.0", "@babel/types@^7.0.0-beta.49":
-  version "7.2.2"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.2.2.tgz#44e10fc24e33af524488b716cdaee5360ea8ed1e"
+"@babel/traverse@^7.27.1", "@babel/traverse@^7.28.0", "@babel/traverse@^7.28.3":
+  version "7.28.3"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.28.3.tgz#6911a10795d2cce43ec6a28cffc440cca2593434"
+  integrity sha512-7w4kZYHneL3A6NP2nxzHvT3HCZ7puDZZjFMqDpBPECub79sTtSO5CGXDkKrTQq8ksAwfD/XI2MRFX23njdDaIQ==
   dependencies:
-    esutils "^2.0.2"
-    lodash "^4.17.10"
-    to-fast-properties "^2.0.0"
+    "@babel/code-frame" "^7.27.1"
+    "@babel/generator" "^7.28.3"
+    "@babel/helper-globals" "^7.28.0"
+    "@babel/parser" "^7.28.3"
+    "@babel/template" "^7.27.2"
+    "@babel/types" "^7.28.2"
+    debug "^4.3.1"
 
-"@babel/types@^7.16.7", "@babel/types@^7.4.4":
-  version "7.17.0"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.17.0.tgz#a826e368bccb6b3d84acd76acad5c0d87342390b"
-  integrity sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==
+"@babel/traverse@^7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.28.4.tgz#8d456101b96ab175d487249f60680221692b958b"
+  integrity sha512-YEzuboP2qvQavAcjgQNVgsvHIDv6ZpwXvcvjmyySP2DIMuByS/6ioU5G9pYrWHM6T2YDfc7xga9iNzYOs12CFQ==
   dependencies:
-    "@babel/helper-validator-identifier" "^7.16.7"
-    to-fast-properties "^2.0.0"
+    "@babel/code-frame" "^7.27.1"
+    "@babel/generator" "^7.28.3"
+    "@babel/helper-globals" "^7.28.0"
+    "@babel/parser" "^7.28.4"
+    "@babel/template" "^7.27.2"
+    "@babel/types" "^7.28.4"
+    debug "^4.3.1"
 
-"@babel/types@^7.18.10":
-  version "7.18.10"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.18.10.tgz#4908e81b6b339ca7c6b7a555a5fc29446f26dde6"
-  integrity sha512-MJvnbEiiNkpjo+LknnmRrqbY1GPUUggjv+wQVjetM/AONoupqRALB7I6jGqNUAZsKcRIEu2J6FRFvsczljjsaQ==
+"@babel/types@^7.0.0-beta.49", "@babel/types@^7.25.9", "@babel/types@^7.27.0", "@babel/types@^7.4.4":
+  version "7.27.0"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.27.0.tgz#ef9acb6b06c3173f6632d993ecb6d4ae470b4559"
+  integrity sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==
   dependencies:
-    "@babel/helper-string-parser" "^7.18.10"
-    "@babel/helper-validator-identifier" "^7.18.6"
-    to-fast-properties "^2.0.0"
+    "@babel/helper-string-parser" "^7.25.9"
+    "@babel/helper-validator-identifier" "^7.25.9"
 
-"@babel/types@^7.18.6", "@babel/types@^7.18.7", "@babel/types@^7.18.8":
-  version "7.18.8"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.18.8.tgz#c5af199951bf41ba4a6a9a6d0d8ad722b30cd42f"
-  integrity sha512-qwpdsmraq0aJ3osLJRApsc2ouSJCdnMeZwB0DhbtHAtRpZNZCdlbRnHIgcRKzdE1g0iOGg644fzjOBcdOz9cPw==
+"@babel/types@^7.27.1", "@babel/types@^7.27.3", "@babel/types@^7.28.2":
+  version "7.28.2"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.28.2.tgz#da9db0856a9a88e0a13b019881d7513588cf712b"
+  integrity sha512-ruv7Ae4J5dUYULmeXw1gmb7rYRz57OWCPM57pHojnLq/3Z1CK2lNSLTCVjxVk1F/TZHwOZZrOWi0ur95BbLxNQ==
   dependencies:
-    "@babel/helper-validator-identifier" "^7.18.6"
-    to-fast-properties "^2.0.0"
+    "@babel/helper-string-parser" "^7.27.1"
+    "@babel/helper-validator-identifier" "^7.27.1"
 
-"@babel/types@^7.18.9":
-  version "7.18.9"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.18.9.tgz#7148d64ba133d8d73a41b3172ac4b83a1452205f"
-  integrity sha512-WwMLAg2MvJmt/rKEVQBBhIVffMmnilX4oe0sRe7iPOHIGsqpruFHHdrfj4O1CMMtgMtCU4oPafZjDPCRgO57Wg==
+"@babel/types@^7.28.4":
+  version "7.28.4"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.28.4.tgz#0a4e618f4c60a7cd6c11cb2d48060e4dbe38ac3a"
+  integrity sha512-bkFqkLhh3pMBUQQkpVgWDWq/lqzc2678eUyDlTBhRqhCHFguYYGM0Efga7tYk4TogG/3x0EEl66/OQ+WGbWB/Q==
   dependencies:
-    "@babel/helper-validator-identifier" "^7.18.6"
-    to-fast-properties "^2.0.0"
+    "@babel/helper-string-parser" "^7.27.1"
+    "@babel/helper-validator-identifier" "^7.27.1"
 
-"@babel/types@^7.19.0", "@babel/types@^7.20.0":
-  version "7.20.0"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.20.0.tgz#52c94cf8a7e24e89d2a194c25c35b17a64871479"
-  integrity sha512-Jlgt3H0TajCW164wkTOTzHkZb075tMQMULzrLUoUeKmO7eFL96GgDxf7/Axhc5CAuKE3KFyVW1p6ysKsi2oXAg==
-  dependencies:
-    "@babel/helper-string-parser" "^7.19.4"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    to-fast-properties "^2.0.0"
+"@bazel/runfiles@^6.3.1":
+  version "6.3.1"
+  resolved "https://registry.yarnpkg.com/@bazel/runfiles/-/runfiles-6.3.1.tgz#3f8824b2d82853377799d42354b4df78ab0ace0b"
+  integrity sha512-1uLNT5NZsUVIGS4syuHwTzZ8HycMPyr6POA3FCE4GbMtc4rhoJk8aZKtNIRthJYfL+iioppi+rTfH3olMPr9nA==
 
-"@babel/types@^7.20.2", "@babel/types@^7.20.7":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.20.7.tgz#54ec75e252318423fc07fb644dc6a58a64c09b7f"
-  integrity sha512-69OnhBxSSgK0OzTJai4kyPDiKTIe3j+ctaHdIGVbRahTLAT7L3R9oeXHC2aVSuGYt3cVnoAMDmOCgJ2yaiLMvg==
+"@bundled-es-modules/cookie@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@bundled-es-modules/cookie/-/cookie-2.0.1.tgz#b41376af6a06b3e32a15241d927b840a9b4de507"
+  integrity sha512-8o+5fRPLNbjbdGRRmJj3h6Hh1AQJf2dk3qQ/5ZFb+PXkRNiSoMGGUKlsgLfrxneb72axVJyIYji64E2+nNfYyw==
   dependencies:
-    "@babel/helper-string-parser" "^7.19.4"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    to-fast-properties "^2.0.0"
+    cookie "^0.7.2"
 
-"@babel/types@^7.21.0":
-  version "7.21.0"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.21.0.tgz#1da00d89c2f18b226c9207d96edbeb79316a1819"
-  integrity sha512-uR7NWq2VNFnDi7EYqiRz2Jv/VQIu38tu64Zy8TX2nQFQ6etJ9V/Rr2msW8BS132mum2rL645qpDrLtAJtVpuow==
+"@bundled-es-modules/statuses@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@bundled-es-modules/statuses/-/statuses-1.0.1.tgz#761d10f44e51a94902c4da48675b71a76cc98872"
+  integrity sha512-yn7BklA5acgcBr+7w064fGV+SGIFySjCKpqjcWgBAIfrAkY+4GQTJJHQMeT3V/sgz23VTEVV8TtOmkvJAhFVfg==
   dependencies:
-    "@babel/helper-string-parser" "^7.19.4"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    to-fast-properties "^2.0.0"
+    statuses "^2.0.1"
 
-"@babel/types@^7.21.2", "@babel/types@^7.21.4":
-  version "7.21.4"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.21.4.tgz#2d5d6bb7908699b3b416409ffd3b5daa25b030d4"
-  integrity sha512-rU2oY501qDxE8Pyo7i/Orqma4ziCOrby0/9mvbDUGEfvZjb279Nk9k19e2fiCxHbRRpY2ZyrgW1eq22mvmOIzA==
+"@bundled-es-modules/tough-cookie@^0.1.6":
+  version "0.1.6"
+  resolved "https://registry.yarnpkg.com/@bundled-es-modules/tough-cookie/-/tough-cookie-0.1.6.tgz#fa9cd3cedfeecd6783e8b0d378b4a99e52bde5d3"
+  integrity sha512-dvMHbL464C0zI+Yqxbz6kZ5TOEp7GLW+pry/RWndAR8MJQAXZ2rPmIs8tziTZjeIyhSNZgZbCePtfSbdWqStJw==
   dependencies:
-    "@babel/helper-string-parser" "^7.19.4"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    to-fast-properties "^2.0.0"
+    "@types/tough-cookie" "^4.0.5"
+    tough-cookie "^4.1.4"
 
-"@babel/types@^7.21.5":
-  version "7.21.5"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.21.5.tgz#18dfbd47c39d3904d5db3d3dc2cc80bedb60e5b6"
-  integrity sha512-m4AfNvVF2mVC/F7fDEdH2El3HzUg9It/XsCxZiOTTA3m3qYfcSVSbTfM6Q9xG+hYDniZssYhlXKKUMD5m8tF4Q==
+"@cacheable/memoize@^2.0.3":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@cacheable/memoize/-/memoize-2.0.3.tgz#64b18a6b42f987fe8a9e9e2e4391b14cbf85680f"
+  integrity sha512-hl9wfQgpiydhQEIv7fkjEzTGE+tcosCXLKFDO707wYJ/78FVOlowb36djex5GdbSyeHnG62pomYLMuV/OT8Pbw==
   dependencies:
-    "@babel/helper-string-parser" "^7.21.5"
-    "@babel/helper-validator-identifier" "^7.19.1"
-    to-fast-properties "^2.0.0"
+    "@cacheable/utils" "^2.0.3"
 
-"@babel/types@^7.22.15", "@babel/types@^7.22.5", "@babel/types@^7.23.0":
-  version "7.23.6"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.23.6.tgz#be33fdb151e1f5a56877d704492c240fc71c7ccd"
-  integrity sha512-+uarb83brBzPKN38NX1MkB6vb6+mwvR6amUulqAE7ccQw1pEl+bCia9TbdG1lsnFP7lZySvUn37CHyXQdfTwzg==
+"@cacheable/memory@^2.0.3":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@cacheable/memory/-/memory-2.0.3.tgz#8d8fa1644b32b85f27c7e4e16e14f36a8460735c"
+  integrity sha512-R3UKy/CKOyb1LZG/VRCTMcpiMDyLH7SH3JrraRdK6kf3GweWCOU3sgvE13W3TiDRbxnDKylzKJvhUAvWl9LQOA==
   dependencies:
-    "@babel/helper-string-parser" "^7.23.4"
-    "@babel/helper-validator-identifier" "^7.22.20"
-    to-fast-properties "^2.0.0"
+    "@cacheable/memoize" "^2.0.3"
+    "@cacheable/utils" "^2.0.3"
+    "@keyv/bigmap" "^1.0.2"
+    hookified "^1.12.1"
+    keyv "^5.5.3"
 
-"@babel/types@^7.23.9", "@babel/types@^7.24.0":
-  version "7.24.0"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.24.0.tgz#3b951f435a92e7333eba05b7566fd297960ea1bf"
-  integrity sha512-+j7a5c253RfKh8iABBhywc8NSfP5LURe7Uh4qpsh6jc+aLJguvmIUBdjSdEMQv2bENrCR5MfRdjGo7vzS/ob7w==
-  dependencies:
-    "@babel/helper-string-parser" "^7.23.4"
-    "@babel/helper-validator-identifier" "^7.22.20"
-    to-fast-properties "^2.0.0"
+"@cacheable/utils@^2.0.3":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@cacheable/utils/-/utils-2.0.3.tgz#45d62f5dd3b481ef62677335bada2cbdb579148b"
+  integrity sha512-m7Rce68cMHlAUjvWBy9Ru1Nmw5gU0SjGGtQDdhpe6E0xnbcvrIY0Epy//JU1VYYBUTzrG9jvgmTauULGKzOkWA==
 
 "@chenfengyuan/vue-qrcode@2.0.0":
   version "2.0.0"
@@ -1723,291 +1104,525 @@
   resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"
   integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==
 
-"@csstools/selector-specificity@^2.0.2":
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/@csstools/selector-specificity/-/selector-specificity-2.0.2.tgz#1bfafe4b7ed0f3e4105837e056e0a89b108ebe36"
-  integrity sha512-IkpVW/ehM1hWKln4fCA3NzJU8KwD+kIOvPZA4cqxoJHtE21CCzjyp+Kxbu0i5I4tBNOlXPL9mjwnWlL0VEG4Fg==
+"@cropper/element-canvas@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-canvas/-/element-canvas-2.0.1.tgz#564451270a642b1da56ad53b7e495dc1a77b19f3"
+  integrity sha512-OKxq/O0HL9W2JegOsc2zh1NRpERZcLM5+M8aQ/eXdmMcfi1lzosPftag3Irp6pTsVpwV6B6ypIxKESzJ4ci9Fw==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
 
-"@eslint/eslintrc@^1.4.1":
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-1.4.1.tgz#af58772019a2d271b7e2d4c23ff4ddcba3ccfb3e"
-  integrity sha512-XXrH9Uarn0stsyldqDYq8r++mROmWRI1xKMXa640Bb//SY1+ECYX6VzT6Lcx5frD0V30XieqJ0oX9I2Xj5aoMA==
+"@cropper/element-crosshair@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-crosshair/-/element-crosshair-2.0.1.tgz#207b9962cd1678d8e60418f54825a76bd2382b74"
+  integrity sha512-bS5msU9cTU/jf1/kDw+QJmEM9/rw8IgOdpolR85iMVUCR8sRcLa0wgom42MBHcpBYB6hvL5YfiOeXZ7lHIYMpw==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element-grid@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-grid/-/element-grid-2.0.1.tgz#4d4ee1b873be6b0dbd07e5b3686da30265aed401"
+  integrity sha512-ayqCvYQJ+GVT31HhFpttzHabW1T/LsIwLJY5PLTMG0cEZLw/E8ihg8mxctjZbo852D7oEePbz6/2SeuCb1018Q==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element-handle@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-handle/-/element-handle-2.0.1.tgz#04032ef162ad2dead2bcfb41ebcaa951e37b111c"
+  integrity sha512-fdifyyPIaR9S2eQ7qPHuM8fX8uToAfBsi8vQlR9EM+oJkDNil0uO4rWyArLWEtlr0/q7U0OvsufcuJ7ffqfmpg==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element-image@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-image/-/element-image-2.0.1.tgz#38fb8470ce286b276d384556efa66eb47190c864"
+  integrity sha512-gPj5Sl2T8Cno198Cz3F3TDfcYoALW3yJ3fV6PHXmhMnX8sBkL7J441do7Vwkg0mEd2CogCtTLAf+p7ljdV0kgA==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/element-canvas" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element-selection@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-selection/-/element-selection-2.0.1.tgz#965df6f2d6cd986c83efa325766c29700488eba1"
+  integrity sha512-atv+Aeq2N2eWawelIRPGh1kYFdNrpb0QkUPPheGxz1ImfxpLdcHO9gb9T5noQijizUW2G0pNvts4ZaITQ0I71Q==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/element-canvas" "^2.0.1"
+    "@cropper/element-image" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element-shade@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-shade/-/element-shade-2.0.1.tgz#5ba42c8066fb6439f5f513a73b93f0c62236acaa"
+  integrity sha512-YIYgJ690NdFQ6wJLRFh/EySNVxGFKArncQ4FrsJ3yHU+ShgtOKz4FpjFLpqJRJB9swoVbD3WKTimGyzXrwjZrQ==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/element-canvas" "^2.0.1"
+    "@cropper/element-selection" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element-viewer@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element-viewer/-/element-viewer-2.0.1.tgz#3bf79a1f09acae5dc12d6e9c88a4dc7ab7de0b9d"
+  integrity sha512-HDj25l08pWi/AO6El/OqfQHBpBC4Lh5NEnQN1SOldsmxEwt27Ubv6ndDsF8LkTK7XPwjjZRpyQPyfig4w8L2JQ==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/element-canvas" "^2.0.1"
+    "@cropper/element-image" "^2.0.1"
+    "@cropper/element-selection" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/element@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/element/-/element-2.0.1.tgz#d5a486064a3b3ea055a655826041d35097a28526"
+  integrity sha512-Jn1hR7XWzWQM/QfXRGMGzdkJ2gG/UcLdQPZQ7OKs0JiFfRzKpzu4u/nYrXHeH3MM2iOslLqh2kqYju6mjZLMJQ==
+  dependencies:
+    "@cropper/utils" "^2.0.1"
+
+"@cropper/elements@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/elements/-/elements-2.0.1.tgz#954192d3a90c6bfeca2fcc8f5b1df972de1e7661"
+  integrity sha512-paFbBLXTKXNngn1yDi2ZIf+FO1pIEQXyBntmqOjuxqtG73KuEKv633wsJPFpj958bgcfSakgBbF80j+3nHbPug==
+  dependencies:
+    "@cropper/element" "^2.0.1"
+    "@cropper/element-canvas" "^2.0.1"
+    "@cropper/element-crosshair" "^2.0.1"
+    "@cropper/element-grid" "^2.0.1"
+    "@cropper/element-handle" "^2.0.1"
+    "@cropper/element-image" "^2.0.1"
+    "@cropper/element-selection" "^2.0.1"
+    "@cropper/element-shade" "^2.0.1"
+    "@cropper/element-viewer" "^2.0.1"
+
+"@cropper/utils@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@cropper/utils/-/utils-2.0.1.tgz#ef24496854be61c677c0e97951813ff9495844d6"
+  integrity sha512-A9RnAFmgNF5aZk5q2VZnFnHtXWu1kPyEN0LVsX8wJ2LBRu2nyETKwz+ZXVsVWliktToCaYojHKrS+6/HODyEZA==
+
+"@csstools/color-helpers@^5.0.2":
+  version "5.0.2"
+  resolved "https://registry.yarnpkg.com/@csstools/color-helpers/-/color-helpers-5.0.2.tgz#82592c9a7c2b83c293d9161894e2a6471feb97b8"
+  integrity sha512-JqWH1vsgdGcw2RR6VliXXdA0/59LttzlU8UlRT/iUUsEeWfYq8I+K0yhihEUTTHLRm1EXvpsCx3083EU15ecsA==
+
+"@csstools/css-calc@^2.1.2":
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/@csstools/css-calc/-/css-calc-2.1.2.tgz#bffd55f002dab119b76d4023f95cd943e6c8c11e"
+  integrity sha512-TklMyb3uBB28b5uQdxjReG4L80NxAqgrECqLZFQbyLekwwlcDDS8r3f07DKqeo8C4926Br0gf/ZDe17Zv4wIuw==
+
+"@csstools/css-color-parser@^3.0.8":
+  version "3.0.8"
+  resolved "https://registry.yarnpkg.com/@csstools/css-color-parser/-/css-color-parser-3.0.8.tgz#5fe9322920851450bf5e065c2b0e731b9e165394"
+  integrity sha512-pdwotQjCCnRPuNi06jFuP68cykU1f3ZWExLe/8MQ1LOs8Xq+fTkYgd+2V8mWUWMrOn9iS2HftPVaMZDaXzGbhQ==
+  dependencies:
+    "@csstools/color-helpers" "^5.0.2"
+    "@csstools/css-calc" "^2.1.2"
+
+"@csstools/css-parser-algorithms@^3.0.4":
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.4.tgz#74426e93bd1c4dcab3e441f5cc7ba4fb35d94356"
+  integrity sha512-Up7rBoV77rv29d3uKHUIVubz1BTcgyUK72IvCQAbfbMv584xHcGKCKbWh7i8hPrRJ7qU4Y8IO3IY9m+iTB7P3A==
+
+"@csstools/css-parser-algorithms@^3.0.5":
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.5.tgz#5755370a9a29abaec5515b43c8b3f2cf9c2e3076"
+  integrity sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==
+
+"@csstools/css-tokenizer@^3.0.3":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-3.0.3.tgz#a5502c8539265fecbd873c1e395a890339f119c2"
+  integrity sha512-UJnjoFsmxfKUdNYdWgOB0mWUypuLvAfQPH1+pyvRJs6euowbFkFC6P13w1l8mJyi3vxYMxc9kld5jZEGRQs6bw==
+
+"@csstools/css-tokenizer@^3.0.4":
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-3.0.4.tgz#333fedabc3fd1a8e5d0100013731cf19e6a8c5d3"
+  integrity sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==
+
+"@csstools/media-query-list-parser@^4.0.3":
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-4.0.3.tgz#7aec77bcb89c2da80ef207e73f474ef9e1b3cdf1"
+  integrity sha512-HAYH7d3TLRHDOUQK4mZKf9k9Ph/m8Akstg66ywKR4SFAigjs3yBiUeZtFxywiTm5moZMAp/5W/ZuFnNXXYLuuQ==
+
+"@csstools/selector-specificity@^5.0.0":
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/@csstools/selector-specificity/-/selector-specificity-5.0.0.tgz#037817b574262134cabd68fc4ec1a454f168407b"
+  integrity sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==
+
+"@dual-bundle/import-meta-resolve@^4.2.1":
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/@dual-bundle/import-meta-resolve/-/import-meta-resolve-4.2.1.tgz#cd0b25b3808cd9e684cd6cd549bbf8e1dcf05ee7"
+  integrity sha512-id+7YRUgoUX6CgV0DtuhirQWodeeA7Lf4i2x71JS/vtA5pRb/hIGWlw+G6MeXvsM+MXrz0VAydTGElX1rAfgPg==
+
+"@esbuild/aix-ppc64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.25.10.tgz#ee6b7163a13528e099ecf562b972f2bcebe0aa97"
+  integrity sha512-0NFWnA+7l41irNuaSVlLfgNT12caWJVLzp5eAVhZ0z1qpxbockccEt3s+149rE64VUI3Ml2zt8Nv5JVc4QXTsw==
+
+"@esbuild/android-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.25.10.tgz#115fc76631e82dd06811bfaf2db0d4979c16e2cb"
+  integrity sha512-LSQa7eDahypv/VO6WKohZGPSJDq5OVOo3UoFR1E4t4Gj1W7zEQMUhI+lo81H+DtB+kP+tDgBp+M4oNCwp6kffg==
+
+"@esbuild/android-arm@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.25.10.tgz#8d5811912da77f615398611e5bbc1333fe321aa9"
+  integrity sha512-dQAxF1dW1C3zpeCDc5KqIYuZ1tgAdRXNoZP7vkBIRtKZPYe2xVr/d3SkirklCHudW1B45tGiUlz2pUWDfbDD4w==
+
+"@esbuild/android-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.25.10.tgz#e3e96516b2d50d74105bb92594c473e30ddc16b1"
+  integrity sha512-MiC9CWdPrfhibcXwr39p9ha1x0lZJ9KaVfvzA0Wxwz9ETX4v5CHfF09bx935nHlhi+MxhA63dKRRQLiVgSUtEg==
+
+"@esbuild/darwin-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.25.10.tgz#6af6bb1d05887dac515de1b162b59dc71212ed76"
+  integrity sha512-JC74bdXcQEpW9KkV326WpZZjLguSZ3DfS8wrrvPMHgQOIEIG/sPXEN/V8IssoJhbefLRcRqw6RQH2NnpdprtMA==
+
+"@esbuild/darwin-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.25.10.tgz#99ae82347fbd336fc2d28ffd4f05694e6e5b723d"
+  integrity sha512-tguWg1olF6DGqzws97pKZ8G2L7Ig1vjDmGTwcTuYHbuU6TTjJe5FXbgs5C1BBzHbJ2bo1m3WkQDbWO2PvamRcg==
+
+"@esbuild/freebsd-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.10.tgz#0c6d5558a6322b0bdb17f7025c19bd7d2359437d"
+  integrity sha512-3ZioSQSg1HT2N05YxeJWYR+Libe3bREVSdWhEEgExWaDtyFbbXWb49QgPvFH8u03vUPX10JhJPcz7s9t9+boWg==
+
+"@esbuild/freebsd-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.25.10.tgz#8c35873fab8c0857a75300a3dcce4324ca0b9844"
+  integrity sha512-LLgJfHJk014Aa4anGDbh8bmI5Lk+QidDmGzuC2D+vP7mv/GeSN+H39zOf7pN5N8p059FcOfs2bVlrRr4SK9WxA==
+
+"@esbuild/linux-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.25.10.tgz#3edc2f87b889a15b4cedaf65f498c2bed7b16b90"
+  integrity sha512-5luJWN6YKBsawd5f9i4+c+geYiVEw20FVW5x0v1kEMWNq8UctFjDiMATBxLvmmHA4bf7F6hTRaJgtghFr9iziQ==
+
+"@esbuild/linux-arm@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.25.10.tgz#86501cfdfb3d110176d80c41b27ed4611471cde7"
+  integrity sha512-oR31GtBTFYCqEBALI9r6WxoU/ZofZl962pouZRTEYECvNF/dtXKku8YXcJkhgK/beU+zedXfIzHijSRapJY3vg==
+
+"@esbuild/linux-ia32@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.25.10.tgz#e6589877876142537c6864680cd5d26a622b9d97"
+  integrity sha512-NrSCx2Kim3EnnWgS4Txn0QGt0Xipoumb6z6sUtl5bOEZIVKhzfyp/Lyw4C1DIYvzeW/5mWYPBFJU3a/8Yr75DQ==
+
+"@esbuild/linux-loong64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.25.10.tgz#11119e18781f136d8083ea10eb6be73db7532de8"
+  integrity sha512-xoSphrd4AZda8+rUDDfD9J6FUMjrkTz8itpTITM4/xgerAZZcFW7Dv+sun7333IfKxGG8gAq+3NbfEMJfiY+Eg==
+
+"@esbuild/linux-mips64el@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.25.10.tgz#3052f5436b0c0c67a25658d5fc87f045e7def9e6"
+  integrity sha512-ab6eiuCwoMmYDyTnyptoKkVS3k8fy/1Uvq7Dj5czXI6DF2GqD2ToInBI0SHOp5/X1BdZ26RKc5+qjQNGRBelRA==
+
+"@esbuild/linux-ppc64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.25.10.tgz#2f098920ee5be2ce799f35e367b28709925a8744"
+  integrity sha512-NLinzzOgZQsGpsTkEbdJTCanwA5/wozN9dSgEl12haXJBzMTpssebuXR42bthOF3z7zXFWH1AmvWunUCkBE4EA==
+
+"@esbuild/linux-riscv64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.25.10.tgz#fa51d7fd0a22a62b51b4b94b405a3198cf7405dd"
+  integrity sha512-FE557XdZDrtX8NMIeA8LBJX3dC2M8VGXwfrQWU7LB5SLOajfJIxmSdyL/gU1m64Zs9CBKvm4UAuBp5aJ8OgnrA==
+
+"@esbuild/linux-s390x@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.25.10.tgz#a27642e36fc282748fdb38954bd3ef4f85791e8a"
+  integrity sha512-3BBSbgzuB9ajLoVZk0mGu+EHlBwkusRmeNYdqmznmMc9zGASFjSsxgkNsqmXugpPk00gJ0JNKh/97nxmjctdew==
+
+"@esbuild/linux-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.25.10.tgz#9d9b09c0033d17529570ced6d813f98315dfe4e9"
+  integrity sha512-QSX81KhFoZGwenVyPoberggdW1nrQZSvfVDAIUXr3WqLRZGZqWk/P4T8p2SP+de2Sr5HPcvjhcJzEiulKgnxtA==
+
+"@esbuild/netbsd-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.10.tgz#25c09a659c97e8af19e3f2afd1c9190435802151"
+  integrity sha512-AKQM3gfYfSW8XRk8DdMCzaLUFB15dTrZfnX8WXQoOUpUBQ+NaAFCP1kPS/ykbbGYz7rxn0WS48/81l9hFl3u4A==
+
+"@esbuild/netbsd-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.25.10.tgz#7fa5f6ffc19be3a0f6f5fd32c90df3dc2506937a"
+  integrity sha512-7RTytDPGU6fek/hWuN9qQpeGPBZFfB4zZgcz2VK2Z5VpdUxEI8JKYsg3JfO0n/Z1E/6l05n0unDCNc4HnhQGig==
+
+"@esbuild/openbsd-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.10.tgz#8faa6aa1afca0c6d024398321d6cb1c18e72a1c3"
+  integrity sha512-5Se0VM9Wtq797YFn+dLimf2Zx6McttsH2olUBsDml+lm0GOCRVebRWUvDtkY4BWYv/3NgzS8b/UM3jQNh5hYyw==
+
+"@esbuild/openbsd-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.25.10.tgz#a42979b016f29559a8453d32440d3c8cd420af5e"
+  integrity sha512-XkA4frq1TLj4bEMB+2HnI0+4RnjbuGZfet2gs/LNs5Hc7D89ZQBHQ0gL2ND6Lzu1+QVkjp3x1gIcPKzRNP8bXw==
+
+"@esbuild/openharmony-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/openharmony-arm64/-/openharmony-arm64-0.25.10.tgz#fd87bfeadd7eeb3aa384bbba907459ffa3197cb1"
+  integrity sha512-AVTSBhTX8Y/Fz6OmIVBip9tJzZEUcY8WLh7I59+upa5/GPhh2/aM6bvOMQySspnCCHvFi79kMtdJS1w0DXAeag==
+
+"@esbuild/sunos-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.25.10.tgz#3a18f590e36cb78ae7397976b760b2b8c74407f4"
+  integrity sha512-fswk3XT0Uf2pGJmOpDB7yknqhVkJQkAQOcW/ccVOtfx05LkbWOaRAtn5SaqXypeKQra1QaEa841PgrSL9ubSPQ==
+
+"@esbuild/win32-arm64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.25.10.tgz#e71741a251e3fd971408827a529d2325551f530c"
+  integrity sha512-ah+9b59KDTSfpaCg6VdJoOQvKjI33nTaQr4UluQwW7aEwZQsbMCfTmfEO4VyewOxx4RaDT/xCy9ra2GPWmO7Kw==
+
+"@esbuild/win32-ia32@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.25.10.tgz#c6f010b5d3b943d8901a0c87ea55f93b8b54bf94"
+  integrity sha512-QHPDbKkrGO8/cz9LKVnJU22HOi4pxZnZhhA2HYHez5Pz4JeffhDjf85E57Oyco163GnzNCVkZK0b/n4Y0UHcSw==
+
+"@esbuild/win32-x64@0.25.10":
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.25.10.tgz#e4b3e255a1b4aea84f6e1d2ae0b73f826c3785bd"
+  integrity sha512-9KpxSVFCu0iK1owoez6aC/s/EdUQLDN3adTxGCqxMVhrPDj6bt5dbrHDXUuq+Bs2vATFBBrQS5vdQ/Ed2P+nbw==
+
+"@eslint-community/eslint-utils@^4.1.2", "@eslint-community/eslint-utils@^4.4.0", "@eslint-community/eslint-utils@^4.5.0":
+  version "4.5.1"
+  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.5.1.tgz#b0fc7e06d0c94f801537fd4237edc2706d3b8e4c"
+  integrity sha512-soEIOALTfTK6EjmKMMoLugwaP0rzkad90iIWd1hMO9ARkSAyjfMfkRRhLvD5qH7vvM0Cg72pieUfR6yh6XxC4w==
+  dependencies:
+    eslint-visitor-keys "^3.4.3"
+
+"@eslint-community/eslint-utils@^4.8.0":
+  version "4.9.0"
+  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.9.0.tgz#7308df158e064f0dd8b8fdb58aa14fa2a7f913b3"
+  integrity sha512-ayVFHdtZ+hsq1t2Dy24wCmGXGe4q9Gu3smhLYALJrr473ZH27MsnSL+LKUlimp4BWJqMDMLmPpx/Q9R3OAlL4g==
+  dependencies:
+    eslint-visitor-keys "^3.4.3"
+
+"@eslint-community/regexpp@^4.11.0", "@eslint-community/regexpp@^4.12.1":
+  version "4.12.1"
+  resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.12.1.tgz#cfc6cffe39df390a3841cde2abccf92eaa7ae0e0"
+  integrity sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==
+
+"@eslint/config-array@^0.21.0":
+  version "0.21.0"
+  resolved "https://registry.yarnpkg.com/@eslint/config-array/-/config-array-0.21.0.tgz#abdbcbd16b124c638081766392a4d6b509f72636"
+  integrity sha512-ENIdc4iLu0d93HeYirvKmrzshzofPw6VkZRKQGe9Nv46ZnWUzcF1xV01dcvEg/1wXUR61OmmlSfyeyO7EvjLxQ==
+  dependencies:
+    "@eslint/object-schema" "^2.1.6"
+    debug "^4.3.1"
+    minimatch "^3.1.2"
+
+"@eslint/config-helpers@^0.4.0":
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/@eslint/config-helpers/-/config-helpers-0.4.0.tgz#e9f94ba3b5b875e32205cb83fece18e64486e9e6"
+  integrity sha512-WUFvV4WoIwW8Bv0KeKCIIEgdSiFOsulyN0xrMu+7z43q/hkOLXjvb5u7UC9jDxvRzcrbEmuZBX5yJZz1741jog==
+  dependencies:
+    "@eslint/core" "^0.16.0"
+
+"@eslint/core@^0.16.0":
+  version "0.16.0"
+  resolved "https://registry.yarnpkg.com/@eslint/core/-/core-0.16.0.tgz#490254f275ba9667ddbab344f4f0a6b7a7bd7209"
+  integrity sha512-nmC8/totwobIiFcGkDza3GIKfAw1+hLiYVrh3I1nIomQ8PEr5cxg34jnkmGawul/ep52wGRAcyeDCNtWKSOj4Q==
+  dependencies:
+    "@types/json-schema" "^7.0.15"
+
+"@eslint/eslintrc@^3.3.1":
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-3.3.1.tgz#e55f7f1dd400600dd066dbba349c4c0bac916964"
+  integrity sha512-gtF186CXhIl1p4pJNGZw8Yc6RlshoePRvE0X91oPGb3vZ8pM3qOS9W9NGPat9LziaBV7XrJWGylNQXkGcnM3IQ==
   dependencies:
     ajv "^6.12.4"
     debug "^4.3.2"
-    espree "^9.4.0"
-    globals "^13.19.0"
+    espree "^10.0.1"
+    globals "^14.0.0"
     ignore "^5.2.0"
     import-fresh "^3.2.1"
     js-yaml "^4.1.0"
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@fortawesome/fontawesome-common-types@6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.0.tgz#88da2b70d6ca18aaa6ed3687832e11f39e80624b"
-  integrity sha512-HNii132xfomg5QVZw0HwXXpN22s7VBHQBv9CeOu9tfJnhsWQNd2lmTNi8CSrnw5B+5YOmzu1UoPAyxaXsJ6RgQ==
+"@eslint/js@9.37.0":
+  version "9.37.0"
+  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-9.37.0.tgz#0cfd5aa763fe5d1ee60bedf84cd14f54bcf9e21b"
+  integrity sha512-jaS+NJ+hximswBG6pjNX0uEJZkrT0zwpVi3BA3vX22aFGjJjmgSTSmPpZCRKmoBL5VY/M6p0xsSJx7rk7sy5gg==
 
-"@fortawesome/fontawesome-svg-core@6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.0.tgz#3727552eff9179506e9203d72feb5b1063c11a21"
-  integrity sha512-Bertv8xOiVELz5raB2FlXDPKt+m94MQ3JgDfsVbrqNpLU9+UE2E18GKjLKw+d3XbeYPqg1pzyQKGsrzbw+pPaw==
+"@eslint/object-schema@^2.1.6":
+  version "2.1.6"
+  resolved "https://registry.yarnpkg.com/@eslint/object-schema/-/object-schema-2.1.6.tgz#58369ab5b5b3ca117880c0f6c0b0f32f6950f24f"
+  integrity sha512-RBMg5FRL0I0gs51M/guSAj5/e14VQ4tpZnQNWwuDT66P14I43ItmPfIZRhO9fUVIPOAQXU47atlywZ/czoqFPA==
+
+"@eslint/plugin-kit@^0.4.0":
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/@eslint/plugin-kit/-/plugin-kit-0.4.0.tgz#f6a245b42886abf6fc9c7ab7744a932250335ab2"
+  integrity sha512-sB5uyeq+dwCWyPi31B2gQlVlo+j5brPlWx4yZBrEaRo/nhdDE8Xke1gsGgtiBdaBTxuTkceLVuVt/pclrasb0A==
   dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.0"
+    "@eslint/core" "^0.16.0"
+    levn "^0.4.1"
 
-"@fortawesome/free-regular-svg-icons@6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.4.0.tgz#cacc53bd8d832d46feead412d9ea9ce80a55e13a"
-  integrity sha512-ZfycI7D0KWPZtf7wtMFnQxs8qjBXArRzczABuMQqecA/nXohquJ5J/RCR77PmY5qGWkxAZDxpnUFVXKwtY/jPw==
+"@fortawesome/fontawesome-common-types@7.1.0":
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-7.1.0.tgz#a4e0b7e40073d5fdef41182da1bc216a05875659"
+  integrity sha512-l/BQM7fYntsCI//du+6sEnHOP6a74UixFyOYUyz2DLMXKx+6DEhfR3F2NYGE45XH1JJuIamacb4IZs9S0ZOWLA==
+
+"@fortawesome/fontawesome-svg-core@7.1.0":
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-7.1.0.tgz#b0a45363a4e95ec985130393c0b1b95717ef0760"
+  integrity sha512-fNxRUk1KhjSbnbuBxlWSnBLKLBNun52ZBTcs22H/xEEzM6Ap81ZFTQ4bZBxVQGQgVY0xugKGoRcCbaKjLQ3XZA==
   dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.0"
+    "@fortawesome/fontawesome-common-types" "7.1.0"
 
-"@fortawesome/free-solid-svg-icons@6.4.0":
-  version "6.4.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.4.0.tgz#48c0e790847fa56299e2f26b82b39663b8ad7119"
-  integrity sha512-kutPeRGWm8V5dltFP1zGjQOEAzaLZj4StdQhWVZnfGFCvAPVvHh8qk5bRrU4KXnRRRNni5tKQI9PBAdI6MP8nQ==
+"@fortawesome/free-regular-svg-icons@7.1.0":
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-7.1.0.tgz#e57c5eb63e6a30bb4fe2276aba851e3470452680"
+  integrity sha512-0e2fdEyB4AR+e6kU4yxwA/MonnYcw/CsMEP9lH82ORFi9svA6/RhDyhxIv5mlJaldmaHLLYVTb+3iEr+PDSZuQ==
   dependencies:
-    "@fortawesome/fontawesome-common-types" "6.4.0"
+    "@fortawesome/fontawesome-common-types" "7.1.0"
 
-"@fortawesome/vue-fontawesome@3.0.3":
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.3.tgz#633e2998d11f7d4ed41f0d5ea461a22ec9b9d034"
-  integrity sha512-KCPHi9QemVXGMrfuwf3nNnNo129resAIQWut9QTAMXmXqL2ErABC6ohd2yY5Ipq0CLWNbKHk8TMdTXL/Zf3ZhA==
-
-"@humanwhocodes/config-array@^0.11.8":
-  version "0.11.8"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.8.tgz#03595ac2075a4dc0f191cc2131de14fbd7d410b9"
-  integrity sha512-UybHIJzJnR5Qc/MsD9Kr+RpO2h+/P1GhOwdiLPXK5TWk5sgTdu88bTD9UP+CKbPPh5Rni1u0GjAdYQLemG8g+g==
+"@fortawesome/free-solid-svg-icons@7.1.0":
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-7.1.0.tgz#cb9d149cefd3419a7a3fd041106e3a2315463e3e"
+  integrity sha512-Udu3K7SzAo9N013qt7qmm22/wo2hADdheXtBfxFTecp+ogsc0caQNRKEb7pkvvagUGOpG9wJC1ViH6WXs8oXIA==
   dependencies:
-    "@humanwhocodes/object-schema" "^1.2.1"
-    debug "^4.1.1"
-    minimatch "^3.0.5"
+    "@fortawesome/fontawesome-common-types" "7.1.0"
+
+"@fortawesome/vue-fontawesome@3.1.2":
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.1.2.tgz#a61d44522bc0be3283ccd9811ed5a2de282c168a"
+  integrity sha512-mhYnBIuuW8OIMHf31kOjaBmyE7BMrwBorhrOHVud6vTTu+7IPQNWB+DWaHoE75v10dRF5s/dFtcrgE7vKSEWwQ==
+
+"@humanfs/core@^0.19.1":
+  version "0.19.1"
+  resolved "https://registry.yarnpkg.com/@humanfs/core/-/core-0.19.1.tgz#17c55ca7d426733fe3c561906b8173c336b40a77"
+  integrity sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==
+
+"@humanfs/node@^0.16.6":
+  version "0.16.6"
+  resolved "https://registry.yarnpkg.com/@humanfs/node/-/node-0.16.6.tgz#ee2a10eaabd1131987bf0488fd9b820174cd765e"
+  integrity sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw==
+  dependencies:
+    "@humanfs/core" "^0.19.1"
+    "@humanwhocodes/retry" "^0.3.0"
 
 "@humanwhocodes/module-importer@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz#af5b2691a22b44be847b0ca81641c5fb6ad0172c"
   integrity sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==
 
-"@humanwhocodes/object-schema@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
-  integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
+"@humanwhocodes/retry@^0.3.0":
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/@humanwhocodes/retry/-/retry-0.3.1.tgz#c72a5c76a9fbaf3488e231b13dc52c0da7bab42a"
+  integrity sha512-JBxkERygn7Bv/GbN5Rv8Ul6LVknS+5Bp6RgDC/O8gEBU/yeH5Ui5C/OlWrTb6qct7LjjfT6Re2NxB0ln0yYybA==
 
-"@intlify/bundle-utils@3.4.0":
-  version "3.4.0"
-  resolved "https://registry.yarnpkg.com/@intlify/bundle-utils/-/bundle-utils-3.4.0.tgz#72558611f4b223a6791f591363dc48a4bcacdf70"
-  integrity sha512-2UQkqiSAOSPEHMGWlybqWm4G2K0X+FyYho5AwXz6QklSX1EY5EDmOSxZmwscn2qmKBnp6OYsme5kUrnN9xrWzQ==
+"@humanwhocodes/retry@^0.4.2":
+  version "0.4.2"
+  resolved "https://registry.yarnpkg.com/@humanwhocodes/retry/-/retry-0.4.2.tgz#1860473de7dfa1546767448f333db80cb0ff2161"
+  integrity sha512-xeO57FpIu4p1Ri3Jq/EXq4ClRm86dVF2z/+kvFnyqVYRavTZmaFaUBbWCOuuTh0o/g7DSsk6kc2vrS4Vl5oPOQ==
+
+"@inquirer/confirm@^5.0.0":
+  version "5.1.8"
+  resolved "https://registry.yarnpkg.com/@inquirer/confirm/-/confirm-5.1.8.tgz#476af2476cd4867905dcabfca8598da4dd65e923"
+  integrity sha512-dNLWCYZvXDjO3rnQfk2iuJNL4Ivwz/T2+C3+WnNfJKsNGSuOs3wAo2F6e0p946gtSAk31nZMfW+MRmYaplPKsg==
   dependencies:
-    "@intlify/message-compiler" next
-    "@intlify/shared" next
-    jsonc-eslint-parser "^1.0.1"
-    source-map "0.6.1"
-    yaml-eslint-parser "^0.3.2"
+    "@inquirer/core" "^10.1.9"
+    "@inquirer/type" "^3.0.5"
 
-"@intlify/core-base@9.2.2":
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.2.2.tgz#5353369b05cc9fe35cab95fe20afeb8a4481f939"
-  integrity sha512-JjUpQtNfn+joMbrXvpR4hTF8iJQ2sEFzzK3KIESOx+f+uwIjgw20igOyaIdhfsVVBCds8ZM64MoeNSx+PHQMkA==
+"@inquirer/core@^10.1.9":
+  version "10.1.9"
+  resolved "https://registry.yarnpkg.com/@inquirer/core/-/core-10.1.9.tgz#9ab672a2d9ca60c5d45c7fa9b63e4fe9e038a02e"
+  integrity sha512-sXhVB8n20NYkUBfDYgizGHlpRVaCRjtuzNZA6xpALIUbkgfd2Hjz+DfEN6+h1BRnuxw0/P4jCIMjMsEOAMwAJw==
   dependencies:
-    "@intlify/devtools-if" "9.2.2"
-    "@intlify/message-compiler" "9.2.2"
-    "@intlify/shared" "9.2.2"
-    "@intlify/vue-devtools" "9.2.2"
+    "@inquirer/figures" "^1.0.11"
+    "@inquirer/type" "^3.0.5"
+    ansi-escapes "^4.3.2"
+    cli-width "^4.1.0"
+    mute-stream "^2.0.0"
+    signal-exit "^4.1.0"
+    wrap-ansi "^6.2.0"
+    yoctocolors-cjs "^2.1.2"
 
-"@intlify/devtools-if@9.2.2":
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/@intlify/devtools-if/-/devtools-if-9.2.2.tgz#b13d9ac4b4e2fe6d2e7daa556517a8061fe8bd39"
-  integrity sha512-4ttr/FNO29w+kBbU7HZ/U0Lzuh2cRDhP8UlWOtV9ERcjHzuyXVZmjyleESK6eVP60tGC9QtQW9yZE+JeRhDHkg==
+"@inquirer/figures@^1.0.11":
+  version "1.0.11"
+  resolved "https://registry.yarnpkg.com/@inquirer/figures/-/figures-1.0.11.tgz#4744e6db95288fea1dead779554859710a959a21"
+  integrity sha512-eOg92lvrn/aRUqbxRyvpEWnrvRuTYRifixHkYVpJiygTgVSBIHDqLh0SrMQXkafvULg3ck11V7xvR+zcgvpHFw==
+
+"@inquirer/type@^3.0.5":
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/@inquirer/type/-/type-3.0.5.tgz#fe00207e57d5f040e5b18e809c8e7abc3a2ade3a"
+  integrity sha512-ZJpeIYYueOz/i/ONzrfof8g89kNdO2hjGuvULROo3O8rlB2CRtSseE5KeirnyE4t/thAn/EwvS/vuQeJCn+NZg==
+
+"@intlify/core-base@11.1.12":
+  version "11.1.12"
+  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-11.1.12.tgz#e02529021a4e69f8a1adcca5ce61963c71cd72ba"
+  integrity sha512-whh0trqRsSqVLNEUCwU59pyJZYpU8AmSWl8M3Jz2Mv5ESPP6kFh4juas2NpZ1iCvy7GlNRffUD1xr84gceimjg==
   dependencies:
-    "@intlify/shared" "9.2.2"
+    "@intlify/message-compiler" "11.1.12"
+    "@intlify/shared" "11.1.12"
 
-"@intlify/message-compiler@9.2.2":
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.2.2.tgz#e42ab6939b8ae5b3d21faf6a44045667a18bba1c"
-  integrity sha512-IUrQW7byAKN2fMBe8z6sK6riG1pue95e5jfokn8hA5Q3Bqy4MBJ5lJAofUsawQJYHeoPJ7svMDyBaVJ4d0GTtA==
+"@intlify/message-compiler@11.1.12":
+  version "11.1.12"
+  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-11.1.12.tgz#27e69790b711a92cddb07175187dd09a7b270b55"
+  integrity sha512-Fv9iQSJoJaXl4ZGkOCN1LDM3trzze0AS2zRz2EHLiwenwL6t0Ki9KySYlyr27yVOj5aVz0e55JePO+kELIvfdQ==
   dependencies:
-    "@intlify/shared" "9.2.2"
-    source-map "0.6.1"
+    "@intlify/shared" "11.1.12"
+    source-map-js "^1.0.2"
 
-"@intlify/message-compiler@next":
-  version "9.2.0-beta.34"
-  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.2.0-beta.34.tgz#a1a85c43f578e8ab00d30774963291fe2fdbc0b9"
-  integrity sha512-l7JjkXJBW2l6cFZqPvI6oWU6QZn/i70agU6QB02W1O+6quFCFNpsiPswgYyQrmfHt4F4qYhLJUMZltIW/cqcbw==
+"@intlify/shared@11.1.12":
+  version "11.1.12"
+  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-11.1.12.tgz#ab41083e017d622cf63c7dc88a0ee0bc27f4127a"
+  integrity sha512-Om86EjuQtA69hdNj3GQec9ZC0L0vPSAnXzB3gP/gyJ7+mA7t06d9aOAiqMZ+xEOsumGP4eEBlfl8zF2LOTzf2A==
+
+"@isaacs/cliui@^8.0.2":
+  version "8.0.2"
+  resolved "https://registry.yarnpkg.com/@isaacs/cliui/-/cliui-8.0.2.tgz#b37667b7bc181c168782259bab42474fbf52b550"
+  integrity sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==
   dependencies:
-    "@intlify/shared" "9.2.0-beta.34"
-    source-map "0.6.1"
+    string-width "^5.1.2"
+    string-width-cjs "npm:string-width@^4.2.0"
+    strip-ansi "^7.0.1"
+    strip-ansi-cjs "npm:strip-ansi@^6.0.1"
+    wrap-ansi "^8.1.0"
+    wrap-ansi-cjs "npm:wrap-ansi@^7.0.0"
 
-"@intlify/shared@9.2.0-beta.34", "@intlify/shared@next":
-  version "9.2.0-beta.34"
-  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.2.0-beta.34.tgz#e8e9a93455eadcc9785fe2e2437fe037fc267f7d"
-  integrity sha512-hbUKcVbTOkLVpnlSeZE1OPgEI7FpvhuZF/gb84xECTjXEImIa3u0fIcJKUUffv3dlAx8fMOE5xKgDzngidm0tw==
-
-"@intlify/shared@9.2.2", "@intlify/shared@^9.2.2":
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.2.2.tgz#5011be9ca2b4ab86f8660739286e2707f9abb4a5"
-  integrity sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q==
-
-"@intlify/vue-devtools@9.2.2":
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/@intlify/vue-devtools/-/vue-devtools-9.2.2.tgz#b95701556daf7ebb3a2d45aa3ae9e6415aed8317"
-  integrity sha512-+dUyqyCHWHb/UcvY1MlIpO87munedm3Gn6E9WWYdWrMuYLcoIoOEVDWSS8xSwtlPU+kA+MEQTP6Q1iI/ocusJg==
+"@jridgewell/gen-mapping@^0.3.12", "@jridgewell/gen-mapping@^0.3.5":
+  version "0.3.13"
+  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz#6342a19f44347518c93e43b1ac69deb3c4656a1f"
+  integrity sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==
   dependencies:
-    "@intlify/core-base" "9.2.2"
-    "@intlify/shared" "9.2.2"
-
-"@intlify/vue-i18n-loader@5.0.1":
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/@intlify/vue-i18n-loader/-/vue-i18n-loader-5.0.1.tgz#af7d32059e32138e91495e5240f7ce2adb71c738"
-  integrity sha512-z1dFLsR5YsEbA7+zqd8C3lvBOr6DWMMyUdX3Y42e+6Y5cL8uE55uQfdjUDbhQe7R6YlZT7ZDaIXoIGyoFaJDNg==
-  dependencies:
-    "@intlify/bundle-utils" "3.4.0"
-    "@intlify/shared" "^9.2.2"
-    js-yaml "^4.1.0"
-    json5 "^2.2.0"
-    loader-utils "^2.0.0"
-
-"@istanbuljs/schema@^0.1.2":
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/@istanbuljs/schema/-/schema-0.1.3.tgz#e45e384e4b8ec16bce2fd903af78450f6bf7ec98"
-  integrity sha512-ZXRY4jNvVgSVQ8DL3LTcakaAtXwTVUxE81hslsyD2AtoXW/wVob10HkOJ1X/pAlcI7D+2YoZKg5do8G/w6RYgA==
-
-"@jest/schemas@^29.0.0":
-  version "29.0.0"
-  resolved "https://registry.yarnpkg.com/@jest/schemas/-/schemas-29.0.0.tgz#5f47f5994dd4ef067fb7b4188ceac45f77fe952a"
-  integrity sha512-3Ab5HgYIIAnS0HjqJHQYZS+zXc4tUmTmBH3z83ajI6afXp8X3ZtdLX+nXx+I7LNkJD7uN9LAVhgnjDgZa2z0kA==
-  dependencies:
-    "@sinclair/typebox" "^0.24.1"
-
-"@jest/types@^29.2.1":
-  version "29.2.1"
-  resolved "https://registry.yarnpkg.com/@jest/types/-/types-29.2.1.tgz#ec9c683094d4eb754e41e2119d8bdaef01cf6da0"
-  integrity sha512-O/QNDQODLnINEPAI0cl9U6zUIDXEWXt6IC1o2N2QENuos7hlGUIthlKyV4p6ki3TvXFX071blj8HUhgLGquPjw==
-  dependencies:
-    "@jest/schemas" "^29.0.0"
-    "@types/istanbul-lib-coverage" "^2.0.0"
-    "@types/istanbul-reports" "^3.0.0"
-    "@types/node" "*"
-    "@types/yargs" "^17.0.8"
-    chalk "^4.0.0"
-
-"@jridgewell/gen-mapping@^0.1.0":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz#e5d2e450306a9491e3bd77e323e38d7aff315996"
-  integrity sha512-sQXCasFk+U8lWYEe66WxRDOE9PjVz4vSM51fTu3Hw+ClTpUSQb718772vH3pyS5pShp6lvQM7SxgIDXXXmOX7w==
-  dependencies:
-    "@jridgewell/set-array" "^1.0.0"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
-
-"@jridgewell/gen-mapping@^0.3.0", "@jridgewell/gen-mapping@^0.3.2":
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz#c1aedc61e853f2bb9f5dfe6d4442d3b565b253b9"
-  integrity sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==
-  dependencies:
-    "@jridgewell/set-array" "^1.0.1"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
-    "@jridgewell/trace-mapping" "^0.3.9"
-
-"@jridgewell/gen-mapping@^0.3.5":
-  version "0.3.5"
-  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz#dcce6aff74bdf6dad1a95802b69b04a2fcb1fb36"
-  integrity sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==
-  dependencies:
-    "@jridgewell/set-array" "^1.2.1"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
+    "@jridgewell/sourcemap-codec" "^1.5.0"
     "@jridgewell/trace-mapping" "^0.3.24"
 
-"@jridgewell/resolve-uri@3.1.0":
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78"
-  integrity sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==
-
-"@jridgewell/resolve-uri@^3.0.3":
-  version "3.0.5"
-  resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.0.5.tgz#68eb521368db76d040a6315cdb24bf2483037b9c"
-  integrity sha512-VPeQ7+wH0itvQxnG+lIzWgkysKIr3L9sslimFW55rHMdGu/qCQ5z5h9zq4gI8uBtqkpHhsF4Z/OwExufUCThew==
+"@jridgewell/remapping@^2.3.5":
+  version "2.3.5"
+  resolved "https://registry.yarnpkg.com/@jridgewell/remapping/-/remapping-2.3.5.tgz#375c476d1972947851ba1e15ae8f123047445aa1"
+  integrity sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==
+  dependencies:
+    "@jridgewell/gen-mapping" "^0.3.5"
+    "@jridgewell/trace-mapping" "^0.3.24"
 
 "@jridgewell/resolve-uri@^3.1.0":
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz#7a0ee601f60f99a20c7c7c5ff0c80388c1189bd6"
   integrity sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==
 
-"@jridgewell/set-array@^1.0.0", "@jridgewell/set-array@^1.0.1":
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.2.tgz#7c6cf998d6d20b914c0a55a91ae928ff25965e72"
-  integrity sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==
+"@jridgewell/sourcemap-codec@^1.4.14", "@jridgewell/sourcemap-codec@^1.5.0", "@jridgewell/sourcemap-codec@^1.5.5":
+  version "1.5.5"
+  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz#6912b00d2c631c0d15ce1a7ab57cd657f2a8f8ba"
+  integrity sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==
 
-"@jridgewell/set-array@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.2.1.tgz#558fb6472ed16a4c850b889530e6b36438c49280"
-  integrity sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==
-
-"@jridgewell/source-map@^0.3.2":
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.2.tgz#f45351aaed4527a298512ec72f81040c998580fb"
-  integrity sha512-m7O9o2uR8k2ObDysZYzdfhb08VuEml5oWGiosa1VdaPZ/A6QyPkAJuwN0Q1lhULOf6B7MtQmHENS743hWtCrgw==
-  dependencies:
-    "@jridgewell/gen-mapping" "^0.3.0"
-    "@jridgewell/trace-mapping" "^0.3.9"
-
-"@jridgewell/sourcemap-codec@1.4.14":
-  version "1.4.14"
-  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24"
-  integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
-
-"@jridgewell/sourcemap-codec@^1.4.10":
-  version "1.4.11"
-  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.11.tgz#771a1d8d744eeb71b6adb35808e1a6c7b9b8c8ec"
-  integrity sha512-Fg32GrJo61m+VqYSdRSjRXMjQ06j8YIYfcTqndLYVAaHmroZHLJZCydsWBOTDqXS2v+mjxohBWEMfg97GXmYQg==
-
-"@jridgewell/sourcemap-codec@^1.4.14", "@jridgewell/sourcemap-codec@^1.4.15":
-  version "1.4.15"
-  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz#d7c6e6755c78567a951e04ab52ef0fd26de59f32"
-  integrity sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==
-
-"@jridgewell/trace-mapping@^0.3.0":
-  version "0.3.4"
-  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.4.tgz#f6a0832dffd5b8a6aaa633b7d9f8e8e94c83a0c3"
-  integrity sha512-vFv9ttIedivx0ux3QSjhgtCVjPZd5l46ZOMDSCwnH1yUO2e964gO8LZGyv2QkqcgR6TnBU1v+1IFqmeoG+0UJQ==
-  dependencies:
-    "@jridgewell/resolve-uri" "^3.0.3"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
-
-"@jridgewell/trace-mapping@^0.3.14":
-  version "0.3.15"
-  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.15.tgz#aba35c48a38d3fd84b37e66c9c0423f9744f9774"
-  integrity sha512-oWZNOULl+UbhsgB51uuZzglikfIKSUBO/M9W2OfEjn7cmqoAiCgmv9lyACTUacZwBz0ITnJ2NqjU8Tx0DHL88g==
-  dependencies:
-    "@jridgewell/resolve-uri" "^3.0.3"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
-
-"@jridgewell/trace-mapping@^0.3.17":
-  version "0.3.17"
-  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz#793041277af9073b0951a7fe0f0d8c4c98c36985"
-  integrity sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==
-  dependencies:
-    "@jridgewell/resolve-uri" "3.1.0"
-    "@jridgewell/sourcemap-codec" "1.4.14"
-
-"@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.25":
-  version "0.3.25"
-  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz#15f190e98895f3fc23276ee14bc76b675c2e50f0"
-  integrity sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==
+"@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.25", "@jridgewell/trace-mapping@^0.3.28":
+  version "0.3.30"
+  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.30.tgz#4a76c4daeee5df09f5d3940e087442fb36ce2b99"
+  integrity sha512-GQ7Nw5G2lTu/BtHTKfXhKHok2WGetd4XYcVKGx00SjAk8GMwgJM3zr6zORiPGuOE+/vkc90KtTosSSvaCjKb2Q==
   dependencies:
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
-"@jridgewell/trace-mapping@^0.3.9":
-  version "0.3.14"
-  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.14.tgz#b231a081d8f66796e475ad588a1ef473112701ed"
-  integrity sha512-bJWEfQ9lPTvm3SneWwRFVLzrh6nhjwqw7TUFFBEMzwvg7t7PCDenf2lDwqo4NQXzdpgBXyFgDWnQA+2vkruksQ==
-  dependencies:
-    "@jridgewell/resolve-uri" "^3.0.3"
-    "@jridgewell/sourcemap-codec" "^1.4.10"
-
-"@kazvmoe-infra/pinch-zoom-element@1.2.0":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@kazvmoe-infra/pinch-zoom-element/-/pinch-zoom-element-1.2.0.tgz#eb3ca34c53b4410c689d60aca02f4a497ce84aba"
-  integrity sha512-HBrhH5O/Fsp2bB7EGTXzCsBAVcMjknSagKC5pBdGpKsF8meHISR0kjDIdw4YoE0S+0oNMwJ6ZUZyIBrdywxPPw==
+"@kazvmoe-infra/pinch-zoom-element@1.3.0":
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/@kazvmoe-infra/pinch-zoom-element/-/pinch-zoom-element-1.3.0.tgz#a5e35ab190f93d016b8a83f69004fc69a8e6b774"
+  integrity sha512-YIx1ZsCLyFB/xhJVMc81yLNJO/ZYveYGws0033ZPPyrFLgLwrQrkx79lC1xBIcWlWnvPioTVdmOpnBeTv/0zNw==
   dependencies:
     pointer-tracker "^2.0.3"
 
@@ -2016,6 +1631,132 @@
   resolved "https://registry.yarnpkg.com/@kazvmoe-infra/unicode-emoji-json/-/unicode-emoji-json-0.4.0.tgz#555bab2f8d11db74820ef0a2fbe2805b17c22587"
   integrity sha512-22OffREdHzD0U6A/W4RaFPV8NR73za6euibtAxNxO/fu5A6TwxRO2lAdbDWKJH9COv/vYs8zqfEiSalXH2nXJA==
 
+"@keyv/bigmap@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@keyv/bigmap/-/bigmap-1.0.2.tgz#9480d168c99a4a6c2fd3b677387cd922aa82a470"
+  integrity sha512-KR03xkEZlAZNF4IxXgVXb+uNIVNvwdh8UwI0cnc7WI6a+aQcDp8GL80qVfeB4E5NpsKJzou5jU0r6yLSSbMOtA==
+  dependencies:
+    hookified "^1.12.1"
+
+"@keyv/serialize@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@keyv/serialize/-/serialize-1.1.1.tgz#0c01dd3a3483882af7cf3878d4e71d505c81fc4a"
+  integrity sha512-dXn3FZhPv0US+7dtJsIi2R+c7qWYiReoEh5zUntWCf4oSpMNib8FDhSoed6m3QyZdx5hK7iLFkYk3rNxwt8vTA==
+
+"@mswjs/interceptors@^0.39.1":
+  version "0.39.2"
+  resolved "https://registry.yarnpkg.com/@mswjs/interceptors/-/interceptors-0.39.2.tgz#de9de0ab23f99d387c7904df7219a92157d1d666"
+  integrity sha512-RuzCup9Ct91Y7V79xwCb146RaBRHZ7NBbrIUySumd1rpKqHL5OonaqrGIbug5hNwP/fRyxFMA6ISgw4FTtYFYg==
+  dependencies:
+    "@open-draft/deferred-promise" "^2.2.0"
+    "@open-draft/logger" "^0.3.0"
+    "@open-draft/until" "^2.0.0"
+    is-node-process "^1.2.0"
+    outvariant "^1.4.3"
+    strict-event-emitter "^0.5.1"
+
+"@napi-rs/nice-android-arm-eabi@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-android-arm-eabi/-/nice-android-arm-eabi-1.0.1.tgz#9a0cba12706ff56500df127d6f4caf28ddb94936"
+  integrity sha512-5qpvOu5IGwDo7MEKVqqyAxF90I6aLj4n07OzpARdgDRfz8UbBztTByBp0RC59r3J1Ij8uzYi6jI7r5Lws7nn6w==
+
+"@napi-rs/nice-android-arm64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-android-arm64/-/nice-android-arm64-1.0.1.tgz#32fc32e9649bd759d2a39ad745e95766f6759d2f"
+  integrity sha512-GqvXL0P8fZ+mQqG1g0o4AO9hJjQaeYG84FRfZaYjyJtZZZcMjXW5TwkL8Y8UApheJgyE13TQ4YNUssQaTgTyvA==
+
+"@napi-rs/nice-darwin-arm64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-darwin-arm64/-/nice-darwin-arm64-1.0.1.tgz#d3c44c51b94b25a82d45803e2255891e833e787b"
+  integrity sha512-91k3HEqUl2fsrz/sKkuEkscj6EAj3/eZNCLqzD2AA0TtVbkQi8nqxZCZDMkfklULmxLkMxuUdKe7RvG/T6s2AA==
+
+"@napi-rs/nice-darwin-x64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-darwin-x64/-/nice-darwin-x64-1.0.1.tgz#f1b1365a8370c6a6957e90085a9b4873d0e6a957"
+  integrity sha512-jXnMleYSIR/+TAN/p5u+NkCA7yidgswx5ftqzXdD5wgy/hNR92oerTXHc0jrlBisbd7DpzoaGY4cFD7Sm5GlgQ==
+
+"@napi-rs/nice-freebsd-x64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-freebsd-x64/-/nice-freebsd-x64-1.0.1.tgz#4280f081efbe0b46c5165fdaea8b286e55a8f89e"
+  integrity sha512-j+iJ/ezONXRQsVIB/FJfwjeQXX7A2tf3gEXs4WUGFrJjpe/z2KB7sOv6zpkm08PofF36C9S7wTNuzHZ/Iiccfw==
+
+"@napi-rs/nice-linux-arm-gnueabihf@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-arm-gnueabihf/-/nice-linux-arm-gnueabihf-1.0.1.tgz#07aec23a9467ed35eb7602af5e63d42c5d7bd473"
+  integrity sha512-G8RgJ8FYXYkkSGQwywAUh84m946UTn6l03/vmEXBYNJxQJcD+I3B3k5jmjFG/OPiU8DfvxutOP8bi+F89MCV7Q==
+
+"@napi-rs/nice-linux-arm64-gnu@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-arm64-gnu/-/nice-linux-arm64-gnu-1.0.1.tgz#038a77134cc6df3c48059d5a5e199d6f50fb9a90"
+  integrity sha512-IMDak59/W5JSab1oZvmNbrms3mHqcreaCeClUjwlwDr0m3BoR09ZiN8cKFBzuSlXgRdZ4PNqCYNeGQv7YMTjuA==
+
+"@napi-rs/nice-linux-arm64-musl@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-arm64-musl/-/nice-linux-arm64-musl-1.0.1.tgz#715d0906582ba0cff025109f42e5b84ea68c2bcc"
+  integrity sha512-wG8fa2VKuWM4CfjOjjRX9YLIbysSVV1S3Kgm2Fnc67ap/soHBeYZa6AGMeR5BJAylYRjnoVOzV19Cmkco3QEPw==
+
+"@napi-rs/nice-linux-ppc64-gnu@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-ppc64-gnu/-/nice-linux-ppc64-gnu-1.0.1.tgz#ac1c8f781c67b0559fa7a1cd4ae3ca2299dc3d06"
+  integrity sha512-lxQ9WrBf0IlNTCA9oS2jg/iAjQyTI6JHzABV664LLrLA/SIdD+I1i3Mjf7TsnoUbgopBcCuDztVLfJ0q9ubf6Q==
+
+"@napi-rs/nice-linux-riscv64-gnu@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-riscv64-gnu/-/nice-linux-riscv64-gnu-1.0.1.tgz#b0a430549acfd3920ffd28ce544e2fe17833d263"
+  integrity sha512-3xs69dO8WSWBb13KBVex+yvxmUeEsdWexxibqskzoKaWx9AIqkMbWmE2npkazJoopPKX2ULKd8Fm9veEn0g4Ig==
+
+"@napi-rs/nice-linux-s390x-gnu@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-s390x-gnu/-/nice-linux-s390x-gnu-1.0.1.tgz#5b95caf411ad72a965885217db378c4d09733e97"
+  integrity sha512-lMFI3i9rlW7hgToyAzTaEybQYGbQHDrpRkg+1gJWEpH0PLAQoZ8jiY0IzakLfNWnVda1eTYYlxxFYzW8Rqczkg==
+
+"@napi-rs/nice-linux-x64-gnu@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-x64-gnu/-/nice-linux-x64-gnu-1.0.1.tgz#a98cdef517549f8c17a83f0236a69418a90e77b7"
+  integrity sha512-XQAJs7DRN2GpLN6Fb+ZdGFeYZDdGl2Fn3TmFlqEL5JorgWKrQGRUrpGKbgZ25UeZPILuTKJ+OowG2avN8mThBA==
+
+"@napi-rs/nice-linux-x64-musl@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-linux-x64-musl/-/nice-linux-x64-musl-1.0.1.tgz#5e26843eafa940138aed437c870cca751c8a8957"
+  integrity sha512-/rodHpRSgiI9o1faq9SZOp/o2QkKQg7T+DK0R5AkbnI/YxvAIEHf2cngjYzLMQSQgUhxym+LFr+UGZx4vK4QdQ==
+
+"@napi-rs/nice-win32-arm64-msvc@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-win32-arm64-msvc/-/nice-win32-arm64-msvc-1.0.1.tgz#bd62617d02f04aa30ab1e9081363856715f84cd8"
+  integrity sha512-rEcz9vZymaCB3OqEXoHnp9YViLct8ugF+6uO5McifTedjq4QMQs3DHz35xBEGhH3gJWEsXMUbzazkz5KNM5YUg==
+
+"@napi-rs/nice-win32-ia32-msvc@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-win32-ia32-msvc/-/nice-win32-ia32-msvc-1.0.1.tgz#b8b7aad552a24836027473d9b9f16edaeabecf18"
+  integrity sha512-t7eBAyPUrWL8su3gDxw9xxxqNwZzAqKo0Szv3IjVQd1GpXXVkb6vBBQUuxfIYaXMzZLwlxRQ7uzM2vdUE9ULGw==
+
+"@napi-rs/nice-win32-x64-msvc@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice-win32-x64-msvc/-/nice-win32-x64-msvc-1.0.1.tgz#37d8718b8f722f49067713e9f1e85540c9a3dd09"
+  integrity sha512-JlF+uDcatt3St2ntBG8H02F1mM45i5SF9W+bIKiReVE6wiy3o16oBP/yxt+RZ+N6LbCImJXJ6bXNO2kn9AXicg==
+
+"@napi-rs/nice@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@napi-rs/nice/-/nice-1.0.1.tgz#483d3ff31e5661829a1efb4825591a135c3bfa7d"
+  integrity sha512-zM0mVWSXE0a0h9aKACLwKmD6nHcRiKrPpCfvaKqG1CqDEyjEawId0ocXxVzPMCAm6kkWr2P025msfxXEnt8UGQ==
+  optionalDependencies:
+    "@napi-rs/nice-android-arm-eabi" "1.0.1"
+    "@napi-rs/nice-android-arm64" "1.0.1"
+    "@napi-rs/nice-darwin-arm64" "1.0.1"
+    "@napi-rs/nice-darwin-x64" "1.0.1"
+    "@napi-rs/nice-freebsd-x64" "1.0.1"
+    "@napi-rs/nice-linux-arm-gnueabihf" "1.0.1"
+    "@napi-rs/nice-linux-arm64-gnu" "1.0.1"
+    "@napi-rs/nice-linux-arm64-musl" "1.0.1"
+    "@napi-rs/nice-linux-ppc64-gnu" "1.0.1"
+    "@napi-rs/nice-linux-riscv64-gnu" "1.0.1"
+    "@napi-rs/nice-linux-s390x-gnu" "1.0.1"
+    "@napi-rs/nice-linux-x64-gnu" "1.0.1"
+    "@napi-rs/nice-linux-x64-musl" "1.0.1"
+    "@napi-rs/nice-win32-arm64-msvc" "1.0.1"
+    "@napi-rs/nice-win32-ia32-msvc" "1.0.1"
+    "@napi-rs/nice-win32-x64-msvc" "1.0.1"
+
 "@nicolo-ribaudo/eslint-scope-5-internals@5.1.1-v1":
   version "5.1.1-v1"
   resolved "https://registry.yarnpkg.com/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz#dbf733a965ca47b1973177dc0bb6c889edcfb129"
@@ -2023,30 +1764,29 @@
   dependencies:
     eslint-scope "5.1.1"
 
-"@nightwatch/chai@5.0.2":
-  version "5.0.2"
-  resolved "https://registry.yarnpkg.com/@nightwatch/chai/-/chai-5.0.2.tgz#86b20908fc090dffd5c9567c0392bc6a494cc2e6"
-  integrity sha512-yzILJFCcE75OPoRfBlJ80Y3Ky06ljsdrK4Ld92yhmM477vxO2GEguwnd+ldl7pdSYTcg1gSJ1bPPQrA+/Hrn+A==
+"@nightwatch/chai@5.0.3":
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/@nightwatch/chai/-/chai-5.0.3.tgz#c92ebe0cd2ee986f7e838cbd86abd8af49861b01"
+  integrity sha512-1OIkOf/7jswOC3/t+Add/HVQO8ib75kz6BVYSNeWGghTlmHUqYEfNJ6vcACbXrn/4v3+9iRlWixuhFkxXkU/RQ==
   dependencies:
     assertion-error "1.1.0"
     check-error "1.0.2"
     deep-eql "4.0.1"
-    loupe "2.3.4"
+    loupe "^2.3.7"
     pathval "1.1.1"
     type-detect "4.0.8"
 
-"@nightwatch/html-reporter-template@0.2.1":
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/@nightwatch/html-reporter-template/-/html-reporter-template-0.2.1.tgz#9fa86e8cab6ee703d2e55b47abac92613f97a298"
-  integrity sha512-GEBeGoXVmTYPtNC4Yq34vfgxf6mlFyEagxpsfH18Qe5BvctF2rprX+wI5dKBm9p5IqHo6ZOcXHCufOeP3cjuOw==
+"@nightwatch/html-reporter-template@^0.3.0":
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/@nightwatch/html-reporter-template/-/html-reporter-template-0.3.0.tgz#80ca3ccfe880d1db988eefe0e0e9ea7d161d91f3"
+  integrity sha512-Mze1z6pmUz2O8N9w1/h3QWz1lzMig45PGyh8PrL9ERs3FxVnIX0RCn37vjZUYiV4wgjZOg41JjdcpriZ3dJxkA==
 
-"@nodelib/fs.scandir@2.1.3":
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz#3a582bdb53804c6ba6d146579c46e52130cf4a3b"
-  integrity sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==
+"@nightwatch/nightwatch-inspector@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@nightwatch/nightwatch-inspector/-/nightwatch-inspector-1.0.1.tgz#bbfbf1d17418abf3c6335232e899040832b60678"
+  integrity sha512-/ax11EOB4eJXT5VioMztcalbCtsNeuFn6icfT75qPLBmkxLvThePSfyGTys+t9AULUR0ug0wMDMiLV1Oy586Fg==
   dependencies:
-    "@nodelib/fs.stat" "2.0.3"
-    run-parallel "^1.1.9"
+    archiver "^5.3.1"
 
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
@@ -2056,25 +1796,12 @@
     "@nodelib/fs.stat" "2.0.5"
     run-parallel "^1.1.9"
 
-"@nodelib/fs.stat@2.0.3", "@nodelib/fs.stat@^2.0.2":
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz#34dc5f4cabbc720f4e60f75a747e7ecd6c175bd3"
-  integrity sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==
-
-"@nodelib/fs.stat@2.0.5":
+"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz#5bd262af94e9d25bd1e71b05deed44876a222e8b"
   integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
 
 "@nodelib/fs.walk@^1.2.3":
-  version "1.2.4"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz#011b9202a70a6366e436ca5c065844528ab04976"
-  integrity sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==
-  dependencies:
-    "@nodelib/fs.scandir" "2.1.3"
-    fastq "^1.6.0"
-
-"@nodelib/fs.walk@^1.2.8":
   version "1.2.8"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz#e95737e8bb6746ddedf69c556953494f196fe69a"
   integrity sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==
@@ -2082,194 +1809,392 @@
     "@nodelib/fs.scandir" "2.1.5"
     fastq "^1.6.0"
 
-"@ruffle-rs/ruffle@0.1.0-nightly.2024.8.21":
-  version "0.1.0-nightly.2024.8.21"
-  resolved "https://registry.yarnpkg.com/@ruffle-rs/ruffle/-/ruffle-0.1.0-nightly.2024.8.21.tgz#e4bdb6386b487dc12471681c7265f565d813e1cf"
-  integrity sha512-nfTPJEPJPo4MrUACuLoW19wNKgF1rrbxCO5if1MZfsWcUxZ6+pwlQWq1JxXalxEjYg8VwJtWzWEchWJQkMckwA==
+"@one-ini/wasm@0.1.1":
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/@one-ini/wasm/-/wasm-0.1.1.tgz#6013659736c9dbfccc96e8a9c2b3de317df39323"
+  integrity sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw==
 
-"@sinclair/typebox@^0.24.1":
-  version "0.24.51"
-  resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.24.51.tgz#645f33fe4e02defe26f2f5c0410e1c094eac7f5f"
-  integrity sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA==
+"@open-draft/deferred-promise@^2.2.0":
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/@open-draft/deferred-promise/-/deferred-promise-2.2.0.tgz#4a822d10f6f0e316be4d67b4d4f8c9a124b073bd"
+  integrity sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA==
 
-"@sinonjs/commons@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-2.0.0.tgz#fd4ca5b063554307e8327b4564bd56d3b73924a3"
-  integrity sha512-uLa0j859mMrg2slwQYdO/AkrOfmH+X6LTVmNTS9CqexuE2IvVORIkSpJLqePAbEnKJ77aMmCwr1NUZ57120Xcg==
+"@open-draft/logger@^0.3.0":
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/@open-draft/logger/-/logger-0.3.0.tgz#2b3ab1242b360aa0adb28b85f5d7da1c133a0954"
+  integrity sha512-X2g45fzhxH238HKO4xbSr7+wBS8Fvw6ixhTDuvLd5mqh6bJJCFAPwU9mPDxbcrRtfxv4u5IHCEH77BmxvXmmxQ==
+  dependencies:
+    is-node-process "^1.2.0"
+    outvariant "^1.4.0"
+
+"@open-draft/until@^2.0.0", "@open-draft/until@^2.1.0":
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/@open-draft/until/-/until-2.1.0.tgz#0acf32f470af2ceaf47f095cdecd40d68666efda"
+  integrity sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==
+
+"@parcel/watcher-android-arm64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.1.tgz#507f836d7e2042f798c7d07ad19c3546f9848ac1"
+  integrity sha512-KF8+j9nNbUN8vzOFDpRMsaKBHZ/mcjEjMToVMJOhTozkDonQFFrRcfdLWn6yWKCmJKmdVxSgHiYvTCef4/qcBA==
+
+"@parcel/watcher-darwin-arm64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.1.tgz#3d26dce38de6590ef79c47ec2c55793c06ad4f67"
+  integrity sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==
+
+"@parcel/watcher-darwin-x64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.1.tgz#99f3af3869069ccf774e4ddfccf7e64fd2311ef8"
+  integrity sha512-1ZXDthrnNmwv10A0/3AJNZ9JGlzrF82i3gNQcWOzd7nJ8aj+ILyW1MTxVk35Db0u91oD5Nlk9MBiujMlwmeXZg==
+
+"@parcel/watcher-freebsd-x64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.1.tgz#14d6857741a9f51dfe51d5b08b7c8afdbc73ad9b"
+  integrity sha512-SI4eljM7Flp9yPuKi8W0ird8TI/JK6CSxju3NojVI6BjHsTyK7zxA9urjVjEKJ5MBYC+bLmMcbAWlZ+rFkLpJQ==
+
+"@parcel/watcher-linux-arm-glibc@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.1.tgz#43c3246d6892381db473bb4f663229ad20b609a1"
+  integrity sha512-RCdZlEyTs8geyBkkcnPWvtXLY44BCeZKmGYRtSgtwwnHR4dxfHRG3gR99XdMEdQ7KeiDdasJwwvNSF5jKtDwdA==
+
+"@parcel/watcher-linux-arm-musl@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.1.tgz#663750f7090bb6278d2210de643eb8a3f780d08e"
+  integrity sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==
+
+"@parcel/watcher-linux-arm64-glibc@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.1.tgz#ba60e1f56977f7e47cd7e31ad65d15fdcbd07e30"
+  integrity sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==
+
+"@parcel/watcher-linux-arm64-musl@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.1.tgz#f7fbcdff2f04c526f96eac01f97419a6a99855d2"
+  integrity sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==
+
+"@parcel/watcher-linux-x64-glibc@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.1.tgz#4d2ea0f633eb1917d83d483392ce6181b6a92e4e"
+  integrity sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==
+
+"@parcel/watcher-linux-x64-musl@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.1.tgz#277b346b05db54f55657301dd77bdf99d63606ee"
+  integrity sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==
+
+"@parcel/watcher-win32-arm64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.1.tgz#7e9e02a26784d47503de1d10e8eab6cceb524243"
+  integrity sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==
+
+"@parcel/watcher-win32-ia32@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.1.tgz#2d0f94fa59a873cdc584bf7f6b1dc628ddf976e6"
+  integrity sha512-c2KkcVN+NJmuA7CGlaGD1qJh1cLfDnQsHjE89E60vUEMlqduHGCdCLJCID5geFVM0dOtA3ZiIO8BoEQmzQVfpQ==
+
+"@parcel/watcher-win32-x64@2.5.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.1.tgz#ae52693259664ba6f2228fa61d7ee44b64ea0947"
+  integrity sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==
+
+"@parcel/watcher@^2.4.1":
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/@parcel/watcher/-/watcher-2.5.1.tgz#342507a9cfaaf172479a882309def1e991fb1200"
+  integrity sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==
+  dependencies:
+    detect-libc "^1.0.3"
+    is-glob "^4.0.3"
+    micromatch "^4.0.5"
+    node-addon-api "^7.0.0"
+  optionalDependencies:
+    "@parcel/watcher-android-arm64" "2.5.1"
+    "@parcel/watcher-darwin-arm64" "2.5.1"
+    "@parcel/watcher-darwin-x64" "2.5.1"
+    "@parcel/watcher-freebsd-x64" "2.5.1"
+    "@parcel/watcher-linux-arm-glibc" "2.5.1"
+    "@parcel/watcher-linux-arm-musl" "2.5.1"
+    "@parcel/watcher-linux-arm64-glibc" "2.5.1"
+    "@parcel/watcher-linux-arm64-musl" "2.5.1"
+    "@parcel/watcher-linux-x64-glibc" "2.5.1"
+    "@parcel/watcher-linux-x64-musl" "2.5.1"
+    "@parcel/watcher-win32-arm64" "2.5.1"
+    "@parcel/watcher-win32-ia32" "2.5.1"
+    "@parcel/watcher-win32-x64" "2.5.1"
+
+"@pkgjs/parseargs@^0.11.0":
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/@pkgjs/parseargs/-/parseargs-0.11.0.tgz#a77ea742fab25775145434eb1d2328cf5013ac33"
+  integrity sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==
+
+"@polka/url@^1.0.0-next.24":
+  version "1.0.0-next.29"
+  resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.29.tgz#5a40109a1ab5f84d6fd8fc928b19f367cbe7e7b1"
+  integrity sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==
+
+"@rolldown/pluginutils@^1.0.0-beta.9":
+  version "1.0.0-beta.33"
+  resolved "https://registry.yarnpkg.com/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.33.tgz#ca02474d97182d0444dfd079c4e8f2c4125bf599"
+  integrity sha512-she25NCG6NoEPC/SEB4pHs5STcnfI4VBFOzjeI63maSPrWME5J2XC8ogrBgp8NaE/xzj28/kbpSaebiMvFRj+w==
+
+"@rollup/pluginutils@^5.2.0":
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-5.2.0.tgz#eac25ca5b0bdda4ba735ddaca5fbf26bd435f602"
+  integrity sha512-qWJ2ZTbmumwiLFomfzTyt5Kng4hwPi9rwCYN4SHb6eaRU1KNO4ccxINHr/VhH4GgPlt1XfSTLX2LBTme8ne4Zw==
+  dependencies:
+    "@types/estree" "^1.0.0"
+    estree-walker "^2.0.2"
+    picomatch "^4.0.2"
+
+"@rollup/rollup-android-arm-eabi@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.52.4.tgz#59e7478d310f7e6a7c72453978f562483828112f"
+  integrity sha512-BTm2qKNnWIQ5auf4deoetINJm2JzvihvGb9R6K/ETwKLql/Bb3Eg2H1FBp1gUb4YGbydMA3jcmQTR73q7J+GAA==
+
+"@rollup/rollup-android-arm64@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.52.4.tgz#a825192a0b1b2f27a5c950c439e7e37a33c5d056"
+  integrity sha512-P9LDQiC5vpgGFgz7GSM6dKPCiqR3XYN1WwJKA4/BUVDjHpYsf3iBEmVz62uyq20NGYbiGPR5cNHI7T1HqxNs2w==
+
+"@rollup/rollup-darwin-arm64@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.52.4.tgz#4ee37078bccd725ae3c5f30ef92efc8e1bf886f3"
+  integrity sha512-QRWSW+bVccAvZF6cbNZBJwAehmvG9NwfWHwMy4GbWi/BQIA/laTIktebT2ipVjNncqE6GLPxOok5hsECgAxGZg==
+
+"@rollup/rollup-darwin-x64@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.52.4.tgz#43cc08bd05bf9f388f125e7210a544e62d368d90"
+  integrity sha512-hZgP05pResAkRJxL1b+7yxCnXPGsXU0fG9Yfd6dUaoGk+FhdPKCJ5L1Sumyxn8kvw8Qi5PvQ8ulenUbRjzeCTw==
+
+"@rollup/rollup-freebsd-arm64@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.52.4.tgz#bc8e640e28abe52450baf3fc80d9b26d9bb6587d"
+  integrity sha512-xmc30VshuBNUd58Xk4TKAEcRZHaXlV+tCxIXELiE9sQuK3kG8ZFgSPi57UBJt8/ogfhAF5Oz4ZSUBN77weM+mQ==
+
+"@rollup/rollup-freebsd-x64@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.52.4.tgz#e981a22e057cc8c65bb523019d344d3a66b15bbc"
+  integrity sha512-WdSLpZFjOEqNZGmHflxyifolwAiZmDQzuOzIq9L27ButpCVpD7KzTRtEG1I0wMPFyiyUdOO+4t8GvrnBLQSwpw==
+
+"@rollup/rollup-linux-arm-gnueabihf@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.52.4.tgz#4036b68904f392a20f3499d63b33e055b67eb274"
+  integrity sha512-xRiOu9Of1FZ4SxVbB0iEDXc4ddIcjCv2aj03dmW8UrZIW7aIQ9jVJdLBIhxBI+MaTnGAKyvMwPwQnoOEvP7FgQ==
+
+"@rollup/rollup-linux-arm-musleabihf@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.52.4.tgz#d3b1b9589606e0ff916801c855b1ace9e733427a"
+  integrity sha512-FbhM2p9TJAmEIEhIgzR4soUcsW49e9veAQCziwbR+XWB2zqJ12b4i/+hel9yLiD8pLncDH4fKIPIbt5238341Q==
+
+"@rollup/rollup-linux-arm64-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.52.4.tgz#cbf0943c477e3b96340136dd3448eaf144378cf2"
+  integrity sha512-4n4gVwhPHR9q/g8lKCyz0yuaD0MvDf7dV4f9tHt0C73Mp8h38UCtSCSE6R9iBlTbXlmA8CjpsZoujhszefqueg==
+
+"@rollup/rollup-linux-arm64-musl@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.52.4.tgz#837f5a428020d5dce1c3b4cc049876075402cf78"
+  integrity sha512-u0n17nGA0nvi/11gcZKsjkLj1QIpAuPFQbR48Subo7SmZJnGxDpspyw2kbpuoQnyK+9pwf3pAoEXerJs/8Mi9g==
+
+"@rollup/rollup-linux-loong64-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.52.4.tgz#532c214ababb32ab4bc21b4054278b9a8979e516"
+  integrity sha512-0G2c2lpYtbTuXo8KEJkDkClE/+/2AFPdPAbmaHoE870foRFs4pBrDehilMcrSScrN/fB/1HTaWO4bqw+ewBzMQ==
+
+"@rollup/rollup-linux-ppc64-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.52.4.tgz#93900163b61b49cee666d10ee38257a8b1dd161a"
+  integrity sha512-teSACug1GyZHmPDv14VNbvZFX779UqWTsd7KtTM9JIZRDI5NUwYSIS30kzI8m06gOPB//jtpqlhmraQ68b5X2g==
+
+"@rollup/rollup-linux-riscv64-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.52.4.tgz#f0ffdcc7066ca04bc972370c74289f35c7a7dc42"
+  integrity sha512-/MOEW3aHjjs1p4Pw1Xk4+3egRevx8Ji9N6HUIA1Ifh8Q+cg9dremvFCUbOX2Zebz80BwJIgCBUemjqhU5XI5Eg==
+
+"@rollup/rollup-linux-riscv64-musl@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.52.4.tgz#361695c39dbe96773509745d77a870a32a9f8e48"
+  integrity sha512-1HHmsRyh845QDpEWzOFtMCph5Ts+9+yllCrREuBR/vg2RogAQGGBRC8lDPrPOMnrdOJ+mt1WLMOC2Kao/UwcvA==
+
+"@rollup/rollup-linux-s390x-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.52.4.tgz#09fc6cc2e266a2324e366486ae5d1bca48c43a6a"
+  integrity sha512-seoeZp4L/6D1MUyjWkOMRU6/iLmCU2EjbMTyAG4oIOs1/I82Y5lTeaxW0KBfkUdHAWN7j25bpkt0rjnOgAcQcA==
+
+"@rollup/rollup-linux-x64-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.52.4.tgz#aa9d5b307c08f05d3454225bb0a2b4cc87eeb2e1"
+  integrity sha512-Wi6AXf0k0L7E2gteNsNHUs7UMwCIhsCTs6+tqQ5GPwVRWMaflqGec4Sd8n6+FNFDw9vGcReqk2KzBDhCa1DLYg==
+
+"@rollup/rollup-linux-x64-musl@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.52.4.tgz#26949e5b4645502a61daba2f7a8416bd17cb5382"
+  integrity sha512-dtBZYjDmCQ9hW+WgEkaffvRRCKm767wWhxsFW3Lw86VXz/uJRuD438/XvbZT//B96Vs8oTA8Q4A0AfHbrxP9zw==
+
+"@rollup/rollup-openharmony-arm64@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.52.4.tgz#ef493c072f9dac7e0edb6c72d63366846b6ffcd9"
+  integrity sha512-1ox+GqgRWqaB1RnyZXL8PD6E5f7YyRUJYnCqKpNzxzP0TkaUh112NDrR9Tt+C8rJ4x5G9Mk8PQR3o7Ku2RKqKA==
+
+"@rollup/rollup-win32-arm64-msvc@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.52.4.tgz#56e1aaa6a630d2202ee7ec0adddd05cf384ffd44"
+  integrity sha512-8GKr640PdFNXwzIE0IrkMWUNUomILLkfeHjXBi/nUvFlpZP+FA8BKGKpacjW6OUUHaNI6sUURxR2U2g78FOHWQ==
+
+"@rollup/rollup-win32-ia32-msvc@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.52.4.tgz#0a44bbf933a9651c7da2b8569fa448dec0de7480"
+  integrity sha512-AIy/jdJ7WtJ/F6EcfOb2GjR9UweO0n43jNObQMb6oGxkYTfLcnN7vYYpG+CN3lLxrQkzWnMOoNSHTW54pgbVxw==
+
+"@rollup/rollup-win32-x64-gnu@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.52.4.tgz#730e12f0b60b234a7c02d5d3179ca3ec7972033d"
+  integrity sha512-UF9KfsH9yEam0UjTwAgdK0anlQ7c8/pWPU2yVjyWcF1I1thABt6WXE47cI71pGiZ8wGvxohBoLnxM04L/wj8mQ==
+
+"@rollup/rollup-win32-x64-msvc@4.52.4":
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.52.4.tgz#5b2dd648a960b8fa00d76f2cc4eea2f03daa80f4"
+  integrity sha512-bf9PtUa0u8IXDVxzRToFQKsNCRz9qLYfR/MpECxl4mRoWYjAeFjgxj1XdZr2M/GNVpT05p+LgQOHopYDlUu6/w==
+
+"@rtsao/scc@^1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@rtsao/scc/-/scc-1.1.0.tgz#927dd2fae9bc3361403ac2c7a00c32ddce9ad7e8"
+  integrity sha512-zt6OdqaDoOnJ1ZYsCYGt9YmWzDXl4vQdKTyJev62gFhRGKdx7mcT54V9KIjg+d2wi9EXsPvAPKe7i7WjfVWB8g==
+
+"@ruffle-rs/ruffle@0.1.0-nightly.2025.6.22":
+  version "0.1.0-nightly.2025.6.22"
+  resolved "https://registry.yarnpkg.com/@ruffle-rs/ruffle/-/ruffle-0.1.0-nightly.2025.6.22.tgz#3f7a3c8989c1781422e5ec0b5b74d428f62b6854"
+  integrity sha512-ECd7j0+CFY+BKyHsN049RIzSjHvsPJuwv8EMqpJ+2AKCy9F12852ziWoDlk89oKH3i0Da3sP2w1ij8wFKsAvtQ==
+
+"@sinonjs/commons@^3.0.1":
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-3.0.1.tgz#1029357e44ca901a615585f6d27738dbc89084cd"
+  integrity sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==
   dependencies:
     type-detect "4.0.8"
 
-"@sinonjs/commons@^3.0.0":
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-3.0.0.tgz#beb434fe875d965265e04722ccfc21df7f755d72"
-  integrity sha512-jXBtWAF4vmdNmZgD5FoKsVLv3rPgDnLgPbU84LIJ3otV44vJlDRokVng5v8NFJdCf/da9legHcKaRuZs4L7faA==
+"@sinonjs/fake-timers@^13.0.5":
+  version "13.0.5"
+  resolved "https://registry.yarnpkg.com/@sinonjs/fake-timers/-/fake-timers-13.0.5.tgz#36b9dbc21ad5546486ea9173d6bea063eb1717d5"
+  integrity sha512-36/hTbH2uaWuGVERyC6da9YwGWnzUZXuPro/F2LfsdOsLnCojz/iSH8MxUt/FD2S5XBSVPhmArFUXcpCQ2Hkiw==
   dependencies:
-    type-detect "4.0.8"
+    "@sinonjs/commons" "^3.0.1"
 
-"@sinonjs/fake-timers@^10.0.2":
-  version "10.0.2"
-  resolved "https://registry.yarnpkg.com/@sinonjs/fake-timers/-/fake-timers-10.0.2.tgz#d10549ed1f423d80639c528b6c7f5a1017747d0c"
-  integrity sha512-SwUDyjWnah1AaNl7kxsa7cfLhlTYoiyhDAIgyh+El30YvXs/o7OLXpYH88Zdhyx9JExKrmHDJ+10bwIcY80Jmw==
+"@sinonjs/samsam@^8.0.1":
+  version "8.0.2"
+  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-8.0.2.tgz#e4386bf668ff36c95949e55a38dc5f5892fc2689"
+  integrity sha512-v46t/fwnhejRSFTGqbpn9u+LQ9xJDse10gNnPgAcxgdoCDMXj/G2asWAC/8Qs+BAZDicX+MNZouXT1A7c83kVw==
   dependencies:
-    "@sinonjs/commons" "^2.0.0"
-
-"@sinonjs/samsam@^8.0.0":
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-8.0.0.tgz#0d488c91efb3fa1442e26abea81759dfc8b5ac60"
-  integrity sha512-Bp8KUVlLp8ibJZrnvq2foVhP0IVX2CIprMJPK0vqGqgrDa0OHVKeZyBykqskkrdxV6yKBPmGasO8LVjAKR3Gew==
-  dependencies:
-    "@sinonjs/commons" "^2.0.0"
+    "@sinonjs/commons" "^3.0.1"
     lodash.get "^4.4.2"
-    type-detect "^4.0.8"
+    type-detect "^4.1.0"
 
-"@sinonjs/text-encoding@^0.7.1":
-  version "0.7.2"
-  resolved "https://registry.yarnpkg.com/@sinonjs/text-encoding/-/text-encoding-0.7.2.tgz#5981a8db18b56ba38ef0efb7d995b12aa7b51918"
-  integrity sha512-sXXKG+uL9IrKqViTtao2Ws6dy0znu9sOaP1di/jKGW1M6VssO8vlpXCQcpZ+jisQ1tTFAC5Jo/EOzFbggBagFQ==
+"@testim/chrome-version@^1.1.4":
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/@testim/chrome-version/-/chrome-version-1.1.4.tgz#86e04e677cd6c05fa230dd15ac223fa72d1d7090"
+  integrity sha512-kIhULpw9TrGYnHp/8VfdcneIcxKnLixmADtukQRtJUmsVlMg0niMkwV0xZmi8hqa57xqilIHjWFA0GKvEjVU5g==
 
-"@socket.io/component-emitter@~3.1.0":
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz#821f8442f4175d8f0467b9daf26e3a18e2d02af2"
-  integrity sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==
-
-"@testim/chrome-version@^1.1.3":
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/@testim/chrome-version/-/chrome-version-1.1.3.tgz#fbb68696899d7b8c1b9b891eded9c04fe2cd5529"
-  integrity sha512-g697J3WxV/Zytemz8aTuKjTGYtta9+02kva3C1xc7KXB8GdbfE1akGJIsZLyY/FSh2QrnE+fiB7vmWU3XNcb6A==
-
-"@tootallnate/once@2":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-2.0.0.tgz#f544a148d3ab35801c1f633a7441fd87c2e484bf"
-  integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==
-
-"@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/color-name@^1.1.1":
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0"
-  integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ==
-
-"@types/cookie@^0.4.1":
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.4.1.tgz#bfd02c1f2224567676c1545199f87c3a861d878d"
-  integrity sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q==
-
-"@types/cors@^2.8.12":
-  version "2.8.12"
-  resolved "https://registry.yarnpkg.com/@types/cors/-/cors-2.8.12.tgz#6b2c510a7ad7039e98e7b8d3d6598f4359e5c080"
-  integrity sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw==
-
-"@types/eslint-scope@^3.7.3":
-  version "3.7.4"
-  resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.4.tgz#37fc1223f0786c39627068a12e94d6e6fc61de16"
-  integrity sha512-9K4zoImiZc3HlIp6AVUDE4CWYx22a+lhSZMYNpbjW04+YF0KWj4pJXnEMjdnFTiQibFFmElcsasJXDbdI/EPhA==
+"@testing-library/dom@^10.4.0":
+  version "10.4.0"
+  resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-10.4.0.tgz#82a9d9462f11d240ecadbf406607c6ceeeff43a8"
+  integrity sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==
   dependencies:
-    "@types/eslint" "*"
-    "@types/estree" "*"
+    "@babel/code-frame" "^7.10.4"
+    "@babel/runtime" "^7.12.5"
+    "@types/aria-query" "^5.0.1"
+    aria-query "5.3.0"
+    chalk "^4.1.0"
+    dom-accessibility-api "^0.5.9"
+    lz-string "^1.5.0"
+    pretty-format "^27.0.2"
 
-"@types/eslint@*", "@types/eslint@^7.29.0 || ^8.4.1":
-  version "8.4.5"
-  resolved "https://registry.yarnpkg.com/@types/eslint/-/eslint-8.4.5.tgz#acdfb7dd36b91cc5d812d7c093811a8f3d9b31e4"
-  integrity sha512-dhsC09y1gpJWnK+Ff4SGvCuSnk9DaU0BJZSzOwa6GVSg65XtTugLBITDAAzRU5duGBoXBHpdR/9jHGxJjNflJQ==
-  dependencies:
-    "@types/estree" "*"
-    "@types/json-schema" "*"
+"@testing-library/user-event@^14.6.1":
+  version "14.6.1"
+  resolved "https://registry.yarnpkg.com/@testing-library/user-event/-/user-event-14.6.1.tgz#13e09a32d7a8b7060fe38304788ebf4197cd2149"
+  integrity sha512-vq7fv0rnt+QTXgPxr5Hjc210p6YKq2kmdziLgnsZGgLJ9e6VAShx1pACLuRjd/AS/sr7phAR58OIIpf0LlmQNw==
 
-"@types/estree@*":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.0.tgz#5fb2e536c1ae9bf35366eed879e827fa59ca41c2"
-  integrity sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==
+"@tootallnate/quickjs-emscripten@^0.23.0":
+  version "0.23.0"
+  resolved "https://registry.yarnpkg.com/@tootallnate/quickjs-emscripten/-/quickjs-emscripten-0.23.0.tgz#db4ecfd499a9765ab24002c3b696d02e6d32a12c"
+  integrity sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==
 
-"@types/estree@^0.0.51":
-  version "0.0.51"
-  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40"
-  integrity sha512-CuPgU6f3eT/XgKKPqKd/gLZV1Xmvf1a2R5POBOGQa6uv82xpls89HU5zKeVoyR8XzHd1RGNOlQlvUe3CFkjWNQ==
+"@types/aria-query@^5.0.1":
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-5.0.4.tgz#1a31c3d378850d2778dabb6374d036dcba4ba708"
+  integrity sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==
 
-"@types/html-minifier-terser@^6.0.0":
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#4fc33a00c1d0c16987b1a20cf92d20614c55ac35"
-  integrity sha512-oh/6byDPnL1zeNXFrDXFLyZjkr1MsBG667IM792caf1L2UPOOMf65NFzjUH/ltyfwjAGfs1rsX1eftK0jC/KIg==
+"@types/chai@^4.3.5":
+  version "4.3.20"
+  resolved "https://registry.yarnpkg.com/@types/chai/-/chai-4.3.20.tgz#cb291577ed342ca92600430841a00329ba05cecc"
+  integrity sha512-/pC9HAB5I/xMlc5FP77qjCnI16ChlJfW0tGa0IUcFn38VJrTV6DeZ60NU5KZBtaOZqjdpwTWohz5HU1RrhiYxQ==
 
-"@types/http-proxy@^1.17.8":
-  version "1.17.9"
-  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.9.tgz#7f0e7931343761efde1e2bf48c40f02f3f75705a"
-  integrity sha512-QsbSjA/fSk7xB+UXlCT3wHBy5ai9wOcNDWwZAtud+jXhwOM3l+EYZh8Lng4+/6n8uar0J7xILzqftJdJ/Wdfkw==
+"@types/cookie@^0.6.0":
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.6.0.tgz#eac397f28bf1d6ae0ae081363eca2f425bedf0d5"
+  integrity sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==
+
+"@types/estree@1.0.8", "@types/estree@^1.0.0":
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.8.tgz#958b91c991b1867ced318bedea0e215ee050726e"
+  integrity sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==
+
+"@types/estree@^1.0.6":
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.7.tgz#4158d3105276773d5b7695cd4834b1722e4f37a8"
+  integrity sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==
+
+"@types/http-proxy@^1.17.15":
+  version "1.17.16"
+  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.16.tgz#dee360707b35b3cc85afcde89ffeebff7d7f9240"
+  integrity sha512-sdWoUajOB1cd0A8cRRQ1cfyWNbmFKLAqBB89Y8x5iYyG/mkJHc0YUH8pdWBy2omi9qtCpiIgGjuwO0dQST2l5w==
   dependencies:
     "@types/node" "*"
 
-"@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0":
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz#8467d4b3c087805d63580480890791277ce35c44"
-  integrity sha512-z/QT1XN4K4KYuslS23k62yDIDLwLFkzxOuMplDtObz0+y7VqJCaO2o+SPwHCvLFZh7xazvvoor2tA/hPz9ee7g==
-
-"@types/istanbul-lib-report@*":
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/@types/istanbul-lib-report/-/istanbul-lib-report-3.0.0.tgz#c14c24f18ea8190c118ee7562b7ff99a36552686"
-  integrity sha512-plGgXAPfVKFoYfa9NpYDAkseG+g6Jr294RqeqcqDixSbU34MZVJRi/P+7Y8GDpzkEwLaGZZOpKIEmeVZNtKsrg==
-  dependencies:
-    "@types/istanbul-lib-coverage" "*"
-
-"@types/istanbul-reports@^3.0.0":
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/@types/istanbul-reports/-/istanbul-reports-3.0.1.tgz#9153fe98bba2bd565a63add9436d6f0d7f8468ff"
-  integrity sha512-c3mAZEuK0lvBp8tmuL74XRKn1+y2dcwOUpH7x4WrF6gk1GIgiluDRgMYQtw2OFcBvAJWlt6ASU3tSqxp0Uu0Aw==
-  dependencies:
-    "@types/istanbul-lib-report" "*"
-
-"@types/json-schema@*", "@types/json-schema@^7.0.8", "@types/json-schema@^7.0.9":
-  version "7.0.11"
-  resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.11.tgz#d421b6c527a3037f7c84433fd2c4229e016863d3"
-  integrity sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==
+"@types/json-schema@^7.0.15":
+  version "7.0.15"
+  resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.15.tgz#596a1747233694d50f6ad8a7869fcb6f56cf5841"
+  integrity sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==
 
 "@types/json5@^0.0.29":
   version "0.0.29"
   resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
-  integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=
-
-"@types/minimist@^1.2.0":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@types/minimist/-/minimist-1.2.0.tgz#69a23a3ad29caf0097f06eda59b361ee2f0639f6"
-  integrity sha1-aaI6OtKcrwCX8G7aWbNh7i8GOfY=
+  integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
 
 "@types/node@*":
-  version "14.14.19"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.19.tgz#5135176a8330b88ece4e9ab1fdcfc0a545b4bab4"
-  integrity sha512-4nhBPStMK04rruRVtVc6cDqhu7S9GZai0fpXgPXrFpcPX6Xul8xnrjSdGB4KPBVYG/R5+fXWdCM8qBoiULWGPQ==
-
-"@types/node@>=10.0.0":
-  version "17.0.22"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.22.tgz#38b6c4b9b2f3ed9f2e376cce42a298fb2375251e"
-  integrity sha512-8FwbVoG4fy+ykY86XCAclKZDORttqE5/s7dyWZKLXTdv3vRy5HozBEinG5IqhvPXXzIZEcTVbuHlQEI6iuwcmw==
-
-"@types/normalize-package-data@^2.4.0":
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.0.tgz#e486d0d97396d79beedd0a6e33f4534ff6b4973e"
-  integrity sha512-f5j5b/Gf71L+dbqxIpQ4Z2WlmI/mPJ0fOkGGmFgtb6sAu97EPczzbS3/tJKxmcYDj55OX6ssqwDAWOHIYDRDGA==
-
-"@types/parse-json@^4.0.0":
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"
-  integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==
-
-"@types/yargs-parser@*":
-  version "21.0.0"
-  resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-21.0.0.tgz#0c60e537fa790f5f9472ed2776c2b71ec117351b"
-  integrity sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA==
-
-"@types/yargs@^17.0.8":
-  version "17.0.13"
-  resolved "https://registry.yarnpkg.com/@types/yargs/-/yargs-17.0.13.tgz#34cced675ca1b1d51fcf4d34c3c6f0fa142a5c76"
-  integrity sha512-9sWaruZk2JGxIQU+IhI1fhPYRcQ0UuTNuKuCW9bR5fp7qi2Llf7WDzNa17Cy7TKnh3cdxDOiyTu6gaLS0eDatg==
+  version "22.13.17"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-22.13.17.tgz#9ca6a81a0180cdcfd3719b9cf6c09186756e1754"
+  integrity sha512-nAJuQXoyPj04uLgu+obZcSmsfOenUg6DxPKogeUy6yNCFwWaj5sBF8/G/pNo8EtBJjAfSVgfIlugR/BCOleO+g==
   dependencies:
-    "@types/yargs-parser" "*"
+    undici-types "~6.20.0"
+
+"@types/selenium-webdriver@^4.1.14":
+  version "4.1.28"
+  resolved "https://registry.yarnpkg.com/@types/selenium-webdriver/-/selenium-webdriver-4.1.28.tgz#7b4f3c50a67494f8fd6d396a2eaab7d9df1f9f34"
+  integrity sha512-Au7CXegiS7oapbB16zxPToY4Cjzi9UQQMf3W2ZZM8PigMLTGR3iUAHjPUTddyE5g1SBjT/qpmvlsAQLBfNAdKg==
+  dependencies:
+    "@types/node" "*"
+    "@types/ws" "*"
+
+"@types/statuses@^2.0.4":
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/@types/statuses/-/statuses-2.0.5.tgz#f61ab46d5352fd73c863a1ea4e1cef3b0b51ae63"
+  integrity sha512-jmIUGWrAiwu3dZpxntxieC+1n/5c3mjrImkmOSQ2NC5uP6cYO4aAZDdSmRcI5C1oiTmqlZGHC+/NmJrKogbP5A==
+
+"@types/tough-cookie@^4.0.5":
+  version "4.0.5"
+  resolved "https://registry.yarnpkg.com/@types/tough-cookie/-/tough-cookie-4.0.5.tgz#cb6e2a691b70cb177c6e3ae9c1d2e8b2ea8cd304"
+  integrity sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==
+
+"@types/ws@*":
+  version "8.18.1"
+  resolved "https://registry.yarnpkg.com/@types/ws/-/ws-8.18.1.tgz#48464e4bf2ddfd17db13d845467f6070ffea4aa9"
+  integrity sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==
+  dependencies:
+    "@types/node" "*"
 
 "@types/yauzl@^2.9.1":
-  version "2.9.1"
-  resolved "https://registry.yarnpkg.com/@types/yauzl/-/yauzl-2.9.1.tgz#d10f69f9f522eef3cf98e30afb684a1e1ec923af"
-  integrity sha512-A1b8SU4D10uoPjwb0lnHmmu8wZhR9d+9o2PKBQT2jU5YPTKsxac6M2qGAdY7VcL+dHHhARVUDmeg0rOrcd9EjA==
+  version "2.10.3"
+  resolved "https://registry.yarnpkg.com/@types/yauzl/-/yauzl-2.10.3.tgz#e9b2808b4f109504a03cda958259876f61017999"
+  integrity sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==
   dependencies:
     "@types/node" "*"
 
@@ -2278,207 +2203,309 @@
   resolved "https://registry.yarnpkg.com/@ungap/event-target/-/event-target-0.2.4.tgz#8b083a62ee665228bac08013fa516a3488528bb8"
   integrity sha512-u9Fd3k2qfMtn+0dxbCn/y0pzQ9Ucw6lWR984CrHcbxc+WzcMkJE4VjWHWSb9At40MjwMyHCkJNXroS55Osshhw==
 
-"@ungap/promise-all-settled@1.1.2":
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/@ungap/promise-all-settled/-/promise-all-settled-1.1.2.tgz#aa58042711d6e3275dd37dc597e5d31e8c290a44"
-  integrity sha512-sL/cEvJWAnClXw0wHk85/2L0G6Sj8UB0Ctc1TEMbKSsmpRosqhwj9gWgFRZSrBr2f9tiXISwNhCPmlfqUqyb9Q==
+"@vitejs/plugin-vue-jsx@^4.1.1":
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue-jsx/-/plugin-vue-jsx-4.2.0.tgz#2738ec05d4705ed553a107342017192e37351640"
+  integrity sha512-DSTrmrdLp+0LDNF77fqrKfx7X0ErRbOcUAgJL/HbSesqQwoUvUQ4uYQqaex+rovqgGcoPqVk+AwUh3v9CuiYIw==
+  dependencies:
+    "@babel/core" "^7.27.1"
+    "@babel/plugin-transform-typescript" "^7.27.1"
+    "@rolldown/pluginutils" "^1.0.0-beta.9"
+    "@vue/babel-plugin-jsx" "^1.4.0"
+
+"@vitejs/plugin-vue@^5.2.1":
+  version "5.2.4"
+  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz#9e8a512eb174bfc2a333ba959bbf9de428d89ad8"
+  integrity sha512-7Yx/SXSOcQq5HiiV3orevHUFn+pmMB4cgbEkDYgnkUWb0WfeQ/wa2yFv6D5ICiCQOVpjA7vYDXrC7AGO8yjDHA==
+
+"@vitest/browser@^3.0.7":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/browser/-/browser-3.1.3.tgz#985f12382bc4aeddbffa4209850ab5cbaaa43e60"
+  integrity sha512-Dgyez9LbHJHl9ObZPo5mu4zohWLo7SMv8zRWclMF+dxhQjmOtEP0raEX13ac5ygcvihNoQPBZXdya5LMSbcCDQ==
+  dependencies:
+    "@testing-library/dom" "^10.4.0"
+    "@testing-library/user-event" "^14.6.1"
+    "@vitest/mocker" "3.1.3"
+    "@vitest/utils" "3.1.3"
+    magic-string "^0.30.17"
+    sirv "^3.0.1"
+    tinyrainbow "^2.0.0"
+    ws "^8.18.1"
+
+"@vitest/expect@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/expect/-/expect-3.1.3.tgz#bbca175cd2f23d7de9448a215baed8f3d7abd7b7"
+  integrity sha512-7FTQQuuLKmN1Ig/h+h/GO+44Q1IlglPlR2es4ab7Yvfx+Uk5xsv+Ykk+MEt/M2Yn/xGmzaLKxGw2lgy2bwuYqg==
+  dependencies:
+    "@vitest/spy" "3.1.3"
+    "@vitest/utils" "3.1.3"
+    chai "^5.2.0"
+    tinyrainbow "^2.0.0"
+
+"@vitest/mocker@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/mocker/-/mocker-3.1.3.tgz#121d0f2fcca20c9ccada9e2d6e761f7fc687f4ce"
+  integrity sha512-PJbLjonJK82uCWHjzgBJZuR7zmAOrSvKk1QBxrennDIgtH4uK0TB1PvYmc0XBCigxxtiAVPfWtAdy4lpz8SQGQ==
+  dependencies:
+    "@vitest/spy" "3.1.3"
+    estree-walker "^3.0.3"
+    magic-string "^0.30.17"
+
+"@vitest/pretty-format@3.1.3", "@vitest/pretty-format@^3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/pretty-format/-/pretty-format-3.1.3.tgz#760b9eab5f253d7d2e7dcd28ef34570f584023d4"
+  integrity sha512-i6FDiBeJUGLDKADw2Gb01UtUNb12yyXAqC/mmRWuYl+m/U9GS7s8us5ONmGkGpUUo7/iAYzI2ePVfOZTYvUifA==
+  dependencies:
+    tinyrainbow "^2.0.0"
+
+"@vitest/runner@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/runner/-/runner-3.1.3.tgz#b268fa90fca38fab363f1107f057c0a2a141ee45"
+  integrity sha512-Tae+ogtlNfFei5DggOsSUvkIaSuVywujMj6HzR97AHK6XK8i3BuVyIifWAm/sE3a15lF5RH9yQIrbXYuo0IFyA==
+  dependencies:
+    "@vitest/utils" "3.1.3"
+    pathe "^2.0.3"
+
+"@vitest/snapshot@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/snapshot/-/snapshot-3.1.3.tgz#39a8f9f8c6ba732ffde59adeacf0a549bef11e76"
+  integrity sha512-XVa5OPNTYUsyqG9skuUkFzAeFnEzDp8hQu7kZ0N25B1+6KjGm4hWLtURyBbsIAOekfWQ7Wuz/N/XXzgYO3deWQ==
+  dependencies:
+    "@vitest/pretty-format" "3.1.3"
+    magic-string "^0.30.17"
+    pathe "^2.0.3"
+
+"@vitest/spy@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/spy/-/spy-3.1.3.tgz#ca81e2b4f0c3d6c75f35defa77c3336f39c8f605"
+  integrity sha512-x6w+ctOEmEXdWaa6TO4ilb7l9DxPR5bwEb6hILKuxfU1NqWT2mpJD9NJN7t3OTfxmVlOMrvtoFJGdgyzZ605lQ==
+  dependencies:
+    tinyspy "^3.0.2"
+
+"@vitest/ui@^3.0.7":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/ui/-/ui-3.1.3.tgz#ad3c3160e6c86d79f817e09b1f8f02f0e2799851"
+  integrity sha512-IipSzX+8DptUdXN/GWq3hq5z18MwnpphYdOMm0WndkRGYELzfq7NDP8dMpZT7JGW1uXFrIGxOW2D0Xi++ulByg==
+  dependencies:
+    "@vitest/utils" "3.1.3"
+    fflate "^0.8.2"
+    flatted "^3.3.3"
+    pathe "^2.0.3"
+    sirv "^3.0.1"
+    tinyglobby "^0.2.13"
+    tinyrainbow "^2.0.0"
+
+"@vitest/utils@3.1.3":
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/@vitest/utils/-/utils-3.1.3.tgz#4f31bdfd646cd82d30bfa730d7410cb59d529669"
+  integrity sha512-2Ltrpht4OmHO9+c/nmHtF09HWiyWdworqnHIwjfvDyWjuwKbdkcS9AnhsDn+8E2RM4x++foD1/tNuLPVvWG1Rg==
+  dependencies:
+    "@vitest/pretty-format" "3.1.3"
+    loupe "^3.1.3"
+    tinyrainbow "^2.0.0"
 
 "@vue/babel-helper-vue-jsx-merge-props@1.4.0":
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz#8d53a1e21347db8edbe54d339902583176de09f2"
   integrity sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA==
 
-"@vue/babel-helper-vue-transform-on@1.2.2":
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.2.2.tgz#7f1f817a4f00ad531651a8d1d22e22d9e42807ef"
-  integrity sha512-nOttamHUR3YzdEqdM/XXDyCSdxMA9VizUKoroLX6yTyRtggzQMHXcmwh8a7ZErcJttIBIc9s68a1B8GZ+Dmvsw==
+"@vue/babel-helper-vue-transform-on@1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.5.0.tgz#b7e99d37eeb144d7b9757d7a1f40cd977fde748a"
+  integrity sha512-0dAYkerNhhHutHZ34JtTl2czVQHUNWv6xEbkdF5W+Yrv5pCWsqjeORdOgbtW2I9gWlt+wBmVn+ttqN9ZxR5tzA==
 
-"@vue/babel-plugin-jsx@1.2.2":
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.2.2.tgz#eb426fb4660aa510bb8d188ff0ec140405a97d8a"
-  integrity sha512-nYTkZUVTu4nhP199UoORePsql0l+wj7v/oyQjtThUVhJl1U+6qHuoVhIvR3bf7eVKjbCK+Cs2AWd7mi9Mpz9rA==
+"@vue/babel-plugin-jsx@1.5.0", "@vue/babel-plugin-jsx@^1.4.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.5.0.tgz#1b988b497cb1f79725da94463e75cebe60b72e70"
+  integrity sha512-mneBhw1oOqCd2247O0Yw/mRwC9jIGACAJUlawkmMBiNmL4dGA2eMzuNZVNqOUfYTa6vqmND4CtOPzmEEEqLKFw==
   dependencies:
-    "@babel/helper-module-imports" "~7.22.15"
-    "@babel/helper-plugin-utils" "^7.22.5"
-    "@babel/plugin-syntax-jsx" "^7.23.3"
-    "@babel/template" "^7.23.9"
-    "@babel/traverse" "^7.23.9"
-    "@babel/types" "^7.23.9"
-    "@vue/babel-helper-vue-transform-on" "1.2.2"
-    "@vue/babel-plugin-resolve-type" "1.2.2"
-    camelcase "^6.3.0"
-    html-tags "^3.3.1"
-    svg-tags "^1.0.0"
+    "@babel/helper-module-imports" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/plugin-syntax-jsx" "^7.27.1"
+    "@babel/template" "^7.27.2"
+    "@babel/traverse" "^7.28.0"
+    "@babel/types" "^7.28.2"
+    "@vue/babel-helper-vue-transform-on" "1.5.0"
+    "@vue/babel-plugin-resolve-type" "1.5.0"
+    "@vue/shared" "^3.5.18"
 
-"@vue/babel-plugin-resolve-type@1.2.2":
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-resolve-type/-/babel-plugin-resolve-type-1.2.2.tgz#66844898561da6449e0f4a261b0c875118e0707b"
-  integrity sha512-EntyroPwNg5IPVdUJupqs0CFzuf6lUrVvCspmv2J1FITLeGnUCuoGNNk78dgCusxEiYj6RMkTJflGSxk5aIC4A==
+"@vue/babel-plugin-resolve-type@1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-resolve-type/-/babel-plugin-resolve-type-1.5.0.tgz#6881d7b1478e9fc0ea4bb08aaad1f4d206655568"
+  integrity sha512-Wm/60o+53JwJODm4Knz47dxJnLDJ9FnKnGZJbUUf8nQRAtt6P+undLUAVU3Ha33LxOJe6IPoifRQ6F/0RrU31w==
   dependencies:
-    "@babel/code-frame" "^7.23.5"
-    "@babel/helper-module-imports" "~7.22.15"
-    "@babel/helper-plugin-utils" "^7.22.5"
-    "@babel/parser" "^7.23.9"
-    "@vue/compiler-sfc" "^3.4.15"
+    "@babel/code-frame" "^7.27.1"
+    "@babel/helper-module-imports" "^7.27.1"
+    "@babel/helper-plugin-utils" "^7.27.1"
+    "@babel/parser" "^7.28.0"
+    "@vue/compiler-sfc" "^3.5.18"
 
-"@vue/compiler-core@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.45.tgz#d9311207d96f6ebd5f4660be129fb99f01ddb41b"
-  integrity sha512-rcMj7H+PYe5wBV3iYeUgbCglC+pbpN8hBLTJvRiK2eKQiWqu+fG9F+8sW99JdL4LQi7Re178UOxn09puSXvn4A==
+"@vue/compiler-core@3.5.19":
+  version "3.5.19"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.5.19.tgz#f141d35b61b55ce72c3cbb4dc9eeca3821d451aa"
+  integrity sha512-/afpyvlkrSNYbPo94Qu8GtIOWS+g5TRdOvs6XZNw6pWQQmj5pBgSZvEPOIZlqWq0YvoUhDDQaQ2TnzuJdOV4hA==
   dependencies:
-    "@babel/parser" "^7.16.4"
-    "@vue/shared" "3.2.45"
-    estree-walker "^2.0.2"
-    source-map "^0.6.1"
-
-"@vue/compiler-core@3.4.15":
-  version "3.4.15"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.4.15.tgz#be20d1bbe19626052500b48969302cb6f396d36e"
-  integrity sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==
-  dependencies:
-    "@babel/parser" "^7.23.6"
-    "@vue/shared" "3.4.15"
+    "@babel/parser" "^7.28.3"
+    "@vue/shared" "3.5.19"
     entities "^4.5.0"
     estree-walker "^2.0.2"
-    source-map-js "^1.0.2"
+    source-map-js "^1.2.1"
 
-"@vue/compiler-dom@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.45.tgz#c43cc15e50da62ecc16a42f2622d25dc5fd97dce"
-  integrity sha512-tyYeUEuKqqZO137WrZkpwfPCdiiIeXYCcJ8L4gWz9vqaxzIQRccTSwSWZ/Axx5YR2z+LvpUbmPNXxuBU45lyRw==
+"@vue/compiler-core@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.5.22.tgz#bb8294a0dd31df540563cc6ffa0456f1f7687b97"
+  integrity sha512-jQ0pFPmZwTEiRNSb+i9Ow/I/cHv2tXYqsnHKKyCQ08irI2kdF5qmYedmF8si8mA7zepUFmJ2hqzS8CQmNOWOkQ==
   dependencies:
-    "@vue/compiler-core" "3.2.45"
-    "@vue/shared" "3.2.45"
-
-"@vue/compiler-dom@3.4.15":
-  version "3.4.15"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.4.15.tgz#753f5ed55f78d33dff04701fad4d76ff0cf81ee5"
-  integrity sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==
-  dependencies:
-    "@vue/compiler-core" "3.4.15"
-    "@vue/shared" "3.4.15"
-
-"@vue/compiler-sfc@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.45.tgz#7f7989cc04ec9e7c55acd406827a2c4e96872c70"
-  integrity sha512-1jXDuWah1ggsnSAOGsec8cFjT/K6TMZ0sPL3o3d84Ft2AYZi2jWJgRMjw4iaK0rBfA89L5gw427H4n1RZQBu6Q==
-  dependencies:
-    "@babel/parser" "^7.16.4"
-    "@vue/compiler-core" "3.2.45"
-    "@vue/compiler-dom" "3.2.45"
-    "@vue/compiler-ssr" "3.2.45"
-    "@vue/reactivity-transform" "3.2.45"
-    "@vue/shared" "3.2.45"
+    "@babel/parser" "^7.28.4"
+    "@vue/shared" "3.5.22"
+    entities "^4.5.0"
     estree-walker "^2.0.2"
-    magic-string "^0.25.7"
-    postcss "^8.1.10"
-    source-map "^0.6.1"
+    source-map-js "^1.2.1"
 
-"@vue/compiler-sfc@^3.4.15":
-  version "3.4.15"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.4.15.tgz#4e5811e681955fcec886cebbec483f6ae463a64b"
-  integrity sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==
+"@vue/compiler-dom@3.5.19":
+  version "3.5.19"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.5.19.tgz#fc57d9dca4987df67d6ce64dbddaac6d73f1a6ef"
+  integrity sha512-Drs6rPHQZx/pN9S6ml3Z3K/TWCIRPvzG2B/o5kFK9X0MNHt8/E+38tiRfojufrYBfA6FQUFB2qBBRXlcSXWtOA==
   dependencies:
-    "@babel/parser" "^7.23.6"
-    "@vue/compiler-core" "3.4.15"
-    "@vue/compiler-dom" "3.4.15"
-    "@vue/compiler-ssr" "3.4.15"
-    "@vue/shared" "3.4.15"
+    "@vue/compiler-core" "3.5.19"
+    "@vue/shared" "3.5.19"
+
+"@vue/compiler-dom@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.5.22.tgz#6c9c2c9843520f6d3dbc685e5d0e1e12a2c04c56"
+  integrity sha512-W8RknzUM1BLkypvdz10OVsGxnMAuSIZs9Wdx1vzA3mL5fNMN15rhrSCLiTm6blWeACwUwizzPVqGJgOGBEN/hA==
+  dependencies:
+    "@vue/compiler-core" "3.5.22"
+    "@vue/shared" "3.5.22"
+
+"@vue/compiler-sfc@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.5.22.tgz#663a8483b1dda8de83b6fa1aab38a52bf73dd965"
+  integrity sha512-tbTR1zKGce4Lj+JLzFXDq36K4vcSZbJ1RBu8FxcDv1IGRz//Dh2EBqksyGVypz3kXpshIfWKGOCcqpSbyGWRJQ==
+  dependencies:
+    "@babel/parser" "^7.28.4"
+    "@vue/compiler-core" "3.5.22"
+    "@vue/compiler-dom" "3.5.22"
+    "@vue/compiler-ssr" "3.5.22"
+    "@vue/shared" "3.5.22"
     estree-walker "^2.0.2"
-    magic-string "^0.30.5"
-    postcss "^8.4.33"
-    source-map-js "^1.0.2"
+    magic-string "^0.30.19"
+    postcss "^8.5.6"
+    source-map-js "^1.2.1"
 
-"@vue/compiler-ssr@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.2.45.tgz#bd20604b6e64ea15344d5b6278c4141191c983b2"
-  integrity sha512-6BRaggEGqhWht3lt24CrIbQSRD5O07MTmd+LjAn5fJj568+R9eUD2F7wMQJjX859seSlrYog7sUtrZSd7feqrQ==
+"@vue/compiler-sfc@^3.5.18":
+  version "3.5.19"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.5.19.tgz#7f9792ad7de5d4be9b6a32129c75e1f6cd4da015"
+  integrity sha512-YWCm1CYaJ+2RvNmhCwI7t3I3nU+hOrWGWMsn+Z/kmm1jy5iinnVtlmkiZwbLlbV1SRizX7vHsc0/bG5dj0zRTg==
   dependencies:
-    "@vue/compiler-dom" "3.2.45"
-    "@vue/shared" "3.2.45"
-
-"@vue/compiler-ssr@3.4.15":
-  version "3.4.15"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.4.15.tgz#a910a5b89ba4f0a776e40b63d69bdae2f50616cf"
-  integrity sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==
-  dependencies:
-    "@vue/compiler-dom" "3.4.15"
-    "@vue/shared" "3.4.15"
-
-"@vue/devtools-api@^6.0.0-beta.11":
-  version "6.1.3"
-  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.1.3.tgz#a44c52e8fa6d22f84db3abdcdd0be5135b7dd7cf"
-  integrity sha512-79InfO2xHv+WHIrH1bHXQUiQD/wMls9qBk6WVwGCbdwP7/3zINtvqPNMtmSHXsIKjvUAHc8L0ouOj6ZQQRmcXg==
-
-"@vue/devtools-api@^6.2.1":
-  version "6.2.1"
-  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.2.1.tgz#6f2948ff002ec46df01420dfeff91de16c5b4092"
-  integrity sha512-OEgAMeQXvCoJ+1x8WyQuVZzFo0wcyCmUR3baRVLmKBo1LmYZWMlRiXlux5jd0fqVJu6PfDbOrZItVqUEzLobeQ==
-
-"@vue/devtools-api@^6.4.5":
-  version "6.4.5"
-  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.4.5.tgz#d54e844c1adbb1e677c81c665ecef1a2b4bb8380"
-  integrity sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ==
-
-"@vue/reactivity-transform@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.2.45.tgz#07ac83b8138550c83dfb50db43cde1e0e5e8124d"
-  integrity sha512-BHVmzYAvM7vcU5WmuYqXpwaBHjsS8T63jlKGWVtHxAHIoMIlmaMyurUSEs1Zcg46M4AYT5MtB1U274/2aNzjJQ==
-  dependencies:
-    "@babel/parser" "^7.16.4"
-    "@vue/compiler-core" "3.2.45"
-    "@vue/shared" "3.2.45"
+    "@babel/parser" "^7.28.3"
+    "@vue/compiler-core" "3.5.19"
+    "@vue/compiler-dom" "3.5.19"
+    "@vue/compiler-ssr" "3.5.19"
+    "@vue/shared" "3.5.19"
     estree-walker "^2.0.2"
-    magic-string "^0.25.7"
+    magic-string "^0.30.17"
+    postcss "^8.5.6"
+    source-map-js "^1.2.1"
 
-"@vue/reactivity@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.45.tgz#412a45b574de601be5a4a5d9a8cbd4dee4662ff0"
-  integrity sha512-PRvhCcQcyEVohW0P8iQ7HDcIOXRjZfAsOds3N99X/Dzewy8TVhTCT4uXpAHfoKjVTJRA0O0K+6QNkDIZAxNi3A==
+"@vue/compiler-ssr@3.5.19":
+  version "3.5.19"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.5.19.tgz#1719e7fda6d54f5696ca63d4d40281668c0e601c"
+  integrity sha512-/wx0VZtkWOPdiQLWPeQeqpHWR/LuNC7bHfSX7OayBTtUy8wur6vT6EQIX6Et86aED6J+y8tTw43qo2uoqGg5sw==
   dependencies:
-    "@vue/shared" "3.2.45"
+    "@vue/compiler-dom" "3.5.19"
+    "@vue/shared" "3.5.19"
 
-"@vue/runtime-core@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.45.tgz#7ad7ef9b2519d41062a30c6fa001ec43ac549c7f"
-  integrity sha512-gzJiTA3f74cgARptqzYswmoQx0fIA+gGYBfokYVhF8YSXjWTUA2SngRzZRku2HbGbjzB6LBYSbKGIaK8IW+s0A==
+"@vue/compiler-ssr@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.5.22.tgz#a0ef16e364731b25e79a13470569066af101320f"
+  integrity sha512-GdgyLvg4R+7T8Nk2Mlighx7XGxq/fJf9jaVofc3IL0EPesTE86cP/8DD1lT3h1JeZr2ySBvyqKQJgbS54IX1Ww==
   dependencies:
-    "@vue/reactivity" "3.2.45"
-    "@vue/shared" "3.2.45"
+    "@vue/compiler-dom" "3.5.22"
+    "@vue/shared" "3.5.22"
 
-"@vue/runtime-dom@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.2.45.tgz#1a2ef6ee2ad876206fbbe2a884554bba2d0faf59"
-  integrity sha512-cy88YpfP5Ue2bDBbj75Cb4bIEZUMM/mAkDMfqDTpUYVgTf/kuQ2VQ8LebuZ8k6EudgH8pYhsGWHlY0lcxlvTwA==
+"@vue/devtools-api@^6.0.0-beta.11", "@vue/devtools-api@^6.5.0", "@vue/devtools-api@^6.6.4":
+  version "6.6.4"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz#cbe97fe0162b365edc1dba80e173f90492535343"
+  integrity sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==
+
+"@vue/devtools-api@^7.7.2":
+  version "7.7.7"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-7.7.7.tgz#5ef5f55f60396220725a273548c0d7ee983d5d34"
+  integrity sha512-lwOnNBH2e7x1fIIbVT7yF5D+YWhqELm55/4ZKf45R9T8r9dE2AIOy8HKjfqzGsoTHFbWbr337O4E0A0QADnjBg==
   dependencies:
-    "@vue/runtime-core" "3.2.45"
-    "@vue/shared" "3.2.45"
-    csstype "^2.6.8"
+    "@vue/devtools-kit" "^7.7.7"
 
-"@vue/server-renderer@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.2.45.tgz#ca9306a0c12b0530a1a250e44f4a0abac6b81f3f"
-  integrity sha512-ebiMq7q24WBU1D6uhPK//2OTR1iRIyxjF5iVq/1a5I1SDMDyDu4Ts6fJaMnjrvD3MqnaiFkKQj+LKAgz5WIK3g==
+"@vue/devtools-kit@^7.7.7":
+  version "7.7.7"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-kit/-/devtools-kit-7.7.7.tgz#41a64f9526e9363331c72405544df020ce2e3641"
+  integrity sha512-wgoZtxcTta65cnZ1Q6MbAfePVFxfM+gq0saaeytoph7nEa7yMXoi6sCPy4ufO111B9msnw0VOWjPEFCXuAKRHA==
   dependencies:
-    "@vue/compiler-ssr" "3.2.45"
-    "@vue/shared" "3.2.45"
+    "@vue/devtools-shared" "^7.7.7"
+    birpc "^2.3.0"
+    hookable "^5.5.3"
+    mitt "^3.0.1"
+    perfect-debounce "^1.0.0"
+    speakingurl "^14.0.1"
+    superjson "^2.2.2"
 
-"@vue/shared@3.2.45":
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.45.tgz#a3fffa7489eafff38d984e23d0236e230c818bc2"
-  integrity sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==
-
-"@vue/shared@3.4.15":
-  version "3.4.15"
-  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.4.15.tgz#e7d2ea050c667480cb5e1a6df2ac13bcd03a8f30"
-  integrity sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g==
-
-"@vue/test-utils@2.2.8":
-  version "2.2.8"
-  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.2.8.tgz#2002a2b2c90309f66c5c175b735621438832a610"
-  integrity sha512-/R8DKzp41Ip/RqTt1jvOVi5gxby3EwNWiYHNYsG9FAjEvt0gzDvYN55lCKzX7IdnI5zVIOo5tHtts0SLT+JrWw==
+"@vue/devtools-shared@^7.7.7":
+  version "7.7.7"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-shared/-/devtools-shared-7.7.7.tgz#ff14aa8c1262ebac8c0397d3b09f767cd489750c"
+  integrity sha512-+udSj47aRl5aKb0memBvcUG9koarqnxNM5yjuREvqwK6T3ap4mn3Zqqc17QrBFTqSMjr3HK1cvStEZpMDpfdyw==
   dependencies:
-    js-beautify "1.14.6"
+    rfdc "^1.4.1"
+
+"@vue/reactivity@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.5.22.tgz#9b26f8557c96df46c9a859914a2229f3ca5b8f4f"
+  integrity sha512-f2Wux4v/Z2pqc9+4SmgZC1p73Z53fyD90NFWXiX9AKVnVBEvLFOWCEgJD3GdGnlxPZt01PSlfmLqbLYzY/Fw4A==
+  dependencies:
+    "@vue/shared" "3.5.22"
+
+"@vue/runtime-core@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.5.22.tgz#e004c1e35f423555a0e4c10646ef3e9d380643d1"
+  integrity sha512-EHo4W/eiYeAzRTN5PCextDUZ0dMs9I8mQ2Fy+OkzvRPUYQEyK9yAjbasrMCXbLNhF7P0OUyivLjIy0yc6VrLJQ==
+  dependencies:
+    "@vue/reactivity" "3.5.22"
+    "@vue/shared" "3.5.22"
+
+"@vue/runtime-dom@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.5.22.tgz#01276cea7cb9ac2b9aba046adfb5903b494e2e7e"
+  integrity sha512-Av60jsryAkI023PlN7LsqrfPvwfxOd2yAwtReCjeuugTJTkgrksYJJstg1e12qle0NarkfhfFu1ox2D+cQotww==
+  dependencies:
+    "@vue/reactivity" "3.5.22"
+    "@vue/runtime-core" "3.5.22"
+    "@vue/shared" "3.5.22"
+    csstype "^3.1.3"
+
+"@vue/server-renderer@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.5.22.tgz#d134e3409094044bd066d9803714677457756157"
+  integrity sha512-gXjo+ao0oHYTSswF+a3KRHZ1WszxIqO7u6XwNHqcqb9JfyIL/pbWrrh/xLv7jeDqla9u+LK7yfZKHih1e1RKAQ==
+  dependencies:
+    "@vue/compiler-ssr" "3.5.22"
+    "@vue/shared" "3.5.22"
+
+"@vue/shared@3.5.19", "@vue/shared@^3.5.18":
+  version "3.5.19"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.5.19.tgz#5301967a910cb62145e4f17131f3bee88b463c83"
+  integrity sha512-IhXCOn08wgKrLQxRFKKlSacWg4Goi1BolrdEeLYn6tgHjJNXVrWJ5nzoxZqNwl5p88aLlQ8LOaoMa3AYvaKJ/Q==
+
+"@vue/shared@3.5.22":
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.5.22.tgz#9d56a1644a3becb8af1e34655928b0e288d827f8"
+  integrity sha512-F4yc6palwq3TT0u+FYf0Ns4Tfl9GRFURDN2gWG7L1ecIaS/4fCIuFOjMTnCyjsu/OK6vaDKLCrGAa+KvvH+h4w==
+
+"@vue/test-utils@2.4.6":
+  version "2.4.6"
+  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.4.6.tgz#7d534e70c4319d2a587d6a3b45a39e9695ade03c"
+  integrity sha512-FMxEjOpYNYiFe0GkaHsnJPXFHxQ6m4t8vI/ElPGpMWxZKpmRvQ33OIrvRXemy6yha03RxhOlQuy+gZMC3CQSow==
+  dependencies:
+    js-beautify "^1.14.9"
+    vue-component-type-helpers "^2.0.0"
 
 "@vuelidate/core@2.0.3":
   version "2.0.3"
@@ -2494,220 +2521,45 @@
   dependencies:
     vue-demi "^0.13.11"
 
-"@webassemblyjs/ast@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.11.1.tgz#2bfd767eae1a6996f432ff7e8d7fc75679c0b6a7"
-  integrity sha512-ukBh14qFLjxTQNTXocdyksN5QdM28S1CxHt2rdskFyL+xFV7VremuBLVbmCePj+URalXBENx/9Lm7lnhihtCSw==
+"@web3-storage/parse-link-header@^3.1.0":
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/@web3-storage/parse-link-header/-/parse-link-header-3.1.0.tgz#4562724987649dd6d3e07c87be1826804d212ef7"
+  integrity sha512-K1undnK70vLLauqdE8bq/l98isTF2FDhcP0UPpXVSjkSWe3xhAn5eRXk5jfA1E5ycNm84Ws/rQFUD7ue11nciw==
+
+abbrev@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-2.0.0.tgz#cf59829b8b4f03f89dda2771cb7f3653828c89bf"
+  integrity sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ==
+
+accepts@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/accepts/-/accepts-2.0.0.tgz#bbcf4ba5075467f3f2131eab3cffc73c2f5d7895"
+  integrity sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==
   dependencies:
-    "@webassemblyjs/helper-numbers" "1.11.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.11.1"
+    mime-types "^3.0.0"
+    negotiator "^1.0.0"
 
-"@webassemblyjs/floating-point-hex-parser@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.11.1.tgz#f6c61a705f0fd7a6aecaa4e8198f23d9dc179e4f"
-  integrity sha512-iGRfyc5Bq+NnNuX8b5hwBrRjzf0ocrJPI6GWFodBFzmFnyvrQ83SHKhmilCU/8Jv67i4GJZBMhEzltxzcNagtQ==
-
-"@webassemblyjs/helper-api-error@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.11.1.tgz#1a63192d8788e5c012800ba6a7a46c705288fd16"
-  integrity sha512-RlhS8CBCXfRUR/cwo2ho9bkheSXG0+NwooXcc3PAILALf2QLdFyj7KGsKRbVc95hZnhnERon4kW/D3SZpp6Tcg==
-
-"@webassemblyjs/helper-buffer@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.11.1.tgz#832a900eb444884cde9a7cad467f81500f5e5ab5"
-  integrity sha512-gwikF65aDNeeXa8JxXa2BAk+REjSyhrNC9ZwdT0f8jc4dQQeDQ7G4m0f2QCLPJiMTTO6wfDmRmj/pW0PsUvIcA==
-
-"@webassemblyjs/helper-numbers@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-numbers/-/helper-numbers-1.11.1.tgz#64d81da219fbbba1e3bd1bfc74f6e8c4e10a62ae"
-  integrity sha512-vDkbxiB8zfnPdNK9Rajcey5C0w+QJugEglN0of+kmO8l7lDb77AnlKYQF7aarZuCrv+l0UvqL+68gSDr3k9LPQ==
-  dependencies:
-    "@webassemblyjs/floating-point-hex-parser" "1.11.1"
-    "@webassemblyjs/helper-api-error" "1.11.1"
-    "@xtuc/long" "4.2.2"
-
-"@webassemblyjs/helper-wasm-bytecode@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.11.1.tgz#f328241e41e7b199d0b20c18e88429c4433295e1"
-  integrity sha512-PvpoOGiJwXeTrSf/qfudJhwlvDQxFgelbMqtq52WWiXC6Xgg1IREdngmPN3bs4RoO83PnL/nFrxucXj1+BX62Q==
-
-"@webassemblyjs/helper-wasm-section@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.11.1.tgz#21ee065a7b635f319e738f0dd73bfbda281c097a"
-  integrity sha512-10P9No29rYX1j7F3EVPX3JvGPQPae+AomuSTPiF9eBQeChHI6iqjMIwR9JmOJXwpnn/oVGDk7I5IlskuMwU/pg==
-  dependencies:
-    "@webassemblyjs/ast" "1.11.1"
-    "@webassemblyjs/helper-buffer" "1.11.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.11.1"
-    "@webassemblyjs/wasm-gen" "1.11.1"
-
-"@webassemblyjs/ieee754@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.11.1.tgz#963929e9bbd05709e7e12243a099180812992614"
-  integrity sha512-hJ87QIPtAMKbFq6CGTkZYJivEwZDbQUgYd3qKSadTNOhVY7p+gfP6Sr0lLRVTaG1JjFj+r3YchoqRYxNH3M0GQ==
-  dependencies:
-    "@xtuc/ieee754" "^1.2.0"
-
-"@webassemblyjs/leb128@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.11.1.tgz#ce814b45574e93d76bae1fb2644ab9cdd9527aa5"
-  integrity sha512-BJ2P0hNZ0u+Th1YZXJpzW6miwqQUGcIHT1G/sf72gLVD9DZ5AdYTqPNbHZh6K1M5VmKvFXwGSWZADz+qBWxeRw==
-  dependencies:
-    "@xtuc/long" "4.2.2"
-
-"@webassemblyjs/utf8@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.11.1.tgz#d1f8b764369e7c6e6bae350e854dec9a59f0a3ff"
-  integrity sha512-9kqcxAEdMhiwQkHpkNiorZzqpGrodQQ2IGrHHxCy+Ozng0ofyMA0lTqiLkVs1uzTRejX+/O0EOT7KxqVPuXosQ==
-
-"@webassemblyjs/wasm-edit@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.11.1.tgz#ad206ebf4bf95a058ce9880a8c092c5dec8193d6"
-  integrity sha512-g+RsupUC1aTHfR8CDgnsVRVZFJqdkFHpsHMfJuWQzWU3tvnLC07UqHICfP+4XyL2tnr1amvl1Sdp06TnYCmVkA==
-  dependencies:
-    "@webassemblyjs/ast" "1.11.1"
-    "@webassemblyjs/helper-buffer" "1.11.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.11.1"
-    "@webassemblyjs/helper-wasm-section" "1.11.1"
-    "@webassemblyjs/wasm-gen" "1.11.1"
-    "@webassemblyjs/wasm-opt" "1.11.1"
-    "@webassemblyjs/wasm-parser" "1.11.1"
-    "@webassemblyjs/wast-printer" "1.11.1"
-
-"@webassemblyjs/wasm-gen@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.11.1.tgz#86c5ea304849759b7d88c47a32f4f039ae3c8f76"
-  integrity sha512-F7QqKXwwNlMmsulj6+O7r4mmtAlCWfO/0HdgOxSklZfQcDu0TpLiD1mRt/zF25Bk59FIjEuGAIyn5ei4yMfLhA==
-  dependencies:
-    "@webassemblyjs/ast" "1.11.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.11.1"
-    "@webassemblyjs/ieee754" "1.11.1"
-    "@webassemblyjs/leb128" "1.11.1"
-    "@webassemblyjs/utf8" "1.11.1"
-
-"@webassemblyjs/wasm-opt@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.11.1.tgz#657b4c2202f4cf3b345f8a4c6461c8c2418985f2"
-  integrity sha512-VqnkNqnZlU5EB64pp1l7hdm3hmQw7Vgqa0KF/KCNO9sIpI6Fk6brDEiX+iCOYrvMuBWDws0NkTOxYEb85XQHHw==
-  dependencies:
-    "@webassemblyjs/ast" "1.11.1"
-    "@webassemblyjs/helper-buffer" "1.11.1"
-    "@webassemblyjs/wasm-gen" "1.11.1"
-    "@webassemblyjs/wasm-parser" "1.11.1"
-
-"@webassemblyjs/wasm-parser@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.11.1.tgz#86ca734534f417e9bd3c67c7a1c75d8be41fb199"
-  integrity sha512-rrBujw+dJu32gYB7/Lup6UhdkPx9S9SnobZzRVL7VcBH9Bt9bCBLEuX/YXOOtBsOZ4NQrRykKhffRWHvigQvOA==
-  dependencies:
-    "@webassemblyjs/ast" "1.11.1"
-    "@webassemblyjs/helper-api-error" "1.11.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.11.1"
-    "@webassemblyjs/ieee754" "1.11.1"
-    "@webassemblyjs/leb128" "1.11.1"
-    "@webassemblyjs/utf8" "1.11.1"
-
-"@webassemblyjs/wast-printer@1.11.1":
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.11.1.tgz#d0c73beda8eec5426f10ae8ef55cee5e7084c2f0"
-  integrity sha512-IQboUWM4eKzWW+N/jij2sRatKMh99QEelo3Eb2q0qXkvPRISAj8Qxtmw5itwqK+TTkBuUIE45AxYPToqPtL5gg==
-  dependencies:
-    "@webassemblyjs/ast" "1.11.1"
-    "@xtuc/long" "4.2.2"
-
-"@xtuc/ieee754@^1.2.0":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@xtuc/ieee754/-/ieee754-1.2.0.tgz#eef014a3145ae477a1cbc00cd1e552336dceb790"
-
-"@xtuc/long@4.2.2":
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/@xtuc/long/-/long-4.2.2.tgz#d291c6a4e97989b5c61d9acf396ae4fe133a718d"
-
-abab@^2.0.5, abab@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.6.tgz#41b80f2c871d19686216b82309231cfd3cb3d291"
-  integrity sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==
-
-abbrev@^1.0.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
-  integrity sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==
-
-accepts@~1.3.4:
-  version "1.3.7"
-  resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.7.tgz#531bc726517a3b2b41f850021c6cc15eaab507cd"
-  dependencies:
-    mime-types "~2.1.24"
-    negotiator "0.6.2"
-
-accepts@~1.3.8:
-  version "1.3.8"
-  resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.8.tgz#0bf0be125b67014adcb0b0921e62db7bffe16b2e"
-  integrity sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==
-  dependencies:
-    mime-types "~2.1.34"
-    negotiator "0.6.3"
-
-acorn-globals@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/acorn-globals/-/acorn-globals-6.0.0.tgz#46cdd39f0f8ff08a876619b55f5ac8a6dc770b45"
-  integrity sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg==
-  dependencies:
-    acorn "^7.1.1"
-    acorn-walk "^7.1.1"
-
-acorn-import-assertions@^1.7.6:
-  version "1.8.0"
-  resolved "https://registry.yarnpkg.com/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz#ba2b5939ce62c238db6d93d81c9b111b29b855e9"
-  integrity sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==
-
-acorn-jsx@^5.2.0, acorn-jsx@^5.3.2:
+acorn-jsx@^5.3.2:
   version "5.3.2"
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-acorn-walk@^7.1.1:
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc"
-  integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==
+acorn@^8.14.0:
+  version "8.14.1"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.14.1.tgz#721d5dc10f7d5b5609a891773d47731796935dfb"
+  integrity sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==
 
-acorn@^7.1.1, acorn@^7.4.1:
-  version "7.4.1"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
-  integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
+acorn@^8.15.0:
+  version "8.15.0"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.15.0.tgz#a360898bc415edaac46c8241f6383975b930b816"
+  integrity sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==
 
-acorn@^8.5.0, acorn@^8.7.1, acorn@^8.8.0:
-  version "8.8.0"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.0.tgz#88c0187620435c7f6015803f5539dae05a9dbea8"
-  integrity sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==
+agent-base@^7.1.0, agent-base@^7.1.2:
+  version "7.1.3"
+  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-7.1.3.tgz#29435eb821bc4194633a5b89e5bc4703bafc25a1"
+  integrity sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==
 
-agent-base@6:
-  version "6.0.2"
-  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-6.0.2.tgz#49fff58577cfee3f37176feab4c22e00f86d7f77"
-  integrity sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==
-  dependencies:
-    debug "4"
-
-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.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.10.0, ajv@^6.12.4, ajv@^6.12.5:
+ajv@^6.12.4:
   version "6.12.6"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
   integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==
@@ -2717,15 +2569,15 @@ ajv@^6.10.0, 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.0.1, ajv@^8.8.0:
-  version "8.11.0"
-  resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.11.0.tgz#977e91dd96ca669f54a11e23e378e33b884a565f"
-  integrity sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg==
+ajv@^8.0.1:
+  version "8.17.1"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.17.1.tgz#37d9a5c776af6bc92d7f4f9510eba4c0a60d11a6"
+  integrity sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==
   dependencies:
-    fast-deep-equal "^3.1.1"
+    fast-deep-equal "^3.1.3"
+    fast-uri "^3.0.1"
     json-schema-traverse "^1.0.0"
     require-from-string "^2.0.2"
-    uri-js "^4.2.2"
 
 ansi-align@^3.0.0:
   version "3.0.1"
@@ -2739,61 +2591,51 @@ ansi-colors@4.1.1:
   resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-4.1.1.tgz#cbb9ae256bf750af1eab344f229aa27fe94ba348"
   integrity sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA==
 
-ansi-colors@^3.0.0:
-  version "3.2.4"
-  resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf"
-
-ansi-html-community@0.0.8:
-  version "0.0.8"
-  resolved "https://registry.yarnpkg.com/ansi-html-community/-/ansi-html-community-0.0.8.tgz#69fbc4d6ccbe383f9736934ae34c3f8290f1bf41"
-  integrity sha512-1APHAyr3+PCamwNw3bXCPp4HFLONZt/yIH0sZp0/469KWNTEy+qN5jQ3GVX6DMZ1UXAi34yVwtTeaG/HpBuuzw==
-
-ansi-regex@^2.0.0:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
-
-ansi-regex@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-3.0.0.tgz#ed0317c322064f79466c02966bddb605ab37d998"
+ansi-escapes@^4.3.2:
+  version "4.3.2"
+  resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-4.3.2.tgz#6b2291d1db7d98b6521d5f1efa42d0f3a9feb65e"
+  integrity sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==
+  dependencies:
+    type-fest "^0.21.3"
 
 ansi-regex@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-4.1.0.tgz#8b9f8f08cf1acb843756a839ca8c7e3168c51997"
-
-ansi-regex@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.0.tgz#388539f55179bf39339c81af30a654d69f87cb75"
-  integrity sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-4.1.1.tgz#164daac87ab2d6f6db3a29875e2d1766582dabed"
+  integrity sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==
 
 ansi-regex@^5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.1.tgz#082cb2c89c9fe8659a311a53bd6a4dc5301db304"
   integrity sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==
 
-ansi-styles@^2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
+ansi-regex@^6.0.1:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-6.1.0.tgz#95ec409c69619d6cb1b8b34f14b660ef28ebd654"
+  integrity sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==
 
 ansi-styles@^3.2.1:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
+  integrity sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==
   dependencies:
     color-convert "^1.9.0"
 
-ansi-styles@^4.0.0:
+ansi-styles@^4.0.0, ansi-styles@^4.1.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-4.3.0.tgz#edd803628ae71c04c85ae7a0906edad34b648937"
   integrity sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==
   dependencies:
     color-convert "^2.0.1"
 
-ansi-styles@^4.1.0:
-  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-4.2.1.tgz#90ae75c424d008d2624c5bf29ead3177ebfcf359"
-  integrity sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==
-  dependencies:
-    "@types/color-name" "^1.1.1"
-    color-convert "^2.0.1"
+ansi-styles@^5.0.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-5.2.0.tgz#07449690ad45777d1924ac2abb2fc8895dba836b"
+  integrity sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==
+
+ansi-styles@^6.1.0:
+  version "6.2.1"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-6.2.1.tgz#0e62320cf99c21afff3b3012192546aacbfb05c5"
+  integrity sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==
 
 ansi-to-html@0.7.2:
   version "0.7.2"
@@ -2803,122 +2645,220 @@ ansi-to-html@0.7.2:
     entities "^2.2.0"
 
 anymatch@~3.1.2:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.2.tgz#c0557c096af32f106198f4f4e2a383537e378716"
-  integrity sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e"
+  integrity sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==
   dependencies:
     normalize-path "^3.0.0"
     picomatch "^2.0.4"
 
+archiver-utils@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/archiver-utils/-/archiver-utils-2.1.0.tgz#e8a460e94b693c3e3da182a098ca6285ba9249e2"
+  integrity sha512-bEL/yUb/fNNiNTuUz979Z0Yg5L+LzLxGJz8x79lYmR54fmTIb6ob/hNQgkQnIUDWIFjZVQwl9Xs356I6BAMHfw==
+  dependencies:
+    glob "^7.1.4"
+    graceful-fs "^4.2.0"
+    lazystream "^1.0.0"
+    lodash.defaults "^4.2.0"
+    lodash.difference "^4.5.0"
+    lodash.flatten "^4.4.0"
+    lodash.isplainobject "^4.0.6"
+    lodash.union "^4.6.0"
+    normalize-path "^3.0.0"
+    readable-stream "^2.0.0"
+
+archiver-utils@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/archiver-utils/-/archiver-utils-3.0.4.tgz#a0d201f1cf8fce7af3b5a05aea0a337329e96ec7"
+  integrity sha512-KVgf4XQVrTjhyWmx6cte4RxonPLR9onExufI1jhvw/MQ4BB6IsZD5gT8Lq+u/+pRkWna/6JoHpiQioaqFP5Rzw==
+  dependencies:
+    glob "^7.2.3"
+    graceful-fs "^4.2.0"
+    lazystream "^1.0.0"
+    lodash.defaults "^4.2.0"
+    lodash.difference "^4.5.0"
+    lodash.flatten "^4.4.0"
+    lodash.isplainobject "^4.0.6"
+    lodash.union "^4.6.0"
+    normalize-path "^3.0.0"
+    readable-stream "^3.6.0"
+
+archiver@^5.3.1:
+  version "5.3.2"
+  resolved "https://registry.yarnpkg.com/archiver/-/archiver-5.3.2.tgz#99991d5957e53bd0303a392979276ac4ddccf3b0"
+  integrity sha512-+25nxyyznAXF7Nef3y0EbBeqmGZgeN/BxHX29Rs39djAfaFalmQ89SE6CWyDCHzGL0yt/ycBtNOmGTW0FyGWNw==
+  dependencies:
+    archiver-utils "^2.1.0"
+    async "^3.2.4"
+    buffer-crc32 "^0.2.1"
+    readable-stream "^3.6.0"
+    readdir-glob "^1.1.2"
+    tar-stream "^2.2.0"
+    zip-stream "^4.1.0"
+
 argparse@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-array-flatten@1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/array-flatten/-/array-flatten-1.1.1.tgz#9a5f699051b1e7073328f2a008968b64ea2955d2"
-
-array-includes@^3.1.6:
-  version "3.1.6"
-  resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.6.tgz#9e9e720e194f198266ba9e18c29e6a9b0e4b225f"
-  integrity sha512-sgTbLvL6cNnw24FnbaDyjmvddQ2ML8arZsgaJhoABMoplz/4QRhtrYS+alr1BUM1Bwp6dhx8vVCBSLG+StwOFw==
+aria-query@5.1.3:
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.1.3.tgz#19db27cd101152773631396f7a95a3b58c22c35e"
+  integrity sha512-R5iJ5lkuHybztUfuOAznmboyjWq8O6sqNqtK7CLOqdydi54VNbORp49mb14KbWgG1QD3JFO9hJdZ+y4KutfdOQ==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    es-abstract "^1.20.4"
-    get-intrinsic "^1.1.3"
-    is-string "^1.0.7"
+    deep-equal "^2.0.5"
+
+aria-query@5.3.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.0.tgz#650c569e41ad90b51b3d7df5e5eed1c7549c103e"
+  integrity sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==
+  dependencies:
+    dequal "^2.0.3"
+
+array-buffer-byte-length@^1.0.0, array-buffer-byte-length@^1.0.1, array-buffer-byte-length@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz#384d12a37295aec3769ab022ad323a18a51ccf8b"
+  integrity sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==
+  dependencies:
+    call-bound "^1.0.3"
+    is-array-buffer "^3.0.5"
+
+array-includes@^3.1.9:
+  version "3.1.9"
+  resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.9.tgz#1f0ccaa08e90cdbc3eb433210f903ad0f17c3f3a"
+  integrity sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==
+  dependencies:
+    call-bind "^1.0.8"
+    call-bound "^1.0.4"
+    define-properties "^1.2.1"
+    es-abstract "^1.24.0"
+    es-object-atoms "^1.1.1"
+    get-intrinsic "^1.3.0"
+    is-string "^1.1.1"
+    math-intrinsics "^1.1.0"
 
 array-union@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
   integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==
 
-array.prototype.flat@^1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.3.1.tgz#ffc6576a7ca3efc2f46a143b9d1dda9b4b3cf5e2"
-  integrity sha512-roTU0KWIOmJ4DRLmwKd19Otg0/mT3qPNt0Qb3GWW8iObuZXxrjB/pzn0R3hqpRSWg4HCwqx+0vwOnWnvlOyeIA==
+array.prototype.findlastindex@^1.2.6:
+  version "1.2.6"
+  resolved "https://registry.yarnpkg.com/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.6.tgz#cfa1065c81dcb64e34557c9b81d012f6a421c564"
+  integrity sha512-F/TKATkzseUExPlfvmwQKGITM3DGTK+vkAsCZoDc5daVygbJBnjEUCbgkAvVFsgfXfX4YIqZ/27G3k3tdXrTxQ==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    es-abstract "^1.20.4"
-    es-shim-unscopables "^1.0.0"
+    call-bind "^1.0.8"
+    call-bound "^1.0.4"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.9"
+    es-errors "^1.3.0"
+    es-object-atoms "^1.1.1"
+    es-shim-unscopables "^1.1.0"
 
-array.prototype.flatmap@^1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/array.prototype.flatmap/-/array.prototype.flatmap-1.3.1.tgz#1aae7903c2100433cb8261cd4ed310aab5c4a183"
-  integrity sha512-8UGn9O1FDVvMNB0UlLv4voxRMze7+FpHyF5mSMRjWHUMlpoDViniy05870VlxhfgTnLbpuwTzvD76MTtWxB/mQ==
+array.prototype.flat@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.3.3.tgz#534aaf9e6e8dd79fb6b9a9917f839ef1ec63afe5"
+  integrity sha512-rwG/ja1neyLqCuGZ5YYrznA62D4mZXg0i1cIskIUKSiqF3Cje9/wXAls9B9s1Wa2fomMsIv8czB8jZcPmxCXFg==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    es-abstract "^1.20.4"
-    es-shim-unscopables "^1.0.0"
+    call-bind "^1.0.8"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.5"
+    es-shim-unscopables "^1.0.2"
 
-arrify@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
-  integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=
+array.prototype.flatmap@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/array.prototype.flatmap/-/array.prototype.flatmap-1.3.3.tgz#712cc792ae70370ae40586264629e33aab5dd38b"
+  integrity sha512-Y7Wt51eKJSyi80hFrJCePGGNo5ktJCslFuboqJsbf57CCPcm5zztluPlc4/aD8sWsKvlwatezpV4U1efk8kpjg==
+  dependencies:
+    call-bind "^1.0.8"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.5"
+    es-shim-unscopables "^1.0.2"
 
-assertion-error@1.1.0, assertion-error@^1.1.0:
+arraybuffer.prototype.slice@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz#9d760d84dbdd06d0cbf92c8849615a1a7ab3183c"
+  integrity sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==
+  dependencies:
+    array-buffer-byte-length "^1.0.1"
+    call-bind "^1.0.8"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.5"
+    es-errors "^1.3.0"
+    get-intrinsic "^1.2.6"
+    is-array-buffer "^3.0.4"
+
+assertion-error@1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/assertion-error/-/assertion-error-1.1.0.tgz#e60b6b0e8f301bd97e5375215bda406c85118c0b"
   integrity sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==
 
+assertion-error@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/assertion-error/-/assertion-error-2.0.1.tgz#f641a196b335690b1070bf00b6e7593fec190bf7"
+  integrity sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==
+
+ast-types@^0.13.4:
+  version "0.13.4"
+  resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.13.4.tgz#ee0d77b343263965ecc3fb62da16e7222b2b6782"
+  integrity sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==
+  dependencies:
+    tslib "^2.0.1"
+
 astral-regex@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-2.0.0.tgz#483143c567aeed4785759c0865786dc77d7d2e31"
   integrity sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==
 
-async@^3.2.3:
-  version "3.2.4"
-  resolved "https://registry.yarnpkg.com/async/-/async-3.2.4.tgz#2d22e00f8cddeb5fde5dd33522b56d1cf569a81c"
-  integrity sha512-iAB+JbDEGXhyIUavoDl9WP/Jj106Kz9DEn1DPgYw5ruDn0e3Wgi3sKFm55sASdGBNOQB8F59d9qQ7deqrHA8wQ==
+async-function@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/async-function/-/async-function-1.0.0.tgz#509c9fca60eaf85034c6829838188e4e4c8ffb2b"
+  integrity sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==
+
+async@^3.2.3, async@^3.2.4:
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/async/-/async-3.2.6.tgz#1b0728e14929d51b85b449b7f06e27c1145e38ce"
+  integrity sha512-htCUDlxyyCLMgaM3xXg0C0LW2xqfuQ6p05pCEIsXuyQ+a1koYKTuBMzRNwmybfLgvJDMd0r1LTn4+E0Ti6C2AA==
 
 asynckit@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
   integrity sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==
 
-autoprefixer@10.4.19:
-  version "10.4.19"
-  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.4.19.tgz#ad25a856e82ee9d7898c59583c1afeb3fa65f89f"
-  integrity sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==
+autoprefixer@10.4.21:
+  version "10.4.21"
+  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.4.21.tgz#77189468e7a8ad1d9a37fbc08efc9f480cf0a95d"
+  integrity sha512-O+A6LWV5LDHSJD3LjHYoNi4VLsj/Whi7k6zG12xTYaU4cQ8oxQGckXNX8cRHK5yOZ/ppVHe0ZBXGzSV9jXdVbQ==
   dependencies:
-    browserslist "^4.23.0"
-    caniuse-lite "^1.0.30001599"
+    browserslist "^4.24.4"
+    caniuse-lite "^1.0.30001702"
     fraction.js "^4.3.7"
     normalize-range "^0.1.2"
-    picocolors "^1.0.0"
+    picocolors "^1.1.1"
     postcss-value-parser "^4.2.0"
 
-available-typed-arrays@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz#92f95616501069d07d10edb2fc37d3e1c65123b7"
-  integrity sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==
-
-axe-core@^4.6.1:
-  version "4.6.2"
-  resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.6.2.tgz#6e566ab2a3d29e415f5115bc0fd2597a5eb3e5e3"
-  integrity sha512-b1WlTV8+XKLj9gZy2DZXgQiyDp9xkkoe2a6U6UbYccScq2wgH/YwCeI2/Jq2mgo0HzQxqJOjWZBLeA/mqsk5Mg==
-
-axios@^1.1.3:
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/axios/-/axios-1.2.2.tgz#72681724c6e6a43a9fea860fc558127dbe32f9f1"
-  integrity sha512-bz/J4gS2S3I7mpN/YZfGFTqhXTYzRho8Ay38w2otuuDR322KzFIWm/4W2K6gIwvWaws5n+mnb7D1lN9uD+QH6Q==
+available-typed-arrays@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz#a5cc375d6a03c2efc87a553f3e0b1522def14846"
+  integrity sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==
   dependencies:
-    follow-redirects "^1.15.0"
+    possible-typed-array-names "^1.0.0"
+
+axe-core@^4.9.1:
+  version "4.10.3"
+  resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.10.3.tgz#04145965ac7894faddbac30861e5d8f11bfd14fc"
+  integrity sha512-Xm7bpRXnDSX2YE2YFfBk2FnF0ep6tmG7xPh8iHee8MIcrgq762Nkce856dYtJYLkuIoYZvGfTs/PbZhideTcEg==
+
+axios@^1.7.4:
+  version "1.8.4"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-1.8.4.tgz#78990bb4bc63d2cae072952d374835950a82f447"
+  integrity sha512-eBSYY4Y68NNlHbHBMdeDmKNtDgXWhQsJcGqzO3iLUM0GraQFSS9cVgPX5I9b3lbdFKyYoAEGAZF1DwhTaljNAw==
+  dependencies:
+    follow-redirects "^1.15.6"
     form-data "^4.0.0"
     proxy-from-env "^1.1.0"
 
-babel-loader@9.1.3:
-  version "9.1.3"
-  resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-9.1.3.tgz#3d0e01b4e69760cc694ee306fe16d358aa1c6f9a"
-  integrity sha512-xG3ST4DglodGf8qSwv0MdeWLhrDsw/32QMdTO5T1ZIp9gQur0HkCyFs7Awskr10JKXFXwpAhiCuYX5oGXnRGbw==
-  dependencies:
-    find-cache-dir "^4.0.0"
-    schema-utils "^4.0.0"
-
 babel-plugin-lodash@3.3.4:
   version "3.3.4"
   resolved "https://registry.yarnpkg.com/babel-plugin-lodash/-/babel-plugin-lodash-3.3.4.tgz#4f6844358a1340baed182adbeffa8df9967bc196"
@@ -2930,33 +2870,34 @@ babel-plugin-lodash@3.3.4:
     lodash "^4.17.10"
     require-package-name "^2.0.1"
 
-babel-plugin-polyfill-corejs2@^0.3.3:
-  version "0.3.3"
-  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.3.tgz#5d1bd3836d0a19e1b84bbf2d9640ccb6f951c122"
-  integrity sha512-8hOdmFYFSZhqg2C/JgLUQ+t52o5nirNwaWM2B9LWteozwIvM14VSwdsCAUET10qT+kmySAlseadmfeeSWFCy+Q==
+babel-plugin-polyfill-corejs2@^0.4.14:
+  version "0.4.14"
+  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.14.tgz#8101b82b769c568835611542488d463395c2ef8f"
+  integrity sha512-Co2Y9wX854ts6U8gAAPXfn0GmAyctHuK8n0Yhfjd6t30g7yvKjspvvOo9yG+z52PZRgFErt7Ka2pYnXCjLKEpg==
   dependencies:
-    "@babel/compat-data" "^7.17.7"
-    "@babel/helper-define-polyfill-provider" "^0.3.3"
-    semver "^6.1.1"
+    "@babel/compat-data" "^7.27.7"
+    "@babel/helper-define-polyfill-provider" "^0.6.5"
+    semver "^6.3.1"
 
-babel-plugin-polyfill-corejs3@^0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.6.0.tgz#56ad88237137eade485a71b52f72dbed57c6230a"
-  integrity sha512-+eHqR6OPcBhJOGgsIar7xoAB1GcSwVUA3XjAd7HJNzOXT4wv6/H7KIdA/Nc60cvUlDbKApmqNvD1B1bzOt4nyA==
+babel-plugin-polyfill-corejs3@^0.13.0:
+  version "0.13.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.13.0.tgz#bb7f6aeef7addff17f7602a08a6d19a128c30164"
+  integrity sha512-U+GNwMdSFgzVmfhNm8GJUX88AadB3uo9KpJqS3FaqNIPKgySuvMb+bHPsOmmuWyIcuqZj/pzt1RUIUZns4y2+A==
   dependencies:
-    "@babel/helper-define-polyfill-provider" "^0.3.3"
-    core-js-compat "^3.25.1"
+    "@babel/helper-define-polyfill-provider" "^0.6.5"
+    core-js-compat "^3.43.0"
 
-babel-plugin-polyfill-regenerator@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.1.tgz#390f91c38d90473592ed43351e801a9d3e0fd747"
-  integrity sha512-NtQGmyQDXjQqQ+IzRkBVwEOz9lQ4zxAQZgoAYEtU9dJjnl1Oc98qnN7jcp+bE7O7aYzVpavXE3/VKXNzUbh7aw==
+babel-plugin-polyfill-regenerator@^0.6.5:
+  version "0.6.5"
+  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.6.5.tgz#32752e38ab6f6767b92650347bf26a31b16ae8c5"
+  integrity sha512-ISqQ2frbiNU9vIJkzg7dlPpznPZ4jOiUQ1uSmB0fEHeowtN3COYRsXr/xexn64NpU13P06jc/L5TgiJXOgrbEg==
   dependencies:
-    "@babel/helper-define-polyfill-provider" "^0.3.3"
+    "@babel/helper-define-polyfill-provider" "^0.6.5"
 
 balanced-match@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
+  integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
 
 balanced-match@^2.0.0:
   version "2.0.0"
@@ -2968,21 +2909,22 @@ base64-js@^1.3.1:
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
   integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
 
-base64id@2.0.0, base64id@~2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/base64id/-/base64id-2.0.0.tgz#2770ac6bc47d312af97a8bf9a634342e0cd25cb6"
-  integrity sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==
-
-big.js@^5.2.2:
-  version "5.2.2"
-  resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
+basic-ftp@^5.0.2:
+  version "5.0.5"
+  resolved "https://registry.yarnpkg.com/basic-ftp/-/basic-ftp-5.0.5.tgz#14a474f5fffecca1f4f406f1c26b18f800225ac0"
+  integrity sha512-4Bcg1P8xhUuqcii/S0Z9wiHIrQVPMermM1any+MX5GeGD7faD3/msQUDGLol9wOcz4/jbg/WJnGqoJF6LiBdtg==
 
 binary-extensions@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
-  integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.3.0.tgz#f6e14a97858d327252200242d4ccfe522c445522"
+  integrity sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==
 
-bl@^4.1.0:
+birpc@^2.3.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/birpc/-/birpc-2.4.0.tgz#045368a4a30d659c6c06c9215b11cb384903249c"
+  integrity sha512-5IdNxTyhXHv2UlgnPHQ0h+5ypVmkrYHzL8QT+DwFZ//2N/oNV8Ch+BCRmTJ3x6/z9Axo/cXYBc9eprsUVK/Jsg==
+
+bl@^4.0.3, bl@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/bl/-/bl-4.1.0.tgz#451535264182bec2fbbc83a62ab98cf11d9f7b3a"
   integrity sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==
@@ -2991,39 +2933,20 @@ bl@^4.1.0:
     inherits "^2.0.4"
     readable-stream "^3.4.0"
 
-body-parser@1.20.1:
-  version "1.20.1"
-  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.1.tgz#b1812a8912c195cd371a3ee5e66faa2338a5c668"
-  integrity sha512-jWi7abTbYwajOytWCQc37VulmWiRae5RyTpaCyDcS5/lMdtwSz5lOpDE67srw/HYe35f1z3fDQw+3txg7gNtWw==
+body-parser@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-2.2.0.tgz#f7a9656de305249a715b549b7b8fd1ab9dfddcfa"
+  integrity sha512-02qvAaxv8tp7fBa/mw1ga98OGm+eCbqzJOKoRt70sLmfEEi+jyBYVTDGfCL/k06/4EMk/z01gCe7HoCH/f2LTg==
   dependencies:
-    bytes "3.1.2"
-    content-type "~1.0.4"
-    debug "2.6.9"
-    depd "2.0.0"
-    destroy "1.2.0"
-    http-errors "2.0.0"
-    iconv-lite "0.4.24"
-    on-finished "2.4.1"
-    qs "6.11.0"
-    raw-body "2.5.1"
-    type-is "~1.6.18"
-    unpipe "1.0.0"
-
-body-parser@^1.19.0:
-  version "1.19.2"
-  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.19.2.tgz#4714ccd9c157d44797b8b5607d72c0b89952f26e"
-  integrity sha512-SAAwOxgoCKMGs9uUAUFHygfLAyaniaoun6I8mFY9pRAJL9+Kec34aU+oIjDhTycub1jozEfEwx1W1IuOYxVSFw==
-  dependencies:
-    bytes "3.1.2"
-    content-type "~1.0.4"
-    debug "2.6.9"
-    depd "~1.1.2"
-    http-errors "1.8.1"
-    iconv-lite "0.4.24"
-    on-finished "~2.3.0"
-    qs "6.9.7"
-    raw-body "2.4.3"
-    type-is "~1.6.18"
+    bytes "^3.1.2"
+    content-type "^1.0.5"
+    debug "^4.4.0"
+    http-errors "^2.0.0"
+    iconv-lite "^0.6.3"
+    on-finished "^2.4.1"
+    qs "^6.14.0"
+    raw-body "^3.0.0"
+    type-is "^2.0.0"
 
 body-scroll-lock@3.1.5:
   version "3.1.5"
@@ -3052,6 +2975,7 @@ boxen@5.1.2:
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
+  integrity sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==
   dependencies:
     balanced-match "^1.0.0"
     concat-map "0.0.1"
@@ -3063,71 +2987,57 @@ brace-expansion@^2.0.1:
   dependencies:
     balanced-match "^1.0.0"
 
-braces@^3.0.1, braces@^3.0.2, braces@~3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
-  integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==
+braces@^3.0.3, braces@~3.0.2:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.3.tgz#490332f40919452272d55a8480adc0c441358789"
+  integrity sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==
   dependencies:
-    fill-range "^7.0.1"
-
-browser-process-hrtime@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz#3c9b4b7d782c8121e56f10106d84c0d0ffc94626"
-  integrity sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==
+    fill-range "^7.1.1"
 
 browser-stdout@1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/browser-stdout/-/browser-stdout-1.3.1.tgz#baa559ee14ced73452229bad7326467c61fabd60"
   integrity sha512-qhAVI1+Av2X7qelOfAIYwXONood6XlZE/fXaBSmW/T5SzLAmCgzi+eiWE7fUvbHaeNBQH13UftjpXxsfLkMpgw==
 
-browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.16.6, browserslist@^4.20.3:
-  version "4.21.3"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.3.tgz#5df277694eb3c48bc5c4b05af3e8b7e09c5a6d1a"
-  integrity sha512-898rgRXLAyRkM1GryrrBHGkqA5hlpkV5MhtZwg9QXeiyLUYs2k00Un05aX5l2/yJIOObYKOpS2JNo8nJDE7fWQ==
+browserslist@^4.24.0:
+  version "4.25.3"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.25.3.tgz#9167c9cbb40473f15f75f85189290678b99b16c5"
+  integrity sha512-cDGv1kkDI4/0e5yON9yM5G/0A5u8sf5TnmdX5C9qHzI9PPu++sQ9zjm1k9NiOrf3riY4OkK0zSGqfvJyJsgCBQ==
   dependencies:
-    caniuse-lite "^1.0.30001370"
-    electron-to-chromium "^1.4.202"
-    node-releases "^2.0.6"
-    update-browserslist-db "^1.0.5"
+    caniuse-lite "^1.0.30001735"
+    electron-to-chromium "^1.5.204"
+    node-releases "^2.0.19"
+    update-browserslist-db "^1.1.3"
 
-browserslist@^4.20.2:
-  version "4.21.1"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.1.tgz#c9b9b0a54c7607e8dc3e01a0d311727188011a00"
-  integrity sha512-Nq8MFCSrnJXSc88yliwlzQe3qNe3VntIjhsArW9IJOEPSHNx23FalwApUVbzAWABLhYJJ7y8AynWI/XM8OdfjQ==
+browserslist@^4.24.4:
+  version "4.24.4"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.24.4.tgz#c6b2865a3f08bcb860a0e827389003b9fe686e4b"
+  integrity sha512-KDi1Ny1gSePi1vm0q4oxSF8b4DR44GF4BbmS2YdhPLOEqd8pDviZOGH/GsmRwoWJ2+5Lr085X7naowMwKHDG1A==
   dependencies:
-    caniuse-lite "^1.0.30001359"
-    electron-to-chromium "^1.4.172"
-    node-releases "^2.0.5"
-    update-browserslist-db "^1.0.4"
+    caniuse-lite "^1.0.30001688"
+    electron-to-chromium "^1.5.73"
+    node-releases "^2.0.19"
+    update-browserslist-db "^1.1.1"
 
-browserslist@^4.21.3, browserslist@^4.21.4:
-  version "4.21.4"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.4.tgz#e7496bbc67b9e39dd0f98565feccdcb0d4ff6987"
-  integrity sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==
+browserslist@^4.25.1:
+  version "4.25.1"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.25.1.tgz#ba9e8e6f298a1d86f829c9b975e07948967bb111"
+  integrity sha512-KGj0KoOMXLpSNkkEI6Z6mShmQy0bc1I+T7K9N81k4WWMrfz+6fQ6es80B/YLAeRoKvjYE1YSHHOW1qe9xIVzHw==
   dependencies:
-    caniuse-lite "^1.0.30001400"
-    electron-to-chromium "^1.4.251"
-    node-releases "^2.0.6"
-    update-browserslist-db "^1.0.9"
+    caniuse-lite "^1.0.30001726"
+    electron-to-chromium "^1.5.173"
+    node-releases "^2.0.19"
+    update-browserslist-db "^1.1.3"
 
-browserslist@^4.23.0:
-  version "4.23.0"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.23.0.tgz#8f3acc2bbe73af7213399430890f86c63a5674ab"
-  integrity sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==
-  dependencies:
-    caniuse-lite "^1.0.30001587"
-    electron-to-chromium "^1.4.668"
-    node-releases "^2.0.14"
-    update-browserslist-db "^1.0.13"
-
-buffer-crc32@~0.2.3:
+buffer-crc32@^0.2.1, buffer-crc32@^0.2.13, buffer-crc32@~0.2.3:
   version "0.2.13"
   resolved "https://registry.yarnpkg.com/buffer-crc32/-/buffer-crc32-0.2.13.tgz#0d333e3f00eac50aa1454abd30ef8c2a5d9a7242"
-  integrity sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI=
+  integrity sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==
 
 buffer-from@^1.0.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5"
+  integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==
 
 buffer@^5.5.0:
   version "5.7.1"
@@ -3137,120 +3047,127 @@ buffer@^5.5.0:
     base64-js "^1.3.1"
     ieee754 "^1.1.13"
 
-builtins@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/builtins/-/builtins-5.0.1.tgz#87f6db9ab0458be728564fa81d876d8d74552fa9"
-  integrity sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ==
-  dependencies:
-    semver "^7.0.0"
-
-bytes@3.1.2:
+bytes@3.1.2, bytes@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.2.tgz#8b0beeb98605adf1b128fa4386403c009e0221a5"
   integrity sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==
 
-call-bind@^1.0.0, call-bind@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
-  integrity sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==
+cac@^6.7.14:
+  version "6.7.14"
+  resolved "https://registry.yarnpkg.com/cac/-/cac-6.7.14.tgz#804e1e6f506ee363cb0e3ccbb09cad5dd9870959"
+  integrity sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==
+
+cacheable@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/cacheable/-/cacheable-2.0.3.tgz#27d490121907166b152cda2d31fdafd41611365e"
+  integrity sha512-nZF80J3d8RMrroMSYm1E9pBllVDXWPuECZgEZxH+vusCY4MAXAJVrY0jutcHSgh3xYX3G2EUNnmtWGZVVjWCXw==
   dependencies:
-    function-bind "^1.1.1"
-    get-intrinsic "^1.0.2"
+    "@cacheable/memoize" "^2.0.3"
+    "@cacheable/memory" "^2.0.3"
+    "@cacheable/utils" "^2.0.3"
+    hookified "^1.12.1"
+    keyv "^5.5.3"
+
+call-bind-apply-helpers@^1.0.0, call-bind-apply-helpers@^1.0.1, call-bind-apply-helpers@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz#4b5428c222be985d79c3d82657479dbe0b59b2d6"
+  integrity sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==
+  dependencies:
+    es-errors "^1.3.0"
+    function-bind "^1.1.2"
+
+call-bind@^1.0.2, call-bind@^1.0.5, call-bind@^1.0.7, call-bind@^1.0.8:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.8.tgz#0736a9660f537e3388826f440d5ec45f744eaa4c"
+  integrity sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==
+  dependencies:
+    call-bind-apply-helpers "^1.0.0"
+    es-define-property "^1.0.0"
+    get-intrinsic "^1.2.4"
+    set-function-length "^1.2.2"
+
+call-bound@^1.0.2, call-bound@^1.0.3, call-bound@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/call-bound/-/call-bound-1.0.4.tgz#238de935d2a2a692928c538c7ccfa91067fd062a"
+  integrity sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==
+  dependencies:
+    call-bind-apply-helpers "^1.0.2"
+    get-intrinsic "^1.3.0"
 
 callsites@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
-
-camel-case@^4.1.2:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-4.1.2.tgz#9728072a954f805228225a6deea6b38461e1bd5a"
-  integrity sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==
-  dependencies:
-    pascal-case "^3.1.2"
-    tslib "^2.0.3"
-
-camelcase-keys@^6.2.2:
-  version "6.2.2"
-  resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-6.2.2.tgz#5e755d6ba51aa223ec7d3d52f25778210f9dc3c0"
-  integrity sha512-YrwaA0vEKazPBkn0ipTiMpSajYDSe+KjQfrjhcBMxJt/znbvlHd8Pw/Vamaz5EB4Wfhs3SUR3Z9mwRu/P3s3Yg==
-  dependencies:
-    camelcase "^5.3.1"
-    map-obj "^4.0.0"
-    quick-lru "^4.0.1"
+  integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
 
 camelcase@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.0.0.tgz#03295527d58bd3cd4aa75363f35b2e8d97be2f42"
-
-camelcase@^5.3.1:
   version "5.3.1"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320"
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
-camelcase@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.0.0.tgz#5259f7c30e35e278f1bdc2a4d91230b37cad981e"
-  integrity sha512-8KMDF1Vz2gzOq54ONPJS65IvTUaB1cHJ2DMM7MbPmLZljDH1qpzzLsWdiN9pHh6qvkRVDTi/07+eNGch/oLU4w==
-
-camelcase@^6.2.0, camelcase@^6.3.0:
+camelcase@^6.0.0, camelcase@^6.2.0:
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a"
   integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==
 
-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.30001688, caniuse-lite@^1.0.30001735:
+  version "1.0.30001737"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001737.tgz#8292bb7591932ff09e9a765f12fdf5629a241ccc"
+  integrity sha512-BiloLiXtQNrY5UyF0+1nSJLXUENuhka2pzy2Fx5pGxqavdrxSCW4U6Pn/PoG3Efspi2frRbHpBV2XsrPE6EDlw==
 
-caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001359, caniuse-lite@^1.0.30001370, caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001587, caniuse-lite@^1.0.30001599:
-  version "1.0.30001662"
-  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001662.tgz"
-  integrity sha512-sgMUVwLmGseH8ZIrm1d51UbrhqMCH3jvS7gF/M6byuHOnKyLOBL7W8yz5V02OHwgLGA36o/AFhWzzh4uc5aqTA==
+caniuse-lite@^1.0.30001702:
+  version "1.0.30001707"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001707.tgz#c5e104d199e6f4355a898fcd995a066c7eb9bf41"
+  integrity sha512-3qtRjw/HQSMlDWf+X79N206fepf4SOOU6SQLMaq/0KkZLmSjPxAkBOQQ+FxbHKfHmYLZFfdWsO3KA90ceHPSnw==
 
-chai-nightwatch@0.5.3:
+caniuse-lite@^1.0.30001726:
+  version "1.0.30001727"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001727.tgz#22e9706422ad37aa50556af8c10e40e2d93a8b85"
+  integrity sha512-pB68nIHmbN6L/4C6MH1DokyR3bYqFwjaSs/sWDHGj4CTcFtQUQMuJftVwWkXq7mNWOybD3KhUv3oWHoGxgP14Q==
+
+chai-nightwatch@^0.5.3:
   version "0.5.3"
   resolved "https://registry.yarnpkg.com/chai-nightwatch/-/chai-nightwatch-0.5.3.tgz#980ecf63dde5a04e7f3524370682c7ff01178ffb"
   integrity sha512-38ixH/mqpY6IwnZkz6xPqx8aB5/KVR+j6VPugcir3EGOsphnWXrPH/mUt8Jp+ninL6ghY0AaJDQ10hSfCPGy/g==
   dependencies:
     assertion-error "1.1.0"
 
-chai@4.3.7:
-  version "4.3.7"
-  resolved "https://registry.yarnpkg.com/chai/-/chai-4.3.7.tgz#ec63f6df01829088e8bf55fca839bcd464a8ec51"
-  integrity sha512-HLnAzZ2iupm25PlN0xFreAlBA5zaBSv3og0DdeGA4Ar6h6rJ3A0rolRUKJhSF2V10GZKDgWF/VmAEsNWjCRB+A==
+chai@5.3.3:
+  version "5.3.3"
+  resolved "https://registry.yarnpkg.com/chai/-/chai-5.3.3.tgz#dd3da955e270916a4bd3f625f4b919996ada7e06"
+  integrity sha512-4zNhdJD/iOjSH0A05ea+Ke6MU5mmpQcbQsSOkgdaUMJ9zTlDTD/GYlwohmIE2u0gaxHYiVHEn1Fw9mZ/ktJWgw==
   dependencies:
-    assertion-error "^1.1.0"
-    check-error "^1.0.2"
-    deep-eql "^4.1.2"
-    get-func-name "^2.0.0"
-    loupe "^2.3.1"
-    pathval "^1.1.1"
-    type-detect "^4.0.5"
+    assertion-error "^2.0.1"
+    check-error "^2.1.1"
+    deep-eql "^5.0.1"
+    loupe "^3.1.0"
+    pathval "^2.0.0"
 
-chalk@1.1.3, chalk@^1.0.0, chalk@^1.1.1:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
+chai@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/chai/-/chai-5.2.0.tgz#1358ee106763624114addf84ab02697e411c9c05"
+  integrity sha512-mCuXncKXk5iCLhfhwTc0izo0gtEmpz5CtG2y8GiOINBlMVS6v8TMRc5TaLWKS6692m9+dVVfzgeVxR5UxWHTYw==
   dependencies:
-    ansi-styles "^2.2.1"
-    escape-string-regexp "^1.0.2"
-    has-ansi "^2.0.0"
-    strip-ansi "^3.0.0"
-    supports-color "^2.0.0"
+    assertion-error "^2.0.1"
+    check-error "^2.1.1"
+    deep-eql "^5.0.1"
+    loupe "^3.1.0"
+    pathval "^2.0.0"
 
-chalk@2.4.2, chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.4.2:
+chalk@2.4.2, chalk@^2.4.2:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
+  integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
   dependencies:
     ansi-styles "^3.2.1"
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
-chalk@^4.0.0, chalk@^4.0.2:
+chalk@5.6.2:
+  version "5.6.2"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-5.6.2.tgz#b1238b6e23ea337af71c7f8a295db5af0c158aea"
+  integrity sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==
+
+chalk@^4.0.0, chalk@^4.0.2, chalk@^4.1.0, chalk@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
   integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
@@ -3258,20 +3175,17 @@ chalk@^4.0.0, chalk@^4.0.2:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
-chalk@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a"
-  integrity sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==
-  dependencies:
-    ansi-styles "^4.1.0"
-    supports-color "^7.1.0"
-
-check-error@1.0.2, check-error@^1.0.2:
+check-error@1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/check-error/-/check-error-1.0.2.tgz#574d312edd88bb5dd8912e9286dd6c0aed4aac82"
   integrity sha512-BrgHpW9NURQgzoNyjfq0Wu6VFO6D7IZEmJNdtgNqpzGG8RuNFHt2jQxWlAs4HMe119chBnv+34syEZtc6IhLtA==
 
-chokidar@3.5.3, "chokidar@>=3.0.0 <4.0.0", chokidar@^3.5.1:
+check-error@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/check-error/-/check-error-2.1.1.tgz#87eb876ae71ee388fa0471fe423f494be1d96ccc"
+  integrity sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==
+
+chokidar@3.5.3:
   version "3.5.3"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd"
   integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==
@@ -3286,57 +3200,41 @@ chokidar@3.5.3, "chokidar@>=3.0.0 <4.0.0", chokidar@^3.5.1:
   optionalDependencies:
     fsevents "~2.3.2"
 
+chokidar@^4.0.0:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-4.0.3.tgz#7be37a4c03c9aee1ecfe862a4a23b2c70c205d30"
+  integrity sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==
+  dependencies:
+    readdirp "^4.0.1"
+
 chromatism@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/chromatism/-/chromatism-3.0.0.tgz#a7249d353c1e4f3577e444ac41171c4e2e624b12"
-  integrity sha1-pySdNTweTzV35ESsQRccTi5iSxI=
+  integrity sha512-slVGC45odKFB6KzD/hpXP8XgS/Y+x72X1ckAhxU/9YZecCy8VwCJUSZsn0O4gQUwaTogun6IfrSiK3YuQaADFw==
 
-chrome-trace-event@^1.0.2:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz#1015eced4741e15d06664a957dbbf50d041e26ac"
-  integrity sha512-p3KULyQg4S7NIHixdwbGX+nFHkoBiA4YQmyWtjb8XngSKV124nJmRysgAeujbUVb15vh+RvFUfCPqU7rXk+hZg==
-
-chromedriver@108.0.0:
-  version "108.0.0"
-  resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-108.0.0.tgz#7994013f423d8b95a513bb9553a55088de81b252"
-  integrity sha512-/kb0rb0dlC4RfXh2BOT7RV87K6d+It3VV5YXebLzO5a8t2knNffiTE23XPJQCH+l1xmgoW8/sOX/NB9irskvOQ==
+chromedriver@135.0.4:
+  version "135.0.4"
+  resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-135.0.4.tgz#d70a0e51863e9b5a140358f811214a79d8b20d5c"
+  integrity sha512-x0DESUcvCfKydljOCTQUve6f0+78Vq71FHcAMmdzBoWzAnyzB+2Fd2PouGRoJJkqk/vgfNzCiuwFosT0hnIjEg==
   dependencies:
-    "@testim/chrome-version" "^1.1.3"
-    axios "^1.1.3"
-    compare-versions "^5.0.1"
+    "@testim/chrome-version" "^1.1.4"
+    axios "^1.7.4"
+    compare-versions "^6.1.0"
     extract-zip "^2.0.1"
-    https-proxy-agent "^5.0.1"
+    proxy-agent "^6.4.0"
     proxy-from-env "^1.1.0"
-    tcp-port-used "^1.0.1"
+    tcp-port-used "^1.0.2"
 
 ci-info@3.3.0:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.3.0.tgz#b4ed1fb6818dea4803a55c623041f9165d2066b2"
   integrity sha512-riT/3vI5YpVH6/qomlDnJow6TBee2PBKSEpx3O32EGPYbWGIRsIlGRms3Sm74wYE1JMo8RnO04Hb12+v1J5ICw==
 
-ci-info@^3.2.0:
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.5.0.tgz#bfac2a29263de4c829d806b1ab478e35091e171f"
-  integrity sha512-yH4RezKOGlOhxkmhbeNuC4eYZKAUsEaGtBuBzDDP1eFUKiccDWzBABxBfOx31IDwDIXMTxWuwAxUGModvkbuVw==
-
-clean-css@^5.2.2:
-  version "5.3.1"
-  resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-5.3.1.tgz#d0610b0b90d125196a2894d35366f734e5d7aa32"
-  integrity sha512-lCr8OHhiWCTw4v8POJovCoh4T7I9U11yVsPjMWWnnMmp9ZowCxyad1Pathle/9HjaDp+fdQKjO9fQydE6RHTZg==
-  dependencies:
-    source-map "~0.6.0"
-
 cli-boxes@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/cli-boxes/-/cli-boxes-2.2.1.tgz#ddd5035d25094fce220e9cab40a45840a440318f"
   integrity sha512-y4coMcylgSCdVinjiDBuR8PCC2bLjyGTwEmPb9NHR/QaNU6EUOXcTY/s6VjGMD6ENSEaeQYHCY0GNGS5jfMwPw==
 
-cli-cursor@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/cli-cursor/-/cli-cursor-2.1.0.tgz#b35dac376479facc3e94747d41d0d0f5238ffcb5"
-  dependencies:
-    restore-cursor "^2.0.0"
-
 cli-cursor@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/cli-cursor/-/cli-cursor-3.1.0.tgz#264305a7ae490d1d03bf0c9ba7c925d1753af307"
@@ -3344,25 +3242,25 @@ cli-cursor@^3.1.0:
   dependencies:
     restore-cursor "^3.1.0"
 
-cli-spinners@^1.0.0:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/cli-spinners/-/cli-spinners-1.3.1.tgz#002c1990912d0d59580c93bd36c056de99e4259a"
-  integrity sha512-1QL4544moEsDVH9T/l6Cemov/37iv1RtoKf7NJ04A60+4MREXNfx/QvavbH6QoGdsD4N4Mwy49cmaINR/o2mdg==
-
 cli-spinners@^2.5.0:
-  version "2.7.0"
-  resolved "https://registry.yarnpkg.com/cli-spinners/-/cli-spinners-2.7.0.tgz#f815fd30b5f9eaac02db604c7a231ed7cb2f797a"
-  integrity sha512-qu3pN8Y3qHNgE2AFweciB1IfMnmZ/fsNTEE+NOFjmGB2F/7rLhnhzppvpCnN4FovtP26k8lHyy9ptEbNwWFLzw==
+  version "2.9.2"
+  resolved "https://registry.yarnpkg.com/cli-spinners/-/cli-spinners-2.9.2.tgz#1773a8f4b9c4d6ac31563df53b3fc1d79462fe41"
+  integrity sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==
 
 cli-table3@^0.6.3:
-  version "0.6.3"
-  resolved "https://registry.yarnpkg.com/cli-table3/-/cli-table3-0.6.3.tgz#61ab765aac156b52f222954ffc607a6f01dbeeb2"
-  integrity sha512-w5Jac5SykAeZJKntOxJCrm63Eg5/4dhMWIcuTbo9rpE+brgaSZo0RuNJZeOyMgsUdhDeojvgyQLmjI+K50ZGyg==
+  version "0.6.5"
+  resolved "https://registry.yarnpkg.com/cli-table3/-/cli-table3-0.6.5.tgz#013b91351762739c16a9567c21a04632e449bf2f"
+  integrity sha512-+W/5efTR7y5HRD7gACw9yQjqMVvEMLBHmboM/kPWam+H+Hmyrgjh6YncVKK122YZkXrLudzTuAukUw9FnMf7IQ==
   dependencies:
     string-width "^4.2.0"
   optionalDependencies:
     "@colors/colors" "1.5.0"
 
+cli-width@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-4.1.0.tgz#42daac41d3c254ef38ad8ac037672130173691c5"
+  integrity sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==
+
 click-outside-vue3@4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/click-outside-vue3/-/click-outside-vue3-4.0.1.tgz#81a6ac01696b301764b42db6fdbdf28e7cd8ef95"
@@ -3386,9 +3284,19 @@ cliui@^7.0.2:
     strip-ansi "^6.0.0"
     wrap-ansi "^7.0.0"
 
+cliui@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/cliui/-/cliui-8.0.1.tgz#0c04b075db02cbfe60dc8e6cf2f5486b1a3608aa"
+  integrity sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==
+  dependencies:
+    string-width "^4.2.0"
+    strip-ansi "^6.0.1"
+    wrap-ansi "^7.0.0"
+
 clone-deep@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/clone-deep/-/clone-deep-4.0.1.tgz#c19fd9bdbbf85942b4fd979c84dcf7d5f07c2387"
+  integrity sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==
   dependencies:
     is-plain-object "^2.0.4"
     kind-of "^6.0.2"
@@ -3402,6 +3310,7 @@ clone@^1.0.2:
 color-convert@^1.9.0:
   version "1.9.3"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
+  integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
   dependencies:
     color-name "1.1.3"
 
@@ -3415,22 +3324,18 @@ color-convert@^2.0.1:
 color-name@1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
+  integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==
 
 color-name@~1.1.4:
   version "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, colord@^2.9.3:
+colord@^2.9.3:
   version "2.9.3"
   resolved "https://registry.yarnpkg.com/colord/-/colord-2.9.3.tgz#4f8ce919de456f1d5c1c368c307fe20f3e59fb43"
   integrity sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==
 
-colors@1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
-  integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
-
 combined-stream@^1.0.8:
   version "1.0.8"
   resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
@@ -3438,38 +3343,35 @@ combined-stream@^1.0.8:
   dependencies:
     delayed-stream "~1.0.0"
 
-commander@^2.19.0, commander@^2.20.0:
-  version "2.20.3"
-  resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
-  integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
-
-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==
-
-commander@^8.3.0:
-  version "8.3.0"
-  resolved "https://registry.yarnpkg.com/commander/-/commander-8.3.0.tgz#4837ea1b2da67b9c616a67afbb0fafee567bca66"
-  integrity sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==
-
-common-path-prefix@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/common-path-prefix/-/common-path-prefix-3.0.0.tgz#7d007a7e07c58c4b4d5f433131a19141b29f11e0"
-  integrity sha512-QE33hToZseCH3jS0qN96O/bSh3kaw/h+Tq7ngyY9eWDUnTlTNUyqfqvCXioLe5Na5jFsL78ra/wuBU4iuEgd4w==
+commander@^10.0.0:
+  version "10.0.1"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-10.0.1.tgz#881ee46b4f77d1c1dccc5823433aa39b022cbe06"
+  integrity sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug==
 
 commondir@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
+  integrity sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==
 
-compare-versions@^5.0.1:
-  version "5.0.3"
-  resolved "https://registry.yarnpkg.com/compare-versions/-/compare-versions-5.0.3.tgz#a9b34fea217472650ef4a2651d905f42c28ebfd7"
-  integrity sha512-4UZlZP8Z99MGEY+Ovg/uJxJuvoXuN4M6B3hKaiackiHrgzQFEe3diJi1mf1PNHbFujM7FvLrK2bpgIaImbtZ1A==
+compare-versions@^6.1.0:
+  version "6.1.1"
+  resolved "https://registry.yarnpkg.com/compare-versions/-/compare-versions-6.1.1.tgz#7af3cc1099ba37d244b3145a9af5201b629148a9"
+  integrity sha512-4hm4VPpIecmlg59CHXnRDnqGplJFrbLG4aFEl5vl6cK1u76ws3LLvX7ikFnTDl5vo39sjWD6AaDPYodJp/NNHg==
+
+compress-commons@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/compress-commons/-/compress-commons-4.1.2.tgz#6542e59cb63e1f46a8b21b0e06f9a32e4c8b06df"
+  integrity sha512-D3uMHtGc/fcO1Gt1/L7i1e33VOvD4A9hfQLP+6ewd+BvG/gQ84Yh4oftEhAdjSMgBgwGL+jsppT7JYNpo6MHHg==
+  dependencies:
+    buffer-crc32 "^0.2.13"
+    crc32-stream "^4.0.2"
+    normalize-path "^3.0.0"
+    readable-stream "^3.6.0"
 
 concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
+  integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
 
 config-chain@^1.1.13:
   version "1.1.13"
@@ -3484,325 +3386,189 @@ connect-history-api-fallback@2.0.0:
   resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz#647264845251a0daf25b97ce87834cace0f5f1c8"
   integrity sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA==
 
-connect@^3.7.0:
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/connect/-/connect-3.7.0.tgz#5d49348910caa5e07a01800b030d0c35f20484f8"
-  integrity sha512-ZqRXc+tZukToSNmh5C2iWMSoV3X1YUcPbqEM4DkEG5tNQXrQUZCNVGGv3IuicnkMtPfGf3Xtp8WCXs295iQ1pQ==
-  dependencies:
-    debug "2.6.9"
-    finalhandler "1.1.2"
-    parseurl "~1.3.3"
-    utils-merge "1.0.1"
-
-content-disposition@0.5.4:
-  version "0.5.4"
-  resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.4.tgz#8b82b4efac82512a02bb0b1dcec9d2c5e8eb5bfe"
-  integrity sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==
+content-disposition@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-1.0.0.tgz#844426cb398f934caefcbb172200126bc7ceace2"
+  integrity sha512-Au9nRL8VNUut/XSzbQA38+M78dzP4D+eqg3gfJHMIHHYa3bg067xj1KxMUWj+VULbiZMowKngFFbKczUrNJ1mg==
   dependencies:
     safe-buffer "5.2.1"
 
-content-type@~1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.4.tgz#e138cc75e040c727b1966fe5e5f8c9aee256fe3b"
+content-type@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.5.tgz#8b773162656d1d1086784c8f23a54ce6d73d7918"
+  integrity sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==
 
-convert-source-map@^1.7.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.7.0.tgz#17a2cb882d7f77d3490585e2ce6c524424a3a442"
-  integrity sha512-4FJkXzKXEDB1snCFZlLP4gpC3JILicCpGbzG9f9G7tGqGCzETQ2hWPrcinA9oU4wtf2biUaEH5065UnMeR33oA==
+convert-source-map@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-2.0.0.tgz#4b560f649fc4e918dd0ab75cf4961e8bc882d82a"
+  integrity sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==
+
+cookie-signature@^1.2.1:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.2.2.tgz#57c7fc3cc293acab9fec54d73e15690ebe4a1793"
+  integrity sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==
+
+cookie@^0.7.1, cookie@^0.7.2:
+  version "0.7.2"
+  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.7.2.tgz#556369c472a2ba910f2979891b526b3436237ed7"
+  integrity sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==
+
+copy-anything@^3.0.2:
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/copy-anything/-/copy-anything-3.0.5.tgz#2d92dce8c498f790fa7ad16b01a1ae5a45b020a0"
+  integrity sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==
   dependencies:
-    safe-buffer "~5.1.1"
+    is-what "^4.1.8"
 
-cookie-signature@1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
-
-cookie@0.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.5.0.tgz#d1f5d71adec6558c58f389987c366aa47e994f8b"
-  integrity sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==
-
-cookie@~0.4.1:
-  version "0.4.2"
-  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.2.tgz#0e41f24de5ecf317947c82fc789e06a884824432"
-  integrity sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==
-
-copy-webpack-plugin@11.0.0:
-  version "11.0.0"
-  resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-11.0.0.tgz#96d4dbdb5f73d02dd72d0528d1958721ab72e04a"
-  integrity sha512-fX2MWpamkW0hZxMEg0+mYnA40LTosOSa5TqZ9GYIBzyJa9C3QUaMPSE2xAi/buNr8u89SfD9wHSQVBzrRa/SOQ==
+core-js-compat@^3.43.0:
+  version "3.44.0"
+  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.44.0.tgz#62b9165b97e4cbdb8bca16b14818e67428b4a0f8"
+  integrity sha512-JepmAj2zfl6ogy34qfWtcE7nHKAJnKsQFRn++scjVS2bZFllwptzw61BZcZFYBPpUznLfAvh0LGhxKppk04ClA==
   dependencies:
-    fast-glob "^3.2.11"
-    glob-parent "^6.0.1"
-    globby "^13.1.1"
-    normalize-path "^3.0.0"
-    schema-utils "^4.0.0"
-    serialize-javascript "^6.0.0"
-
-core-js-compat@^3.25.1:
-  version "3.26.0"
-  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.26.0.tgz#94e2cf8ba3e63800c4956ea298a6473bc9d62b44"
-  integrity sha512-piOX9Go+Z4f9ZiBFLnZ5VrOpBl0h7IGCkiFUN11QTe6LjAvOT3ifL/5TdoizMh99hcGy5SoLyWbapIY/PIb/3A==
-  dependencies:
-    browserslist "^4.21.4"
+    browserslist "^4.25.1"
 
 core-util-is@~1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85"
+  integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==
 
-cors@~2.8.5:
-  version "2.8.5"
-  resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29"
-  integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==
+cosmiconfig@^9.0.0:
+  version "9.0.0"
+  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-9.0.0.tgz#34c3fc58287b915f3ae905ab6dc3de258b55ad9d"
+  integrity sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==
   dependencies:
-    object-assign "^4"
-    vary "^1"
+    env-paths "^2.2.1"
+    import-fresh "^3.3.0"
+    js-yaml "^4.1.0"
+    parse-json "^5.2.0"
 
-cosmiconfig@^7.0.0:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.0.1.tgz#714d756522cace867867ccb4474c5d01bbae5d6d"
-  integrity sha512-a1YWNUV2HwGimB7dU2s1wUMurNKjpx60HxBB6xUM8Re+2s1g1IIfJvFR0/iCF+XHdE0GMTKTuLR32UQff4TEyQ==
+crc-32@^1.2.0:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/crc-32/-/crc-32-1.2.2.tgz#3cad35a934b8bf71f25ca524b6da51fb7eace2ff"
+  integrity sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==
+
+crc32-stream@^4.0.2:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/crc32-stream/-/crc32-stream-4.0.3.tgz#85dd677eb78fa7cad1ba17cc506a597d41fc6f33"
+  integrity sha512-NT7w2JVU7DFroFdYkeq8cywxrgjPHWkdX1wjpRQXPX5Asews3tA+Ght6lddQO5Mkumffp3X7GEqku3epj2toIw==
   dependencies:
-    "@types/parse-json" "^4.0.0"
-    import-fresh "^3.2.1"
-    parse-json "^5.0.0"
-    path-type "^4.0.0"
-    yaml "^1.10.0"
+    crc-32 "^1.2.0"
+    readable-stream "^3.4.0"
 
-cosmiconfig@^7.1.0:
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.1.0.tgz#1443b9afa596b670082ea46cbd8f6a62b84635f6"
-  integrity sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==
+cropperjs@2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/cropperjs/-/cropperjs-2.0.1.tgz#74492df8cf54563691605d1510679b242c7f6d39"
+  integrity sha512-hiJwk2SCPZqxMA7aR3byzLpYUqOrQo+ihMk8k/WRm/xe/LX8wNzAIzMwEB/NEGJYA6sbewxW9TUlrRUYi/2Ipg==
   dependencies:
-    "@types/parse-json" "^4.0.0"
-    import-fresh "^3.2.1"
-    parse-json "^5.0.0"
-    path-type "^4.0.0"
-    yaml "^1.10.0"
+    "@cropper/elements" "^2.0.1"
+    "@cropper/utils" "^2.0.1"
 
-cropperjs@1.5.13:
-  version "1.5.13"
-  resolved "https://registry.yarnpkg.com/cropperjs/-/cropperjs-1.5.13.tgz#eb1682f01d17c70ed5244317091d745c9a249ef8"
-  integrity sha512-by7jKAo73y5/Do0K6sxdTKHgndY0NMjG2bEdgeJxycbcmHuCiMXqw8sxy5C5Y5WTOTcDGmbT7Sr5CgKOXR06OA==
-
-cross-spawn@7.0.3, cross-spawn@^7.0.2:
-  version "7.0.3"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
-  integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
+cross-spawn@7.0.6, cross-spawn@^7.0.3, cross-spawn@^7.0.6:
+  version "7.0.6"
+  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.6.tgz#8a58fe78f00dcd70c370451759dfbfaf03e8ee9f"
+  integrity sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==
   dependencies:
     path-key "^3.1.0"
     shebang-command "^2.0.0"
     which "^2.0.1"
 
-css-declaration-sorter@^6.3.0:
-  version "6.3.0"
-  resolved "https://registry.yarnpkg.com/css-declaration-sorter/-/css-declaration-sorter-6.3.0.tgz#72ebd995c8f4532ff0036631f7365cce9759df14"
-  integrity sha512-OGT677UGHJTAVMRhPO+HJ4oKln3wkBTwtDFH0ojbqm+MJm6xuDMHp2nkhh/ThaBqq20IbraBQSWKfSLNHQO9Og==
+css-functions-list@^3.2.3:
+  version "3.2.3"
+  resolved "https://registry.yarnpkg.com/css-functions-list/-/css-functions-list-3.2.3.tgz#95652b0c24f0f59b291a9fc386041a19d4f40dbe"
+  integrity sha512-IQOkD3hbR5KrN93MtcYuad6YPuTSUhntLHDuLEbFWE+ff2/XSZNdZG+LcbbIW5AXKg/WFIfYItIzVoHngHXZzA==
 
-css-functions-list@^3.1.0:
+css-tree@^3.0.1, css-tree@^3.1.0:
   version "3.1.0"
-  resolved "https://registry.yarnpkg.com/css-functions-list/-/css-functions-list-3.1.0.tgz#cf5b09f835ad91a00e5959bcfc627cd498e1321b"
-  integrity sha512-/9lCvYZaUbBGvYUgYGFJ4dcYiyqdhSjG7IPVluoV8A1ILjkF7ilmhp1OGUz8n+nmBcu0RNrQAzgD8B6FJbrt2w==
-
-css-loader@6.10.0:
-  version "6.10.0"
-  resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-6.10.0.tgz#7c172b270ec7b833951b52c348861206b184a4b7"
-  integrity sha512-LTSA/jWbwdMlk+rhmElbDR2vbtQoTBPr7fkJE+mxrHj+7ru0hUmHafDRzWIjIHTwpitWVaqY2/UWGRca3yUgRw==
+  resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-3.1.0.tgz#7aabc035f4e66b5c86f54570d55e05b1346eb0fd"
+  integrity sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==
   dependencies:
-    icss-utils "^5.1.0"
-    postcss "^8.4.33"
-    postcss-modules-extract-imports "^3.0.0"
-    postcss-modules-local-by-default "^4.0.4"
-    postcss-modules-scope "^3.1.1"
-    postcss-modules-values "^4.0.0"
-    postcss-value-parser "^4.2.0"
-    semver "^7.5.4"
-
-css-minimizer-webpack-plugin@4.2.2:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/css-minimizer-webpack-plugin/-/css-minimizer-webpack-plugin-4.2.2.tgz#79f6199eb5adf1ff7ba57f105e3752d15211eb35"
-  integrity sha512-s3Of/4jKfw1Hj9CxEO1E5oXhQAxlayuHO2y/ML+C6I9sQ7FdzfEV6QgMLN3vI+qFsjJGIAFLKtQK7t8BOXAIyA==
-  dependencies:
-    cssnano "^5.1.8"
-    jest-worker "^29.1.2"
-    postcss "^8.4.17"
-    schema-utils "^4.0.0"
-    serialize-javascript "^6.0.0"
-    source-map "^0.6.1"
-
-css-select@^4.1.3:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/css-select/-/css-select-4.3.0.tgz#db7129b2846662fd8628cfc496abb2b59e41529b"
-  integrity sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==
-  dependencies:
-    boolbase "^1.0.0"
-    css-what "^6.0.1"
-    domhandler "^4.3.1"
-    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@^6.0.1:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/css-what/-/css-what-6.1.0.tgz#fb5effcf76f1ddea2c81bdfaa4de44e79bac70f4"
-  integrity sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==
+    mdn-data "2.12.2"
+    source-map-js "^1.0.1"
 
 cssesc@^3.0.0:
   version "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.2.12:
-  version "5.2.12"
-  resolved "https://registry.yarnpkg.com/cssnano-preset-default/-/cssnano-preset-default-5.2.12.tgz#ebe6596ec7030e62c3eb2b3c09f533c0644a9a97"
-  integrity sha512-OyCBTZi+PXgylz9HAA5kHyoYhfGcYdwFmyaJzWnzxuGRtnMw/kR6ilW9XzlzlRAtB6PLT/r+prYgkef7hngFew==
+cssstyle@^4.0.1:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/cssstyle/-/cssstyle-4.3.0.tgz#83db22d1aec8eb7e5ecd812b4d14a17fb3dd243d"
+  integrity sha512-6r0NiY0xizYqfBvWp1G7WXJ06/bZyrk7Dc6PHql82C/pKGUTKu4yAX4Y8JPamb1ob9nBKuxWzCGTRuGwU3yxJQ==
   dependencies:
-    css-declaration-sorter "^6.3.0"
-    cssnano-utils "^3.1.0"
-    postcss-calc "^8.2.3"
-    postcss-colormin "^5.3.0"
-    postcss-convert-values "^5.1.2"
-    postcss-discard-comments "^5.1.2"
-    postcss-discard-duplicates "^5.1.0"
-    postcss-discard-empty "^5.1.1"
-    postcss-discard-overridden "^5.1.0"
-    postcss-merge-longhand "^5.1.6"
-    postcss-merge-rules "^5.1.2"
-    postcss-minify-font-values "^5.1.0"
-    postcss-minify-gradients "^5.1.1"
-    postcss-minify-params "^5.1.3"
-    postcss-minify-selectors "^5.2.1"
-    postcss-normalize-charset "^5.1.0"
-    postcss-normalize-display-values "^5.1.0"
-    postcss-normalize-positions "^5.1.1"
-    postcss-normalize-repeat-style "^5.1.1"
-    postcss-normalize-string "^5.1.0"
-    postcss-normalize-timing-functions "^5.1.0"
-    postcss-normalize-unicode "^5.1.0"
-    postcss-normalize-url "^5.1.0"
-    postcss-normalize-whitespace "^5.1.1"
-    postcss-ordered-values "^5.1.3"
-    postcss-reduce-initial "^5.1.0"
-    postcss-reduce-transforms "^5.1.0"
-    postcss-svgo "^5.1.0"
-    postcss-unique-selectors "^5.1.1"
+    "@asamuzakjp/css-color" "^3.1.1"
+    rrweb-cssom "^0.8.0"
 
-cssnano-utils@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/cssnano-utils/-/cssnano-utils-3.1.0.tgz#95684d08c91511edfc70d2636338ca37ef3a6861"
-  integrity sha512-JQNR19/YZhz4psLX/rQ9M83e3z2Wf/HdJbryzte4a3NSuafyp9w/I4U+hx5C2S9g41qlstH7DEWnZaaj83OuEA==
-
-cssnano@^5.1.8:
-  version "5.1.13"
-  resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-5.1.13.tgz#83d0926e72955332dc4802a7070296e6258efc0a"
-  integrity sha512-S2SL2ekdEz6w6a2epXn4CmMKU4K3KpcyXLKfAYc9UQQqJRkD/2eLUG0vJ3Db/9OvO5GuAdgXw3pFbR6abqghDQ==
-  dependencies:
-    cssnano-preset-default "^5.2.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.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.5.0.tgz#d254fa92cd8b6fbd83811b9fbaed34663cc17c36"
-  integrity sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==
-
-cssom@~0.3.6:
-  version "0.3.8"
-  resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.8.tgz#9f1276f5b2b463f2114d3f2c75250af8c1a36f4a"
-  integrity sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==
-
-cssstyle@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/cssstyle/-/cssstyle-2.3.0.tgz#ff665a0ddbdc31864b09647f34163443d90b0852"
-  integrity sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A==
-  dependencies:
-    cssom "~0.3.6"
-
-csstype@^2.6.8:
-  version "2.6.20"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.20.tgz#9229c65ea0b260cf4d3d997cb06288e36a8d6dda"
-  integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
+csstype@^3.1.3:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81"
+  integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
 
 custom-event-polyfill@1.0.7:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/custom-event-polyfill/-/custom-event-polyfill-1.0.7.tgz#9bc993ddda937c1a30ccd335614c6c58c4f87aee"
   integrity sha512-TDDkd5DkaZxZFM8p+1I3yAlvM3rSr1wbrOliG4yJiwinMZN8z/iGL7BTlDkrJcYTmgUSb4ywVCc3ZaUtOtC76w==
 
-custom-event@~1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/custom-event/-/custom-event-1.0.1.tgz#5d02a46850adf1b4a317946a3928fccb5bfd0425"
+data-uri-to-buffer@^6.0.2:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-6.0.2.tgz#8a58bb67384b261a38ef18bea1810cb01badd28b"
+  integrity sha512-7hvf7/GW8e86rW0ptuwS3OcBGDjIi6SZva7hCyWC0yYry2cOPmLIjXAUHI6DK2HsnwJd9ifmt57i8eV2n4YNpw==
 
-data-urls@^3.0.1:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-3.0.2.tgz#9cf24a477ae22bcef5cd5f6f0bfbc1d2d3be9143"
-  integrity sha512-Jy/tj3ldjZJo63sVAvg6LHt2mHvl4V6AgRAmNDtLdm7faqtsx+aJG42rsyCo9JCoRVKwPFzKlIPx3DIibwSIaQ==
+data-urls@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-5.0.0.tgz#2f76906bce1824429ffecb6920f45a0b30f00dde"
+  integrity sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==
   dependencies:
-    abab "^2.0.6"
-    whatwg-mimetype "^3.0.0"
-    whatwg-url "^11.0.0"
+    whatwg-mimetype "^4.0.0"
+    whatwg-url "^14.0.0"
 
-date-format@^4.0.6:
-  version "4.0.6"
-  resolved "https://registry.yarnpkg.com/date-format/-/date-format-4.0.6.tgz#f6138b8f17968df9815b3d101fc06b0523f066c5"
-  integrity sha512-B9vvg5rHuQ8cbUXE/RMWMyX2YA5TecT3jKF5fLtGNlzPlU7zblSPmAm2OImDbWL+LDOQ6pUm+4LOFz+ywS41Zw==
-
-de-indent@^1.0.2:
+data-view-buffer@^1.0.2:
   version "1.0.2"
-  resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
-  integrity sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=
-
-debug@2.6.9:
-  version "2.6.9"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
+  resolved "https://registry.yarnpkg.com/data-view-buffer/-/data-view-buffer-1.0.2.tgz#211a03ba95ecaf7798a8c7198d79536211f88570"
+  integrity sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==
   dependencies:
-    ms "2.0.0"
+    call-bound "^1.0.3"
+    es-errors "^1.3.0"
+    is-data-view "^1.0.2"
 
-debug@4:
+data-view-byte-length@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz#9e80f7ca52453ce3e93d25a35318767ea7704735"
+  integrity sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==
+  dependencies:
+    call-bound "^1.0.3"
+    es-errors "^1.3.0"
+    is-data-view "^1.0.2"
+
+data-view-byte-offset@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz#068307f9b71ab76dbbe10291389e020856606191"
+  integrity sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==
+  dependencies:
+    call-bound "^1.0.2"
+    es-errors "^1.3.0"
+    is-data-view "^1.0.1"
+
+debug@4, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4, debug@^4.3.5, debug@^4.3.6, debug@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.4.0.tgz#2b3f2aea2ffeb776477460267377dc8710faba8a"
+  integrity sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==
+  dependencies:
+    ms "^2.1.3"
+
+debug@4.3.1:
   version "4.3.1"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.1.tgz#f0d229c505e0c6d8c49ac553d1b13dc183f6b2ee"
   integrity sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==
   dependencies:
     ms "2.1.2"
 
-debug@4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
-  dependencies:
-    ms "^2.1.1"
-
-debug@4.3.3:
-  version "4.3.3"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.3.tgz#04266e0b70a98d4462e6e288e38259213332b664"
-  integrity sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==
-  dependencies:
-    ms "2.1.2"
-
-debug@4.3.4, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
+debug@4.3.4:
   version "4.3.4"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
   integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
   dependencies:
     ms "2.1.2"
 
-debug@=3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
-  dependencies:
-    ms "2.0.0"
-
 debug@^3.2.7:
   version "3.2.7"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a"
@@ -3810,40 +3576,34 @@ debug@^3.2.7:
   dependencies:
     ms "^2.1.1"
 
-debug@^4.1.0, debug@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+debug@^4.1.0, debug@^4.3.1, debug@^4.4.1:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.4.1.tgz#e5a8bc6cbc4c6cd3e64308b0693a3d4fa550189b"
+  integrity sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==
   dependencies:
-    ms "^2.1.1"
+    ms "^2.1.3"
 
-debug@~4.3.4:
-  version "4.3.6"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.6.tgz#2ab2c38fbaffebf8aa95fdfe6d88438c7a13c52b"
-  integrity sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==
+debug@^4.4.3:
+  version "4.4.3"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.4.3.tgz#c6ae432d9bd9662582fce08709b038c58e9e3d6a"
+  integrity sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==
   dependencies:
-    ms "2.1.2"
+    ms "^2.1.3"
 
-decamelize-keys@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/decamelize-keys/-/decamelize-keys-1.1.0.tgz#d171a87933252807eb3cb61dc1c1445d078df2d9"
-  integrity sha1-0XGoeTMlKAfrPLYdwcFEXQeN8tk=
-  dependencies:
-    decamelize "^1.1.0"
-    map-obj "^1.0.0"
-
-decamelize@^1.1.0, decamelize@^1.2.0:
+decamelize@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
+  integrity sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==
 
 decamelize@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-4.0.0.tgz#aa472d7bf660eb15f3494efd531cab7f2a709837"
   integrity sha512-9iE1PgSik9HeIIw2JO94IidnE3eBoQrFJ3w7sFuzSX4DpmZ3v5sZpUiV5Swcf6mQEF+Y0ru8Neo+p+nyh2J+hQ==
 
-decimal.js@^10.3.1:
-  version "10.4.3"
-  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.3.tgz#1044092884d245d1b7f65725fa4ad4c6f781cc23"
-  integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==
+decimal.js@^10.4.3:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.5.0.tgz#0f371c7cf6c4898ce0afb09836db73cd82010f22"
+  integrity sha512-8vDa8Qxvr/+d94hSh5P3IJwI5t8/c0KsMp+g8bNw9cY2icONa5aPfvKeieW1WlG0WQYwwhJ7mjui2xtiePQSXw==
 
 deep-eql@4.0.1:
   version "4.0.1"
@@ -3852,72 +3612,105 @@ deep-eql@4.0.1:
   dependencies:
     type-detect "^4.0.0"
 
-deep-eql@^4.1.2:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/deep-eql/-/deep-eql-4.1.2.tgz#270ceb902f87724077e6f6449aed81463f42fc1c"
-  integrity sha512-gT18+YW4CcW/DBNTwAmqTtkJh7f9qqScu2qFVlx7kCoeY9tlBu9cUcr7+I+Z/noG8INehS3xQgLpTtd/QUTn4w==
+deep-eql@^5.0.1:
+  version "5.0.2"
+  resolved "https://registry.yarnpkg.com/deep-eql/-/deep-eql-5.0.2.tgz#4b756d8d770a9257300825d52a2c2cff99c3a341"
+  integrity sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==
+
+deep-equal@^2.0.5:
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-2.2.3.tgz#af89dafb23a396c7da3e862abc0be27cf51d56e1"
+  integrity sha512-ZIwpnevOurS8bpT4192sqAowWM76JDKSHYzMLty3BZGSswgq6pBaH3DhCSW5xVAZICZyKdOBPjwww5wfgT/6PA==
   dependencies:
-    type-detect "^4.0.0"
+    array-buffer-byte-length "^1.0.0"
+    call-bind "^1.0.5"
+    es-get-iterator "^1.1.3"
+    get-intrinsic "^1.2.2"
+    is-arguments "^1.1.1"
+    is-array-buffer "^3.0.2"
+    is-date-object "^1.0.5"
+    is-regex "^1.1.4"
+    is-shared-array-buffer "^1.0.2"
+    isarray "^2.0.5"
+    object-is "^1.1.5"
+    object-keys "^1.1.1"
+    object.assign "^4.1.4"
+    regexp.prototype.flags "^1.5.1"
+    side-channel "^1.0.4"
+    which-boxed-primitive "^1.0.2"
+    which-collection "^1.0.1"
+    which-typed-array "^1.1.13"
 
 deep-is@^0.1.3:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
-
-deep-is@~0.1.3:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831"
   integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==
 
 defaults@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/defaults/-/defaults-1.0.3.tgz#c656051e9817d9ff08ed881477f3fe4019f3ef7d"
-  integrity sha512-s82itHOnYrN0Ib8r+z7laQz3sdE+4FP3d9Q7VLO7U+KRT+CR0GsWuyHxzdAY82I7cXv0G/twrqomTJLOssO5HA==
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/defaults/-/defaults-1.0.4.tgz#b0b02062c1e2aa62ff5d9528f0f98baa90978d7a"
+  integrity sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==
   dependencies:
     clone "^1.0.2"
 
+define-data-property@^1.0.1, define-data-property@^1.1.4:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.4.tgz#894dc141bb7d3060ae4366f6a0107e68fbe48c5e"
+  integrity sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==
+  dependencies:
+    es-define-property "^1.0.0"
+    es-errors "^1.3.0"
+    gopd "^1.0.1"
+
 define-lazy-prop@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz#3f7ae421129bcaaac9bc74905c98a0009ec9ee7f"
   integrity sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==
 
-define-properties@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1"
-  dependencies:
-    object-keys "^1.0.12"
-
-define-properties@^1.1.4:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.4.tgz#0b14d7bd7fbeb2f3572c3a7eda80ea5d57fb05b1"
-  integrity sha512-uckOqKcfaVvtBdsVkdPv3XjveQJsNQqmhXgRi8uhvWWuPYZCNlzT8qAyblUgNoXdHdjMTzAqeGjAoli8f+bzPA==
+define-properties@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.2.1.tgz#10781cc616eb951a80a034bafcaa7377f6af2b6c"
+  integrity sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==
   dependencies:
+    define-data-property "^1.0.1"
     has-property-descriptors "^1.0.0"
     object-keys "^1.1.1"
 
+degenerator@^5.0.0:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/degenerator/-/degenerator-5.0.1.tgz#9403bf297c6dad9a1ece409b37db27954f91f2f5"
+  integrity sha512-TllpMR/t0M5sqCXfj85i4XaAzxmS5tVA16dqvdkMwGmzI+dXLXnw3J+3Vdv7VKw+ThlTMboK6i9rnZ6Nntj5CQ==
+  dependencies:
+    ast-types "^0.13.4"
+    escodegen "^2.1.0"
+    esprima "^4.0.1"
+
 delayed-stream@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
   integrity sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==
 
-depd@2.0.0:
+depd@2.0.0, depd@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/depd/-/depd-2.0.0.tgz#b696163cc757560d09cf22cc8fad1571b79e76df"
   integrity sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==
 
-depd@~1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
+dequal@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be"
+  integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==
 
-destroy@1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/destroy/-/destroy-1.2.0.tgz#4803735509ad8be552934c67df614f94e66fa015"
-  integrity sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==
+detect-libc@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
+  integrity sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==
 
-di@^0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/di/-/di-0.0.1.tgz#806649326ceaa7caa3306d75d985ea2748ba913c"
+devtools-protocol@^0.0.1140464:
+  version "0.0.1140464"
+  resolved "https://registry.yarnpkg.com/devtools-protocol/-/devtools-protocol-0.0.1140464.tgz#ee5bb78646008e0dd97724d7659588c80fdb08b6"
+  integrity sha512-I1jXnjpQh/6TBFyQ0A9dB2kXXk6DprpPFZoI8pUsxHtlNuOTQEdv9fUqYBsFtf8tOJCbdsZZyQrWeXu6GfK+Bw==
 
-didyoumean@1.2.2:
+didyoumean@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/didyoumean/-/didyoumean-1.2.2.tgz#989346ffe9e839b4555ecf5666edea0d3e8ad037"
   integrity sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==
@@ -3927,15 +3720,15 @@ diff@5.0.0:
   resolved "https://registry.yarnpkg.com/diff/-/diff-5.0.0.tgz#7ed6ad76d859d030787ec35855f5b1daf31d852b"
   integrity sha512-/VTCrvm5Z0JGty/BWHljh+BAiw3IK+2j87NGMu8Nwc/f48WoDAC395uomO9ZD117ZOBaHmkX1oyLvkVM/aIT3w==
 
-diff@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/diff/-/diff-5.1.0.tgz#bc52d298c5ea8df9194800224445ed43ffc87e40"
-  integrity sha512-D+mk+qE8VC/PAUrlAU34N+VfXev0ghe5ywmpqrawphmVZc1bEfn56uo9qpyGp1p4xpzOHkSW4ztBd6L7Xx4ACw==
+diff@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/diff/-/diff-7.0.0.tgz#3fb34d387cd76d803f6eebea67b921dab0182a9a"
+  integrity sha512-PJWHUb1RFevKCwaFA9RlG5tCd+FO5iRh9A8HEtkmBH2Li03iJriB6m6JIN4rGz3K3JLawI7/veA1xzRKP6ISBw==
 
 dijkstrajs@^1.0.1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/dijkstrajs/-/dijkstrajs-1.0.2.tgz#2e48c0d3b825462afe75ab4ad5e829c8ece36257"
-  integrity sha512-QV6PMaHTCNmKSeP6QoXhVTw9snc9VD8MulTT0Bd99Pacp4SS1cjcrYPgBPmibqKVtMJJfqC6XvOXgPMEEPH/fg==
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/dijkstrajs/-/dijkstrajs-1.0.3.tgz#4c8dbdea1f0f6478bff94d9c49c784d623e4fc23"
+  integrity sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==
 
 dir-glob@^3.0.1:
   version "3.0.1"
@@ -3951,37 +3744,10 @@ doctrine@^2.1.0:
   dependencies:
     esutils "^2.0.2"
 
-doctrine@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
-  dependencies:
-    esutils "^2.0.2"
-
-dom-converter@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
-  integrity sha512-gd3ypIPfOMr9h5jIKq8E3sHOTCjeirnl0WK5ZdS1AW0Odt0b1PaWaHdJ4Qk4klv+YB9aJBS7mESXjFoDQPu6DA==
-  dependencies:
-    utila "~0.4"
-
-dom-serialize@^2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/dom-serialize/-/dom-serialize-2.2.1.tgz#562ae8999f44be5ea3076f5419dcd59eb43ac95b"
-  integrity sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs=
-  dependencies:
-    custom-event "~1.0.0"
-    ent "~2.2.0"
-    extend "^3.0.0"
-    void-elements "^2.0.0"
-
-dom-serializer@^1.0.1:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-1.4.1.tgz#de5d41b1aea290215dc45a6dae8adcf1d32e2d30"
-  integrity sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==
-  dependencies:
-    domelementtype "^2.0.1"
-    domhandler "^4.2.0"
-    entities "^2.0.0"
+dom-accessibility-api@^0.5.9:
+  version "0.5.16"
+  resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz#5a7429e6066eb3664d911e33fb0e45de8eb08453"
+  integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==
 
 dom-serializer@^2.0.0:
   version "2.0.0"
@@ -3992,328 +3758,389 @@ dom-serializer@^2.0.0:
     domhandler "^5.0.2"
     entities "^4.2.0"
 
-domelementtype@^2.0.1, domelementtype@^2.2.0, domelementtype@^2.3.0:
+domelementtype@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d"
   integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==
 
-domexception@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/domexception/-/domexception-4.0.0.tgz#4ad1be56ccadc86fc76d033353999a8037d03673"
-  integrity sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==
-  dependencies:
-    webidl-conversions "^7.0.0"
-
-domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.3.1:
-  version "4.3.1"
-  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-4.3.1.tgz#8d792033416f59d68bc03a5aa7b018c1ca89279c"
-  integrity sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==
-  dependencies:
-    domelementtype "^2.2.0"
-
-domhandler@^5.0.1, domhandler@^5.0.2:
+domhandler@^5.0.2, domhandler@^5.0.3:
   version "5.0.3"
   resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-5.0.3.tgz#cc385f7f751f1d1fc650c21374804254538c7d31"
   integrity sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==
   dependencies:
     domelementtype "^2.3.0"
 
-domutils@^2.5.2, 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"
-
 domutils@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/domutils/-/domutils-3.0.1.tgz#696b3875238338cb186b6c0612bd4901c89a4f1c"
-  integrity sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-3.2.2.tgz#edbfe2b668b0c1d97c24baf0f1062b132221bc78"
+  integrity sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==
   dependencies:
     dom-serializer "^2.0.0"
     domelementtype "^2.3.0"
-    domhandler "^5.0.1"
+    domhandler "^5.0.3"
 
-dot-case@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.4.tgz#9b2b670d00a431667a8a75ba29cd1b98809ce751"
-  integrity sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==
+dotenv@16.3.1:
+  version "16.3.1"
+  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.3.1.tgz#369034de7d7e5b120972693352a3bf112172cc3e"
+  integrity sha512-IPzF4w4/Rd94bA9imS68tZBaYyBWSCE47V1RGuMrB94iyTOIEwRmVL2x/4An+6mETpLrKJ5hQkB8W4kFAadeIQ==
+
+dunder-proto@^1.0.0, dunder-proto@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/dunder-proto/-/dunder-proto-1.0.1.tgz#d7ae667e1dc83482f8b70fd0f6eefc50da30f58a"
+  integrity sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==
   dependencies:
-    no-case "^3.0.4"
-    tslib "^2.0.3"
+    call-bind-apply-helpers "^1.0.1"
+    es-errors "^1.3.0"
+    gopd "^1.2.0"
 
-dotenv@10.0.0:
-  version "10.0.0"
-  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-10.0.0.tgz#3d4227b8fb95f81096cdd2b66653fb2c7085ba81"
-  integrity sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==
+eastasianwidth@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/eastasianwidth/-/eastasianwidth-0.2.0.tgz#696ce2ec0aa0e6ea93a397ffcf24aa7840c827cb"
+  integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
 
-editorconfig@^0.15.3:
-  version "0.15.3"
-  resolved "https://registry.yarnpkg.com/editorconfig/-/editorconfig-0.15.3.tgz#bef84c4e75fb8dcb0ce5cee8efd51c15999befc5"
-  integrity sha512-M9wIMFx96vq0R4F+gRpY3o2exzb8hEj/n9S8unZtHSvYjibBp/iMufSzvmOcV/laG0ZtuTVGtiJggPOSW2r93g==
+editorconfig@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/editorconfig/-/editorconfig-1.0.4.tgz#040c9a8e9a6c5288388b87c2db07028aa89f53a3"
+  integrity sha512-L9Qe08KWTlqYMVvMcTIvMAdl1cDUubzRNYL+WfA4bLDMHe4nemKkpmYzkznE1FwLKu0EEmy6obgQKzMJrg4x9Q==
   dependencies:
-    commander "^2.19.0"
-    lru-cache "^4.1.5"
-    semver "^5.6.0"
-    sigmund "^1.0.1"
+    "@one-ini/wasm" "0.1.1"
+    commander "^10.0.0"
+    minimatch "9.0.1"
+    semver "^7.5.3"
 
 ee-first@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
+  integrity sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==
 
-ejs@3.1.8:
-  version "3.1.8"
-  resolved "https://registry.yarnpkg.com/ejs/-/ejs-3.1.8.tgz#758d32910c78047585c7ef1f92f9ee041c1c190b"
-  integrity sha512-/sXZeMlhS0ArkfX2Aw780gJzXSMPnKjtspYZv+f3NiKLlubezAHDU5+9xz6gd3/NhG3txQCo6xlglmTS+oTGEQ==
+ejs@^3.1.10:
+  version "3.1.10"
+  resolved "https://registry.yarnpkg.com/ejs/-/ejs-3.1.10.tgz#69ab8358b14e896f80cc39e62087b88500c3ac3b"
+  integrity sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==
   dependencies:
     jake "^10.8.5"
 
-electron-to-chromium@^1.4.172:
-  version "1.4.187"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.187.tgz#b884493df00816dc2ce928958c4f6a51a93fe1a8"
-  integrity sha512-t3iFLHVIMhB8jGZ+8ui951nz6Bna5qKfhxezG3wzXdBJ79qFKPsE2chjjVFNqC1ewhfrPQrw9pmVeo4FFpZeQA==
+electron-to-chromium@^1.5.173:
+  version "1.5.191"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.5.191.tgz#8ae49a471447b1ceaf1d4d183a9000082f52363c"
+  integrity sha512-xcwe9ELcuxYLUFqZZxL19Z6HVKcvNkIwhbHUz7L3us6u12yR+7uY89dSl570f/IqNthx8dAw3tojG7i4Ni4tDA==
 
-electron-to-chromium@^1.4.202:
-  version "1.4.219"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.219.tgz#a7a672304b6aa4f376918d3f63a47f2c3906009a"
-  integrity sha512-zoQJsXOUw0ZA0YxbjkmzBumAJRtr6je5JySuL/bAoFs0DuLiLJ+5FzRF7/ZayihxR2QcewlRZVm5QZdUhwjOgA==
-
-electron-to-chromium@^1.4.251:
-  version "1.4.276"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.276.tgz#17837b19dafcc43aba885c4689358b298c19b520"
-  integrity sha512-EpuHPqu8YhonqLBXHoU6hDJCD98FCe6KDoet3/gY1qsQ6usjJoHqBH2YIVs8FXaAtHwVL8Uqa/fsYao/vq9VWQ==
-
-electron-to-chromium@^1.4.668:
-  version "1.4.690"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.690.tgz#dd5145d45c49c08a9a6f7454127e660bdf9a3fa7"
-  integrity sha512-+2OAGjUx68xElQhydpcbqH50hE8Vs2K6TkAeLhICYfndb67CVH0UsZaijmRUE3rHlIxU1u0jxwhgVe6fK3YANA==
+electron-to-chromium@^1.5.204, electron-to-chromium@^1.5.73:
+  version "1.5.208"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.5.208.tgz#609c29502fd7257b4d721e3446f3ae391a0ca1b3"
+  integrity sha512-ozZyibehoe7tOhNaf16lKmljVf+3npZcJIEbJRVftVsmAg5TeA1mGS9dVCZzOwr2xT7xK15V0p7+GZqSPgkuPg==
 
 emoji-regex@^8.0.0:
   version "8.0.0"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-8.0.0.tgz#e818fd69ce5ccfcb404594f842963bf53164cc37"
   integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==
 
-emojis-list@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
+emoji-regex@^9.2.2:
+  version "9.2.2"
+  resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-9.2.2.tgz#840c8803b0d8047f4ff0cf963176b32d4ef3ed72"
+  integrity sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==
 
-emojis-list@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
-  integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==
+encodeurl@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-2.0.0.tgz#7b8ea898077d7e409d3ac45474ea38eaf0857a58"
+  integrity sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==
 
-encode-utf8@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/encode-utf8/-/encode-utf8-1.0.3.tgz#f30fdd31da07fb596f281beb2f6b027851994cda"
-  integrity sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==
-
-encodeurl@~1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
-
-end-of-stream@^1.1.0:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.1.tgz#ed29634d19baba463b6ce6b80a37213eab71ec43"
+end-of-stream@^1.1.0, end-of-stream@^1.4.1:
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0"
+  integrity sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==
   dependencies:
     once "^1.4.0"
 
-engine.io-parser@~5.2.1:
-  version "5.2.3"
-  resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-5.2.3.tgz#00dc5b97b1f233a23c9398d0209504cf5f94d92f"
-  integrity sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==
-
-engine.io@~6.5.2:
-  version "6.5.5"
-  resolved "https://registry.yarnpkg.com/engine.io/-/engine.io-6.5.5.tgz#430b80d8840caab91a50e9e23cb551455195fc93"
-  integrity sha512-C5Pn8Wk+1vKBoHghJODM63yk8MvrO9EWZUfkAt5HAqIgPE4/8FF0PEGHXtEd40l223+cE5ABWuPzm38PHFXfMA==
-  dependencies:
-    "@types/cookie" "^0.4.1"
-    "@types/cors" "^2.8.12"
-    "@types/node" ">=10.0.0"
-    accepts "~1.3.4"
-    base64id "2.0.0"
-    cookie "~0.4.1"
-    cors "~2.8.5"
-    debug "~4.3.1"
-    engine.io-parser "~5.2.1"
-    ws "~8.17.1"
-
-enhanced-resolve@^5.10.0:
-  version "5.10.0"
-  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.10.0.tgz#0dc579c3bb2a1032e357ac45b8f3a6f3ad4fb1e6"
-  integrity sha512-T0yTFjdpldGY8PmuXXR0PyQ1ufZpEGiHVrp7zHKB7jdR4qlmZHhONVM5AQOAWXuF/w3dnHbEQVrNptJgt7F+cQ==
+enhanced-resolve@^5.17.1:
+  version "5.18.1"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.18.1.tgz#728ab082f8b7b6836de51f1637aab5d3b9568faf"
+  integrity sha512-ZSW3ma5GkcQBIpwZTSRAI8N71Uuwgs93IezB7mf7R60tC8ZbJideoDNKjHn2O9KIlx6rkGTTEk1xUCK2E1Y2Yg==
   dependencies:
     graceful-fs "^4.2.4"
     tapable "^2.2.0"
 
-ent@~2.2.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/ent/-/ent-2.2.0.tgz#e964219325a21d05f44466a2f686ed6ce5f5dd1d"
-
-entities@^2.0.0, entities@^2.2.0:
+entities@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55"
   integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
 
-entities@^4.2.0, entities@^4.3.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/entities/-/entities-4.4.0.tgz#97bdaba170339446495e653cfd2db78962900174"
-  integrity sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==
-
-entities@^4.5.0:
+entities@^4.2.0, entities@^4.4.0, entities@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/entities/-/entities-4.5.0.tgz#5d268ea5e7113ec74c4d033b79ea5a35a488fb48"
   integrity sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==
 
-envinfo@7.8.1:
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-7.8.1.tgz#06377e3e5f4d379fea7ac592d5ad8927e0c4d475"
-  integrity sha512-/o+BXHmB7ocbHEAs6F2EnG0ogybVVUdkRunTT2glZU9XAaGmhqskrvKwqXuDfNjEO0LZKWdejEEpnq8aM0tOaw==
+env-paths@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/env-paths/-/env-paths-2.2.1.tgz#420399d416ce1fbe9bc0a07c62fa68d67fd0f8f2"
+  integrity sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==
 
-errno@^0.1.3:
-  version "0.1.7"
-  resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.7.tgz#4684d71779ad39af177e3f007996f7c67c852618"
-  dependencies:
-    prr "~1.0.1"
+envinfo@7.11.0:
+  version "7.11.0"
+  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-7.11.0.tgz#c3793f44284a55ff8c82faf1ffd91bc6478ea01f"
+  integrity sha512-G9/6xF1FPbIw0TtalAMaVPpiq2aDEuKLXM314jPVAO9r2fo2a4BLqMNkmRS7O/xPPZ+COAhGIz3ETvHEV3eUcg==
 
 error-ex@^1.3.1:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf"
+  integrity sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==
   dependencies:
     is-arrayish "^0.2.1"
 
-es-abstract@^1.19.0:
-  version "1.19.1"
-  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.19.1.tgz#d4885796876916959de78edaa0df456627115ec3"
-  integrity sha512-2vJ6tjA/UfqLm2MPs7jxVybLoB8i1t1Jd9R3kISld20sIxPcTbLuggQOUxeWeAvIUkduv/CfMjuh4WmiXr2v9w==
+es-abstract@^1.23.2, es-abstract@^1.23.5, es-abstract@^1.23.9:
+  version "1.23.9"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.23.9.tgz#5b45994b7de78dada5c1bebf1379646b32b9d606"
+  integrity sha512-py07lI0wjxAC/DcfK1S6G7iANonniZwTISvdPzk9hzeH0IZIshbuuFxLIU96OyF89Yb9hiqWn8M/bY83KY5vzA==
   dependencies:
-    call-bind "^1.0.2"
-    es-to-primitive "^1.2.1"
-    function-bind "^1.1.1"
-    get-intrinsic "^1.1.1"
-    get-symbol-description "^1.0.0"
-    has "^1.0.3"
-    has-symbols "^1.0.2"
-    internal-slot "^1.0.3"
-    is-callable "^1.2.4"
-    is-negative-zero "^2.0.1"
-    is-regex "^1.1.4"
-    is-shared-array-buffer "^1.0.1"
-    is-string "^1.0.7"
-    is-weakref "^1.0.1"
-    object-inspect "^1.11.0"
-    object-keys "^1.1.1"
-    object.assign "^4.1.2"
-    string.prototype.trimend "^1.0.4"
-    string.prototype.trimstart "^1.0.4"
-    unbox-primitive "^1.0.1"
-
-es-abstract@^1.20.4:
-  version "1.21.1"
-  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.21.1.tgz#e6105a099967c08377830a0c9cb589d570dd86c6"
-  integrity sha512-QudMsPOz86xYz/1dG1OuGBKOELjCh99IIWHLzy5znUB6j8xG2yMA7bfTV86VSqKF+Y/H08vQPR+9jyXpuC6hfg==
-  dependencies:
-    available-typed-arrays "^1.0.5"
-    call-bind "^1.0.2"
-    es-set-tostringtag "^2.0.1"
-    es-to-primitive "^1.2.1"
-    function-bind "^1.1.1"
-    function.prototype.name "^1.1.5"
-    get-intrinsic "^1.1.3"
-    get-symbol-description "^1.0.0"
-    globalthis "^1.0.3"
-    gopd "^1.0.1"
-    has "^1.0.3"
-    has-property-descriptors "^1.0.0"
-    has-proto "^1.0.1"
-    has-symbols "^1.0.3"
-    internal-slot "^1.0.4"
-    is-array-buffer "^3.0.1"
+    array-buffer-byte-length "^1.0.2"
+    arraybuffer.prototype.slice "^1.0.4"
+    available-typed-arrays "^1.0.7"
+    call-bind "^1.0.8"
+    call-bound "^1.0.3"
+    data-view-buffer "^1.0.2"
+    data-view-byte-length "^1.0.2"
+    data-view-byte-offset "^1.0.1"
+    es-define-property "^1.0.1"
+    es-errors "^1.3.0"
+    es-object-atoms "^1.0.0"
+    es-set-tostringtag "^2.1.0"
+    es-to-primitive "^1.3.0"
+    function.prototype.name "^1.1.8"
+    get-intrinsic "^1.2.7"
+    get-proto "^1.0.0"
+    get-symbol-description "^1.1.0"
+    globalthis "^1.0.4"
+    gopd "^1.2.0"
+    has-property-descriptors "^1.0.2"
+    has-proto "^1.2.0"
+    has-symbols "^1.1.0"
+    hasown "^2.0.2"
+    internal-slot "^1.1.0"
+    is-array-buffer "^3.0.5"
     is-callable "^1.2.7"
-    is-negative-zero "^2.0.2"
-    is-regex "^1.1.4"
-    is-shared-array-buffer "^1.0.2"
-    is-string "^1.0.7"
-    is-typed-array "^1.1.10"
-    is-weakref "^1.0.2"
-    object-inspect "^1.12.2"
+    is-data-view "^1.0.2"
+    is-regex "^1.2.1"
+    is-shared-array-buffer "^1.0.4"
+    is-string "^1.1.1"
+    is-typed-array "^1.1.15"
+    is-weakref "^1.1.0"
+    math-intrinsics "^1.1.0"
+    object-inspect "^1.13.3"
     object-keys "^1.1.1"
-    object.assign "^4.1.4"
-    regexp.prototype.flags "^1.4.3"
-    safe-regex-test "^1.0.0"
-    string.prototype.trimend "^1.0.6"
-    string.prototype.trimstart "^1.0.6"
-    typed-array-length "^1.0.4"
-    unbox-primitive "^1.0.2"
-    which-typed-array "^1.1.9"
+    object.assign "^4.1.7"
+    own-keys "^1.0.1"
+    regexp.prototype.flags "^1.5.3"
+    safe-array-concat "^1.1.3"
+    safe-push-apply "^1.0.0"
+    safe-regex-test "^1.1.0"
+    set-proto "^1.0.0"
+    string.prototype.trim "^1.2.10"
+    string.prototype.trimend "^1.0.9"
+    string.prototype.trimstart "^1.0.8"
+    typed-array-buffer "^1.0.3"
+    typed-array-byte-length "^1.0.3"
+    typed-array-byte-offset "^1.0.4"
+    typed-array-length "^1.0.7"
+    unbox-primitive "^1.1.0"
+    which-typed-array "^1.1.18"
 
-es-module-lexer@^0.9.0:
-  version "0.9.3"
-  resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-0.9.3.tgz#6f13db00cc38417137daf74366f535c8eb438f19"
-  integrity sha512-1HQ2M2sPtxwnvOvT1ZClHyQDiggdNjURWpY2we6aMKCQiUVxTmVs2UYPLIrD84sS+kMdUwfBSylbJPwNnBrnHQ==
-
-es-set-tostringtag@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/es-set-tostringtag/-/es-set-tostringtag-2.0.1.tgz#338d502f6f674301d710b80c8592de8a15f09cd8"
-  integrity sha512-g3OMbtlwY3QewlqAiMLI47KywjWZoEytKr8pf6iTC8uJq5bIAH52Z9pnQ8pVL6whrCto53JZDuUIsifGeLorTg==
+es-abstract@^1.24.0:
+  version "1.24.0"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.24.0.tgz#c44732d2beb0acc1ed60df840869e3106e7af328"
+  integrity sha512-WSzPgsdLtTcQwm4CROfS5ju2Wa1QQcVeT37jFjYzdFz1r9ahadC8B8/a4qxJxM+09F18iumCdRmlr96ZYkQvEg==
   dependencies:
+    array-buffer-byte-length "^1.0.2"
+    arraybuffer.prototype.slice "^1.0.4"
+    available-typed-arrays "^1.0.7"
+    call-bind "^1.0.8"
+    call-bound "^1.0.4"
+    data-view-buffer "^1.0.2"
+    data-view-byte-length "^1.0.2"
+    data-view-byte-offset "^1.0.1"
+    es-define-property "^1.0.1"
+    es-errors "^1.3.0"
+    es-object-atoms "^1.1.1"
+    es-set-tostringtag "^2.1.0"
+    es-to-primitive "^1.3.0"
+    function.prototype.name "^1.1.8"
+    get-intrinsic "^1.3.0"
+    get-proto "^1.0.1"
+    get-symbol-description "^1.1.0"
+    globalthis "^1.0.4"
+    gopd "^1.2.0"
+    has-property-descriptors "^1.0.2"
+    has-proto "^1.2.0"
+    has-symbols "^1.1.0"
+    hasown "^2.0.2"
+    internal-slot "^1.1.0"
+    is-array-buffer "^3.0.5"
+    is-callable "^1.2.7"
+    is-data-view "^1.0.2"
+    is-negative-zero "^2.0.3"
+    is-regex "^1.2.1"
+    is-set "^2.0.3"
+    is-shared-array-buffer "^1.0.4"
+    is-string "^1.1.1"
+    is-typed-array "^1.1.15"
+    is-weakref "^1.1.1"
+    math-intrinsics "^1.1.0"
+    object-inspect "^1.13.4"
+    object-keys "^1.1.1"
+    object.assign "^4.1.7"
+    own-keys "^1.0.1"
+    regexp.prototype.flags "^1.5.4"
+    safe-array-concat "^1.1.3"
+    safe-push-apply "^1.0.0"
+    safe-regex-test "^1.1.0"
+    set-proto "^1.0.0"
+    stop-iteration-iterator "^1.1.0"
+    string.prototype.trim "^1.2.10"
+    string.prototype.trimend "^1.0.9"
+    string.prototype.trimstart "^1.0.8"
+    typed-array-buffer "^1.0.3"
+    typed-array-byte-length "^1.0.3"
+    typed-array-byte-offset "^1.0.4"
+    typed-array-length "^1.0.7"
+    unbox-primitive "^1.1.0"
+    which-typed-array "^1.1.19"
+
+es-define-property@^1.0.0, es-define-property@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/es-define-property/-/es-define-property-1.0.1.tgz#983eb2f9a6724e9303f61addf011c72e09e0b0fa"
+  integrity sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==
+
+es-errors@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/es-errors/-/es-errors-1.3.0.tgz#05f75a25dab98e4fb1dcd5e1472c0546d5057c8f"
+  integrity sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==
+
+es-get-iterator@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/es-get-iterator/-/es-get-iterator-1.1.3.tgz#3ef87523c5d464d41084b2c3c9c214f1199763d6"
+  integrity sha512-sPZmqHBe6JIiTfN5q2pEi//TwxmAFHwj/XEuYjTuse78i8KxaqMTTzxPoFKuzRpDpTJ+0NAbpfenkmH2rePtuw==
+  dependencies:
+    call-bind "^1.0.2"
     get-intrinsic "^1.1.3"
-    has "^1.0.3"
-    has-tostringtag "^1.0.0"
+    has-symbols "^1.0.3"
+    is-arguments "^1.1.1"
+    is-map "^2.0.2"
+    is-set "^2.0.2"
+    is-string "^1.0.7"
+    isarray "^2.0.5"
+    stop-iteration-iterator "^1.0.0"
 
-es-shim-unscopables@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/es-shim-unscopables/-/es-shim-unscopables-1.0.0.tgz#702e632193201e3edf8713635d083d378e510241"
-  integrity sha512-Jm6GPcCdC30eMLbZ2x8z2WuRwAws3zTBBKuusffYVUrNj/GVSUAZ+xKMaUpfNDR5IbyNA5LJbaecoUVbmUcB1w==
+es-module-lexer@^1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-1.7.0.tgz#9159601561880a85f2734560a9099b2c31e5372a"
+  integrity sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==
+
+es-object-atoms@^1.0.0, es-object-atoms@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/es-object-atoms/-/es-object-atoms-1.1.1.tgz#1c4f2c4837327597ce69d2ca190a7fdd172338c1"
+  integrity sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==
   dependencies:
-    has "^1.0.3"
+    es-errors "^1.3.0"
 
-es-to-primitive@^1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
-  integrity sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==
+es-set-tostringtag@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz#f31dbbe0c183b00a6d26eb6325c810c0fd18bd4d"
+  integrity sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==
   dependencies:
-    is-callable "^1.1.4"
-    is-date-object "^1.0.1"
-    is-symbol "^1.0.2"
+    es-errors "^1.3.0"
+    get-intrinsic "^1.2.6"
+    has-tostringtag "^1.0.2"
+    hasown "^2.0.2"
 
-escalade@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40"
-  integrity sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==
+es-shim-unscopables@^1.0.2, es-shim-unscopables@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/es-shim-unscopables/-/es-shim-unscopables-1.1.0.tgz#438df35520dac5d105f3943d927549ea3b00f4b5"
+  integrity sha512-d9T8ucsEhh8Bi1woXCf+TIKDIROLG5WCkxg8geBCbvk22kzwC5G2OnXVMO6FUsvQlgUUXQ2itephWDLqDzbeCw==
+  dependencies:
+    hasown "^2.0.2"
 
-escape-html@1.0.3, escape-html@~1.0.3:
+es-to-primitive@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.3.0.tgz#96c89c82cc49fd8794a24835ba3e1ff87f214e18"
+  integrity sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==
+  dependencies:
+    is-callable "^1.2.7"
+    is-date-object "^1.0.5"
+    is-symbol "^1.0.4"
+
+esbuild@^0.25.0:
+  version "0.25.10"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.25.10.tgz#37f5aa5cd14500f141be121c01b096ca83ac34a9"
+  integrity sha512-9RiGKvCwaqxO2owP61uQ4BgNborAQskMR6QusfWzQqv7AZOg5oGehdY2pRJMTKuwxd1IDBP4rSbI5lHzU7SMsQ==
+  optionalDependencies:
+    "@esbuild/aix-ppc64" "0.25.10"
+    "@esbuild/android-arm" "0.25.10"
+    "@esbuild/android-arm64" "0.25.10"
+    "@esbuild/android-x64" "0.25.10"
+    "@esbuild/darwin-arm64" "0.25.10"
+    "@esbuild/darwin-x64" "0.25.10"
+    "@esbuild/freebsd-arm64" "0.25.10"
+    "@esbuild/freebsd-x64" "0.25.10"
+    "@esbuild/linux-arm" "0.25.10"
+    "@esbuild/linux-arm64" "0.25.10"
+    "@esbuild/linux-ia32" "0.25.10"
+    "@esbuild/linux-loong64" "0.25.10"
+    "@esbuild/linux-mips64el" "0.25.10"
+    "@esbuild/linux-ppc64" "0.25.10"
+    "@esbuild/linux-riscv64" "0.25.10"
+    "@esbuild/linux-s390x" "0.25.10"
+    "@esbuild/linux-x64" "0.25.10"
+    "@esbuild/netbsd-arm64" "0.25.10"
+    "@esbuild/netbsd-x64" "0.25.10"
+    "@esbuild/openbsd-arm64" "0.25.10"
+    "@esbuild/openbsd-x64" "0.25.10"
+    "@esbuild/openharmony-arm64" "0.25.10"
+    "@esbuild/sunos-x64" "0.25.10"
+    "@esbuild/win32-arm64" "0.25.10"
+    "@esbuild/win32-ia32" "0.25.10"
+    "@esbuild/win32-x64" "0.25.10"
+
+escalade@^3.1.1, escalade@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.2.0.tgz#011a3f69856ba189dffa7dc8fcce99d2a87903e5"
+  integrity sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==
+
+escape-html@1.0.3, escape-html@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
-  integrity sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=
+  integrity sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==
 
 escape-string-regexp@4.0.0, escape-string-regexp@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
-escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
+escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
+  integrity sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==
 
-escodegen@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-2.0.0.tgz#5e32b12833e8aa8fa35e1bf0befa89380484c7dd"
-  integrity sha512-mmHKys/C8BFUGI+MAWNcSYoORYLMdPzjrknd2Vc+bUsjN5bXcr8EhrNB+UTqfL1y3I9c4fw2ihgtMPQLBRiQxw==
+escodegen@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-2.1.0.tgz#ba93bbb7a43986d29d6041f99f5262da773e2e17"
+  integrity sha512-2NlIDTwUWJN0mRPQOdtQBzbUHvdGY2P1VXSyU83Q3xKxM7WHX2Ql8dKq782Q9TgQUNOLEzEYu9bzLNj1q88I5w==
   dependencies:
     esprima "^4.0.1"
     estraverse "^5.2.0"
     esutils "^2.0.2"
-    optionator "^0.8.1"
   optionalDependencies:
     source-map "~0.6.1"
 
-eslint-config-standard@17.0.0:
-  version "17.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-17.0.0.tgz#fd5b6cf1dcf6ba8d29f200c461de2e19069888cf"
-  integrity sha512-/2ks1GKyqSOkH7JFvXJicu0iMpoojkwB+f5Du/1SC0PtBL+s8v30k9njRZ21pm2drKYm2342jFnGWzttxPmZVg==
+eslint-compat-utils@^0.5.1:
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/eslint-compat-utils/-/eslint-compat-utils-0.5.1.tgz#7fc92b776d185a70c4070d03fd26fde3d59652e4"
+  integrity sha512-3z3vFexKIEnjHE3zCMRo6fn/e44U7T1khUjg+Hp0ZQMCigh28rALD0nPFBcGZuiLC5rLZa2ubQHDRln09JfU2Q==
+  dependencies:
+    semver "^7.5.4"
+
+eslint-config-standard@17.1.0:
+  version "17.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz#40ffb8595d47a6b242e07cbfd49dc211ed128975"
+  integrity sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q==
 
 eslint-formatter-friendly@7.0.0:
   version "7.0.0"
@@ -4326,81 +4153,88 @@ eslint-formatter-friendly@7.0.0:
     strip-ansi "5.2.0"
     text-table "0.2.0"
 
-eslint-import-resolver-node@^0.3.7:
-  version "0.3.7"
-  resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.7.tgz#83b375187d412324a1963d84fa664377a23eb4d7"
-  integrity sha512-gozW2blMLJCeFpBwugLTGyvVjNoeo1knonXAcatC6bjPBZitotxdWf7Gimr25N4c0AAOo4eOUfaG82IJPDpqCA==
+eslint-import-resolver-node@^0.3.9:
+  version "0.3.9"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz#d4eaac52b8a2e7c3cd1903eb00f7e053356118ac"
+  integrity sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==
   dependencies:
     debug "^3.2.7"
-    is-core-module "^2.11.0"
-    resolve "^1.22.1"
+    is-core-module "^2.13.0"
+    resolve "^1.22.4"
 
-eslint-module-utils@^2.7.4:
-  version "2.7.4"
-  resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.7.4.tgz#4f3e41116aaf13a20792261e61d3a2e7e0583974"
-  integrity sha512-j4GT+rqzCoRKHwURX7pddtIPGySnX9Si/cgMI5ztrcqOPtk5dDEeZ34CQVPphnqkJytlc97Vuk05Um2mJ3gEQA==
+eslint-module-utils@^2.12.1:
+  version "2.12.1"
+  resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.12.1.tgz#f76d3220bfb83c057651359295ab5854eaad75ff"
+  integrity sha512-L8jSWTze7K2mTg0vos/RuLRS5soomksDPoJLXIslC7c8Wmut3bx7CPpJijDcBZtxQ5lrbUdM+s0OlNbz0DCDNw==
   dependencies:
     debug "^3.2.7"
 
-eslint-plugin-es@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-es/-/eslint-plugin-es-4.1.0.tgz#f0822f0c18a535a97c3e714e89f88586a7641ec9"
-  integrity sha512-GILhQTnjYE2WorX5Jyi5i4dz5ALWxBIdQECVQavL6s7cI76IZTDWleTHkxz/QT3kvcs2QlGHvKLYsSlPOlPXnQ==
+eslint-plugin-es-x@^7.8.0:
+  version "7.8.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-es-x/-/eslint-plugin-es-x-7.8.0.tgz#a207aa08da37a7923f2a9599e6d3eb73f3f92b74"
+  integrity sha512-7Ds8+wAAoV3T+LAKeu39Y5BzXCrGKrcISfgKEqTS4BDN8SFEDQd0S43jiQ8vIa3wUKD07qitZdfzlenSi8/0qQ==
   dependencies:
-    eslint-utils "^2.0.0"
-    regexpp "^3.0.0"
+    "@eslint-community/eslint-utils" "^4.1.2"
+    "@eslint-community/regexpp" "^4.11.0"
+    eslint-compat-utils "^0.5.1"
 
-eslint-plugin-import@2.27.5:
-  version "2.27.5"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz#876a6d03f52608a3e5bb439c2550588e51dd6c65"
-  integrity sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow==
+eslint-plugin-import@2.32.0:
+  version "2.32.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.32.0.tgz#602b55faa6e4caeaa5e970c198b5c00a37708980"
+  integrity sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==
   dependencies:
-    array-includes "^3.1.6"
-    array.prototype.flat "^1.3.1"
-    array.prototype.flatmap "^1.3.1"
+    "@rtsao/scc" "^1.1.0"
+    array-includes "^3.1.9"
+    array.prototype.findlastindex "^1.2.6"
+    array.prototype.flat "^1.3.3"
+    array.prototype.flatmap "^1.3.3"
     debug "^3.2.7"
     doctrine "^2.1.0"
-    eslint-import-resolver-node "^0.3.7"
-    eslint-module-utils "^2.7.4"
-    has "^1.0.3"
-    is-core-module "^2.11.0"
+    eslint-import-resolver-node "^0.3.9"
+    eslint-module-utils "^2.12.1"
+    hasown "^2.0.2"
+    is-core-module "^2.16.1"
     is-glob "^4.0.3"
     minimatch "^3.1.2"
-    object.values "^1.1.6"
-    resolve "^1.22.1"
-    semver "^6.3.0"
-    tsconfig-paths "^3.14.1"
+    object.fromentries "^2.0.8"
+    object.groupby "^1.0.3"
+    object.values "^1.2.1"
+    semver "^6.3.1"
+    string.prototype.trimend "^1.0.9"
+    tsconfig-paths "^3.15.0"
 
-eslint-plugin-n@15.6.1:
-  version "15.6.1"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-n/-/eslint-plugin-n-15.6.1.tgz#f7e77f24abb92a550115cf11e29695da122c398c"
-  integrity sha512-R9xw9OtCRxxaxaszTQmQAlPgM+RdGjaL1akWuY/Fv9fRAi8Wj4CUKc6iYVG8QNRjRuo8/BqVYIpfqberJUEacA==
+eslint-plugin-n@17.23.1:
+  version "17.23.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-n/-/eslint-plugin-n-17.23.1.tgz#467db2aba0ead574ea6150143d079d544c11cf48"
+  integrity sha512-68PealUpYoHOBh332JLLD9Sj7OQUDkFpmcfqt8R9sySfFSeuGJjMTJQvCRRB96zO3A/PELRLkPrzsHmzEFQQ5A==
   dependencies:
-    builtins "^5.0.1"
-    eslint-plugin-es "^4.1.0"
-    eslint-utils "^3.0.0"
-    ignore "^5.1.1"
-    is-core-module "^2.11.0"
-    minimatch "^3.1.2"
-    resolve "^1.22.1"
-    semver "^7.3.8"
+    "@eslint-community/eslint-utils" "^4.5.0"
+    enhanced-resolve "^5.17.1"
+    eslint-plugin-es-x "^7.8.0"
+    get-tsconfig "^4.8.1"
+    globals "^15.11.0"
+    globrex "^0.1.2"
+    ignore "^5.3.2"
+    semver "^7.6.3"
+    ts-declaration-location "^1.0.6"
 
-eslint-plugin-promise@6.1.1:
-  version "6.1.1"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz#269a3e2772f62875661220631bd4dafcb4083816"
-  integrity sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig==
-
-eslint-plugin-vue@9.9.0:
-  version "9.9.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-9.9.0.tgz#ac788ebccd2eb94d846a507df55da50693b80c91"
-  integrity sha512-YbubS7eK0J7DCf0U2LxvVP7LMfs6rC6UltihIgval3azO3gyDwEGVgsCMe1TmDiEkl6GdMKfRpaME6QxIYtzDQ==
+eslint-plugin-promise@7.2.1:
+  version "7.2.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-7.2.1.tgz#a0652195700aea40b926dc3c74b38e373377bfb0"
+  integrity sha512-SWKjd+EuvWkYaS+uN2csvj0KoP43YTu7+phKQ5v+xw6+A0gutVX2yqCeCkC3uLCJFiPfR2dD8Es5L7yUsmvEaA==
   dependencies:
-    eslint-utils "^3.0.0"
+    "@eslint-community/eslint-utils" "^4.4.0"
+
+eslint-plugin-vue@10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-10.5.0.tgz#61566528a85e2546b50534914cb44a077983c49f"
+  integrity sha512-7BZHsG3kC2vei8F2W8hnfDi9RK+cv5eKPMvzBdrl8Vuc0hR5odGQRli8VVzUkrmUHkxFEm4Iio1r5HOKslO0Aw==
+  dependencies:
+    "@eslint-community/eslint-utils" "^4.4.0"
     natural-compare "^1.4.0"
-    nth-check "^2.0.1"
-    postcss-selector-parser "^6.0.9"
-    semver "^7.3.5"
-    vue-eslint-parser "^9.0.1"
+    nth-check "^2.1.1"
+    postcss-selector-parser "^6.0.15"
+    semver "^7.6.3"
     xml-name-validator "^4.0.0"
 
 eslint-scope@5.1.1:
@@ -4411,135 +4245,110 @@ eslint-scope@5.1.1:
     esrecurse "^4.3.0"
     estraverse "^4.1.1"
 
-eslint-scope@^7.1.1:
-  version "7.1.1"
-  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-7.1.1.tgz#fff34894c2f65e5226d3041ac480b4513a163642"
-  integrity sha512-QKQM/UXpIiHcLqJ5AOyIW7XZmzjkzQXYE54n1++wb0u9V/abW3l9uQnxX8Z5Xd18xyKIMTUAyQ0k1e8pz6LUrw==
+eslint-scope@^8.2.0:
+  version "8.3.0"
+  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-8.3.0.tgz#10cd3a918ffdd722f5f3f7b5b83db9b23c87340d"
+  integrity sha512-pUNxi75F8MJ/GdeKtVLSbYg4ZI34J6C0C7sbL4YOp2exGwen7ZsuBqKzUhXd0qMQ362yET3z+uPwKeg/0C2XCQ==
   dependencies:
     esrecurse "^4.3.0"
     estraverse "^5.2.0"
 
-eslint-utils@^2.0.0, eslint-utils@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27"
-  integrity sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==
+eslint-scope@^8.4.0:
+  version "8.4.0"
+  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-8.4.0.tgz#88e646a207fad61436ffa39eb505147200655c82"
+  integrity sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==
   dependencies:
-    eslint-visitor-keys "^1.1.0"
+    esrecurse "^4.3.0"
+    estraverse "^5.2.0"
 
-eslint-utils@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672"
-  integrity sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==
-  dependencies:
-    eslint-visitor-keys "^2.0.0"
-
-eslint-visitor-keys@^1.1.0, eslint-visitor-keys@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e"
-  integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==
-
-eslint-visitor-keys@^2.0.0, eslint-visitor-keys@^2.1.0:
+eslint-visitor-keys@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303"
   integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==
 
-eslint-visitor-keys@^3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.3.0.tgz#f6480fa6b1f30efe2d1968aa8ac745b862469826"
-  integrity sha512-mQ+suqKJVyeuwGYHAdjMFqjCyfl8+Ldnxuyp3ldiMBFKkvytrXUZWaiPCEav8qDHKty44bD+qV1IP4T+w+xXRA==
+eslint-visitor-keys@^3.4.3:
+  version "3.4.3"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz#0cd72fe8550e3c2eae156a96a4dddcd1c8ac5800"
+  integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
 
-eslint-webpack-plugin@3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/eslint-webpack-plugin/-/eslint-webpack-plugin-3.2.0.tgz#1978cdb9edc461e4b0195a20da950cf57988347c"
-  integrity sha512-avrKcGncpPbPSUHX6B3stNGzkKFto3eL+DKM4+VyMrVnhPc3vRczVlCq3uhuFOdRvDHTVXuzwk1ZKUrqDQHQ9w==
-  dependencies:
-    "@types/eslint" "^7.29.0 || ^8.4.1"
-    jest-worker "^28.0.2"
-    micromatch "^4.0.5"
-    normalize-path "^3.0.0"
-    schema-utils "^4.0.0"
+eslint-visitor-keys@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz#687bacb2af884fcdda8a6e7d65c606f46a14cd45"
+  integrity sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==
 
-eslint@8.33.0:
-  version "8.33.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.33.0.tgz#02f110f32998cb598c6461f24f4d306e41ca33d7"
-  integrity sha512-WjOpFQgKK8VrCnAtl8We0SUOy/oVZ5NHykyMiagV1M9r8IFpIJX7DduK6n1mpfhlG7T1NLWm2SuD8QB7KFySaA==
+eslint-visitor-keys@^4.2.1:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz#4cfea60fe7dd0ad8e816e1ed026c1d5251b512c1"
+  integrity sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==
+
+eslint@9.37.0:
+  version "9.37.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-9.37.0.tgz#ac0222127f76b09c0db63036f4fe289562072d74"
+  integrity sha512-XyLmROnACWqSxiGYArdef1fItQd47weqB7iwtfr9JHwRrqIXZdcFMvvEcL9xHCmL0SNsOvF0c42lWyM1U5dgig==
   dependencies:
-    "@eslint/eslintrc" "^1.4.1"
-    "@humanwhocodes/config-array" "^0.11.8"
+    "@eslint-community/eslint-utils" "^4.8.0"
+    "@eslint-community/regexpp" "^4.12.1"
+    "@eslint/config-array" "^0.21.0"
+    "@eslint/config-helpers" "^0.4.0"
+    "@eslint/core" "^0.16.0"
+    "@eslint/eslintrc" "^3.3.1"
+    "@eslint/js" "9.37.0"
+    "@eslint/plugin-kit" "^0.4.0"
+    "@humanfs/node" "^0.16.6"
     "@humanwhocodes/module-importer" "^1.0.1"
-    "@nodelib/fs.walk" "^1.2.8"
-    ajv "^6.10.0"
+    "@humanwhocodes/retry" "^0.4.2"
+    "@types/estree" "^1.0.6"
+    "@types/json-schema" "^7.0.15"
+    ajv "^6.12.4"
     chalk "^4.0.0"
-    cross-spawn "^7.0.2"
+    cross-spawn "^7.0.6"
     debug "^4.3.2"
-    doctrine "^3.0.0"
     escape-string-regexp "^4.0.0"
-    eslint-scope "^7.1.1"
-    eslint-utils "^3.0.0"
-    eslint-visitor-keys "^3.3.0"
-    espree "^9.4.0"
-    esquery "^1.4.0"
+    eslint-scope "^8.4.0"
+    eslint-visitor-keys "^4.2.1"
+    espree "^10.4.0"
+    esquery "^1.5.0"
     esutils "^2.0.2"
     fast-deep-equal "^3.1.3"
-    file-entry-cache "^6.0.1"
+    file-entry-cache "^8.0.0"
     find-up "^5.0.0"
     glob-parent "^6.0.2"
-    globals "^13.19.0"
-    grapheme-splitter "^1.0.4"
     ignore "^5.2.0"
-    import-fresh "^3.0.0"
     imurmurhash "^0.1.4"
     is-glob "^4.0.0"
-    is-path-inside "^3.0.3"
-    js-sdsl "^4.1.4"
-    js-yaml "^4.1.0"
     json-stable-stringify-without-jsonify "^1.0.1"
-    levn "^0.4.1"
     lodash.merge "^4.6.2"
     minimatch "^3.1.2"
     natural-compare "^1.4.0"
-    optionator "^0.9.1"
-    regexpp "^3.2.0"
-    strip-ansi "^6.0.1"
-    strip-json-comments "^3.1.0"
-    text-table "^0.2.0"
+    optionator "^0.9.3"
 
-espree@^6.0.0:
-  version "6.2.1"
-  resolved "https://registry.yarnpkg.com/espree/-/espree-6.2.1.tgz#77fc72e1fd744a2052c20f38a5b575832e82734a"
-  integrity sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==
+espree@^10.0.1, espree@^10.3.0:
+  version "10.3.0"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-10.3.0.tgz#29267cf5b0cb98735b65e64ba07e0ed49d1eed8a"
+  integrity sha512-0QYC8b24HWY8zjRnDTL6RiHfDbAWn63qb4LMj1Z4b076A4une81+z03Kg7l7mn/48PUTqoLptSXez8oknU8Clg==
   dependencies:
-    acorn "^7.1.1"
-    acorn-jsx "^5.2.0"
-    eslint-visitor-keys "^1.1.0"
-
-espree@^9.3.1:
-  version "9.3.2"
-  resolved "https://registry.yarnpkg.com/espree/-/espree-9.3.2.tgz#f58f77bd334731182801ced3380a8cc859091596"
-  integrity sha512-D211tC7ZwouTIuY5x9XnS0E9sWNChB7IYKX/Xp5eQj3nFXhqmiUDB9q27y76oFl8jTg3pXcQx/bpxMfs3CIZbA==
-  dependencies:
-    acorn "^8.7.1"
+    acorn "^8.14.0"
     acorn-jsx "^5.3.2"
-    eslint-visitor-keys "^3.3.0"
+    eslint-visitor-keys "^4.2.0"
 
-espree@^9.4.0:
-  version "9.4.0"
-  resolved "https://registry.yarnpkg.com/espree/-/espree-9.4.0.tgz#cd4bc3d6e9336c433265fc0aa016fc1aaf182f8a"
-  integrity sha512-DQmnRpLj7f6TgN/NYb0MTzJXL+vJF9h3pHy4JhCIs3zwcgez8xmGg3sXHcEO97BrmO2OSvCwMdfdlyl+E9KjOw==
+espree@^10.4.0:
+  version "10.4.0"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-10.4.0.tgz#d54f4949d4629005a1fa168d937c3ff1f7e2a837"
+  integrity sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==
   dependencies:
-    acorn "^8.8.0"
+    acorn "^8.15.0"
     acorn-jsx "^5.3.2"
-    eslint-visitor-keys "^3.3.0"
+    eslint-visitor-keys "^4.2.1"
 
 esprima@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
   integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
 
-esquery@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.4.0.tgz#2148ffc38b82e8c7057dfed48425b3e61f0f24a5"
-  integrity sha512-cCDispWt5vHHtwMY2YrAQ4ibFkAL8RbH5YGBnZBc90MolvvfkkQcJro/aZiAQUlQ3qgrYS6D6v8Gc5G5CQsc9w==
+esquery@^1.5.0, esquery@^1.6.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.6.0.tgz#91419234f804d852a82dceec3e16cdc22cf9dae7"
+  integrity sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==
   dependencies:
     estraverse "^5.1.0"
 
@@ -4551,8 +4360,9 @@ esrecurse@^4.3.0:
     estraverse "^5.2.0"
 
 estraverse@^4.1.1:
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.2.0.tgz#0dee3fed31fcd469618ce7342099fc1afa0bdb13"
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d"
+  integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==
 
 estraverse@^5.1.0, estraverse@^5.2.0:
   version "5.3.0"
@@ -4564,67 +4374,87 @@ estree-walker@^2.0.2:
   resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
   integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==
 
-esutils@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
+estree-walker@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-3.0.3.tgz#67c3e549ec402a487b4fc193d1953a524752340d"
+  integrity sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==
+  dependencies:
+    "@types/estree" "^1.0.0"
 
-etag@~1.8.1:
+esutils@^2.0.2:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
+  integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
+
+etag@^1.8.1:
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887"
+  integrity sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==
 
 eventemitter3@^4.0.0:
   version "4.0.7"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.7.tgz#2de9b68f6528d5644ef5c59526a1b4a07306169f"
   integrity sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==
 
-events@^3.2.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/events/-/events-3.3.0.tgz#31a95ad0a924e2d2c419a813aeb2c4e878ea7400"
-  integrity sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==
-
 eventsource-polyfill@0.9.6:
   version "0.9.6"
   resolved "https://registry.yarnpkg.com/eventsource-polyfill/-/eventsource-polyfill-0.9.6.tgz#10e0d187f111b167f28fdab918843ce7d818f13c"
-  integrity sha1-EODRh/ERsWfyj9q5GIQ859gY8Tw=
+  integrity sha512-LyMFp2oPDGhum2lMvkjqKZEwWd2/AoXyt8aoyftTBMWwPHNgU+2tdxhTHPluDxoz+z4gNj0uHAPR9nqevATMbg==
 
-express@4.18.2:
-  version "4.18.2"
-  resolved "https://registry.yarnpkg.com/express/-/express-4.18.2.tgz#3fabe08296e930c796c19e3c516979386ba9fd59"
-  integrity sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfz1aUwU9vHZ+J7gyvwdQXFEBIEIaxeGf0GIcreATNyBExtalisDbuMqQ==
+execa@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/execa/-/execa-5.1.1.tgz#f80ad9cbf4298f7bd1d4c9555c21e93741c411dd"
+  integrity sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==
   dependencies:
-    accepts "~1.3.8"
-    array-flatten "1.1.1"
-    body-parser "1.20.1"
-    content-disposition "0.5.4"
-    content-type "~1.0.4"
-    cookie "0.5.0"
-    cookie-signature "1.0.6"
-    debug "2.6.9"
-    depd "2.0.0"
-    encodeurl "~1.0.2"
-    escape-html "~1.0.3"
-    etag "~1.8.1"
-    finalhandler "1.2.0"
-    fresh "0.5.2"
-    http-errors "2.0.0"
-    merge-descriptors "1.0.1"
-    methods "~1.1.2"
-    on-finished "2.4.1"
-    parseurl "~1.3.3"
-    path-to-regexp "0.1.7"
-    proxy-addr "~2.0.7"
-    qs "6.11.0"
-    range-parser "~1.2.1"
-    safe-buffer "5.2.1"
-    send "0.18.0"
-    serve-static "1.15.0"
-    setprototypeof "1.2.0"
-    statuses "2.0.1"
-    type-is "~1.6.18"
-    utils-merge "1.0.1"
-    vary "~1.1.2"
+    cross-spawn "^7.0.3"
+    get-stream "^6.0.0"
+    human-signals "^2.1.0"
+    is-stream "^2.0.0"
+    merge-stream "^2.0.0"
+    npm-run-path "^4.0.1"
+    onetime "^5.1.2"
+    signal-exit "^3.0.3"
+    strip-final-newline "^2.0.0"
 
-extend@3.0.2, extend@^3.0.0:
+expect-type@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/expect-type/-/expect-type-1.2.1.tgz#af76d8b357cf5fa76c41c09dafb79c549e75f71f"
+  integrity sha512-/kP8CAwxzLVEeFrMm4kMmy4CCDlpipyA7MYLVrdJIkV0fYF0UaigQHRsxHiuY/GEea+bh4KSv3TIlgr+2UL6bw==
+
+express@5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/express/-/express-5.1.0.tgz#d31beaf715a0016f0d53f47d3b4d7acf28c75cc9"
+  integrity sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==
+  dependencies:
+    accepts "^2.0.0"
+    body-parser "^2.2.0"
+    content-disposition "^1.0.0"
+    content-type "^1.0.5"
+    cookie "^0.7.1"
+    cookie-signature "^1.2.1"
+    debug "^4.4.0"
+    encodeurl "^2.0.0"
+    escape-html "^1.0.3"
+    etag "^1.8.1"
+    finalhandler "^2.1.0"
+    fresh "^2.0.0"
+    http-errors "^2.0.0"
+    merge-descriptors "^2.0.0"
+    mime-types "^3.0.0"
+    on-finished "^2.4.1"
+    once "^1.4.0"
+    parseurl "^1.3.3"
+    proxy-addr "^2.0.7"
+    qs "^6.14.0"
+    range-parser "^1.2.1"
+    router "^2.2.0"
+    send "^1.1.0"
+    serve-static "^2.2.0"
+    statuses "^2.0.1"
+    type-is "^2.0.1"
+    vary "^1.1.2"
+
+extend@3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
   integrity sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==
@@ -4645,119 +4475,110 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^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==
 
-fast-glob@^3.2.11, fast-glob@^3.2.9:
-  version "3.2.11"
-  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.11.tgz#a1172ad95ceb8a16e20caa5c5e56480e5129c1d9"
-  integrity sha512-xrO3+1bxSo3ZVHAnqzyuewYT6aMFHRAd4Kcs92MAonjwQZLsK9d0SF1IyQ3k5PoirxTW0Oe/RqFgMQ6TcNE5Ew==
+fast-glob@^3.2.9, fast-glob@^3.3.2, fast-glob@^3.3.3:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.3.tgz#d06d585ce8dba90a16b0505c543c3ccfb3aeb818"
+  integrity sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==
   dependencies:
     "@nodelib/fs.stat" "^2.0.2"
     "@nodelib/fs.walk" "^1.2.3"
     glob-parent "^5.1.2"
     merge2 "^1.3.0"
-    micromatch "^4.0.4"
-
-fast-glob@^3.2.12:
-  version "3.2.12"
-  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.12.tgz#7f39ec99c2e6ab030337142da9e0c18f37afae80"
-  integrity sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==
-  dependencies:
-    "@nodelib/fs.stat" "^2.0.2"
-    "@nodelib/fs.walk" "^1.2.3"
-    glob-parent "^5.1.2"
-    merge2 "^1.3.0"
-    micromatch "^4.0.4"
+    micromatch "^4.0.8"
 
 fast-json-stable-stringify@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz#d5142c0caee6b1189f87d3a76111064f86c8bbf2"
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
+  integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
 
-fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.6:
+fast-levenshtein@^2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==
 
+fast-uri@^3.0.1:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/fast-uri/-/fast-uri-3.0.6.tgz#88f130b77cfaea2378d56bf970dea21257a68748"
+  integrity sha512-Atfo14OibSv5wAp4VWNsFYE1AchQRTv9cBGWET4pZWHzYshFSS9NQI6I57rdKn9croWVMbYFbLhJ+yJvmZIIHw==
+
 fastest-levenshtein@^1.0.16:
   version "1.0.16"
   resolved "https://registry.yarnpkg.com/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz#210e61b6ff181de91ea9b3d1b84fdedd47e034e5"
   integrity sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==
 
 fastq@^1.6.0:
-  version "1.8.0"
-  resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.8.0.tgz#550e1f9f59bbc65fe185cb6a9b4d95357107f481"
-  integrity sha512-SMIZoZdLh/fgofivvIkmknUXyPnvxRE3DhtZ5Me3Mrsk5gyPL42F0xr51TdRXskBxHfMp+07bcYzfsYEsSQA9Q==
+  version "1.19.1"
+  resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.19.1.tgz#d50eaba803c8846a883c16492821ebcd2cda55f5"
+  integrity sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==
   dependencies:
     reusify "^1.0.4"
 
 fd-slicer@~1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.1.0.tgz#25c7c89cb1f9077f8891bbe61d8f390eae256f1e"
-  integrity sha1-JcfInLH5B3+IkbvmHY85Dq4lbx4=
+  integrity sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==
   dependencies:
     pend "~1.2.0"
 
-file-entry-cache@^6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"
-  integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==
-  dependencies:
-    flat-cache "^3.0.4"
+fdir@^6.4.4, fdir@^6.5.0:
+  version "6.5.0"
+  resolved "https://registry.yarnpkg.com/fdir/-/fdir-6.5.0.tgz#ed2ab967a331ade62f18d077dae192684d50d350"
+  integrity sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==
 
-filelist@^1.0.1:
+fflate@^0.8.2:
+  version "0.8.2"
+  resolved "https://registry.yarnpkg.com/fflate/-/fflate-0.8.2.tgz#fc8631f5347812ad6028bbe4a2308b2792aa1dea"
+  integrity sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==
+
+file-entry-cache@^10.1.4:
+  version "10.1.4"
+  resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-10.1.4.tgz#1e81441517dc33ba5fe14421d96dc5fe7e37e820"
+  integrity sha512-5XRUFc0WTtUbjfGzEwXc42tiGxQHBmtbUG1h9L2apu4SulCGN3Hqm//9D6FAolf8MYNL7f/YlJl9vy08pj5JuA==
+  dependencies:
+    flat-cache "^6.1.13"
+
+file-entry-cache@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-8.0.0.tgz#7787bddcf1131bffb92636c69457bbc0edd6d81f"
+  integrity sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==
+  dependencies:
+    flat-cache "^4.0.0"
+
+filelist@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/filelist/-/filelist-1.0.4.tgz#f78978a1e944775ff9e62e744424f215e58352b5"
   integrity sha512-w1cEuf3S+DrLCQL7ET6kz+gmlJdbq9J7yXCSjK/OZCPA+qEN1WyF4ZAf0YYJa4/shHJra2t/d/r8SV4Ji+x+8Q==
   dependencies:
     minimatch "^5.0.1"
 
-fill-range@^7.0.1:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
-  integrity sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==
+fill-range@^7.1.1:
+  version "7.1.1"
+  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.1.1.tgz#44265d3cac07e3ea7dc247516380643754a05292"
+  integrity sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==
   dependencies:
     to-regex-range "^5.0.1"
 
-finalhandler@1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.2.tgz#b7e7d000ffd11938d0fdb053506f6ebabe9f587d"
-  integrity sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==
+finalhandler@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-2.1.0.tgz#72306373aa89d05a8242ed569ed86a1bff7c561f"
+  integrity sha512-/t88Ty3d5JWQbWYgaOGCCYfXRwV1+be02WqYYlL6h0lEiUAMPM8o8qKGO01YIkOHzka2up08wvgYD0mDiI+q3Q==
   dependencies:
-    debug "2.6.9"
-    encodeurl "~1.0.2"
-    escape-html "~1.0.3"
-    on-finished "~2.3.0"
-    parseurl "~1.3.3"
-    statuses "~1.5.0"
-    unpipe "~1.0.0"
-
-finalhandler@1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.2.0.tgz#7d23fe5731b207b4640e4fcd00aec1f9207a7b32"
-  integrity sha512-5uXcUVftlQMFnWC9qu/svkWv3GTd2PfUhK/3PLkYNAe7FbqJMt3515HaxE6eRL74GdsriiwujiawdaB1BpEISg==
-  dependencies:
-    debug "2.6.9"
-    encodeurl "~1.0.2"
-    escape-html "~1.0.3"
-    on-finished "2.4.1"
-    parseurl "~1.3.3"
-    statuses "2.0.1"
-    unpipe "~1.0.0"
+    debug "^4.4.0"
+    encodeurl "^2.0.0"
+    escape-html "^1.0.3"
+    on-finished "^2.4.1"
+    parseurl "^1.3.3"
+    statuses "^2.0.1"
 
 find-cache-dir@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-2.1.0.tgz#8d0f94cd13fe43c6c7c261a0d86115ca918c05f7"
+  integrity sha512-Tq6PixE0w/VMFfCgbONnkiQIVol/JJL7nRMi20fqzA4NRs9AfeqMGeRdPi3wIhYkxjeBaWh2rxwapn5Tu3IqOQ==
   dependencies:
     commondir "^1.0.1"
     make-dir "^2.0.0"
     pkg-dir "^3.0.0"
 
-find-cache-dir@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-4.0.0.tgz#a30ee0448f81a3990708f6453633c733e2f6eec2"
-  integrity sha512-9ZonPT4ZAK4a+1pUPVPZJapbi7O5qbbJPdYw/NOQWZZbVLdDTYM3A4R9z/DpAM08IDaFGsvPgiGZ82WEwUDWjg==
-  dependencies:
-    common-path-prefix "^3.0.0"
-    pkg-dir "^7.0.0"
-
 find-up@5.0.0, find-up@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-5.0.0.tgz#4c92819ecb7083561e4f4a240a86be5198f536fc"
@@ -4769,6 +4590,7 @@ find-up@5.0.0, find-up@^5.0.0:
 find-up@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-3.0.0.tgz#49169f1d7993430646da61ecc5ae355c21c97b73"
+  integrity sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==
   dependencies:
     locate-path "^3.0.0"
 
@@ -4780,66 +4602,61 @@ find-up@^4.1.0:
     locate-path "^5.0.0"
     path-exists "^4.0.0"
 
-find-up@^6.3.0:
-  version "6.3.0"
-  resolved "https://registry.yarnpkg.com/find-up/-/find-up-6.3.0.tgz#2abab3d3280b2dc7ac10199ef324c4e002c8c790"
-  integrity sha512-v2ZsoEuVHYy8ZIlYqwPe/39Cy+cFDzp4dXPaxNvkEuouymu+2Jbz0PxpKarJHYJTmv2HWT3O382qY8l4jMWthw==
+flat-cache@^4.0.0:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-4.0.1.tgz#0ece39fcb14ee012f4b0410bd33dd9c1f011127c"
+  integrity sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==
   dependencies:
-    locate-path "^7.1.0"
-    path-exists "^5.0.0"
+    flatted "^3.2.9"
+    keyv "^4.5.4"
 
-flat-cache@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11"
-  integrity sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg==
+flat-cache@^6.1.13:
+  version "6.1.17"
+  resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-6.1.17.tgz#31eb0de23c6a301c1420596d0089dd431649006d"
+  integrity sha512-Jzse4YoiUJBVYTwz5Bwl4h/2VQM7e2KK3MVAMlXzX9uamIHAH/TXUlRKU1AQGQOryQhN0EsmufiiF40G057YXA==
   dependencies:
-    flatted "^3.1.0"
-    rimraf "^3.0.2"
+    cacheable "^2.0.3"
+    flatted "^3.3.3"
+    hookified "^1.12.0"
 
 flat@^5.0.2:
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/flat/-/flat-5.0.2.tgz#8ca6fe332069ffa9d324c327198c598259ceb241"
   integrity sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ==
 
-flatted@^3.1.0:
-  version "3.2.6"
-  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.6.tgz#022e9218c637f9f3fc9c35ab9c9193f05add60b2"
-  integrity sha512-0sQoMh9s0BYsm+12Huy/rkKxVu4R1+r96YX5cG44rHV0pQ6iC3Q+mkoMFaGWObMFYQxCVT+ssG1ksneA2MI9KQ==
+flatted@^3.2.9, flatted@^3.3.3:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.3.3.tgz#67c8fad95454a7c7abebf74bb78ee74a44023358"
+  integrity sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==
 
-flatted@^3.2.5:
-  version "3.2.5"
-  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.5.tgz#76c8584f4fc843db64702a6bd04ab7a8bd666da3"
-  integrity sha512-WIWGi2L3DyTUvUrwRKgGi9TwxQMUEqPOPQBVi71R96jZXJdFskXEmf54BoZaS1kknGODoIGASGEzBUYdyMCBJg==
+follow-redirects@^1.0.0, follow-redirects@^1.15.6:
+  version "1.15.9"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.9.tgz#a604fa10e443bf98ca94228d9eebcc2e8a2c8ee1"
+  integrity sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==
 
-flatten@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
-
-follow-redirects@^1.0.0:
-  version "1.6.1"
-  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.6.1.tgz#514973c44b5757368bad8bddfe52f81f015c94cb"
+for-each@^0.3.3, for-each@^0.3.5:
+  version "0.3.5"
+  resolved "https://registry.yarnpkg.com/for-each/-/for-each-0.3.5.tgz#d650688027826920feeb0af747ee7b9421a41d47"
+  integrity sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==
   dependencies:
-    debug "=3.1.0"
+    is-callable "^1.2.7"
 
-follow-redirects@^1.15.0:
-  version "1.15.2"
-  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.2.tgz#b460864144ba63f2681096f274c4e57026da2c13"
-  integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==
-
-for-each@^0.3.3:
-  version "0.3.3"
-  resolved "https://registry.yarnpkg.com/for-each/-/for-each-0.3.3.tgz#69b447e88a0a5d32c3e7084f3f1710034b21376e"
-  integrity sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==
+foreground-child@^3.1.0:
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/foreground-child/-/foreground-child-3.3.1.tgz#32e8e9ed1b68a3497befb9ac2b6adf92a638576f"
+  integrity sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==
   dependencies:
-    is-callable "^1.1.3"
+    cross-spawn "^7.0.6"
+    signal-exit "^4.0.1"
 
 form-data@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.0.tgz#93919daeaf361ee529584b9b31664dc12c9fa452"
-  integrity sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.2.tgz#35cabbdd30c3ce73deb2c42d3c8d3ed9ca51794c"
+  integrity sha512-hGfm/slu0ZabnNt4oaRZ6uREyfCj6P4fT/n6A1rGV+Z0VdGXjfOhVUpkn6qVQONHGIFwmveGXyDs75+nr6FM8w==
   dependencies:
     asynckit "^0.4.0"
     combined-stream "^1.0.8"
+    es-set-tostringtag "^2.1.0"
     mime-types "^2.1.12"
 
 forwarded@0.2.0:
@@ -4852,52 +4669,49 @@ fraction.js@^4.3.7:
   resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-4.3.7.tgz#06ca0085157e42fda7f9e726e79fefc4068840f7"
   integrity sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==
 
-fresh@0.5.2:
-  version "0.5.2"
-  resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.5.2.tgz#3d8cadd90d976569fa835ab1f8e4b23a105605a7"
+fresh@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/fresh/-/fresh-2.0.0.tgz#8dd7df6a1b3a1b3a5cf186c05a5dd267622635a4"
+  integrity sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==
 
-fs-extra@^10.0.1:
-  version "10.0.1"
-  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-10.0.1.tgz#27de43b4320e833f6867cc044bfce29fdf0ef3b8"
-  integrity sha512-NbdoVMZso2Lsrn/QwLXOy6rm0ufY2zEOKCDzJR/0kBsb0E6qed0P3iYK+Ath3BfvXEeu4JhEtXLgILx5psUfag==
-  dependencies:
-    graceful-fs "^4.2.0"
-    jsonfile "^6.0.1"
-    universalify "^2.0.0"
-
-fs-extra@^10.1.0:
-  version "10.1.0"
-  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-10.1.0.tgz#02873cfbc4084dde127eaa5f9905eef2325d1abf"
-  integrity sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==
-  dependencies:
-    graceful-fs "^4.2.0"
-    jsonfile "^6.0.1"
-    universalify "^2.0.0"
+fs-constants@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/fs-constants/-/fs-constants-1.0.0.tgz#6be0de9be998ce16af8afc24497b9ee9b7ccd9ad"
+  integrity sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==
 
 fs.realpath@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
+  integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
-fsevents@~2.3.2:
+fsevents@2.3.2:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
   integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
 
-function-bind@1.1.1, function-bind@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
+fsevents@~2.3.2, fsevents@~2.3.3:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
+  integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
 
-function.prototype.name@^1.1.5:
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/function.prototype.name/-/function.prototype.name-1.1.5.tgz#cce0505fe1ffb80503e6f9e46cc64e46a12a9621"
-  integrity sha512-uN7m/BzVKQnCUF/iW8jYea67v++2u7m5UgENbHRtdDVclOUP+FMPlCNdmk0h/ysGyo2tavMJEDqJAkJdRa1vMA==
+function-bind@1.1.2, function-bind@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
+  integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
+
+function.prototype.name@^1.1.6, function.prototype.name@^1.1.8:
+  version "1.1.8"
+  resolved "https://registry.yarnpkg.com/function.prototype.name/-/function.prototype.name-1.1.8.tgz#e68e1df7b259a5c949eeef95cdbde53edffabb78"
+  integrity sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.3"
-    es-abstract "^1.19.0"
-    functions-have-names "^1.2.2"
+    call-bind "^1.0.8"
+    call-bound "^1.0.3"
+    define-properties "^1.2.1"
+    functions-have-names "^1.2.3"
+    hasown "^2.0.2"
+    is-callable "^1.2.7"
 
-functions-have-names@^1.2.2:
+functions-have-names@^1.2.3:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/functions-have-names/-/functions-have-names-1.2.3.tgz#0404fe4ee2ba2f607f0e0ec3c80bae994133b834"
   integrity sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==
@@ -4912,28 +4726,34 @@ get-caller-file@^2.0.1, get-caller-file@^2.0.5:
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
   integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
 
-get-func-name@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/get-func-name/-/get-func-name-2.0.0.tgz#ead774abee72e20409433a066366023dd6887a41"
-  integrity sha512-Hm0ixYtaSZ/V7C8FJrtZIuBBI+iSgL+1Aq82zSu8VQNB4S3Gk8e7Qs3VwBDJAhmRZcFqkl3tQu36g/Foh5I5ig==
+get-func-name@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/get-func-name/-/get-func-name-2.0.2.tgz#0d7cf20cd13fda808669ffa88f4ffc7a3943fc41"
+  integrity sha512-8vXOvuE167CtIc3OyItco7N/dpRtBbYOsPsXCz7X/PMnlGjYjSGuZJgM1Y7mmew7BKf9BqvLX2tnOVy1BBUsxQ==
 
-get-intrinsic@^1.0.2, get-intrinsic@^1.1.0, get-intrinsic@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.1.1.tgz#15f59f376f855c446963948f0d24cd3637b4abc6"
-  integrity sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q==
+get-intrinsic@^1.1.3, get-intrinsic@^1.2.2, get-intrinsic@^1.2.4, get-intrinsic@^1.2.5, get-intrinsic@^1.2.6, get-intrinsic@^1.2.7, get-intrinsic@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.3.0.tgz#743f0e3b6964a93a5491ed1bffaae054d7f98d01"
+  integrity sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==
   dependencies:
-    function-bind "^1.1.1"
-    has "^1.0.3"
-    has-symbols "^1.0.1"
+    call-bind-apply-helpers "^1.0.2"
+    es-define-property "^1.0.1"
+    es-errors "^1.3.0"
+    es-object-atoms "^1.1.1"
+    function-bind "^1.1.2"
+    get-proto "^1.0.1"
+    gopd "^1.2.0"
+    has-symbols "^1.1.0"
+    hasown "^2.0.2"
+    math-intrinsics "^1.1.0"
 
-get-intrinsic@^1.1.3:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.0.tgz#7ad1dc0535f3a2904bba075772763e5051f6d05f"
-  integrity sha512-L049y6nFOuom5wGyRc3/gdTLO94dySVKRACj1RmJZBQXlbTMhtNIgkWkUHq+jYmZvKf14EW1EoJnnjbmoHij0Q==
+get-proto@^1.0.0, get-proto@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/get-proto/-/get-proto-1.0.1.tgz#150b3f2743869ef3e851ec0c49d15b1d14d00ee1"
+  integrity sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==
   dependencies:
-    function-bind "^1.1.1"
-    has "^1.0.3"
-    has-symbols "^1.0.3"
+    dunder-proto "^1.0.1"
+    es-object-atoms "^1.0.0"
 
 get-stream@^5.1.0:
   version "5.2.0"
@@ -4942,13 +4762,35 @@ get-stream@^5.1.0:
   dependencies:
     pump "^3.0.0"
 
-get-symbol-description@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/get-symbol-description/-/get-symbol-description-1.0.0.tgz#7fdb81c900101fbd564dd5f1a30af5aadc1e58d6"
-  integrity sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==
+get-stream@^6.0.0:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-6.0.1.tgz#a262d8eef67aced57c2852ad6167526a43cbf7b7"
+  integrity sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==
+
+get-symbol-description@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/get-symbol-description/-/get-symbol-description-1.1.0.tgz#7bdd54e0befe8ffc9f3b4e203220d9f1e881b6ee"
+  integrity sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==
   dependencies:
-    call-bind "^1.0.2"
-    get-intrinsic "^1.1.1"
+    call-bound "^1.0.3"
+    es-errors "^1.3.0"
+    get-intrinsic "^1.2.6"
+
+get-tsconfig@^4.8.1:
+  version "4.10.0"
+  resolved "https://registry.yarnpkg.com/get-tsconfig/-/get-tsconfig-4.10.0.tgz#403a682b373a823612475a4c2928c7326fc0f6bb"
+  integrity sha512-kGzZ3LWWQcGIAmg6iWvXn0ei6WDtV26wzHRMwDSzmAbcXrTEXxHy6IehI6/4eT6VRKyMP1eF1VqwrVUmE/LR7A==
+  dependencies:
+    resolve-pkg-maps "^1.0.0"
+
+get-uri@^6.0.1:
+  version "6.0.4"
+  resolved "https://registry.yarnpkg.com/get-uri/-/get-uri-6.0.4.tgz#6daaee9e12f9759e19e55ba313956883ef50e0a7"
+  integrity sha512-E1b1lFFLvLgak2whF2xDBcOy6NLVGZBqqjJjsIhvopKfWWEi64pLVTWWehV8KlLerZkfNTA95sTe2OdJKm1OzQ==
+  dependencies:
+    basic-ftp "^5.0.2"
+    data-uri-to-buffer "^6.0.2"
+    debug "^4.3.4"
 
 glob-parent@^5.1.2, glob-parent@~5.1.2:
   version "5.1.2"
@@ -4957,42 +4799,14 @@ glob-parent@^5.1.2, glob-parent@~5.1.2:
   dependencies:
     is-glob "^4.0.1"
 
-glob-parent@^6.0.1, glob-parent@^6.0.2:
+glob-parent@^6.0.2:
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-6.0.2.tgz#6d237d99083950c79290f24c7642a3de9a28f9e3"
   integrity sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==
   dependencies:
     is-glob "^4.0.3"
 
-glob-to-regexp@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz#c75297087c851b9a578bd217dd59a92f59fe546e"
-  integrity sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==
-
-glob@7.2.0, glob@^7.1.7:
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.0.tgz#d15535af7732e02e948f4c41628bd910293f6023"
-  integrity sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==
-  dependencies:
-    fs.realpath "^1.0.0"
-    inflight "^1.0.4"
-    inherits "2"
-    minimatch "^3.0.4"
-    once "^1.3.0"
-    path-is-absolute "^1.0.0"
-
-glob@^7.0.0, glob@^7.1.1, glob@^7.1.3:
-  version "7.1.3"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.3.tgz#3960832d3f1574108342dafd3a67b332c0969df1"
-  dependencies:
-    fs.realpath "^1.0.0"
-    inflight "^1.0.4"
-    inherits "2"
-    minimatch "^3.0.4"
-    once "^1.3.0"
-    path-is-absolute "^1.0.0"
-
-glob@^7.2.3:
+glob@7.2.3, glob@^7.1.1, glob@^7.1.4, glob@^7.2.3:
   version "7.2.3"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.3.tgz#b8df0fb802bbfa8e89bd1d938b4e16578ed44f2b"
   integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
@@ -5004,7 +4818,7 @@ glob@^7.2.3:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^8.0.3:
+glob@8.1.0:
   version "8.1.0"
   resolved "https://registry.yarnpkg.com/glob/-/glob-8.1.0.tgz#d388f656593ef708ee3e34640fdfb99a9fd1c33e"
   integrity sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==
@@ -5015,6 +4829,18 @@ glob@^8.0.3:
     minimatch "^5.0.1"
     once "^1.3.0"
 
+glob@^10.4.2:
+  version "10.4.5"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-10.4.5.tgz#f4d9f0b90ffdbab09c9d77f5f29b4262517b0956"
+  integrity sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==
+  dependencies:
+    foreground-child "^3.1.0"
+    jackspeak "^3.1.2"
+    minimatch "^9.0.4"
+    minipass "^7.1.2"
+    package-json-from-dist "^1.0.0"
+    path-scurry "^1.11.1"
+
 global-modules@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/global-modules/-/global-modules-2.0.0.tgz#997605ad2345f27f51539bea26574421215c7780"
@@ -5034,20 +4860,30 @@ global-prefix@^3.0.0:
 globals@^11.1.0:
   version "11.12.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
+  integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==
 
-globals@^13.19.0:
-  version "13.19.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-13.19.0.tgz#7a42de8e6ad4f7242fbcca27ea5b23aca367b5c8"
-  integrity sha512-dkQ957uSRWHw7CFXLUtUHQI3g3aWApYhfNR2O6jn/907riyTYKVBmxYVROkBcY614FSSeSJh7Xm7SrUWCxvJMQ==
-  dependencies:
-    type-fest "^0.20.2"
+globals@^14.0.0:
+  version "14.0.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-14.0.0.tgz#898d7413c29babcf6bafe56fcadded858ada724e"
+  integrity sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==
 
-globalthis@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/globalthis/-/globalthis-1.0.3.tgz#5852882a52b80dc301b0660273e1ed082f0b6ccf"
-  integrity sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==
+globals@^15.11.0:
+  version "15.15.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-15.15.0.tgz#7c4761299d41c32b075715a4ce1ede7897ff72a8"
+  integrity sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==
+
+globals@^16.0.0:
+  version "16.4.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-16.4.0.tgz#574bc7e72993d40cf27cf6c241f324ee77808e51"
+  integrity sha512-ob/2LcVVaVGCYN+r14cnwnoDPUufjiYgSqRhiFD0Q1iI4Odora5RE8Iv1D24hAz5oMophRGkGz+yuvQmmUMnMw==
+
+globalthis@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/globalthis/-/globalthis-1.0.4.tgz#7430ed3a975d97bfb59bcce41f5cabbafa651236"
+  integrity sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==
   dependencies:
-    define-properties "^1.1.3"
+    define-properties "^1.2.1"
+    gopd "^1.0.1"
 
 globby@^11.1.0:
   version "11.1.0"
@@ -5061,230 +4897,127 @@ globby@^11.1.0:
     merge2 "^1.4.1"
     slash "^3.0.0"
 
-globby@^13.1.1:
-  version "13.1.2"
-  resolved "https://registry.yarnpkg.com/globby/-/globby-13.1.2.tgz#29047105582427ab6eca4f905200667b056da515"
-  integrity sha512-LKSDZXToac40u8Q1PQtZihbNdTYSNMuWe+K5l+oa6KgDzSvVrHXlJy40hUP522RjAIoNLJYBJi7ow+rbFpIhHQ==
-  dependencies:
-    dir-glob "^3.0.1"
-    fast-glob "^3.2.11"
-    ignore "^5.2.0"
-    merge2 "^1.4.1"
-    slash "^4.0.0"
-
 globjoin@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/globjoin/-/globjoin-0.1.4.tgz#2f4494ac8919e3767c5cbb691e9f463324285d43"
-  integrity sha1-L0SUrIkZ43Z8XLtpHp9GMyQoXUM=
+  integrity sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==
 
-gopd@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c"
-  integrity sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==
-  dependencies:
-    get-intrinsic "^1.1.3"
+globrex@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/globrex/-/globrex-0.1.2.tgz#dd5d9ec826232730cd6793a5e33a9302985e6098"
+  integrity sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==
 
-graceful-fs@^4.1.2:
-  version "4.1.15"
-  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
+gopd@^1.0.1, gopd@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.2.0.tgz#89f56b8217bdbc8802bd299df6d7f1081d7e51a1"
+  integrity sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==
 
-graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.6:
-  version "4.2.9"
-  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96"
-  integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==
+graceful-fs@^4.2.0, graceful-fs@^4.2.4:
+  version "4.2.11"
+  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3"
+  integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==
 
-graceful-fs@^4.2.4:
-  version "4.2.4"
-  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb"
-  integrity sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==
-
-graceful-fs@^4.2.9:
-  version "4.2.10"
-  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c"
-  integrity sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==
-
-grapheme-splitter@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/grapheme-splitter/-/grapheme-splitter-1.0.4.tgz#9cf3a665c6247479896834af35cf1dbb4400767e"
-  integrity sha512-bzh50DW9kTPM00T8y4o8vQg89Di9oLJVLW/KaOGIXJWP/iqCN6WKYkbNOF04vFLJhwcpYUh9ydh/+5vpOqV4YQ==
-
-growl@1.10.5:
-  version "1.10.5"
-  resolved "https://registry.yarnpkg.com/growl/-/growl-1.10.5.tgz#f2735dc2283674fa67478b10181059355c369e5e"
-  integrity sha512-qBr4OuELkhPenW6goKVXiv47US3clb3/IbuWF9KNKEijAy9oeHxU9IgzjvJhHkUzhaj7rOUD7+YGWqUjLp5oSA==
-
-hard-rejection@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/hard-rejection/-/hard-rejection-2.1.0.tgz#1c6eda5c1685c63942766d79bb40ae773cecd883"
-  integrity sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==
-
-has-ansi@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
-  dependencies:
-    ansi-regex "^2.0.0"
-
-has-bigints@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
-  integrity sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA==
+graphql@^16.8.1:
+  version "16.10.0"
+  resolved "https://registry.yarnpkg.com/graphql/-/graphql-16.10.0.tgz#24c01ae0af6b11ea87bf55694429198aaa8e220c"
+  integrity sha512-AjqGKbDGUFRKIRCP9tCKiIGHyriz2oHEbPIbEtcSLSs4YjReZOIPQQWek4+6hjw62H9QShXHyaGivGiYVLeYFQ==
 
 has-bigints@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.2.tgz#0871bd3e3d51626f6ca0966668ba35d5602d6eaa"
-  integrity sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.1.0.tgz#28607e965ac967e03cd2a2c70a2636a1edad49fe"
+  integrity sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==
 
 has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
+  integrity sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==
 
 has-flag@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
   integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
 
-has-property-descriptors@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.0.tgz#610708600606d36961ed04c196193b6a607fa861"
-  integrity sha512-62DVLZGoiEBDHQyqG4w9xCuZ7eJEwNmJRWw2VY84Oedb7WFcA27fiEVe8oUQx9hAUJ4ekurquucTGwsyO1XGdQ==
-  dependencies:
-    get-intrinsic "^1.1.1"
-
-has-proto@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.1.tgz#1885c1305538958aff469fef37937c22795408e0"
-  integrity sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==
-
-has-symbols@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.0.tgz#ba1a8f1af2a0fc39650f5c850367704122063b44"
-
-has-symbols@^1.0.1, has-symbols@^1.0.2, has-symbols@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.3.tgz#bb7b2c4349251dce87b125f7bdf874aa7c8b39f8"
-  integrity sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==
-
-has-tostringtag@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.0.tgz#7e133818a7d394734f941e73c3d3f9291e658b25"
-  integrity sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==
-  dependencies:
-    has-symbols "^1.0.2"
-
-has@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796"
-  dependencies:
-    function-bind "^1.1.1"
-
-hash-sum@^1.0.2:
+has-property-descriptors@^1.0.0, has-property-descriptors@^1.0.2:
   version "1.0.2"
-  resolved "https://registry.yarnpkg.com/hash-sum/-/hash-sum-1.0.2.tgz#33b40777754c6432573c120cc3808bbd10d47f04"
+  resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz#963ed7d071dc7bf5f084c5bfbe0d1b6222586854"
+  integrity sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==
+  dependencies:
+    es-define-property "^1.0.0"
+
+has-proto@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.2.0.tgz#5de5a6eabd95fdffd9818b43055e8065e39fe9d5"
+  integrity sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==
+  dependencies:
+    dunder-proto "^1.0.0"
+
+has-symbols@^1.0.3, has-symbols@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.1.0.tgz#fc9c6a783a084951d0b971fe1018de813707a338"
+  integrity sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==
+
+has-tostringtag@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.2.tgz#2cdc42d40bef2e5b4eeab7c01a73c54ce7ab5abc"
+  integrity sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==
+  dependencies:
+    has-symbols "^1.0.3"
 
 hash-sum@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/hash-sum/-/hash-sum-2.0.0.tgz#81d01bb5de8ea4a214ad5d6ead1b523460b0b45a"
   integrity sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==
 
-he@1.2.0, he@^1.2.0:
+hasown@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/hasown/-/hasown-2.0.2.tgz#003eaf91be7adc372e84ec59dc37252cedb80003"
+  integrity sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==
+  dependencies:
+    function-bind "^1.1.2"
+
+he@1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
   integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
 
-hosted-git-info@^2.1.4:
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.7.1.tgz#97f236977bd6e125408930ff6de3eec6281ec047"
+headers-polyfill@^4.0.2:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/headers-polyfill/-/headers-polyfill-4.0.3.tgz#922a0155de30ecc1f785bcf04be77844ca95ad07"
+  integrity sha512-IScLbePpkvO846sIwOtOTDjutRMWdXdJmXdMvk6gCBHxFO8d+QKOQedyZSxFTTFYRSmlgSTDtXqqq4pcenBXLQ==
 
-hosted-git-info@^4.0.1:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-4.1.0.tgz#827b82867e9ff1c8d0c4d9d53880397d2c86d224"
-  integrity sha512-kyCuEOWjJqZuDbRHzL8V93NzQhwIB71oFWSyzVo+KPZI+pnQPPxucdkrOZvkLRnrf5URsQM+IJ09Dw29cRALIA==
+hookable@^5.5.3:
+  version "5.5.3"
+  resolved "https://registry.yarnpkg.com/hookable/-/hookable-5.5.3.tgz#6cfc358984a1ef991e2518cb9ed4a778bbd3215d"
+  integrity sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==
+
+hookified@^1.12.0, hookified@^1.12.1:
+  version "1.12.1"
+  resolved "https://registry.yarnpkg.com/hookified/-/hookified-1.12.1.tgz#b0de0116ca346fd6c4e55db901f52d5cd728ef00"
+  integrity sha512-xnKGl+iMIlhrZmGHB729MqlmPoWBznctSQTYCpFKqNsCgimJQmithcW0xSQMMFzYnV2iKUh25alswn6epgxS0Q==
+
+html-encoding-sniffer@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz#696df529a7cfd82446369dc5193e590a3735b448"
+  integrity sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==
   dependencies:
-    lru-cache "^6.0.0"
-
-html-encoding-sniffer@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz#2cb1a8cf0db52414776e5b2a7a04d5dd98158de9"
-  integrity sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==
-  dependencies:
-    whatwg-encoding "^2.0.0"
-
-html-entities@^2.1.0:
-  version "2.3.3"
-  resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-2.3.3.tgz#117d7626bece327fc8baace8868fa6f5ef856e46"
-  integrity sha512-DV5Ln36z34NNTDgnz0EWGBLZENelNAtkiFA4kyNOG2tDI6Mz1uSWiq1wAKdyjnJwyDiDO7Fa2SO1CTxPXL8VxA==
-
-html-escaper@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/html-escaper/-/html-escaper-2.0.2.tgz#dfd60027da36a36dfcbe236262c00a5822681453"
-  integrity sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==
-
-html-minifier-terser@^6.0.2:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#bfc818934cc07918f6b3669f5774ecdfd48f32ab"
-  integrity sha512-YXxSlJBZTP7RS3tWnQw74ooKa6L9b9i9QYXY21eUEvhZ3u9XLfv6OnFsQq6RxkhHygsaUMvYsZRV5rU/OVNZxw==
-  dependencies:
-    camel-case "^4.1.2"
-    clean-css "^5.2.2"
-    commander "^8.3.0"
-    he "^1.2.0"
-    param-case "^3.0.4"
-    relateurl "^0.2.7"
-    terser "^5.10.0"
-
-html-tags@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-3.2.0.tgz#dbb3518d20b726524e4dd43de397eb0a95726961"
-  integrity sha512-vy7ClnArOZwCnqZgvv+ddgHgJiAFXe3Ge9ML5/mBctVJoUoYPCdxVucOywjDARn6CVoh3dRSFdPHy2sX80L0Wg==
+    whatwg-encoding "^3.1.1"
 
 html-tags@^3.3.1:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-3.3.1.tgz#a04026a18c882e4bba8a01a3d39cfe465d40b5ce"
   integrity sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==
 
-html-webpack-plugin@5.5.1:
-  version "5.5.1"
-  resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-5.5.1.tgz#826838e31b427f5f7f30971f8d8fa2422dfa6763"
-  integrity sha512-cTUzZ1+NqjGEKjmVgZKLMdiFg3m9MdRXkZW2OEe69WYVi5ONLMmlnSZdXzGGMOq0C8jGDrL6EWyEDDUioHO/pA==
-  dependencies:
-    "@types/html-minifier-terser" "^6.0.0"
-    html-minifier-terser "^6.0.2"
-    lodash "^4.17.21"
-    pretty-error "^4.0.0"
-    tapable "^2.0.0"
-
-htmlparser2@^6.1.0:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-6.1.0.tgz#c4d762b6c3371a05dbe65e94ae43a9f845fb8fb7"
-  integrity sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==
-  dependencies:
-    domelementtype "^2.0.1"
-    domhandler "^4.0.0"
-    domutils "^2.5.2"
-    entities "^2.0.0"
-
 htmlparser2@^8.0.0:
-  version "8.0.1"
-  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-8.0.1.tgz#abaa985474fcefe269bc761a779b544d7196d010"
-  integrity sha512-4lVbmc1diZC7GUJQtRQ5yBAeUCL1exyMwmForWkRLnwyzWBFxN633SALPMGYaWZvKe9j1pRZJpauvmxENSp/EA==
+  version "8.0.2"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-8.0.2.tgz#f002151705b383e62433b5cf466f5b716edaec21"
+  integrity sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==
   dependencies:
     domelementtype "^2.3.0"
-    domhandler "^5.0.2"
+    domhandler "^5.0.3"
     domutils "^3.0.1"
-    entities "^4.3.0"
+    entities "^4.4.0"
 
-http-errors@1.8.1:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.8.1.tgz#7c3f28577cbc8a207388455dbd62295ed07bd68c"
-  integrity sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==
-  dependencies:
-    depd "~1.1.2"
-    inherits "2.0.4"
-    setprototypeof "1.2.0"
-    statuses ">= 1.5.0 < 2"
-    toidentifier "1.0.1"
-
-http-errors@2.0.0:
+http-errors@2.0.0, http-errors@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-2.0.0.tgz#b7774a1486ef73cf7667ac9ae0858c012c57b9d3"
   integrity sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==
@@ -5295,25 +5028,25 @@ http-errors@2.0.0:
     statuses "2.0.1"
     toidentifier "1.0.1"
 
-http-proxy-agent@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz#5129800203520d434f142bc78ff3c170800f2b43"
-  integrity sha512-n2hY8YdoRE1i7r6M0w9DIw5GgZN0G25P8zLCRQ8rjXtTU3vsNFBI/vWK/UIeE6g5MUUz6avwAPXmL6Fy9D/90w==
+http-proxy-agent@^7.0.0, http-proxy-agent@^7.0.1, http-proxy-agent@^7.0.2:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz#9a8b1f246866c028509486585f62b8f2c18c270e"
+  integrity sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==
   dependencies:
-    "@tootallnate/once" "2"
-    agent-base "6"
-    debug "4"
+    agent-base "^7.1.0"
+    debug "^4.3.4"
 
-http-proxy-middleware@2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-2.0.6.tgz#e1a4dd6979572c7ab5a4e4b55095d1f32a74963f"
-  integrity sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw==
+http-proxy-middleware@3.0.5:
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-3.0.5.tgz#9dcde663edc44079bc5a9c63e03fe5e5d6037fab"
+  integrity sha512-GLZZm1X38BPY4lkXA01jhwxvDoOkkXqjgVyUzVxiEK4iuRu03PZoYHhHRwxnfhQMDuaxi3vVri0YgSro/1oWqg==
   dependencies:
-    "@types/http-proxy" "^1.17.8"
+    "@types/http-proxy" "^1.17.15"
+    debug "^4.3.6"
     http-proxy "^1.18.1"
-    is-glob "^4.0.1"
-    is-plain-obj "^3.0.0"
-    micromatch "^4.0.2"
+    is-glob "^4.0.3"
+    is-plain-object "^5.0.0"
+    micromatch "^4.0.8"
 
 http-proxy@^1.18.1:
   version "1.18.1"
@@ -5324,172 +5057,148 @@ http-proxy@^1.18.1:
     follow-redirects "^1.0.0"
     requires-port "^1.0.0"
 
-https-proxy-agent@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz#e2a90542abb68a762e0a0850f6c9edadfd8506b2"
-  integrity sha512-EkYm5BcKUGiduxzSt3Eppko+PiNWNEpa4ySk9vTC6wDsQJW9rHSa+UhGNJoRYp7bz6Ht1eaRIa6QaJqO5rCFbA==
+https-proxy-agent@^7.0.5, https-proxy-agent@^7.0.6:
+  version "7.0.6"
+  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz#da8dfeac7da130b05c2ba4b59c9b6cd66611a6b9"
+  integrity sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==
   dependencies:
-    agent-base "6"
+    agent-base "^7.1.2"
     debug "4"
 
-https-proxy-agent@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz#c59ef224a04fe8b754f3db0063a25ea30d0005d6"
-  integrity sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==
-  dependencies:
-    agent-base "6"
-    debug "4"
+human-signals@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0"
+  integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==
 
-iconv-lite@0.4.24:
-  version "0.4.24"
-  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
-  dependencies:
-    safer-buffer ">= 2.1.2 < 3"
-
-iconv-lite@0.6.3:
+iconv-lite@0.6.3, iconv-lite@^0.6.3:
   version "0.6.3"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.3.tgz#a52f80bf38da1952eb5c681790719871a1a72501"
   integrity sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==
   dependencies:
     safer-buffer ">= 2.1.2 < 3.0.0"
 
-icss-utils@^5.0.0, icss-utils@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae"
-  integrity sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==
-
 ieee754@^1.1.13:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352"
   integrity sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==
 
-ignore@^5.1.1, ignore@^5.2.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.0.tgz#6d3bac8fa7fe0d45d9f9be7bac2fc279577e345a"
-  integrity sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ==
+ignore@^5.2.0, ignore@^5.3.2:
+  version "5.3.2"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.3.2.tgz#3cd40e729f3643fd87cb04e50bf0eb722bc596f5"
+  integrity sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==
 
-ignore@^5.2.1:
-  version "5.2.4"
-  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324"
-  integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==
+ignore@^7.0.5:
+  version "7.0.5"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-7.0.5.tgz#4cb5f6cd7d4c7ab0365738c7aea888baa6d7efd9"
+  integrity sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==
 
 immediate@~3.0.5:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
+  integrity sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==
 
-immutable@^4.0.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.1.0.tgz#f795787f0db780183307b9eb2091fcac1f6fafef"
-  integrity sha512-oNkuqVTA8jqG1Q6c+UglTOD1xhC1BtjKI7XkCXRkZHrN5m18/XsnUp8Q89GkQO/z+0WjonSvl0FLhDYftp46nQ==
+immutable@^5.0.2:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/immutable/-/immutable-5.1.1.tgz#d4cb552686f34b076b3dcf23c4384c04424d8354"
+  integrity sha512-3jatXi9ObIsPGr3N5hGw/vWWcTkq6hUYhpQz4k0wLC+owqWi/LiugIw9x0EdNZ2yGedKN/HzePiBvaJRXa0Ujg==
 
-import-fresh@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.0.0.tgz#a3d897f420cab0e671236897f75bc14b4885c390"
+import-fresh@^3.2.1, import-fresh@^3.3.0:
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.1.tgz#9cecb56503c0ada1f2741dbbd6546e4b13b57ccf"
+  integrity sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==
   dependencies:
     parent-module "^1.0.0"
     resolve-from "^4.0.0"
 
-import-fresh@^3.2.1:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
-  integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==
-  dependencies:
-    parent-module "^1.0.0"
-    resolve-from "^4.0.0"
-
-import-lazy@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/import-lazy/-/import-lazy-4.0.0.tgz#e8eb627483a0a43da3c03f3e35548be5cb0cc153"
-  integrity sha512-rKtvo6a868b5Hu3heneU+L4yEQ4jYKLtjpnPeUdK7h0yzXGmyBTypknlkCvHFBqfX9YlorEiMM6Dnq/5atfHkw==
-
 imurmurhash@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
-
-indent-string@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/indent-string/-/indent-string-4.0.0.tgz#624f8f4497d619b2d9768531d58f4122854d7251"
-  integrity sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==
-
-indexes-of@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/indexes-of/-/indexes-of-1.0.1.tgz#f30f716c8e2bd346c7b67d3df3915566a7c05607"
+  integrity sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==
 
 inflight@^1.0.4:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
+  integrity sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==
   dependencies:
     once "^1.3.0"
     wrappy "1"
 
-inherits@2, inherits@^2.0.3, inherits@~2.0.3:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
-
-inherits@2.0.4, inherits@^2.0.4:
+inherits@2, inherits@2.0.4, inherits@^2.0.3, inherits@^2.0.4, inherits@~2.0.3:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
   integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
 
-ini@^1.3.4:
+ini@^1.3.4, ini@^1.3.5:
   version "1.3.8"
   resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.8.tgz#a29da425b48806f34767a4efce397269af28432c"
   integrity sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==
 
-ini@^1.3.5:
-  version "1.3.5"
-  resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.5.tgz#eee25f56db1c9ec6085e0c22778083f596abf927"
-
-internal-slot@^1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.3.tgz#7347e307deeea2faac2ac6205d4bc7d34967f59c"
-  integrity sha512-O0DB1JC/sPyZl7cIo78n5dR7eUSwwpYPiXRhTzNxZVAMUuB8vlnRFyLxdrVToks6XPLVnFfbzaVd5WLjhgg+vA==
+internal-slot@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.1.0.tgz#1eac91762947d2f7056bc838d93e13b2e9604961"
+  integrity sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==
   dependencies:
-    get-intrinsic "^1.1.0"
-    has "^1.0.3"
-    side-channel "^1.0.4"
+    es-errors "^1.3.0"
+    hasown "^2.0.2"
+    side-channel "^1.1.0"
 
-internal-slot@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.4.tgz#8551e7baf74a7a6ba5f749cfb16aa60722f0d6f3"
-  integrity sha512-tA8URYccNzMo94s5MQZgH8NB/XTa6HsOo0MLfXTKKEnHVVdegzaQoFZ7Jp44bdvLvY2waT5dc+j5ICEswhi7UQ==
+ip-address@^9.0.5:
+  version "9.0.5"
+  resolved "https://registry.yarnpkg.com/ip-address/-/ip-address-9.0.5.tgz#117a960819b08780c3bd1f14ef3c1cc1d3f3ea5a"
+  integrity sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==
   dependencies:
-    get-intrinsic "^1.1.3"
-    has "^1.0.3"
-    side-channel "^1.0.4"
+    jsbn "1.1.0"
+    sprintf-js "^1.1.3"
 
-interpret@^1.0.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.2.0.tgz#d5061a6224be58e8083985f5014d844359576296"
-
-ip-regex@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/ip-regex/-/ip-regex-2.1.0.tgz#fa78bf5d2e6913c911ce9f819ee5146bb6d844e9"
+ip-regex@^4.1.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/ip-regex/-/ip-regex-4.3.0.tgz#687275ab0f57fa76978ff8f4dddc8a23d5990db5"
+  integrity sha512-B9ZWJxHHOHUhUjCPrMpLD4xEq35bUTClHM1S6CBU5ixQnkZmwipwgc96vAd7AAGM9TGHvJR+Uss+/Ak6UphK+Q==
 
 ipaddr.js@1.9.1:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/ipaddr.js/-/ipaddr.js-1.9.1.tgz#bff38543eeb8984825079ff3a2a8e6cbd46781b3"
   integrity sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==
 
-is-array-buffer@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.1.tgz#deb1db4fcae48308d54ef2442706c0393997052a"
-  integrity sha512-ASfLknmY8Xa2XtB4wmbz13Wu202baeA18cJBCeCy0wXUHZF0IPyVEXqKEcd+t2fNSLLL1vC6k7lxZEojNbISXQ==
+is-arguments@^1.1.1:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/is-arguments/-/is-arguments-1.2.0.tgz#ad58c6aecf563b78ef2bf04df540da8f5d7d8e1b"
+  integrity sha512-7bVbi0huj/wrIAOzb8U1aszg9kdi3KN/CyU19CTI7tAoZYEZoL9yCDXpbXN+uPsuWnP02cyug1gleqq+TU+YCA==
   dependencies:
-    call-bind "^1.0.2"
-    get-intrinsic "^1.1.3"
-    is-typed-array "^1.1.10"
+    call-bound "^1.0.2"
+    has-tostringtag "^1.0.2"
+
+is-array-buffer@^3.0.2, is-array-buffer@^3.0.4, is-array-buffer@^3.0.5:
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.5.tgz#65742e1e687bd2cc666253068fd8707fe4d44280"
+  integrity sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==
+  dependencies:
+    call-bind "^1.0.8"
+    call-bound "^1.0.3"
+    get-intrinsic "^1.2.6"
 
 is-arrayish@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
+  integrity sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==
 
-is-bigint@^1.0.1:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.4.tgz#08147a1875bc2b32005d41ccd8291dffc6691df3"
-  integrity sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==
+is-async-function@^2.0.0:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/is-async-function/-/is-async-function-2.1.1.tgz#3e69018c8e04e73b738793d020bfe884b9fd3523"
+  integrity sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==
   dependencies:
-    has-bigints "^1.0.1"
+    async-function "^1.0.0"
+    call-bound "^1.0.3"
+    get-proto "^1.0.1"
+    has-tostringtag "^1.0.2"
+    safe-regex-test "^1.1.0"
+
+is-bigint@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.1.0.tgz#dda7a3445df57a42583db4228682eba7c4170672"
+  integrity sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==
+  dependencies:
+    has-bigints "^1.0.2"
 
 is-binary-path@~2.1.0:
   version "2.1.0"
@@ -5498,52 +5207,42 @@ is-binary-path@~2.1.0:
   dependencies:
     binary-extensions "^2.0.0"
 
-is-boolean-object@^1.1.0:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.1.2.tgz#5c6dc200246dd9321ae4b885a114bb1f75f63719"
-  integrity sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==
+is-boolean-object@^1.2.1:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.2.2.tgz#7067f47709809a393c71ff5bb3e135d8a9215d9e"
+  integrity sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==
   dependencies:
-    call-bind "^1.0.2"
-    has-tostringtag "^1.0.0"
+    call-bound "^1.0.3"
+    has-tostringtag "^1.0.2"
 
-is-callable@^1.1.3, is-callable@^1.2.7:
+is-callable@^1.2.7:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.7.tgz#3bc2a85ea742d9e36205dcacdd72ca1fdc51b055"
   integrity sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==
 
-is-callable@^1.1.4:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.4.tgz#1e1adf219e1eeb684d691f9d6a05ff0d30a24d75"
-
-is-callable@^1.2.4:
-  version "1.2.4"
-  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.4.tgz#47301d58dd0259407865547853df6d61fe471945"
-  integrity sha512-nsuwtxZfMX67Oryl9LCQ+upnC0Z0BgpwntpS89m1H/TLF0zNfzfLMV/9Wa/6MZsj0acpEjAO0KF1xT6ZdLl95w==
-
-is-core-module@^2.11.0:
-  version "2.11.0"
-  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.11.0.tgz#ad4cb3e3863e814523c96f3f58d26cc570ff0144"
-  integrity sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==
+is-core-module@^2.13.0, is-core-module@^2.16.0, is-core-module@^2.16.1:
+  version "2.16.1"
+  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.16.1.tgz#2a98801a849f43e2add644fbb6bc6229b19a4ef4"
+  integrity sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==
   dependencies:
-    has "^1.0.3"
+    hasown "^2.0.2"
 
-is-core-module@^2.5.0, is-core-module@^2.9.0:
-  version "2.9.0"
-  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.9.0.tgz#e1c34429cd51c6dd9e09e0799e396e27b19a9c69"
-  integrity sha512-+5FPy5PnwmO3lvfMb0AsoPaBG+5KHUI0wYFXOtYPnVVVspTFUuMZNfNaNVRt3FZadstu2c8x23vykRW/NBoU6A==
+is-data-view@^1.0.1, is-data-view@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-data-view/-/is-data-view-1.0.2.tgz#bae0a41b9688986c2188dda6657e56b8f9e63b8e"
+  integrity sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==
   dependencies:
-    has "^1.0.3"
+    call-bound "^1.0.2"
+    get-intrinsic "^1.2.6"
+    is-typed-array "^1.1.13"
 
-is-core-module@^2.8.1:
-  version "2.8.1"
-  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.8.1.tgz#f59fdfca701d5879d0a6b100a40aa1560ce27211"
-  integrity sha512-SdNCUs284hr40hFTFP6l0IfZ/RSrMXF3qgoRHd3/79unUTvrFO/JoXwkGm+5J/Oe3E/b5GsnG330uUNgRpu1PA==
+is-date-object@^1.0.5, is-date-object@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.1.0.tgz#ad85541996fc7aa8b2729701d27b7319f95d82f7"
+  integrity sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==
   dependencies:
-    has "^1.0.3"
-
-is-date-object@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.0.1.tgz#9aa20eb6aeebbff77fbd33e74ca01b33581d3a16"
+    call-bound "^1.0.2"
+    has-tostringtag "^1.0.2"
 
 is-docker@^2.0.0, is-docker@^2.1.1:
   version "2.2.1"
@@ -5553,19 +5252,31 @@ is-docker@^2.0.0, is-docker@^2.1.1:
 is-extglob@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
+  integrity sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==
+
+is-finalizationregistry@^1.1.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz#eefdcdc6c94ddd0674d9c85887bf93f944a97c90"
+  integrity sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==
+  dependencies:
+    call-bound "^1.0.3"
 
 is-fullwidth-code-point@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz#f116f8064fe90b3f7844a38997c0b75051269f1d"
   integrity sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==
 
-is-glob@^4.0.0, is-glob@^4.0.1, is-glob@~4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.1.tgz#7567dbe9f2f5e2467bc77ab83c4a29482407a5dc"
+is-generator-function@^1.0.10:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/is-generator-function/-/is-generator-function-1.1.0.tgz#bf3eeda931201394f57b5dba2800f91a238309ca"
+  integrity sha512-nPUB5km40q9e8UfN/Zc24eLlzdSf9OfKByBw9CIdw4H1giPMeA0OIJvbchsCu4npfI2QcMVBsGEBHKZ7wLTWmQ==
   dependencies:
-    is-extglob "^2.1.1"
+    call-bound "^1.0.3"
+    get-proto "^1.0.0"
+    has-tostringtag "^1.0.2"
+    safe-regex-test "^1.1.0"
 
-is-glob@^4.0.3:
+is-glob@^4.0.0, is-glob@^4.0.1, is-glob@^4.0.3, is-glob@~4.0.1:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.3.tgz#64f61e42cbbb2eec2071a9dac0b28ba1e65d5084"
   integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==
@@ -5577,45 +5288,43 @@ is-interactive@^1.0.0:
   resolved "https://registry.yarnpkg.com/is-interactive/-/is-interactive-1.0.0.tgz#cea6e6ae5c870a7b0a0004070b7b587e0252912e"
   integrity sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==
 
-is-negative-zero@^2.0.1, is-negative-zero@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.2.tgz#7bf6f03a28003b8b3965de3ac26f664d765f3150"
-  integrity sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==
+is-map@^2.0.2, is-map@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/is-map/-/is-map-2.0.3.tgz#ede96b7fe1e270b3c4465e3a465658764926d62e"
+  integrity sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==
 
-is-number-object@^1.0.4:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.6.tgz#6a7aaf838c7f0686a50b4553f7e54a96494e89f0"
-  integrity sha512-bEVOqiRcvo3zO1+G2lVMy+gkkEm9Yh7cDMRusKKu5ZJKPUYSJwICTKZrNKHA2EbSP0Tu0+6B/emsYNHZyn6K8g==
+is-negative-zero@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.3.tgz#ced903a027aca6381b777a5743069d7376a49747"
+  integrity sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==
+
+is-node-process@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/is-node-process/-/is-node-process-1.2.0.tgz#ea02a1b90ddb3934a19aea414e88edef7e11d134"
+  integrity sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw==
+
+is-number-object@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.1.1.tgz#144b21e95a1bc148205dcc2814a9134ec41b2541"
+  integrity sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==
   dependencies:
-    has-tostringtag "^1.0.0"
+    call-bound "^1.0.3"
+    has-tostringtag "^1.0.2"
 
 is-number@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
   integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==
 
-is-path-inside@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283"
-  integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==
-
-is-plain-obj@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-1.1.0.tgz#71a50c8429dfca773c92a390a4a03b39fcd51d3e"
-
 is-plain-obj@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-2.1.0.tgz#45e42e37fccf1f40da8e5f76ee21515840c09287"
   integrity sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==
 
-is-plain-obj@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-3.0.0.tgz#af6f2ea14ac5a646183a5bbdb5baabbc156ad9d7"
-  integrity sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==
-
 is-plain-object@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
+  integrity sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==
   dependencies:
     isobject "^3.0.1"
 
@@ -5629,77 +5338,96 @@ is-potential-custom-element-name@^1.0.1:
   resolved "https://registry.yarnpkg.com/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz#171ed6f19e3ac554394edf78caa05784a45bebb5"
   integrity sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==
 
-is-regex@^1.1.4:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958"
-  integrity sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==
+is-promise@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-4.0.0.tgz#42ff9f84206c1991d26debf520dd5c01042dd2f3"
+  integrity sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==
+
+is-regex@^1.1.4, is-regex@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.2.1.tgz#76d70a3ed10ef9be48eb577887d74205bf0cad22"
+  integrity sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==
   dependencies:
-    call-bind "^1.0.2"
-    has-tostringtag "^1.0.0"
+    call-bound "^1.0.2"
+    gopd "^1.2.0"
+    has-tostringtag "^1.0.2"
+    hasown "^2.0.2"
 
-is-shared-array-buffer@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.1.tgz#97b0c85fbdacb59c9c446fe653b82cf2b5b7cfe6"
-  integrity sha512-IU0NmyknYZN0rChcKhRO1X8LYz5Isj/Fsqh8NJOSf+N/hCOTwy29F32Ik7a+QszE63IdvmwdTPDd6cZ5pg4cwA==
+is-set@^2.0.2, is-set@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/is-set/-/is-set-2.0.3.tgz#8ab209ea424608141372ded6e0cb200ef1d9d01d"
+  integrity sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==
 
-is-shared-array-buffer@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz#8f259c573b60b6a32d4058a1a07430c0a7344c79"
-  integrity sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==
-  dependencies:
-    call-bind "^1.0.2"
-
-is-string@^1.0.5, is-string@^1.0.7:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.7.tgz#0dd12bf2006f255bb58f695110eff7491eebc0fd"
-  integrity sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==
-  dependencies:
-    has-tostringtag "^1.0.0"
-
-is-symbol@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.0.2.tgz#a055f6ae57192caee329e7a860118b497a950f38"
-  dependencies:
-    has-symbols "^1.0.0"
-
-is-symbol@^1.0.3:
+is-shared-array-buffer@^1.0.2, is-shared-array-buffer@^1.0.4:
   version "1.0.4"
-  resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.0.4.tgz#a6dac93b635b063ca6872236de88910a57af139c"
-  integrity sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==
+  resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz#9b67844bd9b7f246ba0708c3a93e34269c774f6f"
+  integrity sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==
   dependencies:
-    has-symbols "^1.0.2"
+    call-bound "^1.0.3"
 
-is-typed-array@^1.1.10, is-typed-array@^1.1.9:
-  version "1.1.10"
-  resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.10.tgz#36a5b5cb4189b575d1a3e4b08536bfb485801e3f"
-  integrity sha512-PJqgEHiWZvMpaFZ3uTc8kHPM4+4ADTlDniuQL7cU/UDA0Ql7F70yGfHph3cLNe+c9toaigv+DFzTJKhc2CtO6A==
+is-stream@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.1.tgz#fac1e3d53b97ad5a9d0ae9cef2389f5810a5c077"
+  integrity sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==
+
+is-string@^1.0.7, is-string@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.1.1.tgz#92ea3f3d5c5b6e039ca8677e5ac8d07ea773cbb9"
+  integrity sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==
   dependencies:
-    available-typed-arrays "^1.0.5"
-    call-bind "^1.0.2"
-    for-each "^0.3.3"
-    gopd "^1.0.1"
-    has-tostringtag "^1.0.0"
+    call-bound "^1.0.3"
+    has-tostringtag "^1.0.2"
+
+is-symbol@^1.0.4, is-symbol@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.1.1.tgz#f47761279f532e2b05a7024a7506dbbedacd0634"
+  integrity sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==
+  dependencies:
+    call-bound "^1.0.2"
+    has-symbols "^1.1.0"
+    safe-regex-test "^1.1.0"
+
+is-typed-array@^1.1.13, is-typed-array@^1.1.14, is-typed-array@^1.1.15:
+  version "1.1.15"
+  resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.15.tgz#4bfb4a45b61cee83a5a46fba778e4e8d59c0ce0b"
+  integrity sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==
+  dependencies:
+    which-typed-array "^1.1.16"
 
 is-unicode-supported@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/is-unicode-supported/-/is-unicode-supported-0.1.0.tgz#3f26c76a809593b52bfa2ecb5710ed2779b522a7"
   integrity sha512-knxG2q4UC3u8stRGyAVJCOdxFmv5DZiRcdlIaAQXAbSfJya+OhopNotLQrstBhququ4ZpuKbDc/8S6mgXgPFPw==
 
-is-url@^1.2.2:
+is-url@^1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/is-url/-/is-url-1.2.4.tgz#04a4df46d28c4cff3d73d01ff06abeb318a1aa52"
+  integrity sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==
 
-is-weakref@^1.0.1, is-weakref@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/is-weakref/-/is-weakref-1.0.2.tgz#9529f383a9338205e89765e0392efc2f100f06f2"
-  integrity sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==
+is-weakmap@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/is-weakmap/-/is-weakmap-2.0.2.tgz#bf72615d649dfe5f699079c54b83e47d1ae19cfd"
+  integrity sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==
+
+is-weakref@^1.0.2, is-weakref@^1.1.0, is-weakref@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/is-weakref/-/is-weakref-1.1.1.tgz#eea430182be8d64174bd96bffbc46f21bf3f9293"
+  integrity sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==
   dependencies:
-    call-bind "^1.0.2"
+    call-bound "^1.0.3"
 
-is-wsl@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d"
-  integrity sha512-gfygJYZ2gLTDlmbWMI0CE2MwnFzSN/2SZfkMlItC4K/JBlsWVDB0bO6XhqcY13YXE7iMcAJnzTCJjPiTeJJ0Mw==
+is-weakset@^2.0.3:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/is-weakset/-/is-weakset-2.0.4.tgz#c9f5deb0bc1906c6d6f1027f284ddf459249daca"
+  integrity sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==
+  dependencies:
+    call-bound "^1.0.3"
+    get-intrinsic "^1.2.6"
+
+is-what@^4.1.8:
+  version "4.1.16"
+  resolved "https://registry.yarnpkg.com/is-what/-/is-what-4.1.16.tgz#1ad860a19da8b4895ad5495da3182ce2acdd7a6f"
+  integrity sha512-ZhMwEosbFJkA0YhFnNDgTM4ZxDRsS6HqTo7qsZM08fehyRYIYa0yHu5R6mgo1n/8MgaPBXiPimPD77baVFYg+A==
 
 is-wsl@^2.2.0:
   version "2.2.0"
@@ -5708,160 +5436,84 @@ is-wsl@^2.2.0:
   dependencies:
     is-docker "^2.0.0"
 
-is2@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/is2/-/is2-2.0.1.tgz#8ac355644840921ce435d94f05d3a94634d3481a"
+is2@^2.0.6:
+  version "2.0.9"
+  resolved "https://registry.yarnpkg.com/is2/-/is2-2.0.9.tgz#ff63b441f90de343fa8fac2125ee170da8e8240d"
+  integrity sha512-rZkHeBn9Zzq52sd9IUIV3a5mfwBY+o2HePMh0wkGBM4z4qjvy2GwVxQ6nNXSfw6MmVP6gf1QIlWjiOavhM3x5g==
   dependencies:
     deep-is "^0.1.3"
-    ip-regex "^2.1.0"
-    is-url "^1.2.2"
+    ip-regex "^4.1.0"
+    is-url "^1.2.4"
 
-isarray@0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
+isarray@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.5.tgz#8af1e4c1221244cc62459faf38940d4e644a5723"
+  integrity sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==
 
 isarray@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
-
-isbinaryfile@^4.0.8:
-  version "4.0.8"
-  resolved "https://registry.yarnpkg.com/isbinaryfile/-/isbinaryfile-4.0.8.tgz#5d34b94865bd4946633ecc78a026fc76c5b11fcf"
-  integrity sha512-53h6XFniq77YdW+spoRrebh0mnmTxRPTlcuIArO57lmMdq4uBKFKaeTjnb92oYWrSn/LVL+LT+Hap2tFQj8V+w==
+  integrity sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==
 
 isexe@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10"
+  integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==
 
-iso-639-1@2.1.15:
-  version "2.1.15"
-  resolved "https://registry.yarnpkg.com/iso-639-1/-/iso-639-1-2.1.15.tgz#20cf78a4f691aeb802c16f17a6bad7d99271e85d"
-  integrity sha512-7c7mBznZu2ktfvyT582E2msM+Udc1EjOyhVRE/0ZsjD9LBtWSm23h3PtiRh2a35XoUsTQQjJXaJzuLjXsOdFDg==
+iso-639-1@3.1.5:
+  version "3.1.5"
+  resolved "https://registry.yarnpkg.com/iso-639-1/-/iso-639-1-3.1.5.tgz#e8205aceeeea0f64d6b12f5fac6a943b0d5b452c"
+  integrity sha512-gXkz5+KN7HrG0Q5UGqSMO2qB9AsbEeyLP54kF1YrMsIxmu+g4BdB7rflReZTSTZGpfj8wywu6pfPBCylPIzGQA==
 
 isobject@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
+  integrity sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==
 
-istanbul-lib-coverage@^3.0.0, istanbul-lib-coverage@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.0.tgz#189e7909d0a39fa5a3dfad5b03f71947770191d3"
-  integrity sha512-eOeJ5BHCmHYvQK7xt9GkdHuzuCGS1Y6g9Gvnx3Ym33fz/HpLRYxiS0wHNr+m/MBC8B647Xt608vCDEvhl9c6Mw==
-
-istanbul-lib-instrument@^5.1.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-5.2.0.tgz#31d18bdd127f825dd02ea7bfdfd906f8ab840e9f"
-  integrity sha512-6Lthe1hqXHBNsqvgDzGO6l03XNeu3CrG4RqQ1KM9+l5+jNGpEJfIELx1NS3SEHmJQA8np/u+E4EPRKRiu6m19A==
+jackspeak@^3.1.2:
+  version "3.4.3"
+  resolved "https://registry.yarnpkg.com/jackspeak/-/jackspeak-3.4.3.tgz#8833a9d89ab4acde6188942bd1c53b6390ed5a8a"
+  integrity sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==
   dependencies:
-    "@babel/core" "^7.12.3"
-    "@babel/parser" "^7.14.7"
-    "@istanbuljs/schema" "^0.1.2"
-    istanbul-lib-coverage "^3.2.0"
-    semver "^6.3.0"
-
-istanbul-lib-report@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/istanbul-lib-report/-/istanbul-lib-report-3.0.0.tgz#7518fe52ea44de372f460a76b5ecda9ffb73d8a6"
-  integrity sha512-wcdi+uAKzfiGT2abPpKZ0hSU1rGQjUQnLvtY5MpQ7QCTahD3VODhcu4wcfY1YtkGaDD5yuydOLINXsfbus9ROw==
-  dependencies:
-    istanbul-lib-coverage "^3.0.0"
-    make-dir "^3.0.0"
-    supports-color "^7.1.0"
-
-istanbul-lib-source-maps@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/istanbul-lib-source-maps/-/istanbul-lib-source-maps-4.0.1.tgz#895f3a709fcfba34c6de5a42939022f3e4358551"
-  integrity sha512-n3s8EwkdFIJCG3BPKBYvskgXGoy88ARzvegkitk60NxRdwltLOTaH7CUiMRXvwYorl0Q712iEjcWB+fK/MrWVw==
-  dependencies:
-    debug "^4.1.1"
-    istanbul-lib-coverage "^3.0.0"
-    source-map "^0.6.1"
-
-istanbul-reports@^3.0.5:
-  version "3.1.5"
-  resolved "https://registry.yarnpkg.com/istanbul-reports/-/istanbul-reports-3.1.5.tgz#cc9a6ab25cb25659810e4785ed9d9fb742578bae"
-  integrity sha512-nUsEMa9pBt/NOHqbcbeJEgqIlY/K7rVWUX6Lql2orY5e9roQOthbR3vtY4zzf2orPELg80fnxxk9zUyPlgwD1w==
-  dependencies:
-    html-escaper "^2.0.0"
-    istanbul-lib-report "^3.0.0"
+    "@isaacs/cliui" "^8.0.2"
+  optionalDependencies:
+    "@pkgjs/parseargs" "^0.11.0"
 
 jake@^10.8.5:
-  version "10.8.5"
-  resolved "https://registry.yarnpkg.com/jake/-/jake-10.8.5.tgz#f2183d2c59382cb274226034543b9c03b8164c46"
-  integrity sha512-sVpxYeuAhWt0OTWITwT98oyV0GsXyMlXCF+3L1SuafBVUIr/uILGRB+NqwkzhgXKvoJpDIpQvqkUALgdmQsQxw==
+  version "10.9.2"
+  resolved "https://registry.yarnpkg.com/jake/-/jake-10.9.2.tgz#6ae487e6a69afec3a5e167628996b59f35ae2b7f"
+  integrity sha512-2P4SQ0HrLQ+fw6llpLnOaGAvN2Zu6778SJMrCUwns4fOoG9ayrTiZk3VV8sCPkVZF8ab0zksVpS8FDY5pRCNBA==
   dependencies:
     async "^3.2.3"
     chalk "^4.0.2"
-    filelist "^1.0.1"
-    minimatch "^3.0.4"
+    filelist "^1.0.4"
+    minimatch "^3.1.2"
 
-jest-util@^29.2.1:
-  version "29.2.1"
-  resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-29.2.1.tgz#f26872ba0dc8cbefaba32c34f98935f6cf5fc747"
-  integrity sha512-P5VWDj25r7kj7kl4pN2rG/RN2c1TLfYYYZYULnS/35nFDjBai+hBeo3MDrYZS7p6IoY3YHZnt2vq4L6mKnLk0g==
-  dependencies:
-    "@jest/types" "^29.2.1"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    ci-info "^3.2.0"
-    graceful-fs "^4.2.9"
-    picomatch "^2.2.3"
-
-jest-worker@^27.4.5:
-  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@^28.0.2, jest-worker@^28.1.0:
-  version "28.1.3"
-  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-28.1.3.tgz#7e3c4ce3fa23d1bb6accb169e7f396f98ed4bb98"
-  integrity sha512-CqRA220YV/6jCo8VWvAt1KKx6eek1VIHMPeLEbpcfSfkEeWyBNppynM/o6q+Wmw+sOhos2ml34wZbSX3G13//g==
-  dependencies:
-    "@types/node" "*"
-    merge-stream "^2.0.0"
-    supports-color "^8.0.0"
-
-jest-worker@^29.1.2:
-  version "29.2.1"
-  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-29.2.1.tgz#8ba68255438252e1674f990f0180c54dfa26a3b1"
-  integrity sha512-ROHTZ+oj7sBrgtv46zZ84uWky71AoYi0vEV9CdEtc1FQunsoAGe5HbQmW76nI5QWdvECVPrSi1MCVUmizSavMg==
-  dependencies:
-    "@types/node" "*"
-    jest-util "^29.2.1"
-    merge-stream "^2.0.0"
-    supports-color "^8.0.0"
-
-js-beautify@1.14.6:
-  version "1.14.6"
-  resolved "https://registry.yarnpkg.com/js-beautify/-/js-beautify-1.14.6.tgz#b23ca5d74a462c282c7711bb51150bcc97f2b507"
-  integrity sha512-GfofQY5zDp+cuHc+gsEXKPpNw2KbPddreEo35O6jT6i0RVK6LhsoYBhq5TvK4/n74wnA0QbK8gGd+jUZwTMKJw==
+js-beautify@^1.14.9:
+  version "1.15.4"
+  resolved "https://registry.yarnpkg.com/js-beautify/-/js-beautify-1.15.4.tgz#f579f977ed4c930cef73af8f98f3f0a608acd51e"
+  integrity sha512-9/KXeZUKKJwqCXUdBxFJ3vPh467OCckSBmYDwSK/EtV090K+iMJ7zx2S3HLVDIWFQdqMIsZWbnaGiba18aWhaA==
   dependencies:
     config-chain "^1.1.13"
-    editorconfig "^0.15.3"
-    glob "^8.0.3"
-    nopt "^6.0.0"
+    editorconfig "^1.0.4"
+    glob "^10.4.2"
+    js-cookie "^3.0.5"
+    nopt "^7.2.1"
 
-js-cookie@3.0.5:
+js-cookie@3.0.5, js-cookie@^3.0.5:
   version "3.0.5"
   resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-3.0.5.tgz#0b7e2fd0c01552c58ba86e0841f94dc2557dcdbc"
   integrity sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==
 
-js-sdsl@^4.1.4:
-  version "4.1.5"
-  resolved "https://registry.yarnpkg.com/js-sdsl/-/js-sdsl-4.1.5.tgz#1ff1645e6b4d1b028cd3f862db88c9d887f26e2a"
-  integrity sha512-08bOAKweV2NUC1wqTtf3qZlnpOX/R2DU9ikpjOHs0H+ibQv3zpncVQg6um4uYtRtrwIX8M4Nh3ytK4HGlYAq7Q==
-
 js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
+  integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
 
-js-tokens@^8.0.0:
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-8.0.0.tgz#5dbe2cdfa9afc93251d3a77bf18c3ad6fa8a4de4"
-  integrity sha512-PC7MzqInq9OqKyTXfIvQNcjMkODJYC8A17kAaQgeW79yfhqTWSOfjHYQ2mDDcwJ96Iibtwkfh0C7R/OvqPlgVA==
+js-tokens@^9.0.0:
+  version "9.0.1"
+  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-9.0.1.tgz#2ec43964658435296f6761b34e10671c2d9527f4"
+  integrity sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==
 
 js-yaml@4.1.0, js-yaml@^4.1.0:
   version "4.1.0"
@@ -5870,58 +5522,54 @@ js-yaml@4.1.0, js-yaml@^4.1.0:
   dependencies:
     argparse "^2.0.1"
 
-jsdom@19.0.0:
-  version "19.0.0"
-  resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-19.0.0.tgz#93e67c149fe26816d38a849ea30ac93677e16b6a"
-  integrity sha512-RYAyjCbxy/vri/CfnjUWJQQtZ3LKlLnDqj+9XLNnJPgEGeirZs3hllKR20re8LUZ6o1b1X4Jat+Qd26zmP41+A==
+jsbn@1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-1.1.0.tgz#b01307cb29b618a1ed26ec79e911f803c4da0040"
+  integrity sha512-4bYVV3aAMtDTTu4+xsDYa6sy9GyJ69/amsu9sYF2zqjiEoZA5xJi3BrfX3uY+/IekIu7MwdObdbDWpoZdBv3/A==
+
+jsdom@^24.1.0:
+  version "24.1.3"
+  resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-24.1.3.tgz#88e4a07cb9dd21067514a619e9f17b090a394a9f"
+  integrity sha512-MyL55p3Ut3cXbeBEG7Hcv0mVM8pp8PBNWxRqchZnSfAiES1v1mRnMeFfaHWIPULpwsYfvO+ZmMZz5tGCnjzDUQ==
   dependencies:
-    abab "^2.0.5"
-    acorn "^8.5.0"
-    acorn-globals "^6.0.0"
-    cssom "^0.5.0"
-    cssstyle "^2.3.0"
-    data-urls "^3.0.1"
-    decimal.js "^10.3.1"
-    domexception "^4.0.0"
-    escodegen "^2.0.0"
+    cssstyle "^4.0.1"
+    data-urls "^5.0.0"
+    decimal.js "^10.4.3"
     form-data "^4.0.0"
-    html-encoding-sniffer "^3.0.0"
-    http-proxy-agent "^5.0.0"
-    https-proxy-agent "^5.0.0"
+    html-encoding-sniffer "^4.0.0"
+    http-proxy-agent "^7.0.2"
+    https-proxy-agent "^7.0.5"
     is-potential-custom-element-name "^1.0.1"
-    nwsapi "^2.2.0"
-    parse5 "6.0.1"
-    saxes "^5.0.1"
+    nwsapi "^2.2.12"
+    parse5 "^7.1.2"
+    rrweb-cssom "^0.7.1"
+    saxes "^6.0.0"
     symbol-tree "^3.2.4"
-    tough-cookie "^4.0.0"
-    w3c-hr-time "^1.0.2"
-    w3c-xmlserializer "^3.0.0"
+    tough-cookie "^4.1.4"
+    w3c-xmlserializer "^5.0.0"
     webidl-conversions "^7.0.0"
-    whatwg-encoding "^2.0.0"
-    whatwg-mimetype "^3.0.0"
-    whatwg-url "^10.0.0"
-    ws "^8.2.3"
-    xml-name-validator "^4.0.0"
+    whatwg-encoding "^3.1.1"
+    whatwg-mimetype "^4.0.0"
+    whatwg-url "^14.0.0"
+    ws "^8.18.0"
+    xml-name-validator "^5.0.0"
 
-jsesc@^2.5.1:
-  version "2.5.2"
-  resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4"
-  integrity sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==
+jsesc@^3.0.2:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-3.1.0.tgz#74d335a234f67ed19907fdadfac7ccf9d409825d"
+  integrity sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==
 
-jsesc@~0.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
+jsesc@~3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-3.0.2.tgz#bb8b09a6597ba426425f2e4a07245c3d00b9343e"
+  integrity sha512-xKqzzWXDttJuOcawBt4KnKHHIf5oQ/Cxax+0PWFG+DFDgHNAdi+TXECADI+RYiFUMmx8792xsMbbgXj4CwnP4g==
 
-json-loader@0.5.7:
-  version "0.5.7"
-  resolved "https://registry.yarnpkg.com/json-loader/-/json-loader-0.5.7.tgz#dca14a70235ff82f0ac9a3abeb60d337a365185d"
-  integrity sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w==
+json-buffer@3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/json-buffer/-/json-buffer-3.0.1.tgz#9338802a30d3b6605fbe0613e094008ca8c05a13"
+  integrity sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==
 
-json-parse-better-errors@^1.0.1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
-
-json-parse-even-better-errors@^2.3.1:
+json-parse-even-better-errors@^2.3.0:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
   integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
@@ -5929,6 +5577,7 @@ json-parse-even-better-errors@^2.3.1:
 json-schema-traverse@^0.4.1:
   version "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"
@@ -5938,51 +5587,21 @@ json-schema-traverse@^1.0.0:
 json-stable-stringify-without-jsonify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
+  integrity sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==
 
-json5@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe"
+json5@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.2.tgz#63d98d60f21b313b77c4d6da18bfa69d80e1d593"
+  integrity sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==
   dependencies:
     minimist "^1.2.0"
 
-json5@^2.1.2:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/json5/-/json5-2.1.3.tgz#c9b0f7fa9233bfe5807fe66fcf3a5617ed597d43"
-  integrity sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==
-  dependencies:
-    minimist "^1.2.5"
-
-json5@^2.2.0, json5@^2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.1.tgz#655d50ed1e6f95ad1a3caababd2b0efda10b395c"
-  integrity sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==
-
-json5@^2.2.2:
+json5@^2.2.3:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
   integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
 
-jsonc-eslint-parser@^1.0.1:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/jsonc-eslint-parser/-/jsonc-eslint-parser-1.4.1.tgz#8cbe99f6f5199acbc5a823c4c0b6135411027fa6"
-  integrity sha512-hXBrvsR1rdjmB2kQmUjf1rEIa+TqHBGMge8pwi++C+Si1ad7EjZrJcpgwym+QGK/pqTx+K7keFAtLlVNdLRJOg==
-  dependencies:
-    acorn "^7.4.1"
-    eslint-utils "^2.1.0"
-    eslint-visitor-keys "^1.3.0"
-    espree "^6.0.0"
-    semver "^6.3.0"
-
-jsonfile@^6.0.1:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-6.1.0.tgz#bc55b2634793c679ec6403094eb13698a6ec0aae"
-  integrity sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==
-  dependencies:
-    universalify "^2.0.0"
-  optionalDependencies:
-    graceful-fs "^4.1.6"
-
-jszip@^3.10.0:
+jszip@^3.10.1:
   version "3.10.1"
   resolved "https://registry.yarnpkg.com/jszip/-/jszip-3.10.1.tgz#34aee70eb18ea1faec2f589208a157d1feb091c2"
   integrity sha512-xXDvecyTpGLrqFrvkrUSoxxfJI5AH7U8zxxtVclpsUtMCq4JQ290LY8AW5c7Ggnr/Y/oK+bQMbqK2qmtk3pN4g==
@@ -5992,128 +5611,41 @@ jszip@^3.10.0:
     readable-stream "~2.3.6"
     setimmediate "^1.0.5"
 
-just-extend@^4.0.2:
-  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-4.2.1.tgz#ef5e589afb61e5d66b24eca749409a8939a8c744"
-  integrity sha512-g3UB796vUFIY90VIv/WX3L2c8CS2MdWUww3CNrYmqza1Fg0DURc2K/O4YrnklBdQarSJ/y8JnJYDGc+1iumQjg==
-
-karma-coverage@2.2.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/karma-coverage/-/karma-coverage-2.2.0.tgz#64f838b66b71327802e7f6f6c39d569b7024e40c"
-  integrity sha512-gPVdoZBNDZ08UCzdMHHhEImKrw1+PAOQOIiffv1YsvxFhBjqvo/SVXNk4tqn1SYqX0BJZT6S/59zgxiBe+9OuA==
+keyv@^4.5.4:
+  version "4.5.4"
+  resolved "https://registry.yarnpkg.com/keyv/-/keyv-4.5.4.tgz#a879a99e29452f942439f2a405e3af8b31d4de93"
+  integrity sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==
   dependencies:
-    istanbul-lib-coverage "^3.2.0"
-    istanbul-lib-instrument "^5.1.0"
-    istanbul-lib-report "^3.0.0"
-    istanbul-lib-source-maps "^4.0.1"
-    istanbul-reports "^3.0.5"
-    minimatch "^3.0.4"
+    json-buffer "3.0.1"
 
-karma-firefox-launcher@2.1.3:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/karma-firefox-launcher/-/karma-firefox-launcher-2.1.3.tgz#b278a4cbffa92ab81394b1a398813847b0624a85"
-  integrity sha512-LMM2bseebLbYjODBOVt7TCPP9OI2vZIXCavIXhkO9m+10Uj5l7u/SKoeRmYx8FYHTVGZSpk6peX+3BMHC1WwNw==
+keyv@^5.5.3:
+  version "5.5.3"
+  resolved "https://registry.yarnpkg.com/keyv/-/keyv-5.5.3.tgz#db7b7f89b3e13ade5a8d0fe59d765aebb596e84b"
+  integrity sha512-h0Un1ieD+HUrzBH6dJXhod3ifSghk5Hw/2Y4/KHBziPlZecrFyE9YOTPU6eOs0V9pYl8gOs86fkr/KN8lUX39A==
   dependencies:
-    is-wsl "^2.2.0"
-    which "^3.0.0"
-
-karma-mocha-reporter@2.2.5:
-  version "2.2.5"
-  resolved "https://registry.yarnpkg.com/karma-mocha-reporter/-/karma-mocha-reporter-2.2.5.tgz#15120095e8ed819186e47a0b012f3cd741895560"
-  integrity sha1-FRIAlejtgZGG5HoLAS8810GJVWA=
-  dependencies:
-    chalk "^2.1.0"
-    log-symbols "^2.1.0"
-    strip-ansi "^4.0.0"
-
-karma-mocha@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/karma-mocha/-/karma-mocha-2.0.1.tgz#4b0254a18dfee71bdbe6188d9a6861bf86b0cd7d"
-  integrity sha512-Tzd5HBjm8his2OA4bouAsATYEpZrp9vC7z5E5j4C5Of5Rrs1jY67RAwXNcVmd/Bnk1wgvQRou0zGVLey44G4tQ==
-  dependencies:
-    minimist "^1.2.3"
-
-karma-sinon-chai@2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/karma-sinon-chai/-/karma-sinon-chai-2.0.2.tgz#e28c109b989973abafc28a7c9f09ef24a05e07c2"
-  integrity sha512-SDgh6V0CUd+7ruL1d3yG6lFzmJNGRNQuEuCYXLaorruNP9nwQfA7hpsp4clx4CbOo5Gsajh3qUOT7CrVStUKMw==
-
-karma-sourcemap-loader@0.3.8:
-  version "0.3.8"
-  resolved "https://registry.yarnpkg.com/karma-sourcemap-loader/-/karma-sourcemap-loader-0.3.8.tgz#d4bae72fb7a8397328a62b75013d2df937bdcf9c"
-  integrity sha512-zorxyAakYZuBcHRJE+vbrK2o2JXLFWK8VVjiT/6P+ltLBUGUvqTEkUiQ119MGdOrK7mrmxXHZF1/pfT6GgIZ6g==
-  dependencies:
-    graceful-fs "^4.1.2"
-
-karma-spec-reporter@0.0.36:
-  version "0.0.36"
-  resolved "https://registry.yarnpkg.com/karma-spec-reporter/-/karma-spec-reporter-0.0.36.tgz#c54dc155dec2ded1f92ea68dbbdd67fcedbef350"
-  integrity sha512-11bvOl1x6ryKZph7kmbmMpbi8vsngEGxGOoeTlIcDaH3ab3j8aPJnZ+r+K/SS0sBSGy5VGkGYO2+hLct7hw/6w==
-  dependencies:
-    colors "1.4.0"
-
-karma-webpack@5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/karma-webpack/-/karma-webpack-5.0.0.tgz#2a2c7b80163fe7ffd1010f83f5507f95ef39f840"
-  integrity sha512-+54i/cd3/piZuP3dr54+NcFeKOPnys5QeM1IY+0SPASwrtHsliXUiCL50iW+K9WWA7RvamC4macvvQ86l3KtaA==
-  dependencies:
-    glob "^7.1.3"
-    minimatch "^3.0.4"
-    webpack-merge "^4.1.5"
-
-karma@6.4.4:
-  version "6.4.4"
-  resolved "https://registry.yarnpkg.com/karma/-/karma-6.4.4.tgz#dfa5a426cf5a8b53b43cd54ef0d0d09742351492"
-  integrity sha512-LrtUxbdvt1gOpo3gxG+VAJlJAEMhbWlM4YrFQgql98FwF7+K8K12LYO4hnDdUkNjeztYrOXEMqgTajSWgmtI/w==
-  dependencies:
-    "@colors/colors" "1.5.0"
-    body-parser "^1.19.0"
-    braces "^3.0.2"
-    chokidar "^3.5.1"
-    connect "^3.7.0"
-    di "^0.0.1"
-    dom-serialize "^2.2.1"
-    glob "^7.1.7"
-    graceful-fs "^4.2.6"
-    http-proxy "^1.18.1"
-    isbinaryfile "^4.0.8"
-    lodash "^4.17.21"
-    log4js "^6.4.1"
-    mime "^2.5.2"
-    minimatch "^3.0.4"
-    mkdirp "^0.5.5"
-    qjobs "^1.2.0"
-    range-parser "^1.2.1"
-    rimraf "^3.0.2"
-    socket.io "^4.7.2"
-    source-map "^0.6.1"
-    tmp "^0.2.1"
-    ua-parser-js "^0.7.30"
-    yargs "^16.1.1"
+    "@keyv/serialize" "^1.1.1"
 
 kind-of@^6.0.2:
-  version "6.0.2"
-  resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.2.tgz#01146b36a6218e64e58f3a8d66de5d7fc6f6d051"
-
-kind-of@^6.0.3:
   version "6.0.3"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.3.tgz#07c05034a6c349fa06e24fa35aa76db4580ce4dd"
   integrity sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==
 
-klona@^2.0.5:
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/klona/-/klona-2.0.5.tgz#d166574d90076395d9963aa7a928fabb8d76afbc"
-  integrity sha512-pJiBpiXMbt7dkzXe8Ghj/u4FfXOOa98fPW+bihOJ4SjnoijweJrNThJfd3ifXpXhREjpoF2mZVH1GfS9LV3kHQ==
+known-css-properties@^0.35.0:
+  version "0.35.0"
+  resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.35.0.tgz#f6f8e40ab4e5700fa32f5b2ef5218a56bc853bd6"
+  integrity sha512-a/RAk2BfKk+WFGhhOCAYqSiFLc34k8Mt/6NWRI4joER0EYUzXIcFivjjnoD3+XU1DggLn/tZc3DOAgke7l8a4A==
 
-klona@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/klona/-/klona-2.0.6.tgz#85bffbf819c03b2f53270412420a4555ef882e22"
-  integrity sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==
+known-css-properties@^0.37.0:
+  version "0.37.0"
+  resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.37.0.tgz#10ebe49b9dbb6638860ff8a002fb65a053f4aec5"
+  integrity sha512-JCDrsP4Z1Sb9JwG0aJ8Eo2r7k4Ou5MwmThS/6lcIe1ICyb7UBJKGRIUUdqc2ASdE/42lgz6zFUnzAIhtXnBVrQ==
 
-known-css-properties@^0.26.0:
-  version "0.26.0"
-  resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.26.0.tgz#008295115abddc045a9f4ed7e2a84dc8b3a77649"
-  integrity sha512-5FZRzrZzNTBruuurWpvZnvP9pum+fe0HcK8z/ooo+U+Hmp4vtbyp1/QDsqmufirXy4egGzbaH/y2uCZf+6W5Kg==
+lazystream@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/lazystream/-/lazystream-1.0.1.tgz#494c831062f1f9408251ec44db1cba29242a2638"
+  integrity sha512-b94GiNHQNy6JNTrt5w6zNyffMrNkXZb3KTkCZJb2V1xaEGCk093vkZ2jk3tpaeP33/OiXC+WvK9AxUebnf5nbw==
+  dependencies:
+    readable-stream "^2.0.5"
 
 levn@^0.4.1:
   version "0.4.1"
@@ -6123,17 +5655,10 @@ levn@^0.4.1:
     prelude-ls "^1.2.1"
     type-check "~0.4.0"
 
-levn@~0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee"
-  integrity sha512-0OO4y2iOHix2W6ujICbKIaEQXvFQHue65vUG3pb5EUomzPI90z9hsA1VsO/dbIIpC53J8gxM9Q4Oho0jrCM/yA==
-  dependencies:
-    prelude-ls "~1.1.2"
-    type-check "~0.3.2"
-
 lie@3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/lie/-/lie-3.1.1.tgz#9a436b2cc7746ca59de7a41fa469b3efb76bd87e"
+  integrity sha512-RiNhHysUjhrDQntfYSfY4MU24coXXdEOgw9WGcKHNeEwffDYbF//u87M1EWaMGzuFoSbqW0C9C6lEEhDOAswfw==
   dependencies:
     immediate "~3.0.5"
 
@@ -6144,37 +5669,10 @@ lie@~3.3.0:
   dependencies:
     immediate "~3.0.5"
 
-lilconfig@^2.0.3:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.0.6.tgz#32a384558bd58af3d4c6e077dd1ad1d397bc69d4"
-  integrity sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==
-
 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"
-  integrity sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA=
-
-loader-runner@^4.2.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.3.0.tgz#c1b4a163b99f614830353b16755e7149ac2314e1"
-  integrity sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg==
-
-loader-utils@^1.0.2:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
-  dependencies:
-    big.js "^5.2.2"
-    emojis-list "^2.0.0"
-    json5 "^1.0.1"
-
-loader-utils@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.0.tgz#e4cace5b816d425a166b5f097e10cd12b36064b0"
-  integrity sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==
-  dependencies:
-    big.js "^5.2.2"
-    emojis-list "^3.0.0"
-    json5 "^2.1.2"
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
+  integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
 
 localforage@1.10.0:
   version "1.10.0"
@@ -6186,6 +5684,7 @@ localforage@1.10.0:
 locate-path@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-3.0.0.tgz#dbec3b3ab759758071b58fe59fc41871af21400e"
+  integrity sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==
   dependencies:
     p-locate "^3.0.0"
     path-exists "^3.0.0"
@@ -6204,248 +5703,56 @@ locate-path@^6.0.0:
   dependencies:
     p-locate "^5.0.0"
 
-locate-path@^7.1.0:
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-7.2.0.tgz#69cb1779bd90b35ab1e771e1f2f89a202c2a8a8a"
-  integrity sha512-gvVijfZvn7R+2qyPX8mAuKcFGDf6Nc61GdvGafQsHL0sBIxfKzA+usWn4GFC/bk+QdwPUD4kWFJLhElipq+0VA==
-  dependencies:
-    p-locate "^6.0.0"
-
-lodash._arraycopy@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz#76e7b7c1f1fb92547374878a562ed06a3e50f6e1"
-
-lodash._arrayeach@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz#bab156b2a90d3f1bbd5c653403349e5e5933ef9e"
-
-lodash._baseassign@^3.0.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz#8c38a099500f215ad09e59f1722fd0c52bfe0a4e"
-  dependencies:
-    lodash._basecopy "^3.0.0"
-    lodash.keys "^3.0.0"
-
-lodash._basecallback@^3.0.0:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/lodash._basecallback/-/lodash._basecallback-3.3.1.tgz#b7b2bb43dc2160424a21ccf26c57e443772a8e27"
-  dependencies:
-    lodash._baseisequal "^3.0.0"
-    lodash._bindcallback "^3.0.0"
-    lodash.isarray "^3.0.0"
-    lodash.pairs "^3.0.0"
-
-lodash._baseclone@^3.0.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz#303519bf6393fe7e42f34d8b630ef7794e3542b7"
-  dependencies:
-    lodash._arraycopy "^3.0.0"
-    lodash._arrayeach "^3.0.0"
-    lodash._baseassign "^3.0.0"
-    lodash._basefor "^3.0.0"
-    lodash.isarray "^3.0.0"
-    lodash.keys "^3.0.0"
-
-lodash._basecopy@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz#8da0e6a876cf344c0ad8a54882111dd3c5c7ca36"
-
-lodash._baseeach@^3.0.0:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/lodash._baseeach/-/lodash._baseeach-3.0.4.tgz#cf8706572ca144e8d9d75227c990da982f932af3"
-  dependencies:
-    lodash.keys "^3.0.0"
-
-lodash._basefind@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._basefind/-/lodash._basefind-3.0.0.tgz#b2bba05cc645f972de2cf925fa2bf63a0f60c8ae"
-
-lodash._basefindindex@^3.0.0:
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/lodash._basefindindex/-/lodash._basefindindex-3.6.0.tgz#f083360a1b022418ed81bc899beb312e21e74a4f"
-
-lodash._basefor@^3.0.0:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/lodash._basefor/-/lodash._basefor-3.0.3.tgz#7550b4e9218ef09fad24343b612021c79b4c20c2"
-
-lodash._baseisequal@^3.0.0:
-  version "3.0.7"
-  resolved "https://registry.yarnpkg.com/lodash._baseisequal/-/lodash._baseisequal-3.0.7.tgz#d8025f76339d29342767dcc887ce5cb95a5b51f1"
-  dependencies:
-    lodash.isarray "^3.0.0"
-    lodash.istypedarray "^3.0.0"
-    lodash.keys "^3.0.0"
-
-lodash._bindcallback@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz#e531c27644cf8b57a99e17ed95b35c748789392e"
-
-lodash._createassigner@^3.0.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/lodash._createassigner/-/lodash._createassigner-3.1.1.tgz#838a5bae2fdaca63ac22dee8e19fa4e6d6970b11"
-  dependencies:
-    lodash._bindcallback "^3.0.0"
-    lodash._isiterateecall "^3.0.0"
-    lodash.restparam "^3.0.0"
-
-lodash._getnative@^3.0.0:
-  version "3.9.1"
-  resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5"
-
-lodash._isiterateecall@^3.0.0:
-  version "3.0.9"
-  resolved "https://registry.yarnpkg.com/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz#5203ad7ba425fae842460e696db9cf3e6aac057c"
-
-lodash.clone@3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/lodash.clone/-/lodash.clone-3.0.3.tgz#84688c73d32b5a90ca25616963f189252a997043"
-  dependencies:
-    lodash._baseclone "^3.0.0"
-    lodash._bindcallback "^3.0.0"
-    lodash._isiterateecall "^3.0.0"
-
 lodash.debounce@^4.0.8:
   version "4.0.8"
   resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
-  integrity sha1-gteb/zCmfEAF/9XiUVMArZyk168=
+  integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==
 
-lodash.defaultsdeep@4.6.1:
-  version "4.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz#512e9bd721d272d94e3d3a63653fa17516741ca6"
-  integrity sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==
+lodash.defaults@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/lodash.defaults/-/lodash.defaults-4.2.0.tgz#d09178716ffea4dde9e5fb7b37f6f0802274580c"
+  integrity sha512-qjxPLHd3r5DnsdGacqOMU6pb/avJzdh9tFX2ymgoZE27BmjXrNy/y4LoaiTeAb+O3gL8AfpJGtqfX/ae2leYYQ==
 
-lodash.escape@4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/lodash.escape/-/lodash.escape-4.0.1.tgz#c9044690c21e04294beaa517712fded1fa88de98"
-  integrity sha512-nXEOnb/jK9g0DYMr1/Xvq6l5xMD7GDG55+GSYIYmS0G4tBk/hURD4JR9WCavs04t33WmJx9kCyp9vJ+mr4BOUw==
+lodash.difference@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.difference/-/lodash.difference-4.5.0.tgz#9ccb4e505d486b91651345772885a2df27fd017c"
+  integrity sha512-dS2j+W26TQ7taQBGN8Lbbq04ssV3emRw4NY58WErlTO29pIqS0HmoT5aJ9+TUQ1N3G+JOZSji4eugsWwGp9yPA==
 
-lodash.find@^3.2.1:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/lodash.find/-/lodash.find-3.2.1.tgz#046e319f3ace912ac6c9246c7f683c5ec07b36ad"
-  dependencies:
-    lodash._basecallback "^3.0.0"
-    lodash._baseeach "^3.0.0"
-    lodash._basefind "^3.0.0"
-    lodash._basefindindex "^3.0.0"
-    lodash.isarray "^3.0.0"
-    lodash.keys "^3.0.0"
+lodash.flatten@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/lodash.flatten/-/lodash.flatten-4.4.0.tgz#f31c22225a9632d2bbf8e4addbef240aa765a61f"
+  integrity sha512-C5N2Z3DgnnKr0LOpv/hKCgKdb7ZZwafIrsesve6lmzvZIRZRGaZ/l6Q8+2W7NaT+ZwO3fFlSCzCzrDCFdJfZ4g==
 
 lodash.get@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
   integrity sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==
 
-lodash.isarguments@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a"
+lodash.isplainobject@^4.0.6:
+  version "4.0.6"
+  resolved "https://registry.yarnpkg.com/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz#7c526a52d89b45c45cc690b88163be0497f550cb"
+  integrity sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==
 
-lodash.isarray@^3.0.0:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/lodash.isarray/-/lodash.isarray-3.0.4.tgz#79e4eb88c36a8122af86f844aa9bcd851b5fbb55"
-
-lodash.isequal@^4.2.0:
-  version "4.5.0"
-  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
-
-lodash.isfunction@^3.0.8:
-  version "3.0.9"
-  resolved "https://registry.yarnpkg.com/lodash.isfunction/-/lodash.isfunction-3.0.9.tgz#06de25df4db327ac931981d1bdb067e5af68d051"
-  integrity sha512-AirXNj15uRIMMPihnkInB4i3NHeb4iBtNg9WRWuK2o31S+ePwwNmDPaTL3o7dTJ+VXNZim7rFs4rxN4YU1oUJw==
-
-lodash.isplainobject@^3.0.0, lodash.isplainobject@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/lodash.isplainobject/-/lodash.isplainobject-3.2.0.tgz#9a8238ae16b200432960cd7346512d0123fbf4c5"
-  dependencies:
-    lodash._basefor "^3.0.0"
-    lodash.isarguments "^3.0.0"
-    lodash.keysin "^3.0.0"
-
-lodash.istypedarray@^3.0.0:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/lodash.istypedarray/-/lodash.istypedarray-3.0.6.tgz#c9a477498607501d8e8494d283b87c39281cef62"
-
-lodash.keys@^3.0.0:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
-  dependencies:
-    lodash._getnative "^3.0.0"
-    lodash.isarguments "^3.0.0"
-    lodash.isarray "^3.0.0"
-
-lodash.keysin@^3.0.0:
-  version "3.0.8"
-  resolved "https://registry.yarnpkg.com/lodash.keysin/-/lodash.keysin-3.0.8.tgz#22c4493ebbedb1427962a54b445b2c8a767fb47f"
-  dependencies:
-    lodash.isarguments "^3.0.0"
-    lodash.isarray "^3.0.0"
-
-lodash.memoize@^4.1.2:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
-  integrity sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==
-
-lodash.merge@4.6.2, lodash.merge@^4.6.2:
+lodash.merge@^4.6.2:
   version "4.6.2"
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
   integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
 
-lodash.merge@^3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-3.3.2.tgz#0d90d93ed637b1878437bb3e21601260d7afe994"
-  dependencies:
-    lodash._arraycopy "^3.0.0"
-    lodash._arrayeach "^3.0.0"
-    lodash._createassigner "^3.0.0"
-    lodash._getnative "^3.0.0"
-    lodash.isarguments "^3.0.0"
-    lodash.isarray "^3.0.0"
-    lodash.isplainobject "^3.0.0"
-    lodash.istypedarray "^3.0.0"
-    lodash.keys "^3.0.0"
-    lodash.keysin "^3.0.0"
-    lodash.toplainobject "^3.0.0"
-
-lodash.pairs@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash.pairs/-/lodash.pairs-3.0.1.tgz#bbe08d5786eeeaa09a15c91ebf0dcb7d2be326a9"
-  dependencies:
-    lodash.keys "^3.0.0"
-
-lodash.pick@4.4.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/lodash.pick/-/lodash.pick-4.4.0.tgz#52f05610fff9ded422611441ed1fc123a03001b3"
-  integrity sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==
-
-lodash.restparam@^3.0.0:
-  version "3.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.restparam/-/lodash.restparam-3.6.1.tgz#936a4e309ef330a7645ed4145986c85ae5b20805"
-
-lodash.toplainobject@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash.toplainobject/-/lodash.toplainobject-3.0.0.tgz#28790ad942d293d78aa663a07ecf7f52ca04198d"
-  dependencies:
-    lodash._basecopy "^3.0.0"
-    lodash.keysin "^3.0.0"
-
 lodash.truncate@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.truncate/-/lodash.truncate-4.4.2.tgz#5a350da0b1113b837ecfffd5812cbe58d6eae193"
   integrity sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==
 
-lodash.uniq@^4.5.0:
-  version "4.5.0"
-  resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
-  integrity sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==
+lodash.union@^4.6.0:
+  version "4.6.0"
+  resolved "https://registry.yarnpkg.com/lodash.union/-/lodash.union-4.6.0.tgz#48bb5088409f16f1821666641c44dd1aaae3cd88"
+  integrity sha512-c4pB2CdGrGdjMKYLA+XiRDO7Y0PRQbm/Gzg8qMj+QH+pFVAoTp5sBpO0odL3FjoPCGjK96p6qsP+yQoiLoOBcw==
 
-lodash@4.17.21, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21:
+lodash@4.17.21, lodash@^4.17.10, lodash@^4.17.21:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
-lodash@^4.17.10:
-  version "4.17.11"
-  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
-
 log-symbols@4.1.0, log-symbols@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-4.1.0.tgz#3fbdbb95b4683ac9fc785111e792e558d4abd503"
@@ -6454,50 +5761,22 @@ log-symbols@4.1.0, log-symbols@^4.1.0:
     chalk "^4.1.0"
     is-unicode-supported "^0.1.0"
 
-log-symbols@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-1.0.2.tgz#376ff7b58ea3086a0f09facc74617eca501e1a18"
+loupe@^2.3.7:
+  version "2.3.7"
+  resolved "https://registry.yarnpkg.com/loupe/-/loupe-2.3.7.tgz#6e69b7d4db7d3ab436328013d37d1c8c3540c697"
+  integrity sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==
   dependencies:
-    chalk "^1.0.0"
+    get-func-name "^2.0.1"
 
-log-symbols@^2.1.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-2.2.0.tgz#5740e1c5d6f0dfda4ad9323b5332107ef6b4c40a"
-  dependencies:
-    chalk "^2.0.1"
+loupe@^3.1.0, loupe@^3.1.3:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/loupe/-/loupe-3.1.3.tgz#042a8f7986d77f3d0f98ef7990a2b2fef18b0fd2"
+  integrity sha512-kkIp7XSkP78ZxJEsSxW3712C6teJVoeHHwgo9zJ380de7IYyJ2ISlxojcH2pC5OFLewESmnRi/+XCDIEEVyoug==
 
-log4js@^6.4.1:
-  version "6.4.4"
-  resolved "https://registry.yarnpkg.com/log4js/-/log4js-6.4.4.tgz#c9bc75569f3f40bba22fe1bd0677afa7a6a13bac"
-  integrity sha512-ncaWPsuw9Vl1CKA406hVnJLGQKy1OHx6buk8J4rE2lVW+NW5Y82G5/DIloO7NkqLOUtNPEANaWC1kZYVjXssPw==
-  dependencies:
-    date-format "^4.0.6"
-    debug "^4.3.4"
-    flatted "^3.2.5"
-    rfdc "^1.3.0"
-    streamroller "^3.0.6"
-
-loupe@2.3.4, loupe@^2.3.1:
-  version "2.3.4"
-  resolved "https://registry.yarnpkg.com/loupe/-/loupe-2.3.4.tgz#7e0b9bffc76f148f9be769cb1321d3dcf3cb25f3"
-  integrity sha512-OvKfgCC2Ndby6aSTREl5aCCPTNIzlDfQZvZxNUrBrihDhL3xcrYegTblhmEiCrg2kKQz4XsFIaemE5BF4ybSaQ==
-  dependencies:
-    get-func-name "^2.0.0"
-
-lower-case@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28"
-  integrity sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==
-  dependencies:
-    tslib "^2.0.3"
-
-lru-cache@^4.1.5:
-  version "4.1.5"
-  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
-  integrity sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==
-  dependencies:
-    pseudomap "^1.0.2"
-    yallist "^2.1.2"
+lru-cache@^10.2.0, lru-cache@^10.4.3:
+  version "10.4.3"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-10.4.3.tgz#410fc8a17b70e598013df257c2446b7f3383f119"
+  integrity sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==
 
 lru-cache@^5.1.1:
   version "5.1.1"
@@ -6513,85 +5792,72 @@ lru-cache@^6.0.0:
   dependencies:
     yallist "^4.0.0"
 
-magic-string@^0.25.7:
-  version "0.25.9"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c"
-  integrity sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==
-  dependencies:
-    sourcemap-codec "^1.4.8"
+lru-cache@^7.14.1:
+  version "7.18.3"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-7.18.3.tgz#f793896e0fd0e954a59dfdd82f0773808df6aa89"
+  integrity sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==
 
-magic-string@^0.30.5:
-  version "0.30.5"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.5.tgz#1994d980bd1c8835dc6e78db7cbd4ae4f24746f9"
-  integrity sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==
+lz-string@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941"
+  integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==
+
+magic-string@^0.30.17:
+  version "0.30.18"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.18.tgz#905bfbbc6aa5692703a93db26a9edcaa0007d2bb"
+  integrity sha512-yi8swmWbO17qHhwIBNeeZxTceJMeBvWJaId6dyvTSOwTipqeHhMhOrz6513r1sOKnpvQ7zkhlG8tPrpilwTxHQ==
   dependencies:
-    "@jridgewell/sourcemap-codec" "^1.4.15"
+    "@jridgewell/sourcemap-codec" "^1.5.5"
+
+magic-string@^0.30.19:
+  version "0.30.19"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.19.tgz#cebe9f104e565602e5d2098c5f2e79a77cc86da9"
+  integrity sha512-2N21sPY9Ws53PZvsEpVtNuSW+ScYbQdp4b9qUaL+9QkHUrGFKo56Lg9Emg5s9V/qrtNBmiR01sYhUOwu3H+VOw==
+  dependencies:
+    "@jridgewell/sourcemap-codec" "^1.5.5"
 
 make-dir@^2.0.0, make-dir@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
+  integrity sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==
   dependencies:
     pify "^4.0.1"
     semver "^5.6.0"
 
-make-dir@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f"
-  integrity sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==
-  dependencies:
-    semver "^6.0.0"
-
-map-obj@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
-
-map-obj@^4.0.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-4.1.0.tgz#b91221b542734b9f14256c0132c897c5d7256fd5"
-  integrity sha512-glc9y00wgtwcDmp7GaE/0b0OnxpNJsVf3ael/An6Fe2Q51LLwN1er6sdomLRzz5h0+yMpiYLhWYF5R7HeqVd4g==
+math-intrinsics@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/math-intrinsics/-/math-intrinsics-1.1.0.tgz#a0dd74be81e2aa5c2f27e65ce283605ee4e2b7f9"
+  integrity sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==
 
 mathml-tag-names@^2.1.3:
   version "2.1.3"
   resolved "https://registry.yarnpkg.com/mathml-tag-names/-/mathml-tag-names-2.1.3.tgz#4ddadd67308e780cf16a47685878ee27b736a0a3"
   integrity sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==
 
-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==
+mdn-data@2.12.2:
+  version "2.12.2"
+  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.12.2.tgz#9ae6c41a9e65adf61318b32bff7b64fbfb13f8cf"
+  integrity sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==
 
-media-typer@0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"
+mdn-data@^2.15.0:
+  version "2.19.0"
+  resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.19.0.tgz#e7195c44715be0485e4cb4997082133db8d2fd16"
+  integrity sha512-vXxcNOxiaUhwoBShl2gd8xOQFeKWLosotfwPeRQsDwtruBSDFAzPPLfg2KMgdK8iz4RUVdswyWMuZwOVojrVZQ==
 
-memory-fs@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
-  dependencies:
-    errno "^0.1.3"
-    readable-stream "^2.0.1"
+media-typer@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-1.1.0.tgz#6ab74b8f2d3320f2064b2a87a38e7931ff3a5561"
+  integrity sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==
 
-meow@^9.0.0:
-  version "9.0.0"
-  resolved "https://registry.yarnpkg.com/meow/-/meow-9.0.0.tgz#cd9510bc5cac9dee7d03c73ee1f9ad959f4ea364"
-  integrity sha512-+obSblOQmRhcyBt62furQqRAQpNyWXo8BuQ5bN7dG8wmwQ+vwHKp/rCFD4CrTP8CsDQD1sjoZ94K417XEUk8IQ==
-  dependencies:
-    "@types/minimist" "^1.2.0"
-    camelcase-keys "^6.2.2"
-    decamelize "^1.2.0"
-    decamelize-keys "^1.1.0"
-    hard-rejection "^2.1.0"
-    minimist-options "4.1.0"
-    normalize-package-data "^3.0.0"
-    read-pkg-up "^7.0.1"
-    redent "^3.0.0"
-    trim-newlines "^3.0.0"
-    type-fest "^0.18.0"
-    yargs-parser "^20.2.3"
+meow@^13.2.0:
+  version "13.2.0"
+  resolved "https://registry.yarnpkg.com/meow/-/meow-13.2.0.tgz#6b7d63f913f984063b3cc261b6e8800c4cd3474f"
+  integrity sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==
 
-merge-descriptors@1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61"
+merge-descriptors@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-2.0.0.tgz#ea922f660635a2249ee565e0449f951e6b603808"
+  integrity sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==
 
 merge-stream@^2.0.0:
   version "2.0.0"
@@ -6603,93 +5869,50 @@ merge2@^1.3.0, merge2@^1.4.1:
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
   integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
 
-methods@~1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
-
-micromatch@^4.0.2:
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.2.tgz#4fcb0999bf9fbc2fcbdd212f6d629b9a56c39259"
-  integrity sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==
+micromatch@^4.0.5, micromatch@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.8.tgz#d66fa18f3a47076789320b9b1af32bd86d9fa202"
+  integrity sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==
   dependencies:
-    braces "^3.0.1"
-    picomatch "^2.0.5"
-
-micromatch@^4.0.4, micromatch@^4.0.5:
-  version "4.0.5"
-  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.5.tgz#bc8999a7cbbf77cdc89f132f6e467051b49090c6"
-  integrity sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==
-  dependencies:
-    braces "^3.0.2"
+    braces "^3.0.3"
     picomatch "^2.3.1"
 
-mime-db@1.40.0:
-  version "1.40.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.40.0.tgz#a65057e998db090f732a68f6c276d387d4126c32"
-
 mime-db@1.52.0:
   version "1.52.0"
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.52.0.tgz#bbabcdc02859f4987301c856e3387ce5ec43bf70"
   integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==
 
-mime-types@^2.1.12, mime-types@^2.1.27, mime-types@~2.1.34:
+mime-db@^1.54.0:
+  version "1.54.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.54.0.tgz#cddb3ee4f9c64530dff640236661d42cb6a314f5"
+  integrity sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==
+
+mime-types@^2.1.12:
   version "2.1.35"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.35.tgz#381a871b62a734450660ae3deee44813f70d959a"
   integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==
   dependencies:
     mime-db "1.52.0"
 
-mime-types@~2.1.24:
-  version "2.1.24"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.24.tgz#b6f8d0b3e951efb77dedeca194cff6d16f676f81"
+mime-types@^3.0.0, mime-types@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-3.0.1.tgz#b1d94d6997a9b32fd69ebaed0db73de8acb519ce"
+  integrity sha512-xRc4oEhT6eaBpU1XF7AjpOFD+xQmXNB5OVKwp4tqCuBpHLS/ZbBDrc07mYTDqVMg6PfxUjjNp85O6Cd2Z/5HWA==
   dependencies:
-    mime-db "1.40.0"
-
-mime@1.6.0:
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
-  integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==
-
-mime@^2.4.4, mime@^2.5.2:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/mime/-/mime-2.6.0.tgz#a2a682a95cd4d0cb1d6257e28f83da7e35800367"
-  integrity sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==
-
-mimic-fn@^1.0.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-1.2.0.tgz#820c86a39334640e99516928bd03fca88057d022"
+    mime-db "^1.54.0"
 
 mimic-fn@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-2.1.0.tgz#7ed2c2ccccaf84d3ffcb7a69b57711fc2083401b"
   integrity sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==
 
-min-indent@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
-  integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
-
-mini-css-extract-plugin@2.7.6:
-  version "2.7.6"
-  resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.6.tgz#282a3d38863fddcd2e0c220aaed5b90bc156564d"
-  integrity sha512-Qk7HcgaPkGG6eD77mLvZS1nmxlao3j+9PkrT9Uc7HAE1id3F41+DdBRYRYkbyfNRGzm8/YWtzhw7nVPmwhqTQw==
-  dependencies:
-    schema-utils "^4.0.0"
-
-minimatch@3.1.2, minimatch@^3.0.5, minimatch@^3.1.1, minimatch@^3.1.2:
+minimatch@3.1.2, minimatch@^3.1.1, minimatch@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b"
   integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
   dependencies:
     brace-expansion "^1.1.7"
 
-minimatch@4.2.1:
-  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-4.2.1.tgz#40d9d511a46bdc4e563c22c3080cde9c0d8299b4"
-  integrity sha512-9Uq1ChtSZO+Mxa/CL1eGizn2vRn3MlLgzhT0Iz8zaY8NdvxvB0d5QdPFmCKf7JKA9Lerx5vRrnwO03jsSfGG9g==
-  dependencies:
-    brace-expansion "^1.1.7"
-
 minimatch@5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-5.0.1.tgz#fb9022f7528125187c92bd9e9b6366be1cf3415b"
@@ -6697,68 +5920,56 @@ minimatch@5.0.1:
   dependencies:
     brace-expansion "^2.0.1"
 
-minimatch@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
-  dependencies:
-    brace-expansion "^1.1.7"
-
-minimatch@^5.0.1:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-5.1.0.tgz#1717b464f4971b144f6aabe8f2d0b8e4511e09c7"
-  integrity sha512-9TPBGGak4nHfGZsPBohm9AWg6NoT7QTCehS3BIJABslyZbzxfV78QM2Y6+i741OPZIafFAaiiEMh5OyIrJPgtg==
+minimatch@9.0.1:
+  version "9.0.1"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.1.tgz#8a555f541cf976c622daf078bb28f29fb927c253"
+  integrity sha512-0jWhJpD/MdhPXwPuiRkCbfYfSKp2qnn2eOc279qI7f+osl/l+prKSrvhg157zSYvx/1nmgn2NqdT6k2Z7zSH9w==
   dependencies:
     brace-expansion "^2.0.1"
 
-minimist-options@4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/minimist-options/-/minimist-options-4.1.0.tgz#c0655713c53a8a2ebd77ffa247d342c40f010619"
-  integrity sha512-Q4r8ghd80yhO/0j1O3B2BjweX3fiHg9cdOwjJd2J76Q135c+NDxGCqdYKQ1SKBuFfgWbAUzBfvYjPUEeNgqN1A==
+minimatch@^5.0.1, minimatch@^5.1.0:
+  version "5.1.6"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-5.1.6.tgz#1cfcb8cf5522ea69952cd2af95ae09477f122a96"
+  integrity sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==
   dependencies:
-    arrify "^1.0.1"
-    is-plain-obj "^1.1.0"
-    kind-of "^6.0.3"
+    brace-expansion "^2.0.1"
 
-minimist@0.0.8:
-  version "0.0.8"
-  resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
+minimatch@^9.0.4:
+  version "9.0.5"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.5.tgz#d74f9dd6b57d83d8e98cfb82133b03978bc929e5"
+  integrity sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==
+  dependencies:
+    brace-expansion "^2.0.1"
 
-minimist@1.2.6, minimist@^1.2.3, minimist@^1.2.6:
+minimist@1.2.6:
   version "1.2.6"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44"
   integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
 
-minimist@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
+minimist@^1.2.0, minimist@^1.2.6:
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
+  integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
 
-minimist@^1.2.5:
-  version "1.2.5"
-  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
-  integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
+"minipass@^5.0.0 || ^6.0.2 || ^7.0.0", minipass@^7.1.2:
+  version "7.1.2"
+  resolved "https://registry.yarnpkg.com/minipass/-/minipass-7.1.2.tgz#93a9626ce5e5e66bd4db86849e7515e92340a707"
+  integrity sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==
 
 mitt@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/mitt/-/mitt-2.1.0.tgz#f740577c23176c6205b121b2973514eade1b2230"
   integrity sha512-ILj2TpLiysu2wkBbWjAmww7TkZb65aiQO+DkVdUTBpBXq+MHYiETENkKFMtsJZX1Lf4pe4QOrTSjIfUwN5lRdg==
 
-mkdirp@^0.5.1:
-  version "0.5.1"
-  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
-  dependencies:
-    minimist "0.0.8"
+mitt@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/mitt/-/mitt-3.0.1.tgz#ea36cf0cc30403601ae074c8f77b7092cdab36d1"
+  integrity sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==
 
-mkdirp@^0.5.5:
-  version "0.5.5"
-  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def"
-  integrity sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==
-  dependencies:
-    minimist "^1.2.5"
-
-mocha@10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/mocha/-/mocha-10.2.0.tgz#1fd4a7c32ba5ac372e03a17eef435bd00e5c68b8"
-  integrity sha512-IDY7fl/BecMwFHzoqF2sg/SHHANeBoMMXFlS9r0OXKDssYE1M5O43wUY/9BVPeIvfH2zmEbBfseqN9gBQZzXkg==
+mocha@10.3.0:
+  version "10.3.0"
+  resolved "https://registry.yarnpkg.com/mocha/-/mocha-10.3.0.tgz#0e185c49e6dccf582035c05fa91084a4ff6e3fe9"
+  integrity sha512-uF2XJs+7xSLsrmIvn37i/wnc91nw7XjOQB8ccyx5aEgdnohr7n+rEiZP23WkCYHjilR6+EboEnbq/ZQDz4LSbg==
   dependencies:
     ansi-colors "4.1.1"
     browser-stdout "1.3.1"
@@ -6767,13 +5978,12 @@ mocha@10.2.0:
     diff "5.0.0"
     escape-string-regexp "4.0.0"
     find-up "5.0.0"
-    glob "7.2.0"
+    glob "8.1.0"
     he "1.2.0"
     js-yaml "4.1.0"
     log-symbols "4.1.0"
     minimatch "5.0.1"
     ms "2.1.3"
-    nanoid "3.3.3"
     serialize-javascript "6.0.0"
     strip-json-comments "3.1.1"
     supports-color "8.1.1"
@@ -6782,351 +5992,263 @@ mocha@10.2.0:
     yargs-parser "20.2.4"
     yargs-unparser "2.0.0"
 
-mocha@9.2.2:
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/mocha/-/mocha-9.2.2.tgz#d70db46bdb93ca57402c809333e5a84977a88fb9"
-  integrity sha512-L6XC3EdwT6YrIk0yXpavvLkn8h+EU+Y5UcCHKECyMbdUIxyMuZj4bX4U9e1nvnvUUvQVsV2VHQr5zLdcUkhW/g==
-  dependencies:
-    "@ungap/promise-all-settled" "1.1.2"
-    ansi-colors "4.1.1"
-    browser-stdout "1.3.1"
-    chokidar "3.5.3"
-    debug "4.3.3"
-    diff "5.0.0"
-    escape-string-regexp "4.0.0"
-    find-up "5.0.0"
-    glob "7.2.0"
-    growl "1.10.5"
-    he "1.2.0"
-    js-yaml "4.1.0"
-    log-symbols "4.1.0"
-    minimatch "4.2.1"
-    ms "2.1.3"
-    nanoid "3.3.1"
-    serialize-javascript "6.0.0"
-    strip-json-comments "3.1.1"
-    supports-color "8.1.1"
-    which "2.0.2"
-    workerpool "6.2.0"
-    yargs "16.2.0"
-    yargs-parser "20.2.4"
-    yargs-unparser "2.0.0"
-
-ms@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
+mrmime@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/mrmime/-/mrmime-2.0.1.tgz#bc3e87f7987853a54c9850eeb1f1078cd44adddc"
+  integrity sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==
 
 ms@2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
   integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
 
-ms@2.1.3:
+ms@2.1.3, ms@^2.1.1, ms@^2.1.3:
   version "2.1.3"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"
   integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
 
-ms@^2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.1.tgz#30a5864eb3ebb0a66f2ebe6d727af06a09d86e0a"
+msw@2.10.5:
+  version "2.10.5"
+  resolved "https://registry.yarnpkg.com/msw/-/msw-2.10.5.tgz#3e43f12e97581c260bf38d8817732b9fec3bfdb0"
+  integrity sha512-0EsQCrCI1HbhpBWd89DvmxY6plmvrM96b0sCIztnvcNHQbXn5vqwm1KlXslo6u4wN9LFGLC1WFjjgljcQhe40A==
+  dependencies:
+    "@bundled-es-modules/cookie" "^2.0.1"
+    "@bundled-es-modules/statuses" "^1.0.1"
+    "@bundled-es-modules/tough-cookie" "^0.1.6"
+    "@inquirer/confirm" "^5.0.0"
+    "@mswjs/interceptors" "^0.39.1"
+    "@open-draft/deferred-promise" "^2.2.0"
+    "@open-draft/until" "^2.1.0"
+    "@types/cookie" "^0.6.0"
+    "@types/statuses" "^2.0.4"
+    graphql "^16.8.1"
+    headers-polyfill "^4.0.2"
+    is-node-process "^1.2.0"
+    outvariant "^1.4.3"
+    path-to-regexp "^6.3.0"
+    picocolors "^1.1.1"
+    strict-event-emitter "^0.5.1"
+    type-fest "^4.26.1"
+    yargs "^17.7.2"
 
-nanoid@3.3.1, nanoid@^3.3.1:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.1.tgz#6347a18cac88af88f58af0b3594b723d5e99bb35"
-  integrity sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw==
+mute-stream@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-2.0.0.tgz#a5446fc0c512b71c83c44d908d5c7b7b4c493b2b"
+  integrity sha512-WWdIxpyjEn+FhQJQQv9aQAYlHoNVdzIzUySNV1gHUPDSdZJ3yZn7pAAbQcV7B56Mvu881q9FZV+0Vx2xC44VWA==
 
-nanoid@3.3.3:
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.3.tgz#fd8e8b7aa761fe807dba2d1b98fb7241bb724a25"
-  integrity sha512-p1sjXuopFs0xg+fPASzQ28agW1oHD7xDsd9Xkf3T15H3c/cifrFHVwrh74PdoklAPi+i7MdRsE47vm2r6JoB+w==
-
-nanoid@^3.3.4:
-  version "3.3.4"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab"
-  integrity sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==
-
-nanoid@^3.3.6:
-  version "3.3.6"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.6.tgz#443380c856d6e9f9824267d960b4236ad583ea4c"
-  integrity sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==
-
-nanoid@^3.3.7:
-  version "3.3.7"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.7.tgz#d0c301a691bc8d54efa0a2226ccf3fe2fd656bd8"
-  integrity sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==
+nanoid@^3.3.11, nanoid@^3.3.8:
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.11.tgz#4f4f112cefbe303202f2199838128936266d185b"
+  integrity sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==
 
 natural-compare@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
+  integrity sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==
 
-negotiator@0.6.2:
-  version "0.6.2"
-  resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.2.tgz#feacf7ccf525a77ae9634436a64883ffeca346fb"
+negotiator@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-1.0.0.tgz#b6c91bb47172d69f93cfd7c357bbb529019b5f6a"
+  integrity sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==
 
-negotiator@0.6.3:
-  version "0.6.3"
-  resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.3.tgz#58e323a72fedc0d6f9cd4d31fe49f51479590ccd"
-  integrity sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==
+netmask@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/netmask/-/netmask-2.0.2.tgz#8b01a07644065d536383835823bc52004ebac5e7"
+  integrity sha512-dBpDMdxv9Irdq66304OLfEmQ9tbNRFnFTuZiLo+bD+r332bBmMJ8GBLXklIXXgxd3+v9+KUnZaUR5PJMa75Gsg==
 
-neo-async@^2.6.2:
-  version "2.6.2"
-  resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.2.tgz#b4aafb93e3aeb2d8174ca53cf163ab7d7308305f"
-  integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==
-
-nightwatch-axe-verbose@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/nightwatch-axe-verbose/-/nightwatch-axe-verbose-2.1.0.tgz#3a03f70dd9b78739a5178ee096a24e0658a8ee53"
-  integrity sha512-j31VB0wdv/HXoQWWAJsvNc9UenXzXf1u/QsvExCUDuFOMR4GRg3963wlPIxd2ME47egXsnkXPd1dl8Ozdk7XHA==
+nightwatch-axe-verbose@^2.3.0:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/nightwatch-axe-verbose/-/nightwatch-axe-verbose-2.3.1.tgz#42cd226989cb5205b699db42d74b1b967587d099"
+  integrity sha512-C6N95bwPHsRnv04eVIwJ6w5m6X1+Pddvo6nzpzOHQlO0j+pYRVU7zaQmFUJ0L4cqeUxReNEXyTUg/R9WWfHk7w==
   dependencies:
-    axe-core "^4.6.1"
+    axe-core "^4.9.1"
 
-nightwatch@2.6.25:
-  version "2.6.25"
-  resolved "https://registry.yarnpkg.com/nightwatch/-/nightwatch-2.6.25.tgz#99c2abdd8a7f1ce8be2882ac5458a776caf1b5ab"
-  integrity sha512-aYc5eA6M/iADdbKbD6dMHlhUsaJm/Y4/VOtSHSC23nimGTXMUKbe1Bb14Iz3/SNyz2joHOkpxaDIPIAZCSlOiQ==
+nightwatch@3.12.2:
+  version "3.12.2"
+  resolved "https://registry.yarnpkg.com/nightwatch/-/nightwatch-3.12.2.tgz#95ef5322003473b4e1f4cca1e40259b64f9ffe75"
+  integrity sha512-B4MGUvO+RjX8gYg84oJ3DKdgzfXIFRKbs19nLBlUt+aJlzBdv6VdN00wlOmzCakHXZlU10MGm1KiW0dsTlgFRA==
   dependencies:
-    "@nightwatch/chai" "5.0.2"
-    "@nightwatch/html-reporter-template" "0.2.1"
+    "@nightwatch/chai" "5.0.3"
+    "@nightwatch/html-reporter-template" "^0.3.0"
+    "@nightwatch/nightwatch-inspector" "^1.0.1"
+    "@types/chai" "^4.3.5"
+    "@types/selenium-webdriver" "^4.1.14"
     ansi-to-html "0.7.2"
+    aria-query "5.1.3"
     assertion-error "1.1.0"
     boxen "5.1.2"
-    chai-nightwatch "0.5.3"
+    chai-nightwatch "^0.5.3"
+    chalk "^4.1.2"
     ci-info "3.3.0"
     cli-table3 "^0.6.3"
-    didyoumean "1.2.2"
-    dotenv "10.0.0"
-    ejs "3.1.8"
-    envinfo "7.8.1"
-    fs-extra "^10.1.0"
-    glob "^7.2.3"
-    jsdom "19.0.0"
-    lodash.clone "3.0.3"
-    lodash.defaultsdeep "4.6.1"
-    lodash.escape "4.0.1"
-    lodash.merge "4.6.2"
-    lodash.pick "4.4.0"
+    devtools-protocol "^0.0.1140464"
+    didyoumean "^1.2.2"
+    dotenv "16.3.1"
+    ejs "^3.1.10"
+    envinfo "7.11.0"
+    glob "7.2.3"
+    jsdom "^24.1.0"
+    lodash "^4.17.21"
     minimatch "3.1.2"
     minimist "1.2.6"
-    mocha "9.2.2"
-    nightwatch-axe-verbose "^2.1.0"
-    open "8.4.0"
+    mocha "10.3.0"
+    nightwatch-axe-verbose "^2.3.0"
+    open "8.4.2"
     ora "5.4.1"
-    selenium-webdriver "4.6.1"
-    semver "7.3.5"
+    piscina "^4.3.1"
+    selenium-webdriver "4.27.0"
+    semver "7.5.4"
     stacktrace-parser "0.1.10"
     strip-ansi "6.0.1"
-    untildify "^4.0.0"
+    untildify "4.0.0"
     uuid "8.3.2"
 
-nise@^5.1.4:
-  version "5.1.4"
-  resolved "https://registry.yarnpkg.com/nise/-/nise-5.1.4.tgz#491ce7e7307d4ec546f5a659b2efe94a18b4bbc0"
-  integrity sha512-8+Ib8rRJ4L0o3kfmyVCL7gzrohyDe0cMFTBa2d364yIrEGMEoetznKJx899YxjybU6bL9SQkYPSBBs1gyYs8Xg==
+node-addon-api@^7.0.0:
+  version "7.1.1"
+  resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-7.1.1.tgz#1aba6693b0f255258a049d621329329322aad558"
+  integrity sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==
+
+node-releases@^2.0.19:
+  version "2.0.19"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.19.tgz#9e445a52950951ec4d177d843af370b411caf314"
+  integrity sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==
+
+nopt@^7.2.1:
+  version "7.2.1"
+  resolved "https://registry.yarnpkg.com/nopt/-/nopt-7.2.1.tgz#1cac0eab9b8e97c9093338446eddd40b2c8ca1e7"
+  integrity sha512-taM24ViiimT/XntxbPyJQzCG+p4EKOpgD3mxFwW38mGjVUrfERQOeY4EDHjdnptttfHuHQXFx+lTP08Q+mLa/w==
   dependencies:
-    "@sinonjs/commons" "^2.0.0"
-    "@sinonjs/fake-timers" "^10.0.2"
-    "@sinonjs/text-encoding" "^0.7.1"
-    just-extend "^4.0.2"
-    path-to-regexp "^1.7.0"
-
-no-case@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/no-case/-/no-case-3.0.4.tgz#d361fd5c9800f558551a8369fc0dcd4662b6124d"
-  integrity sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==
-  dependencies:
-    lower-case "^2.0.2"
-    tslib "^2.0.3"
-
-node-releases@^2.0.14:
-  version "2.0.14"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.14.tgz#2ffb053bceb8b2be8495ece1ab6ce600c4461b0b"
-  integrity sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==
-
-node-releases@^2.0.5, node-releases@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.6.tgz#8a7088c63a55e493845683ebf3c828d8c51c5503"
-  integrity sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg==
-
-nopt@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/nopt/-/nopt-6.0.0.tgz#245801d8ebf409c6df22ab9d95b65e1309cdb16d"
-  integrity sha512-ZwLpbTgdhuZUnZzjd7nb1ZV+4DoiC6/sfiVKok72ym/4Tlf+DFdlHYmT2JPmcNNWV6Pi3SDf1kT+A4r9RTuT9g==
-  dependencies:
-    abbrev "^1.0.0"
-
-normalize-package-data@^2.5.0:
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.5.0.tgz#e66db1838b200c1dfc233225d12cb36520e234a8"
-  integrity sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==
-  dependencies:
-    hosted-git-info "^2.1.4"
-    resolve "^1.10.0"
-    semver "2 || 3 || 4 || 5"
-    validate-npm-package-license "^3.0.1"
-
-normalize-package-data@^3.0.0:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-3.0.3.tgz#dbcc3e2da59509a0983422884cd172eefdfa525e"
-  integrity sha512-p2W1sgqij3zMMyRC067Dg16bfzVH+w7hyegmpIvZ4JNjqtGOVAIvLmjBx3yP7YTe9vKJgkoNOPjwQGogDoMXFA==
-  dependencies:
-    hosted-git-info "^4.0.1"
-    is-core-module "^2.5.0"
-    semver "^7.3.4"
-    validate-npm-package-license "^3.0.1"
+    abbrev "^2.0.0"
 
 normalize-path@^3.0.0, normalize-path@~3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
+  integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
 
 normalize-range@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942"
+  integrity sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==
 
-normalize-url@^6.0.1:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-6.1.0.tgz#40d0885b535deffe3f3147bec877d05fe4c5668a"
-  integrity sha512-DlL+XwOy3NxAQ8xuC0okPgK46iuVNAK01YN7RueYBqqFeGsBjV9XmCAzAdgt+667bCl5kPh9EqKKDwnaPG1I7A==
+npm-run-path@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-4.0.1.tgz#b7ecd1e5ed53da8e37a55e1c2269e0b97ed748ea"
+  integrity sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==
+  dependencies:
+    path-key "^3.0.0"
 
-nth-check@^2.0.1:
+nth-check@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-2.1.1.tgz#c9eab428effce36cd6b92c924bdb000ef1f1ed1d"
   integrity sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==
   dependencies:
     boolbase "^1.0.0"
 
-nwsapi@^2.2.0:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.2.tgz#e5418863e7905df67d51ec95938d67bf801f0bb0"
-  integrity sha512-90yv+6538zuvUMnN+zCr8LuV6bPFdq50304114vJYJ8RDyK8D5O9Phpbd6SZWgI7PwzmmfN1upeOJlvybDSgCw==
+nwsapi@^2.2.12:
+  version "2.2.20"
+  resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.20.tgz#22e53253c61e7b0e7e93cef42c891154bcca11ef"
+  integrity sha512-/ieB+mDe4MrrKMT8z+mQL8klXydZWGR5Dowt4RAGKbJ3kIGEx3X4ljUo+6V73IXtUPWgfOlU5B9MlGxFO5T+cA==
 
-object-assign@^4:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
+object-inspect@^1.13.3, object-inspect@^1.13.4:
+  version "1.13.4"
+  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.13.4.tgz#8375265e21bc20d0fa582c22e1b13485d6e00213"
+  integrity sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==
 
-object-inspect@^1.11.0, object-inspect@^1.9.0:
-  version "1.12.0"
-  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.0.tgz#6e2c120e868fd1fd18cb4f18c31741d0d6e776f0"
-  integrity sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==
+object-is@^1.1.5:
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/object-is/-/object-is-1.1.6.tgz#1a6a53aed2dd8f7e6775ff870bea58545956ab07"
+  integrity sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==
+  dependencies:
+    call-bind "^1.0.7"
+    define-properties "^1.2.1"
 
-object-inspect@^1.12.2:
-  version "1.12.3"
-  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.3.tgz#ba62dffd67ee256c8c086dfae69e016cd1f198b9"
-  integrity sha512-geUvdk7c+eizMNUDkRpW1wJwgfOiOeHbxBR/hLXK1aT6zmVSO0jsQcs7fj6MGw89jC/cjGfLcNOrtMYtGqm81g==
-
-object-keys@^1.0.12, object-keys@^1.1.1:
+object-keys@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e"
+  integrity sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==
 
-object.assign@^4.1.2:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.2.tgz#0ed54a342eceb37b38ff76eb831a0e788cb63940"
-  integrity sha512-ixT2L5THXsApyiUPYKmW+2EHpXXe5Ii3M+f4e+aJFAHao5amFRW6J0OO6c/LU8Be47utCx2GL89hxGB6XSmKuQ==
+object.assign@^4.1.4, object.assign@^4.1.7:
+  version "4.1.7"
+  resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.7.tgz#8c14ca1a424c6a561b0bb2a22f66f5049a945d3d"
+  integrity sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==
   dependencies:
-    call-bind "^1.0.0"
-    define-properties "^1.1.3"
-    has-symbols "^1.0.1"
+    call-bind "^1.0.8"
+    call-bound "^1.0.3"
+    define-properties "^1.2.1"
+    es-object-atoms "^1.0.0"
+    has-symbols "^1.1.0"
     object-keys "^1.1.1"
 
-object.assign@^4.1.4:
-  version "4.1.4"
-  resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.4.tgz#9673c7c7c351ab8c4d0b516f4343ebf4dfb7799f"
-  integrity sha512-1mxKf0e58bvyjSCtKYY4sRe9itRk3PJpquJOjeIkz885CczcI4IvJJDLPS72oowuSh+pBxUFROpX+TU++hxhZQ==
+object.fromentries@^2.0.8:
+  version "2.0.8"
+  resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.8.tgz#f7195d8a9b97bd95cbc1999ea939ecd1a2b00c65"
+  integrity sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    has-symbols "^1.0.3"
-    object-keys "^1.1.1"
+    call-bind "^1.0.7"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.2"
+    es-object-atoms "^1.0.0"
 
-object.values@^1.1.6:
-  version "1.1.6"
-  resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.6.tgz#4abbaa71eba47d63589d402856f908243eea9b1d"
-  integrity sha512-FVVTkD1vENCsAcwNs9k6jea2uHC/X0+JcjG8YA60FN5CMaJmG95wT9jek/xX9nornqGRrBkKtzuAu2wuHpKqvw==
+object.groupby@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/object.groupby/-/object.groupby-1.0.3.tgz#9b125c36238129f6f7b61954a1e7176148d5002e"
+  integrity sha512-+Lhy3TQTuzXI5hevh8sBGqbmurHbbIjAi0Z4S63nthVLmLxfbj4T54a4CfZrXIrt9iP4mVAPYMo/v99taj3wjQ==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    es-abstract "^1.20.4"
+    call-bind "^1.0.7"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.2"
 
-on-finished@2.4.1:
+object.values@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.2.1.tgz#deed520a50809ff7f75a7cfd4bc64c7a038c6216"
+  integrity sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==
+  dependencies:
+    call-bind "^1.0.8"
+    call-bound "^1.0.3"
+    define-properties "^1.2.1"
+    es-object-atoms "^1.0.0"
+
+on-finished@^2.4.1:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/on-finished/-/on-finished-2.4.1.tgz#58c8c44116e54845ad57f14ab10b03533184ac3f"
   integrity sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==
   dependencies:
     ee-first "1.1.1"
 
-on-finished@~2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/on-finished/-/on-finished-2.3.0.tgz#20f1336481b083cd75337992a16971aa2d906947"
-  dependencies:
-    ee-first "1.1.1"
-
 once@^1.3.0, once@^1.3.1, once@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
+  integrity sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==
   dependencies:
     wrappy "1"
 
-onetime@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/onetime/-/onetime-2.0.1.tgz#067428230fd67443b2794b22bba528b6867962d4"
-  dependencies:
-    mimic-fn "^1.0.0"
-
-onetime@^5.1.0:
+onetime@^5.1.0, onetime@^5.1.2:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/onetime/-/onetime-5.1.2.tgz#d0e96ebb56b07476df1dd9c4806e5237985ca45e"
   integrity sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==
   dependencies:
     mimic-fn "^2.1.0"
 
-open@8.4.0:
-  version "8.4.0"
-  resolved "https://registry.yarnpkg.com/open/-/open-8.4.0.tgz#345321ae18f8138f82565a910fdc6b39e8c244f8"
-  integrity sha512-XgFPPM+B28FtCCgSb9I+s9szOC1vZRSwgWsRUA5ylIxRTgKozqjOCrVOqGsYABPYK5qnfqClxZTFBa8PKt2v6Q==
+open@8.4.2:
+  version "8.4.2"
+  resolved "https://registry.yarnpkg.com/open/-/open-8.4.2.tgz#5b5ffe2a8f793dcd2aad73e550cb87b59cb084f9"
+  integrity sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==
   dependencies:
     define-lazy-prop "^2.0.0"
     is-docker "^2.1.1"
     is-wsl "^2.2.0"
 
-opn@5.5.0:
-  version "5.5.0"
-  resolved "https://registry.yarnpkg.com/opn/-/opn-5.5.0.tgz#fc7164fab56d235904c51c3b27da6758ca3b9bfc"
-  integrity sha512-PqHpggC9bLV0VeWcdKhkpxY+3JTzetLSqTCWL/z/tFIbI6G8JCjondXklT1JinczLz2Xib62sSp0T/gKT4KksA==
-  dependencies:
-    is-wsl "^1.1.0"
-
-optionator@^0.8.1:
-  version "0.8.3"
-  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.3.tgz#84fa1d036fe9d3c7e21d99884b601167ec8fb495"
-  integrity sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==
-  dependencies:
-    deep-is "~0.1.3"
-    fast-levenshtein "~2.0.6"
-    levn "~0.3.0"
-    prelude-ls "~1.1.2"
-    type-check "~0.3.2"
-    word-wrap "~1.2.3"
-
-optionator@^0.9.1:
-  version "0.9.1"
-  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.1.tgz#4f236a6373dae0566a6d43e1326674f50c291499"
-  integrity sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==
+optionator@^0.9.3:
+  version "0.9.4"
+  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.4.tgz#7ea1c1a5d91d764fb282139c88fe11e182a3a734"
+  integrity sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==
   dependencies:
     deep-is "^0.1.3"
     fast-levenshtein "^2.0.6"
     levn "^0.4.1"
     prelude-ls "^1.2.1"
     type-check "^0.4.0"
-    word-wrap "^1.2.3"
-
-ora@0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/ora/-/ora-0.4.1.tgz#e268187c8890295f7859ac535fd8ca2c0ff64de7"
-  integrity sha1-4mgYfIiQKV94WaxTX9jKLA/2Tec=
-  dependencies:
-    chalk "^1.1.1"
-    cli-cursor "^2.1.0"
-    cli-spinners "^1.0.0"
-    log-symbols "^1.0.2"
+    word-wrap "^1.2.5"
 
 ora@5.4.1:
   version "5.4.1"
@@ -7143,13 +6265,21 @@ ora@5.4.1:
     strip-ansi "^6.0.0"
     wcwidth "^1.0.1"
 
-p-limit@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.1.0.tgz#1d5a0d20fb12707c758a655f6bbc4386b5930d68"
-  dependencies:
-    p-try "^2.0.0"
+outvariant@^1.4.0, outvariant@^1.4.3:
+  version "1.4.3"
+  resolved "https://registry.yarnpkg.com/outvariant/-/outvariant-1.4.3.tgz#221c1bfc093e8fec7075497e7799fdbf43d14873"
+  integrity sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA==
 
-p-limit@^2.2.0:
+own-keys@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/own-keys/-/own-keys-1.0.1.tgz#e4006910a2bf913585289676eebd6f390cf51358"
+  integrity sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==
+  dependencies:
+    get-intrinsic "^1.2.6"
+    object-keys "^1.1.1"
+    safe-push-apply "^1.0.0"
+
+p-limit@^2.0.0, p-limit@^2.2.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1"
   integrity sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==
@@ -7163,16 +6293,10 @@ p-limit@^3.0.2:
   dependencies:
     yocto-queue "^0.1.0"
 
-p-limit@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-4.0.0.tgz#914af6544ed32bfa54670b061cafcbd04984b644"
-  integrity sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==
-  dependencies:
-    yocto-queue "^1.0.0"
-
 p-locate@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-3.0.0.tgz#322d69a05c0264b25997d9f40cd8a891ab0064a4"
+  integrity sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==
   dependencies:
     p-limit "^2.0.0"
 
@@ -7190,44 +6314,58 @@ p-locate@^5.0.0:
   dependencies:
     p-limit "^3.0.2"
 
-p-locate@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-6.0.0.tgz#3da9a49d4934b901089dca3302fa65dc5a05c04f"
-  integrity sha512-wPrq66Llhl7/4AGC6I+cqxT07LhXvWL08LNXz1fENOw0Ap4sRZZ/gZpTTJ5jpurzzzfS2W/Ge9BY3LgLjCShcw==
-  dependencies:
-    p-limit "^4.0.0"
-
 p-try@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.0.0.tgz#85080bb87c64688fa47996fe8f7dfbe8211760b1"
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.2.0.tgz#cb2868540e313d61de58fafbe35ce9004d5540e6"
+  integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
+
+pac-proxy-agent@^7.1.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/pac-proxy-agent/-/pac-proxy-agent-7.2.0.tgz#9cfaf33ff25da36f6147a20844230ec92c06e5df"
+  integrity sha512-TEB8ESquiLMc0lV8vcd5Ql/JAKAoyzHFXaStwjkzpOpC5Yv+pIzLfHvjTSdf3vpa2bMiUQrg9i6276yn8666aA==
+  dependencies:
+    "@tootallnate/quickjs-emscripten" "^0.23.0"
+    agent-base "^7.1.2"
+    debug "^4.3.4"
+    get-uri "^6.0.1"
+    http-proxy-agent "^7.0.0"
+    https-proxy-agent "^7.0.6"
+    pac-resolver "^7.0.1"
+    socks-proxy-agent "^8.0.5"
+
+pac-resolver@^7.0.1:
+  version "7.0.1"
+  resolved "https://registry.yarnpkg.com/pac-resolver/-/pac-resolver-7.0.1.tgz#54675558ea368b64d210fd9c92a640b5f3b8abb6"
+  integrity sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg==
+  dependencies:
+    degenerator "^5.0.0"
+    netmask "^2.0.2"
+
+package-json-from-dist@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz#4f1471a010827a86f94cfd9b0727e36d267de505"
+  integrity sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==
 
 pako@~1.0.2:
   version "1.0.11"
   resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
   integrity sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==
 
-param-case@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.4.tgz#7d17fe4aa12bde34d4a77d91acfb6219caad01c5"
-  integrity sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==
-  dependencies:
-    dot-case "^3.0.4"
-    tslib "^2.0.3"
-
 parent-module@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
+  integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==
   dependencies:
     callsites "^3.0.0"
 
-parse-json@^5.0.0:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.0.1.tgz#7cfe35c1ccd641bce3981467e6c2ece61b3b3878"
-  integrity sha512-ztoZ4/DYeXQq4E21v169sC8qWINGpcosGv9XhTDvg9/hWvx/zrFkc9BiWxR58OJLHGk28j5BL0SDLeV2WmFZlQ==
+parse-json@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd"
+  integrity sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==
   dependencies:
     "@babel/code-frame" "^7.0.0"
     error-ex "^1.3.1"
-    json-parse-better-errors "^1.0.1"
+    json-parse-even-better-errors "^2.3.0"
     lines-and-columns "^1.1.6"
 
 parse-link-header@2.0.0:
@@ -7237,126 +6375,155 @@ parse-link-header@2.0.0:
   dependencies:
     xtend "~4.0.1"
 
-parse5@6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/parse5/-/parse5-6.0.1.tgz#e1a1c085c569b3dc08321184f19a39cc27f7c30b"
-  integrity sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==
+parse5@^7.1.2:
+  version "7.2.1"
+  resolved "https://registry.yarnpkg.com/parse5/-/parse5-7.2.1.tgz#8928f55915e6125f430cc44309765bf17556a33a"
+  integrity sha512-BuBYQYlv1ckiPdQi/ohiivi9Sagc9JG+Ozs0r7b/0iK3sKmrb0b9FdWdBbOdx6hBCM/F9Ir82ofnBhtZOjCRPQ==
+  dependencies:
+    entities "^4.5.0"
 
-parseurl@~1.3.3:
+parseurl@^1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4"
   integrity sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==
 
-pascal-case@^3.1.2:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/pascal-case/-/pascal-case-3.1.2.tgz#b48e0ef2b98e205e7c1dae747d0b1508237660eb"
-  integrity sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==
-  dependencies:
-    no-case "^3.0.4"
-    tslib "^2.0.3"
-
 path-exists@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"
+  integrity sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==
 
 path-exists@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-4.0.0.tgz#513bdbe2d3b95d7762e8c1137efa195c6c61b5b3"
   integrity sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==
 
-path-exists@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-5.0.0.tgz#a6aad9489200b21fab31e49cf09277e5116fb9e7"
-  integrity sha512-RjhtfwJOxzcFmNOi6ltcbcu4Iu+FL3zEj83dk4kAS+fVpTxXLO1b38RvJgT/0QwvV/L3aY9TAnyv0EOqW4GoMQ==
-
 path-is-absolute@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
+  integrity sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==
 
-path-key@^3.1.0:
+path-key@^3.0.0, path-key@^3.1.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375"
   integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==
 
-path-parse@^1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.6.tgz#d62dbb5679405d72c4737ec58600e9ddcf06d24c"
-
 path-parse@^1.0.7:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
   integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
 
-path-to-regexp@0.1.7:
-  version "0.1.7"
-  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c"
-
-path-to-regexp@^1.7.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.7.0.tgz#59fde0f435badacba103a84e9d3bc64e96b9937d"
+path-scurry@^1.11.1:
+  version "1.11.1"
+  resolved "https://registry.yarnpkg.com/path-scurry/-/path-scurry-1.11.1.tgz#7960a668888594a0720b12a911d1a742ab9f11d2"
+  integrity sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==
   dependencies:
-    isarray "0.0.1"
+    lru-cache "^10.2.0"
+    minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
+
+path-to-regexp@^6.3.0:
+  version "6.3.0"
+  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-6.3.0.tgz#2b6a26a337737a8e1416f9272ed0766b1c0389f4"
+  integrity sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==
+
+path-to-regexp@^8.0.0:
+  version "8.2.0"
+  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-8.2.0.tgz#73990cc29e57a3ff2a0d914095156df5db79e8b4"
+  integrity sha512-TdrF7fW9Rphjq4RjrW0Kp2AW0Ahwu9sRGTkS6bvDi0SCwZlEZYmcfDbEsTz8RVk0EHIS/Vd1bv3JhG+1xZuAyQ==
 
 path-type@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
   integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
 
-pathval@1.1.1, pathval@^1.1.1:
+pathe@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/pathe/-/pathe-2.0.3.tgz#3ecbec55421685b70a9da872b2cff3e1cbed1716"
+  integrity sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==
+
+pathval@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.1.tgz#8534e77a77ce7ac5a2512ea21e0fdb8fcf6c3d8d"
   integrity sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==
 
+pathval@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pathval/-/pathval-2.0.0.tgz#7e2550b422601d4f6b8e26f1301bc8f15a741a25"
+  integrity sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==
+
 pend@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
+  integrity sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==
 
-phoenix@1.7.7:
-  version "1.7.7"
-  resolved "https://registry.yarnpkg.com/phoenix/-/phoenix-1.7.7.tgz#829817ea65a83ef78a3a88e3e074125f502a034f"
-  integrity sha512-moAN6e4Z16x/x1nswUpnTR2v5gm7HsI7eluZ2YnYUUsBNzi3cY/5frmiJfXIEi877IQAafzTfp8hd6vEUMme+w==
-
-picocolors@^1.0.0:
+perfect-debounce@^1.0.0:
   version "1.0.0"
-  resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
-  integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
+  resolved "https://registry.yarnpkg.com/perfect-debounce/-/perfect-debounce-1.0.0.tgz#9c2e8bc30b169cc984a58b7d5b28049839591d2a"
+  integrity sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==
 
-picomatch@^2.0.4:
-  version "2.2.3"
-  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.3.tgz#465547f359ccc206d3c48e46a1bcb89bf7ee619d"
-  integrity sha512-KpELjfwcCDUb9PeigTs2mBJzXUPzAuP2oPcA989He8Rte0+YUAjw1JVedDhuTKPkHjSYzMN3npC9luThGYEKdg==
+phoenix@1.8.1:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/phoenix/-/phoenix-1.8.1.tgz#cc247b29f844f22d54291b558689e2381ed8cc43"
+  integrity sha512-7i2a5f5y0Qhzi2g/+iuaGr4TzRt5ucqI0JeV2Q9K0swqY8L2C7CLR66RcGCpcQKGOY73B5GLKMYEl13o/9l/Cg==
 
-picomatch@^2.0.5, picomatch@^2.2.1:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
-  integrity sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==
+picocolors@^1.0.0, picocolors@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.1.1.tgz#3d321af3eab939b083c8f929a1d12cda81c26b6b"
+  integrity sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==
 
-picomatch@^2.2.3, picomatch@^2.3.1:
+picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
   integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
 
+picomatch@^4.0.2, picomatch@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-4.0.3.tgz#796c76136d1eead715db1e7bad785dedd695a042"
+  integrity sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==
+
 pify@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/pify/-/pify-4.0.1.tgz#4b2cd25c50d598735c50292224fd8c6df41e3231"
+  integrity sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==
 
-pirates@^4.0.5:
-  version "4.0.5"
-  resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.5.tgz#feec352ea5c3268fb23a37c702ab1699f35a5f3b"
-  integrity sha512-8V9+HQPupnaXMA23c5hvl69zXvTwTzyAYasnkb0Tts4XvO4CliqONMOnvlq26rkhLC3nWDFBJf73LU1e1VZLaQ==
+pinia@^3.0.0:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/pinia/-/pinia-3.0.3.tgz#f412019bdeb2f45e85927b432803190343e12d89"
+  integrity sha512-ttXO/InUULUXkMHpTdp9Fj4hLpD/2AoJdmAbAeW2yu1iy1k+pkFekQXw5VpC0/5p51IOR/jDaDRfRWRnMMsGOA==
+  dependencies:
+    "@vue/devtools-api" "^7.7.2"
+
+pirates@^4.0.6:
+  version "4.0.7"
+  resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.7.tgz#643b4a18c4257c8a65104b73f3049ce9a0a15e22"
+  integrity sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==
+
+piscina@^4.3.1:
+  version "4.9.2"
+  resolved "https://registry.yarnpkg.com/piscina/-/piscina-4.9.2.tgz#80f2c2375231720337c703e443941adfac8caf75"
+  integrity sha512-Fq0FERJWFEUpB4eSY59wSNwXD4RYqR+nR/WiEVcZW8IWfVBxJJafcgTEZDQo8k3w0sUarJ8RyVbbUF4GQ2LGbQ==
+  optionalDependencies:
+    "@napi-rs/nice" "^1.0.1"
 
 pkg-dir@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-3.0.0.tgz#2749020f239ed990881b1f71210d51eb6523bea3"
+  integrity sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==
   dependencies:
     find-up "^3.0.0"
 
-pkg-dir@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-7.0.0.tgz#8f0c08d6df4476756c5ff29b3282d0bab7517d11"
-  integrity sha512-Ie9z/WINcxxLp27BKOCHGde4ITq9UklYKDzVo1nhk5sqGEXU3FpkwP5GM2voTGJkGd9B3Otl+Q4uwSOeSUtOBA==
+playwright-core@1.55.0:
+  version "1.55.0"
+  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.55.0.tgz#ec8a9f8ef118afb3e86e0f46f1393e3bea32adf4"
+  integrity sha512-GvZs4vU3U5ro2nZpeiwyb0zuFaqb9sUiAJuyrWpcGouD8y9/HLgGbNRjIph7zU9D3hnPaisMl9zG9CgFi/biIg==
+
+playwright@1.55.0:
+  version "1.55.0"
+  resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.55.0.tgz#7aca7ac3ffd9e083a8ad8b2514d6f9ba401cc78b"
+  integrity sha512-sdCWStblvV1YU909Xqx0DhOjPZE4/5lJsIS84IfN9dAZfcl/CIZ5O8l3o0j7hPMjDvqoTF8ZUcc+i/GL5erstA==
   dependencies:
-    find-up "^6.3.0"
+    playwright-core "1.55.0"
+  optionalDependencies:
+    fsevents "2.3.2"
 
 pngjs@^5.0.0:
   version "5.0.0"
@@ -7364,391 +6531,114 @@ pngjs@^5.0.0:
   integrity sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==
 
 pointer-tracker@^2.0.3:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/pointer-tracker/-/pointer-tracker-2.4.0.tgz#78721c2d2201486db11ec1094377f03023b621b3"
-  integrity sha512-pWI2tpaM/XNtc9mUTv42Rmjf6mkHvE8LT5DDEq0G7baPNhxNM9E3CepubPplSoSLk9E5bwQrAMyDcPVmJyTW4g==
+  version "2.5.3"
+  resolved "https://registry.yarnpkg.com/pointer-tracker/-/pointer-tracker-2.5.3.tgz#5ed01f5ff023c649b2d7b20b07d68c3ac40642a6"
+  integrity sha512-LiJUeIbzk4dXq678YeyrZ++mdY17q4n/2sBHfU9wIuvmSzdiPgMvmvWN2g8mY4J7YwYOIrqrZUWP/MfFHVwYtg==
 
-postcss-calc@^8.2.3:
-  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-colormin@^5.3.0:
-  version "5.3.0"
-  resolved "https://registry.yarnpkg.com/postcss-colormin/-/postcss-colormin-5.3.0.tgz#3cee9e5ca62b2c27e84fce63affc0cfb5901956a"
-  integrity sha512-WdDO4gOFG2Z8n4P8TWBpshnL3JpmNmJwdnfP2gbk2qBA8PWwOYcmjmI/t3CmMeL72a7Hkd+x/Mg9O2/0rD54Pg==
-  dependencies:
-    browserslist "^4.16.6"
-    caniuse-api "^3.0.0"
-    colord "^2.9.1"
-    postcss-value-parser "^4.2.0"
-
-postcss-convert-values@^5.1.2:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/postcss-convert-values/-/postcss-convert-values-5.1.2.tgz#31586df4e184c2e8890e8b34a0b9355313f503ab"
-  integrity sha512-c6Hzc4GAv95B7suy4udszX9Zy4ETyMCgFPUDtWjdFTKH1SE9eFY/jEpHSwTH1QPuwxHpWslhckUQWbNRM4ho5g==
-  dependencies:
-    browserslist "^4.20.3"
-    postcss-value-parser "^4.2.0"
-
-postcss-discard-comments@^5.1.2:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/postcss-discard-comments/-/postcss-discard-comments-5.1.2.tgz#8df5e81d2925af2780075840c1526f0660e53696"
-  integrity sha512-+L8208OVbHVF2UQf1iDmRcbdjJkuBF6IS29yBDSiWUIzpYaAhtNl6JYnYm12FnkeCwQqF5LeklOu6rAqgfBZqQ==
-
-postcss-discard-duplicates@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-discard-duplicates/-/postcss-discard-duplicates-5.1.0.tgz#9eb4fe8456706a4eebd6d3b7b777d07bad03e848"
-  integrity sha512-zmX3IoSI2aoenxHV6C7plngHWWhUOV3sP1T8y2ifzxzbtnuhk1EdPwm0S1bIUNaJ2eNbWeGLEwzw8huPD67aQw==
-
-postcss-discard-empty@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-discard-empty/-/postcss-discard-empty-5.1.1.tgz#e57762343ff7f503fe53fca553d18d7f0c369c6c"
-  integrity sha512-zPz4WljiSuLWsI0ir4Mcnr4qQQ5e1Ukc3i7UfE2XcrwKK2LIPIqE5jxMRxO6GbI3cv//ztXDsXwEWT3BHOGh3A==
-
-postcss-discard-overridden@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-discard-overridden/-/postcss-discard-overridden-5.1.0.tgz#7e8c5b53325747e9d90131bb88635282fb4a276e"
-  integrity sha512-21nOL7RqWR1kasIVdKs8HNqQJhFxLsyRfAnUDm4Fe4t4mCWL9OJiHvlHPjcd8zc5Myu89b/7wZDnOSjFgeWRtw==
+possible-typed-array-names@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz#93e3582bc0e5426586d9d07b79ee40fc841de4ae"
+  integrity sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==
 
 postcss-html@^1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/postcss-html/-/postcss-html-1.5.0.tgz#57a43bc9e336f516ecc448a37d2e8c2290170a6f"
-  integrity sha512-kCMRWJRHKicpA166kc2lAVUGxDZL324bkj/pVOb6RhjB0Z5Krl7mN0AsVkBhVIRZZirY0lyQXG38HCVaoKVNoA==
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/postcss-html/-/postcss-html-1.8.0.tgz#2ea1e9d6c53f04ea994135219d3bd8a9e380e13b"
+  integrity sha512-5mMeb1TgLWoRKxZ0Xh9RZDfwUUIqRrcxO2uXO+Ezl1N5lqpCiSU5Gk6+1kZediBfBHFtPCdopr2UZ2SgUsKcgQ==
   dependencies:
     htmlparser2 "^8.0.0"
-    js-tokens "^8.0.0"
-    postcss "^8.4.0"
+    js-tokens "^9.0.0"
+    postcss "^8.5.0"
     postcss-safe-parser "^6.0.0"
 
-postcss-loader@7.0.2:
-  version "7.0.2"
-  resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-7.0.2.tgz#b53ff44a26fba3688eee92a048c7f2d4802e23bb"
-  integrity sha512-fUJzV/QH7NXUAqV8dWJ9Lg4aTkDCezpTS5HgJ2DvqznexTbSTxgi/dTECvTZ15BwKTtk8G/bqI/QTu2HPd3ZCg==
-  dependencies:
-    cosmiconfig "^7.0.0"
-    klona "^2.0.5"
-    semver "^7.3.8"
-
 postcss-media-query-parser@^0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244"
-  integrity sha1-J7Ocb02U+Bsac7j3Y1HGCeXO8kQ=
+  integrity sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==
 
-postcss-merge-longhand@^5.1.6:
-  version "5.1.6"
-  resolved "https://registry.yarnpkg.com/postcss-merge-longhand/-/postcss-merge-longhand-5.1.6.tgz#f378a8a7e55766b7b644f48e5d8c789ed7ed51ce"
-  integrity sha512-6C/UGF/3T5OE2CEbOuX7iNO63dnvqhGZeUnKkDeifebY0XqkkvrctYSZurpNE902LDf2yKwwPFgotnfSoPhQiw==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-    stylehacks "^5.1.0"
-
-postcss-merge-rules@^5.1.2:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-5.1.2.tgz#7049a14d4211045412116d79b751def4484473a5"
-  integrity sha512-zKMUlnw+zYCWoPN6yhPjtcEdlJaMUZ0WyVcxTAmw3lkkN/NDMRkOkiuctQEoWAOvH7twaxUUdvBWl0d4+hifRQ==
-  dependencies:
-    browserslist "^4.16.6"
-    caniuse-api "^3.0.0"
-    cssnano-utils "^3.1.0"
-    postcss-selector-parser "^6.0.5"
-
-postcss-minify-font-values@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-minify-font-values/-/postcss-minify-font-values-5.1.0.tgz#f1df0014a726083d260d3bd85d7385fb89d1f01b"
-  integrity sha512-el3mYTgx13ZAPPirSVsHqFzl+BBBDrXvbySvPGFnQcTI4iNslrPaFq4muTkLZmKlGk4gyFAYUBMH30+HurREyA==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-minify-gradients@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-minify-gradients/-/postcss-minify-gradients-5.1.1.tgz#f1fe1b4f498134a5068240c2f25d46fcd236ba2c"
-  integrity sha512-VGvXMTpCEo4qHTNSa9A0a3D+dxGFZCYwR6Jokk+/3oB6flu2/PnPXAh2x7x52EkY5xlIHLm+Le8tJxe/7TNhzw==
-  dependencies:
-    colord "^2.9.1"
-    cssnano-utils "^3.1.0"
-    postcss-value-parser "^4.2.0"
-
-postcss-minify-params@^5.1.3:
-  version "5.1.3"
-  resolved "https://registry.yarnpkg.com/postcss-minify-params/-/postcss-minify-params-5.1.3.tgz#ac41a6465be2db735099bbd1798d85079a6dc1f9"
-  integrity sha512-bkzpWcjykkqIujNL+EVEPOlLYi/eZ050oImVtHU7b4lFS82jPnsCb44gvC6pxaNt38Els3jWYDHTjHKf0koTgg==
-  dependencies:
-    browserslist "^4.16.6"
-    cssnano-utils "^3.1.0"
-    postcss-value-parser "^4.2.0"
-
-postcss-minify-selectors@^5.2.1:
-  version "5.2.1"
-  resolved "https://registry.yarnpkg.com/postcss-minify-selectors/-/postcss-minify-selectors-5.2.1.tgz#d4e7e6b46147b8117ea9325a915a801d5fe656c6"
-  integrity sha512-nPJu7OjZJTsVUmPdm2TcaiohIwxP+v8ha9NehQ2ye9szv4orirRU3SDdtUmKH+10nzn0bAyOXZ0UEr7OpvLehg==
-  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"
-  integrity sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==
-
-postcss-modules-local-by-default@^4.0.4:
-  version "4.0.4"
-  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.4.tgz#7cbed92abd312b94aaea85b68226d3dec39a14e6"
-  integrity sha512-L4QzMnOdVwRm1Qb8m4x8jsZzKAaPAgrUF1r/hjDR2Xj7R+8Zsf97jAlSQzWtKx5YNiNGN8QxmPFIc/sh+RQl+Q==
-  dependencies:
-    icss-utils "^5.0.0"
-    postcss-selector-parser "^6.0.2"
-    postcss-value-parser "^4.1.0"
-
-postcss-modules-scope@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-3.1.1.tgz#32cfab55e84887c079a19bbb215e721d683ef134"
-  integrity sha512-uZgqzdTleelWjzJY+Fhti6F3C9iF1JR/dODLs/JDefozYcKTBCdD8BIl6nNPbTbcLnGrk56hzwZC2DaGNvYjzA==
-  dependencies:
-    postcss-selector-parser "^6.0.4"
-
-postcss-modules-values@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz#d7c5e7e68c3bb3c9b27cbf48ca0bb3ffb4602c9c"
-  integrity sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==
-  dependencies:
-    icss-utils "^5.0.0"
-
-postcss-normalize-charset@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-5.1.0.tgz#9302de0b29094b52c259e9b2cf8dc0879879f0ed"
-  integrity sha512-mSgUJ+pd/ldRGVx26p2wz9dNZ7ji6Pn8VWBajMXFf8jk7vUoSrZ2lt/wZR7DtlZYKesmZI680qjr2CeFF2fbUg==
-
-postcss-normalize-display-values@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-display-values/-/postcss-normalize-display-values-5.1.0.tgz#72abbae58081960e9edd7200fcf21ab8325c3da8"
-  integrity sha512-WP4KIM4o2dazQXWmFaqMmcvsKmhdINFblgSeRgn8BJ6vxaMyaJkwAzpPpuvSIoG/rmX3M+IrRZEz2H0glrQNEA==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-positions@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-positions/-/postcss-normalize-positions-5.1.1.tgz#ef97279d894087b59325b45c47f1e863daefbb92"
-  integrity sha512-6UpCb0G4eofTCQLFVuI3EVNZzBNPiIKcA1AKVka+31fTVySphr3VUgAIULBhxZkKgwLImhzMR2Bw1ORK+37INg==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-repeat-style@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-repeat-style/-/postcss-normalize-repeat-style-5.1.1.tgz#e9eb96805204f4766df66fd09ed2e13545420fb2"
-  integrity sha512-mFpLspGWkQtBcWIRFLmewo8aC3ImN2i/J3v8YCFUwDnPu3Xz4rLohDO26lGjwNsQxB3YF0KKRwspGzE2JEuS0g==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-string@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-string/-/postcss-normalize-string-5.1.0.tgz#411961169e07308c82c1f8c55f3e8a337757e228"
-  integrity sha512-oYiIJOf4T9T1N4i+abeIc7Vgm/xPCGih4bZz5Nm0/ARVJ7K6xrDlLwvwqOydvyL3RHNf8qZk6vo3aatiw/go3w==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-timing-functions@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-timing-functions/-/postcss-normalize-timing-functions-5.1.0.tgz#d5614410f8f0b2388e9f240aa6011ba6f52dafbb"
-  integrity sha512-DOEkzJ4SAXv5xkHl0Wa9cZLF3WCBhF3o1SKVxKQAa+0pYKlueTpCgvkFAHfk+Y64ezX9+nITGrDZeVGgITJXjg==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-unicode@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-unicode/-/postcss-normalize-unicode-5.1.0.tgz#3d23aede35e160089a285e27bf715de11dc9db75"
-  integrity sha512-J6M3MizAAZ2dOdSjy2caayJLQT8E8K9XjLce8AUQMwOrCvjCHv24aLC/Lps1R1ylOfol5VIDMaM/Lo9NGlk1SQ==
-  dependencies:
-    browserslist "^4.16.6"
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-url@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-url/-/postcss-normalize-url-5.1.0.tgz#ed9d88ca82e21abef99f743457d3729a042adcdc"
-  integrity sha512-5upGeDO+PVthOxSmds43ZeMeZfKH+/DKgGRD7TElkkyS46JXAUhMzIKiCa7BabPeIy3AQcTkXwVVN7DbqsiCew==
-  dependencies:
-    normalize-url "^6.0.1"
-    postcss-value-parser "^4.2.0"
-
-postcss-normalize-whitespace@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-normalize-whitespace/-/postcss-normalize-whitespace-5.1.1.tgz#08a1a0d1ffa17a7cc6efe1e6c9da969cc4493cfa"
-  integrity sha512-83ZJ4t3NUDETIHTa3uEg6asWjSBYL5EdkVB0sDncx9ERzOKBVJIUeDO9RyA9Zwtig8El1d79HBp0JEi8wvGQnA==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-ordered-values@^5.1.3:
-  version "5.1.3"
-  resolved "https://registry.yarnpkg.com/postcss-ordered-values/-/postcss-ordered-values-5.1.3.tgz#b6fd2bd10f937b23d86bc829c69e7732ce76ea38"
-  integrity sha512-9UO79VUhPwEkzbb3RNpqqghc6lcYej1aveQteWY+4POIwlqkYE21HKWaLDF6lWNuqCobEAyTovVhtI32Rbv2RQ==
-  dependencies:
-    cssnano-utils "^3.1.0"
-    postcss-value-parser "^4.2.0"
-
-postcss-reduce-initial@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-reduce-initial/-/postcss-reduce-initial-5.1.0.tgz#fc31659ea6e85c492fb2a7b545370c215822c5d6"
-  integrity sha512-5OgTUviz0aeH6MtBjHfbr57tml13PuedK/Ecg8szzd4XRMbYxH4572JFG067z+FqBIf6Zp/d+0581glkvvWMFw==
-  dependencies:
-    browserslist "^4.16.6"
-    caniuse-api "^3.0.0"
-
-postcss-reduce-transforms@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-reduce-transforms/-/postcss-reduce-transforms-5.1.0.tgz#333b70e7758b802f3dd0ddfe98bb1ccfef96b6e9"
-  integrity sha512-2fbdbmgir5AvpW9RLtdONx1QoYG2/EtqpNQbFASDlixBbAYuTcJ0dECwlqNqH7VbaUnEnh8SrxOe2sRIn24XyQ==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-
-postcss-resolve-nested-selector@0.1.1, postcss-resolve-nested-selector@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz#29ccbc7c37dedfac304e9fff0bf1596b3f6a0e4e"
-  integrity sha1-Kcy8fDfe36wwTp//C/FZaz9qDk4=
+postcss-resolve-nested-selector@^0.1.6:
+  version "0.1.6"
+  resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.6.tgz#3d84dec809f34de020372c41b039956966896686"
+  integrity sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==
 
 postcss-safe-parser@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-6.0.0.tgz#bb4c29894171a94bc5c996b9a30317ef402adaa1"
   integrity sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==
 
-postcss-scss@^4.0.2, postcss-scss@^4.0.6:
-  version "4.0.6"
-  resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.6.tgz#5d62a574b950a6ae12f2aa89b60d63d9e4432bfd"
-  integrity sha512-rLDPhJY4z/i4nVFZ27j9GqLxj1pwxE80eAzUNRMXtcpipFYIeowerzBgG3yJhMtObGEXidtIgbUpQ3eLDsf5OQ==
+postcss-safe-parser@^7.0.1:
+  version "7.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-7.0.1.tgz#36e4f7e608111a0ca940fd9712ce034718c40ec0"
+  integrity sha512-0AioNCJZ2DPYz5ABT6bddIqlhgwhpHZ/l65YAYo0BCIn0xiDpsnTHz0gnoTGk0OXZW0JRs+cDwL8u/teRdz+8A==
 
-postcss-selector-parser@2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-2.2.1.tgz#fdbf696103b12b0a64060e5610507f410491f7c8"
-  integrity sha1-/b9pYQOxKwpkBg5WEFB/QQSR98g=
-  dependencies:
-    flatten "^1.0.2"
-    indexes-of "^1.0.1"
-    uniq "^1.0.1"
+postcss-scss@^4.0.6, postcss-scss@^4.0.9:
+  version "4.0.9"
+  resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.9.tgz#a03c773cd4c9623cb04ce142a52afcec74806685"
+  integrity sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==
 
-postcss-selector-parser@^6.0.11, postcss-selector-parser@^6.0.6:
-  version "6.0.11"
-  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz#2e41dc39b7ad74046e1615185185cd0b17d0c8dc"
-  integrity sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==
+postcss-selector-parser@^6.0.15:
+  version "6.1.2"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz#27ecb41fb0e3b6ba7a1ec84fff347f734c7929de"
+  integrity sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==
   dependencies:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
-postcss-selector-parser@^6.0.2, postcss-selector-parser@^6.0.4, postcss-selector-parser@^6.0.5, postcss-selector-parser@^6.0.9:
-  version "6.0.10"
-  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz#79b61e2c0d1bfc2602d549e11d0876256f8df88d"
-  integrity sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==
+postcss-selector-parser@^7.1.0:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz#4d6af97eba65d73bc4d84bcb343e865d7dd16262"
+  integrity sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==
   dependencies:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
-postcss-svgo@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-5.1.0.tgz#0a317400ced789f233a28826e77523f15857d80d"
-  integrity sha512-D75KsH1zm5ZrHyxPakAxJWtkyXew5qwS70v56exwvw542d9CRtTo78K0WeFxZB4G7JXKKMbEZtZayTGdIky/eA==
-  dependencies:
-    postcss-value-parser "^4.2.0"
-    svgo "^2.7.0"
-
-postcss-unique-selectors@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/postcss-unique-selectors/-/postcss-unique-selectors-5.1.1.tgz#a9f273d1eacd09e9aa6088f4b0507b18b1b541b6"
-  integrity sha512-5JiODlELrz8L2HwxfPnhOWZYWDxVHWL83ufOv84NrcgipI7TaeRsatAhK4Tr2/ZiYldpK/wBvw5BD3qfaK96GA==
-  dependencies:
-    postcss-selector-parser "^6.0.5"
-
-postcss-value-parser@^4.1.0:
-  version "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@8.4.23:
-  version "8.4.23"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.23.tgz#df0aee9ac7c5e53e1075c24a3613496f9e6552ab"
-  integrity sha512-bQ3qMcpF6A/YjR55xtoTr0jGOlnPOKAIMdOWiv0EIT6HVPEaJiJB4NLljSbiHoC2RX7DN5Uvjtpbg1NPdwv1oA==
+postcss@8.5.6, postcss@^8.5.3, postcss@^8.5.6:
+  version "8.5.6"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.5.6.tgz#2825006615a619b4f62a9e7426cc120b349a8f3c"
+  integrity sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==
   dependencies:
-    nanoid "^3.3.6"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
+    nanoid "^3.3.11"
+    picocolors "^1.1.1"
+    source-map-js "^1.2.1"
 
-postcss@^8.1.10:
-  version "8.4.12"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.12.tgz#1e7de78733b28970fa4743f7da6f3763648b1905"
-  integrity sha512-lg6eITwYe9v6Hr5CncVbK70SoioNQIq81nsaG86ev5hAidQvmOeETBqs7jm43K2F5/Ley3ytDtriImV6TpNiSg==
+postcss@^8.5.0:
+  version "8.5.3"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.5.3.tgz#1463b6f1c7fb16fe258736cba29a2de35237eafb"
+  integrity sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==
   dependencies:
-    nanoid "^3.3.1"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
-
-postcss@^8.4.0:
-  version "8.4.21"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4"
-  integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==
-  dependencies:
-    nanoid "^3.3.4"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
-
-postcss@^8.4.17:
-  version "8.4.18"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.18.tgz#6d50046ea7d3d66a85e0e782074e7203bc7fbca2"
-  integrity sha512-Wi8mWhncLJm11GATDaQKobXSNEYGUHeQLiQqDFG1qQ5UTDPTEvKw0Xt5NsTpktGTwLps3ByrWsBrG0rB8YQ9oA==
-  dependencies:
-    nanoid "^3.3.4"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
-
-postcss@^8.4.19:
-  version "8.4.20"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.20.tgz#64c52f509644cecad8567e949f4081d98349dc56"
-  integrity sha512-6Q04AXR1212bXr5fh03u8aAwbLxAQNGQ/Q1LNa0VfOI06ZAlhPHtQvE4OIdpj4kLThXilalPnmDSOD65DcHt+g==
-  dependencies:
-    nanoid "^3.3.4"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
-
-postcss@^8.4.33:
-  version "8.4.33"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.33.tgz#1378e859c9f69bf6f638b990a0212f43e2aaa742"
-  integrity sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==
-  dependencies:
-    nanoid "^3.3.7"
-    picocolors "^1.0.0"
-    source-map-js "^1.0.2"
+    nanoid "^3.3.8"
+    picocolors "^1.1.1"
+    source-map-js "^1.2.1"
 
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
-prelude-ls@~1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
-  integrity sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w==
-
-pretty-error@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-4.0.0.tgz#90a703f46dd7234adb46d0f84823e9d1cb8f10d6"
-  integrity sha512-AoJ5YMAcXKYxKhuJGdcvse+Voc6v1RgnsR3nWcYU7q4t6z0Q6T86sv5Zq8VIRbOWWFpvdGE83LtdSMNd+6Y0xw==
+pretty-format@^27.0.2:
+  version "27.5.1"
+  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-27.5.1.tgz#2181879fdea51a7a5851fb39d920faa63f01d88e"
+  integrity sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==
   dependencies:
-    lodash "^4.17.20"
-    renderkid "^3.0.0"
+    ansi-regex "^5.0.1"
+    ansi-styles "^5.0.0"
+    react-is "^17.0.1"
 
 process-nextick-args@~2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.0.tgz#a37d732f4271b4ab1ad070d35508e8290788ffaa"
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
+  integrity sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==
 
 proto-list@~1.2.1:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/proto-list/-/proto-list-1.2.4.tgz#212d5bfe1318306a420f6402b8e26ff39647a849"
   integrity sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA==
 
-proxy-addr@~2.0.7:
+proxy-addr@^2.0.7:
   version "2.0.7"
   resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.7.tgz#f19fe69ceab311eeb94b42e70e8c2070f9ba1025"
   integrity sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==
@@ -7756,92 +6646,85 @@ proxy-addr@~2.0.7:
     forwarded "0.2.0"
     ipaddr.js "1.9.1"
 
+proxy-agent@^6.4.0:
+  version "6.5.0"
+  resolved "https://registry.yarnpkg.com/proxy-agent/-/proxy-agent-6.5.0.tgz#9e49acba8e4ee234aacb539f89ed9c23d02f232d"
+  integrity sha512-TmatMXdr2KlRiA2CyDu8GqR8EjahTG3aY3nXjdzFyoZbmB8hrBsTyMezhULIXKnC0jpfjlmiZ3+EaCzoInSu/A==
+  dependencies:
+    agent-base "^7.1.2"
+    debug "^4.3.4"
+    http-proxy-agent "^7.0.1"
+    https-proxy-agent "^7.0.6"
+    lru-cache "^7.14.1"
+    pac-proxy-agent "^7.1.0"
+    proxy-from-env "^1.1.0"
+    socks-proxy-agent "^8.0.5"
+
 proxy-from-env@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2"
   integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==
 
-prr@~1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"
-
-pseudomap@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/pseudomap/-/pseudomap-1.0.2.tgz#f052a28da70e618917ef0a8ac34c1ae5a68286b3"
-  integrity sha512-b/YwNhb8lk1Zz2+bXXpS/LK9OisiZZ1SNsSLxN1x2OXVEhW2Ckr/7mWE5vrC1ZTiJlD9g19jWszTmJsB+oEpFQ==
-
 psl@^1.1.33:
-  version "1.9.0"
-  resolved "https://registry.yarnpkg.com/psl/-/psl-1.9.0.tgz#d0df2a137f00794565fcaf3b2c00cd09f8d5a5a7"
-  integrity sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==
+  version "1.15.0"
+  resolved "https://registry.yarnpkg.com/psl/-/psl-1.15.0.tgz#bdace31896f1d97cec6a79e8224898ce93d974c6"
+  integrity sha512-JZd3gMVBAVQkSs6HdNZo9Sdo0LNcQeMNP3CozBJb3JYC/QUYZTnKxP+f8oWRX4rHP5EurWxqAHTSwUCjlNKa1w==
+  dependencies:
+    punycode "^2.3.1"
 
 pump@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/pump/-/pump-3.0.0.tgz#b4a2116815bde2f4e1ea602354e8c75565107a64"
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/pump/-/pump-3.0.2.tgz#836f3edd6bc2ee599256c924ffe0d88573ddcbf8"
+  integrity sha512-tUPXtzlGM8FE3P0ZL6DVs/3P58k9nk8/jZeQCurTJylQA8qFYzHFfhBJkuqyE0FifOsQ0uKWekiZ5g8wtr28cw==
   dependencies:
     end-of-stream "^1.1.0"
     once "^1.3.1"
 
-punycode.js@2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/punycode.js/-/punycode.js-2.3.0.tgz#6aaa35964ffecc676545995ecb65980bd8302f61"
-  integrity sha512-AM9kSplQQCRlRkRZzx2EcqW2AQ9HuYoUzzl/tjJDNJEUeYHFGJ/rGE0a9cE1b41iuFz94pAwcEekC137Dd9Eyw==
+punycode.js@2.3.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/punycode.js/-/punycode.js-2.3.1.tgz#6b53e56ad75588234e79f4affa90972c7dd8cdb7"
+  integrity sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==
 
-punycode@1.3.2:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.3.2.tgz#9653a036fb7c1ee42342f2325cceefea3926c48d"
-  integrity sha512-RofWgt/7fL5wP1Y7fxE7/EmTLzQVnB0ycyibJ0OOHIlJqTNzglYFxVwETOcIoJqJmpDXJ9xImDv+Fq34F/d4Dw==
+punycode@^1.4.1:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
+  integrity sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==
 
-punycode@^2.1.0, punycode@^2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
+punycode@^2.1.0, punycode@^2.1.1, punycode@^2.3.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.3.1.tgz#027422e2faec0b25e1549c3e1bd8309b9133b6e5"
+  integrity sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==
 
-qjobs@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/qjobs/-/qjobs-1.2.0.tgz#c45e9c61800bd087ef88d7e256423bdd49e5d071"
-  integrity sha512-8YOJEHtxpySA3fFDyCRxA+UUV+fA+rTWnuWvylOK/NCjhY+b4ocCtmu8TtsWb+mYeU+GCHf/S66KZF/AsteKHg==
-
-qrcode@1.5.3:
-  version "1.5.3"
-  resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.5.3.tgz#03afa80912c0dccf12bc93f615a535aad1066170"
-  integrity sha512-puyri6ApkEHYiVl4CFzo1tDkAZ+ATcnbJrJ6RiBM1Fhctdn/ix9MTE3hRph33omisEbC/2fcfemsseiKgBPKZg==
+qrcode@1.5.4:
+  version "1.5.4"
+  resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.5.4.tgz#5cb81d86eb57c675febb08cf007fff963405da88"
+  integrity sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg==
   dependencies:
     dijkstrajs "^1.0.1"
-    encode-utf8 "^1.0.3"
     pngjs "^5.0.0"
     yargs "^15.3.1"
 
-qs@6.11.0:
-  version "6.11.0"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-6.11.0.tgz#fd0d963446f7a65e1367e01abd85429453f0c37a"
-  integrity sha512-MvjoMCJwEarSbUYk5O+nmoSzSutSsTwF85zcHPQ9OrlFoZOYIjaqBAJIqIXjptyD5vThxGq52Xu/MaJzRkIk4Q==
+qs@^6.12.3, qs@^6.14.0:
+  version "6.14.0"
+  resolved "https://registry.yarnpkg.com/qs/-/qs-6.14.0.tgz#c63fa40680d2c5c941412a0e899c89af60c0a930"
+  integrity sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==
   dependencies:
-    side-channel "^1.0.4"
-
-qs@6.9.7:
-  version "6.9.7"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-6.9.7.tgz#4610846871485e1e048f44ae3b94033f0e675afe"
-  integrity sha512-IhMFgUmuNpyRfxA90umL7ByLlgRXu6tIfKPpF5TmcfRLlLCckfP/g3IQmju6jjpu+Hh8rA+2p6A27ZSPOOHdKw==
+    side-channel "^1.1.0"
 
 querystring-es3@0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73"
   integrity sha512-773xhDQnZBMFobEiztv8LIl70ch5MSF/jUQVlhwFyBILqq96anmoctVIYz+ZRp0qbCKATTn6ev02M3r7Ga5vqA==
 
-querystring@0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.0.tgz#b209849203bb25df820da756e747005878521620"
-  integrity sha512-X/xY82scca2tau62i9mDyU9K+I+djTMUsvwf7xnUX5GLvVzgJybOJf4Y6o9Zx3oJK/LSXg5tTZBjwzqVPaPO2g==
-
 querystringify@^2.1.1:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.2.0.tgz#3345941b4153cb9d082d8eee4cda2016a9aef7f6"
   integrity sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==
 
-quick-lru@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/quick-lru/-/quick-lru-4.0.1.tgz#5b8878f113a58217848c6482026c73e1ba57727f"
-  integrity sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==
+queue-microtask@^1.2.2:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243"
+  integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==
 
 randombytes@^2.1.0:
   version "2.1.0"
@@ -7850,53 +6733,30 @@ randombytes@^2.1.0:
   dependencies:
     safe-buffer "^5.1.0"
 
-range-parser@^1.2.1, range-parser@~1.2.1:
+range-parser@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031"
   integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==
 
-raw-body@2.4.3:
-  version "2.4.3"
-  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.4.3.tgz#8f80305d11c2a0a545c2d9d89d7a0286fcead43c"
-  integrity sha512-UlTNLIcu0uzb4D2f4WltY6cVjLi+/jEN4lgEUj3E04tpMDpUlkBo/eSn6zou9hum2VMNpCCUone0O0WeJim07g==
-  dependencies:
-    bytes "3.1.2"
-    http-errors "1.8.1"
-    iconv-lite "0.4.24"
-    unpipe "1.0.0"
-
-raw-body@2.5.1:
-  version "2.5.1"
-  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.5.1.tgz#fe1b1628b181b700215e5fd42389f98b71392857"
-  integrity sha512-qqJBtEyVgS0ZmPGdCFPWJ3FreoqvG4MVQln/kCgF7Olq95IbOp0/BWyMwbdtn4VTvkM8Y7khCQ2Xgk/tcrCXig==
+raw-body@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-3.0.0.tgz#25b3476f07a51600619dae3fe82ddc28a36e5e0f"
+  integrity sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g==
   dependencies:
     bytes "3.1.2"
     http-errors "2.0.0"
-    iconv-lite "0.4.24"
+    iconv-lite "0.6.3"
     unpipe "1.0.0"
 
-read-pkg-up@^7.0.1:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-7.0.1.tgz#f3a6135758459733ae2b95638056e1854e7ef507"
-  integrity sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==
-  dependencies:
-    find-up "^4.1.0"
-    read-pkg "^5.2.0"
-    type-fest "^0.8.1"
+react-is@^17.0.1:
+  version "17.0.2"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
+  integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
 
-read-pkg@^5.2.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-5.2.0.tgz#7bf295438ca5a33e56cd30e053b34ee7250c93cc"
-  integrity sha512-Ug69mNOpfvKDAc2Q8DRpMjjzdtrnv9HcSMX+4VsZxD1aZ6ZzrIE7rlzXBtWTyhULSMKg076AW6WR5iZpD0JiOg==
-  dependencies:
-    "@types/normalize-package-data" "^2.4.0"
-    normalize-package-data "^2.5.0"
-    parse-json "^5.0.0"
-    type-fest "^0.6.0"
-
-readable-stream@^2.0.1:
-  version "2.3.6"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
+readable-stream@^2.0.0, readable-stream@^2.0.5, readable-stream@~2.3.6:
+  version "2.3.8"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.8.tgz#91125e8042bba1b9887f49345f6277027ce8be9b"
+  integrity sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==
   dependencies:
     core-util-is "~1.0.0"
     inherits "~2.0.3"
@@ -7906,27 +6766,26 @@ readable-stream@^2.0.1:
     string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
-readable-stream@^3.4.0:
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.0.tgz#337bbda3adc0706bd3e024426a286d4b4b2c9198"
-  integrity sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==
+readable-stream@^3.1.1, readable-stream@^3.4.0, readable-stream@^3.6.0:
+  version "3.6.2"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.2.tgz#56a9b36ea965c00c5a93ef31eb111a0f11056967"
+  integrity sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==
   dependencies:
     inherits "^2.0.3"
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
-readable-stream@~2.3.6:
-  version "2.3.7"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.7.tgz#1eca1cf711aef814c04f62252a36a62f6cb23b57"
-  integrity sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==
+readdir-glob@^1.1.2:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/readdir-glob/-/readdir-glob-1.1.3.tgz#c3d831f51f5e7bfa62fa2ffbe4b508c640f09584"
+  integrity sha512-v05I2k7xN8zXvPD9N+z/uhXPaj0sUFCe2rcWZIpBsqxfP7xXFQ0tipAd/wjj1YxWyWtUS5IDJpOG82JKt2EAVA==
   dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.3"
-    isarray "~1.0.0"
-    process-nextick-args "~2.0.0"
-    safe-buffer "~5.1.1"
-    string_decoder "~1.1.1"
-    util-deprecate "~1.0.1"
+    minimatch "^5.1.0"
+
+readdirp@^4.0.1:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-4.1.2.tgz#eb85801435fbf2a7ee58f19e0921b068fc69948d"
+  integrity sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==
 
 readdirp@~3.6.0:
   version "3.6.0"
@@ -7935,31 +6794,24 @@ readdirp@~3.6.0:
   dependencies:
     picomatch "^2.2.1"
 
-rechoir@^0.6.2:
-  version "0.6.2"
-  resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
+reflect.getprototypeof@^1.0.6, reflect.getprototypeof@^1.0.9:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz#c629219e78a3316d8b604c765ef68996964e7bf9"
+  integrity sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==
   dependencies:
-    resolve "^1.1.6"
+    call-bind "^1.0.8"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.9"
+    es-errors "^1.3.0"
+    es-object-atoms "^1.0.0"
+    get-intrinsic "^1.2.7"
+    get-proto "^1.0.1"
+    which-builtin-type "^1.2.1"
 
-redent@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/redent/-/redent-3.0.0.tgz#e557b7998316bb53c9f1f56fa626352c6963059f"
-  integrity sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==
-  dependencies:
-    indent-string "^4.0.0"
-    strip-indent "^3.0.0"
-
-regenerate-unicode-properties@^10.0.1:
-  version "10.0.1"
-  resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-10.0.1.tgz#7f442732aa7934a3740c779bb9b3340dccc1fb56"
-  integrity sha512-vn5DU6yg6h8hP/2OkQo3K7uVILvY4iu0oI4t3HFa81UPkhGJwkRwM10JEc3upjdhHjs/k8GJY1sRBhk5sr69Bw==
-  dependencies:
-    regenerate "^1.4.2"
-
-regenerate-unicode-properties@^10.1.0:
-  version "10.1.0"
-  resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-10.1.0.tgz#7c3192cab6dd24e21cb4461e5ddd7dd24fa8374c"
-  integrity sha512-d1VudCLoIGitcU/hEg2QqvyGZQmdC0Lf8BqdOMXGFSvJP4bNV1+XqbPQeHHLD51Jh4QJJ225dlIFvY4Ly6MXmQ==
+regenerate-unicode-properties@^10.2.0:
+  version "10.2.0"
+  resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-10.2.0.tgz#626e39df8c372338ea9b8028d1f99dc3fd9c3db0"
+  integrity sha512-DqHn3DwbmmPVzeKj9woBadqmXxLvQoQIwu7nopMc72ztvxVmVk2SBhSnx67zuye5TP+lJsb/TBQsjLKhnDf3MA==
   dependencies:
     regenerate "^1.4.2"
 
@@ -7968,111 +6820,46 @@ regenerate@^1.4.2:
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.2.tgz#b9346d8827e8f5a32f7ba29637d398b69014848a"
   integrity sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==
 
-regenerator-runtime@^0.13.11:
-  version "0.13.11"
-  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"
-  integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
-
-regenerator-runtime@^0.13.4:
-  version "0.13.9"
-  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz#8925742a98ffd90814988d7566ad30ca3b263b52"
-  integrity sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==
-
-regenerator-transform@^0.15.1:
-  version "0.15.1"
-  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.1.tgz#f6c4e99fc1b4591f780db2586328e4d9a9d8dc56"
-  integrity sha512-knzmNAcuyxV+gQCufkYcvOqX/qIIfHLv0u5x79kRxuGojfYVky1f15TzZEu2Avte8QGepvUNTnLskf8E6X6Vyg==
+regexp.prototype.flags@^1.5.1, regexp.prototype.flags@^1.5.3, regexp.prototype.flags@^1.5.4:
+  version "1.5.4"
+  resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz#1ad6c62d44a259007e55b3970e00f746efbcaa19"
+  integrity sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==
   dependencies:
-    "@babel/runtime" "^7.8.4"
+    call-bind "^1.0.8"
+    define-properties "^1.2.1"
+    es-errors "^1.3.0"
+    get-proto "^1.0.1"
+    gopd "^1.2.0"
+    set-function-name "^2.0.2"
 
-regexp.prototype.flags@^1.4.3:
-  version "1.4.3"
-  resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.4.3.tgz#87cab30f80f66660181a3bb7bf5981a872b367ac"
-  integrity sha512-fjggEOO3slI6Wvgjwflkc4NFRCTZAu5CnNfBd5qOMYhWdn67nJBBu34/TkD++eeFmd8C9r9jfXJ27+nSiRkSUA==
-  dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.3"
-    functions-have-names "^1.2.2"
-
-regexpp@^3.0.0, regexpp@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2"
-  integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==
-
-regexpu-core@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.0.1.tgz#c531122a7840de743dcf9c83e923b5560323ced3"
-  integrity sha512-CriEZlrKK9VJw/xQGJpQM5rY88BtuL8DM+AEwvcThHilbxiTAy8vq4iJnd2tqq8wLmjbGZzP7ZcKFjbGkmEFrw==
+regexpu-core@^6.2.0:
+  version "6.2.0"
+  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-6.2.0.tgz#0e5190d79e542bf294955dccabae04d3c7d53826"
+  integrity sha512-H66BPQMrv+V16t8xtmq+UC0CBpiTBA60V8ibS1QVReIp8T1z8hwFxqcGzm9K6lgsN7sB5edVH8a+ze6Fqm4weA==
   dependencies:
     regenerate "^1.4.2"
-    regenerate-unicode-properties "^10.0.1"
-    regjsgen "^0.6.0"
-    regjsparser "^0.8.2"
-    unicode-match-property-ecmascript "^2.0.0"
-    unicode-match-property-value-ecmascript "^2.0.0"
-
-regexpu-core@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.1.0.tgz#2f8504c3fd0ebe11215783a41541e21c79942c6d"
-  integrity sha512-bb6hk+xWd2PEOkj5It46A16zFMs2mv86Iwpdu94la4S3sJ7C973h2dHpYKwIBGaWSO7cIRJ+UX0IeMaWcO4qwA==
-  dependencies:
-    regenerate "^1.4.2"
-    regenerate-unicode-properties "^10.0.1"
-    regjsgen "^0.6.0"
-    regjsparser "^0.8.2"
-    unicode-match-property-ecmascript "^2.0.0"
-    unicode-match-property-value-ecmascript "^2.0.0"
-
-regexpu-core@^5.3.1:
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.3.2.tgz#11a2b06884f3527aec3e93dbbf4a3b958a95546b"
-  integrity sha512-RAM5FlZz+Lhmo7db9L298p2vHP5ZywrVXmVXpmAD9GuL5MPH6t9ROw1iA/wfHkQ76Qe7AaPF0nGuim96/IrQMQ==
-  dependencies:
-    "@babel/regjsgen" "^0.8.0"
-    regenerate "^1.4.2"
-    regenerate-unicode-properties "^10.1.0"
-    regjsparser "^0.9.1"
+    regenerate-unicode-properties "^10.2.0"
+    regjsgen "^0.8.0"
+    regjsparser "^0.12.0"
     unicode-match-property-ecmascript "^2.0.0"
     unicode-match-property-value-ecmascript "^2.1.0"
 
-regjsgen@^0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.6.0.tgz#83414c5354afd7d6627b16af5f10f41c4e71808d"
-  integrity sha512-ozE883Uigtqj3bx7OhL1KNbCzGyW2NQZPl6Hs09WTvCuZD5sTI4JY58bkbQWa/Y9hxIsvJ3M8Nbf7j54IqeZbA==
+regjsgen@^0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.8.0.tgz#df23ff26e0c5b300a6470cad160a9d090c3a37ab"
+  integrity sha512-RvwtGe3d7LvWiDQXeQw8p5asZUmfU1G/l6WbUXeHta7Y2PEIvBTwH6E2EfmYUK8pxcxEdEmaomqyp0vZZ7C+3Q==
 
-regjsparser@^0.8.2:
-  version "0.8.4"
-  resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.8.4.tgz#8a14285ffcc5de78c5b95d62bbf413b6bc132d5f"
-  integrity sha512-J3LABycON/VNEu3abOviqGHuB/LOtOQj8SKmfP9anY5GfAVw/SPjwzSjxGjbZXIxbGfqTHtJw58C2Li/WkStmA==
+regjsparser@^0.12.0:
+  version "0.12.0"
+  resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.12.0.tgz#0e846df6c6530586429377de56e0475583b088dc"
+  integrity sha512-cnE+y8bz4NhMjISKbgeVJtqNbtf5QpjZP+Bslo+UqkIt9QPnX9q095eiRRASJG1/tz6dlNr6Z5NsBiWYokp6EQ==
   dependencies:
-    jsesc "~0.5.0"
-
-regjsparser@^0.9.1:
-  version "0.9.1"
-  resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.9.1.tgz#272d05aa10c7c1f67095b1ff0addae8442fc5709"
-  integrity sha512-dQUtn90WanSNl+7mQKcXAgZxvUe7Z0SqXlgzv0za4LwiUhyzBC58yQO3liFoUgu8GiJVInAhJjkj1N0EtQ5nkQ==
-  dependencies:
-    jsesc "~0.5.0"
-
-relateurl@^0.2.7:
-  version "0.2.7"
-  resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
-  integrity sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog==
-
-renderkid@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/renderkid/-/renderkid-3.0.0.tgz#5fd823e4d6951d37358ecc9a58b1f06836b6268a"
-  integrity sha512-q/7VIQA8lmM1hF+jn+sFSPWGlMkSAeNYcPLmDQx2zzuiDfaLrOmumR8iaUKlenFgh0XRPIUeSPlH3A+AW3Z5pg==
-  dependencies:
-    css-select "^4.1.3"
-    dom-converter "^0.2.0"
-    htmlparser2 "^6.1.0"
-    lodash "^4.17.21"
-    strip-ansi "^6.0.1"
+    jsesc "~3.0.2"
 
 require-directory@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42"
+  integrity sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==
 
 require-from-string@^2.0.2:
   version "2.0.2"
@@ -8087,55 +6874,37 @@ require-main-filename@^2.0.0:
 require-package-name@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/require-package-name/-/require-package-name-2.0.1.tgz#c11e97276b65b8e2923f75dabf5fb2ef0c3841b9"
+  integrity sha512-uuoJ1hU/k6M0779t3VMVIYpb2VMJk05cehCaABFhXaibcbvfgR8wKiozLjVFSzJPmQMRqIcO0HMyTFqfV09V6Q==
 
 requires-port@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
+  integrity sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==
 
 resolve-from@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
+  integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==
 
 resolve-from@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-5.0.0.tgz#c35225843df8f776df21c57557bc087e9dfdfc69"
   integrity sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==
 
-resolve@^1.1.6:
-  version "1.1.7"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
+resolve-pkg-maps@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/resolve-pkg-maps/-/resolve-pkg-maps-1.0.0.tgz#616b3dc2c57056b5588c31cdf4b3d64db133720f"
+  integrity sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==
 
-resolve@^1.10.0:
-  version "1.11.0"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.11.0.tgz#4014870ba296176b86343d50b60f3b50609ce232"
+resolve@^1.22.10, resolve@^1.22.4:
+  version "1.22.10"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.10.tgz#b663e83ffb09bbf2386944736baae803029b8b39"
+  integrity sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==
   dependencies:
-    path-parse "^1.0.6"
-
-resolve@^1.14.2:
-  version "1.22.0"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.0.tgz#5e0b8c67c15df57a89bdbabe603a002f21731198"
-  integrity sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==
-  dependencies:
-    is-core-module "^2.8.1"
+    is-core-module "^2.16.0"
     path-parse "^1.0.7"
     supports-preserve-symlinks-flag "^1.0.0"
 
-resolve@^1.22.1:
-  version "1.22.1"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177"
-  integrity sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==
-  dependencies:
-    is-core-module "^2.9.0"
-    path-parse "^1.0.7"
-    supports-preserve-symlinks-flag "^1.0.0"
-
-restore-cursor@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/restore-cursor/-/restore-cursor-2.0.0.tgz#9f7ee287f82fd326d4fd162923d62129eee0dfaf"
-  dependencies:
-    onetime "^2.0.0"
-    signal-exit "^3.0.2"
-
 restore-cursor@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/restore-cursor/-/restore-cursor-3.1.0.tgz#39f67c54b3a7a58cea5236d95cf0034239631f7e"
@@ -8145,188 +6914,251 @@ restore-cursor@^3.1.0:
     signal-exit "^3.0.2"
 
 reusify@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
-  integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.1.0.tgz#0fe13b9522e1473f51b558ee796e08f11f9b489f"
+  integrity sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==
 
-rfdc@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.3.0.tgz#d0b7c441ab2720d05dc4cf26e01c89631d9da08b"
-  integrity sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==
+rfdc@^1.4.1:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.4.1.tgz#778f76c4fb731d93414e8f925fbecf64cce7f6ca"
+  integrity sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==
 
-rimraf@^3.0.0, rimraf@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a"
-  integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==
+rollup@^4.34.9:
+  version "4.52.4"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-4.52.4.tgz#71e64cce96a865fcbaa6bb62c6e82807f4e378a1"
+  integrity sha512-CLEVl+MnPAiKh5pl4dEWSyMTpuflgNQiLGhMv8ezD5W/qP8AKvmYpCOKRRNOh7oRKnauBZ4SyeYkMS+1VSyKwQ==
   dependencies:
-    glob "^7.1.3"
+    "@types/estree" "1.0.8"
+  optionalDependencies:
+    "@rollup/rollup-android-arm-eabi" "4.52.4"
+    "@rollup/rollup-android-arm64" "4.52.4"
+    "@rollup/rollup-darwin-arm64" "4.52.4"
+    "@rollup/rollup-darwin-x64" "4.52.4"
+    "@rollup/rollup-freebsd-arm64" "4.52.4"
+    "@rollup/rollup-freebsd-x64" "4.52.4"
+    "@rollup/rollup-linux-arm-gnueabihf" "4.52.4"
+    "@rollup/rollup-linux-arm-musleabihf" "4.52.4"
+    "@rollup/rollup-linux-arm64-gnu" "4.52.4"
+    "@rollup/rollup-linux-arm64-musl" "4.52.4"
+    "@rollup/rollup-linux-loong64-gnu" "4.52.4"
+    "@rollup/rollup-linux-ppc64-gnu" "4.52.4"
+    "@rollup/rollup-linux-riscv64-gnu" "4.52.4"
+    "@rollup/rollup-linux-riscv64-musl" "4.52.4"
+    "@rollup/rollup-linux-s390x-gnu" "4.52.4"
+    "@rollup/rollup-linux-x64-gnu" "4.52.4"
+    "@rollup/rollup-linux-x64-musl" "4.52.4"
+    "@rollup/rollup-openharmony-arm64" "4.52.4"
+    "@rollup/rollup-win32-arm64-msvc" "4.52.4"
+    "@rollup/rollup-win32-ia32-msvc" "4.52.4"
+    "@rollup/rollup-win32-x64-gnu" "4.52.4"
+    "@rollup/rollup-win32-x64-msvc" "4.52.4"
+    fsevents "~2.3.2"
+
+router@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/router/-/router-2.2.0.tgz#019be620b711c87641167cc79b99090f00b146ef"
+  integrity sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==
+  dependencies:
+    debug "^4.4.0"
+    depd "^2.0.0"
+    is-promise "^4.0.0"
+    parseurl "^1.3.3"
+    path-to-regexp "^8.0.0"
+
+rrweb-cssom@^0.7.1:
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/rrweb-cssom/-/rrweb-cssom-0.7.1.tgz#c73451a484b86dd7cfb1e0b2898df4b703183e4b"
+  integrity sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==
+
+rrweb-cssom@^0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/rrweb-cssom/-/rrweb-cssom-0.8.0.tgz#3021d1b4352fbf3b614aaeed0bc0d5739abe0bc2"
+  integrity sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==
 
 run-parallel@^1.1.9:
-  version "1.1.9"
-  resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.1.9.tgz#c9dd3a7cf9f4b2c4b6244e173a6ed866e61dd679"
-  integrity sha512-DEqnSRTDw/Tc3FXf49zedI638Z9onwUotBMiUFKmrO2sdFKIbXamXGQ3Axd4qgphxKB4kw/qP1w5kTxnfU1B9Q==
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee"
+  integrity sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==
+  dependencies:
+    queue-microtask "^1.2.2"
 
-safe-buffer@5.2.1, safe-buffer@~5.2.0:
+safe-array-concat@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/safe-array-concat/-/safe-array-concat-1.1.3.tgz#c9e54ec4f603b0bbb8e7e5007a5ee7aecd1538c3"
+  integrity sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==
+  dependencies:
+    call-bind "^1.0.8"
+    call-bound "^1.0.2"
+    get-intrinsic "^1.2.6"
+    has-symbols "^1.1.0"
+    isarray "^2.0.5"
+
+safe-buffer@5.2.1, safe-buffer@^5.1.0, safe-buffer@~5.2.0:
   version "5.2.1"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6"
   integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
 
-safe-buffer@^5.1.0, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
+safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
+  integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==
 
-safe-regex-test@^1.0.0:
+safe-push-apply@^1.0.0:
   version "1.0.0"
-  resolved "https://registry.yarnpkg.com/safe-regex-test/-/safe-regex-test-1.0.0.tgz#793b874d524eb3640d1873aad03596db2d4f2295"
-  integrity sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==
+  resolved "https://registry.yarnpkg.com/safe-push-apply/-/safe-push-apply-1.0.0.tgz#01850e981c1602d398c85081f360e4e6d03d27f5"
+  integrity sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==
   dependencies:
-    call-bind "^1.0.2"
-    get-intrinsic "^1.1.3"
-    is-regex "^1.1.4"
+    es-errors "^1.3.0"
+    isarray "^2.0.5"
 
-"safer-buffer@>= 2.1.2 < 3", "safer-buffer@>= 2.1.2 < 3.0.0":
+safe-regex-test@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/safe-regex-test/-/safe-regex-test-1.1.0.tgz#7f87dfb67a3150782eaaf18583ff5d1711ac10c1"
+  integrity sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==
+  dependencies:
+    call-bound "^1.0.2"
+    es-errors "^1.3.0"
+    is-regex "^1.2.1"
+
+"safer-buffer@>= 2.1.2 < 3.0.0":
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
+  integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
 
-sass-loader@13.2.2:
-  version "13.2.2"
-  resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-13.2.2.tgz#f97e803993b24012c10d7ba9676548bf7a6b18b9"
-  integrity sha512-nrIdVAAte3B9icfBiGWvmMhT/D+eCDwnk+yA7VE/76dp/WkHX+i44Q/pfo71NYbwj0Ap+PGsn0ekOuU1WFJ2AA==
+sass@1.93.2:
+  version "1.93.2"
+  resolved "https://registry.yarnpkg.com/sass/-/sass-1.93.2.tgz#e97d225d60f59a3b3dbb6d2ae3c1b955fd1f2cd1"
+  integrity sha512-t+YPtOQHpGW1QWsh1CHQ5cPIr9lbbGZLZnbihP/D/qZj/yuV68m8qarcV17nvkOX81BCrvzAlq2klCQFZghyTg==
   dependencies:
-    klona "^2.0.6"
-    neo-async "^2.6.2"
-
-sass@1.60.0:
-  version "1.60.0"
-  resolved "https://registry.yarnpkg.com/sass/-/sass-1.60.0.tgz#657f0c23a302ac494b09a5ba8497b739fb5b5a81"
-  integrity sha512-updbwW6fNb5gGm8qMXzVO7V4sWf7LMXnMly/JEyfbfERbVH46Fn6q02BX7/eHTdKpE7d+oTkMMQpFWNUMfFbgQ==
-  dependencies:
-    chokidar ">=3.0.0 <4.0.0"
-    immutable "^4.0.0"
+    chokidar "^4.0.0"
+    immutable "^5.0.2"
     source-map-js ">=0.6.2 <2.0.0"
+  optionalDependencies:
+    "@parcel/watcher" "^2.4.1"
 
-saxes@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/saxes/-/saxes-5.0.1.tgz#eebab953fa3b7608dbe94e5dadb15c888fa6696d"
-  integrity sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw==
+saxes@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/saxes/-/saxes-6.0.0.tgz#fe5b4a4768df4f14a201b1ba6a65c1f3d9988cc5"
+  integrity sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==
   dependencies:
     xmlchars "^2.2.0"
 
-schema-utils@^3.1.0, schema-utils@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-3.1.1.tgz#bc74c4b6b6995c1d88f76a8b77bea7219e0c8281"
-  integrity sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==
+selenium-server@3.141.59:
+  version "3.141.59"
+  resolved "https://registry.yarnpkg.com/selenium-server/-/selenium-server-3.141.59.tgz#cbefdf50aae636ee4c67b819532a8233ce3fd6b0"
+  integrity sha512-pL7T1YtAqOEXiBbTx0KdZMkE2U7PYucemd7i0nDLcxcR1APXYZlJfNr5hrvL3mZgwXb7AJEZPINzC6mDU3eP5g==
+
+selenium-webdriver@4.27.0:
+  version "4.27.0"
+  resolved "https://registry.yarnpkg.com/selenium-webdriver/-/selenium-webdriver-4.27.0.tgz#f0f26ce453805e7dc77151040442c67e441dbe7a"
+  integrity sha512-LkTJrNz5socxpPnWPODQ2bQ65eYx9JK+DQMYNihpTjMCqHwgWGYQnQTCAAche2W3ZP87alA+1zYPvgS8tHNzMQ==
   dependencies:
-    "@types/json-schema" "^7.0.8"
-    ajv "^6.12.5"
-    ajv-keywords "^3.5.2"
+    "@bazel/runfiles" "^6.3.1"
+    jszip "^3.10.1"
+    tmp "^0.2.3"
+    ws "^8.18.0"
 
-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"
-
-selenium-server@2.53.1:
-  version "2.53.1"
-  resolved "https://registry.yarnpkg.com/selenium-server/-/selenium-server-2.53.1.tgz#d681528812f3c2e0531a6b7e613e23bb02cce8a6"
-
-selenium-webdriver@4.6.1:
-  version "4.6.1"
-  resolved "https://registry.yarnpkg.com/selenium-webdriver/-/selenium-webdriver-4.6.1.tgz#ac66867206542a40c24b5a44f4ccbae992e962dc"
-  integrity sha512-FT8Dw0tbzaTp8YYLuwhaCnve/nw03HKrOJrA3aUmTKmxaIFSP4kT2R5fN3K0RpV5kbR0ZnM4FGVI2vANBvekaA==
-  dependencies:
-    jszip "^3.10.0"
-    tmp "^0.2.1"
-    ws ">=8.7.0"
-
-"semver@2 || 3 || 4 || 5", semver@^5.6.0:
-  version "5.6.0"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
-
-semver@7.3.5:
-  version "7.3.5"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
-  integrity sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==
-  dependencies:
-    lru-cache "^6.0.0"
-
-semver@7.3.8, semver@^7.3.8:
-  version "7.3.8"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.8.tgz#07a78feafb3f7b32347d725e33de7e2a2df67798"
-  integrity sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==
-  dependencies:
-    lru-cache "^6.0.0"
-
-semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.3.0:
-  version "6.3.0"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
-  integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
-
-semver@^7.0.0, semver@^7.3.4, semver@^7.3.5, semver@^7.3.6:
-  version "7.3.7"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.7.tgz#12c5b649afdbf9049707796e22a4028814ce523f"
-  integrity sha512-QlYTucUYOews+WeEujDoEGziz4K6c47V/Bd+LjSSYcA94p+DmINdf7ncaUinThfvZyu13lN9OY1XDxt8C0Tw0g==
-  dependencies:
-    lru-cache "^6.0.0"
-
-semver@^7.5.4:
+semver@7.5.4:
   version "7.5.4"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.4.tgz#483986ec4ed38e1c6c48c34894a9182dbff68a6e"
   integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
   dependencies:
     lru-cache "^6.0.0"
 
-send@0.18.0:
-  version "0.18.0"
-  resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be"
-  integrity sha512-qqWzuOjSFOuqPjFe4NOsMLafToQQwBSOEpS+FwEt3A2V3vKubTquT3vmLTQpFgMXp8AlFWFuP1qKaJZOtPpVXg==
-  dependencies:
-    debug "2.6.9"
-    depd "2.0.0"
-    destroy "1.2.0"
-    encodeurl "~1.0.2"
-    escape-html "~1.0.3"
-    etag "~1.8.1"
-    fresh "0.5.2"
-    http-errors "2.0.0"
-    mime "1.6.0"
-    ms "2.1.3"
-    on-finished "2.4.1"
-    range-parser "~1.2.1"
-    statuses "2.0.1"
+semver@7.7.3:
+  version "7.7.3"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.7.3.tgz#4b5f4143d007633a8dc671cd0a6ef9147b8bb946"
+  integrity sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q==
 
-serialize-javascript@6.0.0, serialize-javascript@^6.0.0:
+semver@^5.6.0:
+  version "5.7.2"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.2.tgz#48d55db737c3287cd4835e17fa13feace1c41ef8"
+  integrity sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==
+
+semver@^6.3.1:
+  version "6.3.1"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4"
+  integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==
+
+semver@^7.3.5:
+  version "7.7.2"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.7.2.tgz#67d99fdcd35cec21e6f8b87a7fd515a33f982b58"
+  integrity sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==
+
+semver@^7.5.3, semver@^7.5.4, semver@^7.6.3:
+  version "7.7.1"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.7.1.tgz#abd5098d82b18c6c81f6074ff2647fd3e7220c9f"
+  integrity sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==
+
+send@^1.1.0, send@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/send/-/send-1.2.0.tgz#32a7554fb777b831dfa828370f773a3808d37212"
+  integrity sha512-uaW0WwXKpL9blXE2o0bRhoL2EGXIrZxQ2ZQ4mgcfoBxdFmQold+qWsD2jLrfZ0trjKL6vOw0j//eAwcALFjKSw==
+  dependencies:
+    debug "^4.3.5"
+    encodeurl "^2.0.0"
+    escape-html "^1.0.3"
+    etag "^1.8.1"
+    fresh "^2.0.0"
+    http-errors "^2.0.0"
+    mime-types "^3.0.1"
+    ms "^2.1.3"
+    on-finished "^2.4.1"
+    range-parser "^1.2.1"
+    statuses "^2.0.1"
+
+serialize-javascript@6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-6.0.0.tgz#efae5d88f45d7924141da8b5c3a7a7e663fefeb8"
   integrity sha512-Qr3TosvguFt8ePWqsvRfrKyQXIiW+nGbYpy8XK24NQHE83caxWt+mIymTT19DGFbNWNLfEwsrkSmN64lVWB9ag==
   dependencies:
     randombytes "^2.1.0"
 
-serve-static@1.15.0:
-  version "1.15.0"
-  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.15.0.tgz#faaef08cffe0a1a62f60cad0c4e513cff0ac9540"
-  integrity sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g==
+serve-static@2.2.0, serve-static@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-2.2.0.tgz#9c02564ee259bdd2251b82d659a2e7e1938d66f9"
+  integrity sha512-61g9pCh0Vnh7IutZjtLGGpTA355+OPn2TyDv/6ivP2h/AdAVX9azsoxmg2/M6nZeQZNYBEwIcsne1mJd9oQItQ==
   dependencies:
-    encodeurl "~1.0.2"
-    escape-html "~1.0.3"
-    parseurl "~1.3.3"
-    send "0.18.0"
-
-serviceworker-webpack5-plugin@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/serviceworker-webpack5-plugin/-/serviceworker-webpack5-plugin-2.0.0.tgz#6d3516b11fcf3cfadee60f04d607e7d042e3e7fc"
-  integrity sha512-lMypbP8MQiWeUa2Za1BfV9M18aXQCoB71XaeL6v32qxvdTCqILv2cxDNW1Mlq/tHJ8hgKlP3INQ2eo2BLaHyZQ==
-  dependencies:
-    minimatch "^3.0.4"
+    encodeurl "^2.0.0"
+    escape-html "^1.0.3"
+    parseurl "^1.3.3"
+    send "^1.2.0"
 
 set-blocking@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
+  integrity sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==
+
+set-function-length@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/set-function-length/-/set-function-length-1.2.2.tgz#aac72314198eaed975cf77b2c3b6b880695e5449"
+  integrity sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==
+  dependencies:
+    define-data-property "^1.1.4"
+    es-errors "^1.3.0"
+    function-bind "^1.1.2"
+    get-intrinsic "^1.2.4"
+    gopd "^1.0.1"
+    has-property-descriptors "^1.0.2"
+
+set-function-name@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/set-function-name/-/set-function-name-2.0.2.tgz#16a705c5a0dc2f5e638ca96d8a8cd4e1c2b90985"
+  integrity sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==
+  dependencies:
+    define-data-property "^1.1.4"
+    es-errors "^1.3.0"
+    functions-have-names "^1.2.3"
+    has-property-descriptors "^1.0.2"
+
+set-proto@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/set-proto/-/set-proto-1.0.0.tgz#0760dbcff30b2d7e801fd6e19983e56da337565e"
+  integrity sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==
+  dependencies:
+    dunder-proto "^1.0.1"
+    es-errors "^1.3.0"
+    es-object-atoms "^1.0.0"
 
 setimmediate@^1.0.5:
   version "1.0.5"
@@ -8341,6 +7173,7 @@ setprototypeof@1.2.0:
 shallow-clone@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-3.0.1.tgz#8f2981ad92531f55035b01fb230769a40e02efa3"
+  integrity sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==
   dependencies:
     kind-of "^6.0.2"
 
@@ -8356,65 +7189,99 @@ shebang-regex@^3.0.0:
   resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172"
   integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==
 
-shelljs@0.8.5:
-  version "0.8.5"
-  resolved "https://registry.yarnpkg.com/shelljs/-/shelljs-0.8.5.tgz#de055408d8361bed66c669d2f000538ced8ee20c"
-  integrity sha512-TiwcRcrkhHvbrZbnRcFYMLl30Dfov3HKqzp5tO5b4pt6G/SezKcYhmDg15zXVBswHmctSAQKznqNW2LO5tTDow==
+shelljs@0.10.0:
+  version "0.10.0"
+  resolved "https://registry.yarnpkg.com/shelljs/-/shelljs-0.10.0.tgz#e3bbae99b0f3f0cc5dce05b46a346fae2090e883"
+  integrity sha512-Jex+xw5Mg2qMZL3qnzXIfaxEtBaC4n7xifqaqtrZDdlheR70OGkydrPJWT0V1cA1k3nanC86x9FwAmQl6w3Klw==
   dependencies:
-    glob "^7.0.0"
-    interpret "^1.0.0"
-    rechoir "^0.6.2"
+    execa "^5.1.1"
+    fast-glob "^3.3.2"
 
-side-channel@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"
-  integrity sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==
+side-channel-list@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/side-channel-list/-/side-channel-list-1.0.0.tgz#10cb5984263115d3b7a0e336591e290a830af8ad"
+  integrity sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==
   dependencies:
-    call-bind "^1.0.0"
-    get-intrinsic "^1.0.2"
-    object-inspect "^1.9.0"
+    es-errors "^1.3.0"
+    object-inspect "^1.13.3"
 
-sigmund@^1.0.1:
+side-channel-map@^1.0.1:
   version "1.0.1"
-  resolved "https://registry.yarnpkg.com/sigmund/-/sigmund-1.0.1.tgz#3ff21f198cad2175f9f3b781853fd94d0d19b590"
-  integrity sha512-fCvEXfh6NWpm+YSuY2bpXb/VIihqWA6hLsgboC+0nl71Q7N7o2eaCW8mJa/NLvQhs6jpd3VZV4UiUQlV6+lc8g==
+  resolved "https://registry.yarnpkg.com/side-channel-map/-/side-channel-map-1.0.1.tgz#d6bb6b37902c6fef5174e5f533fab4c732a26f42"
+  integrity sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==
+  dependencies:
+    call-bound "^1.0.2"
+    es-errors "^1.3.0"
+    get-intrinsic "^1.2.5"
+    object-inspect "^1.13.3"
 
-signal-exit@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.2.tgz#b5fdc08f1287ea1178628e415e25132b73646c6d"
+side-channel-weakmap@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz#11dda19d5368e40ce9ec2bdc1fb0ecbc0790ecea"
+  integrity sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==
+  dependencies:
+    call-bound "^1.0.2"
+    es-errors "^1.3.0"
+    get-intrinsic "^1.2.5"
+    object-inspect "^1.13.3"
+    side-channel-map "^1.0.1"
 
-signal-exit@^3.0.7:
+side-channel@^1.0.4, side-channel@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.1.0.tgz#c3fcff9c4da932784873335ec9765fa94ff66bc9"
+  integrity sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==
+  dependencies:
+    es-errors "^1.3.0"
+    object-inspect "^1.13.3"
+    side-channel-list "^1.0.0"
+    side-channel-map "^1.0.1"
+    side-channel-weakmap "^1.0.2"
+
+siginfo@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/siginfo/-/siginfo-2.0.0.tgz#32e76c70b79724e3bb567cb9d543eb858ccfaf30"
+  integrity sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==
+
+signal-exit@^3.0.2, signal-exit@^3.0.3:
   version "3.0.7"
   resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9"
   integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==
 
-sinon-chai@3.7.0:
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/sinon-chai/-/sinon-chai-3.7.0.tgz#cfb7dec1c50990ed18c153f1840721cf13139783"
-  integrity sha512-mf5NURdUaSdnatJx3uhoBOrY9dtL19fiOtAdT1Azxg3+lNJFiuN0uzaU3xX1LeAfL17kHQhTAJgpsfhbMJMY2g==
+signal-exit@^4.0.1, signal-exit@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-4.1.0.tgz#952188c1cbd546070e2dd20d0f41c0ae0530cb04"
+  integrity sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==
 
-sinon@15.0.4:
-  version "15.0.4"
-  resolved "https://registry.yarnpkg.com/sinon/-/sinon-15.0.4.tgz#bcca6fef19b14feccc96473f0d7adc81e0bc5268"
-  integrity sha512-uzmfN6zx3GQaria1kwgWGeKiXSSbShBbue6Dcj0SI8fiCNFbiUDqKl57WFlY5lyhxZVUKmXvzgG2pilRQCBwWg==
+sinon-chai@4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/sinon-chai/-/sinon-chai-4.0.1.tgz#f70000fe0e4f4ab7ceeb3703d3053f8886e0386b"
+  integrity sha512-xMKEEV3cYHC1G+boyr7QEqi80gHznYsxVdC9CdjP5JnCWz/jPGuXQzJz3PtBcb0CcHAxar15Y5sjLBoAs6a0yA==
+
+sinon@20.0.0:
+  version "20.0.0"
+  resolved "https://registry.yarnpkg.com/sinon/-/sinon-20.0.0.tgz#4b653468735f7152ba694d05498c2b5d024ab006"
+  integrity sha512-+FXOAbdnj94AQIxH0w1v8gzNxkawVvNqE3jUzRLptR71Oykeu2RrQXXl/VQjKay+Qnh73fDt/oDfMo6xMeDQbQ==
   dependencies:
-    "@sinonjs/commons" "^3.0.0"
-    "@sinonjs/fake-timers" "^10.0.2"
-    "@sinonjs/samsam" "^8.0.0"
-    diff "^5.1.0"
-    nise "^5.1.4"
+    "@sinonjs/commons" "^3.0.1"
+    "@sinonjs/fake-timers" "^13.0.5"
+    "@sinonjs/samsam" "^8.0.1"
+    diff "^7.0.0"
     supports-color "^7.2.0"
 
+sirv@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/sirv/-/sirv-3.0.1.tgz#32a844794655b727f9e2867b777e0060fbe07bf3"
+  integrity sha512-FoqMu0NCGBLCcAkS1qA+XJIQTR6/JHfQXl+uGteNCQ76T91DMUjPa9xfmeqMY3z80nLSg9yQmNjK0Px6RWsH/A==
+  dependencies:
+    "@polka/url" "^1.0.0-next.24"
+    mrmime "^2.0.0"
+    totalist "^3.0.0"
+
 slash@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634"
   integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
 
-slash@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/slash/-/slash-4.0.0.tgz#2422372176c4c6c5addb5e2ada885af984b396a7"
-  integrity sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==
-
 slice-ansi@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-4.0.0.tgz#500e8dd0fd55b05815086255b3195adf2a45fe6b"
@@ -8424,49 +7291,34 @@ slice-ansi@^4.0.0:
     astral-regex "^2.0.0"
     is-fullwidth-code-point "^3.0.0"
 
-socket.io-adapter@~2.5.2:
-  version "2.5.5"
-  resolved "https://registry.yarnpkg.com/socket.io-adapter/-/socket.io-adapter-2.5.5.tgz#c7a1f9c703d7756844751b6ff9abfc1780664082"
-  integrity sha512-eLDQas5dzPgOWCk9GuuJC2lBqItuhKI4uxGgo9aIV7MYbk2h9Q6uULEh8WBzThoI7l+qU9Ast9fVUmkqPP9wYg==
-  dependencies:
-    debug "~4.3.4"
-    ws "~8.17.1"
+smart-buffer@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/smart-buffer/-/smart-buffer-4.2.0.tgz#6e1d71fa4f18c05f7d0ff216dd16a481d0e8d9ae"
+  integrity sha512-94hK0Hh8rPqQl2xXc3HsaBoOXKV20MToPkcXvwbISWLEs+64sBq5kFgn2kJDHb1Pry9yrP0dxrCI9RRci7RXKg==
 
-socket.io-parser@~4.2.4:
-  version "4.2.4"
-  resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-4.2.4.tgz#c806966cf7270601e47469ddeec30fbdfda44c83"
-  integrity sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==
+socks-proxy-agent@^8.0.5:
+  version "8.0.5"
+  resolved "https://registry.yarnpkg.com/socks-proxy-agent/-/socks-proxy-agent-8.0.5.tgz#b9cdb4e7e998509d7659d689ce7697ac21645bee"
+  integrity sha512-HehCEsotFqbPW9sJ8WVYB6UbmIMv7kUUORIF2Nncq4VQvBfNBLibW9YZR5dlYCSUhwcD628pRllm7n+E+YTzJw==
   dependencies:
-    "@socket.io/component-emitter" "~3.1.0"
-    debug "~4.3.1"
+    agent-base "^7.1.2"
+    debug "^4.3.4"
+    socks "^2.8.3"
 
-socket.io@^4.7.2:
-  version "4.7.5"
-  resolved "https://registry.yarnpkg.com/socket.io/-/socket.io-4.7.5.tgz#56eb2d976aef9d1445f373a62d781a41c7add8f8"
-  integrity sha512-DmeAkF6cwM9jSfmp6Dr/5/mfMwb5Z5qRrSXLpo3Fq5SqyU8CMF15jIN4ZhfSwu35ksM1qmHZDQ/DK5XTccSTvA==
+socks@^2.8.3:
+  version "2.8.4"
+  resolved "https://registry.yarnpkg.com/socks/-/socks-2.8.4.tgz#07109755cdd4da03269bda4725baa061ab56d5cc"
+  integrity sha512-D3YaD0aRxR3mEcqnidIs7ReYJFVzWdd6fXJYUM8ixcQcJRGTka/b3saV0KflYhyVJXKhb947GndU35SxYNResQ==
   dependencies:
-    accepts "~1.3.4"
-    base64id "~2.0.0"
-    cors "~2.8.5"
-    debug "~4.3.2"
-    engine.io "~6.5.2"
-    socket.io-adapter "~2.5.2"
-    socket.io-parser "~4.2.4"
+    ip-address "^9.0.5"
+    smart-buffer "^4.2.0"
 
-"source-map-js@>=0.6.2 <2.0.0", 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-js@>=0.6.2 <2.0.0", source-map-js@^1.0.1, source-map-js@^1.0.2, source-map-js@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.1.tgz#1ce5650fddd87abc099eda37dcff024c2667ae46"
+  integrity sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==
 
 source-map-support@^0.5.16:
-  version "0.5.16"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.16.tgz#0ae069e7fe3ba7538c64c98515e35339eac5a042"
-  integrity sha512-efyLRJDr68D9hBBNIPWFjhpFzURh+KJykQwvMyW5UiZzYwoF6l4YMMDIJJEyFWxWCqfyxLzz6tSfUFR+kXXsVQ==
-  dependencies:
-    buffer-from "^1.0.0"
-    source-map "^0.6.0"
-
-source-map-support@~0.5.20:
   version "0.5.21"
   resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.21.tgz#04fe7c7f9e1ed2d662233c28cb2b35b9f63f6e4f"
   integrity sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==
@@ -8474,41 +7326,25 @@ source-map-support@~0.5.20:
     buffer-from "^1.0.0"
     source-map "^0.6.0"
 
-source-map@0.6.1, source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
+source-map@^0.6.0, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
-sourcemap-codec@^1.4.8:
-  version "1.4.8"
-  resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
-  integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
+speakingurl@^14.0.1:
+  version "14.0.1"
+  resolved "https://registry.yarnpkg.com/speakingurl/-/speakingurl-14.0.1.tgz#f37ec8ddc4ab98e9600c1c9ec324a8c48d772a53"
+  integrity sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==
 
-spdx-correct@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"
-  dependencies:
-    spdx-expression-parse "^3.0.0"
-    spdx-license-ids "^3.0.0"
+sprintf-js@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.1.3.tgz#4914b903a2f8b685d17fdf78a70e917e872e444a"
+  integrity sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==
 
-spdx-exceptions@^2.1.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/spdx-exceptions/-/spdx-exceptions-2.2.0.tgz#2ea450aee74f2a89bfb94519c07fcd6f41322977"
-
-spdx-expression-parse@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz#99e119b7a5da00e05491c9fa338b7904823b41d0"
-  dependencies:
-    spdx-exceptions "^2.1.0"
-    spdx-license-ids "^3.0.0"
-
-spdx-license-ids@^3.0.0:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.3.tgz#81c0ce8f21474756148bbb5f3bfc0f36bf15d76e"
-
-stable@^0.1.8:
-  version "0.1.8"
-  resolved "https://registry.yarnpkg.com/stable/-/stable-0.1.8.tgz#836eb3c8382fe2936feaf544631017ce7d47a3cf"
-  integrity sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==
+stackback@0.0.2:
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/stackback/-/stackback-0.0.2.tgz#1ac8a0d9483848d1695e418b6d031a3c3ce68e3b"
+  integrity sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==
 
 stacktrace-parser@0.1.10:
   version "0.1.10"
@@ -8517,26 +7353,30 @@ stacktrace-parser@0.1.10:
   dependencies:
     type-fest "^0.7.1"
 
-statuses@2.0.1:
+statuses@2.0.1, statuses@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-2.0.1.tgz#55cb000ccf1d48728bd23c685a063998cf1a1b63"
   integrity sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==
 
-"statuses@>= 1.5.0 < 2", statuses@~1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c"
-  integrity sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=
+std-env@^3.9.0:
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/std-env/-/std-env-3.9.0.tgz#1a6f7243b339dca4c9fd55e1c7504c77ef23e8f1"
+  integrity sha512-UGvjygr6F6tpH7o2qyqR6QYpwraIjKSdtzyBdyytFOHmPZY917kwdwLG0RbOjWOnKmnm3PeHjaoLLMie7kPLQw==
 
-streamroller@^3.0.6:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/streamroller/-/streamroller-3.0.6.tgz#52823415800ded79a49aa3f7712f50a422b97493"
-  integrity sha512-Qz32plKq/MZywYyhEatxyYc8vs994Gz0Hu2MSYXXLD233UyPeIeRBZARIIGwFer4Mdb8r3Y2UqKkgyDghM6QCg==
+stop-iteration-iterator@^1.0.0, stop-iteration-iterator@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz#f481ff70a548f6124d0312c3aa14cbfa7aa542ad"
+  integrity sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==
   dependencies:
-    date-format "^4.0.6"
-    debug "^4.3.4"
-    fs-extra "^10.0.1"
+    es-errors "^1.3.0"
+    internal-slot "^1.1.0"
 
-string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.2, string-width@^4.2.3:
+strict-event-emitter@^0.5.1:
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/strict-event-emitter/-/strict-event-emitter-0.5.1.tgz#1602ece81c51574ca39c6815e09f1a3e8550bd93"
+  integrity sha512-vMgjE/GGEPEFnhFub6pa4FmJBRBVOLpIII2hvCZ8Kzb7K0hlHo7mQv6xYrBvCL2LtAIBwFUK8wvuJgTVSQ5MFQ==
+
+"string-width-cjs@npm:string-width@^4.2.0":
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -8545,48 +7385,55 @@ string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.2, string-width@^4.2
     is-fullwidth-code-point "^3.0.0"
     strip-ansi "^6.0.1"
 
-string-width@^4.2.0:
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.0.tgz#952182c46cc7b2c313d1596e623992bd163b72b5"
-  integrity sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==
+string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2, string-width@^4.2.3:
+  version "4.2.3"
+  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
+  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
   dependencies:
     emoji-regex "^8.0.0"
     is-fullwidth-code-point "^3.0.0"
-    strip-ansi "^6.0.0"
+    strip-ansi "^6.0.1"
 
-string.prototype.trimend@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.4.tgz#e75ae90c2942c63504686c18b287b4a0b1a45f80"
-  integrity sha512-y9xCjw1P23Awk8EvTpcyL2NIr1j7wJ39f+k6lvRnSMz+mz9CGz9NYPelDk42kOz6+ql8xjfK8oYzy3jAP5QU5A==
+string-width@^5.0.1, string-width@^5.1.2:
+  version "5.1.2"
+  resolved "https://registry.yarnpkg.com/string-width/-/string-width-5.1.2.tgz#14f8daec6d81e7221d2a357e668cab73bdbca794"
+  integrity sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.3"
+    eastasianwidth "^0.2.0"
+    emoji-regex "^9.2.2"
+    strip-ansi "^7.0.1"
 
-string.prototype.trimend@^1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.6.tgz#c4a27fa026d979d79c04f17397f250a462944533"
-  integrity sha512-JySq+4mrPf9EsDBEDYMOb/lM7XQLulwg5R/m1r0PXEFqrV0qHvl58sdTilSXtKOflCsK2E8jxf+GKC0T07RWwQ==
+string.prototype.trim@^1.2.10:
+  version "1.2.10"
+  resolved "https://registry.yarnpkg.com/string.prototype.trim/-/string.prototype.trim-1.2.10.tgz#40b2dd5ee94c959b4dcfb1d65ce72e90da480c81"
+  integrity sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    es-abstract "^1.20.4"
+    call-bind "^1.0.8"
+    call-bound "^1.0.2"
+    define-data-property "^1.1.4"
+    define-properties "^1.2.1"
+    es-abstract "^1.23.5"
+    es-object-atoms "^1.0.0"
+    has-property-descriptors "^1.0.2"
 
-string.prototype.trimstart@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.4.tgz#b36399af4ab2999b4c9c648bd7a3fb2bb26feeed"
-  integrity sha512-jh6e984OBfvxS50tdY2nRZnoC5/mLFKOREQfw8t5yytkoUsJRNxvI/E39qu1sD0OtWI3OC0XgKSmcWwziwYuZw==
+string.prototype.trimend@^1.0.9:
+  version "1.0.9"
+  resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.9.tgz#62e2731272cd285041b36596054e9f66569b6942"
+  integrity sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.3"
+    call-bind "^1.0.8"
+    call-bound "^1.0.2"
+    define-properties "^1.2.1"
+    es-object-atoms "^1.0.0"
 
-string.prototype.trimstart@^1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.6.tgz#e90ab66aa8e4007d92ef591bbf3cd422c56bdcf4"
-  integrity sha512-omqjMDaY92pbn5HOX7f9IccLA+U1tA9GvtU4JrodiXFfYB7jPzzHpRzpglLAjtUV6bB557zwClJezTqnAiYnQA==
+string.prototype.trimstart@^1.0.8:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz#7ee834dda8c7c17eff3118472bb35bfedaa34dde"
+  integrity sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==
   dependencies:
-    call-bind "^1.0.2"
-    define-properties "^1.1.4"
-    es-abstract "^1.20.4"
+    call-bind "^1.0.7"
+    define-properties "^1.2.1"
+    es-object-atoms "^1.0.0"
 
 string_decoder@^1.1.1:
   version "1.3.0"
@@ -8598,9 +7445,17 @@ string_decoder@^1.1.1:
 string_decoder@~1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8"
+  integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==
   dependencies:
     safe-buffer "~5.1.0"
 
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
+  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
+  dependencies:
+    ansi-regex "^5.0.1"
+
 strip-ansi@5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-5.2.0.tgz#8c9a536feb6afc962bdfa5b104a5091c1ad9c0ae"
@@ -8608,205 +7463,165 @@ strip-ansi@5.2.0:
   dependencies:
     ansi-regex "^4.1.0"
 
-strip-ansi@6.0.1, strip-ansi@^6.0.1:
+strip-ansi@6.0.1, strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
   integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
   dependencies:
     ansi-regex "^5.0.1"
 
-strip-ansi@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-3.0.1.tgz#6a385fb8853d952d5ff05d0e8aaf94278dc63dcf"
+strip-ansi@^7.0.1:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-7.1.0.tgz#d5b6568ca689d8561370b0707685d22434faff45"
+  integrity sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==
   dependencies:
-    ansi-regex "^2.0.0"
-
-strip-ansi@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-4.0.0.tgz#a8479022eb1ac368a871389b635262c505ee368f"
-  dependencies:
-    ansi-regex "^3.0.0"
-
-strip-ansi@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.0.tgz#0b1571dd7669ccd4f3e06e14ef1eed26225ae532"
-  integrity sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==
-  dependencies:
-    ansi-regex "^5.0.0"
+    ansi-regex "^6.0.1"
 
 strip-bom@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
+  integrity sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==
 
-strip-indent@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-3.0.0.tgz#c32e1cee940b6b3432c771bc2c54bcce73cd3001"
-  integrity sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==
-  dependencies:
-    min-indent "^1.0.0"
+strip-final-newline@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-2.0.0.tgz#89b852fb2fcbe936f6f4b3187afb0a12c1ab58ad"
+  integrity sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==
 
-strip-json-comments@3.1.1, strip-json-comments@^3.1.0, strip-json-comments@^3.1.1:
+strip-json-comments@3.1.1, strip-json-comments@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
   integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
 
-style-search@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/style-search/-/style-search-0.1.0.tgz#7958c793e47e32e07d2b5cafe5c0bf8e12e77902"
-  integrity sha1-eVjHk+R+MuB9K1yv5cC/jhLneQI=
-
-stylehacks@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-5.1.0.tgz#a40066490ca0caca04e96c6b02153ddc39913520"
-  integrity sha512-SzLmvHQTrIWfSgljkQCw2++C9+Ne91d/6Sp92I8c5uHTcy/PgeHamwITIbBW9wnFTY/3ZfSXR9HIL6Ikqmcu6Q==
-  dependencies:
-    browserslist "^4.16.6"
-    postcss-selector-parser "^6.0.4"
-
 stylelint-config-html@>=1.0.0, stylelint-config-html@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/stylelint-config-html/-/stylelint-config-html-1.1.0.tgz#999db19aea713b7ff6dde92ada76e4c1bd812b66"
   integrity sha512-IZv4IVESjKLumUGi+HWeb7skgO6/g4VMuAYrJdlqQFndgbj6WJAXPhaysvBiXefX79upBdQVumgYcdd17gCpjQ==
 
-stylelint-config-recommended-scss@^8.0.0:
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-8.0.0.tgz#1c1e93e619fe2275d4c1067928d92e0614f7d64f"
-  integrity sha512-BxjxEzRaZoQb7Iinc3p92GS6zRdRAkIuEu2ZFLTxJK2e1AIcCb5B5MXY9KOXdGTnYFZ+KKx6R4Fv9zU6CtMYPQ==
+stylelint-config-recommended-scss@^14.0.0:
+  version "14.1.0"
+  resolved "https://registry.yarnpkg.com/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.1.0.tgz#1a5855655cddcb5f77c10f38c76567adf2bb9aa3"
+  integrity sha512-bhaMhh1u5dQqSsf6ri2GVWWQW5iUjBYgcHkh7SgDDn92ijoItC/cfO/W+fpXshgTQWhwFkP1rVcewcv4jaftRg==
   dependencies:
-    postcss-scss "^4.0.2"
-    stylelint-config-recommended "^9.0.0"
-    stylelint-scss "^4.0.0"
+    postcss-scss "^4.0.9"
+    stylelint-config-recommended "^14.0.1"
+    stylelint-scss "^6.4.0"
 
-stylelint-config-recommended-vue@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/stylelint-config-recommended-vue/-/stylelint-config-recommended-vue-1.4.0.tgz#0a182da17dc9e846e4bec65a7676ccf882b35964"
-  integrity sha512-DVJqyX2KvMCn9U0+keL12r7xlsH26K4Vg8NrIZuq5MoF7g82DpMp326Om4E0Q+Il1o+bTHuUyejf2XAI0iD04Q==
+stylelint-config-recommended-vue@^1.6.0:
+  version "1.6.1"
+  resolved "https://registry.yarnpkg.com/stylelint-config-recommended-vue/-/stylelint-config-recommended-vue-1.6.1.tgz#6a93082ce4a5c1f64793b789175a833c57ce8309"
+  integrity sha512-lLW7hTIMBiTfjenGuDq2kyHA6fBWd/+Df7MO4/AWOxiFeXP9clbpKgg27kHfwA3H7UNMGC7aeP3mNlZB5LMmEQ==
   dependencies:
     semver "^7.3.5"
     stylelint-config-html ">=1.0.0"
     stylelint-config-recommended ">=6.0.0"
 
-stylelint-config-recommended@>=6.0.0, stylelint-config-recommended@^9.0.0:
-  version "9.0.0"
-  resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-9.0.0.tgz#1c9e07536a8cd875405f8ecef7314916d94e7e40"
-  integrity sha512-9YQSrJq4NvvRuTbzDsWX3rrFOzOlYBmZP+o513BJN/yfEmGSr0AxdvrWs0P/ilSpVV/wisamAHu5XSk8Rcf4CQ==
+stylelint-config-recommended@>=6.0.0, stylelint-config-recommended@^16.0.0:
+  version "16.0.0"
+  resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-16.0.0.tgz#0221f19902816fe7d53d9a01eb0be4cc7b4fe80a"
+  integrity sha512-4RSmPjQegF34wNcK1e1O3Uz91HN8P1aFdFzio90wNK9mjgAI19u5vsU868cVZboKzCaa5XbpvtTzAAGQAxpcXA==
 
-stylelint-config-standard@29.0.0:
-  version "29.0.0"
-  resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-29.0.0.tgz#4cc0e0f05512a39bb8b8e97853247d3a95d66fa2"
-  integrity sha512-uy8tZLbfq6ZrXy4JKu3W+7lYLgRQBxYTUUB88vPgQ+ZzAxdrvcaSUW9hOMNLYBnwH+9Kkj19M2DHdZ4gKwI7tg==
-  dependencies:
-    stylelint-config-recommended "^9.0.0"
+stylelint-config-recommended@^14.0.1:
+  version "14.0.1"
+  resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-14.0.1.tgz#d25e86409aaf79ee6c6085c2c14b33c7e23c90c6"
+  integrity sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg==
 
-stylelint-rscss@0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/stylelint-rscss/-/stylelint-rscss-0.4.0.tgz#ea77c478e1c703dbda878c00f53bbc002b2d07b7"
-  integrity sha1-6nfEeOHHA9vah4wA9Tu8ACstB7c=
+stylelint-config-standard@38.0.0:
+  version "38.0.0"
+  resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-38.0.0.tgz#9d673ec1f35d7569476ee4b0582e7dd5faebf036"
+  integrity sha512-uj3JIX+dpFseqd/DJx8Gy3PcRAJhlEZ2IrlFOc4LUxBX/PNMEQ198x7LCOE2Q5oT9Vw8nyc4CIL78xSqPr6iag==
   dependencies:
-    postcss-resolve-nested-selector "0.1.1"
-    postcss-selector-parser "2.2.1"
+    stylelint-config-recommended "^16.0.0"
 
-stylelint-scss@^4.0.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-4.3.0.tgz#638800faf823db11fff60d537c81051fe74c90fa"
-  integrity sha512-GvSaKCA3tipzZHoz+nNO7S02ZqOsdBzMiCx9poSmLlb3tdJlGddEX/8QzCOD8O7GQan9bjsvLMsO5xiw6IhhIQ==
+stylelint-scss@^6.4.0:
+  version "6.11.1"
+  resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-6.11.1.tgz#03860aab250112825b2deb77ca7ff1e2ba3a5414"
+  integrity sha512-e4rYo0UY+BIMtGeGanghrvHTjcryxgZbyFxUedp8dLFqC4P70aawNdYjRrQxbnKhu3BNr4+lt5e/53tcKXiwFA==
   dependencies:
-    lodash "^4.17.21"
+    css-tree "^3.0.1"
+    is-plain-object "^5.0.0"
+    known-css-properties "^0.35.0"
+    mdn-data "^2.15.0"
     postcss-media-query-parser "^0.2.3"
-    postcss-resolve-nested-selector "^0.1.1"
-    postcss-selector-parser "^6.0.6"
-    postcss-value-parser "^4.1.0"
+    postcss-resolve-nested-selector "^0.1.6"
+    postcss-selector-parser "^7.1.0"
+    postcss-value-parser "^4.2.0"
 
-stylelint-webpack-plugin@^3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/stylelint-webpack-plugin/-/stylelint-webpack-plugin-3.3.0.tgz#3ba40e2b2b2b7d1802fa53618e01fc28bc21ffb3"
-  integrity sha512-F53bapIZ9zI16ero8IWm6TrUE6SSibZBphJE9b5rR2FxtvmGmm1YmS+a5xjQzn63+cv71GVSCu4byX66fBLpEw==
+stylelint@16.25.0:
+  version "16.25.0"
+  resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-16.25.0.tgz#c3d602974f2a18fa57fadc9f3f40129b098fe4dc"
+  integrity sha512-Li0avYWV4nfv1zPbdnxLYBGq4z8DVZxbRgx4Kn6V+Uftz1rMoF1qiEI3oL4kgWqyYgCgs7gT5maHNZ82Gk03vQ==
   dependencies:
-    globby "^11.1.0"
-    jest-worker "^28.1.0"
-    micromatch "^4.0.5"
-    normalize-path "^3.0.0"
-    schema-utils "^4.0.0"
-
-stylelint@14.16.1:
-  version "14.16.1"
-  resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-14.16.1.tgz#b911063530619a1bbe44c2b875fd8181ebdc742d"
-  integrity sha512-ErlzR/T3hhbV+a925/gbfc3f3Fep9/bnspMiJPorfGEmcBbXdS+oo6LrVtoUZ/w9fqD6o6k7PtUlCOsCRdjX/A==
-  dependencies:
-    "@csstools/selector-specificity" "^2.0.2"
+    "@csstools/css-parser-algorithms" "^3.0.5"
+    "@csstools/css-tokenizer" "^3.0.4"
+    "@csstools/media-query-list-parser" "^4.0.3"
+    "@csstools/selector-specificity" "^5.0.0"
+    "@dual-bundle/import-meta-resolve" "^4.2.1"
     balanced-match "^2.0.0"
     colord "^2.9.3"
-    cosmiconfig "^7.1.0"
-    css-functions-list "^3.1.0"
-    debug "^4.3.4"
-    fast-glob "^3.2.12"
+    cosmiconfig "^9.0.0"
+    css-functions-list "^3.2.3"
+    css-tree "^3.1.0"
+    debug "^4.4.3"
+    fast-glob "^3.3.3"
     fastest-levenshtein "^1.0.16"
-    file-entry-cache "^6.0.1"
+    file-entry-cache "^10.1.4"
     global-modules "^2.0.0"
     globby "^11.1.0"
     globjoin "^0.1.4"
-    html-tags "^3.2.0"
-    ignore "^5.2.1"
-    import-lazy "^4.0.0"
+    html-tags "^3.3.1"
+    ignore "^7.0.5"
     imurmurhash "^0.1.4"
     is-plain-object "^5.0.0"
-    known-css-properties "^0.26.0"
+    known-css-properties "^0.37.0"
     mathml-tag-names "^2.1.3"
-    meow "^9.0.0"
-    micromatch "^4.0.5"
+    meow "^13.2.0"
+    micromatch "^4.0.8"
     normalize-path "^3.0.0"
-    picocolors "^1.0.0"
-    postcss "^8.4.19"
-    postcss-media-query-parser "^0.2.3"
-    postcss-resolve-nested-selector "^0.1.1"
-    postcss-safe-parser "^6.0.0"
-    postcss-selector-parser "^6.0.11"
+    picocolors "^1.1.1"
+    postcss "^8.5.6"
+    postcss-resolve-nested-selector "^0.1.6"
+    postcss-safe-parser "^7.0.1"
+    postcss-selector-parser "^7.1.0"
     postcss-value-parser "^4.2.0"
     resolve-from "^5.0.0"
     string-width "^4.2.3"
-    strip-ansi "^6.0.1"
-    style-search "^0.1.0"
-    supports-hyperlinks "^2.3.0"
+    supports-hyperlinks "^3.2.0"
     svg-tags "^1.0.0"
-    table "^6.8.1"
-    v8-compile-cache "^2.3.0"
-    write-file-atomic "^4.0.2"
+    table "^6.9.0"
+    write-file-atomic "^5.0.1"
 
-supports-color@8.1.1, supports-color@^8.0.0:
+superjson@^2.2.2:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/superjson/-/superjson-2.2.2.tgz#9d52bf0bf6b5751a3c3472f1292e714782ba3173"
+  integrity sha512-5JRxVqC8I8NuOUjzBbvVJAKNM8qoVuH0O77h4WInc/qC2q5IreqKxYwgkga3PfA22OayK2ikceb/B26dztPl+Q==
+  dependencies:
+    copy-anything "^3.0.2"
+
+supports-color@8.1.1:
   version "8.1.1"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-8.1.1.tgz#cd6fc17e28500cff56c1b86c0a7fd4a54a73005c"
   integrity sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==
   dependencies:
     has-flag "^4.0.0"
 
-supports-color@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
-
 supports-color@^5.3.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
+  integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
   dependencies:
     has-flag "^3.0.0"
 
-supports-color@^7.0.0, supports-color@^7.2.0:
+supports-color@^7.0.0, supports-color@^7.1.0, supports-color@^7.2.0:
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da"
   integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==
   dependencies:
     has-flag "^4.0.0"
 
-supports-color@^7.1.0:
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.1.0.tgz#68e32591df73e25ad1c4b49108a2ec507962bfd1"
-  integrity sha512-oRSIpR8pxT1Wr2FquTNnGet79b3BWljqOuoW/h4oBhxJ/HUbX5nX6JSruTkvXDCFMwDPvsaTTbvMLKZWSy0R5g==
-  dependencies:
-    has-flag "^4.0.0"
-
-supports-hyperlinks@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/supports-hyperlinks/-/supports-hyperlinks-2.3.0.tgz#3943544347c1ff90b15effb03fc14ae45ec10624"
-  integrity sha512-RpsAZlpWcDwOPQA22aCH4J0t7L8JmAvsCxfOSEwm7cQs3LshN36QaTkwd70DnBOXDWGssw2eUoc8CaRWT0XunA==
+supports-hyperlinks@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/supports-hyperlinks/-/supports-hyperlinks-3.2.0.tgz#b8e485b179681dea496a1e7abdf8985bd3145461"
+  integrity sha512-zFObLMyZeEwzAoKCyu1B91U79K2t7ApXuQfo8OuxwXLDgcKxuwM+YvcbIhm6QWqz7mHUH1TVytR1PwVVjEuMig==
   dependencies:
     has-flag "^4.0.0"
     supports-color "^7.0.0"
@@ -8819,30 +7634,17 @@ supports-preserve-symlinks-flag@^1.0.0:
 svg-tags@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/svg-tags/-/svg-tags-1.0.0.tgz#58f71cee3bd519b59d4b2a843b6c7de64ac04764"
-  integrity sha1-WPcc7jvVGbWdSyqEO2x95krAR2Q=
-
-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"
+  integrity sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==
 
 symbol-tree@^3.2.4:
   version "3.2.4"
   resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2"
   integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
 
-table@^6.8.1:
-  version "6.8.1"
-  resolved "https://registry.yarnpkg.com/table/-/table-6.8.1.tgz#ea2b71359fe03b017a5fbc296204471158080bdf"
-  integrity sha512-Y4X9zqrCftUhMeH2EptSSERdVKt/nEdijTOacGD/97EKjhQ/Qs8RTlEGABSJNNN8lac9kheH+af7yAkEWlgneA==
+table@^6.9.0:
+  version "6.9.0"
+  resolved "https://registry.yarnpkg.com/table/-/table-6.9.0.tgz#50040afa6264141c7566b3b81d4d82c47a8668f5"
+  integrity sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==
   dependencies:
     ajv "^8.0.1"
     lodash.truncate "^4.4.2"
@@ -8850,53 +7652,72 @@ table@^6.8.1:
     string-width "^4.2.3"
     strip-ansi "^6.0.1"
 
-tapable@^2.0.0, tapable@^2.1.1, tapable@^2.2.0:
+tapable@^2.2.0:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.2.1.tgz#1967a73ef4060a82f12ab96af86d52fdb76eeca0"
   integrity sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==
 
-tcp-port-used@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/tcp-port-used/-/tcp-port-used-1.0.1.tgz#46061078e2d38c73979a2c2c12b5a674e6689d70"
+tar-stream@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-2.2.0.tgz#acad84c284136b060dc3faa64474aa9aebd77287"
+  integrity sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==
   dependencies:
-    debug "4.1.0"
-    is2 "2.0.1"
+    bl "^4.0.3"
+    end-of-stream "^1.4.1"
+    fs-constants "^1.0.0"
+    inherits "^2.0.3"
+    readable-stream "^3.1.1"
 
-terser-webpack-plugin@^5.1.3:
-  version "5.3.4"
-  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-5.3.4.tgz#f4d31e265883d20fda3ca9c0fc6a53f173ae62e3"
-  integrity sha512-SmnkUhBxLDcBfTIeaq+ZqJXLVEyXxSaNcCeSezECdKjfkMrTTnPvapBILylYwyEvHFZAn2cJ8dtiXel5XnfOfQ==
+tcp-port-used@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/tcp-port-used/-/tcp-port-used-1.0.2.tgz#9652b7436eb1f4cfae111c79b558a25769f6faea"
+  integrity sha512-l7ar8lLUD3XS1V2lfoJlCBaeoaWo/2xfYt81hM7VlvR4RrMVFqfmzfhLVk40hAb368uitje5gPtBRL1m/DGvLA==
   dependencies:
-    "@jridgewell/trace-mapping" "^0.3.14"
-    jest-worker "^27.4.5"
-    schema-utils "^3.1.1"
-    serialize-javascript "^6.0.0"
-    terser "^5.14.1"
+    debug "4.3.1"
+    is2 "^2.0.6"
 
-terser@^5.10.0, terser@^5.14.1:
-  version "5.14.2"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-5.14.2.tgz#9ac9f22b06994d736174f4091aa368db896f1c10"
-  integrity sha512-oL0rGeM/WFQCUd0y2QrWxYnq7tfSuKBiqTjRPWrRgB46WD/kiwHwF8T23z78H6Q6kGCuuHcPB+KULHRdxvVGQA==
-  dependencies:
-    "@jridgewell/source-map" "^0.3.2"
-    acorn "^8.5.0"
-    commander "^2.20.0"
-    source-map-support "~0.5.20"
-
-text-table@0.2.0, text-table@^0.2.0:
+text-table@0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
+  integrity sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==
 
-tmp@^0.2.1:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.2.1.tgz#8457fc3037dcf4719c251367a1af6500ee1ccf14"
-  integrity sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==
+tinybench@^2.9.0:
+  version "2.9.0"
+  resolved "https://registry.yarnpkg.com/tinybench/-/tinybench-2.9.0.tgz#103c9f8ba6d7237a47ab6dd1dcff77251863426b"
+  integrity sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==
+
+tinyexec@^0.3.2:
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/tinyexec/-/tinyexec-0.3.2.tgz#941794e657a85e496577995c6eef66f53f42b3d2"
+  integrity sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==
+
+tinyglobby@^0.2.13:
+  version "0.2.15"
+  resolved "https://registry.yarnpkg.com/tinyglobby/-/tinyglobby-0.2.15.tgz#e228dd1e638cea993d2fdb4fcd2d4602a79951c2"
+  integrity sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==
   dependencies:
-    rimraf "^3.0.0"
+    fdir "^6.5.0"
+    picomatch "^4.0.3"
 
-to-fast-properties@^2.0.0:
+tinypool@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/tinypool/-/tinypool-1.0.2.tgz#706193cc532f4c100f66aa00b01c42173d9051b2"
+  integrity sha512-al6n+QEANGFOMf/dmUMsuS5/r9B06uwlyNjZZql/zv8J7ybHCgoihBNORZCY2mzUuAnomQa2JdhyHKzZxPCrFA==
+
+tinyrainbow@^2.0.0:
   version "2.0.0"
-  resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
+  resolved "https://registry.yarnpkg.com/tinyrainbow/-/tinyrainbow-2.0.0.tgz#9509b2162436315e80e3eee0fcce4474d2444294"
+  integrity sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==
+
+tinyspy@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/tinyspy/-/tinyspy-3.0.2.tgz#86dd3cf3d737b15adcf17d7887c84a75201df20a"
+  integrity sha512-n1cw8k1k0x4pgA2+9XrOkFydTerNcJ1zWCO5Nn9scWHTD+5tp8dghT2x1uduQePZTZgd3Tupf+x9BxJjeJi77Q==
+
+tmp@^0.2.3:
+  version "0.2.3"
+  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.2.3.tgz#eb783cc22bc1e8bebd0671476d46ea4eb32a79ae"
+  integrity sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==
 
 to-regex-range@^5.0.1:
   version "5.0.1"
@@ -8910,42 +7731,49 @@ toidentifier@1.0.1:
   resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.1.tgz#3be34321a88a820ed1bd80dfaa33e479fbb8dd35"
   integrity sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==
 
-tough-cookie@^4.0.0:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.1.2.tgz#e53e84b85f24e0b65dd526f46628db6c85f6b874"
-  integrity sha512-G9fqXWoYFZgTc2z8Q5zaHy/vJMjm+WV0AkAeHxVCQiEB1b+dGvWzFW6QV07cY5jQ5gRkeid2qIkzkxUnmoQZUQ==
+totalist@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/totalist/-/totalist-3.0.1.tgz#ba3a3d600c915b1a97872348f79c127475f6acf8"
+  integrity sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==
+
+tough-cookie@^4.1.4:
+  version "4.1.4"
+  resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.1.4.tgz#945f1461b45b5a8c76821c33ea49c3ac192c1b36"
+  integrity sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==
   dependencies:
     psl "^1.1.33"
     punycode "^2.1.1"
     universalify "^0.2.0"
     url-parse "^1.5.3"
 
-tr46@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/tr46/-/tr46-3.0.0.tgz#555c4e297a950617e8eeddef633c87d4d9d6cbf9"
-  integrity sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==
+tr46@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/tr46/-/tr46-5.1.0.tgz#4a077922360ae807e172075ce5beb79b36e4a101"
+  integrity sha512-IUWnUK7ADYR5Sl1fZlO1INDUhVhatWl7BtJWsIhwJ0UAK7ilzzIa8uIqOO/aYVWHZPJkKbEL+362wrzoeRF7bw==
   dependencies:
-    punycode "^2.1.1"
+    punycode "^2.3.1"
 
-trim-newlines@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-3.0.0.tgz#79726304a6a898aa8373427298d54c2ee8b1cb30"
-  integrity sha512-C4+gOpvmxaSMKuEf9Qc134F1ZuOHVXKRbtEflf4NTtuuJDEIJ9p5PXsalL8SkeRw+qit1Mo+yuvMPAKwWg/1hA==
+ts-declaration-location@^1.0.6:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/ts-declaration-location/-/ts-declaration-location-1.0.7.tgz#d4068fe9975828b3b453b3ab112b4711d8267688"
+  integrity sha512-EDyGAwH1gO0Ausm9gV6T2nUvBgXT5kGoCMJPllOaooZ+4VvJiKBdZE7wK18N1deEowhcUptS+5GXZK8U/fvpwA==
+  dependencies:
+    picomatch "^4.0.2"
 
-tsconfig-paths@^3.14.1:
-  version "3.14.1"
-  resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz#ba0734599e8ea36c862798e920bcf163277b137a"
-  integrity sha512-fxDhWnFSLt3VuTwtvJt5fpwxBHg5AdKWMsgcPOOIilyjymcYVZoCQF8fvFRezCNfblEXmi+PcM1eYHeOAgXCOQ==
+tsconfig-paths@^3.15.0:
+  version "3.15.0"
+  resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz#5299ec605e55b1abb23ec939ef15edaf483070d4"
+  integrity sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==
   dependencies:
     "@types/json5" "^0.0.29"
-    json5 "^1.0.1"
+    json5 "^1.0.2"
     minimist "^1.2.6"
     strip-bom "^3.0.0"
 
-tslib@^2.0.3:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.4.0.tgz#7cecaa7f073ce680a05847aa77be941098f36dc3"
-  integrity sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==
+tslib@^2.0.1:
+  version "2.8.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f"
+  integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==
 
 type-check@^0.4.0, type-check@~0.4.0:
   version "0.4.0"
@@ -8954,88 +7782,109 @@ type-check@^0.4.0, type-check@~0.4.0:
   dependencies:
     prelude-ls "^1.2.1"
 
-type-check@~0.3.2:
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz#5884cab512cf1d355e3fb784f30804b2b520db72"
-  integrity sha512-ZCmOJdvOWDBYJlzAoFkC+Q0+bUyEOS1ltgp1MGU03fqHG+dbi9tBFU2Rd9QKiDZFAYrhPh2JUf7rZRIuHRKtOg==
-  dependencies:
-    prelude-ls "~1.1.2"
-
-type-detect@4.0.8, type-detect@^4.0.0, type-detect@^4.0.5, type-detect@^4.0.8:
+type-detect@4.0.8:
   version "4.0.8"
   resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"
+  integrity sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==
 
-type-fest@^0.18.0:
-  version "0.18.1"
-  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.18.1.tgz#db4bc151a4a2cf4eebf9add5db75508db6cc841f"
-  integrity sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw==
+type-detect@^4.0.0, type-detect@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.1.0.tgz#deb2453e8f08dcae7ae98c626b13dddb0155906c"
+  integrity sha512-Acylog8/luQ8L7il+geoSxhEkazvkslg7PSNKOX59mbB9cOveP5aq9h74Y7YU8yDpJwetzQQrfIwtf4Wp4LKcw==
 
 type-fest@^0.20.2:
   version "0.20.2"
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
   integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
 
-type-fest@^0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.6.0.tgz#8d2a2370d3df886eb5c90ada1c5bf6188acf838b"
-  integrity sha512-q+MB8nYR1KDLrgr4G5yemftpMC7/QLqVndBmEEdqzmNj5dcFOO4Oo8qlwZE3ULT3+Zim1F8Kq4cBnikNhlCMlg==
+type-fest@^0.21.3:
+  version "0.21.3"
+  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37"
+  integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
 
 type-fest@^0.7.1:
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.7.1.tgz#8dda65feaf03ed78f0a3f9678f1869147f7c5c48"
   integrity sha512-Ne2YiiGN8bmrmJJEuTWTLJR32nh/JdL1+PSicowtNb0WFpn59GK8/lfD61bVtzguz7b3PBt74nxpv/Pw5po5Rg==
 
-type-fest@^0.8.1:
-  version "0.8.1"
-  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
-  integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==
+type-fest@^4.26.1:
+  version "4.39.0"
+  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-4.39.0.tgz#c7758be50a83a5b879e7a59ea52421e9816b3928"
+  integrity sha512-w2IGJU1tIgcrepg9ZJ82d8UmItNQtOFJG0HCUE3SzMokKkTsruVDALl2fAdiEzJlfduoU+VyXJWIIUZ+6jV+nw==
 
-type-is@~1.6.18:
-  version "1.6.18"
-  resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.18.tgz#4e552cd05df09467dcbc4ef739de89f2cf37c131"
-  integrity sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==
+type-is@^2.0.0, type-is@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/type-is/-/type-is-2.0.1.tgz#64f6cf03f92fce4015c2b224793f6bdd4b068c97"
+  integrity sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw==
   dependencies:
-    media-typer "0.3.0"
-    mime-types "~2.1.24"
+    content-type "^1.0.5"
+    media-typer "^1.1.0"
+    mime-types "^3.0.0"
 
-typed-array-length@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/typed-array-length/-/typed-array-length-1.0.4.tgz#89d83785e5c4098bec72e08b319651f0eac9c1bb"
-  integrity sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==
+typed-array-buffer@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz#a72395450a4869ec033fd549371b47af3a2ee536"
+  integrity sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==
   dependencies:
-    call-bind "^1.0.2"
+    call-bound "^1.0.3"
+    es-errors "^1.3.0"
+    is-typed-array "^1.1.14"
+
+typed-array-byte-length@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz#8407a04f7d78684f3d252aa1a143d2b77b4160ce"
+  integrity sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==
+  dependencies:
+    call-bind "^1.0.8"
     for-each "^0.3.3"
-    is-typed-array "^1.1.9"
+    gopd "^1.2.0"
+    has-proto "^1.2.0"
+    is-typed-array "^1.1.14"
 
-ua-parser-js@^0.7.30:
-  version "0.7.31"
-  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.31.tgz#649a656b191dffab4f21d5e053e27ca17cbff5c6"
-  integrity sha512-qLK/Xe9E2uzmYI3qLeOmI0tEOt+TBBQyUIAh4aAgU05FVYzeZrKUdkAZfBNVGRaHVgV0TDkdEngJSw/SyQchkQ==
-
-unbox-primitive@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.1.tgz#085e215625ec3162574dc8859abee78a59b14471"
-  integrity sha512-tZU/3NqK3dA5gpE1KtyiJUrEB0lxnGkMFHptJ7q6ewdZ8s12QrODwNbhIJStmJkd1QDXa1NRA8aF2A1zk/Ypyw==
+typed-array-byte-offset@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz#ae3698b8ec91a8ab945016108aef00d5bff12355"
+  integrity sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==
   dependencies:
-    function-bind "^1.1.1"
-    has-bigints "^1.0.1"
-    has-symbols "^1.0.2"
-    which-boxed-primitive "^1.0.2"
+    available-typed-arrays "^1.0.7"
+    call-bind "^1.0.8"
+    for-each "^0.3.3"
+    gopd "^1.2.0"
+    has-proto "^1.2.0"
+    is-typed-array "^1.1.15"
+    reflect.getprototypeof "^1.0.9"
 
-unbox-primitive@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.2.tgz#29032021057d5e6cdbd08c5129c226dff8ed6f9e"
-  integrity sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==
+typed-array-length@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/typed-array-length/-/typed-array-length-1.0.7.tgz#ee4deff984b64be1e118b0de8c9c877d5ce73d3d"
+  integrity sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==
   dependencies:
-    call-bind "^1.0.2"
+    call-bind "^1.0.7"
+    for-each "^0.3.3"
+    gopd "^1.0.1"
+    is-typed-array "^1.1.13"
+    possible-typed-array-names "^1.0.0"
+    reflect.getprototypeof "^1.0.6"
+
+unbox-primitive@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.1.0.tgz#8d9d2c9edeea8460c7f35033a88867944934d1e2"
+  integrity sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==
+  dependencies:
+    call-bound "^1.0.3"
     has-bigints "^1.0.2"
-    has-symbols "^1.0.3"
-    which-boxed-primitive "^1.0.2"
+    has-symbols "^1.1.0"
+    which-boxed-primitive "^1.1.1"
+
+undici-types@~6.20.0:
+  version "6.20.0"
+  resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.20.0.tgz#8171bf22c1f588d1554d55bf204bc624af388433"
+  integrity sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==
 
 unicode-canonical-property-names-ecmascript@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz#301acdc525631670d39f6146e0e77ff6bbdebddc"
-  integrity sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz#cb3173fe47ca743e228216e4a3ddc4c84d628cc2"
+  integrity sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==
 
 unicode-match-property-ecmascript@^2.0.0:
   version "2.0.0"
@@ -9045,79 +7894,43 @@ unicode-match-property-ecmascript@^2.0.0:
     unicode-canonical-property-names-ecmascript "^2.0.0"
     unicode-property-aliases-ecmascript "^2.0.0"
 
-unicode-match-property-value-ecmascript@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.0.0.tgz#1a01aa57247c14c568b89775a54938788189a714"
-  integrity sha512-7Yhkc0Ye+t4PNYzOGKedDhXbYIBe1XEQYQxOPyhcXNMJ0WCABqqj6ckydd6pWRZTHV4GuCPKdBAUiMc60tsKVw==
-
 unicode-match-property-value-ecmascript@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.1.0.tgz#cb5fffdcd16a05124f5a4b0bf7c3770208acbbe0"
-  integrity sha512-qxkjQt6qjg/mYscYMC0XKRn3Rh0wFPlfxB0xkt9CfyTvpX1Ra0+rAmdX2QyAobptSEvuy4RtpPRui6XkV+8wjA==
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.2.0.tgz#a0401aee72714598f739b68b104e4fe3a0cb3c71"
+  integrity sha512-4IehN3V/+kkr5YeSSDDQG8QLqO26XpL2XP3GQtqwlT/QYSECAwFztxVHjlbh0+gjJ3XmNLS0zDsbgs9jWKExLg==
 
 unicode-property-aliases-ecmascript@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.0.0.tgz#0a36cb9a585c4f6abd51ad1deddb285c165297c8"
-  integrity sha512-5Zfuy9q/DFr4tfO7ZPeVXb1aPoeQSdeFMLpYuFebehDAhbuevLs5yxSZmIFN1tP5F9Wl4IpJrYojg85/zgyZHQ==
-
-uniq@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/uniq/-/uniq-1.0.1.tgz#b31c5ae8254844a3a8281541ce2b04b865a734ff"
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.1.0.tgz#43d41e3be698bd493ef911077c9b131f827e8ccd"
+  integrity sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==
 
 universalify@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.2.0.tgz#6451760566fa857534745ab1dde952d1b1761be0"
   integrity sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==
 
-universalify@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
-  integrity sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==
-
-unpipe@1.0.0, unpipe@~1.0.0:
+unpipe@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unpipe/-/unpipe-1.0.0.tgz#b2bf4ee8514aae6165b4817829d21b2ef49904ec"
+  integrity sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==
 
-untildify@^4.0.0:
+untildify@4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/untildify/-/untildify-4.0.0.tgz#2bc947b953652487e4600949fb091e3ae8cd919b"
   integrity sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==
 
-update-browserslist-db@^1.0.13:
-  version "1.0.13"
-  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz#3c5e4f5c083661bd38ef64b6328c26ed6c8248c4"
-  integrity sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==
+update-browserslist-db@^1.1.1, update-browserslist-db@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.1.3.tgz#348377dd245216f9e7060ff50b15a1b740b75420"
+  integrity sha512-UxhIZQ+QInVdunkDAaiazvvT/+fXL5Osr0JZlJulepYu6Jd7qJtDZjlur0emRlT71EN3ScPoE7gvsuIKKNavKw==
   dependencies:
-    escalade "^3.1.1"
-    picocolors "^1.0.0"
-
-update-browserslist-db@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.4.tgz#dbfc5a789caa26b1db8990796c2c8ebbce304824"
-  integrity sha512-jnmO2BEGUjsMOe/Fg9u0oczOe/ppIDZPebzccl1yDWGLFP16Pa1/RM5wEoKYPG2zstNcDuAStejyxsOuKINdGA==
-  dependencies:
-    escalade "^3.1.1"
-    picocolors "^1.0.0"
-
-update-browserslist-db@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.5.tgz#be06a5eedd62f107b7c19eb5bcefb194411abf38"
-  integrity sha512-dteFFpCyvuDdr9S/ff1ISkKt/9YZxKjI9WlRR99c180GaztJtRa/fn18FdxGVKVsnPY7/a/FDN68mcvUmP4U7Q==
-  dependencies:
-    escalade "^3.1.1"
-    picocolors "^1.0.0"
-
-update-browserslist-db@^1.0.9:
-  version "1.0.10"
-  resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz#0f54b876545726f17d00cd9a2561e6dade943ff3"
-  integrity sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ==
-  dependencies:
-    escalade "^3.1.1"
-    picocolors "^1.0.0"
+    escalade "^3.2.0"
+    picocolors "^1.1.1"
 
 uri-js@^4.2.2:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.2.2.tgz#94c540e1ff772956e2299507c010aea6c8838eb0"
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
+  integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==
   dependencies:
     punycode "^2.1.0"
 
@@ -9129,13 +7942,13 @@ url-parse@^1.5.3:
     querystringify "^2.1.1"
     requires-port "^1.0.0"
 
-url@0.11.0:
-  version "0.11.0"
-  resolved "https://registry.yarnpkg.com/url/-/url-0.11.0.tgz#3838e97cfc60521eb73c525a8e55bfdd9e2e28f1"
-  integrity sha512-kbailJa29QrtXnxgq+DdCEGlbTeYM2eJUxsz6vjZavrCYPMIFHMKQmSKYAIuUK2i7hgPm28a8piX5NTUtM/LKQ==
+url@0.11.4:
+  version "0.11.4"
+  resolved "https://registry.yarnpkg.com/url/-/url-0.11.4.tgz#adca77b3562d56b72746e76b330b7f27b6721f3c"
+  integrity sha512-oCwdVC7mTuWiPyjLUz/COz5TLk6wgp0RCsN+wHZ2Ekneac9w8uuV0njcbbie2ME+Vs+d6duwmYuR3HgQXs1fOg==
   dependencies:
-    punycode "1.3.2"
-    querystring "0.2.0"
+    punycode "^1.4.1"
+    qs "^6.12.3"
 
 utf8@3.0.0:
   version "3.0.0"
@@ -9145,80 +7958,121 @@ utf8@3.0.0:
 util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
+  integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==
 
-utila@~0.4:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/utila/-/utila-0.4.0.tgz#8a16a05d445657a3aea5eecc5b12a4fa5379772c"
-
-utils-merge@1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
+uuid@11.1.0:
+  version "11.1.0"
+  resolved "https://registry.yarnpkg.com/uuid/-/uuid-11.1.0.tgz#9549028be1753bb934fc96e2bca09bb4105ae912"
+  integrity sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==
 
 uuid@8.3.2:
   version "8.3.2"
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
   integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==
 
-uuid@^3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
-
-v8-compile-cache@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"
-  integrity sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==
-
-validate-npm-package-license@^3.0.1:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a"
-  dependencies:
-    spdx-correct "^3.0.0"
-    spdx-expression-parse "^3.0.0"
-
-vary@^1, vary@~1.1.2:
+vary@^1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
+  integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==
 
-void-elements@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-2.0.1.tgz#c066afb582bb1cb4128d60ea92392e94d5e9dbec"
+vite-node@3.1.3:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/vite-node/-/vite-node-3.1.3.tgz#d021ced40b5a057305eaea9ce62c610c33b60a48"
+  integrity sha512-uHV4plJ2IxCl4u1up1FQRrqclylKAogbtBfOTwcuJ28xFi+89PZ57BRh+naIRvH70HPwxy5QHYzg1OrEaC7AbA==
+  dependencies:
+    cac "^6.7.14"
+    debug "^4.4.0"
+    es-module-lexer "^1.7.0"
+    pathe "^2.0.3"
+    vite "^5.0.0 || ^6.0.0"
+
+vite-plugin-eslint2@^5.0.3:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/vite-plugin-eslint2/-/vite-plugin-eslint2-5.0.4.tgz#7276c9179742d3c19faa94f30f9eb5cb7ac04888"
+  integrity sha512-3Yc7K2R/RrONB9JtwEh2Y40YP3tQi/3UiNHrwcYDsDBKDKnEu7B8PwmXLm7piDFRbxcnTPvgrV2LZnBpKP8JUw==
+  dependencies:
+    "@rollup/pluginutils" "^5.2.0"
+    debug "^4.4.1"
+
+vite-plugin-stylelint@^6.0.0:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/vite-plugin-stylelint/-/vite-plugin-stylelint-6.0.2.tgz#8a44345dacb6710877cd841e0467811c6b90253d"
+  integrity sha512-whqm2m5rvfd4cYA+cpwZ3BROR/5enRGdRr65hxQNHYn6YFmP8M1xrVKEbLIEBSmmSZ7G7AEZWccS8X+UAksIXA==
+  dependencies:
+    "@rollup/pluginutils" "^5.2.0"
+    debug "^4.4.1"
+
+"vite@^5.0.0 || ^6.0.0", vite@^6.1.0:
+  version "6.3.6"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-6.3.6.tgz#69a976b64930750d40219fbc68c5200874d315c1"
+  integrity sha512-0msEVHJEScQbhkbVTb/4iHZdJ6SXp/AvxL2sjwYQFfBqleHtnCqv1J3sa9zbWz/6kW1m9Tfzn92vW+kZ1WV6QA==
+  dependencies:
+    esbuild "^0.25.0"
+    fdir "^6.4.4"
+    picomatch "^4.0.2"
+    postcss "^8.5.3"
+    rollup "^4.34.9"
+    tinyglobby "^0.2.13"
+  optionalDependencies:
+    fsevents "~2.3.3"
+
+vitest@^3.0.7:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/vitest/-/vitest-3.1.3.tgz#0b0b01932408cd3af61867f4468d28bd83406ffb"
+  integrity sha512-188iM4hAHQ0km23TN/adso1q5hhwKqUpv+Sd6p5sOuh6FhQnRNW3IsiIpvxqahtBabsJ2SLZgmGSpcYK4wQYJw==
+  dependencies:
+    "@vitest/expect" "3.1.3"
+    "@vitest/mocker" "3.1.3"
+    "@vitest/pretty-format" "^3.1.3"
+    "@vitest/runner" "3.1.3"
+    "@vitest/snapshot" "3.1.3"
+    "@vitest/spy" "3.1.3"
+    "@vitest/utils" "3.1.3"
+    chai "^5.2.0"
+    debug "^4.4.0"
+    expect-type "^1.2.1"
+    magic-string "^0.30.17"
+    pathe "^2.0.3"
+    std-env "^3.9.0"
+    tinybench "^2.9.0"
+    tinyexec "^0.3.2"
+    tinyglobby "^0.2.13"
+    tinypool "^1.0.2"
+    tinyrainbow "^2.0.0"
+    vite "^5.0.0 || ^6.0.0"
+    vite-node "3.1.3"
+    why-is-node-running "^2.3.0"
+
+vue-component-type-helpers@^2.0.0:
+  version "2.2.8"
+  resolved "https://registry.yarnpkg.com/vue-component-type-helpers/-/vue-component-type-helpers-2.2.8.tgz#66d25e4405a4bcc06a22aa4c01e35141343da580"
+  integrity sha512-4bjIsC284coDO9om4HPA62M7wfsTvcmZyzdfR0aUlFXqq4tXxM1APyXpNVxPC8QazKw9OhmZNHBVDA6ODaZsrA==
 
 vue-demi@^0.13.11:
   version "0.13.11"
   resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.13.11.tgz#7d90369bdae8974d87b1973564ad390182410d99"
   integrity sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==
 
-vue-eslint-parser@^9.0.1:
-  version "9.0.3"
-  resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-9.0.3.tgz#0c17a89e0932cc94fa6a79f0726697e13bfe3c96"
-  integrity sha512-yL+ZDb+9T0ELG4VIFo/2anAOz8SvBdlqEnQnvJ3M7Scq56DvtjY0VY88bByRZB0D4J0u8olBcfrXTVONXsh4og==
+vue-eslint-parser@10.2.0:
+  version "10.2.0"
+  resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-10.2.0.tgz#cb53f89b14c7f5bf6a95c9532e3b2961ab619d61"
+  integrity sha512-CydUvFOQKD928UzZhTp4pr2vWz1L+H99t7Pkln2QSPdvmURT0MoC4wUccfCnuEaihNsu9aYYyk+bep8rlfkUXw==
   dependencies:
-    debug "^4.3.4"
-    eslint-scope "^7.1.1"
-    eslint-visitor-keys "^3.3.0"
-    espree "^9.3.1"
-    esquery "^1.4.0"
-    lodash "^4.17.21"
-    semver "^7.3.6"
+    debug "^4.4.0"
+    eslint-scope "^8.2.0"
+    eslint-visitor-keys "^4.2.0"
+    espree "^10.3.0"
+    esquery "^1.6.0"
+    semver "^7.6.3"
 
-vue-i18n@9.2.2:
-  version "9.2.2"
-  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.2.2.tgz#aeb49d9424923c77e0d6441e3f21dafcecd0e666"
-  integrity sha512-yswpwtj89rTBhegUAv9Mu37LNznyu3NpyLQmozF3i1hYOhwpG8RjcjIFIIfnu+2MDZJGSZPXaKWvnQA71Yv9TQ==
+vue-i18n@11:
+  version "11.1.12"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-11.1.12.tgz#230b21d65dd89343ebd40d19c9e3cfb13db8c1fd"
+  integrity sha512-BnstPj3KLHLrsqbVU2UOrPmr0+Mv11bsUZG0PyCOzsawCivk8W00GMXHeVUWIDOgNaScCuZah47CZFE+Wnl8mw==
   dependencies:
-    "@intlify/core-base" "9.2.2"
-    "@intlify/shared" "9.2.2"
-    "@intlify/vue-devtools" "9.2.2"
-    "@vue/devtools-api" "^6.2.1"
-
-vue-loader@17.0.1:
-  version "17.0.1"
-  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-17.0.1.tgz#c0ee8875e0610a0c2d13ba9b4d50a9c8442e7a3a"
-  integrity sha512-/OOyugJnImKCkAKrAvdsWMuwoCqGxWT5USLsjohzWbMgOwpA5wQmzQiLMzZd7DjhIfunzAGIApTOgIylz/kwcg==
-  dependencies:
-    chalk "^4.1.0"
-    hash-sum "^2.0.0"
-    loader-utils "^2.0.0"
+    "@intlify/core-base" "11.1.12"
+    "@intlify/shared" "11.1.12"
+    "@vue/devtools-api" "^6.5.0"
 
 vue-observe-visibility@^2.0.0-alpha.1:
   version "2.0.0-alpha.1"
@@ -9230,28 +8084,12 @@ vue-resize@^2.0.0-alpha.1:
   resolved "https://registry.yarnpkg.com/vue-resize/-/vue-resize-2.0.0-alpha.1.tgz#43eeb79e74febe932b9b20c5c57e0ebc14e2df3a"
   integrity sha512-7+iqOueLU7uc9NrMfrzbG8hwMqchfVfSzpVlCMeJQe4pyibqyoifDNbKTZvwxZKDvGkB+PdFeKvnGZMoEb8esg==
 
-vue-router@4.1.6:
-  version "4.1.6"
-  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.1.6.tgz#b70303737e12b4814578d21d68d21618469375a1"
-  integrity sha512-DYWYwsG6xNPmLq/FmZn8Ip+qrhFEzA14EI12MsMgVxvHFDYvlr4NXpVF5hrRH1wVcDP8fGi5F4rxuJSl8/r+EQ==
+vue-router@4.5.1:
+  version "4.5.1"
+  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.5.1.tgz#47bffe2d3a5479d2886a9a244547a853aa0abf69"
+  integrity sha512-ogAF3P97NPm8fJsE4by9dwSYtDwXIY1nFY9T6DyQnGHd1E2Da94w9JIolpe42LJGIl0DwOHBi8TcRPlPGwbTtw==
   dependencies:
-    "@vue/devtools-api" "^6.4.5"
-
-vue-style-loader@4.1.3:
-  version "4.1.3"
-  resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.3.tgz#6d55863a51fa757ab24e89d9371465072aa7bc35"
-  integrity sha512-sFuh0xfbtpRlKfm39ss/ikqs9AbKCoXZBpHeVZ8Tx650o0k0q/YCM7FRvigtxpACezfq6af+a7JeqVTWvncqDg==
-  dependencies:
-    hash-sum "^1.0.2"
-    loader-utils "^1.0.2"
-
-vue-template-compiler@2.7.14:
-  version "2.7.14"
-  resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz#4545b7dfb88090744c1577ae5ac3f964e61634b1"
-  integrity sha512-zyA5Y3ArvVG0NacJDkkzJuPQDF8RFeRlzV2vLeSnhSpieO6LK2OVbdLPi5MPPs09Ii+gMO8nY4S3iKQxBxDmWQ==
-  dependencies:
-    de-indent "^1.0.2"
-    he "^1.2.0"
+    "@vue/devtools-api" "^6.6.4"
 
 vue-virtual-scroller@^2.0.0-beta.7:
   version "2.0.0-beta.8"
@@ -9262,16 +8100,16 @@ vue-virtual-scroller@^2.0.0-beta.7:
     vue-observe-visibility "^2.0.0-alpha.1"
     vue-resize "^2.0.0-alpha.1"
 
-vue@3.2.45:
-  version "3.2.45"
-  resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.45.tgz#94a116784447eb7dbd892167784619fef379b3c8"
-  integrity sha512-9Nx/Mg2b2xWlXykmCwiTUCWHbWIj53bnkizBxKai1g61f2Xit700A1ljowpTIM11e3uipOeiPcSqnmBg6gyiaA==
+vue@3.5.22:
+  version "3.5.22"
+  resolved "https://registry.yarnpkg.com/vue/-/vue-3.5.22.tgz#2b8ddb94ee4b640ef12fe7f6efe1cf16f3b582e7"
+  integrity sha512-toaZjQ3a/G/mYaLSbV+QsQhIdMo9x5rrqIpYRObsJ6T/J+RyCSFwN2LHNVH9v8uIcljDNa3QzPVdv3Y6b9hAJQ==
   dependencies:
-    "@vue/compiler-dom" "3.2.45"
-    "@vue/compiler-sfc" "3.2.45"
-    "@vue/runtime-dom" "3.2.45"
-    "@vue/server-renderer" "3.2.45"
-    "@vue/shared" "3.2.45"
+    "@vue/compiler-dom" "3.5.22"
+    "@vue/compiler-sfc" "3.5.22"
+    "@vue/runtime-dom" "3.5.22"
+    "@vue/server-renderer" "3.5.22"
+    "@vue/shared" "3.5.22"
 
 vuex@4.1.0:
   version "4.1.0"
@@ -9280,27 +8118,12 @@ vuex@4.1.0:
   dependencies:
     "@vue/devtools-api" "^6.0.0-beta.11"
 
-w3c-hr-time@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd"
-  integrity sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==
+w3c-xmlserializer@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz#f925ba26855158594d907313cedd1476c5967f6c"
+  integrity sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==
   dependencies:
-    browser-process-hrtime "^1.0.0"
-
-w3c-xmlserializer@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/w3c-xmlserializer/-/w3c-xmlserializer-3.0.0.tgz#06cdc3eefb7e4d0b20a560a5a3aeb0d2d9a65923"
-  integrity sha512-3WFqGEgSXIyGhOmAFtlicJNMjEps8b1MG31NCA0/vOF9+nKMUW1ckhi9cnNHmf88Rzw5V+dwIwsm2C7X8k9aQg==
-  dependencies:
-    xml-name-validator "^4.0.0"
-
-watchpack@^2.4.0:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-2.4.0.tgz#fa33032374962c78113f93c7f2fb4c54c9862a5d"
-  integrity sha512-Lcvm7MGST/4fup+ifyKi2hjyIAwcdI4HRgtvTpIUxBRhB+RFtUh8XtDOxUfctVCnhVi+QQj49i91OyvzkJl6cg==
-  dependencies:
-    glob-to-regexp "^0.4.1"
-    graceful-fs "^4.1.2"
+    xml-name-validator "^5.0.0"
 
 wcwidth@^1.0.1:
   version "1.0.1"
@@ -9314,161 +8137,105 @@ webidl-conversions@^7.0.0:
   resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-7.0.0.tgz#256b4e1882be7debbf01d05f0aa2039778ea080a"
   integrity sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==
 
-webpack-dev-middleware@3.7.3:
-  version "3.7.3"
-  resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-3.7.3.tgz#0639372b143262e2b84ab95d3b91a7597061c2c5"
-  integrity sha512-djelc/zGiz9nZj/U7PTBi2ViorGJXEWo/3ltkPbDyxCXhhEXkW0ce99falaok4TPj+AsxLiXJR0EBOb0zh9fKQ==
-  dependencies:
-    memory-fs "^0.4.1"
-    mime "^2.4.4"
-    mkdirp "^0.5.1"
-    range-parser "^1.2.1"
-    webpack-log "^2.0.0"
-
-webpack-hot-middleware@2.25.3:
-  version "2.25.3"
-  resolved "https://registry.yarnpkg.com/webpack-hot-middleware/-/webpack-hot-middleware-2.25.3.tgz#be343ce2848022cfd854dd82820cd730998c6794"
-  integrity sha512-IK/0WAHs7MTu1tzLTjio73LjS3Ov+VvBKQmE8WPlJutgG5zT6Urgq/BbAdRrHTRpyzK0dvAvFh1Qg98akxgZpA==
-  dependencies:
-    ansi-html-community "0.0.8"
-    html-entities "^2.1.0"
-    strip-ansi "^6.0.0"
-
-webpack-log@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/webpack-log/-/webpack-log-2.0.0.tgz#5b7928e0637593f119d32f6227c1e0ac31e1b47f"
-  dependencies:
-    ansi-colors "^3.0.0"
-    uuid "^3.3.2"
-
-webpack-merge@0.20.0:
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-0.20.0.tgz#e4b73429517181a287c59c8cafef5fc9eb1d9705"
-  integrity sha1-5Lc0KVFxgaKHxZyMr+9fyesdlwU=
-  dependencies:
-    lodash.find "^3.2.1"
-    lodash.isequal "^4.2.0"
-    lodash.isfunction "^3.0.8"
-    lodash.isplainobject "^3.2.0"
-    lodash.merge "^3.3.2"
-
-webpack-merge@^4.1.5:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-4.2.2.tgz#a27c52ea783d1398afd2087f547d7b9d2f43634d"
-  integrity sha512-TUE1UGoTX2Cd42j3krGYqObZbOD+xF7u28WB7tfUordytSjbWTIjK/8V0amkBfTYN4/pB/GIDlJZZ657BGG19g==
-  dependencies:
-    lodash "^4.17.15"
-
-webpack-sources@^3.2.3:
-  version "3.2.3"
-  resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-3.2.3.tgz#2d4daab8451fd4b240cc27055ff6a0c2ccea0cde"
-  integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==
-
-webpack@5.75.0:
-  version "5.75.0"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.75.0.tgz#1e440468647b2505860e94c9ff3e44d5b582c152"
-  integrity sha512-piaIaoVJlqMsPtX/+3KTTO6jfvrSYgauFVdt8cr9LTHKmcq/AMd4mhzsiP7ZF/PGRNPGA8336jldh9l2Kt2ogQ==
-  dependencies:
-    "@types/eslint-scope" "^3.7.3"
-    "@types/estree" "^0.0.51"
-    "@webassemblyjs/ast" "1.11.1"
-    "@webassemblyjs/wasm-edit" "1.11.1"
-    "@webassemblyjs/wasm-parser" "1.11.1"
-    acorn "^8.7.1"
-    acorn-import-assertions "^1.7.6"
-    browserslist "^4.14.5"
-    chrome-trace-event "^1.0.2"
-    enhanced-resolve "^5.10.0"
-    es-module-lexer "^0.9.0"
-    eslint-scope "5.1.1"
-    events "^3.2.0"
-    glob-to-regexp "^0.4.1"
-    graceful-fs "^4.2.9"
-    json-parse-even-better-errors "^2.3.1"
-    loader-runner "^4.2.0"
-    mime-types "^2.1.27"
-    neo-async "^2.6.2"
-    schema-utils "^3.1.0"
-    tapable "^2.1.1"
-    terser-webpack-plugin "^5.1.3"
-    watchpack "^2.4.0"
-    webpack-sources "^3.2.3"
-
-whatwg-encoding@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz#e7635f597fd87020858626805a2729fa7698ac53"
-  integrity sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==
+whatwg-encoding@^3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz#d0f4ef769905d426e1688f3e34381a99b60b76e5"
+  integrity sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==
   dependencies:
     iconv-lite "0.6.3"
 
-whatwg-mimetype@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz#5fa1a7623867ff1af6ca3dc72ad6b8a4208beba7"
-  integrity sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==
+whatwg-mimetype@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz#bc1bf94a985dc50388d54a9258ac405c3ca2fc0a"
+  integrity sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==
 
-whatwg-url@^10.0.0:
-  version "10.0.0"
-  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-10.0.0.tgz#37264f720b575b4a311bd4094ed8c760caaa05da"
-  integrity sha512-CLxxCmdUby142H5FZzn4D8ikO1cmypvXVQktsgosNy4a4BHrDHeciBBGZhb0bNoR5/MltoCatso+vFjjGx8t0w==
+whatwg-url@^14.0.0:
+  version "14.2.0"
+  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-14.2.0.tgz#4ee02d5d725155dae004f6ae95c73e7ef5d95663"
+  integrity sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==
   dependencies:
-    tr46 "^3.0.0"
+    tr46 "^5.1.0"
     webidl-conversions "^7.0.0"
 
-whatwg-url@^11.0.0:
-  version "11.0.0"
-  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-11.0.0.tgz#0a849eebb5faf2119b901bb76fd795c2848d4018"
-  integrity sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==
+which-boxed-primitive@^1.0.2, which-boxed-primitive@^1.1.0, which-boxed-primitive@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz#d76ec27df7fa165f18d5808374a5fe23c29b176e"
+  integrity sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==
   dependencies:
-    tr46 "^3.0.0"
-    webidl-conversions "^7.0.0"
+    is-bigint "^1.1.0"
+    is-boolean-object "^1.2.1"
+    is-number-object "^1.1.1"
+    is-string "^1.1.1"
+    is-symbol "^1.1.1"
 
-which-boxed-primitive@^1.0.2:
+which-builtin-type@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/which-builtin-type/-/which-builtin-type-1.2.1.tgz#89183da1b4907ab089a6b02029cc5d8d6574270e"
+  integrity sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==
+  dependencies:
+    call-bound "^1.0.2"
+    function.prototype.name "^1.1.6"
+    has-tostringtag "^1.0.2"
+    is-async-function "^2.0.0"
+    is-date-object "^1.1.0"
+    is-finalizationregistry "^1.1.0"
+    is-generator-function "^1.0.10"
+    is-regex "^1.2.1"
+    is-weakref "^1.0.2"
+    isarray "^2.0.5"
+    which-boxed-primitive "^1.1.0"
+    which-collection "^1.0.2"
+    which-typed-array "^1.1.16"
+
+which-collection@^1.0.1, which-collection@^1.0.2:
   version "1.0.2"
-  resolved "https://registry.yarnpkg.com/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz#13757bc89b209b049fe5d86430e21cf40a89a8e6"
-  integrity sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==
+  resolved "https://registry.yarnpkg.com/which-collection/-/which-collection-1.0.2.tgz#627ef76243920a107e7ce8e96191debe4b16c2a0"
+  integrity sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==
   dependencies:
-    is-bigint "^1.0.1"
-    is-boolean-object "^1.1.0"
-    is-number-object "^1.0.4"
-    is-string "^1.0.5"
-    is-symbol "^1.0.3"
+    is-map "^2.0.3"
+    is-set "^2.0.3"
+    is-weakmap "^2.0.2"
+    is-weakset "^2.0.3"
 
 which-module@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
-  integrity sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.1.tgz#776b1fe35d90aebe99e8ac15eb24093389a4a409"
+  integrity sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==
 
-which-typed-array@^1.1.9:
-  version "1.1.9"
-  resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.9.tgz#307cf898025848cf995e795e8423c7f337efbde6"
-  integrity sha512-w9c4xkx6mPidwp7180ckYWfMmvxpjlZuIudNtDf4N/tTAUB8VJbX25qZoAsrtGuYNnGw3pa0AXgbGKRB8/EceA==
+which-typed-array@^1.1.13, which-typed-array@^1.1.16, which-typed-array@^1.1.18, which-typed-array@^1.1.19:
+  version "1.1.19"
+  resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.19.tgz#df03842e870b6b88e117524a4b364b6fc689f956"
+  integrity sha512-rEvr90Bck4WZt9HHFC4DJMsjvu7x+r6bImz0/BrbWb7A2djJ8hnZMrWnHo9F8ssv0OMErasDhftrfROTyqSDrw==
   dependencies:
-    available-typed-arrays "^1.0.5"
-    call-bind "^1.0.2"
-    for-each "^0.3.3"
-    gopd "^1.0.1"
-    has-tostringtag "^1.0.0"
-    is-typed-array "^1.1.10"
+    available-typed-arrays "^1.0.7"
+    call-bind "^1.0.8"
+    call-bound "^1.0.4"
+    for-each "^0.3.5"
+    get-proto "^1.0.1"
+    gopd "^1.2.0"
+    has-tostringtag "^1.0.2"
 
-which@2.0.2, which@^2.0.1:
+which@^1.3.1:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
+  integrity sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==
+  dependencies:
+    isexe "^2.0.0"
+
+which@^2.0.1:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/which/-/which-2.0.2.tgz#7c6a8dd0a636a0327e10b59c9286eee93f3f51b1"
   integrity sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==
   dependencies:
     isexe "^2.0.0"
 
-which@^1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
+why-is-node-running@^2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/why-is-node-running/-/why-is-node-running-2.3.0.tgz#a3f69a97107f494b3cdc3bdddd883a7d65cebf04"
+  integrity sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==
   dependencies:
-    isexe "^2.0.0"
-
-which@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/which/-/which-3.0.1.tgz#89f1cd0c23f629a8105ffe69b8172791c87b4be1"
-  integrity sha512-XA1b62dzQzLfaEOSQFTCOd5KFf/1VSzZo7/7TUjnya6u0vGGKzU96UQBZTAThCb2j4/xjBAyii1OhRLJEivHvg==
-  dependencies:
-    isexe "^2.0.0"
+    siginfo "^2.0.0"
+    stackback "0.0.2"
 
 widest-line@^3.1.0:
   version "3.1.0"
@@ -9477,21 +8244,25 @@ widest-line@^3.1.0:
   dependencies:
     string-width "^4.0.0"
 
-word-wrap@^1.2.3, word-wrap@~1.2.3:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c"
-  integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==
-
-workerpool@6.2.0:
-  version "6.2.0"
-  resolved "https://registry.yarnpkg.com/workerpool/-/workerpool-6.2.0.tgz#827d93c9ba23ee2019c3ffaff5c27fccea289e8b"
-  integrity sha512-Rsk5qQHJ9eowMH28Jwhe8HEbmdYDX4lwoMWshiCXugjtHqMD9ZbiqSDLxcsfdqsETPzVUtX5s1Z5kStiIM6l4A==
+word-wrap@^1.2.5:
+  version "1.2.5"
+  resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.5.tgz#d2c45c6dd4fbce621a66f136cbe328afd0410b34"
+  integrity sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==
 
 workerpool@6.2.1:
   version "6.2.1"
   resolved "https://registry.yarnpkg.com/workerpool/-/workerpool-6.2.1.tgz#46fc150c17d826b86a008e5a4508656777e9c343"
   integrity sha512-ILEIE97kDZvF9Wb9f6h5aXK4swSlKGUcOEGiIYb2OOu/IrDU9iwj0fD//SsA6E5ibwJxpEvhullJY4Sl4GcpAw==
 
+"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
+  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
+  dependencies:
+    ansi-styles "^4.0.0"
+    string-width "^4.1.0"
+    strip-ansi "^6.0.0"
+
 wrap-ansi@^6.2.0:
   version "6.2.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-6.2.0.tgz#e9393ba07102e6c91a3b221478f0257cd2856e53"
@@ -9510,61 +8281,68 @@ wrap-ansi@^7.0.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
+wrap-ansi@^8.1.0:
+  version "8.1.0"
+  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"
+  integrity sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==
+  dependencies:
+    ansi-styles "^6.1.0"
+    string-width "^5.0.1"
+    strip-ansi "^7.0.1"
+
 wrappy@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
+  integrity sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==
 
-write-file-atomic@^4.0.2:
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-4.0.2.tgz#a9df01ae5b77858a027fd2e80768ee433555fcfd"
-  integrity sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==
+write-file-atomic@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-5.0.1.tgz#68df4717c55c6fa4281a7860b4c2ba0a6d2b11e7"
+  integrity sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==
   dependencies:
     imurmurhash "^0.1.4"
-    signal-exit "^3.0.7"
+    signal-exit "^4.0.1"
 
-ws@>=8.7.0:
-  version "8.8.1"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-8.8.1.tgz#5dbad0feb7ade8ecc99b830c1d77c913d4955ff0"
-  integrity sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA==
+ws@^8.18.0:
+  version "8.18.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-8.18.1.tgz#ea131d3784e1dfdff91adb0a4a116b127515e3cb"
+  integrity sha512-RKW2aJZMXeMxVpnZ6bck+RswznaxmzdULiBr6KY7XkTnW8uvt0iT9H5DkHUChXrc+uurzwa0rVI16n/Xzjdz1w==
 
-ws@^8.2.3:
-  version "8.11.0"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-8.11.0.tgz#6a0d36b8edfd9f96d8b25683db2f8d7de6e8e143"
-  integrity sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==
-
-ws@~8.17.1:
-  version "8.17.1"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-8.17.1.tgz#9293da530bb548febc95371d90f9c878727d919b"
-  integrity sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==
+ws@^8.18.1:
+  version "8.18.2"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-8.18.2.tgz#42738b2be57ced85f46154320aabb51ab003705a"
+  integrity sha512-DMricUmwGZUVr++AEAe2uiVM7UoO9MAVZMDu05UQOaUII0lp+zOzLLU4Xqh/JvTqklB1T4uELaaPBKyjE1r4fQ==
 
 xml-name-validator@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-4.0.0.tgz#79a006e2e63149a8600f15430f0a4725d1524835"
   integrity sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==
 
+xml-name-validator@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-5.0.0.tgz#82be9b957f7afdacf961e5980f1bf227c0bf7673"
+  integrity sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==
+
 xmlchars@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb"
   integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
 
 xtend@~4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
+  integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==
 
 y18n@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.0.tgz#95ef94f85ecc81d007c264e190a120f0a3c8566b"
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.3.tgz#b5f259c82cd6e336921efd7bfd8bf560de9eeedf"
+  integrity sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==
 
 y18n@^5.0.5:
   version "5.0.8"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-5.0.8.tgz#7f4934d0f7ca8c56f95314939ddcd2dd91ce1d55"
   integrity sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==
 
-yallist@^2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/yallist/-/yallist-2.1.2.tgz#1c11f9218f076089a47dd512f93c6699a6a81d52"
-  integrity sha512-ncTzHV7NvsQZkYe1DW7cbDLm0YpzHmZF5r/iyP3ZnQtMiJ+pjzisCiMNI+Sj+xQF5pXhSHxSB3uDbsBTzY/c2A==
-
 yallist@^3.0.2:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.1.1.tgz#dbb7daf9bfd8bac9ab45ebf602b8cbad0d5d08fd"
@@ -9575,20 +8353,6 @@ yallist@^4.0.0:
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
   integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
 
-yaml-eslint-parser@^0.3.2:
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/yaml-eslint-parser/-/yaml-eslint-parser-0.3.2.tgz#c7f5f3904f1c06ad55dc7131a731b018426b4898"
-  integrity sha512-32kYO6kJUuZzqte82t4M/gB6/+11WAuHiEnK7FreMo20xsCKPeFH5tDBU7iWxR7zeJpNnMXfJyXwne48D0hGrg==
-  dependencies:
-    eslint-visitor-keys "^1.3.0"
-    lodash "^4.17.20"
-    yaml "^1.10.0"
-
-yaml@^1.10.0, yaml@^1.10.2:
-  version "1.10.2"
-  resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
-  integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==
-
 yargs-parser@20.2.4:
   version "20.2.4"
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-20.2.4.tgz#b42890f14566796f85ae8e3a25290d205f154a54"
@@ -9602,11 +8366,16 @@ yargs-parser@^18.1.2:
     camelcase "^5.0.0"
     decamelize "^1.2.0"
 
-yargs-parser@^20.2.2, yargs-parser@^20.2.3:
+yargs-parser@^20.2.2:
   version "20.2.9"
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-20.2.9.tgz#2eb7dc3b0289718fc295f362753845c41a0c94ee"
   integrity sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==
 
+yargs-parser@^21.1.1:
+  version "21.1.1"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-21.1.1.tgz#9096bceebf990d21bb31fa9516e0ede294a77d35"
+  integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==
+
 yargs-unparser@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/yargs-unparser/-/yargs-unparser-2.0.0.tgz#f131f9226911ae5d9ad38c432fe809366c2325eb"
@@ -9617,7 +8386,7 @@ yargs-unparser@2.0.0:
     flat "^5.0.2"
     is-plain-obj "^2.1.0"
 
-yargs@16.2.0, yargs@^16.1.1:
+yargs@16.2.0:
   version "16.2.0"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-16.2.0.tgz#1c82bf0f6b6a66eafce7ef30e376f49a12477f66"
   integrity sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==
@@ -9647,10 +8416,23 @@ yargs@^15.3.1:
     y18n "^4.0.0"
     yargs-parser "^18.1.2"
 
+yargs@^17.7.2:
+  version "17.7.2"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-17.7.2.tgz#991df39aca675a192b816e1e0363f9d75d2aa269"
+  integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==
+  dependencies:
+    cliui "^8.0.1"
+    escalade "^3.1.1"
+    get-caller-file "^2.0.5"
+    require-directory "^2.1.1"
+    string-width "^4.2.3"
+    y18n "^5.0.5"
+    yargs-parser "^21.1.1"
+
 yauzl@^2.10.0:
   version "2.10.0"
   resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.10.0.tgz#c7eb17c93e112cb1086fa6d8e51fb0667b79a5f9"
-  integrity sha1-x+sXyT4RLLEIb6bY5R+wZnt5pfk=
+  integrity sha512-p4a9I6X6nu6IhoGmBqAcbJy1mlC4j27vEPZX9F4L4/vZT3Lyq1VkFHw/V/PUcB9Buo+DG3iHkT0x3Qya58zc3g==
   dependencies:
     buffer-crc32 "~0.2.3"
     fd-slicer "~1.1.0"
@@ -9660,7 +8442,16 @@ yocto-queue@^0.1.0:
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
 
-yocto-queue@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-1.0.0.tgz#7f816433fb2cbc511ec8bf7d263c3b58a1a3c251"
-  integrity sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==
+yoctocolors-cjs@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/yoctocolors-cjs/-/yoctocolors-cjs-2.1.2.tgz#f4b905a840a37506813a7acaa28febe97767a242"
+  integrity sha512-cYVsTjKl8b+FrnidjibDWskAv7UKOfcwaVZdp/it9n1s9fU3IkgDbhdIRKCW4JDsAlECJY0ytoVPT3sK6kideA==
+
+zip-stream@^4.1.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/zip-stream/-/zip-stream-4.1.1.tgz#1337fe974dbaffd2fa9a1ba09662a66932bd7135"
+  integrity sha512-9qv4rlDiopXg4E69k+vMHjNN63YFMe9sZMrdlvKnCjlCRWeCBswPPMPUfx+ipsAWq1LXHe70RcbaHdJJpS6hyQ==
+  dependencies:
+    archiver-utils "^3.0.4"
+    compress-commons "^4.1.2"
+    readable-stream "^3.6.0"