diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index e829eaa1fa..51cc6e8330 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -5,6 +5,7 @@ module.exports = {
     'eslint:recommended',
     'plugin:import/typescript',
     'plugin:compat/recommended',
+    'plugin:tailwindcss/recommended',
   ],
 
   env: {
@@ -61,6 +62,9 @@ module.exports = {
       'URL', // core-js
       'URLSearchParams', // core-js
     ],
+    tailwindcss: {
+      config: 'tailwind.config.cjs',
+    },
   },
 
   rules: {
@@ -235,18 +239,7 @@ module.exports = {
       },
     ],
     'import/newline-after-import': 'error',
-    'import/no-extraneous-dependencies': [
-      'error',
-      // {
-      //   devDependencies: [
-      //     'webpack/**',
-      //     'app/soapbox/test_setup.js',
-      //     'app/soapbox/test_helpers.js',
-      //     'app/**/__tests__/**',
-      //     'app/**/__mocks__/**',
-      //   ],
-      // },
-    ],
+    'import/no-extraneous-dependencies': 'error',
     'import/no-unresolved': 'error',
     'import/no-webpack-loader-syntax': 'error',
     'import/order': [
@@ -271,6 +264,9 @@ module.exports = {
     'promise/catch-or-return': 'error',
 
     'react-hooks/rules-of-hooks': 'error',
+
+    'tailwindcss/classnames-order': 'error',
+    'tailwindcss/migration-from-tailwind-2': 'error',
   },
   overrides: [
     {
diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index 36a3084eaf..f4b01b9420 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -149,9 +149,9 @@ pages:
 
 docker:
   stage: deploy
-  image: docker:20.10.23
+  image: docker:23.0.0
   services:
-    - docker:20.10.23-dind
+    - docker:23.0.0-dind
   tags:
     - dind
   # https://medium.com/devops-with-valentine/how-to-build-a-docker-image-and-push-it-to-the-gitlab-container-registry-from-a-gitlab-ci-pipeline-acac0d1f26df
diff --git a/.tool-versions b/.tool-versions
index efc600fbd2..ab43e6ab2e 100644
--- a/.tool-versions
+++ b/.tool-versions
@@ -1 +1 @@
-nodejs 18.13.0
+nodejs 18.14.0
diff --git a/app/soapbox/components/account-search.tsx b/app/soapbox/components/account-search.tsx
index c519b0243a..a3d7fd1a62 100644
--- a/app/soapbox/components/account-search.tsx
+++ b/app/soapbox/components/account-search.tsx
@@ -72,7 +72,7 @@ const AccountSearch: React.FC<IAccountSearch> = ({ onSelected, ...rest }) => {
         <div
           role='button'
           tabIndex={0}
-          className='absolute inset-y-0 right-0 px-3 flex items-center cursor-pointer'
+          className='absolute inset-y-0 right-0 flex cursor-pointer items-center px-3'
           onClick={handleClear}
         >
           <SvgIcon
diff --git a/app/soapbox/components/account.tsx b/app/soapbox/components/account.tsx
index e92569ebeb..2901433ec8 100644
--- a/app/soapbox/components/account.tsx
+++ b/app/soapbox/components/account.tsx
@@ -43,11 +43,11 @@ const InstanceFavicon: React.FC<IInstanceFavicon> = ({ account, disabled }) => {
 
   return (
     <button
-      className='w-4 h-4 flex-none focus:ring-primary-500 focus:ring-2 focus:ring-offset-2'
+      className='h-4 w-4 flex-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2'
       onClick={handleClick}
       disabled={disabled}
     >
-      <img src={account.favicon} alt='' title={account.domain} className='w-full max-h-full' />
+      <img src={account.favicon} alt='' title={account.domain} className='max-h-full w-full' />
     </button>
   );
 };
@@ -147,7 +147,7 @@ const Account = ({
           src={actionIcon}
           title={actionTitle}
           onClick={handleAction}
-          className='bg-transparent text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500'
+          className='bg-transparent text-gray-600 hover:text-gray-700 dark:text-gray-600 dark:hover:text-gray-500'
           iconClassName='w-4 h-4'
         />
       );
@@ -193,7 +193,7 @@ const Account = ({
   const LinkEl: any = withLinkToProfile ? Link : 'div';
 
   return (
-    <div data-testid='account' className='flex-shrink-0 group block w-full' ref={overflowRef}>
+    <div data-testid='account' className='group block w-full shrink-0' ref={overflowRef}>
       <HStack alignItems={actionAlignment} justifyContent='between'>
         <HStack alignItems={withAccountNote || note ? 'top' : 'center'} space={3}>
           <ProfilePopper
@@ -208,14 +208,14 @@ const Account = ({
               <Avatar src={account.avatar} size={avatarSize} />
               {emoji && (
                 <Emoji
-                  className='w-5 h-5 absolute -bottom-1.5 -right-1.5'
+                  className='absolute -bottom-1.5 -right-1.5 h-5 w-5'
                   emoji={emoji}
                 />
               )}
             </LinkEl>
           </ProfilePopper>
 
-          <div className='flex-grow'>
+          <div className='grow'>
             <ProfilePopper
               condition={showProfileHoverCard}
               wrapper={(children) => <HoverRefWrapper accountId={account.id} inline>{children}</HoverRefWrapper>}
diff --git a/app/soapbox/components/animated-number.tsx b/app/soapbox/components/animated-number.tsx
index 0f6908fdee..e7dd824624 100644
--- a/app/soapbox/components/animated-number.tsx
+++ b/app/soapbox/components/animated-number.tsx
@@ -50,7 +50,7 @@ const AnimatedNumber: React.FC<IAnimatedNumber> = ({ value, obfuscate }) => {
   return (
     <TransitionMotion styles={styles} willEnter={willEnter} willLeave={willLeave}>
       {items => (
-        <span className='inline-flex flex-col items-stretch relative overflow-hidden'>
+        <span className='relative inline-flex flex-col items-stretch overflow-hidden'>
           {items.map(({ key, data, style }) => (
             <span key={key} style={{ position: (direction * style.y) > 0 ? 'absolute' : 'static', transform: `translateY(${style.y * 100}%)` }}>{obfuscate ? obfuscatedCount(data) : <FormattedNumber value={data} />}</span>
           ))}
diff --git a/app/soapbox/components/announcements/emoji.tsx b/app/soapbox/components/announcements/emoji.tsx
index 64266639d5..3628227dfe 100644
--- a/app/soapbox/components/announcements/emoji.tsx
+++ b/app/soapbox/components/announcements/emoji.tsx
@@ -24,7 +24,7 @@ const Emoji: React.FC<IEmoji> = ({ emoji, emojiMap, hovered }) => {
     return (
       <img
         draggable='false'
-        className='emojione block m-0'
+        className='emojione m-0 block'
         alt={emoji}
         title={title}
         src={joinPublicPath(`packs/emoji/${filename}.svg`)}
@@ -37,7 +37,7 @@ const Emoji: React.FC<IEmoji> = ({ emoji, emojiMap, hovered }) => {
     return (
       <img
         draggable='false'
-        className='emojione block m-0'
+        className='emojione m-0 block'
         alt={shortCode}
         title={shortCode}
         src={filename as string}
diff --git a/app/soapbox/components/birthday-input.tsx b/app/soapbox/components/birthday-input.tsx
index b8e4d11ad4..3be57348ac 100644
--- a/app/soapbox/components/birthday-input.tsx
+++ b/app/soapbox/components/birthday-input.tsx
@@ -113,7 +113,7 @@ const BirthdayInput: React.FC<IBirthdayInput> = ({ value, onChange, required })
   const handleChange = (date: Date) => onChange(date ? new Date(date.getTime() - (date.getTimezoneOffset() * 60000)).toISOString().slice(0, 10) : '');
 
   return (
-    <div className='mt-1 relative rounded-md shadow-sm'>
+    <div className='relative mt-1 rounded-md shadow-sm'>
       <BundleContainer fetchComponent={DatePicker}>
         {Component => (<Component
           selected={selected}
diff --git a/app/soapbox/components/dropdown-menu.tsx b/app/soapbox/components/dropdown-menu.tsx
index 3cab63aeb5..a125b9565f 100644
--- a/app/soapbox/components/dropdown-menu.tsx
+++ b/app/soapbox/components/dropdown-menu.tsx
@@ -196,7 +196,7 @@ class DropdownMenu extends React.PureComponent<IDropdownMenu, IDropdownMenuState
           data-method={isLogout ? 'delete' : undefined}
           title={text}
         >
-          {icon && <SvgIcon src={icon} className='mr-3 rtl:ml-3 rtl:mr-0 h-5 w-5 flex-none' />}
+          {icon && <SvgIcon src={icon} className='mr-3 h-5 w-5 flex-none rtl:ml-3 rtl:mr-0' />}
 
           <span className='truncate'>{text}</span>
 
diff --git a/app/soapbox/components/error-boundary.tsx b/app/soapbox/components/error-boundary.tsx
index 87f6d749dd..3a6b4ac0be 100644
--- a/app/soapbox/components/error-boundary.tsx
+++ b/app/soapbox/components/error-boundary.tsx
@@ -113,17 +113,17 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
     const errorText = this.getErrorText();
 
     return (
-      <div className='h-screen pt-16 pb-12 flex flex-col bg-white dark:bg-primary-900'>
-        <main className='flex-grow flex flex-col justify-center max-w-7xl w-full mx-auto px-4 sm:px-6 lg:px-8'>
-          <div className='flex-shrink-0 flex justify-center'>
+      <div className='flex h-screen flex-col bg-white pt-16 pb-12 dark:bg-primary-900'>
+        <main className='mx-auto flex w-full max-w-7xl grow flex-col justify-center px-4 sm:px-6 lg:px-8'>
+          <div className='flex shrink-0 justify-center'>
             <a href='/' className='inline-flex'>
               <SiteLogo alt='Logo' className='h-12 w-auto cursor-pointer' />
             </a>
           </div>
 
           <div className='py-8'>
-            <div className='text-center max-w-xl mx-auto space-y-2'>
-              <h1 className='text-3xl font-extrabold text-gray-900 dark:text-gray-500 tracking-tight sm:text-4xl'>
+            <div className='mx-auto max-w-xl space-y-2 text-center'>
+              <h1 className='text-3xl font-extrabold tracking-tight text-gray-900 dark:text-gray-500 sm:text-4xl'>
                 <FormattedMessage id='alert.unexpected.message' defaultMessage='Something went wrong.' />
               </h1>
               <p className='text-lg text-gray-700 dark:text-gray-600'>
@@ -132,7 +132,7 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
                   defaultMessage="We're sorry for the interruption. If the problem persists, please reach out to our support team. You may also try to {clearCookies} (this will log you out)."
                   values={{
                     clearCookies: (
-                      <a href='/' onClick={this.clearCookies} className='text-primary-600 dark:text-accent-blue hover:underline'>
+                      <a href='/' onClick={this.clearCookies} className='text-primary-600 hover:underline dark:text-accent-blue'>
                         <FormattedMessage
                           id='alert.unexpected.clear_cookies'
                           defaultMessage='clear cookies and browser data'
@@ -150,7 +150,7 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
               </Text>
 
               <div className='mt-10'>
-                <a href='/' className='text-base font-medium text-primary-600 dark:text-accent-blue hover:underline'>
+                <a href='/' className='text-base font-medium text-primary-600 hover:underline dark:text-accent-blue'>
                   <FormattedMessage id='alert.unexpected.return_home' defaultMessage='Return Home' />
                   <span aria-hidden='true'> &rarr;</span>
                 </a>
@@ -158,11 +158,11 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
             </div>
 
             {!isProduction && (
-              <div className='py-16 max-w-lg mx-auto space-y-4'>
+              <div className='mx-auto max-w-lg space-y-4 py-16'>
                 {errorText && (
                   <textarea
                     ref={this.setTextareaRef}
-                    className='h-48 p-4 shadow-sm bg-gray-100 text-gray-900 dark:text-gray-100 dark:bg-gray-800 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 dark:border-gray-700 rounded-md font-mono'
+                    className='block h-48 w-full rounded-md border-gray-300 bg-gray-100 p-4 font-mono text-gray-900 shadow-sm focus:border-primary-500 focus:ring-2 focus:ring-primary-500 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100 sm:text-sm'
                     value={errorText}
                     onClick={this.handleCopy}
                     readOnly
@@ -180,11 +180,11 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
           </div>
         </main>
 
-        <footer className='flex-shrink-0 max-w-7xl w-full mx-auto px-4 sm:px-6 lg:px-8'>
+        <footer className='mx-auto w-full max-w-7xl shrink-0 px-4 sm:px-6 lg:px-8'>
           <HStack justifyContent='center' space={4} element='nav'>
             {links.get('status') && (
               <>
-                <a href={links.get('status')} className='text-sm font-medium text-gray-700 dark:text-gray-600 hover:underline'>
+                <a href={links.get('status')} className='text-sm font-medium text-gray-700 hover:underline dark:text-gray-600'>
                   <FormattedMessage id='alert.unexpected.links.status' defaultMessage='Status' />
                 </a>
               </>
@@ -193,7 +193,7 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
             {links.get('help') && (
               <>
                 <span className='inline-block border-l border-gray-300' aria-hidden='true' />
-                <a href={links.get('help')} className='text-sm font-medium text-gray-700 dark:text-gray-600 hover:underline'>
+                <a href={links.get('help')} className='text-sm font-medium text-gray-700 hover:underline dark:text-gray-600'>
                   <FormattedMessage id='alert.unexpected.links.help' defaultMessage='Help Center' />
                 </a>
               </>
@@ -202,7 +202,7 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
             {links.get('support') && (
               <>
                 <span className='inline-block border-l border-gray-300' aria-hidden='true' />
-                <a href={links.get('support')} className='text-sm font-medium text-gray-700 dark:text-gray-600 hover:underline'>
+                <a href={links.get('support')} className='text-sm font-medium text-gray-700 hover:underline dark:text-gray-600'>
                   <FormattedMessage id='alert.unexpected.links.support' defaultMessage='Support' />
                 </a>
               </>
diff --git a/app/soapbox/components/event-preview.tsx b/app/soapbox/components/event-preview.tsx
index 2bbcec24c9..e0585e01b2 100644
--- a/app/soapbox/components/event-preview.tsx
+++ b/app/soapbox/components/event-preview.tsx
@@ -55,7 +55,7 @@ const EventPreview: React.FC<IEventPreview> = ({ status, className, hideAction,
       <div className='absolute top-28 right-3'>
         {floatingAction && action}
       </div>
-      <div className='bg-primary-200 dark:bg-gray-600 h-40'>
+      <div className='h-40 bg-primary-200 dark:bg-gray-600'>
         {banner && <img className='h-full w-full object-cover' src={banner.url} alt={intl.formatMessage(messages.eventBanner)} />}
       </div>
       <Stack className='p-2.5' space={2}>
@@ -65,7 +65,7 @@ const EventPreview: React.FC<IEventPreview> = ({ status, className, hideAction,
           {!floatingAction && action}
         </HStack>
 
-        <div className='flex gap-y-1 gap-x-2 flex-wrap text-gray-700 dark:text-gray-600'>
+        <div className='flex flex-wrap gap-y-1 gap-x-2 text-gray-700 dark:text-gray-600'>
           <HStack alignItems='center' space={2}>
             <Icon src={require('@tabler/icons/user.svg')} />
             <HStack space={1} alignItems='center' grow>
diff --git a/app/soapbox/components/gdpr-banner.tsx b/app/soapbox/components/gdpr-banner.tsx
index 0c9ea85c88..a5a2f53f12 100644
--- a/app/soapbox/components/gdpr-banner.tsx
+++ b/app/soapbox/components/gdpr-banner.tsx
@@ -31,7 +31,7 @@ const GdprBanner: React.FC = () => {
 
   return (
     <Banner theme='opaque' className={classNames('transition-transform', { 'translate-y-full': slideout })}>
-      <div className='flex flex-col space-y-4 lg:space-y-0 lg:space-x-4 rtl:space-x-reverse lg:flex-row lg:items-center lg:justify-between'>
+      <div className='flex flex-col space-y-4 rtl:space-x-reverse lg:flex-row lg:items-center lg:justify-between lg:space-y-0 lg:space-x-4'>
         <Stack space={2}>
           <Text size='xl' weight='bold'>
             <FormattedMessage id='gdpr.title' defaultMessage='{siteTitle} uses cookies' values={{ siteTitle: instance.title }} />
diff --git a/app/soapbox/components/group-card.tsx b/app/soapbox/components/group-card.tsx
index faade0dc7f..15d8cf4971 100644
--- a/app/soapbox/components/group-card.tsx
+++ b/app/soapbox/components/group-card.tsx
@@ -18,9 +18,9 @@ const GroupCard: React.FC<IGroupCard> = ({ group }) => {
 
   return (
     <div className='overflow-hidden'>
-      <Stack className='bg-white dark:bg-primary-900 border border-solid border-gray-300 dark:border-primary-800 rounded-lg sm:rounded-xl'>
-        <div className='bg-primary-100 dark:bg-gray-800 h-[120px] relative -m-[1px] mb-0 rounded-t-lg sm:rounded-t-xl'>
-          {group.header && <img className='h-full w-full object-cover rounded-t-lg sm:rounded-t-xl' src={group.header} alt={intl.formatMessage(messages.groupHeader)} />}
+      <Stack className='rounded-lg border border-solid border-gray-300 bg-white dark:border-primary-800 dark:bg-primary-900 sm:rounded-xl'>
+        <div className='relative -m-[1px] mb-0 h-[120px] rounded-t-lg bg-primary-100 dark:bg-gray-800 sm:rounded-t-xl'>
+          {group.header && <img className='h-full w-full rounded-t-lg object-cover sm:rounded-t-xl' src={group.header} alt={intl.formatMessage(messages.groupHeader)} />}
           <div className='absolute left-1/2 bottom-0 -translate-x-1/2 translate-y-1/2'>
             <Avatar className='ring-2 ring-white dark:ring-primary-900' src={group.avatar} size={64} />
           </div>
diff --git a/app/soapbox/components/landing-gradient.tsx b/app/soapbox/components/landing-gradient.tsx
index f6dae6f617..1cef998439 100644
--- a/app/soapbox/components/landing-gradient.tsx
+++ b/app/soapbox/components/landing-gradient.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 
 /** Fullscreen gradient used as a backdrop to public pages. */
 const LandingGradient: React.FC = () => (
-  <div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-primary-900/50 via-white dark:via-primary-900 to-gradient-end/10 dark:to-primary-800/50' />
+  <div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 via-white to-gradient-end/10 dark:from-primary-900/50 dark:via-primary-900 dark:to-primary-800/50' />
 );
 
 export default LandingGradient;
diff --git a/app/soapbox/components/link.tsx b/app/soapbox/components/link.tsx
index 7455547e6b..51bb913003 100644
--- a/app/soapbox/components/link.tsx
+++ b/app/soapbox/components/link.tsx
@@ -4,7 +4,7 @@ import { Link as Comp, LinkProps } from 'react-router-dom';
 const Link = (props: LinkProps) => (
   <Comp
     {...props}
-    className='text-primary-600 dark:text-accent-blue hover:underline'
+    className='text-primary-600 hover:underline dark:text-accent-blue'
   />
 );
 
diff --git a/app/soapbox/components/loading-screen.tsx b/app/soapbox/components/loading-screen.tsx
index 991007ba81..3b86fd2e01 100644
--- a/app/soapbox/components/loading-screen.tsx
+++ b/app/soapbox/components/loading-screen.tsx
@@ -9,7 +9,7 @@ const LoadingScreen: React.FC = () => {
     <div className='fixed h-screen w-screen'>
       <LandingGradient />
 
-      <div className='fixed d-screen w-screen flex items-center justify-center z-10'>
+      <div className='d-screen fixed z-10 flex w-screen items-center justify-center'>
         <div className='p-4'>
           <Spinner size={40} withText={false} />
         </div>
diff --git a/app/soapbox/components/media-gallery.tsx b/app/soapbox/components/media-gallery.tsx
index 9b9d1fb7d7..3321ba1581 100644
--- a/app/soapbox/components/media-gallery.tsx
+++ b/app/soapbox/components/media-gallery.tsx
@@ -171,7 +171,7 @@ const Item: React.FC<IItem> = ({
         target='_blank'
       >
         <StillImage
-          className='w-full h-full'
+          className='h-full w-full'
           src={mediaPreview ? attachment.preview_url : attachment.url}
           alt={attachment.description}
           letterboxed={letterboxed}
diff --git a/app/soapbox/components/modal-root.tsx b/app/soapbox/components/modal-root.tsx
index 8abc27eac6..67f3fb32a6 100644
--- a/app/soapbox/components/modal-root.tsx
+++ b/app/soapbox/components/modal-root.tsx
@@ -241,7 +241,7 @@ const ModalRoot: React.FC<IModalRoot> = ({ children, onCancel, onClose, type })
       <div
         role='presentation'
         id='modal-overlay'
-        className='fixed inset-0 bg-gray-500/90 dark:bg-gray-700/90 backdrop-blur'
+        className='fixed inset-0 bg-gray-500/90 backdrop-blur dark:bg-gray-700/90'
         onClick={handleOnClose}
       />
 
diff --git a/app/soapbox/components/polls/poll-option.tsx b/app/soapbox/components/polls/poll-option.tsx
index f81be4f5b4..5c99e1186c 100644
--- a/app/soapbox/components/polls/poll-option.tsx
+++ b/app/soapbox/components/polls/poll-option.tsx
@@ -20,7 +20,7 @@ const PollPercentageBar: React.FC<{ percent: number, leading: boolean }> = ({ pe
     <Motion defaultStyle={{ width: 0 }} style={{ width: spring(percent, { ...presets.gentle, precision: 0.1 }) }}>
       {({ width }) => (
         <span
-          className='absolute inset-0 h-full inline-block bg-primary-100 dark:bg-primary-500 rounded-l-md'
+          className='absolute inset-0 inline-block h-full rounded-l-md bg-primary-100 dark:bg-primary-500'
           style={{ width: `${width}%` }}
         />
       )}
@@ -61,8 +61,8 @@ const PollOptionText: React.FC<IPollOptionText> = ({ poll, option, index, active
         onChange={handleOptionChange}
       />
 
-      <div className='grid items-center w-full'>
-        <div className='col-start-1 row-start-1 justify-self-center ml-4 mr-6'>
+      <div className='grid w-full items-center'>
+        <div className='col-start-1 row-start-1 ml-4 mr-6 justify-self-center'>
           <div className='text-primary-600 dark:text-white'>
             <Text
               theme='inherit'
@@ -72,7 +72,7 @@ const PollOptionText: React.FC<IPollOptionText> = ({ poll, option, index, active
           </div>
         </div>
 
-        <div className='col-start-1 row-start-1 justify-self-end flex items-center'>
+        <div className='col-start-1 row-start-1 flex items-center justify-self-end'>
           <span
             className={classNames('flex items-center justify-center w-6 h-6 flex-none border border-solid rounded-full', {
               'bg-primary-600 border-primary-600 dark:bg-primary-300 dark:border-primary-300': active,
@@ -85,7 +85,7 @@ const PollOptionText: React.FC<IPollOptionText> = ({ poll, option, index, active
             aria-label={option.title}
           >
             {active && (
-              <Icon src={require('@tabler/icons/check.svg')} className='text-white dark:text-primary-900 w-4 h-4' />
+              <Icon src={require('@tabler/icons/check.svg')} className='h-4 w-4 text-white dark:text-primary-900' />
             )}
           </span>
         </div>
@@ -123,7 +123,7 @@ const PollOption: React.FC<IPollOption> = (props): JSX.Element | null => {
           <HStack
             justifyContent='between'
             alignItems='center'
-            className='relative p-2 w-full bg-white dark:bg-primary-800 rounded-md overflow-hidden'
+            className='relative w-full overflow-hidden rounded-md bg-white p-2 dark:bg-primary-800'
           >
             <PollPercentageBar percent={percent} leading={leading} />
 
@@ -141,7 +141,7 @@ const PollOption: React.FC<IPollOption> = (props): JSX.Element | null => {
                 <Icon
                   src={require('@tabler/icons/circle-check.svg')}
                   alt={intl.formatMessage(messages.voted)}
-                  className='text-primary-600 dark:text-primary-800 dark:fill-white w-4 h-4'
+                  className='h-4 w-4 text-primary-600 dark:fill-white dark:text-primary-800'
                 />
               ) : (
                 <div className='svg-icon' />
diff --git a/app/soapbox/components/profile-hover-card.tsx b/app/soapbox/components/profile-hover-card.tsx
index 39d766f801..32e4ceb208 100644
--- a/app/soapbox/components/profile-hover-card.tsx
+++ b/app/soapbox/components/profile-hover-card.tsx
@@ -123,7 +123,7 @@ export const ProfileHoverCard: React.FC<IProfileHoverCard> = ({ visible = true }
               <HStack alignItems='center' space={0.5}>
                 <Icon
                   src={require('@tabler/icons/calendar.svg')}
-                  className='w-4 h-4 text-gray-800 dark:text-gray-200'
+                  className='h-4 w-4 text-gray-800 dark:text-gray-200'
                 />
 
                 <Text size='sm'>
diff --git a/app/soapbox/components/scroll-top-button.tsx b/app/soapbox/components/scroll-top-button.tsx
index 7bf03f66bc..7a0fb71de9 100644
--- a/app/soapbox/components/scroll-top-button.tsx
+++ b/app/soapbox/components/scroll-top-button.tsx
@@ -83,7 +83,7 @@ const ScrollTopButton: React.FC<IScrollTopButton> = ({
 
   return (
     <div className={classes}>
-      <a className='flex items-center bg-primary-600 hover:bg-primary-700 hover:scale-105 active:scale-100 transition-transform text-white rounded-full px-4 py-2 space-x-1.5 cursor-pointer whitespace-nowrap' onClick={handleClick}>
+      <a className='flex cursor-pointer items-center space-x-1.5 whitespace-nowrap rounded-full bg-primary-600 px-4 py-2 text-white transition-transform hover:scale-105 hover:bg-primary-700 active:scale-100' onClick={handleClick}>
         <Icon src={require('@tabler/icons/arrow-bar-to-up.svg')} />
 
         {(count > 0) && (
diff --git a/app/soapbox/components/sidebar-menu.tsx b/app/soapbox/components/sidebar-menu.tsx
index fc9942e124..51640d40e5 100644
--- a/app/soapbox/components/sidebar-menu.tsx
+++ b/app/soapbox/components/sidebar-menu.tsx
@@ -53,8 +53,8 @@ interface ISidebarLink {
 const SidebarLink: React.FC<ISidebarLink> = ({ href, to, icon, text, onClick }) => {
   const body = (
     <HStack space={2} alignItems='center'>
-      <div className='bg-primary-50 dark:bg-gray-800 relative rounded-full inline-flex p-2'>
-        <Icon src={icon} className='text-primary-500 h-5 w-5' />
+      <div className='relative inline-flex rounded-full bg-primary-50 p-2 dark:bg-gray-800'>
+        <Icon src={icon} className='h-5 w-5 text-primary-500' />
       </div>
 
       <Text tag='span' weight='medium' theme='inherit'>{text}</Text>
@@ -63,14 +63,14 @@ const SidebarLink: React.FC<ISidebarLink> = ({ href, to, icon, text, onClick })
 
   if (to) {
     return (
-      <NavLink className='group rounded-full text-gray-900 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-800' to={to} onClick={onClick}>
+      <NavLink className='group rounded-full text-gray-900 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-gray-800' to={to} onClick={onClick}>
         {body}
       </NavLink>
     );
   }
 
   return (
-    <a className='group rounded-full text-gray-900 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-800' href={href} target='_blank' onClick={onClick}>
+    <a className='group rounded-full text-gray-900 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-gray-800' href={href} target='_blank' onClick={onClick}>
       {body}
     </a>
   );
@@ -165,10 +165,10 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
             src={require('@tabler/icons/x.svg')}
             ref={closeButtonRef}
             iconClassName='h-6 w-6'
-            className='absolute top-0 right-0 -mr-11 mt-2 text-gray-600 dark:text-gray-400 hover:text-gray-600 dark:hover:text-gray-300'
+            className='absolute top-0 right-0 -mr-11 mt-2 text-gray-600 hover:text-gray-600 dark:text-gray-400 dark:hover:text-gray-300'
           />
 
-          <div className='relative overflow-y-scroll overflow-auto h-full w-full'>
+          <div className='relative h-full w-full overflow-auto overflow-y-scroll'>
             <div className='p-4'>
               <Stack space={4}>
                 <Link to={`/@${account.acct}`} onClick={onClose}>
@@ -342,11 +342,11 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
                     </button>
 
                     {switcher && (
-                      <div className='border-t-2 border-gray-100 dark:border-gray-800 border-solid'>
+                      <div className='border-t-2 border-solid border-gray-100 dark:border-gray-800'>
                         {otherAccounts.map(account => renderAccount(account))}
 
-                        <NavLink className='flex items-center py-2 space-x-1' to='/login/add' onClick={handleClose}>
-                          <Icon className='text-primary-500 w-4 h-4' src={require('@tabler/icons/plus.svg')} />
+                        <NavLink className='flex items-center space-x-1 py-2' to='/login/add' onClick={handleClose}>
+                          <Icon className='h-4 w-4 text-primary-500' src={require('@tabler/icons/plus.svg')} />
                           <Text size='sm' weight='medium'>{intl.formatMessage(messages.addAccount)}</Text>
                         </NavLink>
                       </div>
@@ -361,7 +361,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
         {/* Dummy element to keep Close Icon visible */}
         <div
           aria-hidden
-          className='w-14 flex-shrink-0'
+          className='w-14 shrink-0'
           onClick={handleClose}
         />
       </div>
diff --git a/app/soapbox/components/status-action-button.tsx b/app/soapbox/components/status-action-button.tsx
index 3eca779a60..2ac9e259dd 100644
--- a/app/soapbox/components/status-action-button.tsx
+++ b/app/soapbox/components/status-action-button.tsx
@@ -41,8 +41,8 @@ const StatusActionButton = React.forwardRef<HTMLButtonElement, IStatusActionButt
   const renderIcon = () => {
     if (emoji) {
       return (
-        <span className='flex w-6 h-6 items-center justify-center'>
-          <Emoji className='w-full h-full p-0.5' emoji={emoji} />
+        <span className='flex h-6 w-6 items-center justify-center'>
+          <Emoji className='h-full w-full p-0.5' emoji={emoji} />
         </span>
       );
     } else {
diff --git a/app/soapbox/components/status-content.tsx b/app/soapbox/components/status-content.tsx
index 307faf6792..719dea6e7b 100644
--- a/app/soapbox/components/status-content.tsx
+++ b/app/soapbox/components/status-content.tsx
@@ -25,7 +25,7 @@ interface IReadMoreButton {
 
 /** Button to expand a truncated status (due to too much content) */
 const ReadMoreButton: React.FC<IReadMoreButton> = ({ onClick }) => (
-  <button className='flex items-center text-gray-900 dark:text-gray-300 border-0 bg-transparent p-0 pt-2 hover:underline active:underline' onClick={onClick}>
+  <button className='flex items-center border-0 bg-transparent p-0 pt-2 text-gray-900 hover:underline active:underline dark:text-gray-300' onClick={onClick}>
     <FormattedMessage id='status.read_more' defaultMessage='Read more' />
     <Icon className='inline-block h-5 w-5' src={require('@tabler/icons/chevron-right.svg')} />
   </button>
diff --git a/app/soapbox/components/status-reply-mentions.tsx b/app/soapbox/components/status-reply-mentions.tsx
index 5d1374a693..335fd38f35 100644
--- a/app/soapbox/components/status-reply-mentions.tsx
+++ b/app/soapbox/components/status-reply-mentions.tsx
@@ -73,7 +73,7 @@ const StatusReplyMentions: React.FC<IStatusReplyMentions> = ({ status, hoverable
 
   if (to.size > 2) {
     accounts.push(
-      <span key='more' className='hover:underline cursor-pointer' role='button' onClick={handleOpenMentionsModal} tabIndex={0}>
+      <span key='more' className='cursor-pointer hover:underline' role='button' onClick={handleOpenMentionsModal} tabIndex={0}>
         <FormattedMessage id='reply_mentions.more' defaultMessage='{count} more' values={{ count: to.size - 2 }} />
       </span>,
     );
@@ -93,7 +93,7 @@ const StatusReplyMentions: React.FC<IStatusReplyMentions> = ({ status, hoverable
                 <HoverStatusWrapper statusId={status.in_reply_to_id} inline>
                   <span
                     key='hoverstatus'
-                    className='hover:underline cursor-pointer'
+                    className='cursor-pointer hover:underline'
                     role='presentation'
                   >
                     {children}
diff --git a/app/soapbox/components/statuses/sensitive-content-overlay.tsx b/app/soapbox/components/statuses/sensitive-content-overlay.tsx
index ed8891535d..192df71d1b 100644
--- a/app/soapbox/components/statuses/sensitive-content-overlay.tsx
+++ b/app/soapbox/components/statuses/sensitive-content-overlay.tsx
@@ -107,8 +107,8 @@ const SensitiveContentOverlay = React.forwardRef<HTMLDivElement, ISensitiveConte
           size='sm'
         />
       ) : (
-        <div className='flex justify-center items-center max-h-screen'>
-          <div className='text-center w-3/4 mx-auto space-y-4' ref={ref}>
+        <div className='flex max-h-screen items-center justify-center'>
+          <div className='mx-auto w-3/4 space-y-4 text-center' ref={ref}>
             <div className='space-y-1'>
               <Text theme='white' weight='semibold'>
                 {intl.formatMessage(isUnderReview ? messages.underReviewTitle : messages.sensitiveTitle)}
diff --git a/app/soapbox/components/statuses/status-info.tsx b/app/soapbox/components/statuses/status-info.tsx
index 55d0452ecb..322a911bc7 100644
--- a/app/soapbox/components/statuses/status-info.tsx
+++ b/app/soapbox/components/statuses/status-info.tsx
@@ -21,7 +21,7 @@ const StatusInfo = (props: IStatusInfo) => {
   return (
     <Container
       {...containerProps}
-      className='flex items-center text-gray-700 dark:text-gray-600 text-xs font-medium space-x-3 rtl:space-x-reverse hover:underline'
+      className='flex items-center space-x-3 text-xs font-medium text-gray-700 hover:underline rtl:space-x-reverse dark:text-gray-600'
     >
       <div
         className='flex justify-end'
diff --git a/app/soapbox/components/still-image.tsx b/app/soapbox/components/still-image.tsx
index 1f4f1a2611..0f6ee96598 100644
--- a/app/soapbox/components/still-image.tsx
+++ b/app/soapbox/components/still-image.tsx
@@ -70,7 +70,7 @@ const StillImage: React.FC<IStillImage> = ({ alt, className, src, style, letterb
       )}
 
       {(hoverToPlay && showExt) && (
-        <div className='group-hover:hidden absolute opacity-90 left-2 bottom-2 pointer-events-none'>
+        <div className='pointer-events-none absolute left-2 bottom-2 opacity-90 group-hover:hidden'>
           <ExtensionBadge ext='GIF' />
         </div>
       )}
@@ -86,7 +86,7 @@ interface IExtensionBadge {
 /** Badge displaying a file extension. */
 const ExtensionBadge: React.FC<IExtensionBadge> = ({ ext }) => {
   return (
-    <div className='inline-flex items-center px-2 py-0.5 rounded text-sm font-medium bg-gray-100 dark:bg-gray-800 text-gray-900 dark:text-gray-100'>
+    <div className='inline-flex items-center rounded bg-gray-100 px-2 py-0.5 text-sm font-medium text-gray-900 dark:bg-gray-800 dark:text-gray-100'>
       {ext}
     </div>
   );
diff --git a/app/soapbox/components/tombstone.tsx b/app/soapbox/components/tombstone.tsx
index 3a1c0ae4be..0507d90dd7 100644
--- a/app/soapbox/components/tombstone.tsx
+++ b/app/soapbox/components/tombstone.tsx
@@ -19,7 +19,7 @@ const Tombstone: React.FC<ITombstone> = ({ id, onMoveUp, onMoveDown }) => {
 
   return (
     <HotKeys handlers={handlers}>
-      <div className='p-9 flex items-center justify-center sm:rounded-xl bg-gray-100 border border-solid border-gray-200 dark:bg-gray-900 dark:border-gray-800 focusable' tabIndex={0}>
+      <div className='focusable flex items-center justify-center border border-solid border-gray-200 bg-gray-100 p-9 dark:border-gray-800 dark:bg-gray-900 sm:rounded-xl' tabIndex={0}>
         <Text>
           <FormattedMessage id='statuses.tombstone' defaultMessage='One or more posts are unavailable.' />
         </Text>
diff --git a/app/soapbox/components/ui/accordion/accordion.tsx b/app/soapbox/components/ui/accordion/accordion.tsx
index c6a2e00d1a..cb9e66497b 100644
--- a/app/soapbox/components/ui/accordion/accordion.tsx
+++ b/app/soapbox/components/ui/accordion/accordion.tsx
@@ -36,13 +36,13 @@ const Accordion: React.FC<IAccordion> = ({ headline, children, menu, expanded =
   };
 
   return (
-    <div className='bg-white dark:bg-primary-800 text-gray-900 dark:text-gray-100 rounded-lg shadow dark:shadow-none'>
+    <div className='rounded-lg bg-white text-gray-900 shadow dark:bg-primary-800 dark:text-gray-100 dark:shadow-none'>
       <button
         type='button'
         onClick={handleToggle}
         title={intl.formatMessage(expanded ? messages.collapse : messages.expand)}
         aria-expanded={expanded}
-        className='px-4 py-3 font-semibold flex items-center justify-between w-full'
+        className='flex w-full items-center justify-between px-4 py-3 font-semibold'
       >
         <span>{headline}</span>
 
@@ -55,7 +55,7 @@ const Accordion: React.FC<IAccordion> = ({ headline, children, menu, expanded =
           )}
           <Icon
             src={expanded ? require('@tabler/icons/chevron-up.svg') : require('@tabler/icons/chevron-down.svg')}
-            className='text-gray-700 dark:text-gray-600 h-5 w-5'
+            className='h-5 w-5 text-gray-700 dark:text-gray-600'
           />
         </HStack>
       </button>
diff --git a/app/soapbox/components/ui/banner/banner.tsx b/app/soapbox/components/ui/banner/banner.tsx
index f9313eca34..d58804db7b 100644
--- a/app/soapbox/components/ui/banner/banner.tsx
+++ b/app/soapbox/components/ui/banner/banner.tsx
@@ -17,7 +17,7 @@ const Banner: React.FC<IBanner> = ({ theme, children, className }) => {
         'bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 shadow-3xl dark:shadow-inset': theme === 'opaque',
       }, className)}
     >
-      <div className='max-w-4xl mx-auto px-4'>
+      <div className='mx-auto max-w-4xl px-4'>
         {children}
       </div>
     </div>
diff --git a/app/soapbox/components/ui/button/button.tsx b/app/soapbox/components/ui/button/button.tsx
index b09e8c0e22..8847f9c58b 100644
--- a/app/soapbox/components/ui/button/button.tsx
+++ b/app/soapbox/components/ui/button/button.tsx
@@ -63,7 +63,7 @@ const Button = React.forwardRef<HTMLButtonElement, IButton>((props, ref): JSX.El
       return null;
     }
 
-    return <Icon src={icon} className='w-4 h-4' />;
+    return <Icon src={icon} className='h-4 w-4' />;
   };
 
   const handleClick: React.MouseEventHandler<HTMLButtonElement> = React.useCallback((event) => {
diff --git a/app/soapbox/components/ui/card/card.tsx b/app/soapbox/components/ui/card/card.tsx
index 6fc85a39af..88c9df2d24 100644
--- a/app/soapbox/components/ui/card/card.tsx
+++ b/app/soapbox/components/ui/card/card.tsx
@@ -64,7 +64,7 @@ const CardHeader: React.FC<ICardHeader> = ({ className, children, backHref, onBa
     const backAttributes = backHref ? { to: backHref } : { onClick: onBackClick };
 
     return (
-      <Comp {...backAttributes} className='text-gray-900 dark:text-gray-100 focus:ring-primary-500 focus:ring-2' aria-label={intl.formatMessage(messages.back)}>
+      <Comp {...backAttributes} className='text-gray-900 focus:ring-2 focus:ring-primary-500 dark:text-gray-100' aria-label={intl.formatMessage(messages.back)}>
         <SvgIcon src={require('@tabler/icons/arrow-left.svg')} className='h-6 w-6 rtl:rotate-180' />
         <span className='sr-only' data-testid='back-button'>{intl.formatMessage(messages.back)}</span>
       </Comp>
diff --git a/app/soapbox/components/ui/checkbox/checkbox.tsx b/app/soapbox/components/ui/checkbox/checkbox.tsx
index 028c52296c..fe31e8089f 100644
--- a/app/soapbox/components/ui/checkbox/checkbox.tsx
+++ b/app/soapbox/components/ui/checkbox/checkbox.tsx
@@ -9,7 +9,7 @@ const Checkbox = React.forwardRef<HTMLInputElement, ICheckbox>((props, ref) => {
       {...props}
       ref={ref}
       type='checkbox'
-      className='border-2 dark:bg-gray-900 dark:border-gray-800 focus:ring-primary-500 h-4 w-4 text-primary-600 border-gray-300 rounded'
+      className='h-4 w-4 rounded border-2 border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-gray-800 dark:bg-gray-900'
     />
   );
 });
diff --git a/app/soapbox/components/ui/counter/counter.tsx b/app/soapbox/components/ui/counter/counter.tsx
index 983263b95b..e0fbb60049 100644
--- a/app/soapbox/components/ui/counter/counter.tsx
+++ b/app/soapbox/components/ui/counter/counter.tsx
@@ -12,7 +12,7 @@ interface ICounter {
 /** A simple counter for notifications, etc. */
 const Counter: React.FC<ICounter> = ({ count, countMax }) => {
   return (
-    <span className='h-5 min-w-[20px] max-w-[26px] flex items-center justify-center bg-secondary-500 text-xs font-medium text-white rounded-full ring-2 ring-white dark:ring-gray-800'>
+    <span className='flex h-5 min-w-[20px] max-w-[26px] items-center justify-center rounded-full bg-secondary-500 text-xs font-medium text-white ring-2 ring-white dark:ring-gray-800'>
       {shortNumberFormat(count, countMax)}
     </span>
   );
diff --git a/app/soapbox/components/ui/datepicker/datepicker.tsx b/app/soapbox/components/ui/datepicker/datepicker.tsx
index bef8467096..d9ba83f425 100644
--- a/app/soapbox/components/ui/datepicker/datepicker.tsx
+++ b/app/soapbox/components/ui/datepicker/datepicker.tsx
@@ -31,7 +31,7 @@ const Datepicker = ({ onChange }: IDatepicker) => {
   }, [month, day, year]);
 
   return (
-    <div className='grid grid-cols-1 gap-y-2 gap-x-2 sm:grid-cols-3'>
+    <div className='grid grid-cols-1 gap-2 sm:grid-cols-3'>
       <div className='sm:col-span-1'>
         <Stack>
           <Text size='sm' weight='medium' theme='muted'>
diff --git a/app/soapbox/components/ui/divider/divider.tsx b/app/soapbox/components/ui/divider/divider.tsx
index ebe436fa95..cd1a3b68ab 100644
--- a/app/soapbox/components/ui/divider/divider.tsx
+++ b/app/soapbox/components/ui/divider/divider.tsx
@@ -13,12 +13,12 @@ interface IDivider {
 const Divider = ({ text, textSize = 'md' }: IDivider) => (
   <div className='relative' data-testid='divider'>
     <div className='absolute inset-0 flex items-center' aria-hidden='true'>
-      <div className='w-full border-t-2 border-gray-100 dark:border-gray-800 border-solid' />
+      <div className='w-full border-t-2 border-solid border-gray-100 dark:border-gray-800' />
     </div>
 
     {text && (
       <div className='relative flex justify-center'>
-        <span className='px-2 bg-white dark:bg-gray-900 text-gray-700 dark:text-gray-600' data-testid='divider-text'>
+        <span className='bg-white px-2 text-gray-700 dark:bg-gray-900 dark:text-gray-600' data-testid='divider-text'>
           <Text size={textSize} tag='span' theme='inherit'>{text}</Text>
         </span>
       </div>
diff --git a/app/soapbox/components/ui/emoji-selector/emoji-selector.tsx b/app/soapbox/components/ui/emoji-selector/emoji-selector.tsx
index caaea79ee6..f8187fa982 100644
--- a/app/soapbox/components/ui/emoji-selector/emoji-selector.tsx
+++ b/app/soapbox/components/ui/emoji-selector/emoji-selector.tsx
@@ -18,7 +18,7 @@ interface IEmojiButton {
 const EmojiButton: React.FC<IEmojiButton> = ({ emoji, className, onClick, tabIndex }): JSX.Element => {
   return (
     <button className={classNames(className)} onClick={onClick} tabIndex={tabIndex}>
-      <Emoji className='w-8 h-8 duration-100 hover:scale-125' emoji={emoji} />
+      <Emoji className='h-8 w-8 duration-100 hover:scale-125' emoji={emoji} />
     </button>
   );
 };
diff --git a/app/soapbox/components/ui/file-input/file-input.tsx b/app/soapbox/components/ui/file-input/file-input.tsx
index f54f20ae82..89c42f14bc 100644
--- a/app/soapbox/components/ui/file-input/file-input.tsx
+++ b/app/soapbox/components/ui/file-input/file-input.tsx
@@ -8,7 +8,7 @@ const FileInput = forwardRef<HTMLInputElement, IFileInput>((props, ref) => {
       {...props}
       ref={ref}
       type='file'
-      className='block w-full text-sm text-gray-800 dark:text-gray-200 file:cursor-pointer file:mr-2 file:py-1.5 file:px-3 file:rounded-full file:text-xs file:leading-4 file:font-medium file:border-gray-200 file:border file:border-solid file:bg-white file:text-gray-700 hover:file:bg-gray-100 dark:file:border-gray-800 dark:file:bg-gray-900 dark:file:hover:bg-gray-800 dark:file:text-gray-500'
+      className='block w-full text-sm text-gray-800 file:mr-2 file:cursor-pointer file:rounded-full file:border file:border-solid file:border-gray-200 file:bg-white file:py-1.5 file:px-3 file:text-xs file:font-medium file:leading-4 file:text-gray-700 hover:file:bg-gray-100 dark:text-gray-200 dark:file:border-gray-800 dark:file:bg-gray-900 dark:file:text-gray-500 dark:file:hover:bg-gray-800'
     />
   );
 });
diff --git a/app/soapbox/components/ui/form-group/form-group.tsx b/app/soapbox/components/ui/form-group/form-group.tsx
index d33c6d2a99..bbd094d2e4 100644
--- a/app/soapbox/components/ui/form-group/form-group.tsx
+++ b/app/soapbox/components/ui/form-group/form-group.tsx
@@ -55,7 +55,7 @@ const FormGroup: React.FC<IFormGroup> = (props) => {
             <div>
               <p
                 data-testid='form-group-error'
-                className='mt-0.5 text-xs text-danger-900 bg-danger-200 rounded-md inline-block px-2 py-1 relative form-error'
+                className='form-error relative mt-0.5 inline-block rounded-md bg-danger-200 px-2 py-1 text-xs text-danger-900'
               >
                 {errors.join(', ')}
               </p>
@@ -92,7 +92,7 @@ const FormGroup: React.FC<IFormGroup> = (props) => {
         {hasError && (
           <p
             data-testid='form-group-error'
-            className='mt-0.5 text-xs text-danger-900 bg-danger-200 rounded-md inline-block px-2 py-1 relative form-error'
+            className='form-error relative mt-0.5 inline-block rounded-md bg-danger-200 px-2 py-1 text-xs text-danger-900'
           >
             {errors.join(', ')}
           </p>
diff --git a/app/soapbox/components/ui/icon/icon.tsx b/app/soapbox/components/ui/icon/icon.tsx
index 55e83b0df1..29ebc77c95 100644
--- a/app/soapbox/components/ui/icon/icon.tsx
+++ b/app/soapbox/components/ui/icon/icon.tsx
@@ -21,9 +21,9 @@ interface IIcon extends Pick<React.SVGAttributes<SVGAElement>, 'strokeWidth'> {
 
 /** Renders and SVG icon with optional counter. */
 const Icon: React.FC<IIcon> = ({ src, alt, count, size, countMax, ...filteredProps }): JSX.Element => (
-  <div className='flex flex-col flex-shrink-0 relative' data-testid='icon'>
+  <div className='relative flex shrink-0 flex-col' data-testid='icon'>
     {count ? (
-      <span className='absolute -top-2 -right-3 min-w-[20px] h-5 flex-shrink-0 whitespace-nowrap flex items-center justify-center break-words'>
+      <span className='absolute -top-2 -right-3 flex h-5 min-w-[20px] shrink-0 items-center justify-center whitespace-nowrap break-words'>
         <Counter count={count} countMax={countMax} />
       </span>
     ) : null}
diff --git a/app/soapbox/components/ui/input/input.tsx b/app/soapbox/components/ui/input/input.tsx
index 9087943b60..c16c59a6a5 100644
--- a/app/soapbox/components/ui/input/input.tsx
+++ b/app/soapbox/components/ui/input/input.tsx
@@ -68,7 +68,7 @@ const Input = React.forwardRef<HTMLInputElement, IInput>(
         }
       >
         {icon ? (
-          <div className='absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none'>
+          <div className='pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3'>
             <Icon src={icon} className='h-4 w-4 text-gray-700 dark:text-gray-600' aria-hidden='true' />
           </div>
         ) : null}
@@ -95,7 +95,7 @@ const Input = React.forwardRef<HTMLInputElement, IInput>(
         />
 
         {append ? (
-          <div className='absolute inset-y-0 right-0 rtl:left-0 rtl:right-auto flex items-center pr-3'>
+          <div className='absolute inset-y-0 right-0 flex items-center pr-3 rtl:left-0 rtl:right-auto'>
             {append}
           </div>
         ) : null}
@@ -108,12 +108,12 @@ const Input = React.forwardRef<HTMLInputElement, IInput>(
                 intl.formatMessage(messages.showPassword)
             }
           >
-            <div className='absolute inset-y-0 right-0 rtl:left-0 rtl:right-auto flex items-center'>
+            <div className='absolute inset-y-0 right-0 flex items-center rtl:left-0 rtl:right-auto'>
               <button
                 type='button'
                 onClick={togglePassword}
                 tabIndex={-1}
-                className='text-gray-700 dark:text-gray-600 hover:text-gray-500 dark:hover:text-gray-400 h-full px-2 focus:ring-primary-500 focus:ring-2'
+                className='h-full px-2 text-gray-700 hover:text-gray-500 focus:ring-2 focus:ring-primary-500 dark:text-gray-600 dark:hover:text-gray-400'
               >
                 <SvgIcon
                   src={revealed ? require('@tabler/icons/eye-off.svg') : require('@tabler/icons/eye.svg')}
diff --git a/app/soapbox/components/ui/layout/layout.tsx b/app/soapbox/components/ui/layout/layout.tsx
index c2e808c9c2..bf7b210222 100644
--- a/app/soapbox/components/ui/layout/layout.tsx
+++ b/app/soapbox/components/ui/layout/layout.tsx
@@ -21,8 +21,8 @@ interface LayoutComponent extends React.FC<ILayout> {
 
 /** Layout container, to hold Sidebar, Main, and Aside. */
 const Layout: LayoutComponent = ({ children }) => (
-  <div className='sm:pt-4 relative'>
-    <div className='max-w-3xl mx-auto sm:px-6 md:max-w-7xl md:px-8 md:grid md:grid-cols-12 md:gap-8'>
+  <div className='relative sm:pt-4'>
+    <div className='mx-auto max-w-3xl sm:px-6 md:grid md:max-w-7xl md:grid-cols-12 md:gap-8 md:px-8'>
       {children}
     </div>
   </div>
@@ -30,7 +30,7 @@ const Layout: LayoutComponent = ({ children }) => (
 
 /** Left sidebar container in the UI. */
 const Sidebar: React.FC<ISidebar> = ({ children }) => (
-  <div className='hidden lg:block lg:col-span-3'>
+  <div className='hidden lg:col-span-3 lg:block'>
     <StickyBox offsetTop={80} className='pb-4'>
       {children}
     </StickyBox>
@@ -50,7 +50,7 @@ const Main: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({ children, classN
 
 /** Right sidebar container in the UI. */
 const Aside: React.FC<IAside> = ({ children }) => (
-  <aside className='hidden xl:block xl:col-span-3'>
+  <aside className='hidden xl:col-span-3 xl:block'>
     <StickyBox offsetTop={80} className='space-y-6 pb-12'>
       {children}
     </StickyBox>
diff --git a/app/soapbox/components/ui/modal/modal.tsx b/app/soapbox/components/ui/modal/modal.tsx
index e7aae8d78b..cfb5f11e35 100644
--- a/app/soapbox/components/ui/modal/modal.tsx
+++ b/app/soapbox/components/ui/modal/modal.tsx
@@ -88,7 +88,7 @@ const Modal: React.FC<IModal> = ({
 
   return (
     <div data-testid='modal' className={classNames('block w-full p-6 mx-auto text-start align-middle transition-all transform bg-white dark:bg-primary-900 text-gray-900 dark:text-gray-100 shadow-xl rounded-2xl pointer-events-auto', widths[width])}>
-      <div className='sm:flex sm:items-start w-full justify-between'>
+      <div className='w-full justify-between sm:flex sm:items-start'>
         <div className='w-full'>
           {title && (
             <div
@@ -96,7 +96,7 @@ const Modal: React.FC<IModal> = ({
                 'flex-row-reverse': closePosition === 'left',
               })}
             >
-              <h3 className='flex-grow text-lg leading-6 font-bold text-gray-900 dark:text-white'>
+              <h3 className='grow text-lg font-bold leading-6 text-gray-900 dark:text-white'>
                 {title}
               </h3>
 
@@ -105,14 +105,14 @@ const Modal: React.FC<IModal> = ({
                   src={closeIcon}
                   title={intl.formatMessage(messages.close)}
                   onClick={onClose}
-                  className='text-gray-500 hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200 rtl:rotate-180'
+                  className='text-gray-500 hover:text-gray-700 rtl:rotate-180 dark:text-gray-300 dark:hover:text-gray-200'
                 />
               )}
             </div>
           )}
 
           {title ? (
-            <div className='w-full mt-2'>
+            <div className='mt-2 w-full'>
               {children}
             </div>
           ) : children}
diff --git a/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx b/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx
index aaf2b4ac53..e420b733fc 100644
--- a/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx
+++ b/app/soapbox/components/ui/phone-input/country-code-dropdown.tsx
@@ -12,7 +12,7 @@ const CountryCodeDropdown: React.FC<ICountryCodeDropdown> = ({ countryCode, onCh
   return (
     <select
       value={countryCode}
-      className='h-full py-0 pl-3 pr-7 text-base bg-transparent border-transparent focus:outline-none focus:ring-primary-500 dark:text-white sm:text-sm rounded-md'
+      className='h-full rounded-md border-transparent bg-transparent py-0 pl-3 pr-7 text-base focus:outline-none focus:ring-primary-500 dark:text-white sm:text-sm'
       onChange={(event) => onChange(event.target.value as any)}
     >
       {COUNTRY_CODES.map((code) => (
diff --git a/app/soapbox/components/ui/progress-bar/progress-bar.tsx b/app/soapbox/components/ui/progress-bar/progress-bar.tsx
index 3d02e49711..0507045e47 100644
--- a/app/soapbox/components/ui/progress-bar/progress-bar.tsx
+++ b/app/soapbox/components/ui/progress-bar/progress-bar.tsx
@@ -14,7 +14,7 @@ interface IProgressBar {
 /** A horizontal meter filled to the given percentage. */
 const ProgressBar: React.FC<IProgressBar> = ({ progress, size = 'md' }) => (
   <div
-    className={clsx('h-2.5 w-full rounded-lg bg-gray-300 dark:bg-primary-800 overflow-hidden', {
+    className={clsx('h-2.5 w-full overflow-hidden rounded-lg bg-gray-300 dark:bg-primary-800', {
       'h-2.5': size === 'md',
       'h-[6px]': size === 'sm',
     })}
diff --git a/app/soapbox/components/ui/select/select.tsx b/app/soapbox/components/ui/select/select.tsx
index e405fa2405..4c88ae5bd1 100644
--- a/app/soapbox/components/ui/select/select.tsx
+++ b/app/soapbox/components/ui/select/select.tsx
@@ -11,7 +11,7 @@ const Select = React.forwardRef<HTMLSelectElement, ISelect>((props, ref) => {
   return (
     <select
       ref={ref}
-      className={`w-full pl-3 pr-10 py-2 text-base truncate border-gray-300 dark:border-gray-800 focus:outline-none focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-900 dark:text-gray-100 dark:ring-1 dark:ring-gray-800 dark:focus:ring-primary-500 dark:focus:border-primary-500 sm:text-sm rounded-md disabled:opacity-50 ${className}`}
+      className={`w-full truncate rounded-md border-gray-300 py-2 pl-3 pr-10 text-base focus:border-primary-500 focus:outline-none focus:ring-primary-500 disabled:opacity-50 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:ring-1 dark:ring-gray-800 dark:focus:border-primary-500 dark:focus:ring-primary-500 sm:text-sm ${className}`}
       {...filteredProps}
     >
       {children}
diff --git a/app/soapbox/components/ui/slider/slider.tsx b/app/soapbox/components/ui/slider/slider.tsx
index 009e7db5ef..4449f7f5bf 100644
--- a/app/soapbox/components/ui/slider/slider.tsx
+++ b/app/soapbox/components/ui/slider/slider.tsx
@@ -53,14 +53,14 @@ const Slider: React.FC<ISlider> = ({ value, onChange }) => {
 
   return (
     <div
-      className='inline-flex cursor-pointer h-6 relative transition'
+      className='relative inline-flex h-6 cursor-pointer transition'
       onMouseDown={handleMouseDown}
       ref={node}
     >
-      <div className='w-full h-1 bg-primary-200 dark:bg-primary-700 absolute top-1/2 -translate-y-1/2 rounded-full' />
-      <div className='h-1 bg-accent-500 absolute top-1/2 -translate-y-1/2 rounded-full' style={{ width: `${value * 100}%` }} />
+      <div className='absolute top-1/2 h-1 w-full -translate-y-1/2 rounded-full bg-primary-200 dark:bg-primary-700' />
+      <div className='absolute top-1/2 h-1 -translate-y-1/2 rounded-full bg-accent-500' style={{ width: `${value * 100}%` }} />
       <span
-        className='bg-accent-500 absolute rounded-full w-3 h-3 -ml-1.5 top-1/2 -translate-y-1/2 z-10 shadow'
+        className='absolute top-1/2 z-10 -ml-1.5 h-3 w-3 -translate-y-1/2 rounded-full bg-accent-500 shadow'
         tabIndex={0}
         style={{ left: `${value * 100}%` }}
       />
diff --git a/app/soapbox/components/ui/tabs/tabs.tsx b/app/soapbox/components/ui/tabs/tabs.tsx
index 5d8151be66..60e89d25f3 100644
--- a/app/soapbox/components/ui/tabs/tabs.tsx
+++ b/app/soapbox/components/ui/tabs/tabs.tsx
@@ -46,7 +46,7 @@ const AnimatedTabs: React.FC<IAnimatedInterface> = ({ children, ...rest }) => {
         ref={ref}
       >
         <div
-          className='w-full h-[3px] bg-primary-200 dark:bg-primary-700 absolute'
+          className='absolute h-[3px] w-full bg-primary-200 dark:bg-primary-700'
           style={{ top }}
         />
         <div
diff --git a/app/soapbox/components/ui/tag-input/tag-input.tsx b/app/soapbox/components/ui/tag-input/tag-input.tsx
index e4f8548ab1..fe09bf0ee4 100644
--- a/app/soapbox/components/ui/tag-input/tag-input.tsx
+++ b/app/soapbox/components/ui/tag-input/tag-input.tsx
@@ -43,9 +43,9 @@ const TagInput: React.FC<ITagInput> = ({ tags, onChange, placeholder }) => {
   };
 
   return (
-    <div className='mt-1 relative shadow-sm flex-grow'>
+    <div className='relative mt-1 grow shadow-sm'>
       <HStack
-        className='p-2 pb-0 text-gray-900 dark:text-gray-100 placeholder:text-gray-600 dark:placeholder:text-gray-600 block w-full sm:text-sm dark:ring-1 dark:ring-gray-800 focus:ring-primary-500 focus:border-primary-500 dark:focus:ring-primary-500 dark:focus:border-primary-500 rounded-md bg-white dark:bg-gray-900 border-gray-400 dark:border-gray-800'
+        className='block w-full rounded-md border-gray-400 bg-white p-2 pb-0 text-gray-900 placeholder:text-gray-600 focus:border-primary-500 focus:ring-primary-500 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:ring-1 dark:ring-gray-800 dark:placeholder:text-gray-600 dark:focus:border-primary-500 dark:focus:ring-primary-500 sm:text-sm'
         space={2}
         wrap
       >
@@ -56,7 +56,7 @@ const TagInput: React.FC<ITagInput> = ({ tags, onChange, placeholder }) => {
         ))}
 
         <input
-          className='p-1 mb-2 w-32 h-8 flex-grow bg-transparent outline-none'
+          className='mb-2 h-8 w-32 grow bg-transparent p-1 outline-none'
           value={input}
           placeholder={placeholder}
           onChange={e => setInput(e.target.value)}
diff --git a/app/soapbox/components/ui/tag-input/tag.tsx b/app/soapbox/components/ui/tag-input/tag.tsx
index d47b1d73bf..94ce5bbfb3 100644
--- a/app/soapbox/components/ui/tag-input/tag.tsx
+++ b/app/soapbox/components/ui/tag-input/tag.tsx
@@ -13,7 +13,7 @@ interface ITag {
 /** A single editable Tag (used by TagInput). */
 const Tag: React.FC<ITag> = ({ tag, onDelete }) => {
   return (
-    <div className='inline-flex p-1 rounded bg-primary-500 items-center whitespace-nowrap'>
+    <div className='inline-flex items-center whitespace-nowrap rounded bg-primary-500 p-1'>
       <Text theme='white'>{tag}</Text>
 
       <IconButton
diff --git a/app/soapbox/components/ui/toast/toast.tsx b/app/soapbox/components/ui/toast/toast.tsx
index 1aec2a2b64..981df1132f 100644
--- a/app/soapbox/components/ui/toast/toast.tsx
+++ b/app/soapbox/components/ui/toast/toast.tsx
@@ -40,7 +40,7 @@ const Toast = (props: IToast) => {
         return (
           <Icon
             src={require('@tabler/icons/circle-check.svg')}
-            className='w-6 h-6 text-success-500 dark:text-success-400'
+            className='h-6 w-6 text-success-500 dark:text-success-400'
             aria-hidden
           />
         );
@@ -48,7 +48,7 @@ const Toast = (props: IToast) => {
         return (
           <Icon
             src={require('@tabler/icons/info-circle.svg')}
-            className='w-6 h-6 text-primary-600 dark:text-accent-blue'
+            className='h-6 w-6 text-primary-600 dark:text-accent-blue'
             aria-hidden
           />
         );
@@ -56,7 +56,7 @@ const Toast = (props: IToast) => {
         return (
           <Icon
             src={require('@tabler/icons/alert-circle.svg')}
-            className='w-6 h-6 text-danger-600'
+            className='h-6 w-6 text-danger-600'
             aria-hidden
           />
         );
@@ -112,7 +112,7 @@ const Toast = (props: IToast) => {
       <HStack space={4} alignItems='start'>
         <HStack space={3} justifyContent='between' alignItems='start' className='w-0 flex-1'>
           <HStack space={3} alignItems='start' className='w-0 flex-1'>
-            <div className='flex-shrink-0'>
+            <div className='shrink-0'>
               {renderIcon()}
             </div>
 
@@ -126,15 +126,15 @@ const Toast = (props: IToast) => {
         </HStack>
 
         {/* Dismiss Button */}
-        <div className='flex flex-shrink-0 pt-0.5'>
+        <div className='flex shrink-0 pt-0.5'>
           <button
             type='button'
-            className='inline-flex rounded-md text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2'
+            className='inline-flex rounded-md text-gray-600 hover:text-gray-700 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 dark:text-gray-600 dark:hover:text-gray-500'
             onClick={dismissToast}
             data-testid='toast-dismiss'
           >
             <span className='sr-only'>Close</span>
-            <Icon src={require('@tabler/icons/x.svg')} className='w-5 h-5' />
+            <Icon src={require('@tabler/icons/x.svg')} className='h-5 w-5' />
           </button>
         </div>
       </HStack>
diff --git a/app/soapbox/components/ui/widget/widget.tsx b/app/soapbox/components/ui/widget/widget.tsx
index 39e4c2beba..e5441c57eb 100644
--- a/app/soapbox/components/ui/widget/widget.tsx
+++ b/app/soapbox/components/ui/widget/widget.tsx
@@ -49,7 +49,7 @@ const Widget: React.FC<IWidget> = ({
         <WidgetTitle title={title} />
         {action || (onActionClick && (
           <IconButton
-            className='w-6 h-6 ml-2 text-black dark:text-white rtl:rotate-180'
+            className='ml-2 h-6 w-6 text-black rtl:rotate-180 dark:text-white'
             src={actionIcon}
             onClick={onActionClick}
             title={actionTitle}
diff --git a/app/soapbox/components/upload-progress.tsx b/app/soapbox/components/upload-progress.tsx
index 81f5be14ed..f434c46736 100644
--- a/app/soapbox/components/upload-progress.tsx
+++ b/app/soapbox/components/upload-progress.tsx
@@ -14,7 +14,7 @@ const UploadProgress: React.FC<IUploadProgress> = ({ progress }) => {
     <HStack alignItems='center' space={2}>
       <Icon
         src={require('@tabler/icons/cloud-upload.svg')}
-        className='w-7 h-7 text-gray-500'
+        className='h-7 w-7 text-gray-500'
       />
 
       <Stack space={1}>
diff --git a/app/soapbox/components/upload.tsx b/app/soapbox/components/upload.tsx
index 85f136378f..eaa5bf019d 100644
--- a/app/soapbox/components/upload.tsx
+++ b/app/soapbox/components/upload.tsx
@@ -141,7 +141,7 @@ const Upload: React.FC<IUpload> = ({
 
   const uploadIcon = mediaType === 'unknown' && (
     <Icon
-      className='h-16 w-16 mx-auto my-12 text-gray-800 dark:text-gray-200'
+      className='mx-auto my-12 h-16 w-16 text-gray-800 dark:text-gray-200'
       src={MIMETYPE_ICONS[mimeType || ''] || defaultIcon}
     />
   );
diff --git a/app/soapbox/features/about/index.tsx b/app/soapbox/features/about/index.tsx
index 9cc1e92955..8d1be5c2e0 100644
--- a/app/soapbox/features/about/index.tsx
+++ b/app/soapbox/features/about/index.tsx
@@ -38,7 +38,7 @@ const AboutPage: React.FC = () => {
     <div>
       <FormattedMessage id='about.also_available' defaultMessage='Available in:' />
       {' '}
-      <ul className='p-0 inline list-none'>
+      <ul className='inline list-none p-0'>
         <li className="inline after:content-['_·_']">
           <a href='#' onClick={() => setLocale(defaultLocale)}>
             {/* @ts-ignore */}
@@ -60,7 +60,7 @@ const AboutPage: React.FC = () => {
   );
 
   return (
-    <div className='prose dark:prose-invert mx-auto py-20'>
+    <div className='prose mx-auto py-20 dark:prose-invert'>
       <div dangerouslySetInnerHTML={{ __html: pageHtml }} />
 
       {alsoAvailable}
diff --git a/app/soapbox/features/account-gallery/components/media-item.tsx b/app/soapbox/features/account-gallery/components/media-item.tsx
index f980c02175..4a664a03f5 100644
--- a/app/soapbox/features/account-gallery/components/media-item.tsx
+++ b/app/soapbox/features/account-gallery/components/media-item.tsx
@@ -71,7 +71,7 @@ const MediaItem: React.FC<IMediaItem> = ({ attachment, onOpenMedia }) => {
         src={attachment.preview_url}
         alt={attachment.description}
         style={{ objectPosition: `${x}% ${y}%` }}
-        className='w-full h-full rounded-lg overflow-hidden'
+        className='h-full w-full overflow-hidden rounded-lg'
       />
     );
   } else if (['gifv', 'video'].indexOf(attachment.type) !== -1) {
diff --git a/app/soapbox/features/account-timeline/components/moved-note.tsx b/app/soapbox/features/account-timeline/components/moved-note.tsx
index 7cc64f5ca3..a41e241d1b 100644
--- a/app/soapbox/features/account-timeline/components/moved-note.tsx
+++ b/app/soapbox/features/account-timeline/components/moved-note.tsx
@@ -17,7 +17,7 @@ const MovedNote: React.FC<IMovedNote> = ({ from, to }) => (
     <HStack className='mb-2' alignItems='center' space={1.5}>
       <Icon
         src={require('@tabler/icons/briefcase.svg')}
-        className='text-primary-600 dark:text-primary-400 flex-none'
+        className='flex-none text-primary-600 dark:text-primary-400'
       />
 
       <div className='truncate'>
diff --git a/app/soapbox/features/account/components/header.tsx b/app/soapbox/features/account/components/header.tsx
index 3f11f49817..368dce1b15 100644
--- a/app/soapbox/features/account/components/header.tsx
+++ b/app/soapbox/features/account/components/header.tsx
@@ -102,16 +102,16 @@ const Header: React.FC<IHeader> = ({ account }) => {
 
   if (!account) {
     return (
-      <div className='-mt-4 -mx-4'>
+      <div className='-mx-4 -mt-4'>
         <div>
-          <div className='relative h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50' />
+          <div className='relative h-32 w-full bg-gray-200 dark:bg-gray-900/50 md:rounded-t-xl lg:h-48' />
         </div>
 
         <div className='px-4 sm:px-6'>
           <HStack alignItems='bottom' space={5} className='-mt-12'>
-            <div className='flex relative'>
+            <div className='relative flex'>
               <div
-                className='h-24 w-24 bg-gray-400 rounded-full ring-4 ring-white dark:ring-gray-800'
+                className='h-24 w-24 rounded-full bg-gray-400 ring-4 ring-white dark:ring-gray-800'
               />
             </div>
           </HStack>
@@ -586,13 +586,13 @@ const Header: React.FC<IHeader> = ({ account }) => {
   const menu = makeMenu();
 
   return (
-    <div className='-mt-4 -mx-4'>
+    <div className='-mx-4 -mt-4'>
       {(account.moved && typeof account.moved === 'object') && (
         <MovedNote from={account} to={account.moved} />
       )}
 
       <div>
-        <div className='relative flex flex-col justify-center h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50 overflow-hidden isolate'>
+        <div className='relative isolate flex h-32 w-full flex-col justify-center overflow-hidden bg-gray-200 dark:bg-gray-900/50 md:rounded-t-xl lg:h-48'>
           {renderHeader()}
 
           <div className='absolute top-2 left-2'>
@@ -610,12 +610,12 @@ const Header: React.FC<IHeader> = ({ account }) => {
               <Avatar
                 src={account.avatar}
                 size={96}
-                className='relative h-24 w-24 rounded-full ring-4 ring-white dark:ring-primary-900 bg-white dark:bg-primary-900'
+                className='relative h-24 w-24 rounded-full bg-white ring-4 ring-white dark:bg-primary-900 dark:ring-primary-900'
               />
             </a>
           </div>
 
-          <div className='mt-6 flex justify-end w-full sm:pb-1'>
+          <div className='mt-6 flex w-full justify-end sm:pb-1'>
             <HStack space={2} className='mt-10'>
               <SubscriptionButton account={account} />
               {renderMessageButton()}
@@ -644,7 +644,7 @@ const Header: React.FC<IHeader> = ({ account }) => {
                           <Comp key={idx} {...itemProps} className='group'>
                             <HStack space={3} alignItems='center'>
                               {menuItem.icon && (
-                                <SvgIcon src={menuItem.icon} className='h-5 w-5 text-gray-400 flex-none group-hover:text-gray-500' />
+                                <SvgIcon src={menuItem.icon} className='h-5 w-5 flex-none text-gray-400 group-hover:text-gray-500' />
                               )}
 
                               <div className='truncate'>{menuItem.text}</div>
diff --git a/app/soapbox/features/admin/components/dashcounter.tsx b/app/soapbox/features/admin/components/dashcounter.tsx
index a429865359..64abd36d8d 100644
--- a/app/soapbox/features/admin/components/dashcounter.tsx
+++ b/app/soapbox/features/admin/components/dashcounter.tsx
@@ -21,7 +21,7 @@ const DashCounter: React.FC<IDashCounter> = ({ count, label, to = '#', percent =
 
   return (
     <Link
-      className='bg-gray-200 dark:bg-gray-800 p-4 rounded flex flex-col items-center space-y-2 hover:-translate-y-1 transition-transform cursor-pointer'
+      className='flex cursor-pointer flex-col items-center space-y-2 rounded bg-gray-200 p-4 transition-transform hover:-translate-y-1 dark:bg-gray-800'
       to={to}
     >
       <Text align='center' size='2xl' weight='medium'>
@@ -45,7 +45,7 @@ interface IDashCounters {
 /** Wrapper container for dash counters. */
 const DashCounters: React.FC<IDashCounters> = ({ children }) => {
   return (
-    <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2'>
+    <div className='grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-3'>
       {children}
     </div>
   );
diff --git a/app/soapbox/features/admin/components/report.tsx b/app/soapbox/features/admin/components/report.tsx
index 210288fdc4..2d961d0955 100644
--- a/app/soapbox/features/admin/components/report.tsx
+++ b/app/soapbox/features/admin/components/report.tsx
@@ -135,7 +135,7 @@ const Report: React.FC<IReport> = ({ id }) => {
               <Link
                 to={`/@${reporterAcct}`}
                 title={reporterAcct}
-                className='text-primary-600 dark:text-accent-blue hover:underline'
+                className='text-primary-600 hover:underline dark:text-accent-blue'
               >
                 @{reporterAcct}
               </Link>
diff --git a/app/soapbox/features/admin/tabs/dashboard.tsx b/app/soapbox/features/admin/tabs/dashboard.tsx
index aa127f5a12..035feb3c8c 100644
--- a/app/soapbox/features/admin/tabs/dashboard.tsx
+++ b/app/soapbox/features/admin/tabs/dashboard.tsx
@@ -115,13 +115,13 @@ const Dashboard: React.FC = () => {
         <ListItem label={<FormattedMessage id='admin.software.frontend' defaultMessage='Frontend' />}>
           <a
             href={sourceCode.ref ? `${sourceCode.url}/tree/${sourceCode.ref}` : sourceCode.url}
-            className='flex space-x-1 items-center truncate'
+            className='flex items-center space-x-1 truncate'
             target='_blank'
           >
             <span>{sourceCode.displayName} {sourceCode.version}</span>
 
             <Icon
-              className='w-4 h-4'
+              className='h-4 w-4'
               src={require('@tabler/icons/external-link.svg')}
             />
           </a>
diff --git a/app/soapbox/features/ads/components/ad.tsx b/app/soapbox/features/ads/components/ad.tsx
index 75e6497846..fffd594a5f 100644
--- a/app/soapbox/features/ads/components/ad.tsx
+++ b/app/soapbox/features/ads/components/ad.tsx
@@ -85,7 +85,7 @@ const Ad: React.FC<IAd> = ({ ad }) => {
                 </Text>
 
                 <Icon
-                  className='w-5 h-5 stroke-accent-500'
+                  className='h-5 w-5 stroke-accent-500'
                   src={require('@tabler/icons/timeline.svg')}
                 />
               </HStack>
diff --git a/app/soapbox/features/aliases/components/search.tsx b/app/soapbox/features/aliases/components/search.tsx
index 4a2ca3c760..6b60be5b23 100644
--- a/app/soapbox/features/aliases/components/search.tsx
+++ b/app/soapbox/features/aliases/components/search.tsx
@@ -40,11 +40,11 @@ const Search: React.FC = () => {
 
   return (
     <div className='flex items-center gap-1'>
-      <label className='flex-grow relative'>
+      <label className='relative grow'>
         <span style={{ display: 'none' }}>{intl.formatMessage(messages.search)}</span>
 
         <input
-          className='block w-full sm:text-sm dark:bg-gray-800 dark:text-white dark:placeholder:text-gray-500 focus:ring-primary-500 focus:border-primary-500 rounded-full'
+          className='block w-full rounded-full focus:border-primary-500 focus:ring-primary-500 dark:bg-gray-800 dark:text-white dark:placeholder:text-gray-500 sm:text-sm'
           type='text'
           value={value}
           onChange={handleChange}
diff --git a/app/soapbox/features/auth-layout/index.tsx b/app/soapbox/features/auth-layout/index.tsx
index b792bc006f..2b32d25807 100644
--- a/app/soapbox/features/auth-layout/index.tsx
+++ b/app/soapbox/features/auth-layout/index.tsx
@@ -36,9 +36,9 @@ const AuthLayout = () => {
       <LandingGradient />
 
       <main className='relative h-full sm:flex sm:justify-center'>
-        <div className='w-full h-full flex flex-col sm:max-w-lg md:max-w-2xl lg:max-w-6xl'>
-          <header className='flex justify-between relative py-12 px-2 mb-auto'>
-            <div className='relative z-0 flex-1 px-2 lg:flex lg:items-center lg:justify-center lg:absolute lg:inset-0'>
+        <div className='flex h-full w-full flex-col sm:max-w-lg md:max-w-2xl lg:max-w-6xl'>
+          <header className='relative mb-auto flex justify-between py-12 px-2'>
+            <div className='relative z-0 flex-1 px-2 lg:absolute lg:inset-0 lg:flex lg:items-center lg:justify-center'>
               <Link to='/' className='cursor-pointer'>
                 <SiteLogo alt={instance.title} className='h-7' />
               </Link>
@@ -57,8 +57,8 @@ const AuthLayout = () => {
             )}
           </header>
 
-          <div className='flex flex-col justify-center items-center'>
-            <div className='pb-10 sm:mx-auto w-full sm:max-w-lg md:max-w-2xl'>
+          <div className='flex flex-col items-center justify-center'>
+            <div className='w-full pb-10 sm:mx-auto sm:max-w-lg md:max-w-2xl'>
               <Card variant='rounded' size='xl'>
                 <CardBody>
                   <Switch>
diff --git a/app/soapbox/features/auth-login/components/captcha.tsx b/app/soapbox/features/auth-login/components/captcha.tsx
index d967c76a2a..dde5710f88 100644
--- a/app/soapbox/features/auth-login/components/captcha.tsx
+++ b/app/soapbox/features/auth-login/components/captcha.tsx
@@ -109,7 +109,7 @@ const NativeCaptchaField: React.FC<INativeCaptchaField> = ({ captcha, onChange,
 
   return (
     <Stack space={2}>
-      <div className='flex items-center justify-center bg-white w-full border border-solid border-gray-300 dark:border-gray-600 rounded-md'>
+      <div className='flex w-full items-center justify-center rounded-md border border-solid border-gray-300 bg-white dark:border-gray-600'>
         <img alt='captcha' src={captcha.get('url')} onClick={onClick} />
       </div>
 
diff --git a/app/soapbox/features/auth-login/components/consumers-list.tsx b/app/soapbox/features/auth-login/components/consumers-list.tsx
index 95f9e6b3ee..784077af94 100644
--- a/app/soapbox/features/auth-login/components/consumers-list.tsx
+++ b/app/soapbox/features/auth-login/components/consumers-list.tsx
@@ -17,7 +17,7 @@ const ConsumersList: React.FC<IConsumersList> = () => {
 
   if (providers.size > 0) {
     return (
-      <Card className='p-4 sm:rounded-xl bg-gray-50 dark:bg-primary-800'>
+      <Card className='bg-gray-50 p-4 dark:bg-primary-800 sm:rounded-xl'>
         <Text size='xs' theme='muted'>
           <FormattedMessage id='oauth_consumers.title' defaultMessage='Other ways to sign in' />
         </Text>
diff --git a/app/soapbox/features/auth-login/components/login-form.tsx b/app/soapbox/features/auth-login/components/login-form.tsx
index 5b1f6f7334..6df7341011 100644
--- a/app/soapbox/features/auth-login/components/login-form.tsx
+++ b/app/soapbox/features/auth-login/components/login-form.tsx
@@ -27,11 +27,11 @@ const LoginForm: React.FC<ILoginForm> = ({ isLoading, handleSubmit }) => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'><FormattedMessage id='login_form.header' defaultMessage='Sign In' /></h1>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'><FormattedMessage id='login_form.header' defaultMessage='Sign In' /></h1>
       </div>
 
-      <Stack className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto' space={5}>
+      <Stack className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2' space={5}>
         <Form onSubmit={handleSubmit}>
           <FormGroup labelText={intl.formatMessage(messages.username)}>
             <Input
diff --git a/app/soapbox/features/auth-login/components/otp-auth-form.tsx b/app/soapbox/features/auth-login/components/otp-auth-form.tsx
index 9a51051120..1622e24824 100644
--- a/app/soapbox/features/auth-login/components/otp-auth-form.tsx
+++ b/app/soapbox/features/auth-login/components/otp-auth-form.tsx
@@ -48,13 +48,13 @@ const OtpAuthForm: React.FC<IOtpAuthForm> = ({ mfa_token }) => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-600 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='login.otp_log_in' defaultMessage='OTP Login' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+      <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
         <Form onSubmit={handleSubmit}>
           <FormGroup
             labelText={intl.formatMessage(messages.otpCodeLabel)}
diff --git a/app/soapbox/features/auth-login/components/password-reset-confirm.tsx b/app/soapbox/features/auth-login/components/password-reset-confirm.tsx
index 620090a452..c931ac788f 100644
--- a/app/soapbox/features/auth-login/components/password-reset-confirm.tsx
+++ b/app/soapbox/features/auth-login/components/password-reset-confirm.tsx
@@ -59,13 +59,13 @@ const PasswordResetConfirm = () => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-600 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='reset_password.header' defaultMessage='Set New Password' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+      <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
         <Form onSubmit={handleSubmit}>
           <FormGroup labelText={<FormattedMessage id='reset_password.password.label' defaultMessage='Password' />} errors={renderErrors()}>
             <Input
diff --git a/app/soapbox/features/auth-login/components/password-reset.tsx b/app/soapbox/features/auth-login/components/password-reset.tsx
index ee4eadb2e3..85cedb03d2 100644
--- a/app/soapbox/features/auth-login/components/password-reset.tsx
+++ b/app/soapbox/features/auth-login/components/password-reset.tsx
@@ -35,13 +35,13 @@ const PasswordReset = () => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-600 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='password_reset.header' defaultMessage='Reset Password' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+      <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
         <Form onSubmit={handleSubmit}>
           <FormGroup labelText={intl.formatMessage(messages.nicknameOrEmail)}>
             <Input
diff --git a/app/soapbox/features/auth-token-list/index.tsx b/app/soapbox/features/auth-token-list/index.tsx
index db242ebe22..9548144492 100644
--- a/app/soapbox/features/auth-token-list/index.tsx
+++ b/app/soapbox/features/auth-token-list/index.tsx
@@ -41,7 +41,7 @@ const AuthToken: React.FC<IAuthToken> = ({ token, isCurrent }) => {
   };
 
   return (
-    <div className='p-4 rounded-lg bg-gray-100 dark:bg-primary-800'>
+    <div className='rounded-lg bg-gray-100 p-4 dark:bg-primary-800'>
       <Stack space={2}>
         <Stack>
           <Text size='md' weight='medium'>{token.app_name}</Text>
@@ -85,7 +85,7 @@ const AuthTokenList: React.FC = () => {
   }, []);
 
   const body = tokens ? (
-    <div className='grid grid-cols-1 sm:grid-cols-2 gap-4'>
+    <div className='grid grid-cols-1 gap-4 sm:grid-cols-2'>
       {tokens.map((token) => (
         <AuthToken key={token.id} token={token} isCurrent={token.id === currentTokenId} />
       ))}
diff --git a/app/soapbox/features/chats/components/chat-composer.tsx b/app/soapbox/features/chats/components/chat-composer.tsx
index 7ffc481463..165e7ce9d5 100644
--- a/app/soapbox/features/chats/components/chat-composer.tsx
+++ b/app/soapbox/features/chats/components/chat-composer.tsx
@@ -166,7 +166,7 @@ const ChatComposer = React.forwardRef<HTMLTextAreaElement | null, IChatComposer>
 
       <HStack alignItems='stretch' justifyContent='between' space={4}>
         {features.chatsMedia && (
-          <Stack justifyContent='end' alignItems='center' className='w-10 mb-1.5'>
+          <Stack justifyContent='end' alignItems='center' className='mb-1.5 w-10'>
             <UploadButton
               onSelectFile={onSelectFile}
               resetFileKey={resetFileKey}
@@ -216,7 +216,7 @@ const ChatComposer = React.forwardRef<HTMLTextAreaElement | null, IChatComposer>
           </Combobox>
         </Stack>
 
-        <Stack space={2} justifyContent='end' alignItems='center' className='w-10 mb-1.5'>
+        <Stack space={2} justifyContent='end' alignItems='center' className='mb-1.5 w-10'>
           {isOverCharacterLimit ? (
             <Text size='sm' theme='danger'>{overLimitText}</Text>
           ) : null}
diff --git a/app/soapbox/features/chats/components/chat-list-item.tsx b/app/soapbox/features/chats/components/chat-list-item.tsx
index 6099955e72..795a29a742 100644
--- a/app/soapbox/features/chats/components/chat-list-item.tsx
+++ b/app/soapbox/features/chats/components/chat-list-item.tsx
@@ -68,7 +68,7 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
       role='button'
       key={chat.id}
       onClick={() => onClick(chat)}
-      className='group px-2 py-3 w-full flex flex-col rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 focus:shadow-inset-ring'
+      className='group flex w-full flex-col rounded-lg px-2 py-3 hover:bg-gray-100 focus:shadow-inset-ring dark:hover:bg-gray-800'
       data-testid='chat-list-item'
     >
       <HStack alignItems='center' justifyContent='between' space={2} className='w-full'>
@@ -76,7 +76,7 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
           <Avatar src={chat.account?.avatar} size={40} className='flex-none' />
 
           <Stack alignItems='start' className='overflow-hidden'>
-            <div className='flex items-center space-x-1 flex-grow w-full'>
+            <div className='flex w-full grow items-center space-x-1'>
               <Text weight='bold' size='sm' align='left' truncate>{chat.account?.display_name || `@${chat.account.username}`}</Text>
               {chat.account?.verified && <VerificationBadge />}
             </div>
@@ -88,7 +88,7 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
                 weight='medium'
                 theme='muted'
                 truncate
-                className='w-full h-5 pointer-events-none italic'
+                className='pointer-events-none h-5 w-full italic'
                 data-testid='chat-last-message'
               >
                 {intl.formatMessage(isBlocked ? messages.blockedYou : messages.blocking)}
@@ -102,7 +102,7 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
                     weight='medium'
                     theme={chat.last_message.unread ? 'default' : 'muted'}
                     truncate
-                    className='w-full h-5 truncate-child pointer-events-none'
+                    className='truncate-child pointer-events-none h-5 w-full'
                     data-testid='chat-last-message'
                     dangerouslySetInnerHTML={{ __html: chat.last_message?.content }}
                   />
@@ -114,12 +114,12 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
 
         <HStack alignItems='center' space={2}>
           {features.chatsDelete && (
-            <div className='text-gray-600 hidden group-hover:block hover:text-gray-100'>
+            <div className='hidden text-gray-600 hover:text-gray-100 group-hover:block'>
               <DropdownMenuContainer items={menu}>
                 <IconButton
                   src={require('@tabler/icons/dots.svg')}
                   title='Settings'
-                  className='text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500'
+                  className='text-gray-600 hover:text-gray-700 dark:text-gray-600 dark:hover:text-gray-500'
                   iconClassName='w-4 h-4'
                 />
               </DropdownMenuContainer>
@@ -130,7 +130,7 @@ const ChatListItem: React.FC<IChatListItemInterface> = ({ chat, onClick }) => {
             <>
               {chat.last_message.unread && (
                 <div
-                  className='w-2 h-2 rounded-full bg-secondary-500'
+                  className='h-2 w-2 rounded-full bg-secondary-500'
                   data-testid='chat-unread-indicator'
                 />
               )}
diff --git a/app/soapbox/features/chats/components/chat-message-list-intro.tsx b/app/soapbox/features/chats/components/chat-message-list-intro.tsx
index 760afc200c..a827114c8f 100644
--- a/app/soapbox/features/chats/components/chat-message-list-intro.tsx
+++ b/app/soapbox/features/chats/components/chat-message-list-intro.tsx
@@ -106,8 +106,8 @@ const ChatMessageListIntro = () => {
           </Button>
         </HStack>
       ) : (
-        <HStack justifyContent='center' alignItems='center' space={1} className='flex-shrink-0'>
-          <Icon src={require('@tabler/icons/clock.svg')} className='text-gray-600 w-4 h-4' />
+        <HStack justifyContent='center' alignItems='center' space={1} className='shrink-0'>
+          <Icon src={require('@tabler/icons/clock.svg')} className='h-4 w-4 text-gray-600' />
           {chat.message_expiration && (
             <Text size='sm' theme='muted'>
               {intl.formatMessage(messages.messageLifespan, { day: secondsToDays(chat.message_expiration) })}
diff --git a/app/soapbox/features/chats/components/chat-message-list.tsx b/app/soapbox/features/chats/components/chat-message-list.tsx
index 0f2bebf289..27280d6734 100644
--- a/app/soapbox/features/chats/components/chat-message-list.tsx
+++ b/app/soapbox/features/chats/components/chat-message-list.tsx
@@ -304,7 +304,7 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
                   <IconButton
                     src={require('@tabler/icons/dots.svg')}
                     title={intl.formatMessage(messages.more)}
-                    className='text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500'
+                    className='text-gray-600 hover:text-gray-700 dark:text-gray-600 dark:hover:text-gray-500'
                     iconClassName='w-4 h-4'
                   />
                 </DropdownMenuContainer>
@@ -378,12 +378,12 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
                 {(isMyMessage && features.chatsReadReceipts) ? (
                   <>
                     {isRead ? (
-                      <span className='rounded-full flex flex-col items-center justify-center p-0.5 bg-primary-500 text-white dark:bg-primary-400 dark:text-primary-900 border border-solid border-primary-500 dark:border-primary-400'>
-                        <Icon src={require('@tabler/icons/check.svg')} strokeWidth={3} className='w-2.5 h-2.5' />
+                      <span className='flex flex-col items-center justify-center rounded-full border border-solid border-primary-500 bg-primary-500 p-0.5 text-white dark:border-primary-400 dark:bg-primary-400 dark:text-primary-900'>
+                        <Icon src={require('@tabler/icons/check.svg')} strokeWidth={3} className='h-2.5 w-2.5' />
                       </span>
                     ) : (
-                      <span className='rounded-full flex flex-col items-center justify-center p-0.5 bg-transparent text-primary-500 dark:text-primary-400 border border-solid border-primary-500 dark:border-primary-400'>
-                        <Icon src={require('@tabler/icons/check.svg')} strokeWidth={3} className='w-2.5 h-2.5' />
+                      <span className='flex flex-col items-center justify-center rounded-full border border-solid border-primary-500 bg-transparent p-0.5 text-primary-500 dark:border-primary-400 dark:text-primary-400'>
+                        <Icon src={require('@tabler/icons/check.svg')} strokeWidth={3} className='h-2.5 w-2.5' />
                       </span>
                     )}
                   </>
@@ -418,7 +418,7 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
 
   if (isBlocked) {
     return (
-      <Stack alignItems='center' justifyContent='center' className='h-full flex-grow'>
+      <Stack alignItems='center' justifyContent='center' className='h-full grow'>
         <Stack alignItems='center' space={2}>
           <Avatar src={chat.account.avatar} size={75} />
           <Text align='center'>
@@ -435,7 +435,7 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
 
   if (isError) {
     return (
-      <Stack alignItems='center' justifyContent='center' className='h-full flex-grow'>
+      <Stack alignItems='center' justifyContent='center' className='h-full grow'>
         <Stack space={4}>
           <Stack space={1}>
             <Text size='lg' weight='bold' align='center'>
@@ -458,7 +458,7 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
 
   if (isLoading) {
     return (
-      <div className='flex-grow flex flex-col justify-end pb-4'>
+      <div className='flex grow flex-col justify-end pb-4'>
         <div className='px-4'>
           <PlaceholderChatMessage isMyMessage />
           <PlaceholderChatMessage />
@@ -471,8 +471,8 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat }) => {
   }
 
   return (
-    <div className='h-full flex flex-col flex-grow space-y-6'>
-      <div className='flex-grow flex flex-col justify-end'>
+    <div className='flex h-full grow flex-col space-y-6'>
+      <div className='flex grow flex-col justify-end'>
         <Virtuoso
           ref={node}
           alignToBottom
diff --git a/app/soapbox/features/chats/components/chat-page/chat-page.tsx b/app/soapbox/features/chats/components/chat-page/chat-page.tsx
index dbe50d3855..20ddafd3e1 100644
--- a/app/soapbox/features/chats/components/chat-page/chat-page.tsx
+++ b/app/soapbox/features/chats/components/chat-page/chat-page.tsx
@@ -60,11 +60,11 @@ const ChatPage: React.FC<IChatPage> = ({ chatId }) => {
     <div
       ref={containerRef}
       style={{ height }}
-      className='h-screen bg-white dark:bg-primary-900 text-gray-900 dark:text-gray-100 shadow-lg dark:shadow-none overflow-hidden sm:rounded-t-xl'
+      className='h-screen overflow-hidden bg-white text-gray-900 shadow-lg dark:bg-primary-900 dark:text-gray-100 dark:shadow-none sm:rounded-t-xl'
     >
       {isOnboarded ? (
         <div
-          className='grid grid-cols-9 overflow-hidden h-full dark:divide-x-2 dark:divide-solid dark:divide-gray-800'
+          className='grid h-full grid-cols-9 overflow-hidden dark:divide-x-2 dark:divide-solid dark:divide-gray-800'
           data-testid='chat-page'
         >
           <Stack
diff --git a/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx b/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx
index f2d8a38f51..18f177f24f 100644
--- a/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx
@@ -16,7 +16,7 @@ const BlankslateEmpty: React.FC<IBlankslate> = () => {
   };
 
   return (
-    <Stack space={6} alignItems='center' justifyContent='center' className='p-6 h-full'>
+    <Stack space={6} alignItems='center' justifyContent='center' className='h-full p-6'>
       <Stack space={2} className='max-w-sm'>
         <Text size='2xl' weight='bold' tag='h2' align='center'>
           <FormattedMessage
diff --git a/app/soapbox/features/chats/components/chat-page/components/blankslate-with-chats.tsx b/app/soapbox/features/chats/components/chat-page/components/blankslate-with-chats.tsx
index 4285df0b9d..956672a192 100644
--- a/app/soapbox/features/chats/components/chat-page/components/blankslate-with-chats.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/blankslate-with-chats.tsx
@@ -13,7 +13,7 @@ const BlankslateWithChats = () => {
   };
 
   return (
-    <Stack space={6} alignItems='center' justifyContent='center' className='p-6 h-full'>
+    <Stack space={6} alignItems='center' justifyContent='center' className='h-full p-6'>
       <Stack space={2} className='max-w-sm'>
         <Text size='2xl' weight='bold' tag='h2' align='center'>
           <FormattedMessage
diff --git a/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx b/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx
index da838f0cb4..e365c49cc7 100644
--- a/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx
@@ -116,12 +116,12 @@ const ChatPageMain = () => {
 
   return (
     <Stack className='h-full overflow-hidden'>
-      <HStack alignItems='center' justifyContent='between' space={2} className='px-4 py-4 w-full'>
+      <HStack alignItems='center' justifyContent='between' space={2} className='w-full p-4'>
         <HStack alignItems='center' space={2} className='overflow-hidden'>
           <HStack alignItems='center'>
             <IconButton
               src={require('@tabler/icons/arrow-left.svg')}
-              className='sm:hidden h-7 w-7 mr-2 sm:mr-0'
+              className='mr-2 h-7 w-7 sm:mr-0 sm:hidden'
               onClick={() => history.push('/chats')}
             />
 
@@ -130,8 +130,8 @@ const ChatPageMain = () => {
             </Link>
           </HStack>
 
-          <Stack alignItems='start' className='overflow-hidden h-11'>
-            <div className='flex items-center space-x-1 flex-grow w-full'>
+          <Stack alignItems='start' className='h-11 overflow-hidden'>
+            <div className='flex w-full grow items-center space-x-1'>
               <Link to={`/@${chat.account.acct}`}>
                 <Text weight='bold' size='sm' align='left' truncate>
                   {chat.account.display_name || `@${chat.account.username}`}
@@ -212,8 +212,8 @@ const ChatPageMain = () => {
                   onSelect={isBlocking ? handleUnblockUser : handleBlockUser}
                   className='!px-0 hover:!bg-transparent'
                 >
-                  <div className='w-full flex items-center space-x-2 font-bold text-sm text-primary-500 dark:text-accent-blue'>
-                    <Icon src={require('@tabler/icons/ban.svg')} className='w-5 h-5' />
+                  <div className='flex w-full items-center space-x-2 text-sm font-bold text-primary-500 dark:text-accent-blue'>
+                    <Icon src={require('@tabler/icons/ban.svg')} className='h-5 w-5' />
                     <span>{intl.formatMessage(isBlocking ? messages.unblockUser : messages.blockUser, { acct: chat.account.acct })}</span>
                   </div>
                 </MenuItem>
@@ -224,8 +224,8 @@ const ChatPageMain = () => {
                     onSelect={handleLeaveChat}
                     className='!px-0 hover:!bg-transparent'
                   >
-                    <div className='w-full flex items-center space-x-2 font-bold text-sm text-danger-600 dark:text-danger-500'>
-                      <Icon src={require('@tabler/icons/logout.svg')} className='w-5 h-5' />
+                    <div className='flex w-full items-center space-x-2 text-sm font-bold text-danger-600 dark:text-danger-500'>
+                      <Icon src={require('@tabler/icons/logout.svg')} className='h-5 w-5' />
                       <span>{intl.formatMessage(messages.leaveChat)}</span>
                     </div>
                   </MenuItem>
diff --git a/app/soapbox/features/chats/components/chat-page/components/chat-page-new.tsx b/app/soapbox/features/chats/components/chat-page/components/chat-page-new.tsx
index db2f46a221..0b1e0de8d0 100644
--- a/app/soapbox/features/chats/components/chat-page/components/chat-page-new.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-new.tsx
@@ -20,11 +20,11 @@ const ChatPageNew: React.FC<IChatPageNew> = () => {
 
   return (
     <Stack className='h-full space-y-4'>
-      <Stack className='flex-grow pt-6 px-4 sm:px-6'>
+      <Stack className='grow px-4 pt-6 sm:px-6'>
         <HStack alignItems='center'>
           <IconButton
             src={require('@tabler/icons/arrow-left.svg')}
-            className='sm:hidden h-7 w-7 mr-2 sm:mr-0'
+            className='mr-2 h-7 w-7 sm:mr-0 sm:hidden'
             onClick={() => history.push('/chats')}
           />
 
diff --git a/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx b/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx
index 7a9a813fed..04566f7ca1 100644
--- a/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-settings.tsx
@@ -47,11 +47,11 @@ const ChatPageSettings = () => {
   };
 
   return (
-    <Stack className='h-full py-6 px-4 sm:p-6 space-y-8'>
+    <Stack className='h-full space-y-8 py-6 px-4 sm:p-6'>
       <HStack alignItems='center'>
         <IconButton
           src={require('@tabler/icons/arrow-left.svg')}
-          className='sm:hidden h-7 w-7 mr-2 sm:mr-0'
+          className='mr-2 h-7 w-7 sm:mr-0 sm:hidden'
           onClick={() => history.push('/chats')}
         />
 
diff --git a/app/soapbox/features/chats/components/chat-page/components/chat-page-sidebar.tsx b/app/soapbox/features/chats/components/chat-page/components/chat-page-sidebar.tsx
index 6f19948dee..89e586968e 100644
--- a/app/soapbox/features/chats/components/chat-page/components/chat-page-sidebar.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-sidebar.tsx
@@ -64,7 +64,7 @@ const ChatPageSidebar = () => {
         )}
       </Stack>
 
-      <Stack className='flex-grow h-full'>
+      <Stack className='h-full grow'>
         <ChatList
           onClickChat={handleClickChat}
           searchValue={debouncedSearch}
diff --git a/app/soapbox/features/chats/components/chat-page/components/welcome.tsx b/app/soapbox/features/chats/components/chat-page/components/welcome.tsx
index 376d206272..090d3326d2 100644
--- a/app/soapbox/features/chats/components/chat-page/components/welcome.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/welcome.tsx
@@ -36,9 +36,9 @@ const Welcome = () => {
   };
 
   return (
-    <Stack className='py-20 px-4 sm:px-0 h-full overflow-y-auto' data-testid='chats-welcome'>
-      <div className='w-full sm:w-3/5 xl:w-2/5 mx-auto mb-2.5'>
-        <Text align='center' weight='bold' className='mb-6 text-2xl md:text-3xl leading-8'>
+    <Stack className='h-full overflow-y-auto py-20 px-4 sm:px-0' data-testid='chats-welcome'>
+      <div className='mx-auto mb-2.5 w-full sm:w-3/5 xl:w-2/5'>
+        <Text align='center' weight='bold' className='mb-6 text-2xl leading-8 md:text-3xl'>
           {intl.formatMessage(messages.title, { br: <br /> })}
         </Text>
 
@@ -47,7 +47,7 @@ const Welcome = () => {
         </Text>
       </div>
 
-      <Form onSubmit={handleSubmit} className='space-y-8 w-full sm:w-2/3 lg:w-3/5 sm:mx-auto'>
+      <Form onSubmit={handleSubmit} className='w-full space-y-8 sm:mx-auto sm:w-2/3 lg:w-3/5'>
         <Stack space={2}>
           <CardTitle title={<FormattedMessage id='chat.page_settings.privacy' defaultMessage='Privacy' />} />
 
diff --git a/app/soapbox/features/chats/components/chat-pane/blankslate.tsx b/app/soapbox/features/chats/components/chat-pane/blankslate.tsx
index d817a8f488..abef2d1941 100644
--- a/app/soapbox/features/chats/components/chat-pane/blankslate.tsx
+++ b/app/soapbox/features/chats/components/chat-pane/blankslate.tsx
@@ -20,11 +20,11 @@ const Blankslate = ({ onSearch }: IBlankslate) => {
     <Stack
       alignItems='center'
       justifyContent='center'
-      className='h-full flex-grow'
+      className='h-full grow'
       data-testid='chat-pane-blankslate'
     >
       <Stack space={4}>
-        <Stack space={1} className='max-w-[80%] mx-auto'>
+        <Stack space={1} className='mx-auto max-w-[80%]'>
           <Text size='lg' weight='bold' align='center'>
             {intl.formatMessage(messages.title)}
           </Text>
diff --git a/app/soapbox/features/chats/components/chat-pane/chat-pane.tsx b/app/soapbox/features/chats/components/chat-pane/chat-pane.tsx
index 59953b54c2..026eb08e4f 100644
--- a/app/soapbox/features/chats/components/chat-pane/chat-pane.tsx
+++ b/app/soapbox/features/chats/components/chat-pane/chat-pane.tsx
@@ -45,7 +45,7 @@ const ChatPane = () => {
   const renderBody = () => {
     if (hasSearchValue || Number(chats?.length) > 0 || isLoading) {
       return (
-        <Stack space={4} className='flex-grow h-full'>
+        <Stack space={4} className='h-full grow'>
           {features.chatsSearch && (
             <div className='px-4'>
               <ChatSearchInput
diff --git a/app/soapbox/features/chats/components/chat-pending-upload.tsx b/app/soapbox/features/chats/components/chat-pending-upload.tsx
index 2694f1bcbc..373d548ce1 100644
--- a/app/soapbox/features/chats/components/chat-pending-upload.tsx
+++ b/app/soapbox/features/chats/components/chat-pending-upload.tsx
@@ -9,7 +9,7 @@ interface IChatPendingUpload {
 /** Displays a loading thumbnail for an upload in the chat composer. */
 const ChatPendingUpload: React.FC<IChatPendingUpload> = ({ progress }) => {
   return (
-    <div className='relative p-4 inline-flex items-center justify-center w-24 h-24 rounded-lg overflow-hidden isolate bg-gray-200 dark:bg-primary-900'>
+    <div className='relative isolate inline-flex h-24 w-24 items-center justify-center overflow-hidden rounded-lg bg-gray-200 p-4 dark:bg-primary-900'>
       <ProgressBar progress={progress} size='sm' />
     </div>
   );
diff --git a/app/soapbox/features/chats/components/chat-search/blankslate.tsx b/app/soapbox/features/chats/components/chat-search/blankslate.tsx
index ed2583e9f6..f4ffd748ba 100644
--- a/app/soapbox/features/chats/components/chat-search/blankslate.tsx
+++ b/app/soapbox/features/chats/components/chat-search/blankslate.tsx
@@ -12,7 +12,7 @@ const Blankslate = () => {
   const intl = useIntl();
 
   return (
-    <Stack justifyContent='center' alignItems='center' space={2} className='h-full w-2/3 mx-auto'>
+    <Stack justifyContent='center' alignItems='center' space={2} className='mx-auto h-full w-2/3'>
       <Text weight='bold' size='lg' align='center'>
         {intl.formatMessage(messages.title)}
       </Text>
diff --git a/app/soapbox/features/chats/components/chat-search/chat-search.tsx b/app/soapbox/features/chats/components/chat-search/chat-search.tsx
index c10dc61c53..8197ac5f54 100644
--- a/app/soapbox/features/chats/components/chat-search/chat-search.tsx
+++ b/app/soapbox/features/chats/components/chat-search/chat-search.tsx
@@ -88,7 +88,7 @@ const ChatSearch = (props: IChatSearch) => {
   };
 
   return (
-    <Stack space={4} className='flex-grow h-full'>
+    <Stack space={4} className='h-full grow'>
       <div className='px-4'>
         <Input
           data-testid='search'
@@ -111,7 +111,7 @@ const ChatSearch = (props: IChatSearch) => {
         />
       </div>
 
-      <Stack className='flex-grow'>
+      <Stack className='grow'>
         {renderBody()}
       </Stack>
     </Stack>
diff --git a/app/soapbox/features/chats/components/chat-search/empty-results-blankslate.tsx b/app/soapbox/features/chats/components/chat-search/empty-results-blankslate.tsx
index 3e360347ee..4a890f699a 100644
--- a/app/soapbox/features/chats/components/chat-search/empty-results-blankslate.tsx
+++ b/app/soapbox/features/chats/components/chat-search/empty-results-blankslate.tsx
@@ -12,7 +12,7 @@ const EmptyResultsBlankslate = () => {
   const intl = useIntl();
 
   return (
-    <Stack justifyContent='center' alignItems='center' space={2} className='h-full w-2/3 mx-auto'>
+    <Stack justifyContent='center' alignItems='center' space={2} className='mx-auto h-full w-2/3'>
       <Text weight='bold' size='lg' align='center' data-testid='no-results'>
         {intl.formatMessage(messages.title)}
       </Text>
diff --git a/app/soapbox/features/chats/components/chat-search/results.tsx b/app/soapbox/features/chats/components/chat-search/results.tsx
index ae1caa4e14..7bd7ac0e05 100644
--- a/app/soapbox/features/chats/components/chat-search/results.tsx
+++ b/app/soapbox/features/chats/components/chat-search/results.tsx
@@ -29,7 +29,7 @@ const Results = ({ accountSearchResult, onSelect }: IResults) => {
     <button
       key={account.id}
       type='button'
-      className='px-2 py-3 w-full rounded-lg flex flex-col hover:bg-gray-100 dark:hover:bg-gray-800'
+      className='flex w-full flex-col rounded-lg px-2 py-3 hover:bg-gray-100 dark:hover:bg-gray-800'
       onClick={() => onSelect(account.id)}
       data-testid='account'
     >
@@ -37,7 +37,7 @@ const Results = ({ accountSearchResult, onSelect }: IResults) => {
         <Avatar src={account.avatar} size={40} />
 
         <Stack alignItems='start'>
-          <div className='flex items-center space-x-1 flex-grow'>
+          <div className='flex grow items-center space-x-1'>
             <Text weight='bold' size='sm' truncate>{account.display_name}</Text>
             {account.verified && <VerificationBadge />}
           </div>
@@ -48,7 +48,7 @@ const Results = ({ accountSearchResult, onSelect }: IResults) => {
   ), []);
 
   return (
-    <div className='relative flex-grow'>
+    <div className='relative grow'>
       <Virtuoso
         data={accounts}
         itemContent={(index, chat) => (
diff --git a/app/soapbox/features/chats/components/chat-textarea.tsx b/app/soapbox/features/chats/components/chat-textarea.tsx
index 79baa882ea..f58e223acf 100644
--- a/app/soapbox/features/chats/components/chat-textarea.tsx
+++ b/app/soapbox/features/chats/components/chat-textarea.tsx
@@ -23,15 +23,15 @@ const ChatTextarea: React.FC<IChatTextarea> = ({
 }) => {
   return (
     <div className={`
-      bg-white
-      dark:bg-gray-800
-      shadow-sm block w-full
-      sm:text-sm rounded-md
-      text-gray-900 dark:text-gray-100
-      border
-      placeholder:text-gray-600 dark:placeholder:text-gray-600 border-gray-400 dark:border-gray-800
-      dark:ring-1 focus-within:ring-1 dark:ring-gray-800 focus-within:ring-primary-500 focus-within:border-primary-500
-      dark:focus-within:ring-primary-500 dark:focus-within:border-primary-500
+      block
+      w-full
+      rounded-md border border-gray-400
+      bg-white text-gray-900
+      shadow-sm placeholder:text-gray-600
+      focus-within:border-primary-500
+      focus-within:ring-1 focus-within:ring-primary-500 dark:border-gray-800 dark:bg-gray-800
+      dark:text-gray-100 dark:ring-1 dark:ring-gray-800 dark:placeholder:text-gray-600 dark:focus-within:border-primary-500
+      dark:focus-within:ring-primary-500 sm:text-sm
     `}
     >
       {(!!attachments?.length || isUploading) && (
diff --git a/app/soapbox/features/chats/components/chat-upload-preview.tsx b/app/soapbox/features/chats/components/chat-upload-preview.tsx
index b797dba09b..14864fd918 100644
--- a/app/soapbox/features/chats/components/chat-upload-preview.tsx
+++ b/app/soapbox/features/chats/components/chat-upload-preview.tsx
@@ -23,7 +23,7 @@ const ChatUploadPreview: React.FC<IChatUploadPreview> = ({ className, attachment
     case 'image':
       return (
         <img
-          className='w-full h-full object-cover pointer-events-none'
+          className='pointer-events-none h-full w-full object-cover'
           src={attachment.preview_url}
           alt=''
         />
@@ -31,7 +31,7 @@ const ChatUploadPreview: React.FC<IChatUploadPreview> = ({ className, attachment
     case 'video':
       return (
         <video
-          className='w-full h-full object-cover pointer-events-none'
+          className='pointer-events-none h-full w-full object-cover'
           src={attachment.preview_url}
           autoPlay
           playsInline
@@ -42,9 +42,9 @@ const ChatUploadPreview: React.FC<IChatUploadPreview> = ({ className, attachment
       );
     default:
       return (
-        <div className='w-full h-full flex items-center justify-center pointer-events-none'>
+        <div className='pointer-events-none flex h-full w-full items-center justify-center'>
           <Icon
-            className='h-16 w-16 mx-auto my-12 text-gray-800 dark:text-gray-200'
+            className='mx-auto my-12 h-16 w-16 text-gray-800 dark:text-gray-200'
             src={MIMETYPE_ICONS[mimeType || ''] || defaultIcon}
           />
         </div>
diff --git a/app/soapbox/features/chats/components/chat-upload.tsx b/app/soapbox/features/chats/components/chat-upload.tsx
index 0e7aa8fdac..5d2fe1a724 100644
--- a/app/soapbox/features/chats/components/chat-upload.tsx
+++ b/app/soapbox/features/chats/components/chat-upload.tsx
@@ -26,8 +26,8 @@ const ChatUpload: React.FC<IChatUpload> = ({ attachment, onDelete }) => {
   };
 
   return (
-    <div className='relative inline-block w-24 h-24 rounded-lg overflow-hidden isolate bg-gray-200 dark:bg-primary-900'>
-      <Blurhash hash={attachment.blurhash} className='absolute inset-0 w-full h-full -z-10' />
+    <div className='relative isolate inline-block h-24 w-24 overflow-hidden rounded-lg bg-gray-200 dark:bg-primary-900'>
+      <Blurhash hash={attachment.blurhash} className='absolute inset-0 -z-10 h-full w-full' />
 
       <div className='absolute right-[6px] top-[6px]'>
         <RemoveButton onClick={onDelete} />
@@ -35,7 +35,7 @@ const ChatUpload: React.FC<IChatUpload> = ({ attachment, onDelete }) => {
 
       <button
         onClick={clickable ? handleOpenModal : undefined}
-        className={clsx('w-full h-full', { 'cursor-zoom-in': clickable, 'cursor-default': !clickable })}
+        className={clsx('h-full w-full', { 'cursor-zoom-in': clickable, 'cursor-default': !clickable })}
       >
         <ChatUploadPreview attachment={attachment} />
       </button>
@@ -53,10 +53,10 @@ const RemoveButton: React.FC<IRemoveButton> = ({ onClick }) => {
     <button
       type='button'
       onClick={onClick}
-      className='bg-secondary-500 w-5 h-5 p-1 rounded-full flex items-center justify-center'
+      className='flex h-5 w-5 items-center justify-center rounded-full bg-secondary-500 p-1'
     >
       <Icon
-        className='w-4 h-4 text-white'
+        className='h-4 w-4 text-white'
         src={require('@tabler/icons/x.svg')}
       />
     </button>
diff --git a/app/soapbox/features/chats/components/chat-widget/chat-pane-header.tsx b/app/soapbox/features/chats/components/chat-widget/chat-pane-header.tsx
index 20967d1715..36c4a4f808 100644
--- a/app/soapbox/features/chats/components/chat-widget/chat-pane-header.tsx
+++ b/app/soapbox/features/chats/components/chat-widget/chat-pane-header.tsx
@@ -31,9 +31,9 @@ const ChatPaneHeader = (props: IChatPaneHeader) => {
   }
 
   return (
-    <HStack {...rest} alignItems='center' justifyContent='between' className='rounded-t-xl h-16 py-3 px-4'>
+    <HStack {...rest} alignItems='center' justifyContent='between' className='h-16 rounded-t-xl py-3 px-4'>
       <ButtonComp
-        className='flex-grow flex items-center flex-row space-x-1 h-16'
+        className='flex h-16 grow flex-row items-center space-x-1'
         data-testid='title'
         {...buttonProps}
       >
@@ -47,7 +47,7 @@ const ChatPaneHeader = (props: IChatPaneHeader) => {
               ({unreadCount})
             </Text>
 
-            <div className='bg-accent-300 w-2.5 h-2.5 rounded-full' />
+            <div className='h-2.5 w-2.5 rounded-full bg-accent-300' />
           </HStack>
         )}
       </ButtonComp>
diff --git a/app/soapbox/features/chats/components/chat-widget/chat-settings.tsx b/app/soapbox/features/chats/components/chat-widget/chat-settings.tsx
index bc63b2830f..5a38778e05 100644
--- a/app/soapbox/features/chats/components/chat-widget/chat-settings.tsx
+++ b/app/soapbox/features/chats/components/chat-widget/chat-settings.tsx
@@ -107,7 +107,7 @@ const ChatSettings = () => {
         }
       />
 
-      <Stack space={4} className='w-5/6 mx-auto'>
+      <Stack space={4} className='mx-auto w-5/6'>
         <HStack alignItems='center' space={3}>
           <Avatar src={chat.account.avatar_static} size={50} />
           <Stack>
@@ -135,14 +135,14 @@ const ChatSettings = () => {
         )}
 
         <Stack space={5}>
-          <button onClick={isBlocking ? handleUnblockUser : handleBlockUser} className='w-full flex items-center space-x-2 font-bold text-sm text-primary-600 dark:text-accent-blue'>
-            <Icon src={require('@tabler/icons/ban.svg')} className='w-5 h-5' />
+          <button onClick={isBlocking ? handleUnblockUser : handleBlockUser} className='flex w-full items-center space-x-2 text-sm font-bold text-primary-600 dark:text-accent-blue'>
+            <Icon src={require('@tabler/icons/ban.svg')} className='h-5 w-5' />
             <span>{intl.formatMessage(isBlocking ? messages.unblockUser : messages.blockUser, { acct: chat.account.acct })}</span>
           </button>
 
           {features.chatsDelete && (
-            <button onClick={handleLeaveChat} className='w-full flex items-center space-x-2 font-bold text-sm text-danger-600'>
-              <Icon src={require('@tabler/icons/logout.svg')} className='w-5 h-5' />
+            <button onClick={handleLeaveChat} className='flex w-full items-center space-x-2 text-sm font-bold text-danger-600'>
+              <Icon src={require('@tabler/icons/logout.svg')} className='h-5 w-5' />
               <span>{intl.formatMessage(messages.leaveChat)}</span>
             </button>
           )}
diff --git a/app/soapbox/features/chats/components/chat-widget/chat-window.tsx b/app/soapbox/features/chats/components/chat-widget/chat-window.tsx
index 22ae66a7aa..e2476eb93d 100644
--- a/app/soapbox/features/chats/components/chat-widget/chat-window.tsx
+++ b/app/soapbox/features/chats/components/chat-widget/chat-window.tsx
@@ -87,7 +87,7 @@ const ChatWindow = () => {
 
               <Stack alignItems='start'>
                 <LinkWrapper enabled={isOpen} to={`/@${chat.account.acct}`}>
-                  <div className='flex items-center space-x-1 flex-grow'>
+                  <div className='flex grow items-center space-x-1'>
                     <Text size='sm' weight='bold' truncate>{chat.account.display_name || `@${chat.account.acct}`}</Text>
                     {chat.account.verified && <VerificationBadge />}
                   </div>
@@ -113,7 +113,7 @@ const ChatWindow = () => {
         onToggle={toggleChatPane}
       />
 
-      <Stack className='overflow-hidden flex-grow h-full' space={2}>
+      <Stack className='h-full grow overflow-hidden' space={2}>
         <Chat chat={chat} inputRef={inputRef} />
       </Stack>
     </>
diff --git a/app/soapbox/features/chats/components/chat.tsx b/app/soapbox/features/chats/components/chat.tsx
index 1417b1d9b2..9243dd0f4e 100644
--- a/app/soapbox/features/chats/components/chat.tsx
+++ b/app/soapbox/features/chats/components/chat.tsx
@@ -158,7 +158,7 @@ const Chat: React.FC<ChatInterface> = ({ chat, inputRef, className }) => {
 
   return (
     <Stack className={classNames('overflow-hidden flex flex-grow', className)} onMouseOver={handleMouseOver}>
-      <div className='flex-grow h-full overflow-hidden flex justify-center'>
+      <div className='flex h-full grow justify-center overflow-hidden'>
         <ChatMessageList chat={chat} />
       </div>
 
diff --git a/app/soapbox/features/compose/components/polls/duration-selector.tsx b/app/soapbox/features/compose/components/polls/duration-selector.tsx
index 10027824ef..16c54d3e10 100644
--- a/app/soapbox/features/compose/components/polls/duration-selector.tsx
+++ b/app/soapbox/features/compose/components/polls/duration-selector.tsx
@@ -42,7 +42,7 @@ const DurationSelector = ({ onDurationChange }: IDurationSelector) => {
   }, [value]);
 
   return (
-    <div className='grid grid-cols-1 gap-y-2 gap-x-2 sm:grid-cols-3'>
+    <div className='grid grid-cols-1 gap-2 sm:grid-cols-3'>
       <div className='sm:col-span-1'>
         <Select
           value={days}
diff --git a/app/soapbox/features/compose/components/polls/poll-form.tsx b/app/soapbox/features/compose/components/polls/poll-form.tsx
index 5780cab1bd..2d3233f8da 100644
--- a/app/soapbox/features/compose/components/polls/poll-form.tsx
+++ b/app/soapbox/features/compose/components/polls/poll-form.tsx
@@ -79,7 +79,7 @@ const Option: React.FC<IOption> = ({
         </div>
 
         <AutosuggestInput
-          className='rounded-md dark:!bg-transparent !bg-transparent'
+          className='rounded-md !bg-transparent dark:!bg-transparent'
           placeholder={intl.formatMessage(messages.option_placeholder, { number: index + 1 })}
           maxLength={maxChars}
           value={title}
diff --git a/app/soapbox/features/compose/components/reply-indicator.tsx b/app/soapbox/features/compose/components/reply-indicator.tsx
index 86fd3a376f..5c11a1ff8c 100644
--- a/app/soapbox/features/compose/components/reply-indicator.tsx
+++ b/app/soapbox/features/compose/components/reply-indicator.tsx
@@ -33,7 +33,7 @@ const ReplyIndicator: React.FC<IReplyIndicator> = ({ status, hideActions, onCanc
   }
 
   return (
-    <Stack space={2} className='p-4 rounded-lg bg-gray-100 dark:bg-gray-800'>
+    <Stack space={2} className='rounded-lg bg-gray-100 p-4 dark:bg-gray-800'>
       <AccountContainer
         {...actions}
         id={status.getIn(['account', 'id']) as string}
@@ -44,7 +44,7 @@ const ReplyIndicator: React.FC<IReplyIndicator> = ({ status, hideActions, onCanc
       />
 
       <Text
-        className='break-words status__content'
+        className='status__content break-words'
         size='sm'
         dangerouslySetInnerHTML={{ __html: status.contentHtml }}
         direction={isRtl(status.search_index) ? 'rtl' : 'ltr'}
diff --git a/app/soapbox/features/compose/components/search-results.tsx b/app/soapbox/features/compose/components/search-results.tsx
index 225308d6b1..0e5db15c91 100644
--- a/app/soapbox/features/compose/components/search-results.tsx
+++ b/app/soapbox/features/compose/components/search-results.tsx
@@ -236,7 +236,7 @@ const SearchResults = () => {
   return (
     <>
       {filterByAccount ? (
-        <HStack className='mb-4 pb-4 px-2 border-solid border-b border-gray-200 dark:border-gray-800' space={2}>
+        <HStack className='mb-4 border-b border-solid border-gray-200 px-2 pb-4 dark:border-gray-800' space={2}>
           <IconButton iconClassName='h-5 w-5' src={require('@tabler/icons/x.svg')} onClick={handleUnsetAccount} />
           <Text>
             <FormattedMessage
diff --git a/app/soapbox/features/compose/components/search.tsx b/app/soapbox/features/compose/components/search.tsx
index 5c7db5f05b..9e1c21a44c 100644
--- a/app/soapbox/features/compose/components/search.tsx
+++ b/app/soapbox/features/compose/components/search.tsx
@@ -149,7 +149,7 @@ const Search = (props: ISearch) => {
         <div
           role='button'
           tabIndex={0}
-          className='absolute inset-y-0 right-0 rtl:left-0 rtl:right-auto px-3 flex items-center cursor-pointer'
+          className='absolute inset-y-0 right-0 flex cursor-pointer items-center px-3 rtl:left-0 rtl:right-auto'
           onClick={handleClear}
         >
           <SvgIcon
diff --git a/app/soapbox/features/compose/components/spoiler-input.tsx b/app/soapbox/features/compose/components/spoiler-input.tsx
index 139960b68a..5aeb6caa76 100644
--- a/app/soapbox/features/compose/components/spoiler-input.tsx
+++ b/app/soapbox/features/compose/components/spoiler-input.tsx
@@ -62,7 +62,7 @@ const SpoilerInput = React.forwardRef<AutosuggestInput, ISpoilerInput>(({
           onSuggestionSelected={onSuggestionSelected}
           searchTokens={[':']}
           id='cw-spoiler-input'
-          className='rounded-md dark:!bg-transparent !bg-transparent'
+          className='rounded-md !bg-transparent dark:!bg-transparent'
           ref={ref}
           autoFocus
         />
diff --git a/app/soapbox/features/crypto-donate/components/crypto-address.tsx b/app/soapbox/features/crypto-donate/components/crypto-address.tsx
index 31add76723..444d306c78 100644
--- a/app/soapbox/features/crypto-donate/components/crypto-address.tsx
+++ b/app/soapbox/features/crypto-donate/components/crypto-address.tsx
@@ -33,7 +33,7 @@ const CryptoAddress: React.FC<ICryptoAddress> = (props): JSX.Element => {
     <Stack>
       <HStack alignItems='center' className='mb-1'>
         <CryptoIcon
-          className='flex items-start justify-center w-6 mr-2.5 rtl:ml-2.5 rtl:mr-0'
+          className='mr-2.5 flex w-6 items-start justify-center rtl:ml-2.5 rtl:mr-0'
           ticker={ticker}
           title={title}
         />
@@ -41,12 +41,12 @@ const CryptoAddress: React.FC<ICryptoAddress> = (props): JSX.Element => {
         <Text weight='bold'>{title || ticker.toUpperCase()}</Text>
 
         <HStack alignItems='center' className='ml-auto'>
-          <a className='text-gray-500 ml-1 rtl:ml-0 rtl:mr-1' href='#' onClick={handleModalClick}>
+          <a className='ml-1 text-gray-500 rtl:ml-0 rtl:mr-1' href='#' onClick={handleModalClick}>
             <Icon src={require('@tabler/icons/qrcode.svg')} size={20} />
           </a>
 
           {explorerUrl && (
-            <a className='text-gray-500 ml-1 rtl:ml-0 rtl:mr-1' href={explorerUrl} target='_blank'>
+            <a className='ml-1 text-gray-500 rtl:ml-0 rtl:mr-1' href={explorerUrl} target='_blank'>
               <Icon src={require('@tabler/icons/external-link.svg')} size={20} />
             </a>
           )}
diff --git a/app/soapbox/features/developers/developers-menu.tsx b/app/soapbox/features/developers/developers-menu.tsx
index 61e8c1de6c..455ff75b69 100644
--- a/app/soapbox/features/developers/developers-menu.tsx
+++ b/app/soapbox/features/developers/developers-menu.tsx
@@ -55,7 +55,7 @@ const Developers: React.FC = () => {
   return (
     <>
       <Column label={intl.formatMessage(messages.heading)}>
-        <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2'>
+        <div className='grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-3'>
           <DashWidget to='/developers/apps/create'>
             <SvgIcon src={require('@tabler/icons/apps.svg')} className='text-gray-700 dark:text-gray-600' />
 
diff --git a/app/soapbox/features/developers/service-worker-info.tsx b/app/soapbox/features/developers/service-worker-info.tsx
index 9b77515876..4f33b12ab6 100644
--- a/app/soapbox/features/developers/service-worker-info.tsx
+++ b/app/soapbox/features/developers/service-worker-info.tsx
@@ -116,10 +116,10 @@ const ServiceWorkerInfo: React.FC<IServiceWorkerInfo> = () => {
 
           {url && (
             <ListItem label={intl.formatMessage(messages.url)}>
-              <a href={url} target='_blank' className='flex space-x-1 items-center truncate'>
+              <a href={url} target='_blank' className='flex items-center space-x-1 truncate'>
                 <span className='truncate'>{url}</span>
                 <Icon
-                  className='w-4 h-4'
+                  className='h-4 w-4'
                   src={require('@tabler/icons/external-link.svg')}
                 />
               </a>
diff --git a/app/soapbox/features/directory/components/account-card.tsx b/app/soapbox/features/directory/components/account-card.tsx
index b5cb6fc175..b0d3e5e6eb 100644
--- a/app/soapbox/features/directory/components/account-card.tsx
+++ b/app/soapbox/features/directory/components/account-card.tsx
@@ -28,7 +28,7 @@ const AccountCard: React.FC<IAccountCard> = ({ id }) => {
   const followedBy = me !== account.id && account.relationship?.followed_by;
 
   return (
-    <div className='flex flex-col divide-y divide-gray-200 dark:divide-primary-700 rounded-lg bg-white dark:bg-primary-800 text-center shadow'>
+    <div className='flex flex-col divide-y divide-gray-200 rounded-lg bg-white text-center shadow dark:divide-primary-700 dark:bg-primary-800'>
       <div className='relative'>
         {followedBy && (
           <div className='absolute top-2.5 left-2.5'>
@@ -46,7 +46,7 @@ const AccountCard: React.FC<IAccountCard> = ({ id }) => {
         <img
           src={autoPlayGif ? account.header : account.header_static}
           alt=''
-          className='object-cover h-32 w-full rounded-t-lg'
+          className='h-32 w-full rounded-t-lg object-cover'
         />
       </div>
 
diff --git a/app/soapbox/features/edit-profile/components/profile-preview.tsx b/app/soapbox/features/edit-profile/components/profile-preview.tsx
index c8df16dd1a..55e26dcfd0 100644
--- a/app/soapbox/features/edit-profile/components/profile-preview.tsx
+++ b/app/soapbox/features/edit-profile/components/profile-preview.tsx
@@ -16,8 +16,8 @@ const ProfilePreview: React.FC<IProfilePreview> = ({ account }) => {
   const { displayFqn } = useSoapboxConfig();
 
   return (
-    <div className='bg-white dark:bg-gray-800 rounded-lg text-black dark:text-white sm:shadow dark:sm:shadow-inset overflow-hidden'>
-      <div className='relative overflow-hidden isolate w-full h-32 md:rounded-t-lg bg-gray-200 dark:bg-gray-900/50'>
+    <div className='dark:sm:shadow-inset overflow-hidden rounded-lg bg-white text-black dark:bg-gray-800 dark:text-white sm:shadow'>
+      <div className='relative isolate h-32 w-full overflow-hidden bg-gray-200 dark:bg-gray-900/50 md:rounded-t-lg'>
         <StillImage src={account.header} />
       </div>
 
diff --git a/app/soapbox/features/edit-profile/index.tsx b/app/soapbox/features/edit-profile/index.tsx
index 6f14c63545..99c06544f1 100644
--- a/app/soapbox/features/edit-profile/index.tsx
+++ b/app/soapbox/features/edit-profile/index.tsx
@@ -310,7 +310,7 @@ const EditProfile: React.FC = () => {
   return (
     <Column label={intl.formatMessage(messages.header)}>
       <Form onSubmit={handleSubmit}>
-        <div className='grid grid-cols-1 md:grid-cols-2 gap-4'>
+        <div className='grid grid-cols-1 gap-4 md:grid-cols-2'>
           <ProfilePreview account={previewAccount} />
 
           <div className='space-y-4'>
diff --git a/app/soapbox/features/embedded-status/index.tsx b/app/soapbox/features/embedded-status/index.tsx
index 56d836d1b8..d8c172643c 100644
--- a/app/soapbox/features/embedded-status/index.tsx
+++ b/app/soapbox/features/embedded-status/index.tsx
@@ -45,7 +45,7 @@ const EmbeddedStatus: React.FC<IEmbeddedStatus> = ({ params }) => {
   }, [status, loading]);
 
   const logo = (
-    <div className='flex align-middle justify-center ml-4'>
+    <div className='ml-4 flex justify-center align-middle'>
       <SiteLogo className='max-h-[20px] max-w-[112px]' />
     </div>
   );
@@ -67,7 +67,7 @@ const EmbeddedStatus: React.FC<IEmbeddedStatus> = ({ params }) => {
       onClick={e => e.stopPropagation()}
       target='_blank'
     >
-      <div className='p-4 sm:p-6 max-w-3xl pointer-events-none'>
+      <div className='pointer-events-none max-w-3xl p-4 sm:p-6'>
         {renderInner()}
       </div>
     </a>
diff --git a/app/soapbox/features/event/components/event-header.tsx b/app/soapbox/features/event/components/event-header.tsx
index 50802dcb6b..6844acb2d1 100644
--- a/app/soapbox/features/event/components/event-header.tsx
+++ b/app/soapbox/features/event/components/event-header.tsx
@@ -80,8 +80,8 @@ const EventHeader: React.FC<IEventHeader> = ({ status }) => {
   if (!status || !status.event) {
     return (
       <>
-        <div className='-mt-4 -mx-4'>
-          <div className='relative h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50' />
+        <div className='-mx-4 -mt-4'>
+          <div className='relative h-32 w-full bg-gray-200 dark:bg-gray-900/50 md:rounded-t-xl lg:h-48' />
         </div>
 
         <PlaceholderEventHeader />
@@ -364,14 +364,14 @@ const EventHeader: React.FC<IEventHeader> = ({ status }) => {
 
   return (
     <>
-      <div className='-mt-4 -mx-4'>
-        <div className='relative h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50'>
+      <div className='-mx-4 -mt-4'>
+        <div className='relative h-32 w-full bg-gray-200 dark:bg-gray-900/50 md:rounded-t-xl lg:h-48'>
           {banner && (
             <a href={banner.url} onClick={handleHeaderClick} target='_blank'>
               <StillImage
                 src={banner.url}
                 alt={intl.formatMessage(messages.bannerHeader)}
-                className='absolute inset-0 object-cover md:rounded-t-xl h-full'
+                className='absolute inset-0 h-full object-cover md:rounded-t-xl'
               />
             </a>
           )}
@@ -379,13 +379,13 @@ const EventHeader: React.FC<IEventHeader> = ({ status }) => {
       </div>
       <Stack space={2}>
         <HStack className='w-full' alignItems='start' space={2}>
-          <Text className='flex-grow' size='lg' weight='bold'>{event.name}</Text>
+          <Text className='grow' size='lg' weight='bold'>{event.name}</Text>
           <Menu>
             <MenuButton
               as={IconButton}
               src={require('@tabler/icons/dots.svg')}
               theme='outlined'
-              className='px-2 h-[30px]'
+              className='h-[30px] px-2'
               iconClassName='w-4 h-4'
               children={null}
             />
@@ -402,7 +402,7 @@ const EventHeader: React.FC<IEventHeader> = ({ status }) => {
                     <Comp key={idx} {...itemProps} className='group'>
                       <div className='flex items-center'>
                         {menuItem.icon && (
-                          <SvgIcon src={menuItem.icon} className='mr-3 h-5 w-5 text-gray-400 flex-none group-hover:text-gray-500' />
+                          <SvgIcon src={menuItem.icon} className='mr-3 h-5 w-5 flex-none text-gray-400 group-hover:text-gray-500' />
                         )}
 
                         <div className='truncate'>{menuItem.text}</div>
diff --git a/app/soapbox/features/event/event-discussion.tsx b/app/soapbox/features/event/event-discussion.tsx
index 127bb6cc2f..4593ebebc3 100644
--- a/app/soapbox/features/event/event-discussion.tsx
+++ b/app/soapbox/features/event/event-discussion.tsx
@@ -175,10 +175,10 @@ const EventDiscussion: React.FC<IEventDiscussion> = (props) => {
 
   return (
     <Stack space={2}>
-      {me && <div className='p-2 pt-0 border-b border-solid border-gray-200 dark:border-gray-800'>
+      {me && <div className='border-b border-solid border-gray-200 p-2 pt-0 dark:border-gray-800'>
         <ComposeForm id={`reply:${status.id}`} autoFocus={false} event={status.id} />
       </div>}
-      <div ref={node} className='thread p-0 sm:p-2 shadow-none'>
+      <div ref={node} className='thread p-0 shadow-none sm:p-2'>
         <ScrollableList
           id='thread'
           ref={scroller}
diff --git a/app/soapbox/features/event/event-information.tsx b/app/soapbox/features/event/event-information.tsx
index 4ef7ae0b8c..cec8829ae5 100644
--- a/app/soapbox/features/event/event-information.tsx
+++ b/app/soapbox/features/event/event-information.tsx
@@ -76,7 +76,7 @@ const EventInformation: React.FC<IEventInformation> = ({ params }) => {
             {[event.location.get('postalCode'), event.location.get('locality'), event.location.get('country')].filter(text => text).join(', ')}
             {tileServer && event.location.get('latitude') && (<>
               <br />
-              <a href='#' className='text-primary-600 dark:text-accent-blue hover:underline' onClick={handleShowMap}>
+              <a href='#' className='text-primary-600 hover:underline dark:text-accent-blue' onClick={handleShowMap}>
                 <FormattedMessage id='event.show_on_map' defaultMessage='Show on map' />
               </a>
             </>)}
@@ -143,7 +143,7 @@ const EventInformation: React.FC<IEventInformation> = ({ params }) => {
         {status.event.links.map(link => (
           <HStack space={2} alignItems='center'>
             <Icon src={require('@tabler/icons/link.svg')} />
-            <a href={link.remote_url || link.url} className='text-primary-600 dark:text-accent-blue hover:underline' target='_blank'>
+            <a href={link.remote_url || link.url} className='text-primary-600 hover:underline dark:text-accent-blue' target='_blank'>
               {(link.remote_url || link.url).replace(/^https?:\/\//, '')}
             </a>
           </HStack>
diff --git a/app/soapbox/features/events/components/event-carousel.tsx b/app/soapbox/features/events/components/event-carousel.tsx
index 3f2f255653..e2ecce2655 100644
--- a/app/soapbox/features/events/components/event-carousel.tsx
+++ b/app/soapbox/features/events/components/event-carousel.tsx
@@ -54,12 +54,12 @@ const EventCarousel: React.FC<IEventCarousel> = ({ statusIds, isLoading, emptyMe
   return (
     <div className='relative -mx-1'>
       {index !== 0 && (
-        <div className='z-10 absolute left-3 top-1/2 -mt-4'>
+        <div className='absolute left-3 top-1/2 z-10 -mt-4'>
           <button
             onClick={() => handleChangeIndex(index - 1)}
-            className='bg-white/50 dark:bg-gray-900/50 backdrop-blur rounded-full h-8 w-8 flex items-center justify-center'
+            className='flex h-8 w-8 items-center justify-center rounded-full bg-white/50 backdrop-blur dark:bg-gray-900/50'
           >
-            <Icon src={require('@tabler/icons/chevron-left.svg')} className='text-black dark:text-white h-6 w-6' />
+            <Icon src={require('@tabler/icons/chevron-left.svg')} className='h-6 w-6 text-black dark:text-white' />
           </button>
         </div>
       )}
@@ -67,12 +67,12 @@ const EventCarousel: React.FC<IEventCarousel> = ({ statusIds, isLoading, emptyMe
         {statusIds.map(statusId => <Event key={statusId} id={statusId} />)}
       </ReactSwipeableViews>
       {index !== statusIds.size - 1 && (
-        <div className='z-10 absolute right-3 top-1/2 -mt-4'>
+        <div className='absolute right-3 top-1/2 z-10 -mt-4'>
           <button
             onClick={() => handleChangeIndex(index + 1)}
-            className='bg-white/50 dark:bg-gray-900/50 backdrop-blur rounded-full h-8 w-8 flex items-center justify-center'
+            className='flex h-8 w-8 items-center justify-center rounded-full bg-white/50 backdrop-blur dark:bg-gray-900/50'
           >
-            <Icon src={require('@tabler/icons/chevron-right.svg')} className='text-black dark:text-white h-6 w-6' />
+            <Icon src={require('@tabler/icons/chevron-right.svg')} className='h-6 w-6 text-black dark:text-white' />
           </button>
         </div>
       )}
diff --git a/app/soapbox/features/federation-restrictions/components/instance-restrictions.tsx b/app/soapbox/features/federation-restrictions/components/instance-restrictions.tsx
index b8c29b8823..3940c54c75 100644
--- a/app/soapbox/features/federation-restrictions/components/instance-restrictions.tsx
+++ b/app/soapbox/features/federation-restrictions/components/instance-restrictions.tsx
@@ -24,7 +24,7 @@ interface IRestriction {
 const Restriction: React.FC<IRestriction> = ({ icon, children }) => {
   return (
     <HStack space={3}>
-      <Icon className='flex-none w-5 h-5' src={icon} />
+      <Icon className='h-5 w-5 flex-none' src={icon} />
 
       <Text theme='muted'>
         {children}
diff --git a/app/soapbox/features/feed-filtering/feed-carousel.tsx b/app/soapbox/features/feed-filtering/feed-carousel.tsx
index 6a4edf2e6c..0c42741e2f 100644
--- a/app/soapbox/features/feed-filtering/feed-carousel.tsx
+++ b/app/soapbox/features/feed-filtering/feed-carousel.tsx
@@ -58,11 +58,11 @@ const CarouselItem = React.forwardRef((
       role='filter-feed-by-user'
       data-testid='carousel-item'
     >
-      <Stack className='w-14 h-auto' space={3}>
-        <div className='block mx-auto relative w-12 h-12 rounded-full'>
+      <Stack className='h-auto w-14' space={3}>
+        <div className='relative mx-auto block h-12 w-12 rounded-full'>
           {isSelected && (
-            <div className='absolute inset-0 bg-primary-600 bg-opacity-50 rounded-full flex items-center justify-center'>
-              <Icon src={require('@tabler/icons/check.svg')} className='text-white h-6 w-6' />
+            <div className='absolute inset-0 flex items-center justify-center rounded-full bg-primary-600/50'>
+              <Icon src={require('@tabler/icons/check.svg')} className='h-6 w-6 text-white' />
             </div>
           )}
 
@@ -79,7 +79,7 @@ const CarouselItem = React.forwardRef((
           />
         </div>
 
-        <Text theme='muted' size='sm' truncate align='center' className='leading-3 pb-0.5'>{avatar.acct}</Text>
+        <Text theme='muted' size='sm' truncate align='center' className='pb-0.5 leading-3'>{avatar.acct}</Text>
       </Stack>
     </div>
   );
@@ -159,25 +159,25 @@ const FeedCarousel = () => {
 
   return (
     <div
-      className='rounded-xl bg-white dark:bg-primary-900 shadow-lg dark:shadow-none overflow-hidden'
+      className='overflow-hidden rounded-xl bg-white shadow-lg dark:bg-primary-900 dark:shadow-none'
       data-testid='feed-carousel'
     >
       <HStack alignItems='stretch'>
-        <div className='z-10 rounded-l-xl bg-white dark:bg-primary-900 w-8 flex self-stretch items-center justify-center'>
+        <div className='z-10 flex w-8 items-center justify-center self-stretch rounded-l-xl bg-white dark:bg-primary-900'>
           <button
             data-testid='prev-page'
             onClick={handlePrevPage}
-            className='h-full w-7 flex items-center justify-center disabled:opacity-25 transition-opacity duration-500'
+            className='flex h-full w-7 items-center justify-center transition-opacity duration-500 disabled:opacity-25'
             disabled={!hasPrevPage}
           >
-            <Icon src={require('@tabler/icons/chevron-left.svg')} className='text-black dark:text-white h-5 w-5' />
+            <Icon src={require('@tabler/icons/chevron-left.svg')} className='h-5 w-5 text-black dark:text-white' />
           </button>
         </div>
 
-        <div className='overflow-hidden relative w-full'>
+        <div className='relative w-full overflow-hidden'>
           {pinnedAvatar ? (
             <div
-              className='z-10 flex items-center justify-center absolute left-0 top-0 bottom-0 bg-white dark:bg-primary-900'
+              className='absolute inset-y-0 left-0 z-10 flex items-center justify-center bg-white dark:bg-primary-900'
               style={{
                 width: widthPerAvatar || 'auto',
               }}
@@ -197,13 +197,13 @@ const FeedCarousel = () => {
             style={{
               transform: `translateX(-${(currentPage - 1) * 100}%)`,
             }}
-            className='transition-all ease-out duration-500'
+            className='transition-all duration-500 ease-out'
             ref={setContainerRef}
           >
             {isFetching ? (
               new Array(20).fill(0).map((_, idx) => (
                 <div
-                  className='flex flex-shrink-0 justify-center'
+                  className='flex shrink-0 justify-center'
                   style={{ width: widthPerAvatar || 'auto' }}
                   key={idx}
                 >
@@ -214,19 +214,19 @@ const FeedCarousel = () => {
               avatarsToList.map((avatar: any, index) => (
                 <div
                   key={avatar?.account_id || index}
-                  className='flex flex-shrink-0 justify-center'
+                  className='flex shrink-0 justify-center'
                   style={{
                     width: widthPerAvatar || 'auto',
                   }}
                 >
                   {avatar === null ? (
                     <Stack
-                      className='w-14 py-4 h-auto'
+                      className='h-auto w-14 py-4'
                       space={3}
                       style={{ height: carouselItemRef.current?.clientHeight }}
                     >
-                      <div className='block mx-auto relative w-16 h-16 rounded-full'>
-                        <div className='w-16 h-16' />
+                      <div className='relative mx-auto block h-16 w-16 rounded-full'>
+                        <div className='h-16 w-16' />
                       </div>
                     </Stack>
                   ) : (
@@ -248,14 +248,14 @@ const FeedCarousel = () => {
           </HStack>
         </div>
 
-        <div className='z-10 rounded-r-xl bg-white dark:bg-primary-900 w-8 self-stretch flex items-center justify-center'>
+        <div className='z-10 flex w-8 items-center justify-center self-stretch rounded-r-xl bg-white dark:bg-primary-900'>
           <button
             data-testid='next-page'
             onClick={handleNextPage}
-            className='h-full w-7 flex items-center justify-center disabled:opacity-25 transition-opacity duration-500'
+            className='flex h-full w-7 items-center justify-center transition-opacity duration-500 disabled:opacity-25'
             disabled={!hasNextPage}
           >
-            <Icon src={require('@tabler/icons/chevron-right.svg')} className='text-black dark:text-white h-5 w-5' />
+            <Icon src={require('@tabler/icons/chevron-right.svg')} className='h-5 w-5 text-black dark:text-white' />
           </button>
         </div>
       </HStack>
diff --git a/app/soapbox/features/feed-suggestions/feed-suggestions.tsx b/app/soapbox/features/feed-suggestions/feed-suggestions.tsx
index dc2b334c18..ce86d1432d 100644
--- a/app/soapbox/features/feed-suggestions/feed-suggestions.tsx
+++ b/app/soapbox/features/feed-suggestions/feed-suggestions.tsx
@@ -19,15 +19,15 @@ const SuggestionItem = ({ accountId }: { accountId: string }) => {
   const account = useAccount(accountId) as Account;
 
   return (
-    <Stack space={3} className='p-4 md:p-0 rounded-md border border-solid border-gray-300 dark:border-gray-800 dark:md:border-transparent md:border-transparent w-52 shrink-0 md:shrink md:w-full'>
+    <Stack space={3} className='w-52 shrink-0 rounded-md border border-solid border-gray-300 p-4 dark:border-gray-800 md:w-full md:shrink md:border-transparent md:p-0 dark:md:border-transparent'>
       <Link
         to={`/@${account.acct}`}
         title={account.acct}
       >
-        <Stack space={3} className='w-40 md:w-24 mx-auto'>
+        <Stack space={3} className='mx-auto w-40 md:w-24'>
           <img
             src={account.avatar}
-            className='mx-auto block w-16 h-16 min-w-[56px] rounded-full object-cover'
+            className='mx-auto block h-16 w-16 min-w-[56px] rounded-full object-cover'
             alt={account.acct}
           />
 
@@ -71,14 +71,14 @@ const FeedSuggestions = () => {
 
         <Link
           to='/suggestions'
-          className='text-primary-600 dark:text-accent-blue hover:underline'
+          className='text-primary-600 hover:underline dark:text-accent-blue'
         >
           {intl.formatMessage(messages.viewAll)}
         </Link>
       </HStack>
 
       <CardBody>
-        <HStack space={4} alignItems='center' className='overflow-x-auto lg:overflow-x-hidden md:space-x-0'>
+        <HStack space={4} alignItems='center' className='overflow-x-auto md:space-x-0 lg:overflow-x-hidden'>
           {suggestedProfiles.slice(0, 4).map((suggestedProfile) => (
             <SuggestionItem key={suggestedProfile.account} accountId={suggestedProfile.account} />
           ))}
diff --git a/app/soapbox/features/group/components/group-header.tsx b/app/soapbox/features/group/components/group-header.tsx
index fb9389c20f..dbb3770621 100644
--- a/app/soapbox/features/group/components/group-header.tsx
+++ b/app/soapbox/features/group/components/group-header.tsx
@@ -29,16 +29,16 @@ const GroupHeader: React.FC<IGroupHeader> = ({ group }) => {
 
   if (!group) {
     return (
-      <div className='-mt-4 -mx-4'>
+      <div className='-mx-4 -mt-4'>
         <div>
-          <div className='relative h-32 w-full lg:h-48 md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50' />
+          <div className='relative h-32 w-full bg-gray-200 dark:bg-gray-900/50 md:rounded-t-xl lg:h-48' />
         </div>
 
         <div className='px-4 sm:px-6'>
           <HStack alignItems='bottom' space={5} className='-mt-12'>
-            <div className='flex relative'>
+            <div className='relative flex'>
               <div
-                className='h-24 w-24 bg-gray-400 rounded-full ring-4 ring-white dark:ring-gray-800'
+                className='h-24 w-24 rounded-full bg-gray-400 ring-4 ring-white dark:ring-gray-800'
               />
             </div>
           </HStack>
@@ -157,9 +157,9 @@ const GroupHeader: React.FC<IGroupHeader> = ({ group }) => {
   const actionButton = makeActionButton();
 
   return (
-    <div className='-mt-4 -mx-4'>
+    <div className='-mx-4 -mt-4'>
       <div className='relative'>
-        <div className='relative flex flex-col justify-center h-32 w-full lg:h-[200px] md:rounded-t-xl bg-gray-200 dark:bg-gray-900/50 overflow-hidden isolate'>
+        <div className='relative isolate flex h-32 w-full flex-col justify-center overflow-hidden bg-gray-200 dark:bg-gray-900/50 md:rounded-t-xl lg:h-[200px]'>
           {renderHeader()}
         </div>
         <div className='absolute left-1/2 bottom-0 -translate-x-1/2 translate-y-1/2'>
diff --git a/app/soapbox/features/group/group-members.tsx b/app/soapbox/features/group/group-members.tsx
index 3039dc14c5..f27946f7f0 100644
--- a/app/soapbox/features/group/group-members.tsx
+++ b/app/soapbox/features/group/group-members.tsx
@@ -186,7 +186,7 @@ const GroupMember: React.FC<IGroupMember> = ({ accountId, accountRole, groupId,
                   <Comp key={idx} {...itemProps} className='group'>
                     <HStack space={3} alignItems='center'>
                       {menuItem.icon && (
-                        <SvgIcon src={menuItem.icon} className='h-5 w-5 text-gray-400 flex-none group-hover:text-gray-500' />
+                        <SvgIcon src={menuItem.icon} className='h-5 w-5 flex-none text-gray-400 group-hover:text-gray-500' />
                       )}
 
                       <div className='truncate'>{menuItem.text}</div>
diff --git a/app/soapbox/features/group/group-timeline.tsx b/app/soapbox/features/group/group-timeline.tsx
index 44ea68a2f7..51d7d2cc92 100644
--- a/app/soapbox/features/group/group-timeline.tsx
+++ b/app/soapbox/features/group/group-timeline.tsx
@@ -46,7 +46,7 @@ const GroupTimeline: React.FC<IGroupTimeline> = (props) => {
   return (
     <Stack space={2}>
       {!!account && relationship?.member && (
-        <div className='px-2 py-4 border-b border-solid border-gray-200 dark:border-gray-800'>
+        <div className='border-b border-solid border-gray-200 px-2 py-4 dark:border-gray-800'>
           <HStack alignItems='start' space={4}>
             <Link to={`/@${account.acct}`}>
               <Avatar src={account.avatar} size={46} />
diff --git a/app/soapbox/features/groups/index.tsx b/app/soapbox/features/groups/index.tsx
index 7375d89c2b..85a092e0be 100644
--- a/app/soapbox/features/groups/index.tsx
+++ b/app/soapbox/features/groups/index.tsx
@@ -52,7 +52,7 @@ const Groups: React.FC = () => {
   }
 
   const emptyMessage = (
-    <Stack space={6} alignItems='center' justifyContent='center' className='p-6 h-full'>
+    <Stack space={6} alignItems='center' justifyContent='center' className='h-full p-6'>
       <Stack space={2} className='max-w-sm'>
         <Text size='2xl' weight='bold' tag='h2' align='center'>
           <FormattedMessage
diff --git a/app/soapbox/features/home-timeline/index.tsx b/app/soapbox/features/home-timeline/index.tsx
index 83bdf6c9de..aaaec2bb37 100644
--- a/app/soapbox/features/home-timeline/index.tsx
+++ b/app/soapbox/features/home-timeline/index.tsx
@@ -115,7 +115,7 @@ const HomeTimeline: React.FC = () => {
                     defaultMessage='Or you can visit {public} to get started and meet other users.'
                     values={{
                       public: (
-                        <Link to='/timeline/local' className='text-primary-600 dark:text-primary-400 hover:underline'>
+                        <Link to='/timeline/local' className='text-primary-600 hover:underline dark:text-primary-400'>
                           <FormattedMessage id='empty_column.home.local_tab' defaultMessage='the {site_title} tab' values={{ site_title: instance.title }} />
                         </Link>
                       ),
diff --git a/app/soapbox/features/landing-page/index.tsx b/app/soapbox/features/landing-page/index.tsx
index 21f644aecd..ce11800639 100644
--- a/app/soapbox/features/landing-page/index.tsx
+++ b/app/soapbox/features/landing-page/index.tsx
@@ -69,7 +69,7 @@ const LandingPage = () => {
   const renderPepe = () => {
     return (
       <Stack space={3} data-testid='registrations-pepe'>
-        <VerificationBadge className='h-16 w-16 mx-auto' />
+        <VerificationBadge className='mx-auto h-16 w-16' />
 
         <Stack>
           <Text size='2xl' weight='bold' align='center'>
@@ -103,11 +103,11 @@ const LandingPage = () => {
   return (
     <main className='mt-16 sm:mt-24' data-testid='homepage'>
       <div className='mx-auto max-w-7xl'>
-        <div className='grid grid-cols-1 lg:grid-cols-12 gap-8 py-12'>
-          <div className='px-4 sm:px-6 sm:text-center md:max-w-2xl md:mx-auto lg:col-span-6 lg:text-start lg:flex'>
+        <div className='grid grid-cols-1 gap-8 py-12 lg:grid-cols-12'>
+          <div className='px-4 sm:px-6 sm:text-center md:mx-auto md:max-w-2xl lg:col-span-6 lg:flex lg:text-start'>
             <div className='w-full'>
               <Stack space={3}>
-                <h1 className='text-5xl font-extrabold text-transparent text-ellipsis overflow-hidden bg-clip-text bg-gradient-to-br from-accent-500 via-primary-500 to-gradient-end sm:mt-5 sm:leading-none lg:mt-6 lg:text-6xl xl:text-7xl'>
+                <h1 className='overflow-hidden text-ellipsis bg-gradient-to-br from-accent-500 via-primary-500 to-gradient-end bg-clip-text text-5xl font-extrabold text-transparent sm:mt-5 sm:leading-none lg:mt-6 lg:text-6xl xl:text-7xl'>
                   {instance.title}
                 </h1>
 
@@ -118,8 +118,8 @@ const LandingPage = () => {
               </Stack>
             </div>
           </div>
-          <div className='sm:mt-24 lg:mt-0 lg:col-span-6 self-center'>
-            <Card size='xl' variant='rounded' className='sm:max-w-md sm:w-full sm:mx-auto'>
+          <div className='self-center sm:mt-24 lg:col-span-6 lg:mt-0'>
+            <Card size='xl' variant='rounded' className='sm:mx-auto sm:w-full sm:max-w-md'>
               <CardBody>
                 {renderBody()}
               </CardBody>
diff --git a/app/soapbox/features/list-adder/components/list.tsx b/app/soapbox/features/list-adder/components/list.tsx
index b02800c921..834c92c779 100644
--- a/app/soapbox/features/list-adder/components/list.tsx
+++ b/app/soapbox/features/list-adder/components/list.tsx
@@ -38,7 +38,7 @@ const List: React.FC<IList> = ({ listId }) => {
   return (
     <div className='flex items-center gap-1.5 px-2 py-4 text-black dark:text-white'>
       <Icon src={require('@tabler/icons/list.svg')} />
-      <span className='flex-grow'>
+      <span className='grow'>
         {list.title}
       </span>
       {button}
diff --git a/app/soapbox/features/list-editor/components/search.tsx b/app/soapbox/features/list-editor/components/search.tsx
index d386f40f06..58b2e6311a 100644
--- a/app/soapbox/features/list-editor/components/search.tsx
+++ b/app/soapbox/features/list-editor/components/search.tsx
@@ -35,7 +35,7 @@ const Search = () => {
   return (
     <Form onSubmit={handleSubmit}>
       <HStack space={2}>
-        <label className='flex-grow relative'>
+        <label className='relative grow'>
           <span style={{ display: 'none' }}>{intl.formatMessage(messages.search)}</span>
 
           <Input
diff --git a/app/soapbox/features/lists/components/new-list-form.tsx b/app/soapbox/features/lists/components/new-list-form.tsx
index 2f3ef50ba4..275117016d 100644
--- a/app/soapbox/features/lists/components/new-list-form.tsx
+++ b/app/soapbox/features/lists/components/new-list-form.tsx
@@ -33,7 +33,7 @@ const NewListForm: React.FC = () => {
   return (
     <Form onSubmit={handleSubmit}>
       <HStack space={2}>
-        <label className='flex-grow'>
+        <label className='grow'>
           <span style={{ display: 'none' }}>{label}</span>
 
           <Input
diff --git a/app/soapbox/features/lists/index.tsx b/app/soapbox/features/lists/index.tsx
index 5b6fed627f..d72835be61 100644
--- a/app/soapbox/features/lists/index.tsx
+++ b/app/soapbox/features/lists/index.tsx
@@ -83,9 +83,9 @@ const Lists: React.FC = () => {
           itemClassName='py-2'
         >
           {lists.map((list: any) => (
-            <Link key={list.id} to={`/list/${list.id}`} className='flex items-center gap-1.5 p-2 text-gray-900 dark:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg'>
+            <Link key={list.id} to={`/list/${list.id}`} className='flex items-center gap-1.5 rounded-lg p-2 text-gray-900 hover:bg-gray-100 dark:text-gray-100 dark:hover:bg-gray-800'>
               <Icon src={require('@tabler/icons/list.svg')} />
-              <span className='flex-grow'>
+              <span className='grow'>
                 {list.title}
               </span>
               <IconButton iconClassName='h-5 w-5 text-gray-700 dark:text-gray-600 hover:text-gray-800 dark:hover:text-gray-500' src={require('@tabler/icons/pencil.svg')} onClick={handleEditClick(list.id)} title={intl.formatMessage(messages.editList)} />
diff --git a/app/soapbox/features/migration/index.tsx b/app/soapbox/features/migration/index.tsx
index ceb2dc4d02..0915e016e0 100644
--- a/app/soapbox/features/migration/index.tsx
+++ b/app/soapbox/features/migration/index.tsx
@@ -68,7 +68,7 @@ const Migration = () => {
             values={{
               link: (
                 <Link
-                  className='hover:underline text-primary-600 dark:text-primary-400 hover:text-primary-800 dark:hover:text-primary-500'
+                  className='text-primary-600 hover:text-primary-800 hover:underline dark:text-primary-400 dark:hover:text-primary-500'
                   to='/settings/aliases'
                 >
                   <FormattedMessage
diff --git a/app/soapbox/features/notifications/components/notification.tsx b/app/soapbox/features/notifications/components/notification.tsx
index 0ac907ada3..ccb15c1430 100644
--- a/app/soapbox/features/notifications/components/notification.tsx
+++ b/app/soapbox/features/notifications/components/notification.tsx
@@ -30,7 +30,7 @@ const notificationForScreenReader = (intl: IntlShape, message: string, timestamp
 const buildLink = (account: AccountEntity): JSX.Element => (
   <bdi>
     <Link
-      className='text-gray-800 dark:text-gray-200 font-bold hover:underline'
+      className='font-bold text-gray-800 hover:underline dark:text-gray-200'
       title={account.acct}
       to={`/@${account.acct}`}
       dangerouslySetInnerHTML={{ __html: account.display_name_html }}
@@ -269,14 +269,14 @@ const Notification: React.FC<INotificaton> = (props) => {
       return (
         <Emoji
           emoji={notification.emoji}
-          className='w-4 h-4 flex-none'
+          className='h-4 w-4 flex-none'
         />
       );
     } else if (validType(type)) {
       return (
         <Icon
           src={icons[type]}
-          className='text-primary-600 dark:text-primary-400 flex-none'
+          className='flex-none text-primary-600 dark:text-primary-400'
         />
       );
     } else {
@@ -358,7 +358,7 @@ const Notification: React.FC<INotificaton> = (props) => {
         tabIndex={0}
         aria-label={ariaLabel}
       >
-        <div className='p-4 focusable'>
+        <div className='focusable p-4'>
           <div className='mb-2'>
             <HStack alignItems='center' space={3}>
               <div
diff --git a/app/soapbox/features/onboarding/onboarding-wizard.tsx b/app/soapbox/features/onboarding/onboarding-wizard.tsx
index 25e4ad1283..96522d2ec1 100644
--- a/app/soapbox/features/onboarding/onboarding-wizard.tsx
+++ b/app/soapbox/features/onboarding/onboarding-wizard.tsx
@@ -78,11 +78,11 @@ const OnboardingWizard = () => {
     <div data-testid='onboarding-wizard'>
       <LandingGradient />
 
-      <main className='h-screen flex flex-col overflow-x-hidden'>
-        <div className='flex flex-col justify-center items-center h-full'>
+      <main className='flex h-screen flex-col overflow-x-hidden'>
+        <div className='flex h-full flex-col items-center justify-center'>
           <ReactSwipeableViews animateHeight index={currentStep} onChangeIndex={handleSwipe}>
             {steps.map((step, i) => (
-              <div key={i} className='py-6 sm:mx-auto w-full max-w-[100vw] sm:max-w-lg md:max-w-2xl'>
+              <div key={i} className='w-full max-w-[100vw] py-6 sm:mx-auto sm:max-w-lg md:max-w-2xl'>
                 <div
                   className={classNames({
                     'transition-opacity ease-linear': true,
diff --git a/app/soapbox/features/onboarding/steps/avatar-selection-step.tsx b/app/soapbox/features/onboarding/steps/avatar-selection-step.tsx
index ab9956dac5..dca78dcd7c 100644
--- a/app/soapbox/features/onboarding/steps/avatar-selection-step.tsx
+++ b/app/soapbox/features/onboarding/steps/avatar-selection-step.tsx
@@ -67,7 +67,7 @@ const AvatarSelectionStep = ({ onNext }: { onNext: () => void }) => {
     <Card variant='rounded' size='xl'>
       <CardBody>
         <div>
-          <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-900/50 border-solid -mx-4 sm:-mx-10'>
+          <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-900/50 sm:-mx-10 sm:pb-10'>
             <Stack space={2}>
               <Text size='2xl' align='center' weight='bold'>
                 <FormattedMessage id='onboarding.avatar.title' defaultMessage='Choose a profile picture' />
@@ -79,15 +79,15 @@ const AvatarSelectionStep = ({ onNext }: { onNext: () => void }) => {
             </Stack>
           </div>
 
-          <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+          <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
             <Stack space={10}>
-              <div className='bg-gray-200 rounded-full relative mx-auto'>
+              <div className='relative mx-auto rounded-full bg-gray-200'>
                 {account && (
                   <Avatar src={selectedFile || account.avatar} size={175} />
                 )}
 
                 {isSubmitting && (
-                  <div className='absolute inset-0 rounded-full flex justify-center items-center bg-white/80 dark:bg-primary-900/80'>
+                  <div className='absolute inset-0 flex items-center justify-center rounded-full bg-white/80 dark:bg-primary-900/80'>
                     <Spinner withText={false} />
                   </div>
                 )}
@@ -101,7 +101,7 @@ const AvatarSelectionStep = ({ onNext }: { onNext: () => void }) => {
                   })}
                   disabled={isSubmitting}
                 >
-                  <Icon src={require('@tabler/icons/plus.svg')} className='text-white w-5 h-5' />
+                  <Icon src={require('@tabler/icons/plus.svg')} className='h-5 w-5 text-white' />
                 </button>
 
                 <input type='file' className='hidden' ref={fileInput} onChange={handleFileChange} />
diff --git a/app/soapbox/features/onboarding/steps/bio-step.tsx b/app/soapbox/features/onboarding/steps/bio-step.tsx
index d0a5e37a96..aaf27a1314 100644
--- a/app/soapbox/features/onboarding/steps/bio-step.tsx
+++ b/app/soapbox/features/onboarding/steps/bio-step.tsx
@@ -46,7 +46,7 @@ const BioStep = ({ onNext }: { onNext: () => void }) => {
     <Card variant='rounded' size='xl'>
       <CardBody>
         <div>
-          <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
+          <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
             <Stack space={2}>
               <Text size='2xl' align='center' weight='bold'>
                 <FormattedMessage id='onboarding.note.title' defaultMessage='Write a short bio' />
@@ -59,7 +59,7 @@ const BioStep = ({ onNext }: { onNext: () => void }) => {
           </div>
 
           <Stack space={5}>
-            <div className='sm:pt-10 sm:w-2/3 mx-auto'>
+            <div className='mx-auto sm:w-2/3 sm:pt-10'>
               <FormGroup
                 hintText={<FormattedMessage id='onboarding.bio.hint' defaultMessage='Max 500 characters' />}
                 labelText={<FormattedMessage id='edit_profile.fields.bio_label' defaultMessage='Bio' />}
@@ -74,7 +74,7 @@ const BioStep = ({ onNext }: { onNext: () => void }) => {
               </FormGroup>
             </div>
 
-            <div className='sm:w-2/3 md:w-1/2 mx-auto'>
+            <div className='mx-auto sm:w-2/3 md:w-1/2'>
               <Stack justifyContent='center' space={2}>
                 <Button
                   block
diff --git a/app/soapbox/features/onboarding/steps/completed-step.tsx b/app/soapbox/features/onboarding/steps/completed-step.tsx
index a1059cb91f..082defb4d1 100644
--- a/app/soapbox/features/onboarding/steps/completed-step.tsx
+++ b/app/soapbox/features/onboarding/steps/completed-step.tsx
@@ -7,7 +7,7 @@ const CompletedStep = ({ onComplete }: { onComplete: () => void }) => (
   <Card variant='rounded' size='xl'>
     <CardBody>
       <Stack space={2}>
-        <Icon strokeWidth={1} src={require('@tabler/icons/confetti.svg')} className='w-16 h-16 mx-auto text-primary-600 dark:text-primary-400' />
+        <Icon strokeWidth={1} src={require('@tabler/icons/confetti.svg')} className='mx-auto h-16 w-16 text-primary-600 dark:text-primary-400' />
 
         <Text size='2xl' align='center' weight='bold'>
           <FormattedMessage id='onboarding.finished.title' defaultMessage='Onboarding complete' />
@@ -21,7 +21,7 @@ const CompletedStep = ({ onComplete }: { onComplete: () => void }) => (
         </Text>
       </Stack>
 
-      <div className='pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+      <div className='mx-auto pt-10 sm:w-2/3 md:w-1/2'>
         <Stack justifyContent='center' space={2}>
           <Button
             block
diff --git a/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx b/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
index d7b2132474..ba70e21a17 100644
--- a/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
+++ b/app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
@@ -70,7 +70,7 @@ const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => {
     <Card variant='rounded' size='xl'>
       <CardBody>
         <div>
-          <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
+          <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
             <Stack space={2}>
               <Text size='2xl' align='center' weight='bold'>
                 <FormattedMessage id='onboarding.header.title' defaultMessage='Pick a cover image' />
@@ -82,24 +82,24 @@ const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => {
             </Stack>
           </div>
 
-          <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+          <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
             <Stack space={10}>
-              <div className='border border-solid border-gray-200 dark:border-gray-800 rounded-lg'>
+              <div className='rounded-lg border border-solid border-gray-200 dark:border-gray-800'>
                 <div
                   role='button'
-                  className='relative h-24 bg-gray-200 dark:bg-gray-800 rounded-t-md flex items-center justify-center'
+                  className='relative flex h-24 items-center justify-center rounded-t-md bg-gray-200 dark:bg-gray-800'
                 >
                   {selectedFile || account?.header && (
                     <StillImage
                       src={selectedFile || account.header}
                       alt={intl.formatMessage(messages.header)}
-                      className='absolute inset-0 object-cover rounded-t-md'
+                      className='absolute inset-0 rounded-t-md object-cover'
                     />
                   )}
 
                   {isSubmitting && (
                     <div
-                      className='absolute inset-0 rounded-t-md flex justify-center items-center bg-white/80 dark:bg-primary-900/80'
+                      className='absolute inset-0 flex items-center justify-center rounded-t-md bg-white/80 dark:bg-primary-900/80'
                     >
                       <Spinner withText={false} />
                     </div>
@@ -114,7 +114,7 @@ const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => {
                     })}
                     disabled={isSubmitting}
                   >
-                    <Icon src={require('@tabler/icons/plus.svg')} className='text-white w-5 h-5' />
+                    <Icon src={require('@tabler/icons/plus.svg')} className='h-5 w-5 text-white' />
                   </button>
 
                   <input type='file' className='hidden' ref={fileInput} onChange={handleFileChange} />
@@ -122,7 +122,7 @@ const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => {
 
                 <div className='flex flex-col px-4 pb-4'>
                   {account && (
-                    <Avatar src={account.avatar} size={64} className='ring-2 dark:ring-primary-800 ring-white -mt-8 mb-2' />
+                    <Avatar src={account.avatar} size={64} className='-mt-8 mb-2 ring-2 ring-white dark:ring-primary-800' />
                   )}
 
                   <Text weight='bold' size='sm'>{account?.display_name}</Text>
diff --git a/app/soapbox/features/onboarding/steps/display-name-step.tsx b/app/soapbox/features/onboarding/steps/display-name-step.tsx
index 246ed3b93e..a94e4f7c92 100644
--- a/app/soapbox/features/onboarding/steps/display-name-step.tsx
+++ b/app/soapbox/features/onboarding/steps/display-name-step.tsx
@@ -57,7 +57,7 @@ const DisplayNameStep = ({ onNext }: { onNext: () => void }) => {
     <Card variant='rounded' size='xl'>
       <CardBody>
         <div>
-          <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
+          <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
             <Stack space={2}>
               <Text size='2xl' align='center' weight='bold'>
                 <FormattedMessage id='onboarding.display_name.title' defaultMessage='Choose a display name' />
@@ -69,7 +69,7 @@ const DisplayNameStep = ({ onNext }: { onNext: () => void }) => {
             </Stack>
           </div>
 
-          <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+          <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
             <Stack space={5}>
               <FormGroup
                 hintText={hintText}
diff --git a/app/soapbox/features/onboarding/steps/fediverse-step.tsx b/app/soapbox/features/onboarding/steps/fediverse-step.tsx
index 83a5795ebf..ba5de74e42 100644
--- a/app/soapbox/features/onboarding/steps/fediverse-step.tsx
+++ b/app/soapbox/features/onboarding/steps/fediverse-step.tsx
@@ -15,7 +15,7 @@ const FediverseStep = ({ onNext }: { onNext: () => void }) => {
     <Card variant='rounded' size='xl'>
       <CardBody>
         <Stack space={2}>
-          <Icon strokeWidth={1} src={require('@tabler/icons/affiliate.svg')} className='w-16 h-16 mx-auto text-primary-600 dark:text-primary-400' />
+          <Icon strokeWidth={1} src={require('@tabler/icons/affiliate.svg')} className='mx-auto h-16 w-16 text-primary-600 dark:text-primary-400' />
 
           <Text size='2xl' weight='bold'>
             <FormattedMessage
@@ -28,7 +28,7 @@ const FediverseStep = ({ onNext }: { onNext: () => void }) => {
           </Text>
 
           <Stack space={4}>
-            <div className='border-b border-gray-200 dark:border-gray-800 border-solid pb-2 sm:pb-5'>
+            <div className='border-b border-solid border-gray-200 pb-2 dark:border-gray-800 sm:pb-5'>
               <Stack space={4}>
                 <Text theme='muted'>
                   <FormattedMessage
@@ -49,7 +49,7 @@ const FediverseStep = ({ onNext }: { onNext: () => void }) => {
               </Stack>
             </div>
 
-            <div className='bg-primary-50 dark:bg-gray-800 rounded-lg text-center p-4'>
+            <div className='rounded-lg bg-primary-50 p-4 text-center dark:bg-gray-800'>
               <Account account={account} />
             </div>
 
@@ -69,7 +69,7 @@ const FediverseStep = ({ onNext }: { onNext: () => void }) => {
           </Stack>
         </Stack>
 
-        <div className='pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+        <div className='mx-auto pt-10 sm:w-2/3 md:w-1/2'>
           <Stack justifyContent='center' space={2}>
             <Button
               block
diff --git a/app/soapbox/features/onboarding/steps/suggested-accounts-step.tsx b/app/soapbox/features/onboarding/steps/suggested-accounts-step.tsx
index d913668997..8dfb2485b2 100644
--- a/app/soapbox/features/onboarding/steps/suggested-accounts-step.tsx
+++ b/app/soapbox/features/onboarding/steps/suggested-accounts-step.tsx
@@ -24,7 +24,7 @@ const SuggestedAccountsStep = ({ onNext }: { onNext: () => void }) => {
     }
 
     return (
-      <div className='sm:pt-4 sm:pb-10 flex flex-col'>
+      <div className='flex flex-col sm:pt-4 sm:pb-10'>
         <ScrollableList
           isLoading={isFetching}
           scrollKey='suggestions'
@@ -49,7 +49,7 @@ const SuggestedAccountsStep = ({ onNext }: { onNext: () => void }) => {
 
   const renderEmpty = () => {
     return (
-      <div className='bg-primary-50 dark:bg-gray-800 my-2 rounded-lg text-center p-8'>
+      <div className='my-2 rounded-lg bg-primary-50 p-8 text-center dark:bg-gray-800'>
         <Text>
           <FormattedMessage id='empty_column.follow_recommendations' defaultMessage='Looks like no suggestions could be generated for you. You can try using search to look for people you might know or explore trending hashtags.' />
         </Text>
@@ -69,7 +69,7 @@ const SuggestedAccountsStep = ({ onNext }: { onNext: () => void }) => {
     <Card variant='rounded' size='xl'>
       <CardBody>
         <div>
-          <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
+          <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
             <Stack space={2}>
               <Text size='2xl' align='center' weight='bold'>
                 <FormattedMessage id='onboarding.suggestions.title' defaultMessage='Suggested accounts' />
@@ -83,7 +83,7 @@ const SuggestedAccountsStep = ({ onNext }: { onNext: () => void }) => {
 
           {renderBody()}
 
-          <div className='sm:w-2/3 md:w-1/2 mx-auto'>
+          <div className='mx-auto sm:w-2/3 md:w-1/2'>
             <Stack>
               <Stack justifyContent='center' space={2}>
                 <Button
diff --git a/app/soapbox/features/placeholder/components/placeholder-account.tsx b/app/soapbox/features/placeholder/components/placeholder-account.tsx
index 22a50b3a15..28f04adb40 100644
--- a/app/soapbox/features/placeholder/components/placeholder-account.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-account.tsx
@@ -8,7 +8,7 @@ import PlaceholderDisplayName from './placeholder-display-name';
 /** Fake account to display while data is loading. */
 const PlaceholderAccount: React.FC = () => (
   <HStack space={3} alignItems='center'>
-    <div className='flex-shrink-0'>
+    <div className='shrink-0'>
       <PlaceholderAvatar size={42} />
     </div>
 
diff --git a/app/soapbox/features/placeholder/components/placeholder-avatar.tsx b/app/soapbox/features/placeholder/components/placeholder-avatar.tsx
index 9d2e1a3ecf..6eb479f139 100644
--- a/app/soapbox/features/placeholder/components/placeholder-avatar.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-avatar.tsx
@@ -21,9 +21,9 @@ const PlaceholderAvatar: React.FC<IPlaceholderAvatar> = ({ size, withText = fals
   }, [size]);
 
   return (
-    <Stack space={2} className='animate-pulse text-center py-3'>
+    <Stack space={2} className='animate-pulse py-3 text-center'>
       <div
-        className='block mx-auto rounded-full bg-primary-50 dark:bg-primary-800'
+        className='mx-auto block rounded-full bg-primary-50 dark:bg-primary-800'
         style={style}
       />
 
diff --git a/app/soapbox/features/placeholder/components/placeholder-card.tsx b/app/soapbox/features/placeholder/components/placeholder-card.tsx
index f0ef9bc728..81246ef131 100644
--- a/app/soapbox/features/placeholder/components/placeholder-card.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-card.tsx
@@ -9,9 +9,9 @@ const PlaceholderCard: React.FC = () => (
     'animate-pulse': true,
   })}
   >
-    <div className='w-2/5 primary-500 rounded-l'>&nbsp;</div>
+    <div className='primary-500 w-2/5 rounded-l'>&nbsp;</div>
 
-    <div className='w-3/5 p-4 flex flex-col justify-between text-primary-50 break-words'>
+    <div className='flex w-3/5 flex-col justify-between break-words p-4 text-primary-50'>
       <p>{generateText(randomIntFromInterval(5, 25))}</p>
       <p>{generateText(randomIntFromInterval(5, 75))}</p>
       <p>{generateText(randomIntFromInterval(5, 15))}</p>
diff --git a/app/soapbox/features/placeholder/components/placeholder-chat-message.tsx b/app/soapbox/features/placeholder/components/placeholder-chat-message.tsx
index 8d0faf2ec5..d74e459ccc 100644
--- a/app/soapbox/features/placeholder/components/placeholder-chat-message.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-chat-message.tsx
@@ -56,11 +56,11 @@ const PlaceholderChatMessage = ({ isMyMessage = false }: { isMyMessage?: boolean
             'order-2': !isMyMessage,
           })}
         >
-          <span style={{ width: 50, height: 12 }} className='rounded-full bg-primary-50 dark:bg-primary-800 block' />
+          <span style={{ width: 50, height: 12 }} className='block rounded-full bg-primary-50 dark:bg-primary-800' />
         </Text>
 
         <div className={classNames({ 'order-1': !isMyMessage })}>
-          <div className='w-[34px] ml-2' />
+          <div className='ml-2 w-[34px]' />
         </div>
       </HStack>
     </Stack>
diff --git a/app/soapbox/features/placeholder/components/placeholder-chat.tsx b/app/soapbox/features/placeholder/components/placeholder-chat.tsx
index 477539c205..67149b9daa 100644
--- a/app/soapbox/features/placeholder/components/placeholder-chat.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-chat.tsx
@@ -8,7 +8,7 @@ import PlaceholderDisplayName from './placeholder-display-name';
 /** Fake chat to display while data is loading. */
 const PlaceholderChat = () => {
   return (
-    <div className='px-4 py-2 w-full flex flex-col animate-pulse'>
+    <div className='flex w-full animate-pulse flex-col px-4 py-2'>
       <HStack alignItems='center' space={2}>
         <PlaceholderAvatar size={40} />
 
diff --git a/app/soapbox/features/placeholder/components/placeholder-event-preview.tsx b/app/soapbox/features/placeholder/components/placeholder-event-preview.tsx
index 486b0af0cc..f29f46c6e6 100644
--- a/app/soapbox/features/placeholder/components/placeholder-event-preview.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-event-preview.tsx
@@ -9,12 +9,12 @@ const PlaceholderEventPreview = () => {
   const nameLength = randomIntFromInterval(5, 15);
 
   return (
-    <div className='w-full rounded-lg bg-gray-100 dark:bg-primary-800 relative overflow-hidden animate-pulse text-primary-50 dark:text-primary-800'>
-      <div className='bg-primary-200 dark:bg-gray-600 h-40' />
+    <div className='relative w-full animate-pulse overflow-hidden rounded-lg bg-gray-100 text-primary-50 dark:bg-primary-800 dark:text-primary-800'>
+      <div className='h-40 bg-primary-200 dark:bg-gray-600' />
       <Stack className='p-2.5' space={2}>
         <Text weight='semibold'>{generateText(eventNameLength)}</Text>
 
-        <div className='flex gap-y-1 gap-x-2 flex-wrap text-gray-700 dark:text-gray-600'>
+        <div className='flex flex-wrap gap-y-1 gap-x-2 text-gray-700 dark:text-gray-600'>
           <span>{generateText(nameLength)}</span>
           <span>{generateText(nameLength)}</span>
           <span>{generateText(nameLength)}</span>
diff --git a/app/soapbox/features/placeholder/components/placeholder-group-card.tsx b/app/soapbox/features/placeholder/components/placeholder-group-card.tsx
index fe611a7d4d..9f6507f19b 100644
--- a/app/soapbox/features/placeholder/components/placeholder-group-card.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-group-card.tsx
@@ -10,9 +10,9 @@ const PlaceholderGroupCard = () => {
   const privacyLength = randomIntFromInterval(5, 15);
 
   return (
-    <div className='overflow-hidden animate-pulse'>
-      <Stack className='bg-white dark:bg-primary-900 border border-solid border-gray-300 dark:border-primary-800 rounded-lg sm:rounded-xl'>
-        <div className='bg-primary-100 dark:bg-gray-800 h-[120px] relative -m-[1px] mb-0 rounded-t-lg sm:rounded-t-xl'>
+    <div className='animate-pulse overflow-hidden'>
+      <Stack className='rounded-lg border border-solid border-gray-300 bg-white dark:border-primary-800 dark:bg-primary-900 sm:rounded-xl'>
+        <div className='relative -m-[1px] mb-0 h-[120px] rounded-t-lg bg-primary-100 dark:bg-gray-800 sm:rounded-t-xl'>
           <div className='absolute left-1/2 bottom-0 -translate-x-1/2 translate-y-1/2'>
             <div className='h-16 w-16 rounded-full bg-primary-500 ring-2 ring-white dark:ring-primary-900' />
           </div>
diff --git a/app/soapbox/features/placeholder/components/placeholder-notification.tsx b/app/soapbox/features/placeholder/components/placeholder-notification.tsx
index fbeec6a423..d8c301a4ef 100644
--- a/app/soapbox/features/placeholder/components/placeholder-notification.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-notification.tsx
@@ -8,7 +8,7 @@ import PlaceholderStatusContent from './placeholder-status-content';
 
 /** Fake notification to display while data is loading. */
 const PlaceholderNotification = () => (
-  <div className='bg-white dark:bg-primary-900 px-4 py-6 sm:p-6'>
+  <div className='bg-white px-4 py-6 dark:bg-primary-900 sm:p-6'>
     <div className='w-full animate-pulse'>
       <div className='mb-2'>
         <PlaceholderStatusContent minLength={20} maxLength={20} />
@@ -16,7 +16,7 @@ const PlaceholderNotification = () => (
 
       <div>
         <HStack space={3} alignItems='center'>
-          <div className='flex-shrink-0'>
+          <div className='shrink-0'>
             <PlaceholderAvatar size={48} />
           </div>
 
diff --git a/app/soapbox/features/placeholder/components/placeholder-sidebar-suggestions.tsx b/app/soapbox/features/placeholder/components/placeholder-sidebar-suggestions.tsx
index e96268cb27..9cc1c4448d 100644
--- a/app/soapbox/features/placeholder/components/placeholder-sidebar-suggestions.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-sidebar-suggestions.tsx
@@ -14,7 +14,7 @@ export default ({ limit }: { limit: number }) => {
         <HStack key={idx} alignItems='center' space={2} className='animate-pulse'>
           <Stack space={3} className='text-center'>
             <div
-              className='w-9 h-9 block mx-auto rounded-full bg-primary-200 dark:bg-primary-700'
+              className='mx-auto block h-9 w-9 rounded-full bg-primary-200 dark:bg-primary-700'
             />
           </Stack>
 
diff --git a/app/soapbox/features/placeholder/components/placeholder-status.tsx b/app/soapbox/features/placeholder/components/placeholder-status.tsx
index 51cb4a5cea..7dc83f5716 100644
--- a/app/soapbox/features/placeholder/components/placeholder-status.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-status.tsx
@@ -22,7 +22,7 @@ const PlaceholderStatus: React.FC<IPlaceholderStatus> = ({ thread = false }) =>
     <div className='w-full animate-pulse overflow-hidden'>
       <div>
         <HStack space={3} alignItems='center'>
-          <div className='flex-shrink-0'>
+          <div className='shrink-0'>
             <PlaceholderAvatar size={42} />
           </div>
 
@@ -32,7 +32,7 @@ const PlaceholderStatus: React.FC<IPlaceholderStatus> = ({ thread = false }) =>
         </HStack>
       </div>
 
-      <div className='mt-4 status__content-wrapper'>
+      <div className='status__content-wrapper mt-4'>
         <PlaceholderStatusContent minLength={5} maxLength={120} />
       </div>
     </div>
diff --git a/app/soapbox/features/public-layout/components/footer.tsx b/app/soapbox/features/public-layout/components/footer.tsx
index 188a20edab..0f6435f0ab 100644
--- a/app/soapbox/features/public-layout/components/footer.tsx
+++ b/app/soapbox/features/public-layout/components/footer.tsx
@@ -21,7 +21,7 @@ const Footer = () => {
   });
 
   return (
-    <footer className='relative max-w-7xl mt-auto mx-auto py-12 px-4 sm:px-6 xl:flex xl:items-center xl:justify-between lg:px-8'>
+    <footer className='relative mx-auto mt-auto max-w-7xl py-12 px-4 sm:px-6 lg:px-8 xl:flex xl:items-center xl:justify-between'>
       <div className='flex flex-wrap justify-center'>
         {navlinks.map((link, idx) => {
           const url = link.get('url');
@@ -31,7 +31,7 @@ const Footer = () => {
 
           return (
             <div key={idx} className='px-5 py-2'>
-              <Comp {...compProps} className='text-primary-600 dark:text-primary-400 hover:underline'>
+              <Comp {...compProps} className='text-primary-600 hover:underline dark:text-primary-400'>
                 <Text tag='span' theme='inherit' size='sm'>
                   {(link.getIn(['titleLocales', locale]) || link.get('title')) as string}
                 </Text>
diff --git a/app/soapbox/features/public-layout/components/header.tsx b/app/soapbox/features/public-layout/components/header.tsx
index e771fe5cdd..73e22ddca9 100644
--- a/app/soapbox/features/public-layout/components/header.tsx
+++ b/app/soapbox/features/public-layout/components/header.tsx
@@ -66,10 +66,10 @@ const Header = () => {
 
   return (
     <header data-testid='public-layout-header'>
-      <nav className='max-w-7xl mx-auto px-4 sm:px-6 lg:px-8' aria-label='Header'>
-        <div className='w-full py-6 flex items-center justify-between border-b border-indigo-500 lg:border-none'>
-          <div className='flex items-center sm:justify-center relative w-36'>
-            <div className='hidden md:block absolute z-0 -top-24 -left-6'>
+      <nav className='mx-auto max-w-7xl px-4 sm:px-6 lg:px-8' aria-label='Header'>
+        <div className='flex w-full items-center justify-between border-b border-indigo-500 py-6 lg:border-none'>
+          <div className='relative flex w-36 items-center sm:justify-center'>
+            <div className='absolute -top-24 -left-6 z-0 hidden md:block'>
               <Sonar />
             </div>
 
@@ -77,7 +77,7 @@ const Header = () => {
               title={intl.formatMessage(messages.menu)}
               src={require('@tabler/icons/menu-2.svg')}
               onClick={open}
-              className='md:hidden mr-4 bg-transparent text-gray-700 dark:text-gray-600 hover:text-gray-600'
+              className='mr-4 bg-transparent text-gray-700 hover:text-gray-600 dark:text-gray-600 md:hidden'
             />
 
             <Link to='/' className='z-10'>
@@ -87,21 +87,21 @@ const Header = () => {
 
           </div>
 
-          <HStack space={6} alignItems='center' className='ml-10 relative z-10'>
+          <HStack space={6} alignItems='center' className='relative z-10 ml-10'>
             <HStack alignItems='center'>
-              <HStack space={6} alignItems='center' className='hidden md:flex md:mr-6'>
+              <HStack space={6} alignItems='center' className='hidden md:mr-6 md:flex'>
                 {links.get('help') && (
                   <a
                     href={links.get('help')}
                     target='_blank'
-                    className='text-sm font-medium text-gray-700 dark:text-gray-600 hover:underline'
+                    className='text-sm font-medium text-gray-700 hover:underline dark:text-gray-600'
                   >
                     <FormattedMessage id='landing_page_modal.helpCenter' defaultMessage='Help Center' />
                   </a>
                 )}
               </HStack>
 
-              <HStack space={2} className='xl:hidden shrink-0'>
+              <HStack space={2} className='shrink-0 xl:hidden'>
                 <Button to='/login' theme='tertiary'>
                   {intl.formatMessage(messages.login)}
                 </Button>
@@ -117,7 +117,7 @@ const Header = () => {
               </HStack>
             </HStack>
 
-            <Form className='hidden xl:flex space-x-2 rtl:space-x-reverse items-center' onSubmit={handleSubmit}>
+            <Form className='hidden items-center space-x-2 rtl:space-x-reverse xl:flex' onSubmit={handleSubmit}>
               <Input
                 required
                 value={username}
@@ -145,7 +145,7 @@ const Header = () => {
                 <Tooltip text={intl.formatMessage(messages.forgotPassword)}>
                   <IconButton
                     src={require('@tabler/icons/help.svg')}
-                    className='bg-transparent text-gray-700 dark:text-gray-600 hover:text-gray-800 dark:hover:text-gray-500 cursor-pointer'
+                    className='cursor-pointer bg-transparent text-gray-700 hover:text-gray-800 dark:text-gray-600 dark:hover:text-gray-500'
                     iconClassName='w-5 h-5'
                     transparent
                   />
diff --git a/app/soapbox/features/public-layout/components/sonar.tsx b/app/soapbox/features/public-layout/components/sonar.tsx
index e07ff4b8e9..cefcf97d04 100644
--- a/app/soapbox/features/public-layout/components/sonar.tsx
+++ b/app/soapbox/features/public-layout/components/sonar.tsx
@@ -2,13 +2,13 @@ import React from 'react';
 
 const Sonar = () => (
   <div className='relative'>
-    <div className='relative w-48 h-48'>
-      <div className='animate-sonar-scale-4 absolute top-0 left-0 w-full h-full rounded-full bg-primary-600/25 dark:bg-primary-600/25 opacity-0 pointer-events-none' />
-      <div className='animate-sonar-scale-3 absolute top-0 left-0 w-full h-full rounded-full bg-primary-600/25 dark:bg-primary-600/25 opacity-0 pointer-events-none' />
-      <div className='animate-sonar-scale-2 absolute top-0 left-0 w-full h-full rounded-full bg-primary-600/25 dark:bg-primary-600/25 opacity-0 pointer-events-none' />
-      <div className='animate-sonar-scale-1 absolute top-0 left-0 w-full h-full rounded-full bg-primary-600/25 dark:bg-primary-600/25 opacity-0 pointer-events-none' />
+    <div className='relative h-48 w-48'>
+      <div className='pointer-events-none absolute top-0 left-0 h-full w-full animate-sonar-scale-4 rounded-full bg-primary-600/25 opacity-0 dark:bg-primary-600/25' />
+      <div className='pointer-events-none absolute top-0 left-0 h-full w-full animate-sonar-scale-3 rounded-full bg-primary-600/25 opacity-0 dark:bg-primary-600/25' />
+      <div className='pointer-events-none absolute top-0 left-0 h-full w-full animate-sonar-scale-2 rounded-full bg-primary-600/25 opacity-0 dark:bg-primary-600/25' />
+      <div className='pointer-events-none absolute top-0 left-0 h-full w-full animate-sonar-scale-1 rounded-full bg-primary-600/25 opacity-0 dark:bg-primary-600/25' />
 
-      <div className='absolute top-0 left-0 w-48 h-48 bg-white dark:bg-primary-900 rounded-full' />
+      <div className='absolute top-0 left-0 h-48 w-48 rounded-full bg-white dark:bg-primary-900' />
     </div>
   </div>
 );
diff --git a/app/soapbox/features/public-layout/index.tsx b/app/soapbox/features/public-layout/index.tsx
index 0fdc8b946d..4b5801eb0f 100644
--- a/app/soapbox/features/public-layout/index.tsx
+++ b/app/soapbox/features/public-layout/index.tsx
@@ -22,8 +22,8 @@ const PublicLayout = () => {
     <div className='h-full'>
       <LandingGradient />
 
-      <div className='flex flex-col h-screen'>
-        <div className='flex-shrink-0'>
+      <div className='flex h-screen flex-col'>
+        <div className='shrink-0'>
           <Header />
 
           <div className='relative'>
diff --git a/app/soapbox/features/security/mfa/enable-otp-form.tsx b/app/soapbox/features/security/mfa/enable-otp-form.tsx
index 7bc6e1377b..1d9be87497 100644
--- a/app/soapbox/features/security/mfa/enable-otp-form.tsx
+++ b/app/soapbox/features/security/mfa/enable-otp-form.tsx
@@ -41,14 +41,14 @@ const EnableOtpForm: React.FC<IEnableOtpForm> = ({ displayOtpForm, handleSetupPr
           <FormattedMessage id='mfa.setup_warning' defaultMessage="Write these codes down or save them somewhere secure - otherwise you won't see them again. If you lose access to your 2FA app and recovery codes you'll be locked out of your account." />
         </Text>
 
-        <div className='border-2 border-solid border-gray-200 dark:border-gray-800 rounded-lg p-4'>
+        <div className='rounded-lg border-2 border-solid border-gray-200 p-4 dark:border-gray-800'>
           <Stack space={3}>
             <Text weight='medium' align='center'>
               <FormattedMessage id='mfa.setup_recoverycodes' defaultMessage='Recovery codes' />
             </Text>
 
             {backupCodes.length > 0 ? (
-              <div className='grid gap-3 grid-cols-2 rounded-lg text-center'>
+              <div className='grid grid-cols-2 gap-3 rounded-lg text-center'>
                 {backupCodes.map((code, i) => (
                   <Text key={i} theme='muted' size='sm'>
                     {code}
diff --git a/app/soapbox/features/settings/media-display.tsx b/app/soapbox/features/settings/media-display.tsx
index ee522347fd..d89aae6fc5 100644
--- a/app/soapbox/features/settings/media-display.tsx
+++ b/app/soapbox/features/settings/media-display.tsx
@@ -39,7 +39,7 @@ const MediaDisplay = () => {
       </CardHeader>
 
       <CardBody>
-        <SimpleForm className='p-0 space-y-3'>
+        <SimpleForm className='space-y-3 p-0'>
           <List>
             <ListItem label={intl.formatMessage(messages.mediaDisplay)}>
               <SelectDropdown
diff --git a/app/soapbox/features/soapbox-config/components/color-with-picker.tsx b/app/soapbox/features/soapbox-config/components/color-with-picker.tsx
index be166cb9f9..408c912839 100644
--- a/app/soapbox/features/soapbox-config/components/color-with-picker.tsx
+++ b/app/soapbox/features/soapbox-config/components/color-with-picker.tsx
@@ -42,7 +42,7 @@ const ColorWithPicker: React.FC<IColorWithPicker> = ({ value, onChange, classNam
     <div className={className}>
       <div
         ref={node}
-        className='w-full h-full'
+        className='h-full w-full'
         role='presentation'
         style={{ background: value }}
         title={value}
diff --git a/app/soapbox/features/soapbox-config/components/icon-picker-dropdown.tsx b/app/soapbox/features/soapbox-config/components/icon-picker-dropdown.tsx
index 9a5f903992..03d6e194b3 100644
--- a/app/soapbox/features/soapbox-config/components/icon-picker-dropdown.tsx
+++ b/app/soapbox/features/soapbox-config/components/icon-picker-dropdown.tsx
@@ -59,7 +59,7 @@ const IconPickerDropdown: React.FC<IIconPickerDropdown> = ({ value, onPickEmoji
     <div onKeyDown={handleKeyDown}>
       <div
         ref={target}
-        className='h-[38px] w-[38px] text-lg flex items-center justify-center cursor-pointer'
+        className='flex h-[38px] w-[38px] cursor-pointer items-center justify-center text-lg'
         title={title}
         aria-label={title}
         aria-expanded={active}
diff --git a/app/soapbox/features/soapbox-config/components/icon-picker.tsx b/app/soapbox/features/soapbox-config/components/icon-picker.tsx
index f1e3de6707..1f0e820601 100644
--- a/app/soapbox/features/soapbox-config/components/icon-picker.tsx
+++ b/app/soapbox/features/soapbox-config/components/icon-picker.tsx
@@ -9,7 +9,7 @@ interface IIconPicker {
 
 const IconPicker: React.FC<IIconPicker> = ({ value, onChange }) => {
   return (
-    <div className='mt-1 relative rounded-md shadow-sm dark:bg-gray-800 border border-solid border-gray-300 dark:border-gray-600'>
+    <div className='relative mt-1 rounded-md border border-solid border-gray-300 shadow-sm dark:border-gray-600 dark:bg-gray-800'>
       <IconPickerDropdown value={value} onPickEmoji={onChange} />
     </div>
   );
diff --git a/app/soapbox/features/soapbox-config/components/site-preview.tsx b/app/soapbox/features/soapbox-config/components/site-preview.tsx
index b9f795d4a4..08095f3323 100644
--- a/app/soapbox/features/soapbox-config/components/site-preview.tsx
+++ b/app/soapbox/features/soapbox-config/components/site-preview.tsx
@@ -39,7 +39,7 @@ const SitePreview: React.FC<ISitePreview> = ({ soapbox }) => {
       <style>{`.site-preview {${generateThemeCss(soapboxConfig)}}`}</style>
       <BackgroundShapes position='absolute' />
 
-      <div className='absolute p-2 rounded-lg overflow-hidden bg-accent-500 text-white self-center z-20'>
+      <div className='absolute z-20 self-center overflow-hidden rounded-lg bg-accent-500 p-2 text-white'>
         <FormattedMessage id='site_preview.preview' defaultMessage='Preview' />
       </div>
 
@@ -48,7 +48,7 @@ const SitePreview: React.FC<ISitePreview> = ({ soapbox }) => {
         'bg-gray-800': dark,
       })}
       >
-        <SiteLogo alt='Logo' className='h-5 lg:h-6 w-auto self-center px-2' theme={dark ? 'dark' : 'light'} />
+        <SiteLogo alt='Logo' className='h-5 w-auto self-center px-2 lg:h-6' theme={dark ? 'dark' : 'light'} />
       </div>
     </div>
   );
diff --git a/app/soapbox/features/status/components/card.tsx b/app/soapbox/features/status/components/card.tsx
index 6fdad7cd74..7e659d075f 100644
--- a/app/soapbox/features/status/components/card.tsx
+++ b/app/soapbox/features/status/components/card.tsx
@@ -153,7 +153,7 @@ const Card: React.FC<ICard> = ({
 
   const canvas = (
     <Blurhash
-      className='absolute w-full h-full inset-0 -z-10'
+      className='absolute inset-0 -z-10 h-full w-full'
       hash={card.blurhash}
     />
   );
@@ -185,12 +185,12 @@ const Card: React.FC<ICard> = ({
           {thumbnail}
 
           <div className='absolute inset-0 flex items-center justify-center'>
-            <div className='bg-gray-500/90 dark:bg-gray-700/90 shadow-md rounded-full px-4 py-3 flex items-center justify-center'>
+            <div className='flex items-center justify-center rounded-full bg-gray-500/90 px-4 py-3 shadow-md dark:bg-gray-700/90'>
               <HStack space={3} alignItems='center'>
-                <button onClick={handleEmbedClick} className='appearance-none text-gray-700 dark:text-gray-500 hover:text-gray-900 dark:hover:text-gray-100'>
+                <button onClick={handleEmbedClick} className='appearance-none text-gray-700 hover:text-gray-900 dark:text-gray-500 dark:hover:text-gray-100'>
                   <Icon
                     src={iconVariant}
-                    className='w-6 h-6 text-inherit'
+                    className='h-6 w-6 text-inherit'
                   />
                 </button>
 
@@ -200,11 +200,11 @@ const Card: React.FC<ICard> = ({
                     href={card.url}
                     target='_blank'
                     rel='noopener'
-                    className='text-gray-700 dark:text-gray-500 hover:text-gray-900 dark:hover:text-gray-100'
+                    className='text-gray-700 hover:text-gray-900 dark:text-gray-500 dark:hover:text-gray-100'
                   >
                     <Icon
                       src={require('@tabler/icons/external-link.svg')}
-                      className='w-6 h-6 text-inherit'
+                      className='h-6 w-6 text-inherit'
                     />
                   </a>
                 )}
@@ -225,7 +225,7 @@ const Card: React.FC<ICard> = ({
     embed = (
       <div className={classnames(
         'status-card__image',
-        'w-full rounded-l md:w-auto md:h-auto flex-none md:flex-auto',
+        'w-full flex-none rounded-l md:h-auto md:w-auto md:flex-auto',
         {
           'h-auto': horizontal,
           'h-[200px]': !horizontal,
diff --git a/app/soapbox/features/status/components/status-interaction-bar.tsx b/app/soapbox/features/status/components/status-interaction-bar.tsx
index 42ce3e691b..b69fa3ecfc 100644
--- a/app/soapbox/features/status/components/status-interaction-bar.tsx
+++ b/app/soapbox/features/status/components/status-interaction-bar.tsx
@@ -152,7 +152,7 @@ const StatusInteractionBar: React.FC<IStatusInteractionBar> = ({ status }): JSX.
               return (
                 <Emoji
                   key={i}
-                  className='w-4.5 h-4.5 flex-none'
+                  className='h-4.5 w-4.5 flex-none'
                   emoji={e.get('name')}
                 />
               );
diff --git a/app/soapbox/features/status/components/thread-login-cta.tsx b/app/soapbox/features/status/components/thread-login-cta.tsx
index 26462cd201..34fcf83664 100644
--- a/app/soapbox/features/status/components/thread-login-cta.tsx
+++ b/app/soapbox/features/status/components/thread-login-cta.tsx
@@ -12,7 +12,7 @@ const ThreadLoginCta: React.FC = () => {
   if (!displayCta) return null;
 
   return (
-    <Card className='px-6 py-12 space-y-6 text-center' variant='rounded'>
+    <Card className='space-y-6 px-6 py-12 text-center' variant='rounded'>
       <Stack>
         <CardTitle title={<FormattedMessage id='thread_login.title' defaultMessage='Continue the conversation' />} />
         <Text>
@@ -24,7 +24,7 @@ const ThreadLoginCta: React.FC = () => {
         </Text>
       </Stack>
 
-      <Stack space={4} className='max-w-xs mx-auto'>
+      <Stack space={4} className='mx-auto max-w-xs'>
         <Button theme='tertiary' to='/login' block>
           <FormattedMessage id='thread_login.login' defaultMessage='Log in' />
         </Button>
diff --git a/app/soapbox/features/theme-editor/components/color.tsx b/app/soapbox/features/theme-editor/components/color.tsx
index 79d1c9eb1a..fd1e7d8f7a 100644
--- a/app/soapbox/features/theme-editor/components/color.tsx
+++ b/app/soapbox/features/theme-editor/components/color.tsx
@@ -18,7 +18,7 @@ const Color: React.FC<IColor> = ({ color, onChange }) => {
 
   return (
     <ColorWithPicker
-      className='w-full h-full'
+      className='h-full w-full'
       value={color}
       onChange={handleChange}
     />
diff --git a/app/soapbox/features/theme-editor/components/palette.tsx b/app/soapbox/features/theme-editor/components/palette.tsx
index 95eb20e50e..748f2c17f0 100644
--- a/app/soapbox/features/theme-editor/components/palette.tsx
+++ b/app/soapbox/features/theme-editor/components/palette.tsx
@@ -50,7 +50,7 @@ const Palette: React.FC<IPalette> = ({ palette, onChange, resetKey }) => {
 
   return (
     <Stack className='w-full'>
-      <HStack className='h-8 rounded-md overflow-hidden'>
+      <HStack className='h-8 overflow-hidden rounded-md'>
         {tints.map(tint => (
           <Color color={palette[tint]} onChange={handleChange(tint)} />
         ))}
diff --git a/app/soapbox/features/theme-editor/index.tsx b/app/soapbox/features/theme-editor/index.tsx
index 43a4742539..1cd1c7ce1c 100644
--- a/app/soapbox/features/theme-editor/index.tsx
+++ b/app/soapbox/features/theme-editor/index.tsx
@@ -264,7 +264,7 @@ const ColorListItem: React.FC<IColorListItem> = ({ label, value, onChange }) =>
       <ColorWithPicker
         value={value}
         onChange={handleChange}
-        className='w-10 h-8 rounded-md overflow-hidden'
+        className='h-8 w-10 overflow-hidden rounded-md'
       />
     </ListItem>
   );
diff --git a/app/soapbox/features/ui/components/background-shapes.tsx b/app/soapbox/features/ui/components/background-shapes.tsx
index 658d73f4ad..1244fa1abd 100644
--- a/app/soapbox/features/ui/components/background-shapes.tsx
+++ b/app/soapbox/features/ui/components/background-shapes.tsx
@@ -9,7 +9,7 @@ interface IBackgroundShapes {
 /** Gradient that appears in the background of the UI. */
 const BackgroundShapes: React.FC<IBackgroundShapes> = ({ position = 'fixed' }) => (
   <div className={classNames(position, 'top-0 inset-x-0 flex justify-center overflow-hidden pointer-events-none')}>
-    <div className='w-screen h-screen bg-gradient-sm lg:bg-gradient-light lg:dark:bg-gradient-dark' />
+    <div className='bg-gradient-sm lg:bg-gradient-light lg:dark:bg-gradient-dark h-screen w-screen' />
   </div>
 );
 
diff --git a/app/soapbox/features/ui/components/bundle-column-error.tsx b/app/soapbox/features/ui/components/bundle-column-error.tsx
index c3e8396233..4ec1af231d 100644
--- a/app/soapbox/features/ui/components/bundle-column-error.tsx
+++ b/app/soapbox/features/ui/components/bundle-column-error.tsx
@@ -22,7 +22,7 @@ const BundleColumnError: React.FC<IBundleColumnError> = ({ onRetry }) => {
 
   return (
     <Column label={intl.formatMessage(messages.title)}>
-      <Stack space={4} alignItems='center' justifyContent='center' className='p-10 min-h-[160px] rounded-lg'>
+      <Stack space={4} alignItems='center' justifyContent='center' className='min-h-[160px] rounded-lg p-10'>
         <IconButton
           iconClassName='w-10 h-10'
           title={intl.formatMessage(messages.retry)}
diff --git a/app/soapbox/features/ui/components/floating-action-button.tsx b/app/soapbox/features/ui/components/floating-action-button.tsx
index de00b55a72..9bfb628486 100644
--- a/app/soapbox/features/ui/components/floating-action-button.tsx
+++ b/app/soapbox/features/ui/components/floating-action-button.tsx
@@ -26,14 +26,14 @@ const FloatingActionButton: React.FC<IFloatingActionButton> = () => {
     <button
       onClick={handleOpenComposeModal}
       className={clsx(
-        'p-4 inline-flex items-center border font-medium rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 appearance-none transition-all',
-        'border-transparent bg-secondary-500 hover:bg-secondary-400 focus:bg-secondary-500 text-gray-100 focus:ring-secondary-300',
+        'inline-flex appearance-none items-center rounded-full border p-4 font-medium transition-all focus:outline-none focus:ring-2 focus:ring-offset-2',
+        'border-transparent bg-secondary-500 text-gray-100 hover:bg-secondary-400 focus:bg-secondary-500 focus:ring-secondary-300',
       )}
       aria-label={intl.formatMessage(messages.publish)}
     >
       <Icon
         src={require('@tabler/icons/pencil-plus.svg')}
-        className='w-6 h-6'
+        className='h-6 w-6'
       />
     </button>
   );
diff --git a/app/soapbox/features/ui/components/link-footer.tsx b/app/soapbox/features/ui/components/link-footer.tsx
index 62c88cf95d..5b76996185 100644
--- a/app/soapbox/features/ui/components/link-footer.tsx
+++ b/app/soapbox/features/ui/components/link-footer.tsx
@@ -38,7 +38,7 @@ const LinkFooter: React.FC = (): JSX.Element => {
 
   return (
     <div className='space-y-2'>
-      <div className='flex flex-wrap items-center divide-x-dot text-gray-600'>
+      <div className='divide-x-dot flex flex-wrap items-center text-gray-600'>
         {account && <>
           {features.profileDirectory && (
             <FooterLink to='/directory'><FormattedMessage id='navigation_bar.profile_directory' defaultMessage='Profile directory' /></FooterLink>
diff --git a/app/soapbox/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx b/app/soapbox/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx
index bd075cd543..9dfafed5bc 100644
--- a/app/soapbox/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx
@@ -145,7 +145,7 @@ const AccountModerationModal: React.FC<IAccountModerationModal> = ({ onClose, ac
           )}
 
           <ListItem label={<FormattedMessage id='account_moderation_modal.fields.badges' defaultMessage='Custom badges' />}>
-            <div className='flex-grow'>
+            <div className='grow'>
               <HStack className='w-full' alignItems='center' space={2}>
                 <BadgeInput badges={badges} onChange={setBadges} />
                 <Button onClick={handleSaveBadges}>
diff --git a/app/soapbox/features/ui/components/modals/actions-modal.tsx b/app/soapbox/features/ui/components/modals/actions-modal.tsx
index ab2ca6402c..4bdbb2ee6f 100644
--- a/app/soapbox/features/ui/components/modals/actions-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/actions-modal.tsx
@@ -56,7 +56,7 @@ const ActionsModal: React.FC<IActionsModal> = ({ status, actions, onClick, onClo
       {({ top }) => (
         <div className='modal-root__modal actions-modal' style={{ top: `${top}%` }}>
           {status && (
-            <Stack space={2} className='p-4 bg-gray-50 dark:bg-gray-800 border-b border-solid border-gray-200 dark:border-gray-700'>
+            <Stack space={2} className='border-b border-solid border-gray-200 bg-gray-50 p-4 dark:border-gray-700 dark:bg-gray-800'>
               <AccountContainer
                 key={status.account as string}
                 id={status.account as string}
diff --git a/app/soapbox/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx b/app/soapbox/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx
index eba0353010..0bd8d34d45 100644
--- a/app/soapbox/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx
@@ -183,7 +183,7 @@ const ComposeEventModal: React.FC<IComposeEventModal> = ({ onClose }) => {
   const renderLocation = () => location && (
     <HStack className='h-[38px] text-gray-700 dark:text-gray-500' alignItems='center' space={2}>
       <Icon src={ADDRESS_ICONS[location.type] || require('@tabler/icons/map-pin.svg')} />
-      <Stack className='flex-grow'>
+      <Stack className='grow'>
         <Text>{location.description}</Text>
         <Text theme='muted' size='xs'>{[location.street, location.locality, location.country].filter(val => val.trim()).join(' · ')}</Text>
       </Stack>
@@ -214,7 +214,7 @@ const ComposeEventModal: React.FC<IComposeEventModal> = ({ onClose }) => {
       <FormGroup
         labelText={<FormattedMessage id='compose_event.fields.banner_label' defaultMessage='Event banner' />}
       >
-        <div className='flex items-center justify-center bg-primary-100 dark:bg-gray-800 rounded-lg text-primary-500 dark:text-white sm:shadow dark:sm:shadow-inset overflow-hidden h-24 sm:h-32 relative'>
+        <div className='dark:sm:shadow-inset relative flex h-24 items-center justify-center overflow-hidden rounded-lg bg-primary-100 text-primary-500 dark:bg-gray-800 dark:text-white sm:h-32 sm:shadow'>
           {banner ? (
             <>
               <img className='h-full w-full object-cover' src={banner.url} alt='' />
diff --git a/app/soapbox/features/ui/components/modals/compose-event-modal/upload-button.tsx b/app/soapbox/features/ui/components/modals/compose-event-modal/upload-button.tsx
index e9b5aa27ab..057794b6c8 100644
--- a/app/soapbox/features/ui/components/modals/compose-event-modal/upload-button.tsx
+++ b/app/soapbox/features/ui/components/modals/compose-event-modal/upload-button.tsx
@@ -27,7 +27,7 @@ const UploadButton: React.FC<IUploadButton> = ({ disabled, onSelectFile }) => {
   };
 
   return (
-    <HStack className='h-full w-full text-primary-500 dark:text-accent-blue cursor-pointer' space={3} alignItems='center' justifyContent='center' element='label'>
+    <HStack className='h-full w-full cursor-pointer text-primary-500 dark:text-accent-blue' space={3} alignItems='center' justifyContent='center' element='label'>
       <Icon
         src={require('@tabler/icons/photo-plus.svg')}
         className='h-7 w-7'
diff --git a/app/soapbox/features/ui/components/modals/embed-modal.tsx b/app/soapbox/features/ui/components/modals/embed-modal.tsx
index ae149e1380..fca111006c 100644
--- a/app/soapbox/features/ui/components/modals/embed-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/embed-modal.tsx
@@ -45,7 +45,7 @@ const EmbedModal: React.FC<IEmbedModal> = ({ url, onError }) => {
       </div>
 
       <SafeEmbed
-        className='rounded-xl overflow-hidden w-full'
+        className='w-full overflow-hidden rounded-xl'
         sandbox='allow-same-origin allow-scripts'
         title='embedded-status'
         html={embed?.html}
diff --git a/app/soapbox/features/ui/components/modals/hotkeys-modal.tsx b/app/soapbox/features/ui/components/modals/hotkeys-modal.tsx
index 870ed87369..5e3836cdc1 100644
--- a/app/soapbox/features/ui/components/modals/hotkeys-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/hotkeys-modal.tsx
@@ -9,13 +9,13 @@ interface IHotkeysModal {
 }
 
 const Hotkey: React.FC<{ children: React.ReactNode }> = ({ children }) => (
-  <kbd className='px-1.5 py-1 bg-primary-50 dark:bg-gray-800 border border-solid border-primary-200 rounded-md dark:border-gray-700 text-xs font-sans'>
+  <kbd className='rounded-md border border-solid border-primary-200 bg-primary-50 px-1.5 py-1 font-sans text-xs dark:border-gray-700 dark:bg-gray-800'>
     {children}
   </kbd>
 );
 
 const TableCell: React.FC<{ children: React.ReactNode }> = ({ children }) => (
-  <td className='pb-3 px-2'>
+  <td className='px-2 pb-3'>
     {children}
   </td>
 );
@@ -29,7 +29,7 @@ const HotkeysModal: React.FC<IHotkeysModal> = ({ onClose }) => {
       onClose={onClose}
       width='4xl'
     >
-      <div className='flex flex-col lg:flex-row text-xs'>
+      <div className='flex flex-col text-xs lg:flex-row'>
         <table>
           <thead>
             <tr>
diff --git a/app/soapbox/features/ui/components/modals/landing-page-modal.tsx b/app/soapbox/features/ui/components/modals/landing-page-modal.tsx
index addf1f14b5..44ae03a6b9 100644
--- a/app/soapbox/features/ui/components/modals/landing-page-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/landing-page-modal.tsx
@@ -32,13 +32,13 @@ const LandingPageModal: React.FC<ILandingPageModal> = ({ onClose }) => {
     >
       <div className='mt-4 divide-y divide-solid divide-gray-200 dark:divide-gray-800'>
         {links.get('help') && (
-          <nav className='grid gap-y-8 mb-6'>
+          <nav className='mb-6 grid gap-y-8'>
             <a
               href={links.get('help')}
               target='_blank'
-              className='p-3 space-x-3 flex items-center rounded-md dark:hover:bg-gray-900/50 hover:bg-gray-50'
+              className='flex items-center space-x-3 rounded-md p-3 hover:bg-gray-50 dark:hover:bg-gray-900/50'
             >
-              <Icon src={require('@tabler/icons/lifebuoy.svg')} className='flex-shrink-0 h-6 w-6 text-gray-600 dark:text-gray-700' />
+              <Icon src={require('@tabler/icons/lifebuoy.svg')} className='h-6 w-6 shrink-0 text-gray-600 dark:text-gray-700' />
 
               <Text weight='medium'>
                 {intl.formatMessage(messages.helpCenter)}
diff --git a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx
index 76cc8b161d..39cb788c61 100644
--- a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx
+++ b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/details-step.tsx
@@ -30,7 +30,7 @@ const messages = defineMessages({
 const HeaderPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }) => {
   return (
     <label
-      className='h-24 sm:h-36 w-full text-primary-500 dark:text-accent-blue bg-primary-100 dark:bg-gray-800 cursor-pointer relative rounded-lg sm:shadow dark:sm:shadow-inset overflow-hidden'
+      className='dark:sm:shadow-inset relative h-24 w-full cursor-pointer overflow-hidden rounded-lg bg-primary-100 text-primary-500 dark:bg-gray-800 dark:text-accent-blue sm:h-36 sm:shadow'
     >
       {src && <img className='h-full w-full object-cover' src={src} alt='' />}
       <HStack
@@ -65,7 +65,7 @@ const HeaderPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }
 
 const AvatarPicker: React.FC<IMediaInput> = ({ src, onChange, accept, disabled }) => {
   return (
-    <label className='h-[72px] w-[72px] bg-primary-500 cursor-pointer rounded-full absolute left-1/2 bottom-0 -translate-x-1/2 translate-y-1/2 ring-2 ring-white dark:ring-primary-900'>
+    <label className='absolute left-1/2 bottom-0 h-[72px] w-[72px] -translate-x-1/2 translate-y-1/2 cursor-pointer rounded-full bg-primary-500 ring-2 ring-white dark:ring-primary-900'>
       {src && <Avatar src={src} size={72} />}
       <HStack
         alignItems='center'
@@ -149,7 +149,7 @@ const DetailsStep = () => {
 
   return (
     <Form>
-      <div className='flex mb-12 relative'>
+      <div className='relative mb-12 flex'>
         <HeaderPicker src={headerSrc} accept={attachmentTypes} onChange={handleFileChange} disabled={isUploading} />
         <AvatarPicker src={avatarSrc} accept={attachmentTypes} onChange={handleFileChange} disabled={isUploading} />
       </div>
diff --git a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx
index e473f36f06..4e6622c3ce 100644
--- a/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx
+++ b/app/soapbox/features/ui/components/modals/manage-group-modal/steps/privacy-step.tsx
@@ -17,7 +17,7 @@ const PrivacyStep = () => {
 
   return (
     <>
-      <Stack className='max-w-sm mx-auto' space={2}>
+      <Stack className='mx-auto max-w-sm' space={2}>
         <Text size='3xl' weight='bold' align='center'>
           <FormattedMessage id='manage_group.get_started' defaultMessage="Let's get started!" />
         </Text>
diff --git a/app/soapbox/features/ui/components/modals/policy-modal.tsx b/app/soapbox/features/ui/components/modals/policy-modal.tsx
index b5048e7973..7a1d263e59 100644
--- a/app/soapbox/features/ui/components/modals/policy-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/policy-modal.tsx
@@ -15,7 +15,7 @@ const DirectMessageUpdates = () => {
 
   return (
     <Stack space={3}>
-      <Stack space={4} className='border-2 border-solid border-primary-200 dark:border-primary-800 rounded-lg p-4'>
+      <Stack space={4} className='rounded-lg border-2 border-solid border-primary-200 p-4 dark:border-primary-800'>
         <HStack alignItems='center' space={3}>
           <svg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'>
             <path d='M0 22.5306C0 10.0873 10.0873 0 22.5306 0H26.4828C38.3664 0 48 9.6336 48 21.5172V21.5172C48 36.1433 36.1433 48 21.5172 48H18.4615C8.26551 48 0 39.7345 0 29.5385V22.5306Z' fill='url(#paint0_linear_2190_131524)' fillOpacity='0.2' />
@@ -43,7 +43,7 @@ const DirectMessageUpdates = () => {
         </Text>
       </Stack>
 
-      <Stack space={4} className='border-2 border-solid border-primary-200 dark:border-primary-800 rounded-lg p-4'>
+      <Stack space={4} className='rounded-lg border-2 border-solid border-primary-200 p-4 dark:border-primary-800'>
         <HStack alignItems='center' space={3}>
           <svg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'>
             <path d='M0 25.7561C0 22.2672 0 20.5228 0.197492 19.0588C1.52172 9.24259 9.24259 1.52172 19.0588 0.197492C20.5228 0 22.2672 0 25.7561 0H30.1176C39.9938 0 48 8.0062 48 17.8824C48 34.5159 34.5159 48 17.8824 48H15.3192C15.0228 48 14.8747 48 14.7494 47.9979C6.66132 47.8627 0.137263 41.3387 0.0020943 33.2506C0 33.1253 0 32.9772 0 32.6808V25.7561Z' fill='url(#paint0_linear_2190_131532)' fillOpacity='0.2' />
@@ -61,21 +61,21 @@ const DirectMessageUpdates = () => {
 
         <ul className='space-y-2'>
           <li className='flex items-center space-x-2'>
-            <span className='text-primary-500 dark:text-primary-300 h-8 w-8 flex items-center justify-center text-sm font-bold rounded-full border-2 border-solid border-gray-200 dark:border-gray-800'>
+            <span className='flex h-8 w-8 items-center justify-center rounded-full border-2 border-solid border-gray-200 text-sm font-bold text-primary-500 dark:border-gray-800 dark:text-primary-300'>
               1
             </span>
 
             <Text theme='muted'>Consolidates previously-separate policies</Text>
           </li>
           <li className='flex items-center space-x-2'>
-            <span className='text-primary-500 dark:text-primary-300 h-8 w-8 flex items-center justify-center text-sm font-bold rounded-full border-2 border-solid border-gray-200 dark:border-gray-800'>
+            <span className='flex h-8 w-8 items-center justify-center rounded-full border-2 border-solid border-gray-200 text-sm font-bold text-primary-500 dark:border-gray-800 dark:text-primary-300'>
               2
             </span>
 
             <Text theme='muted'>Reaffirms jurisdiction-specific requirements</Text>
           </li>
           <li className='flex items-center space-x-2'>
-            <span className='text-primary-500 dark:text-primary-300 h-8 w-8 flex items-center justify-center text-sm font-bold rounded-full border-2 border-solid border-gray-200 dark:border-gray-800'>
+            <span className='flex h-8 w-8 items-center justify-center rounded-full border-2 border-solid border-gray-200 text-sm font-bold text-primary-500 dark:border-gray-800 dark:text-primary-300'>
               3
             </span>
 
@@ -85,7 +85,7 @@ const DirectMessageUpdates = () => {
 
         {links.get('privacyPolicy') ? (
           <a
-            className='text-primary-600 dark:text-accent-blue text-center font-bold hover:underline'
+            className='text-center font-bold text-primary-600 hover:underline dark:text-accent-blue'
             href={links.get('privacyPolicy')}
             target='_blank'
           >
diff --git a/app/soapbox/features/ui/components/modals/reactions-modal.tsx b/app/soapbox/features/ui/components/modals/reactions-modal.tsx
index 7afe96f866..1a01dd080f 100644
--- a/app/soapbox/features/ui/components/modals/reactions-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/reactions-modal.tsx
@@ -54,7 +54,7 @@ const ReactionsModal: React.FC<IReactionsModal> = ({ onClose, statusId, reaction
     reactions!.forEach(reaction => items.push(
       {
         text: <div className='flex items-center gap-1'>
-          <Emoji className='w-4 h-4' emoji={reaction.name} />
+          <Emoji className='h-4 w-4' emoji={reaction.name} />
           {reaction.count}
         </div>,
         action: () => setReaction(reaction.name),
diff --git a/app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx b/app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx
index 7686c16173..ed9c5c4115 100644
--- a/app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx
@@ -48,7 +48,7 @@ const SelectedStatus = ({ statusId }: { statusId: string }) => {
   }
 
   return (
-    <Stack space={2} className='p-4 rounded-lg bg-gray-100 dark:bg-gray-800'>
+    <Stack space={2} className='rounded-lg bg-gray-100 p-4 dark:bg-gray-800'>
       <AccountContainer
         id={status.account as any}
         showProfileHoverCard={false}
@@ -127,7 +127,7 @@ const ReportModal = ({ onClose }: IReportModal) => {
     switch (selectedStatusIds.size) {
       case 0:
         return (
-          <div className='bg-gray-100 dark:bg-gray-800 p-4 rounded-lg flex items-center justify-center w-full'>
+          <div className='flex w-full items-center justify-center rounded-lg bg-gray-100 p-4 dark:bg-gray-800'>
             <Text theme='muted'>{intl.formatMessage(messages.blankslate)}</Text>
           </div>
         );
@@ -190,12 +190,12 @@ const ReportModal = ({ onClose }: IReportModal) => {
     if (account) {
       return (
         <Stack space={4}>
-          <HStack alignItems='center' space={4} className='rounded-md border dark:border-2 border-solid border-gray-400 dark:border-gray-800 p-4'>
+          <HStack alignItems='center' space={4} className='rounded-md border border-solid border-gray-400 p-4 dark:border-2 dark:border-gray-800'>
             <div>
-              <Avatar src={account.avatar} className='w-8 h-8' />
+              <Avatar src={account.avatar} className='h-8 w-8' />
             </div>
 
-            <div className='bg-gray-200 dark:bg-primary-800 rounded-md p-4 flex-grow'>
+            <div className='grow rounded-md bg-gray-200 p-4 dark:bg-primary-800'>
               <Text dangerouslySetInnerHTML={{ __html: selectedChatMessage?.content as string }} />
             </div>
           </HStack>
diff --git a/app/soapbox/features/ui/components/modals/report-modal/steps/confirmation-step.tsx b/app/soapbox/features/ui/components/modals/report-modal/steps/confirmation-step.tsx
index 8a7e7581e3..eebb3d717a 100644
--- a/app/soapbox/features/ui/components/modals/report-modal/steps/confirmation-step.tsx
+++ b/app/soapbox/features/ui/components/modals/report-modal/steps/confirmation-step.tsx
@@ -25,7 +25,7 @@ const renderTermsOfServiceLink = (href: string) => (
   <a
     href={href}
     target='_blank'
-    className='hover:underline text-primary-600 dark:text-accent-blue hover:text-primary-800 dark:hover:text-accent-blue'
+    className='text-primary-600 hover:text-primary-800 hover:underline dark:text-accent-blue dark:hover:text-accent-blue'
   >
     {termsOfServiceText}
   </a>
diff --git a/app/soapbox/features/ui/components/modals/report-modal/steps/other-actions-step.tsx b/app/soapbox/features/ui/components/modals/report-modal/steps/other-actions-step.tsx
index 8c4def9682..8f58c4b35f 100644
--- a/app/soapbox/features/ui/components/modals/report-modal/steps/other-actions-step.tsx
+++ b/app/soapbox/features/ui/components/modals/report-modal/steps/other-actions-step.tsx
@@ -60,7 +60,7 @@ const OtherActionsStep = ({ account }: IOtherActionsStep) => {
           <FormGroup labelText={intl.formatMessage(messages.addAdditionalStatuses)}>
             {showAdditionalStatuses ? (
               <Stack space={2}>
-                <div className='divide-y divide-gray-200 dark:divide-gray-800 divide-solid'>
+                <div className='divide-y divide-solid divide-gray-200 dark:divide-gray-800'>
                   {statusIds.map((statusId) => <StatusCheckBox id={statusId} key={statusId} />)}
                 </div>
 
diff --git a/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx b/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx
index 6cf653c6b0..9cfc44aaa4 100644
--- a/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx
+++ b/app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx
@@ -94,7 +94,7 @@ const ReasonStep = (_props: IReasonStep) => {
           <div className='relative'>
             <div
               style={{ maxHeight: RULES_HEIGHT }}
-              className='rounded-lg -space-y-px overflow-y-auto'
+              className='-space-y-px overflow-y-auto rounded-lg'
               onScroll={handleRulesScrolling}
               ref={rulesListRef}
             >
@@ -131,7 +131,7 @@ const ReasonStep = (_props: IReasonStep) => {
                       value={rule.id}
                       checked={isSelected}
                       readOnly
-                      className='border-2 dark:bg-gray-900 dark:border-gray-800 checked:bg-primary-500 dark:checked:bg-primary-500 focus:ring-primary-500 dark:focus:ring-primary-500 h-4 w-4 text-primary-600 border-gray-300 rounded'
+                      className='h-4 w-4 rounded border-2 border-gray-300 text-primary-600 checked:bg-primary-500 focus:ring-primary-500 dark:border-gray-800 dark:bg-gray-900 dark:checked:bg-primary-500 dark:focus:ring-primary-500'
                     />
                   </button>
                 );
diff --git a/app/soapbox/features/ui/components/modals/video-modal.tsx b/app/soapbox/features/ui/components/modals/video-modal.tsx
index 13bef96388..baa94f17ea 100644
--- a/app/soapbox/features/ui/components/modals/video-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/video-modal.tsx
@@ -31,7 +31,7 @@ const VideoModal: React.FC<IVideoModal> = ({ status, account, media, time, onClo
   );
 
   return (
-    <div className='block w-full max-w-xl mx-auto overflow-hidden text-left align-middle transition-all transform shadow-xl rounded-2xl pointer-events-auto'>
+    <div className='pointer-events-auto mx-auto block w-full max-w-xl overflow-hidden rounded-2xl text-left align-middle shadow-xl transition-all'>
       <Video
         preview={media.preview_url}
         blurhash={media.blurhash}
diff --git a/app/soapbox/features/ui/components/navbar.tsx b/app/soapbox/features/ui/components/navbar.tsx
index dc8896e339..eb73496fa3 100644
--- a/app/soapbox/features/ui/components/navbar.tsx
+++ b/app/soapbox/features/ui/components/navbar.tsx
@@ -63,11 +63,11 @@ const Navbar = () => {
   if (mfaToken) return <Redirect to={`/login?token=${encodeURIComponent(mfaToken)}`} />;
 
   return (
-    <nav className='bg-white dark:bg-primary-900 shadow z-50 sticky top-0' ref={node} data-testid='navbar'>
-      <div className='max-w-7xl mx-auto px-2 sm:px-6 lg:px-8'>
-        <div className='relative flex justify-between h-12 lg:h-16'>
+    <nav className='sticky top-0 z-50 bg-white shadow dark:bg-primary-900' ref={node} data-testid='navbar'>
+      <div className='mx-auto max-w-7xl px-2 sm:px-6 lg:px-8'>
+        <div className='relative flex h-12 justify-between lg:h-16'>
           {account && (
-            <div className='absolute inset-y-0 left-0 flex items-center lg:hidden rtl:right-0 rtl:left-auto'>
+            <div className='absolute inset-y-0 left-0 flex items-center rtl:right-0 rtl:left-auto lg:hidden'>
               <button onClick={onOpenSidebar}>
                 <Avatar src={account.avatar} size={34} />
               </button>
@@ -82,14 +82,14 @@ const Navbar = () => {
               'justify-start': !account,
             })}
           >
-            <Link key='logo' to='/' data-preview-title-id='column.home' className='flex-shrink-0 flex items-center'>
+            <Link key='logo' to='/' data-preview-title-id='column.home' className='flex shrink-0 items-center'>
               <SiteLogo alt='Logo' className='h-5 w-auto cursor-pointer' />
               <span className='hidden'><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /></span>
             </Link>
 
             {account && (
-              <div className='flex-1 hidden lg:flex justify-center px-2 lg:ml-6 lg:justify-start items-center'>
-                <div className='max-w-xl w-full lg:max-w-xs hidden lg:block'>
+              <div className='hidden flex-1 items-center justify-center px-2 lg:ml-6 lg:flex lg:justify-start'>
+                <div className='hidden w-full max-w-xl lg:block lg:max-w-xs'>
                   <Search openInRoute autosuggest />
                 </div>
               </div>
@@ -98,14 +98,14 @@ const Navbar = () => {
 
           <HStack space={3} alignItems='center' className='absolute inset-y-0 right-0 pr-2 lg:static lg:inset-auto lg:ml-6 lg:pr-0'>
             {account ? (
-              <div className='hidden relative lg:flex items-center'>
+              <div className='relative hidden items-center lg:flex'>
                 <ProfileDropdown account={account}>
                   <Avatar src={account.avatar} size={34} />
                 </ProfileDropdown>
               </div>
             ) : (
               <>
-                <Form className='hidden lg:flex space-x-2 rtl:space-x-reverse items-center' onSubmit={handleSubmit}>
+                <Form className='hidden items-center space-x-2 rtl:space-x-reverse lg:flex' onSubmit={handleSubmit}>
                   <Input
                     required
                     value={username}
@@ -128,7 +128,7 @@ const Navbar = () => {
                     <Tooltip text={intl.formatMessage(messages.forgotPassword)}>
                       <IconButton
                         src={require('@tabler/icons/help.svg')}
-                        className='bg-transparent text-gray-400 dark:text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 cursor-pointer'
+                        className='cursor-pointer bg-transparent text-gray-400 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-200'
                         iconClassName='w-5 h-5'
                       />
                     </Tooltip>
diff --git a/app/soapbox/features/ui/components/profile-familiar-followers.tsx b/app/soapbox/features/ui/components/profile-familiar-followers.tsx
index dd96cca837..d7bc1a10aa 100644
--- a/app/soapbox/features/ui/components/profile-familiar-followers.tsx
+++ b/app/soapbox/features/ui/components/profile-familiar-followers.tsx
@@ -54,7 +54,7 @@ const ProfileFamiliarFollowers: React.FC<IProfileFamiliarFollowers> = ({ account
 
   if (familiarFollowerIds.size > 2) {
     accounts.push(
-      <span className='hover:underline cursor-pointer' role='presentation' onClick={openFamiliarFollowersModal}>
+      <span className='cursor-pointer hover:underline' role='presentation' onClick={openFamiliarFollowersModal}>
         <FormattedMessage
           id='account.familiar_followers.more'
           defaultMessage='{count, plural, one {# other} other {# others}} you follow'
diff --git a/app/soapbox/features/ui/components/profile-field.tsx b/app/soapbox/features/ui/components/profile-field.tsx
index 2593c52010..fa8203d310 100644
--- a/app/soapbox/features/ui/components/profile-field.tsx
+++ b/app/soapbox/features/ui/components/profile-field.tsx
@@ -63,7 +63,7 @@ const ProfileField: React.FC<IProfileField> = ({ field }) => {
             </span>
           )}
 
-          <Markup className='break-words overflow-hidden' tag='span' dangerouslySetInnerHTML={{ __html: field.value_emojified }} />
+          <Markup className='overflow-hidden break-words' tag='span' dangerouslySetInnerHTML={{ __html: field.value_emojified }} />
         </HStack>
       </dd>
     </dl>
diff --git a/app/soapbox/features/ui/components/profile-info-panel.tsx b/app/soapbox/features/ui/components/profile-info-panel.tsx
index 4d522077a1..546b0df6df 100644
--- a/app/soapbox/features/ui/components/profile-info-panel.tsx
+++ b/app/soapbox/features/ui/components/profile-info-panel.tsx
@@ -101,7 +101,7 @@ const ProfileInfoPanel: React.FC<IProfileInfoPanel> = ({ account, username }) =>
       <HStack alignItems='center' space={0.5}>
         <Icon
           src={require('@tabler/icons/ballon.svg')}
-          className='w-4 h-4 text-gray-800 dark:text-gray-200'
+          className='h-4 w-4 text-gray-800 dark:text-gray-200'
         />
 
         <Text size='sm'>
@@ -165,7 +165,7 @@ const ProfileInfoPanel: React.FC<IProfileInfoPanel> = ({ account, username }) =>
               <Icon
                 src={require('@tabler/icons/lock.svg')}
                 alt={intl.formatMessage(messages.account_locked)}
-                className='w-4 h-4 text-gray-600'
+                className='h-4 w-4 text-gray-600'
               />
             )}
           </HStack>
@@ -177,12 +177,12 @@ const ProfileInfoPanel: React.FC<IProfileInfoPanel> = ({ account, username }) =>
           <Markup size='sm' dangerouslySetInnerHTML={content} />
         )}
 
-        <div className='flex flex-col md:flex-row items-start md:flex-wrap md:items-center gap-2'>
+        <div className='flex flex-col items-start gap-2 md:flex-row md:flex-wrap md:items-center'>
           {isLocal(account) ? (
             <HStack alignItems='center' space={0.5}>
               <Icon
                 src={require('@tabler/icons/calendar.svg')}
-                className='w-4 h-4 text-gray-800 dark:text-gray-200'
+                className='h-4 w-4 text-gray-800 dark:text-gray-200'
               />
 
               <Text size='sm'>
@@ -199,7 +199,7 @@ const ProfileInfoPanel: React.FC<IProfileInfoPanel> = ({ account, username }) =>
             <HStack alignItems='center' space={0.5}>
               <Icon
                 src={require('@tabler/icons/map-pin.svg')}
-                className='w-4 h-4 text-gray-800 dark:text-gray-200'
+                className='h-4 w-4 text-gray-800 dark:text-gray-200'
               />
 
               <Text size='sm'>
@@ -212,13 +212,13 @@ const ProfileInfoPanel: React.FC<IProfileInfoPanel> = ({ account, username }) =>
             <HStack alignItems='center' space={0.5}>
               <Icon
                 src={require('@tabler/icons/link.svg')}
-                className='w-4 h-4 text-gray-800 dark:text-gray-200'
+                className='h-4 w-4 text-gray-800 dark:text-gray-200'
               />
 
               <div className='max-w-[300px]'>
                 <Text size='sm' truncate>
                   {isSafeUrl(account.website) ? (
-                    <a className='text-primary-600 dark:text-accent-blue hover:underline' href={account.website} target='_blank'>{account.website}</a>
+                    <a className='text-primary-600 hover:underline dark:text-accent-blue' href={account.website} target='_blank'>{account.website}</a>
                   ) : (
                     account.website
                   )}
diff --git a/app/soapbox/features/ui/components/promo-panel.tsx b/app/soapbox/features/ui/components/promo-panel.tsx
index 778302f11b..e9261d20d1 100644
--- a/app/soapbox/features/ui/components/promo-panel.tsx
+++ b/app/soapbox/features/ui/components/promo-panel.tsx
@@ -20,7 +20,7 @@ const PromoPanel: React.FC = () => {
         {promoItems.map((item, i) => (
           <Text key={i}>
             <a className='flex items-center' href={item.url} target='_blank'>
-              <ForkAwesomeIcon id={item.icon} className='flex-none text-lg mr-2 rtl:mr-0 rtl:ml-2' fixedWidth />
+              <ForkAwesomeIcon id={item.icon} className='mr-2 flex-none text-lg rtl:mr-0 rtl:ml-2' fixedWidth />
               {item.textLocales.get(locale) || item.text}
             </a>
           </Text>
diff --git a/app/soapbox/features/ui/components/theme-selector.tsx b/app/soapbox/features/ui/components/theme-selector.tsx
index 8ce8199e76..eb365aa6cd 100644
--- a/app/soapbox/features/ui/components/theme-selector.tsx
+++ b/app/soapbox/features/ui/components/theme-selector.tsx
@@ -38,7 +38,7 @@ const ThemeSelector: React.FC<IThemeSelector> = ({ value, onChange }) => {
   return (
     <label>
       <div className='relative rounded-md shadow-sm'>
-        <div className='absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none'>
+        <div className='pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3'>
           <Icon src={themeIconSrc} className='h-4 w-4 text-gray-600 dark:text-gray-700' />
         </div>
 
@@ -52,7 +52,7 @@ const ThemeSelector: React.FC<IThemeSelector> = ({ value, onChange }) => {
           <option value='dark'>{intl.formatMessage(messages.dark)}</option>
         </Select>
 
-        <div className='absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none'>
+        <div className='pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3'>
           <Icon src={require('@tabler/icons/chevron-down.svg')} className='h-4 w-4 text-gray-600 dark:text-gray-700' />
         </div>
       </div>
diff --git a/app/soapbox/features/ui/components/upload-area.tsx b/app/soapbox/features/ui/components/upload-area.tsx
index 6d6fb395bf..ecbf1a62c8 100644
--- a/app/soapbox/features/ui/components/upload-area.tsx
+++ b/app/soapbox/features/ui/components/upload-area.tsx
@@ -50,13 +50,13 @@ const UploadArea: React.FC<IUploadArea> = ({ active, onClose }) => {
           })}
           style={{ opacity: backgroundOpacity }}
         >
-          <div className='w-80 h-40 flex relative p-2'>
+          <div className='relative flex h-40 w-80 p-2'>
             <div className='absolute inset-0' style={{ transform: `scale(${backgroundScale})` }} />
 
             <Stack space={3} justifyContent='center' alignItems='center'>
               <Icon
                 src={require('@tabler/icons/cloud-upload.svg')}
-                className='w-12 h-12 text-white text-opacity-90'
+                className='h-12 w-12 text-white text-opacity-90'
               />
 
               <Text size='xl' theme='white'>
diff --git a/app/soapbox/features/ui/components/user-panel.tsx b/app/soapbox/features/ui/components/user-panel.tsx
index cbc45047a7..c73f6c0531 100644
--- a/app/soapbox/features/ui/components/user-panel.tsx
+++ b/app/soapbox/features/ui/components/user-panel.tsx
@@ -35,7 +35,7 @@ const UserPanel: React.FC<IUserPanel> = ({ accountId, action, badges, domain })
     <div className='relative'>
       <Stack space={2}>
         <Stack>
-          <div className='-mt-4 -mx-4 h-24 bg-gray-200 relative overflow-hidden'>
+          <div className='relative -mx-4 -mt-4 h-24 overflow-hidden bg-gray-200'>
             {header && (
               <StillImage src={account.header} />
             )}
@@ -47,7 +47,7 @@ const UserPanel: React.FC<IUserPanel> = ({ accountId, action, badges, domain })
               title={acct}
               className='-mt-12 block'
             >
-              <Avatar src={account.avatar} size={80} className='h-20 w-20 bg-gray-50 ring-2 ring-white overflow-hidden' />
+              <Avatar src={account.avatar} size={80} className='h-20 w-20 overflow-hidden bg-gray-50 ring-2 ring-white' />
             </Link>
 
             {action && (
diff --git a/app/soapbox/features/ui/index.tsx b/app/soapbox/features/ui/index.tsx
index 4560f80995..5fb66a302c 100644
--- a/app/soapbox/features/ui/index.tsx
+++ b/app/soapbox/features/ui/index.tsx
@@ -663,7 +663,7 @@ const UI: React.FC<IUI> = ({ children }) => {
           </Layout>
 
           {(me && !shouldHideFAB()) && (
-            <div className='z-40 lg:hidden transition-all fixed bottom-24 right-4 rtl:left-4 rtl:right-auto'>
+            <div className='fixed bottom-24 right-4 z-40 transition-all rtl:left-4 rtl:right-auto lg:hidden'>
               <FloatingActionButton />
             </div>
           )}
diff --git a/app/soapbox/features/verification/email-passthru.tsx b/app/soapbox/features/verification/email-passthru.tsx
index e141907af4..86152f12de 100644
--- a/app/soapbox/features/verification/email-passthru.tsx
+++ b/app/soapbox/features/verification/email-passthru.tsx
@@ -49,7 +49,7 @@ const Success = () => {
 
   return (
     <Stack space={4} alignItems='center'>
-      <Icon src={require('@tabler/icons/circle-check.svg')} className='text-primary-600 dark:text-primary-400 h-10 w-10' />
+      <Icon src={require('@tabler/icons/circle-check.svg')} className='h-10 w-10 text-primary-600 dark:text-primary-400' />
       <Text size='3xl' weight='semibold' align='center'>
         {intl.formatMessage(messages.emailConfirmedHeading)}
       </Text>
@@ -65,7 +65,7 @@ const GenericFail = () => {
 
   return (
     <Stack space={4} alignItems='center'>
-      <Icon src={require('@tabler/icons/circle-x.svg')} className='text-danger-600 h-10 w-10' />
+      <Icon src={require('@tabler/icons/circle-x.svg')} className='h-10 w-10 text-danger-600' />
       <Text size='3xl' weight='semibold' align='center'>
         {intl.formatMessage(messages.genericFailHeading)}
       </Text>
@@ -81,7 +81,7 @@ const TokenNotFound = () => {
 
   return (
     <Stack space={4} alignItems='center'>
-      <Icon src={require('@tabler/icons/circle-x.svg')} className='text-danger-600 h-10 w-10' />
+      <Icon src={require('@tabler/icons/circle-x.svg')} className='h-10 w-10 text-danger-600' />
       <Text size='3xl' weight='semibold' align='center'>
         {intl.formatMessage(messages.tokenNotFoundHeading)}
       </Text>
@@ -98,7 +98,7 @@ const TokenExpired = () => {
 
   return (
     <Stack space={4} alignItems='center'>
-      <Icon src={require('@tabler/icons/circle-x.svg')} className='text-danger-600 h-10 w-10' />
+      <Icon src={require('@tabler/icons/circle-x.svg')} className='h-10 w-10 text-danger-600' />
       <Text size='3xl' weight='semibold' align='center'>
         {intl.formatMessage(messages.tokenExpiredHeading)}
       </Text>
diff --git a/app/soapbox/features/verification/registration.tsx b/app/soapbox/features/verification/registration.tsx
index d72027bf48..bee939ec49 100644
--- a/app/soapbox/features/verification/registration.tsx
+++ b/app/soapbox/features/verification/registration.tsx
@@ -82,13 +82,13 @@ const Registration = () => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='registration.header' defaultMessage='Register your account' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto space-y-4'>
+      <div className='mx-auto space-y-4 sm:w-2/3 sm:pt-10 md:w-1/2'>
         <Form onSubmit={handleSubmit}>
           <FormGroup labelText={intl.formatMessage(messages.usernameLabel)} hintText={intl.formatMessage(messages.usernameHint)}>
             <Input
@@ -115,7 +115,7 @@ const Registration = () => {
             <PasswordIndicator password={password} onChange={setHasValidPassword} />
           </FormGroup>
 
-          <div className='text-center space-y-2'>
+          <div className='space-y-2 text-center'>
             <Button
               block
               theme='primary'
@@ -132,7 +132,7 @@ const Registration = () => {
                   defaultMessage='By registering, you agree to the {terms} and {privacy}.'
                   values={{
                     terms: (
-                      <a href={links.get('termsOfService')} target='_blank' className='text-primary-600 dark:text-primary-400 hover:underline'>
+                      <a href={links.get('termsOfService')} target='_blank' className='text-primary-600 hover:underline dark:text-primary-400'>
                         <FormattedMessage
                           id='registration.tos'
                           defaultMessage='Terms of Service'
@@ -140,7 +140,7 @@ const Registration = () => {
                       </a>
                     ),
                     privacy: (
-                      <a href={links.get('privacyPolicy')} target='_blank' className='text-primary-600 dark:text-primary-400 hover:underline'>
+                      <a href={links.get('privacyPolicy')} target='_blank' className='text-primary-600 hover:underline dark:text-primary-400'>
                         <FormattedMessage
                           id='registration.privacy'
                           defaultMessage='Privacy Policy'
diff --git a/app/soapbox/features/verification/steps/age-verification.tsx b/app/soapbox/features/verification/steps/age-verification.tsx
index faebcf9978..faf3c6c504 100644
--- a/app/soapbox/features/verification/steps/age-verification.tsx
+++ b/app/soapbox/features/verification/steps/age-verification.tsx
@@ -48,13 +48,13 @@ const AgeVerification = () => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='age_verification.header' defaultMessage='Enter your birth date' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 md:w-2/3 mx-auto'>
+      <div className='mx-auto sm:pt-10 md:w-2/3'>
         <Form onSubmit={handleSubmit}>
           <Datepicker onChange={onChange} />
 
diff --git a/app/soapbox/features/verification/steps/email-verification.tsx b/app/soapbox/features/verification/steps/email-verification.tsx
index a43ab845bb..b2d90345d8 100644
--- a/app/soapbox/features/verification/steps/email-verification.tsx
+++ b/app/soapbox/features/verification/steps/email-verification.tsx
@@ -44,10 +44,10 @@ const EmailSent: React.FC<IEmailSent> = ({ handleSubmit }) => {
   }, []);
 
   return (
-    <div className='sm:pt-10 mx-auto flex flex-col items-center justify-center'>
-      <Icon src={require('@tabler/icons/send.svg')} className='text-primary-600 dark:text-primary-400 h-12 w-12 mb-5' />
+    <div className='mx-auto flex flex-col items-center justify-center sm:pt-10'>
+      <Icon src={require('@tabler/icons/send.svg')} className='mb-5 h-12 w-12 text-primary-600 dark:text-primary-400' />
 
-      <div className='space-y-2 text-center mb-4'>
+      <div className='mb-4 space-y-2 text-center'>
         <Text weight='bold' size='3xl'>We sent you an email</Text>
         <Text theme='muted'>Click on the link in the email to validate your email.</Text>
       </div>
@@ -113,13 +113,13 @@ const EmailVerification = () => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='email_verification.header' defaultMessage='Enter your email address' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+      <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
         <Form onSubmit={handleSubmit}>
           <FormGroup labelText={intl.formatMessage(messages.emailLabel)} errors={errors}>
             <Input
diff --git a/app/soapbox/features/verification/steps/sms-verification.tsx b/app/soapbox/features/verification/steps/sms-verification.tsx
index c0e002536e..0266b15812 100644
--- a/app/soapbox/features/verification/steps/sms-verification.tsx
+++ b/app/soapbox/features/verification/steps/sms-verification.tsx
@@ -81,13 +81,13 @@ const SmsVerification = () => {
   if (status === Statuses.REQUESTED) {
     return (
       <div>
-        <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
-          <h1 className='text-center font-bold text-2xl'>
+        <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
+          <h1 className='text-center text-2xl font-bold'>
             <FormattedMessage id='sms_verification.sent.header' defaultMessage='Verification code' />
           </h1>
         </div>
 
-        <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto space-y-4'>
+        <div className='mx-auto space-y-4 sm:w-2/3 sm:pt-10 md:w-1/2'>
           <Text theme='muted' size='sm' align='center'>
             <FormattedMessage id='sms_verification.sent.body' defaultMessage='We sent you a 6-digit code via SMS. Enter it below.' />
           </Text>
@@ -121,13 +121,13 @@ const SmsVerification = () => {
 
   return (
     <div>
-      <div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
-        <h1 className='text-center font-bold text-2xl'>
+      <div className='-mx-4 mb-4 border-b border-solid border-gray-200 pb-4 dark:border-gray-800 sm:-mx-10 sm:pb-10'>
+        <h1 className='text-center text-2xl font-bold'>
           <FormattedMessage id='sms_verification.header' defaultMessage='Enter your phone number' />
         </h1>
       </div>
 
-      <div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
+      <div className='mx-auto sm:w-2/3 sm:pt-10 md:w-1/2'>
         <Form onSubmit={handleSubmit}>
           <FormGroup labelText={intl.formatMessage(messages.phoneLabel)}>
             <PhoneInput
diff --git a/app/soapbox/features/verification/waitlist-page.tsx b/app/soapbox/features/verification/waitlist-page.tsx
index 67de7ac755..0eb2bb4526 100644
--- a/app/soapbox/features/verification/waitlist-page.tsx
+++ b/app/soapbox/features/verification/waitlist-page.tsx
@@ -33,10 +33,10 @@ const WaitlistPage = () => {
     <div>
       <LandingGradient />
 
-      <main className='relative flex flex-col h-screen max-w-7xl mx-auto px-2 sm:px-6 lg:px-8'>
-        <header className='relative flex justify-between h-16'>
-          <div className='flex-1 flex items-stretch justify-center relative'>
-            <Link to='/' className='cursor-pointer flex-shrink-0 flex items-center'>
+      <main className='relative mx-auto flex h-screen max-w-7xl flex-col px-2 sm:px-6 lg:px-8'>
+        <header className='relative flex h-16 justify-between'>
+          <div className='relative flex flex-1 items-stretch justify-center'>
+            <Link to='/' className='flex shrink-0 cursor-pointer items-center'>
               <SiteLogo alt='Logo' className='h-7' />
             </Link>
 
@@ -48,10 +48,10 @@ const WaitlistPage = () => {
           </div>
         </header>
 
-        <div className='-mt-16 flex flex-col justify-center items-center h-full'>
+        <div className='-mt-16 flex h-full flex-col items-center justify-center'>
           <div className='max-w-xl'>
             <Stack space={4}>
-              <img src='/instance/images/waitlist.png' className='mx-auto w-32 h-32' alt='Waitlisted' />
+              <img src='/instance/images/waitlist.png' className='mx-auto h-32 w-32' alt='Waitlisted' />
 
               <Stack space={2}>
                 <Text size='lg' theme='muted' align='center' weight='medium'>
diff --git a/app/soapbox/pages/home-page.tsx b/app/soapbox/pages/home-page.tsx
index c9fd31d1d8..1a91a0320a 100644
--- a/app/soapbox/pages/home-page.tsx
+++ b/app/soapbox/pages/home-page.tsx
@@ -41,7 +41,7 @@ const HomePage: React.FC<IHomePage> = ({ children }) => {
 
   return (
     <>
-      <Layout.Main className='pt-3 sm:pt-0 dark:divide-gray-800 space-y-3'>
+      <Layout.Main className='space-y-3 pt-3 dark:divide-gray-800 sm:pt-0'>
         {me && (
           <Card variant='rounded' ref={composeBlock}>
             <CardBody>
@@ -50,7 +50,7 @@ const HomePage: React.FC<IHomePage> = ({ children }) => {
                   <Avatar src={avatar} size={46} />
                 </Link>
 
-                <div className='translate-y-0.5 w-full'>
+                <div className='w-full translate-y-0.5'>
                   <ComposeForm
                     id='home'
                     shouldCondense
diff --git a/app/soapbox/utils/media.ts b/app/soapbox/utils/media.ts
index a9ffb88a1c..9143061ffb 100644
--- a/app/soapbox/utils/media.ts
+++ b/app/soapbox/utils/media.ts
@@ -62,11 +62,11 @@ const addAutoPlay = (html: string): string => {
   try {
     const document = domParser.parseFromString(html, 'text/html').documentElement;
     const iframe = document.querySelector('iframe');
-  
+
     if (iframe) {
       const url = new URL(iframe.src);
       const provider = new URL(iframe.src).host;
-  
+
       if (provider === VideoProviders.RUMBLE) {
         url.searchParams.append('pub', '7a20');
         url.searchParams.append('autoplay', '2');
@@ -75,9 +75,9 @@ const addAutoPlay = (html: string): string => {
         url.searchParams.append('auto_play', '1');
         iframe.allow = 'autoplay';
       }
-  
+
       iframe.src = url.toString();
-  
+
       // DOM parser creates html/body elements around original HTML fragment,
       // so we need to get innerHTML out of the body and not the entire document
       return (document.querySelector('body') as HTMLBodyElement).innerHTML;
diff --git a/babel.config.cjs b/babel.config.cjs
index 93b9db3e43..68f63d4005 100644
--- a/babel.config.cjs
+++ b/babel.config.cjs
@@ -15,9 +15,6 @@ module.exports = (api) => {
       ['@babel/env', envOptions],
     ],
     plugins: [
-      '@babel/syntax-dynamic-import',
-      ['@babel/proposal-object-rest-spread', { useBuiltIns: true }],
-      '@babel/proposal-class-properties',
       ['react-intl', { messagesDir: './build/messages/' }],
       'preval',
     ],
@@ -27,7 +24,6 @@ module.exports = (api) => {
   switch (env) {
     case 'production':
       config.plugins.push(...[
-        'lodash',
         '@babel/transform-react-inline-elements',
         [
           '@babel/transform-runtime',
@@ -39,12 +35,6 @@ module.exports = (api) => {
         ],
       ]);
       break;
-    case 'development':
-      config.plugins.push(...[
-        '@babel/transform-react-jsx-source',
-        '@babel/transform-react-jsx-self',
-      ]);
-      break;
     case 'test':
       config.plugins.push(...[
         'transform-require-context',
diff --git a/package.json b/package.json
index 06332a57da..86290ccbf5 100644
--- a/package.json
+++ b/package.json
@@ -37,18 +37,13 @@
     "not dead"
   ],
   "dependencies": {
-    "@babel/core": "^7.18.2",
-    "@babel/plugin-proposal-class-properties": "^7.17.12",
-    "@babel/plugin-proposal-object-rest-spread": "^7.18.0",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-react-inline-elements": "^7.16.7",
-    "@babel/plugin-transform-react-jsx-self": "^7.17.12",
-    "@babel/plugin-transform-react-jsx-source": "^7.16.7",
-    "@babel/plugin-transform-runtime": "^7.18.2",
-    "@babel/preset-env": "^7.18.2",
-    "@babel/preset-react": "^7.17.12",
-    "@babel/preset-typescript": "^7.17.12",
-    "@babel/runtime": "^7.18.3",
+    "@babel/core": "^7.20.12",
+    "@babel/plugin-transform-react-inline-elements": "^7.18.6",
+    "@babel/plugin-transform-runtime": "^7.19.6",
+    "@babel/preset-env": "^7.20.2",
+    "@babel/preset-react": "^7.18.6",
+    "@babel/preset-typescript": "^7.18.6",
+    "@babel/runtime": "^7.20.13",
     "@fontsource/inter": "^4.5.1",
     "@fontsource/roboto-mono": "^4.5.8",
     "@gamestdio/websocket": "^0.3.2",
@@ -100,10 +95,8 @@
     "axios": "^1.2.2",
     "axios-mock-adapter": "^1.21.1",
     "babel-loader": "^9.0.0",
-    "babel-plugin-lodash": "^3.3.4",
     "babel-plugin-preval": "^5.1.0",
     "babel-plugin-react-intl": "^7.5.20",
-    "babel-plugin-transform-require-context": "^0.1.1",
     "blurhash": "^2.0.0",
     "bootstrap-icons": "^1.5.0",
     "bowser": "^2.11.0",
@@ -206,7 +199,8 @@
     "@testing-library/user-event": "^14.0.3",
     "@typescript-eslint/eslint-plugin": "^5.15.0",
     "@typescript-eslint/parser": "^5.15.0",
-    "babel-jest": "^29.0.0",
+    "babel-jest": "^29.4.1",
+    "babel-plugin-transform-require-context": "^0.1.1",
     "cross-env": "^7.0.3",
     "danger": "^11.0.7",
     "eslint": "^8.0.0",
@@ -217,6 +211,7 @@
     "eslint-plugin-promise": "^6.0.0",
     "eslint-plugin-react": "^7.25.1",
     "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-tailwindcss": "^3.8.3",
     "fake-indexeddb": "^4.0.0",
     "husky": "^8.0.0",
     "jest": "^29.0.0",
diff --git a/yarn.lock b/yarn.lock
index 71688c5ad3..441fa6f8d6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -23,22 +23,29 @@
   dependencies:
     "@babel/highlight" "^7.16.7"
 
-"@babel/compat-data@^7.13.11":
-  version "7.15.0"
-  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.15.0.tgz#2dbaf8b85334796cafbb0f5793a90a2fc010b176"
-  integrity sha512-0NqAC1IJE0S0+lL1SWFMxMkz1pKCNCjI4tr2Zx4LJSXxCLAdr6KyArnY+sno5m3yH9g737ygOyPABDsnXkpxiA==
-
-"@babel/compat-data@^7.15.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.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==
+  dependencies:
+    "@babel/highlight" "^7.18.6"
 
 "@babel/compat-data@^7.17.10":
   version "7.17.10"
   resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.17.10.tgz#711dc726a492dfc8be8220028b1b92482362baab"
   integrity sha512-GZt/TCsG70Ms19gfZO1tM4CVnXsPgEPBCpJu+Qz3L0LUDsY5nZqFZglIoPC1kIYOtNBZlrnFT+klg12vFGZXrw==
 
-"@babel/core@^7.11.6", "@babel/core@^7.18.2":
+"@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/compat-data@^7.20.1", "@babel/compat-data@^7.20.5":
+  version "7.20.14"
+  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.20.14.tgz#4106fc8b755f3e3ee0a0a7c27dde5de1d2b2baf8"
+  integrity sha512-0YpKHD6ImkWMEINCyDAD0HLLUH/lPCefG8ld9it8DJB2wnApraKuhgYTvTY1z7UFIfBTGy5LwncZ+5HWWGbhFw==
+
+"@babel/core@^7.11.6":
   version "7.18.2"
   resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.18.2.tgz#87b2fcd7cce9becaa7f5acebdc4f09f3dd19d876"
   integrity sha512-A8pri1YJiC5UnkdrWcmfZTJTV85b4UXTAfImGmCfYmax4TR9Cw8sDS0MOk++Gp2mE/BefVJ5nwy5yzqNJbP/DQ==
@@ -80,6 +87,27 @@
     json5 "^2.1.2"
     semver "^6.3.0"
 
+"@babel/core@^7.20.12":
+  version "7.20.12"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.20.12.tgz#7930db57443c6714ad216953d1356dac0eb8496d"
+  integrity sha512-XsMfHovsUYHFMdrIHkZphTN/2Hzzi78R08NuHfDBehym2VsPDL6Zn/JAD/JQdnRvbSsbQc4mVaU1m6JgtTEElg==
+  dependencies:
+    "@ampproject/remapping" "^2.1.0"
+    "@babel/code-frame" "^7.18.6"
+    "@babel/generator" "^7.20.7"
+    "@babel/helper-compilation-targets" "^7.20.7"
+    "@babel/helper-module-transforms" "^7.20.11"
+    "@babel/helpers" "^7.20.7"
+    "@babel/parser" "^7.20.7"
+    "@babel/template" "^7.20.7"
+    "@babel/traverse" "^7.20.12"
+    "@babel/types" "^7.20.7"
+    convert-source-map "^1.7.0"
+    debug "^4.1.0"
+    gensync "^1.0.0-beta.2"
+    json5 "^2.2.2"
+    semver "^6.3.0"
+
 "@babel/core@^7.9.0":
   version "7.15.5"
   resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.15.5.tgz#f8ed9ace730722544609f90c9bb49162dc3bf5b9"
@@ -128,6 +156,15 @@
     "@jridgewell/gen-mapping" "^0.3.0"
     jsesc "^2.5.1"
 
+"@babel/generator@^7.20.7":
+  version "7.20.14"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.20.14.tgz#9fa772c9f86a46c6ac9b321039400712b96f64ce"
+  integrity sha512-AEmuXHdcD3A52HHXxaTmYlb8q/xMEhoRP67B3T4Oq7lbmSoqroMZzjnGj3+i1io3pdnF8iBYVu4Ilj+c4hBxYg==
+  dependencies:
+    "@babel/types" "^7.20.7"
+    "@jridgewell/gen-mapping" "^0.3.2"
+    jsesc "^2.5.1"
+
 "@babel/generator@^7.7.2":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.15.4.tgz#85acb159a267ca6324f9793986991ee2022a05b0"
@@ -144,38 +181,28 @@
   dependencies:
     "@babel/types" "^7.15.4"
 
-"@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/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==
   dependencies:
-    "@babel/types" "^7.16.7"
+    "@babel/types" "^7.18.6"
 
-"@babel/helper-builder-binary-assignment-operator-visitor@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.16.7.tgz#38d138561ea207f0f69eb1626a418e4f7e6a580b"
-  integrity sha512-C6FdbRaxYjwVu/geKW4ZeQ0Q31AftgRcdSnZ5/jsH6BzCJbtvXvhpfkbkThYSuutZA7nCXpPR6AD9zd1dprMkA==
+"@babel/helper-builder-binary-assignment-operator-visitor@^7.18.6":
+  version "7.18.9"
+  resolved "https://registry.yarnpkg.com/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.18.9.tgz#acd4edfd7a566d1d51ea975dff38fd52906981bb"
+  integrity sha512-yFQ0YCHoIqarl8BCRwBL8ulYUaZpz3bNsA7oFepAzee+8/+ImtADXNOmO5vJvsPff3qi+hvpkY/NYBTrBQgdNw==
   dependencies:
-    "@babel/helper-explode-assignable-expression" "^7.16.7"
-    "@babel/types" "^7.16.7"
+    "@babel/helper-explode-assignable-expression" "^7.18.6"
+    "@babel/types" "^7.18.9"
 
-"@babel/helper-builder-react-jsx@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx/-/helper-builder-react-jsx-7.16.7.tgz#6f9da7cea0fde8420e0938d490837feb5bde8dda"
-  integrity sha512-XKorXOl2868Un8/XK2o4GLlXr8Q08KthWI5W3qyCkh6tCGf5Ncg3HR4oN2UO+sqPoAlcMgz9elFW/FZvAHYotA==
+"@babel/helper-builder-react-jsx@^7.18.6":
+  version "7.19.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx/-/helper-builder-react-jsx-7.19.0.tgz#a1f4fef805388eda4b3c1bd8994dc585b0afa351"
+  integrity sha512-xvrbORmJ13lWrqyMErk4vczhXNNWdOSg1BZ+R/7D34SjDjToR5g3M5UpD6MyUekstI50qAHLWA1j7w5o1WK2Pw==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    "@babel/types" "^7.16.7"
-
-"@babel/helper-compilation-targets@^7.13.0":
-  version "7.15.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.15.4.tgz#cf6d94f30fbefc139123e27dd6b02f65aeedb7b9"
-  integrity sha512-rMWPCirulnPSe4d+gwdWXLfAXTTBj8M3guAf5xFQJ0nvFY7tfNAFnWdqaHegHlgDZOCT4qvhF3BYlSJag8yhqQ==
-  dependencies:
-    "@babel/compat-data" "^7.15.0"
-    "@babel/helper-validator-option" "^7.14.5"
-    browserslist "^4.16.6"
-    semver "^6.3.0"
+    "@babel/helper-annotate-as-pure" "^7.18.6"
+    "@babel/types" "^7.19.0"
 
 "@babel/helper-compilation-targets@^7.15.4", "@babel/helper-compilation-targets@^7.17.7":
   version "7.17.7"
@@ -187,7 +214,7 @@
     browserslist "^4.17.5"
     semver "^6.3.0"
 
-"@babel/helper-compilation-targets@^7.16.7", "@babel/helper-compilation-targets@^7.17.10", "@babel/helper-compilation-targets@^7.18.2":
+"@babel/helper-compilation-targets@^7.18.2":
   version "7.18.2"
   resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.18.2.tgz#67a85a10cbd5fc7f1457fec2e7f45441dc6c754b"
   integrity sha512-s1jnPotJS9uQnzFtiZVBUxe67CuBa679oWFHpxYYnTpRL/1ffhyX44R9uYiXoa/pLXcY9H2moJta0iaanlk/rQ==
@@ -197,18 +224,30 @@
     browserslist "^4.20.2"
     semver "^6.3.0"
 
-"@babel/helper-create-class-features-plugin@^7.17.12", "@babel/helper-create-class-features-plugin@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.18.0.tgz#fac430912606331cb075ea8d82f9a4c145a4da19"
-  integrity sha512-Kh8zTGR9de3J63e5nS0rQUdRs/kbtwoeQQ0sriS0lItjC96u8XXZN6lKpuyWd2coKSU13py/y+LTmThLuVX0Pg==
+"@babel/helper-compilation-targets@^7.18.9", "@babel/helper-compilation-targets@^7.20.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/helper-annotate-as-pure" "^7.16.7"
-    "@babel/helper-environment-visitor" "^7.16.7"
-    "@babel/helper-function-name" "^7.17.9"
-    "@babel/helper-member-expression-to-functions" "^7.17.7"
-    "@babel/helper-optimise-call-expression" "^7.16.7"
-    "@babel/helper-replace-supers" "^7.16.7"
-    "@babel/helper-split-export-declaration" "^7.16.7"
+    "@babel/compat-data" "^7.20.5"
+    "@babel/helper-validator-option" "^7.18.6"
+    browserslist "^4.21.3"
+    lru-cache "^5.1.1"
+    semver "^6.3.0"
+
+"@babel/helper-create-class-features-plugin@^7.18.6", "@babel/helper-create-class-features-plugin@^7.20.12", "@babel/helper-create-class-features-plugin@^7.20.5", "@babel/helper-create-class-features-plugin@^7.20.7":
+  version "7.20.12"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.20.12.tgz#4349b928e79be05ed2d1643b20b99bb87c503819"
+  integrity sha512-9OunRkbT0JQcednL0UFvbfXpAsUXiGjUk0a7sN8fUXX7Mue79cUSMjHGDRRi/Vz9vYlpIhLV5fMD5dKoMhhsNQ==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.18.6"
+    "@babel/helper-environment-visitor" "^7.18.9"
+    "@babel/helper-function-name" "^7.19.0"
+    "@babel/helper-member-expression-to-functions" "^7.20.7"
+    "@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.14.5":
   version "7.14.5"
@@ -218,23 +257,21 @@
     "@babel/helper-annotate-as-pure" "^7.14.5"
     regexpu-core "^4.7.1"
 
-"@babel/helper-create-regexp-features-plugin@^7.16.7", "@babel/helper-create-regexp-features-plugin@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.17.12.tgz#bb37ca467f9694bbe55b884ae7a5cc1e0084e4fd"
-  integrity sha512-b2aZrV4zvutr9AIa6/gA3wsZKRwTKYoDxYiFKcESS3Ug2GTXzwBEvMuuFLhCQpEnRXs1zng4ISAXSUxxKBIcxw==
+"@babel/helper-create-regexp-features-plugin@^7.18.6", "@babel/helper-create-regexp-features-plugin@^7.20.5":
+  version "7.20.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.20.5.tgz#5ea79b59962a09ec2acf20a963a01ab4d076ccca"
+  integrity sha512-m68B1lkg3XDGX5yCvGO0kPx3v9WIYLnzjKfPcQiwntEQa5ZeRkPmo2X/ISJc8qxWGfwUr+kvZAeEzAwLec2r2w==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    regexpu-core "^5.0.1"
+    "@babel/helper-annotate-as-pure" "^7.18.6"
+    regexpu-core "^5.2.1"
 
-"@babel/helper-define-polyfill-provider@^0.3.1":
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.3.1.tgz#52411b445bdb2e676869e5a74960d2d3826d2665"
-  integrity sha512-J9hGMpJQmtWmj46B3kBHmL38UhJGhYX7eqkcq+2gsstyYt341HmPeWspihX43yVRA0mS+8GGk2Gckc7bY/HCmA==
+"@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==
   dependencies:
-    "@babel/helper-compilation-targets" "^7.13.0"
-    "@babel/helper-module-imports" "^7.12.13"
-    "@babel/helper-plugin-utils" "^7.13.0"
-    "@babel/traverse" "^7.13.0"
+    "@babel/helper-compilation-targets" "^7.17.7"
+    "@babel/helper-plugin-utils" "^7.16.7"
     debug "^4.1.1"
     lodash.debounce "^4.0.8"
     resolve "^1.14.2"
@@ -252,12 +289,17 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.18.2.tgz#8a6d2dedb53f6bf248e31b4baf38739ee4a637bd"
   integrity sha512-14GQKWkX9oJzPiQQ7/J36FTXcD4kSp8egKjO9nINlSKiHITRA9q/R74qu8S9xlc/b/yjsJItQUeeh3xnGN0voQ==
 
-"@babel/helper-explode-assignable-expression@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.16.7.tgz#12a6d8522fdd834f194e868af6354e8650242b7a"
-  integrity sha512-KyUenhWMC8VrxzkGP0Jizjo4/Zx+1nNZhgocs+gLzyZyB8SHidhoq9KK/8Ato4anhwsivfkBLftky7gvzbZMtQ==
+"@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-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==
   dependencies:
-    "@babel/types" "^7.16.7"
+    "@babel/types" "^7.18.6"
 
 "@babel/helper-function-name@^7.15.4", "@babel/helper-function-name@^7.16.7":
   version "7.16.7"
@@ -276,6 +318,14 @@
     "@babel/template" "^7.16.7"
     "@babel/types" "^7.17.0"
 
+"@babel/helper-function-name@^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-get-function-arity@^7.16.7":
   version "7.16.7"
   resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.7.tgz#ea08ac753117a669f1508ba06ebcc49156387419"
@@ -290,26 +340,19 @@
   dependencies:
     "@babel/types" "^7.16.7"
 
-"@babel/helper-member-expression-to-functions@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.16.7.tgz#42b9ca4b2b200123c3b7e726b0ae5153924905b0"
-  integrity sha512-VtJ/65tYiU/6AbMTDwyoXGPKHgTsfRarivm+YbB5uAzKUyuPjgZSgAFeG87FCigc7KNHu2Pegh1XIT3lXjvz3Q==
+"@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.16.7"
+    "@babel/types" "^7.18.6"
 
-"@babel/helper-member-expression-to-functions@^7.17.7":
-  version "7.17.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.17.7.tgz#a34013b57d8542a8c4ff8ba3f747c02452a4d8c4"
-  integrity sha512-thxXgnQ8qQ11W2wVUObIqDL4p148VMxkt5T/qpN5k2fboRyzFGFmKsTGViquyM5QHKUy48OZoca8kw4ajaDPyw==
+"@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.17.0"
-
-"@babel/helper-module-imports@^7.0.0-beta.49", "@babel/helper-module-imports@^7.12.13":
-  version "7.15.4"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.15.4.tgz#e18007d230632dea19b47853b984476e7b4e103f"
-  integrity sha512-jeAHZbzUwdW/xHgHQ3QmWR4Jg6j15q4w/gCfwZvtqOxoo5DKtLHk8Bsf4c5RZRC7NmLEs+ohkdq8jFefuvIxAA==
-  dependencies:
-    "@babel/types" "^7.15.4"
+    "@babel/types" "^7.20.7"
 
 "@babel/helper-module-imports@^7.16.7":
   version "7.16.7"
@@ -318,6 +361,13 @@
   dependencies:
     "@babel/types" "^7.16.7"
 
+"@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==
+  dependencies:
+    "@babel/types" "^7.18.6"
+
 "@babel/helper-module-transforms@^7.15.4", "@babel/helper-module-transforms@^7.17.7":
   version "7.17.7"
   resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.17.7.tgz#3943c7f777139e7954a5355c815263741a9c1cbd"
@@ -346,63 +396,63 @@
     "@babel/traverse" "^7.18.0"
     "@babel/types" "^7.18.0"
 
-"@babel/helper-optimise-call-expression@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.16.7.tgz#a34e3560605abbd31a18546bd2aad3e6d9a174f2"
-  integrity sha512-EtgBhg7rd/JcnpZFXpBy0ze1YRfdm7BnBX4uKMBd3ixa3RGAE002JZB66FJyNH7g0F38U05pXmA5P8cBh7z+1w==
+"@babel/helper-module-transforms@^7.18.6", "@babel/helper-module-transforms@^7.20.11":
+  version "7.20.11"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.20.11.tgz#df4c7af713c557938c50ea3ad0117a7944b2f1b0"
+  integrity sha512-uRy78kN4psmji1s2QtbtcCSaj/LILFDp0f/ymhpQH5QY3nljUZCaNWz9X1dEj/8MBdBEFECs7yRhKn8i7NjZgg==
   dependencies:
-    "@babel/types" "^7.16.7"
+    "@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.20.10"
+    "@babel/types" "^7.20.7"
+
+"@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==
+  dependencies:
+    "@babel/types" "^7.18.6"
 
 "@babel/helper-plugin-utils@^7.0.0", "@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":
   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.13.0", "@babel/helper-plugin-utils@^7.8.3":
-  version "7.14.5"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.14.5.tgz#5ac822ce97eec46741ab70a517971e443a70c5a9"
-  integrity sha512-/37qQCE3K0vvZKwoK4XU/irIJQdIfCJuhU5eKnNxpFDsOkgFaUAwbv+RYw6eYgsC0E4hS7r5KqGULUogqui0fQ==
-
-"@babel/helper-plugin-utils@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.17.12.tgz#86c2347da5acbf5583ba0a10aed4c9bf9da9cf96"
-  integrity sha512-JDkf04mqtN3y4iAbO1hv9U2ARpPyPL1zqyWs/2WG1pgSq9llHFjStX5jdxb84himgJm+8Ng+x0oiWF/nw/XQKA==
-
-"@babel/helper-plugin-utils@^7.18.6":
+"@babel/helper-plugin-utils@^7.18.6", "@babel/helper-plugin-utils@^7.18.9", "@babel/helper-plugin-utils@^7.19.0", "@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-remap-async-to-generator@^7.16.8":
-  version "7.16.8"
-  resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.16.8.tgz#29ffaade68a367e2ed09c90901986918d25e57e3"
-  integrity sha512-fm0gH7Flb8H51LqJHy3HJ3wnE1+qtYR2A99K06ahwrawLdOFsCEWjZOrYricXJHoPSudNKxrMBUPEIPxiIIvBw==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    "@babel/helper-wrap-function" "^7.16.8"
-    "@babel/types" "^7.16.8"
+"@babel/helper-plugin-utils@^7.8.3":
+  version "7.14.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.14.5.tgz#5ac822ce97eec46741ab70a517971e443a70c5a9"
+  integrity sha512-/37qQCE3K0vvZKwoK4XU/irIJQdIfCJuhU5eKnNxpFDsOkgFaUAwbv+RYw6eYgsC0E4hS7r5KqGULUogqui0fQ==
 
-"@babel/helper-replace-supers@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.16.7.tgz#e9f5f5f32ac90429c1a4bdec0f231ef0c2838ab1"
-  integrity sha512-y9vsWilTNaVnVh6xiJfABzsNpgDPKev9HnAgz6Gb1p6UUwf9NepdlsV7VXGCftJM+jqD5f7JIEubcpLjZj5dBw==
+"@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==
   dependencies:
-    "@babel/helper-environment-visitor" "^7.16.7"
-    "@babel/helper-member-expression-to-functions" "^7.16.7"
-    "@babel/helper-optimise-call-expression" "^7.16.7"
-    "@babel/traverse" "^7.16.7"
-    "@babel/types" "^7.16.7"
+    "@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/helper-replace-supers@^7.18.2":
-  version "7.18.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.18.2.tgz#41fdfcc9abaf900e18ba6e5931816d9062a7b2e0"
-  integrity sha512-XzAIyxx+vFnrOxiQrToSUOzUOn0e1J2Li40ntddek1Y69AXUTXoDJ40/D5RdjFu7s7qHiaeoTiempZcbuVXh2Q==
+"@babel/helper-replace-supers@^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.2"
-    "@babel/helper-member-expression-to-functions" "^7.17.7"
-    "@babel/helper-optimise-call-expression" "^7.16.7"
-    "@babel/traverse" "^7.18.2"
-    "@babel/types" "^7.18.2"
+    "@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.17.7":
   version "7.17.7"
@@ -411,19 +461,19 @@
   dependencies:
     "@babel/types" "^7.17.0"
 
-"@babel/helper-simple-access@^7.18.2":
-  version "7.18.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.18.2.tgz#4dc473c2169ac3a1c9f4a51cfcd091d1c36fcff9"
-  integrity sha512-7LIrjYzndorDY88MycupkpQLKS1AFfsVRm2k/9PtKScSy5tZq0McZTj+DiMRynboZfIqOKvo03pmhTaUgiD6fQ==
+"@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.18.2"
+    "@babel/types" "^7.20.2"
 
-"@babel/helper-skip-transparent-expression-wrappers@^7.16.0":
-  version "7.16.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.16.0.tgz#0ee3388070147c3ae051e487eca3ebb0e2e8bb09"
-  integrity sha512-+il1gTy0oHwUsBQZyJvukbB4vPMdcYBrFHa0Uc4AizLxbq6BOYC51Rv4tWocX9BLBDLZ4kc6qUFpQ6HRgL+3zw==
+"@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.16.0"
+    "@babel/types" "^7.20.0"
 
 "@babel/helper-split-export-declaration@^7.15.4", "@babel/helper-split-export-declaration@^7.16.7":
   version "7.16.7"
@@ -432,25 +482,47 @@
   dependencies:
     "@babel/types" "^7.16.7"
 
+"@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-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-validator-identifier@^7.14.9", "@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-option@^7.14.5", "@babel/helper-validator-option@^7.16.7":
+"@babel/helper-validator-identifier@^7.18.6", "@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-option@^7.16.7":
   version "7.16.7"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.16.7.tgz#b203ce62ce5fe153899b617c08957de860de4d23"
   integrity sha512-TRtenOuRUVo9oIQGPC5G9DgK4743cdxvtOw0weQNpZXaS16SCBi5MNjZF8vba3ETURjZpTbVn7Vvcf2eAwFozQ==
 
-"@babel/helper-wrap-function@^7.16.8":
-  version "7.16.8"
-  resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.16.8.tgz#58afda087c4cd235de92f7ceedebca2c41274200"
-  integrity sha512-8RpyRVIAW1RcDDGTA+GpPAwV22wXCfKOoM9bet6TLkGIFTkRQSkH1nMQ5Yet4MpoXe1ZwHPVtNasc2w0uZMqnw==
+"@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-wrap-function@^7.18.9":
+  version "7.20.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.20.5.tgz#75e2d84d499a0ab3b31c33bcfe59d6b8a45f62e3"
+  integrity sha512-bYMxIWK5mh+TgXGVqAtnu5Yn1un+v8DDZtqyzKRLUzrh70Eal2O3aZ7aPYiMADO4uKlkzOiRiZ6GX5q3qxvW9Q==
   dependencies:
-    "@babel/helper-function-name" "^7.16.7"
-    "@babel/template" "^7.16.7"
-    "@babel/traverse" "^7.16.8"
-    "@babel/types" "^7.16.8"
+    "@babel/helper-function-name" "^7.19.0"
+    "@babel/template" "^7.18.10"
+    "@babel/traverse" "^7.20.5"
+    "@babel/types" "^7.20.5"
 
 "@babel/helpers@^7.15.4", "@babel/helpers@^7.17.8":
   version "7.17.8"
@@ -470,6 +542,15 @@
     "@babel/traverse" "^7.18.2"
     "@babel/types" "^7.18.2"
 
+"@babel/helpers@^7.20.7":
+  version "7.20.13"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.20.13.tgz#e3cb731fb70dc5337134cadc24cbbad31cc87ad2"
+  integrity sha512-nzJ0DWCL3gB5RCXbUO3KIMMsBY2Eqbx8mBpKGE/02PgyRQFcPQLbkQ1vyy596mZLaP+dAfD+R4ckASzNVmW3jg==
+  dependencies:
+    "@babel/template" "^7.20.7"
+    "@babel/traverse" "^7.20.13"
+    "@babel/types" "^7.20.7"
+
 "@babel/highlight@^7.14.5", "@babel/highlight@^7.16.7":
   version "7.16.10"
   resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.10.tgz#744f2eb81579d6eea753c227b0f570ad785aba88"
@@ -479,6 +560,15 @@
     chalk "^2.0.0"
     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/parser@^7.1.0", "@babel/parser@^7.14.7", "@babel/parser@^7.15.4", "@babel/parser@^7.15.5", "@babel/parser@^7.16.7", "@babel/parser@^7.17.3", "@babel/parser@^7.17.8":
   version "7.17.8"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.8.tgz#2817fb9d885dd8132ea0f8eb615a6388cca1c240"
@@ -489,149 +579,155 @@
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.18.4.tgz#6774231779dd700e0af29f6ad8d479582d7ce5ef"
   integrity sha512-FDge0dFazETFcxGw/EXzOkN8uJp0PC7Qbm+Pe9T+av2zlBpOgunFHkQPPn+eRuClU73JF+98D531UgayY89tow==
 
-"@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.17.12":
-  version "7.17.12"
-  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.17.12.tgz#1dca338caaefca368639c9ffb095afbd4d420b1e"
-  integrity sha512-xCJQXl4EeQ3J9C4yOmpTrtVGmzpm2iSzyxbkZHw7UCnZBftHpF/hpII80uWVyVrc40ytIClHjgWGTG1g/yB+aw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+"@babel/parser@^7.20.13", "@babel/parser@^7.20.7":
+  version "7.20.15"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.20.15.tgz#eec9f36d8eaf0948bb88c87a46784b5ee9fd0c89"
+  integrity sha512-DI4a1oZuf8wC+oAJA9RW6ga3Zbe8RZFt7kD9i4qAspz3I/yHet1VvC3DiSy/fsUvv5pvJuNPh0LPOdCcqinDPg==
 
-"@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.17.12.tgz#0d498ec8f0374b1e2eb54b9cb2c4c78714c77753"
-  integrity sha512-/vt0hpIw0x4b6BLKUkwlvEoiGZYYLNZ96CzyHYPbtG2jZGz6LBe7/V+drYrc/d+ovrF9NBi0pmtvmNb/FsWtRQ==
+"@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^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.17.12"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.16.0"
-    "@babel/plugin-proposal-optional-chaining" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-proposal-async-generator-functions@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.17.12.tgz#094a417e31ce7e692d84bab06c8e2a607cbeef03"
-  integrity sha512-RWVvqD1ooLKP6IqWTA5GyFVX2isGEgC5iFxKzfYOIy/QEFdxYyCybBDtIGjipHpb9bDWHzcqGqFakf+mVmBTdQ==
+"@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@^7.18.9":
+  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.17.12"
-    "@babel/helper-remap-async-to-generator" "^7.16.8"
+    "@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.1":
+  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.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.17.12.tgz#84f65c0cc247d46f40a6da99aadd6438315d80a4"
-  integrity sha512-U0mI9q8pW5Q9EaTHFPwSVusPMV/DV9Mm8p7csqROFLtIE9rBF5piLqyrBGigftALrBcsBGu4m38JneAe7ZDLXw==
+"@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.17.12"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-create-class-features-plugin" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-proposal-class-static-block@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-static-block/-/plugin-proposal-class-static-block-7.18.0.tgz#7d02253156e3c3793bdb9f2faac3a1c05f0ba710"
-  integrity sha512-t+8LsRMMDE74c6sV7KShIw13sqbqd58tlqNrsWoWBTIMw7SVQ0cZ905wLNS/FBCy/3PyooRHLFFlfrUNyyz5lA==
+"@babel/plugin-proposal-class-static-block@^7.18.6":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-static-block/-/plugin-proposal-class-static-block-7.20.7.tgz#92592e9029b13b15be0f7ce6a7aedc2879ca45a7"
+  integrity sha512-AveGOoi9DAjUYYuUAG//Ig69GlazLnoyzMw68VCDux+c1tsnnH/OkYcpz/5xzMkEFC6UxjR5Gw1c+iY2wOGVeQ==
   dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.18.0"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-create-class-features-plugin" "^7.20.7"
+    "@babel/helper-plugin-utils" "^7.20.2"
     "@babel/plugin-syntax-class-static-block" "^7.14.5"
 
-"@babel/plugin-proposal-dynamic-import@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.16.7.tgz#c19c897eaa46b27634a00fee9fb7d829158704b2"
-  integrity sha512-I8SW9Ho3/8DRSdmDdH3gORdyUuYnk1m4cMxUAdu5oy4n3OfN8flDEH+d60iG7dUfi0KkYwSvoalHzzdRzpWHTg==
+"@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.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
     "@babel/plugin-syntax-dynamic-import" "^7.8.3"
 
-"@babel/plugin-proposal-export-namespace-from@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.17.12.tgz#b22864ccd662db9606edb2287ea5fd1709f05378"
-  integrity sha512-j7Ye5EWdwoXOpRmo5QmRyHPsDIe6+u70ZYZrd7uz+ebPYFKfRcLcNu3Ro0vOlJ5zuv8rU7xa+GttNiRzX56snQ==
+"@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.17.12"
+    "@babel/helper-plugin-utils" "^7.18.9"
     "@babel/plugin-syntax-export-namespace-from" "^7.8.3"
 
-"@babel/plugin-proposal-json-strings@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.17.12.tgz#f4642951792437233216d8c1af370bb0fbff4664"
-  integrity sha512-rKJ+rKBoXwLnIn7n6o6fulViHMrOThz99ybH+hKHcOZbnN14VuMnH9fo2eHE69C8pO4uX1Q7t2HYYIDmv8VYkg==
+"@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.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
     "@babel/plugin-syntax-json-strings" "^7.8.3"
 
-"@babel/plugin-proposal-logical-assignment-operators@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-logical-assignment-operators/-/plugin-proposal-logical-assignment-operators-7.17.12.tgz#c64a1bcb2b0a6d0ed2ff674fd120f90ee4b88a23"
-  integrity sha512-EqFo2s1Z5yy+JeJu7SFfbIUtToJTVlC61/C7WLKDntSw4Sz6JNAIfL7zQ74VvirxpjB5kz/kIx0gCcb+5OEo2Q==
+"@babel/plugin-proposal-logical-assignment-operators@^7.18.9":
+  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.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
     "@babel/plugin-syntax-logical-assignment-operators" "^7.10.4"
 
-"@babel/plugin-proposal-nullish-coalescing-operator@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.17.12.tgz#1e93079bbc2cbc756f6db6a1925157c4a92b94be"
-  integrity sha512-ws/g3FSGVzv+VH86+QvgtuJL/kR67xaEIF2x0iPqdDfYW6ra6JF3lKVBkWynRLcNtIC1oCTfDRVxmm2mKzy+ag==
+"@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.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
     "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.3"
 
-"@babel/plugin-proposal-numeric-separator@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-numeric-separator/-/plugin-proposal-numeric-separator-7.16.7.tgz#d6b69f4af63fb38b6ca2558442a7fb191236eba9"
-  integrity sha512-vQgPMknOIgiuVqbokToyXbkY/OmmjAzr/0lhSIbG/KmnzXPGwW/AdhdKpi+O4X/VkWiWjnkKOBiqJrTaC98VKw==
+"@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.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
     "@babel/plugin-syntax-numeric-separator" "^7.10.4"
 
-"@babel/plugin-proposal-object-rest-spread@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.18.0.tgz#79f2390c892ba2a68ec112eb0d895cfbd11155e8"
-  integrity sha512-nbTv371eTrFabDfHLElkn9oyf9VG+VKK6WMzhY2o4eHKaG19BToD9947zzGMO6I/Irstx9d8CwX6njPNIAR/yw==
+"@babel/plugin-proposal-object-rest-spread@^7.20.2":
+  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.17.10"
-    "@babel/helper-compilation-targets" "^7.17.10"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@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.17.12"
+    "@babel/plugin-transform-parameters" "^7.20.7"
 
-"@babel/plugin-proposal-optional-catch-binding@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.16.7.tgz#c623a430674ffc4ab732fd0a0ae7722b67cb74cf"
-  integrity sha512-eMOH/L4OvWSZAE1VkHbr1vckLG1WUcHGJSLqqQwl2GaUqG6QjddvrOaTUMNYiv77H5IKPMZ9U9P7EaHwvAShfA==
+"@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.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
     "@babel/plugin-syntax-optional-catch-binding" "^7.8.3"
 
-"@babel/plugin-proposal-optional-chaining@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.17.12.tgz#f96949e9bacace3a9066323a5cf90cfb9de67174"
-  integrity sha512-7wigcOs/Z4YWlK7xxjkvaIw84vGhDv/P1dFGQap0nHkc8gFKY/r+hXc8Qzf5k1gY7CvGIcHqAnOagVKJJ1wVOQ==
+"@babel/plugin-proposal-optional-chaining@^7.18.9", "@babel/plugin-proposal-optional-chaining@^7.20.7":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.20.7.tgz#49f2b372519ab31728cc14115bb0998b15bfda55"
+  integrity sha512-T+A7b1kfjtRM51ssoOfS1+wbyCVqorfyZhT99TvxxLMirPShD8CzKMRepMlCBGM5RpHMbn8s+5MMHnPstJH6mQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.16.0"
+    "@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.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-methods/-/plugin-proposal-private-methods-7.17.12.tgz#c2ca3a80beb7539289938da005ad525a038a819c"
-  integrity sha512-SllXoxo19HmxhDWm3luPz+cPhtoTSKLJE9PXshsfrOzBqs60QP0r8OaJItrPhAj0d7mZMnNF0Y1UUggCDgMz1A==
+"@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.17.12"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-create-class-features-plugin" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-proposal-private-property-in-object@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.17.12.tgz#b02efb7f106d544667d91ae97405a9fd8c93952d"
-  integrity sha512-/6BtVi57CJfrtDNKfK5b66ydK2J5pXUKBKSPD2G1whamMuEnZWgoOIfO8Vf9F/DoD4izBLD/Au4NMQfruzzykg==
+"@babel/plugin-proposal-private-property-in-object@^7.18.6":
+  version "7.20.5"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.20.5.tgz#309c7668f2263f1c711aa399b5a9a6291eef6135"
+  integrity sha512-Vq7b9dUA12ByzB4EjQTPo25sFhY+08pQDBSZRtUAkj7lb7jahaHR5igera16QZ+3my1nYR4dKsNdYj5IjPHilQ==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    "@babel/helper-create-class-features-plugin" "^7.17.12"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-annotate-as-pure" "^7.18.6"
+    "@babel/helper-create-class-features-plugin" "^7.20.5"
+    "@babel/helper-plugin-utils" "^7.20.2"
     "@babel/plugin-syntax-private-property-in-object" "^7.14.5"
 
-"@babel/plugin-proposal-unicode-property-regex@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.17.12.tgz#3dbd7a67bd7f94c8238b394da112d86aaf32ad4d"
-  integrity sha512-Wb9qLjXf3ZazqXA7IvI7ozqRIXIGPtSo+L5coFmEkhTQK18ao4UDDD0zdTGAarmbLj2urpRwrc6893cu5Bfh0A==
+"@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==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.17.12"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@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.14.5"
@@ -683,12 +779,12 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.8.3"
 
-"@babel/plugin-syntax-import-assertions@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.17.12.tgz#58096a92b11b2e4e54b24c6a0cc0e5e607abcedd"
-  integrity sha512-n/loy2zkq9ZEM8tEOwON9wTQSTNDTDEz6NujPtJGLU7qObzT1N4c4YZZf8E6ATB2AjNQg/Ib2AIpO03EZaCehw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.19.0"
 
 "@babel/plugin-syntax-import-meta@^7.8.3":
   version "7.10.4"
@@ -704,14 +800,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.8.0"
 
-"@babel/plugin-syntax-jsx@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.17.12.tgz#834035b45061983a491f60096f61a2e7c5674a47"
-  integrity sha512-spyY3E3AURfxh/RHtjx5j6hs8am5NbUBGfcZ2vB3uShSpZdQyXSf5rR5Mk76vbtlAZOelyVQ71Fg0x9SG4fsog==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-
-"@babel/plugin-syntax-jsx@^7.7.2":
+"@babel/plugin-syntax-jsx@^7.18.6", "@babel/plugin-syntax-jsx@^7.7.2":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.18.6.tgz#a8feef63b010150abd97f1649ec296e849943ca0"
   integrity sha512-6mmljtAedFGTWu2p/8WIORGwy+61PLgOMPOdazc7YoJ9ZCWUyFy3A6CpPkRKLKD1ToAesxX8KGEViAiLo9N+7Q==
@@ -774,12 +863,12 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.14.5"
 
-"@babel/plugin-syntax-typescript@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.17.12.tgz#b54fc3be6de734a56b87508f99d6428b5b605a7b"
-  integrity sha512-TYY0SXFiO31YXtNg3HtFwNJHjLsAyIIhAhNWkQ5whPPS7HWUFlg9z0Ta4qAQNjQbP1wsSt/oKkmZ/4/WWdMUpw==
+"@babel/plugin-syntax-typescript@^7.20.0":
+  version "7.20.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.20.0.tgz#4e9a0cfc769c85689b77a2e642d24e9f697fc8c7"
+  integrity sha512-rd9TkG+u1CExzS4SM1BlMEhMXwFLKVjOAFFCDx9PbX5ycJWDoWMcwdJH9RhkPu1dOgn5TrxLot/Gx6lWFuAUNQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.19.0"
 
 "@babel/plugin-syntax-typescript@^7.7.2":
   version "7.14.5"
@@ -788,71 +877,73 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.14.5"
 
-"@babel/plugin-transform-arrow-functions@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.17.12.tgz#dddd783b473b1b1537ef46423e3944ff24898c45"
-  integrity sha512-PHln3CNi/49V+mza4xMwrg+WGYevSF1oaiXaC2EQfdp4HWlSjRsrDXWJiQBKpP7749u6vQ9mcry2uuFOv5CXvA==
+"@babel/plugin-transform-arrow-functions@^7.18.6":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.20.7.tgz#bea332b0e8b2dab3dafe55a163d8227531ab0551"
+  integrity sha512-3poA5E7dzDomxj9WXWwuD6A5F3kc7VXwIJO+E+J8qtDtS+pXPAhrgEyh+9GBwBgPq1Z+bB+/JD60lp5jsN7JPQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-transform-async-to-generator@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.17.12.tgz#dbe5511e6b01eee1496c944e35cdfe3f58050832"
-  integrity sha512-J8dbrWIOO3orDzir57NRsjg4uxucvhby0L/KZuGsWDj0g7twWK3g7JhJhOrXtuXiw8MeiSdJ3E0OW9H8LYEzLQ==
+"@babel/plugin-transform-async-to-generator@^7.18.6":
+  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==
   dependencies:
-    "@babel/helper-module-imports" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-remap-async-to-generator" "^7.16.8"
+    "@babel/helper-module-imports" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-remap-async-to-generator" "^7.18.9"
 
-"@babel/plugin-transform-block-scoped-functions@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.16.7.tgz#4d0d57d9632ef6062cdf354bb717102ee042a620"
-  integrity sha512-JUuzlzmF40Z9cXyytcbZEZKckgrQzChbQJw/5PuEHYeqzCsvebDx0K0jWnIIVcmmDOAVctCgnYs0pMcrYj2zJg==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-block-scoping@^7.17.12":
-  version "7.18.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.18.4.tgz#7988627b3e9186a13e4d7735dc9c34a056613fb9"
-  integrity sha512-+Hq10ye+jlvLEogSOtq4mKvtk7qwcUQ1f0Mrueai866C82f844Yom2cttfJdMdqRLTxWpsbfbkIkOIfovyUQXw==
+"@babel/plugin-transform-block-scoping@^7.20.2":
+  version "7.20.15"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.20.15.tgz#3e1b2aa9cbbe1eb8d644c823141a9c5c2a22392d"
+  integrity sha512-Vv4DMZ6MiNOhu/LdaZsT/bsLRxgL94d269Mv4R/9sp6+Mp++X/JqypZYypJXLlM4mlL352/Egzbzr98iABH1CA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-transform-classes@^7.17.12":
-  version "7.18.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.18.4.tgz#51310b812a090b846c784e47087fa6457baef814"
-  integrity sha512-e42NSG2mlKWgxKUAD9EJJSkZxR67+wZqzNxLSpc51T8tRU5SLFHsPmgYR5yr7sdgX4u+iHA1C5VafJ6AyImV3A==
+"@babel/plugin-transform-classes@^7.20.2":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.20.7.tgz#f438216f094f6bb31dc266ebfab8ff05aecad073"
+  integrity sha512-LWYbsiXTPKl+oBlXUGlwNlJZetXD5Am+CyBdqhPsDVjM9Jc8jwBJFrKhHf900Kfk2eZG1y9MAG3UNajol7A4VQ==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    "@babel/helper-environment-visitor" "^7.18.2"
-    "@babel/helper-function-name" "^7.17.9"
-    "@babel/helper-optimise-call-expression" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-replace-supers" "^7.18.2"
-    "@babel/helper-split-export-declaration" "^7.16.7"
+    "@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.19.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/plugin-transform-computed-properties@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.17.12.tgz#bca616a83679698f3258e892ed422546e531387f"
-  integrity sha512-a7XINeplB5cQUWMg1E/GI1tFz3LfK021IjV1rj1ypE+R7jHm+pIHmHl25VNkZxtx9uuYp7ThGk8fur1HHG7PgQ==
+"@babel/plugin-transform-computed-properties@^7.18.9":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.20.7.tgz#704cc2fd155d1c996551db8276d55b9d46e4d0aa"
+  integrity sha512-Lz7MvBK6DTjElHAmfu6bfANzKcxpyNPeYBGEafyA6E5HtRpjpZwU+u7Qrgz/2OR0z+5TvKYbPdphfSaAcZBrYQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/template" "^7.20.7"
 
-"@babel/plugin-transform-destructuring@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.18.0.tgz#dc4f92587e291b4daa78aa20cc2d7a63aa11e858"
-  integrity sha512-Mo69klS79z6KEfrLg/1WkmVnB8javh75HX4pi2btjvlIoasuxilEyjtsQW6XPrubNd7AQy0MMaNIaQE4e7+PQw==
+"@babel/plugin-transform-destructuring@^7.20.2":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.20.7.tgz#8bda578f71620c7de7c93af590154ba331415454"
+  integrity sha512-Xwg403sRrZb81IVB79ZPqNQME23yhugYVqgTxAhT99h485F4f+GMELFhhOsscDUB7HCswepKeCKLn/GZvUKoBA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-transform-dotall-regex@^7.16.7":
-  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-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==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-create-regexp-features-plugin" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
 "@babel/plugin-transform-dotall-regex@^7.4.4":
   version "7.14.5"
@@ -862,300 +953,283 @@
     "@babel/helper-create-regexp-features-plugin" "^7.14.5"
     "@babel/helper-plugin-utils" "^7.14.5"
 
-"@babel/plugin-transform-duplicate-keys@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.17.12.tgz#a09aa709a3310013f8e48e0e23bc7ace0f21477c"
-  integrity sha512-EA5eYFUG6xeerdabina/xIoB95jJ17mAkR8ivx6ZSu9frKShBjpOGZPn511MTDTkiCO+zXnzNczvUM69YSf3Zw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.9"
 
-"@babel/plugin-transform-exponentiation-operator@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.16.7.tgz#efa9862ef97e9e9e5f653f6ddc7b665e8536fe9b"
-  integrity sha512-8UYLSlyLgRixQvlYH3J2ekXFHDFLQutdy7FfFAMm3CPZ6q9wHCwnUyiXpQCe3gVVnQlHc5nsuiEVziteRNTXEA==
+"@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==
   dependencies:
-    "@babel/helper-builder-binary-assignment-operator-visitor" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-builder-binary-assignment-operator-visitor" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-for-of@^7.18.1":
-  version "7.18.1"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.18.1.tgz#ed14b657e162b72afbbb2b4cdad277bf2bb32036"
-  integrity sha512-+TTB5XwvJ5hZbO8xvl2H4XaMDOAK57zF4miuC9qQJgysPNEAZZ9Z69rdF5LJkozGdZrjBIUAIyKUWRMmebI7vg==
+"@babel/plugin-transform-for-of@^7.18.8":
+  version "7.18.8"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.18.8.tgz#6ef8a50b244eb6a0bdbad0c7c61877e4e30097c1"
+  integrity sha512-yEfTRnjuskWYo0k1mHUqrVWaZwrdq8AYbfrpqULOJOaucGSp4mNMVps+YtA8byoevxS/urwU75vyhQIxcCgiBQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-function-name@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.16.7.tgz#5ab34375c64d61d083d7d2f05c38d90b97ec65cf"
-  integrity sha512-SU/C68YVwTRxqWj5kgsbKINakGag0KTgq9f2iZEXdStoAbOzLHEBRYzImmA6yFo8YZhJVflvXmIHUO7GWHmxxA==
+"@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==
   dependencies:
-    "@babel/helper-compilation-targets" "^7.16.7"
-    "@babel/helper-function-name" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-compilation-targets" "^7.18.9"
+    "@babel/helper-function-name" "^7.18.9"
+    "@babel/helper-plugin-utils" "^7.18.9"
 
-"@babel/plugin-transform-literals@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.17.12.tgz#97131fbc6bbb261487105b4b3edbf9ebf9c830ae"
-  integrity sha512-8iRkvaTjJciWycPIZ9k9duu663FT7VrBdNqNgxnVXEFwOIp55JWcZd23VBRySYbnS3PwQ3rGiabJBBBGj5APmQ==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.9"
 
-"@babel/plugin-transform-member-expression-literals@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.16.7.tgz#6e5dcf906ef8a098e630149d14c867dd28f92384"
-  integrity sha512-mBruRMbktKQwbxaJof32LT9KLy2f3gH+27a5XSuXo6h7R3vqltl0PgZ80C8ZMKw98Bf8bqt6BEVi3svOh2PzMw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-modules-amd@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.18.0.tgz#7ef1002e67e36da3155edc8bf1ac9398064c02ed"
-  integrity sha512-h8FjOlYmdZwl7Xm2Ug4iX2j7Qy63NANI+NQVWQzv6r25fqgg7k2dZl03p95kvqNclglHs4FZ+isv4p1uXMA+QA==
+"@babel/plugin-transform-modules-amd@^7.19.6":
+  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==
   dependencies:
-    "@babel/helper-module-transforms" "^7.18.0"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    babel-plugin-dynamic-import-node "^2.3.3"
+    "@babel/helper-module-transforms" "^7.20.11"
+    "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-transform-modules-commonjs@^7.18.2":
-  version "7.18.2"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.18.2.tgz#1aa8efa2e2a6e818b6a7f2235fceaf09bdb31e9e"
-  integrity sha512-f5A865gFPAJAEE0K7F/+nm5CmAE3y8AWlMBG9unu5j9+tk50UQVK0QS8RNxSp7MJf0wh97uYyLWt3Zvu71zyOQ==
+"@babel/plugin-transform-modules-commonjs@^7.19.6":
+  version "7.20.11"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.20.11.tgz#8cb23010869bf7669fd4b3098598b6b2be6dc607"
+  integrity sha512-S8e1f7WQ7cimJQ51JkAaDrEtohVEitXjgCGAS2N8S31Y42E+kWwfSz83LYz57QdBm7q9diARVqanIaH2oVgQnw==
   dependencies:
-    "@babel/helper-module-transforms" "^7.18.0"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-simple-access" "^7.18.2"
-    babel-plugin-dynamic-import-node "^2.3.3"
+    "@babel/helper-module-transforms" "^7.20.11"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-simple-access" "^7.20.2"
 
-"@babel/plugin-transform-modules-systemjs@^7.18.0":
-  version "7.18.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.18.4.tgz#3d6fd9868c735cce8f38d6ae3a407fb7e61e6d46"
-  integrity sha512-lH2UaQaHVOAeYrUUuZ8i38o76J/FnO8vu21OE+tD1MyP9lxdZoSfz+pDbWkq46GogUrdrMz3tiz/FYGB+bVThg==
+"@babel/plugin-transform-modules-systemjs@^7.19.6":
+  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==
   dependencies:
-    "@babel/helper-hoist-variables" "^7.16.7"
-    "@babel/helper-module-transforms" "^7.18.0"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-validator-identifier" "^7.16.7"
-    babel-plugin-dynamic-import-node "^2.3.3"
+    "@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/plugin-transform-modules-umd@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.18.0.tgz#56aac64a2c2a1922341129a4597d1fd5c3ff020f"
-  integrity sha512-d/zZ8I3BWli1tmROLxXLc9A6YXvGK8egMxHp+E/rRwMh1Kip0AP77VwZae3snEJ33iiWwvNv2+UIIhfalqhzZA==
+"@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==
   dependencies:
-    "@babel/helper-module-transforms" "^7.18.0"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-module-transforms" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-named-capturing-groups-regex@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.17.12.tgz#9c4a5a5966e0434d515f2675c227fd8cc8606931"
-  integrity sha512-vWoWFM5CKaTeHrdUJ/3SIOTRV+MBVGybOC9mhJkaprGNt5demMymDW24yC74avb915/mIRe3TgNb/d8idvnCRA==
+"@babel/plugin-transform-named-capturing-groups-regex@^7.19.1":
+  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==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.17.12"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-create-regexp-features-plugin" "^7.20.5"
+    "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-transform-new-target@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.17.12.tgz#10842cd605a620944e81ea6060e9e65c265742e3"
-  integrity sha512-CaOtzk2fDYisbjAD4Sd1MTKGVIpRtx9bWLyj24Y/k6p4s4gQ3CqDGJauFJxt8M/LEx003d0i3klVqnN73qvK3w==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-object-super@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.16.7.tgz#ac359cf8d32cf4354d27a46867999490b6c32a94"
-  integrity sha512-14J1feiQVWaGvRxj2WjyMuXS2jsBkgB3MdSN5HuC2G5nRspa5RK9COcs82Pwy5BuGcjb+fYaUj94mYcOj7rCvw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
-    "@babel/helper-replace-supers" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-replace-supers" "^7.18.6"
 
-"@babel/plugin-transform-parameters@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.17.12.tgz#eb467cd9586ff5ff115a9880d6fdbd4a846b7766"
-  integrity sha512-6qW4rWo1cyCdq1FkYri7AHpauchbGLXpdwnYsfxFb+KtddHENfsY5JZb35xUwkK5opOLcJ3BNd2l7PhRYGlwIA==
+"@babel/plugin-transform-parameters@^7.20.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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-transform-property-literals@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.16.7.tgz#2dadac85155436f22c696c4827730e0fe1057a55"
-  integrity sha512-z4FGr9NMGdoIl1RqavCqGG+ZuYjfZ/hkCIeuH6Do7tXmSm0ls11nYVSJqFEUOSJbDab5wC6lRE/w6YjVcr6Hqw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-react-display-name@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.16.7.tgz#7b6d40d232f4c0f550ea348593db3b21e2404340"
-  integrity sha512-qgIg8BcZgd0G/Cz916D5+9kqX0c7nPZyXaP8R2tLNN5tkyIZdG5fEwBrxwplzSnjC1jvQmyMNVwUCZPcbGY7Pg==
+"@babel/plugin-transform-react-display-name@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.18.6.tgz#8b1125f919ef36ebdfff061d664e266c666b9415"
+  integrity sha512-TV4sQ+T013n61uMoygyMRm+xf04Bd5oqFpv2jAEQwSZ8NwQA7zeRPg1LMVg2PWi3zWBz+CLKD+v5bcpZ/BS0aA==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-react-inline-elements@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-inline-elements/-/plugin-transform-react-inline-elements-7.16.7.tgz#87d470ae5fc8ad5c803494070f7dc513846c03fe"
-  integrity sha512-jFGuZSebHob02zhrXsJhnI8xcemiDfdlJa1KR2LUfVj/4y9G2iwbJNGVsiH8mW6HEQVh5XwzWWbo/YoroDlQRg==
+"@babel/plugin-transform-react-inline-elements@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-inline-elements/-/plugin-transform-react-inline-elements-7.18.6.tgz#d0676948eb5a11d547de6add7e8a2c522ec708f5"
+  integrity sha512-uo3yD1EXhDxmk1Y/CeFDdHS5t22IOUBooLPFOrrjfpYmDM9Vg61xbIaWeWkbYQ7Aq0zMf30/FfKoQgFwyqw6Bg==
   dependencies:
-    "@babel/helper-builder-react-jsx" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-builder-react-jsx" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-react-jsx-development@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.16.7.tgz#43a00724a3ed2557ed3f276a01a929e6686ac7b8"
-  integrity sha512-RMvQWvpla+xy6MlBpPlrKZCMRs2AGiHOGHY3xRwl0pEeim348dDyxeH4xBsMPbIMhujeq7ihE702eM2Ew0Wo+A==
+"@babel/plugin-transform-react-jsx-development@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.18.6.tgz#dbe5c972811e49c7405b630e4d0d2e1380c0ddc5"
+  integrity sha512-SA6HEjwYFKF7WDjWcMcMGUimmw/nhNRDWxr+KaLSCrkD/LMDBvWRmHAYgE1HDeF8KUuI8OAu+RT6EOtKxSW2qA==
   dependencies:
-    "@babel/plugin-transform-react-jsx" "^7.16.7"
+    "@babel/plugin-transform-react-jsx" "^7.18.6"
 
-"@babel/plugin-transform-react-jsx-self@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.17.12.tgz#7f2e9b8c08d6a4204733138d8c29d4dba4bb66c2"
-  integrity sha512-7S9G2B44EnYOx74mue02t1uD8ckWZ/ee6Uz/qfdzc35uWHX5NgRy9i+iJSb2LFRgMd+QV9zNcStQaazzzZ3n3Q==
+"@babel/plugin-transform-react-jsx@^7.18.6":
+  version "7.20.13"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.20.13.tgz#f950f0b0c36377503d29a712f16287cedf886cbb"
+  integrity sha512-MmTZx/bkUrfJhhYAYt3Urjm+h8DQGrPrnKQ94jLo7NLuOU+T89a7IByhKmrb8SKhrIYIQ0FN0CHMbnFRen4qNw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-annotate-as-pure" "^7.18.6"
+    "@babel/helper-module-imports" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/plugin-syntax-jsx" "^7.18.6"
+    "@babel/types" "^7.20.7"
 
-"@babel/plugin-transform-react-jsx-source@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.16.7.tgz#1879c3f23629d287cc6186a6c683154509ec70c0"
-  integrity sha512-rONFiQz9vgbsnaMtQlZCjIRwhJvlrPET8TabIUK2hzlXw9B9s2Ieaxte1SCOOXMbWRHodbKixNf3BLcWVOQ8Bw==
+"@babel/plugin-transform-react-pure-annotations@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.18.6.tgz#561af267f19f3e5d59291f9950fd7b9663d0d844"
+  integrity sha512-I8VfEPg9r2TRDdvnHgPepTKvuRomzA8+u+nhY7qSI1fR2hRNebasZEETLyM5mAUr0Ku56OkXJ0I7NHJnO6cJiQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-annotate-as-pure" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-react-jsx@^7.16.7", "@babel/plugin-transform-react-jsx@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.17.12.tgz#2aa20022709cd6a3f40b45d60603d5f269586dba"
-  integrity sha512-Lcaw8bxd1DKht3thfD4A12dqo1X16he1Lm8rIv8sTwjAYNInRS1qHa9aJoqvzpscItXvftKDCfaEQzwoVyXpEQ==
+"@babel/plugin-transform-regenerator@^7.18.6":
+  version "7.20.5"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.20.5.tgz#57cda588c7ffb7f4f8483cc83bdcea02a907f04d"
+  integrity sha512-kW/oO7HPBtntbsahzQ0qSE3tFvkFwnbozz3NWFhLGqH75vLEg+sCGngLlhVkePlCs3Jv0dBBHDzCHxNiFAQKCQ==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    "@babel/helper-module-imports" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/plugin-syntax-jsx" "^7.17.12"
-    "@babel/types" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    regenerator-transform "^0.15.1"
 
-"@babel/plugin-transform-react-pure-annotations@^7.16.7":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.18.0.tgz#ef82c8e310913f3522462c9ac967d395092f1954"
-  integrity sha512-6+0IK6ouvqDn9bmEG7mEyF/pwlJXVj5lwydybpyyH3D0A7Hftk+NCTdYjnLNZksn261xaOV5ksmp20pQEmc2RQ==
+"@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==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-regenerator@^7.18.0":
-  version "7.18.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.18.0.tgz#44274d655eb3f1af3f3a574ba819d3f48caf99d5"
-  integrity sha512-C8YdRw9uzx25HSIzwA7EM7YP0FhCe5wNvJbZzjVNHHPGVcDJ3Aie+qGYYdS1oVQgn+B3eAIJbWFLrJ4Jipv7nw==
+"@babel/plugin-transform-runtime@^7.19.6":
+  version "7.19.6"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.19.6.tgz#9d2a9dbf4e12644d6f46e5e75bfbf02b5d6e9194"
+  integrity sha512-PRH37lz4JU156lYFW1p8OxE5i7d6Sl/zV58ooyr+q1J1lnQPyg5tIiXlIwNVhJaY4W3TmOtdc8jqdXQcB1v5Yw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-    regenerator-transform "^0.15.0"
-
-"@babel/plugin-transform-reserved-words@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.17.12.tgz#7dbd349f3cdffba751e817cf40ca1386732f652f"
-  integrity sha512-1KYqwbJV3Co03NIi14uEHW8P50Md6KqFgt0FfpHdK6oyAHQVTosgPuPSiWud1HX0oYJ1hGRRlk0fP87jFpqXZA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-
-"@babel/plugin-transform-runtime@^7.18.2":
-  version "7.18.2"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.18.2.tgz#04637de1e45ae8847ff14b9beead09c33d34374d"
-  integrity sha512-mr1ufuRMfS52ttq+1G1PD8OJNqgcTFjq3hwn8SZ5n1x1pBhi0E36rYMdTK0TsKtApJ4lDEdfXJwtGobQMHSMPg==
-  dependencies:
-    "@babel/helper-module-imports" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    babel-plugin-polyfill-corejs2 "^0.3.0"
-    babel-plugin-polyfill-corejs3 "^0.5.0"
-    babel-plugin-polyfill-regenerator "^0.3.0"
+    "@babel/helper-module-imports" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.19.0"
+    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/plugin-transform-shorthand-properties@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.16.7.tgz#e8549ae4afcf8382f711794c0c7b6b934c5fbd2a"
-  integrity sha512-hah2+FEnoRoATdIb05IOXf+4GzXYTq75TVhIn1PewihbpyrNWUt2JbudKQOETWw6QpLe+AIUpJ5MVLYTQbeeUg==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-spread@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.17.12.tgz#c112cad3064299f03ea32afed1d659223935d1f5"
-  integrity sha512-9pgmuQAtFi3lpNUstvG9nGfk9DkrdmWNp9KeKPFmuZCpEnxRzYlS8JgwPjYj+1AWDOSvoGN0H30p1cBOmT/Svg==
+"@babel/plugin-transform-spread@^7.19.0":
+  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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-skip-transparent-expression-wrappers" "^7.16.0"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-skip-transparent-expression-wrappers" "^7.20.0"
 
-"@babel/plugin-transform-sticky-regex@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.16.7.tgz#c84741d4f4a38072b9a1e2e3fd56d359552e8660"
-  integrity sha512-NJa0Bd/87QV5NZZzTuZG5BPJjLYadeSZ9fO6oOUoL4iQx+9EEuw/eEM92SrsT19Yc2jgB1u1hsjqDtH02c3Drw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-transform-template-literals@^7.18.2":
-  version "7.18.2"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.18.2.tgz#31ed6915721864847c48b656281d0098ea1add28"
-  integrity sha512-/cmuBVw9sZBGZVOMkpAEaVLwm4JmK2GZ1dFKOGGpMzEHWFmyZZ59lUU0PdRr8YNYeQdNzTDwuxP2X2gzydTc9g==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.9"
 
-"@babel/plugin-transform-typeof-symbol@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.17.12.tgz#0f12f57ac35e98b35b4ed34829948d42bd0e6889"
-  integrity sha512-Q8y+Jp7ZdtSPXCThB6zjQ74N3lj0f6TDh1Hnf5B+sYlzQ8i5Pjp8gW0My79iekSpT4WnI06blqP6DT0OmaXXmw==
+"@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==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.9"
 
-"@babel/plugin-transform-typescript@^7.17.12":
-  version "7.18.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.18.4.tgz#587eaf6a39edb8c06215e550dc939faeadd750bf"
-  integrity sha512-l4vHuSLUajptpHNEOUDEGsnpl9pfRLsN1XUoDQDD/YBuXTM+v37SHGS+c6n4jdcZy96QtuUuSvZYMLSSsjH8Mw==
+"@babel/plugin-transform-typescript@^7.18.6":
+  version "7.20.13"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.20.13.tgz#e3581b356b8694f6ff450211fe6774eaff8d25ab"
+  integrity sha512-O7I/THxarGcDZxkgWKMUrk7NK1/WbHAg3Xx86gqS6x9MTrNL6AwIluuZ96ms4xeDe6AVx6rjHbWHP7x26EPQBA==
   dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.18.0"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/plugin-syntax-typescript" "^7.17.12"
+    "@babel/helper-create-class-features-plugin" "^7.20.12"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/plugin-syntax-typescript" "^7.20.0"
 
-"@babel/plugin-transform-unicode-escapes@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.16.7.tgz#da8717de7b3287a2c6d659750c964f302b31ece3"
-  integrity sha512-TAV5IGahIz3yZ9/Hfv35TV2xEm+kaBDaZQCn2S/hG9/CZ0DktxJv9eKfPc7yYCvOYR4JGx1h8C+jcSOvgaaI/Q==
+"@babel/plugin-transform-unicode-escapes@^7.18.10":
+  version "7.18.10"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.18.10.tgz#1ecfb0eda83d09bbcb77c09970c2dd55832aa246"
+  integrity sha512-kKAdAI+YzPgGY/ftStBFXTI1LZFju38rYThnfMykS+IXy8BVx+res7s2fxf1l8I35DV2T97ezo6+SGrXz6B3iQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.9"
 
-"@babel/plugin-transform-unicode-regex@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.16.7.tgz#0f7aa4a501198976e25e82702574c34cfebe9ef2"
-  integrity sha512-oC5tYYKw56HO75KZVLQ+R/Nl3Hro9kf8iG0hXoaHP7tjAyCpvqBiSNe6vGrZni1Z6MggmUOC6A7VP7AVmw225Q==
+"@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==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.16.7"
-    "@babel/helper-plugin-utils" "^7.16.7"
+    "@babel/helper-create-regexp-features-plugin" "^7.18.6"
+    "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/preset-env@^7.18.2":
-  version "7.18.2"
-  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.18.2.tgz#f47d3000a098617926e674c945d95a28cb90977a"
-  integrity sha512-PfpdxotV6afmXMU47S08F9ZKIm2bJIQ0YbAAtDfIENX7G1NUAXigLREh69CWDjtgUy7dYn7bsMzkgdtAlmS68Q==
+"@babel/preset-env@^7.20.2":
+  version "7.20.2"
+  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.20.2.tgz#9b1642aa47bb9f43a86f9630011780dab7f86506"
+  integrity sha512-1G0efQEWR1EHkKvKHqbG+IN/QdgwfByUpM5V5QroDzGV2t3S/WXNQd693cHiHTlCFMpr9B6FkPFXDA2lQcKoDg==
   dependencies:
-    "@babel/compat-data" "^7.17.10"
-    "@babel/helper-compilation-targets" "^7.18.2"
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-validator-option" "^7.16.7"
-    "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression" "^7.17.12"
-    "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining" "^7.17.12"
-    "@babel/plugin-proposal-async-generator-functions" "^7.17.12"
-    "@babel/plugin-proposal-class-properties" "^7.17.12"
-    "@babel/plugin-proposal-class-static-block" "^7.18.0"
-    "@babel/plugin-proposal-dynamic-import" "^7.16.7"
-    "@babel/plugin-proposal-export-namespace-from" "^7.17.12"
-    "@babel/plugin-proposal-json-strings" "^7.17.12"
-    "@babel/plugin-proposal-logical-assignment-operators" "^7.17.12"
-    "@babel/plugin-proposal-nullish-coalescing-operator" "^7.17.12"
-    "@babel/plugin-proposal-numeric-separator" "^7.16.7"
-    "@babel/plugin-proposal-object-rest-spread" "^7.18.0"
-    "@babel/plugin-proposal-optional-catch-binding" "^7.16.7"
-    "@babel/plugin-proposal-optional-chaining" "^7.17.12"
-    "@babel/plugin-proposal-private-methods" "^7.17.12"
-    "@babel/plugin-proposal-private-property-in-object" "^7.17.12"
-    "@babel/plugin-proposal-unicode-property-regex" "^7.17.12"
+    "@babel/compat-data" "^7.20.1"
+    "@babel/helper-compilation-targets" "^7.20.0"
+    "@babel/helper-plugin-utils" "^7.20.2"
+    "@babel/helper-validator-option" "^7.18.6"
+    "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression" "^7.18.6"
+    "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining" "^7.18.9"
+    "@babel/plugin-proposal-async-generator-functions" "^7.20.1"
+    "@babel/plugin-proposal-class-properties" "^7.18.6"
+    "@babel/plugin-proposal-class-static-block" "^7.18.6"
+    "@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.18.9"
+    "@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.2"
+    "@babel/plugin-proposal-optional-catch-binding" "^7.18.6"
+    "@babel/plugin-proposal-optional-chaining" "^7.18.9"
+    "@babel/plugin-proposal-private-methods" "^7.18.6"
+    "@babel/plugin-proposal-private-property-in-object" "^7.18.6"
+    "@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.17.12"
+    "@babel/plugin-syntax-import-assertions" "^7.20.0"
     "@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"
@@ -1165,44 +1239,44 @@
     "@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.17.12"
-    "@babel/plugin-transform-async-to-generator" "^7.17.12"
-    "@babel/plugin-transform-block-scoped-functions" "^7.16.7"
-    "@babel/plugin-transform-block-scoping" "^7.17.12"
-    "@babel/plugin-transform-classes" "^7.17.12"
-    "@babel/plugin-transform-computed-properties" "^7.17.12"
-    "@babel/plugin-transform-destructuring" "^7.18.0"
-    "@babel/plugin-transform-dotall-regex" "^7.16.7"
-    "@babel/plugin-transform-duplicate-keys" "^7.17.12"
-    "@babel/plugin-transform-exponentiation-operator" "^7.16.7"
-    "@babel/plugin-transform-for-of" "^7.18.1"
-    "@babel/plugin-transform-function-name" "^7.16.7"
-    "@babel/plugin-transform-literals" "^7.17.12"
-    "@babel/plugin-transform-member-expression-literals" "^7.16.7"
-    "@babel/plugin-transform-modules-amd" "^7.18.0"
-    "@babel/plugin-transform-modules-commonjs" "^7.18.2"
-    "@babel/plugin-transform-modules-systemjs" "^7.18.0"
-    "@babel/plugin-transform-modules-umd" "^7.18.0"
-    "@babel/plugin-transform-named-capturing-groups-regex" "^7.17.12"
-    "@babel/plugin-transform-new-target" "^7.17.12"
-    "@babel/plugin-transform-object-super" "^7.16.7"
-    "@babel/plugin-transform-parameters" "^7.17.12"
-    "@babel/plugin-transform-property-literals" "^7.16.7"
-    "@babel/plugin-transform-regenerator" "^7.18.0"
-    "@babel/plugin-transform-reserved-words" "^7.17.12"
-    "@babel/plugin-transform-shorthand-properties" "^7.16.7"
-    "@babel/plugin-transform-spread" "^7.17.12"
-    "@babel/plugin-transform-sticky-regex" "^7.16.7"
-    "@babel/plugin-transform-template-literals" "^7.18.2"
-    "@babel/plugin-transform-typeof-symbol" "^7.17.12"
-    "@babel/plugin-transform-unicode-escapes" "^7.16.7"
-    "@babel/plugin-transform-unicode-regex" "^7.16.7"
+    "@babel/plugin-transform-arrow-functions" "^7.18.6"
+    "@babel/plugin-transform-async-to-generator" "^7.18.6"
+    "@babel/plugin-transform-block-scoped-functions" "^7.18.6"
+    "@babel/plugin-transform-block-scoping" "^7.20.2"
+    "@babel/plugin-transform-classes" "^7.20.2"
+    "@babel/plugin-transform-computed-properties" "^7.18.9"
+    "@babel/plugin-transform-destructuring" "^7.20.2"
+    "@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.18.8"
+    "@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.19.6"
+    "@babel/plugin-transform-modules-commonjs" "^7.19.6"
+    "@babel/plugin-transform-modules-systemjs" "^7.19.6"
+    "@babel/plugin-transform-modules-umd" "^7.18.6"
+    "@babel/plugin-transform-named-capturing-groups-regex" "^7.19.1"
+    "@babel/plugin-transform-new-target" "^7.18.6"
+    "@babel/plugin-transform-object-super" "^7.18.6"
+    "@babel/plugin-transform-parameters" "^7.20.1"
+    "@babel/plugin-transform-property-literals" "^7.18.6"
+    "@babel/plugin-transform-regenerator" "^7.18.6"
+    "@babel/plugin-transform-reserved-words" "^7.18.6"
+    "@babel/plugin-transform-shorthand-properties" "^7.18.6"
+    "@babel/plugin-transform-spread" "^7.19.0"
+    "@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.18.10"
+    "@babel/plugin-transform-unicode-regex" "^7.18.6"
     "@babel/preset-modules" "^0.1.5"
-    "@babel/types" "^7.18.2"
-    babel-plugin-polyfill-corejs2 "^0.3.0"
-    babel-plugin-polyfill-corejs3 "^0.5.0"
-    babel-plugin-polyfill-regenerator "^0.3.0"
-    core-js-compat "^3.22.1"
+    "@babel/types" "^7.20.2"
+    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/preset-modules@^0.1.5":
@@ -1216,26 +1290,26 @@
     "@babel/types" "^7.4.4"
     esutils "^2.0.2"
 
-"@babel/preset-react@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.17.12.tgz#62adbd2d1870c0de3893095757ed5b00b492ab3d"
-  integrity sha512-h5U+rwreXtZaRBEQhW1hOJLMq8XNJBQ/9oymXiCXTuT/0uOwpbT0gUt+sXeOqoXBgNuUKI7TaObVwoEyWkpFgA==
+"@babel/preset-react@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.18.6.tgz#979f76d6277048dc19094c217b507f3ad517dd2d"
+  integrity sha512-zXr6atUmyYdiWRVLOZahakYmOBHtWc2WGCkP8PYTgZi0iJXDY2CN180TdrIW4OGOAdLc7TifzDIvtx6izaRIzg==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-validator-option" "^7.16.7"
-    "@babel/plugin-transform-react-display-name" "^7.16.7"
-    "@babel/plugin-transform-react-jsx" "^7.17.12"
-    "@babel/plugin-transform-react-jsx-development" "^7.16.7"
-    "@babel/plugin-transform-react-pure-annotations" "^7.16.7"
+    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-validator-option" "^7.18.6"
+    "@babel/plugin-transform-react-display-name" "^7.18.6"
+    "@babel/plugin-transform-react-jsx" "^7.18.6"
+    "@babel/plugin-transform-react-jsx-development" "^7.18.6"
+    "@babel/plugin-transform-react-pure-annotations" "^7.18.6"
 
-"@babel/preset-typescript@^7.17.12":
-  version "7.17.12"
-  resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.17.12.tgz#40269e0a0084d56fc5731b6c40febe1c9a4a3e8c"
-  integrity sha512-S1ViF8W2QwAKUGJXxP9NAfNaqGDdEBJKpYkxHf5Yy2C4NPPzXGeR3Lhk7G8xJaaLcFTRfNjVbtbVtm8Gb0mqvg==
+"@babel/preset-typescript@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.18.6.tgz#ce64be3e63eddc44240c6358daefac17b3186399"
+  integrity sha512-s9ik86kXBAnD760aybBucdpnLsAt0jK1xqJn2juOn9lkOvSHV60os5hxoVJsPzMQxvnUJFAlkont2DvvaYEBtQ==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.17.12"
-    "@babel/helper-validator-option" "^7.16.7"
-    "@babel/plugin-transform-typescript" "^7.17.12"
+    "@babel/helper-plugin-utils" "^7.18.6"
+    "@babel/helper-validator-option" "^7.18.6"
+    "@babel/plugin-transform-typescript" "^7.18.6"
 
 "@babel/runtime-corejs3@^7.10.2":
   version "7.15.4"
@@ -1266,12 +1340,12 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.18.3":
-  version "7.18.3"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.18.3.tgz#c7b654b57f6f63cf7f8b418ac9ca04408c4579f4"
-  integrity sha512-38Y8f7YUhce/K7RMwTp7m0uCumpv9hZkitCbBClqQIow1qSbCvGkcegKOXpEWCQLfWmevgRiWokZ1GkpfhbZug==
+"@babel/runtime@^7.20.13":
+  version "7.20.13"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.13.tgz#7055ab8a7cff2b8f6058bf6ae45ff84ad2aded4b"
+  integrity sha512-gt3PKXs0DBoL9xCvOIIZ2NEqAGZqHjAnmVbfQtB620V0uReIQutpel14KcneZuer7UioY8ALKZ7iocavvzTNFA==
   dependencies:
-    regenerator-runtime "^0.13.4"
+    regenerator-runtime "^0.13.11"
 
 "@babel/runtime@^7.7.6":
   version "7.20.7"
@@ -1289,22 +1363,16 @@
     "@babel/parser" "^7.16.7"
     "@babel/types" "^7.16.7"
 
-"@babel/traverse@^7.13.0", "@babel/traverse@^7.7.2":
-  version "7.15.4"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.15.4.tgz#ff8510367a144bfbff552d9e18e28f3e2889c22d"
-  integrity sha512-W6lQD8l4rUbQR/vYgSuCAE75ADyyQvOpFVsvPPdkhf6lATXAsQIG9YdtOcu8BB1dZ0LKu+Zo3c1wEcbKeuhdlA==
+"@babel/template@^7.18.10", "@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.14.5"
-    "@babel/generator" "^7.15.4"
-    "@babel/helper-function-name" "^7.15.4"
-    "@babel/helper-hoist-variables" "^7.15.4"
-    "@babel/helper-split-export-declaration" "^7.15.4"
-    "@babel/parser" "^7.15.4"
-    "@babel/types" "^7.15.4"
-    debug "^4.1.0"
-    globals "^11.1.0"
+    "@babel/code-frame" "^7.18.6"
+    "@babel/parser" "^7.20.7"
+    "@babel/types" "^7.20.7"
 
-"@babel/traverse@^7.15.4", "@babel/traverse@^7.16.7", "@babel/traverse@^7.17.3":
+"@babel/traverse@^7.15.4", "@babel/traverse@^7.17.3":
   version "7.17.3"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.3.tgz#0ae0f15b27d9a92ba1f2263358ea7c4e7db47b57"
   integrity sha512-5irClVky7TxRWIRtxlh2WPUUOLhcPN06AGgaQSB8AEwuyEBgJVuJ5imdHm5zxk8w0QS5T+tDfnDxAlhWjpb7cw==
@@ -1320,7 +1388,7 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
-"@babel/traverse@^7.16.8", "@babel/traverse@^7.18.0", "@babel/traverse@^7.18.2":
+"@babel/traverse@^7.18.0", "@babel/traverse@^7.18.2":
   version "7.18.2"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.18.2.tgz#b77a52604b5cc836a9e1e08dca01cba67a12d2e8"
   integrity sha512-9eNwoeovJ6KH9zcCNnENY7DMFwTU9JdGCFtqNLfUAqtUHRCOsTOqWoffosP8vKmNYeSBUv3yVJXjfd8ucwOjUA==
@@ -1336,6 +1404,37 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
+"@babel/traverse@^7.20.10", "@babel/traverse@^7.20.12", "@babel/traverse@^7.20.13", "@babel/traverse@^7.20.5", "@babel/traverse@^7.20.7":
+  version "7.20.13"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.20.13.tgz#817c1ba13d11accca89478bd5481b2d168d07473"
+  integrity sha512-kMJXfF0T6DIS9E8cgdLCSAL+cuCK+YEZHWiLK0SXpTo8YRj5lpJu3CDNKiIBCne4m9hhTIqUg6SYTAI39tAiVQ==
+  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.13"
+    "@babel/types" "^7.20.7"
+    debug "^4.1.0"
+    globals "^11.1.0"
+
+"@babel/traverse@^7.7.2":
+  version "7.15.4"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.15.4.tgz#ff8510367a144bfbff552d9e18e28f3e2889c22d"
+  integrity sha512-W6lQD8l4rUbQR/vYgSuCAE75ADyyQvOpFVsvPPdkhf6lATXAsQIG9YdtOcu8BB1dZ0LKu+Zo3c1wEcbKeuhdlA==
+  dependencies:
+    "@babel/code-frame" "^7.14.5"
+    "@babel/generator" "^7.15.4"
+    "@babel/helper-function-name" "^7.15.4"
+    "@babel/helper-hoist-variables" "^7.15.4"
+    "@babel/helper-split-export-declaration" "^7.15.4"
+    "@babel/parser" "^7.15.4"
+    "@babel/types" "^7.15.4"
+    debug "^4.1.0"
+    globals "^11.1.0"
+
 "@babel/types@^7.0.0", "@babel/types@^7.15.4", "@babel/types@^7.16.7", "@babel/types@^7.17.0", "@babel/types@^7.3.0", "@babel/types@^7.3.3":
   version "7.17.0"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.17.0.tgz#a826e368bccb6b3d84acd76acad5c0d87342390b"
@@ -1344,15 +1443,7 @@
     "@babel/helper-validator-identifier" "^7.16.7"
     to-fast-properties "^2.0.0"
 
-"@babel/types@^7.0.0-beta.49", "@babel/types@^7.4.4", "@babel/types@^7.9.5":
-  version "7.15.6"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.15.6.tgz#99abdc48218b2881c058dd0a7ab05b99c9be758f"
-  integrity sha512-BPU+7QhqNjmWyDO0/vitH/CuhpV8ZmK1wpKva8nuyNF5MJfuRNWMc+hc14+u9xT93kvykMdncrJT19h74uB1Ig==
-  dependencies:
-    "@babel/helper-validator-identifier" "^7.14.9"
-    to-fast-properties "^2.0.0"
-
-"@babel/types@^7.16.0", "@babel/types@^7.16.8", "@babel/types@^7.17.12", "@babel/types@^7.18.0", "@babel/types@^7.18.2":
+"@babel/types@^7.18.0", "@babel/types@^7.18.2":
   version "7.18.4"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.18.4.tgz#27eae9b9fd18e9dccc3f9d6ad051336f307be354"
   integrity sha512-ThN1mBcMq5pG/Vm2IcBmPPfyPXbd8S02rS+OBIDENdufvqC7Z/jHPCv9IcP01277aKtDI8g/2XysBN4hA8niiw==
@@ -1360,6 +1451,23 @@
     "@babel/helper-validator-identifier" "^7.16.7"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.18.6", "@babel/types@^7.18.9", "@babel/types@^7.19.0", "@babel/types@^7.20.0", "@babel/types@^7.20.2", "@babel/types@^7.20.5", "@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==
+  dependencies:
+    "@babel/helper-string-parser" "^7.19.4"
+    "@babel/helper-validator-identifier" "^7.19.1"
+    to-fast-properties "^2.0.0"
+
+"@babel/types@^7.4.4", "@babel/types@^7.9.5":
+  version "7.15.6"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.15.6.tgz#99abdc48218b2881c058dd0a7ab05b99c9be758f"
+  integrity sha512-BPU+7QhqNjmWyDO0/vitH/CuhpV8ZmK1wpKva8nuyNF5MJfuRNWMc+hc14+u9xT93kvykMdncrJT19h74uB1Ig==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.14.9"
+    to-fast-properties "^2.0.0"
+
 "@bcoe/v8-coverage@^0.2.3":
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
@@ -1775,6 +1883,13 @@
   dependencies:
     "@sinclair/typebox" "^0.24.1"
 
+"@jest/schemas@^29.4.0":
+  version "29.4.0"
+  resolved "https://registry.yarnpkg.com/@jest/schemas/-/schemas-29.4.0.tgz#0d6ad358f295cc1deca0b643e6b4c86ebd539f17"
+  integrity sha512-0E01f/gOZeNTG76i5eWWSupvSHaIINrTie7vCyjiYFKgzNdyEGd12BUv4oNBFHOqlHDbtoJi3HrQ38KCC90NsQ==
+  dependencies:
+    "@sinclair/typebox" "^0.25.16"
+
 "@jest/source-map@^29.2.0":
   version "29.2.0"
   resolved "https://registry.yarnpkg.com/@jest/source-map/-/source-map-29.2.0.tgz#ab3420c46d42508dcc3dc1c6deee0b613c235744"
@@ -1825,6 +1940,27 @@
     slash "^3.0.0"
     write-file-atomic "^4.0.1"
 
+"@jest/transform@^29.4.1":
+  version "29.4.1"
+  resolved "https://registry.yarnpkg.com/@jest/transform/-/transform-29.4.1.tgz#e4f517841bb795c7dcdee1ba896275e2c2d26d4a"
+  integrity sha512-5w6YJrVAtiAgr0phzKjYd83UPbCXsBRTeYI4BXokv9Er9CcrH9hfXL/crCvP2d2nGOcovPUnlYiLPFLZrkG5Hg==
+  dependencies:
+    "@babel/core" "^7.11.6"
+    "@jest/types" "^29.4.1"
+    "@jridgewell/trace-mapping" "^0.3.15"
+    babel-plugin-istanbul "^6.1.1"
+    chalk "^4.0.0"
+    convert-source-map "^2.0.0"
+    fast-json-stable-stringify "^2.1.0"
+    graceful-fs "^4.2.9"
+    jest-haste-map "^29.4.1"
+    jest-regex-util "^29.2.0"
+    jest-util "^29.4.1"
+    micromatch "^4.0.4"
+    pirates "^4.0.4"
+    slash "^3.0.0"
+    write-file-atomic "^5.0.0"
+
 "@jest/types@^29.3.1":
   version "29.3.1"
   resolved "https://registry.yarnpkg.com/@jest/types/-/types-29.3.1.tgz#7c5a80777cb13e703aeec6788d044150341147e3"
@@ -1837,6 +1973,18 @@
     "@types/yargs" "^17.0.8"
     chalk "^4.0.0"
 
+"@jest/types@^29.4.1":
+  version "29.4.1"
+  resolved "https://registry.yarnpkg.com/@jest/types/-/types-29.4.1.tgz#f9f83d0916f50696661da72766132729dcb82ecb"
+  integrity sha512-zbrAXDUOnpJ+FMST2rV7QZOgec8rskg2zv8g2ajeqitp4tvZiyqTCYXANrKsM+ryj5o+LI+ZN2EgU9drrkiwSA==
+  dependencies:
+    "@jest/schemas" "^29.4.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.3.0":
   version "0.3.1"
   resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.1.tgz#cf92a983c83466b8c0ce9124fadeaf09f7c66ea9"
@@ -1846,6 +1994,15 @@
     "@jridgewell/sourcemap-codec" "^1.4.10"
     "@jridgewell/trace-mapping" "^0.3.9"
 
+"@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/resolve-uri@3.1.0":
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78"
@@ -1861,6 +2018,11 @@
   resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.1.tgz#36a6acc93987adcf0ba50c66908bd0b70de8afea"
   integrity sha512-Ct5MqZkLGEXTVmQYbGtx9SVqD2fqwvdubdps5D3djjAkgkKwT918VNOz65pEHFaYTeWcukmJmH5SwsA9Tn2ObQ==
 
+"@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/source-map@^0.3.2":
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.2.tgz#f45351aaed4527a298512ec72f81040c998580fb"
@@ -2336,6 +2498,11 @@
   resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.24.51.tgz#645f33fe4e02defe26f2f5c0410e1c094eac7f5f"
   integrity sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA==
 
+"@sinclair/typebox@^0.25.16":
+  version "0.25.21"
+  resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.25.21.tgz#763b05a4b472c93a8db29b2c3e359d55b29ce272"
+  integrity sha512-gFukHN4t8K4+wVC+ECqeqwzBDeFeTzBXroBTqE6vcWrQGbEUpHO7LYdG0f4xnvYq4VOEwITSlHlp0JBAIFMS/g==
+
 "@sindresorhus/is@^4.0.0":
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-4.6.0.tgz#3c7c9c46e678feefe7a2e5bb609d3dbd665ffb3f"
@@ -3717,7 +3884,7 @@ axobject-query@^2.2.0:
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
   integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==
 
-babel-jest@^29.0.0, babel-jest@^29.3.1:
+babel-jest@^29.3.1:
   version "29.3.1"
   resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-29.3.1.tgz#05c83e0d128cd48c453eea851482a38782249f44"
   integrity sha512-aard+xnMoxgjwV70t0L6wkW/3HQQtV+O0PEimxKgzNqCJnbYmroPojdP2tqKSOAt8QAKV/uSZU8851M7B5+fcA==
@@ -3730,6 +3897,19 @@ babel-jest@^29.0.0, babel-jest@^29.3.1:
     graceful-fs "^4.2.9"
     slash "^3.0.0"
 
+babel-jest@^29.4.1:
+  version "29.4.1"
+  resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-29.4.1.tgz#01fa167e27470b35c2d4a1b841d9586b1764da19"
+  integrity sha512-xBZa/pLSsF/1sNpkgsiT3CmY7zV1kAsZ9OxxtrFqYucnOuRftXAfcJqcDVyOPeN4lttWTwhLdu0T9f8uvoPEUg==
+  dependencies:
+    "@jest/transform" "^29.4.1"
+    "@types/babel__core" "^7.1.14"
+    babel-plugin-istanbul "^6.1.1"
+    babel-preset-jest "^29.4.0"
+    chalk "^4.0.0"
+    graceful-fs "^4.2.9"
+    slash "^3.0.0"
+
 babel-loader@^9.0.0:
   version "9.1.2"
   resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-9.1.2.tgz#a16a080de52d08854ee14570469905a5fc00d39c"
@@ -3738,13 +3918,6 @@ babel-loader@^9.0.0:
     find-cache-dir "^3.3.2"
     schema-utils "^4.0.0"
 
-babel-plugin-dynamic-import-node@^2.3.3:
-  version "2.3.3"
-  resolved "https://registry.yarnpkg.com/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.3.tgz#84fda19c976ec5c6defef57f9427b3def66e17a3"
-  integrity sha512-jZVI+s9Zg3IqA/kdi0i6UDCybUI3aSBLnglhYbSSjKlV7yF1F/5LWv8MakQmvYpnbJDS6fcBL2KzHSxNCMtWSQ==
-  dependencies:
-    object.assign "^4.1.0"
-
 babel-plugin-istanbul@^6.1.1:
   version "6.1.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-6.1.1.tgz#fa88ec59232fd9b4e36dbbc540a8ec9a9b47da73"
@@ -3766,16 +3939,15 @@ babel-plugin-jest-hoist@^29.2.0:
     "@types/babel__core" "^7.1.14"
     "@types/babel__traverse" "^7.0.6"
 
-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"
-  integrity sha512-yDZLjK7TCkWl1gpBeBGmuaDIFhZKmkoL+Cu2MUUjv5VxUZx/z7tBGBCBcQs5RI1Bkz5LLmNdjx7paOyQtMovyg==
+babel-plugin-jest-hoist@^29.4.0:
+  version "29.4.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-29.4.0.tgz#3fd3dfcedf645932df6d0c9fc3d9a704dd860248"
+  integrity sha512-a/sZRLQJEmsmejQ2rPEUe35nO1+C9dc9O1gplH1SXmJxveQSRUYdBk8yGZG/VOUuZs1u2aHZJusEGoRMbhhwCg==
   dependencies:
-    "@babel/helper-module-imports" "^7.0.0-beta.49"
-    "@babel/types" "^7.0.0-beta.49"
-    glob "^7.1.1"
-    lodash "^4.17.10"
-    require-package-name "^2.0.1"
+    "@babel/template" "^7.3.3"
+    "@babel/types" "^7.3.3"
+    "@types/babel__core" "^7.1.14"
+    "@types/babel__traverse" "^7.0.6"
 
 babel-plugin-macros@^3.0.1:
   version "3.1.0"
@@ -3786,29 +3958,29 @@ babel-plugin-macros@^3.0.1:
     cosmiconfig "^7.0.0"
     resolve "^1.19.0"
 
-babel-plugin-polyfill-corejs2@^0.3.0:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.1.tgz#440f1b70ccfaabc6b676d196239b138f8a2cfba5"
-  integrity sha512-v7/T6EQcNfVLfcN2X8Lulb7DjprieyLWJK/zOWH5DUYcAgex9sP3h25Q+DLsX9TloXe3y1O8l2q2Jv9q8UVB9w==
+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==
   dependencies:
-    "@babel/compat-data" "^7.13.11"
-    "@babel/helper-define-polyfill-provider" "^0.3.1"
+    "@babel/compat-data" "^7.17.7"
+    "@babel/helper-define-polyfill-provider" "^0.3.3"
     semver "^6.1.1"
 
-babel-plugin-polyfill-corejs3@^0.5.0:
-  version "0.5.2"
-  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.5.2.tgz#aabe4b2fa04a6e038b688c5e55d44e78cd3a5f72"
-  integrity sha512-G3uJih0XWiID451fpeFaYGVuxHEjzKTHtc9uGFEjR6hHrvNzeS/PX+LLLcetJcytsB5m4j+K3o/EpXJNb/5IEQ==
+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==
   dependencies:
-    "@babel/helper-define-polyfill-provider" "^0.3.1"
-    core-js-compat "^3.21.0"
+    "@babel/helper-define-polyfill-provider" "^0.3.3"
+    core-js-compat "^3.25.1"
 
-babel-plugin-polyfill-regenerator@^0.3.0:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.3.1.tgz#2c0678ea47c75c8cc2fbb1852278d8fb68233990"
-  integrity sha512-Y2B06tvgHYt1x0yz17jGkGeeMr5FeKUu+ASJ+N6nB5lQ8Dapfg42i0OVrf8PNGJ3zKL4A23snMi1IRwrqqND7A==
+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==
   dependencies:
-    "@babel/helper-define-polyfill-provider" "^0.3.1"
+    "@babel/helper-define-polyfill-provider" "^0.3.3"
 
 babel-plugin-preval@^5.1.0:
   version "5.1.0"
@@ -3869,6 +4041,14 @@ babel-preset-jest@^29.2.0:
     babel-plugin-jest-hoist "^29.2.0"
     babel-preset-current-node-syntax "^1.0.0"
 
+babel-preset-jest@^29.4.0:
+  version "29.4.0"
+  resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-29.4.0.tgz#c2b03c548b02dea0a18ae21d5759c136f9251ee4"
+  integrity sha512-fUB9vZflUSM3dO/6M2TCAepTzvA4VkOvl67PjErcrQMGt9Eve7uazaeyCZ2th3UtI7ljpiBJES0F7A1vBRsLZA==
+  dependencies:
+    babel-plugin-jest-hoist "^29.4.0"
+    babel-preset-current-node-syntax "^1.0.0"
+
 balanced-match@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
@@ -4021,6 +4201,16 @@ browserslist@^4.20.2, browserslist@^4.20.3:
     node-releases "^2.0.3"
     picocolors "^1.0.0"
 
+browserslist@^4.21.3, browserslist@^4.21.4:
+  version "4.21.5"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.5.tgz#75c5dae60063ee641f977e00edd3cfb2fb7af6a7"
+  integrity sha512-tUkiguQGW7S3IhB7N+c2MV/HZPSCPAAiYBZXLsBhFB/PCy6ZKKsZrmBayHV9fdGV/ARIfJ14NkxKzRDjvp7L6w==
+  dependencies:
+    caniuse-lite "^1.0.30001449"
+    electron-to-chromium "^1.4.284"
+    node-releases "^2.0.8"
+    update-browserslist-db "^1.0.10"
+
 bs-logger@0.x:
   version "0.2.6"
   resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8"
@@ -4133,6 +4323,11 @@ caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001254, caniuse-lite@^1.0.30001286, can
   resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001441.tgz"
   integrity sha512-OyxRR4Vof59I3yGWXws6i908EtGbMzVUi3ganaZQHmydk1iwDhRnvaPG2WaR0KcqrDFKrxVZHULT396LEPhXfg==
 
+caniuse-lite@^1.0.30001449:
+  version "1.0.30001450"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001450.tgz#022225b91200589196b814b51b1bbe45144cf74f"
+  integrity sha512-qMBmvmQmFXaSxexkjjfMvD5rnDL0+m+dUMZKoDYsGG8iZN29RuYh9eRoMvKsT6uMAWlyUUGDEQGJJYjzCIO9ew==
+
 chalk@^2.0.0, chalk@^2.3.0, chalk@^2.3.2:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
@@ -4480,13 +4675,12 @@ copy-webpack-plugin@^11.0.0:
     schema-utils "^4.0.0"
     serialize-javascript "^6.0.0"
 
-core-js-compat@^3.21.0, core-js-compat@^3.22.1:
-  version "3.22.8"
-  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.22.8.tgz#46fa34ce1ddf742acd7f95f575f66bbb21e05d62"
-  integrity sha512-pQnwg4xtuvc2Bs/5zYQPaEYYSuTxsF7LBWF0SvnVhthZo/Qe+rJpcEekrdNK5DWwDJ0gv0oI9NNX5Mppdy0ctg==
+core-js-compat@^3.25.1:
+  version "3.27.2"
+  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.27.2.tgz#607c50ad6db8fd8326af0b2883ebb987be3786da"
+  integrity sha512-welaYuF7ZtbYKGrIy7y3eb40d37rG1FvzEOfe7hSLd2iD6duMDqUhRfSvCGyC46HhR6Y8JXXdZ2lnRUMkPBpvg==
   dependencies:
-    browserslist "^4.20.3"
-    semver "7.0.0"
+    browserslist "^4.21.4"
 
 core-js-pure@^3.16.0:
   version "3.17.3"
@@ -5129,6 +5323,11 @@ electron-to-chromium@^1.4.188:
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.196.tgz#e18cdc5c1c2c2ebf78da237d0c374cc3b244d4cb"
   integrity sha512-uxMa/Dt7PQsLBVXwH+t6JvpHJnrsYBaxWKi/J6HE+/nBtoHENhwBoNkgkm226/Kfxeg0z1eMQLBRPPKcDH8xWA==
 
+electron-to-chromium@^1.4.284:
+  version "1.4.284"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz#61046d1e4cab3a25238f6bf7413795270f125592"
+  integrity sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==
+
 electron-to-chromium@^1.4.84:
   version "1.4.103"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.103.tgz#abfe376a4d70fa1e1b4b353b95df5d6dfd05da3a"
@@ -5461,6 +5660,14 @@ eslint-plugin-react@^7.25.1:
     resolve "^2.0.0-next.3"
     string.prototype.matchall "^4.0.5"
 
+eslint-plugin-tailwindcss@^3.8.3:
+  version "3.8.3"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-tailwindcss/-/eslint-plugin-tailwindcss-3.8.3.tgz#26dfa15fec45a94ddec99e44b1f25161a3477cbd"
+  integrity sha512-wfzfCmc9yONNW+TqfR+QWZ+syFPQ8zMOrIGx500lS4XITEm0HJYGyKh1sC1tQ9+Wmt58bnHzW3Yc31vy5RlJww==
+  dependencies:
+    fast-glob "^3.2.5"
+    postcss "^8.4.4"
+
 eslint-scope@5.1.1, eslint-scope@^5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c"
@@ -5736,7 +5943,7 @@ fast-glob@^3.1.1:
     merge2 "^1.3.0"
     micromatch "^4.0.4"
 
-fast-glob@^3.2.11, fast-glob@^3.2.12:
+fast-glob@^3.2.11, fast-glob@^3.2.12, fast-glob@^3.2.5:
   version "3.2.12"
   resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.12.tgz#7f39ec99c2e6ab030337142da9e0c18f37afae80"
   integrity sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==
@@ -6097,7 +6304,7 @@ glob-to-regexp@^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.1.1, glob@^7.1.2, glob@^7.1.3:
+glob@^7.1.2, glob@^7.1.3:
   version "7.1.7"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.7.tgz#3b193e9233f01d42d0b3f78294bbeeb418f94a90"
   integrity sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ==
@@ -7208,6 +7415,25 @@ jest-haste-map@^29.3.1:
   optionalDependencies:
     fsevents "^2.3.2"
 
+jest-haste-map@^29.4.1:
+  version "29.4.1"
+  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-29.4.1.tgz#b0579dc82d94b40ed9041af56ad25c2f80bedaeb"
+  integrity sha512-imTjcgfVVTvg02khXL11NNLTx9ZaofbAWhilrMg/G8dIkp+HYCswhxf0xxJwBkfhWb3e8dwbjuWburvxmcr58w==
+  dependencies:
+    "@jest/types" "^29.4.1"
+    "@types/graceful-fs" "^4.1.3"
+    "@types/node" "*"
+    anymatch "^3.0.3"
+    fb-watchman "^2.0.0"
+    graceful-fs "^4.2.9"
+    jest-regex-util "^29.2.0"
+    jest-util "^29.4.1"
+    jest-worker "^29.4.1"
+    micromatch "^4.0.4"
+    walker "^1.0.8"
+  optionalDependencies:
+    fsevents "^2.3.2"
+
 jest-junit@^15.0.0:
   version "15.0.0"
   resolved "https://registry.yarnpkg.com/jest-junit/-/jest-junit-15.0.0.tgz#a47544ab42e9f8fe7ada56306c218e09e52bd690"
@@ -7400,6 +7626,18 @@ jest-util@^29.0.0, jest-util@^29.3.1:
     graceful-fs "^4.2.9"
     picomatch "^2.2.3"
 
+jest-util@^29.4.1:
+  version "29.4.1"
+  resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-29.4.1.tgz#2eeed98ff4563b441b5a656ed1a786e3abc3e4c4"
+  integrity sha512-bQy9FPGxVutgpN4VRc0hk6w7Hx/m6L53QxpDreTZgJd9gfx/AV2MjyPde9tGyZRINAUrSv57p2inGBu2dRLmkQ==
+  dependencies:
+    "@jest/types" "^29.4.1"
+    "@types/node" "*"
+    chalk "^4.0.0"
+    ci-info "^3.2.0"
+    graceful-fs "^4.2.9"
+    picomatch "^2.2.3"
+
 jest-validate@^29.3.1:
   version "29.3.1"
   resolved "https://registry.yarnpkg.com/jest-validate/-/jest-validate-29.3.1.tgz#d56fefaa2e7d1fde3ecdc973c7f7f8f25eea704a"
@@ -7445,6 +7683,16 @@ jest-worker@^29.3.1:
     merge-stream "^2.0.0"
     supports-color "^8.0.0"
 
+jest-worker@^29.4.1:
+  version "29.4.1"
+  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-29.4.1.tgz#7cb4a99a38975679600305650f86f4807460aab1"
+  integrity sha512-O9doU/S1EBe+yp/mstQ0VpPwpv0Clgn68TkNwGxL6/usX/KUW9Arnn4ag8C3jc6qHcXznhsT5Na1liYzAsuAbQ==
+  dependencies:
+    "@types/node" "*"
+    jest-util "^29.4.1"
+    merge-stream "^2.0.0"
+    supports-color "^8.0.0"
+
 jest@^29.0.0:
   version "29.3.1"
   resolved "https://registry.yarnpkg.com/jest/-/jest-29.3.1.tgz#c130c0d551ae6b5459b8963747fed392ddbde122"
@@ -7587,6 +7835,11 @@ json5@^2.1.0, json5@^2.1.2, json5@^2.2.1:
   resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.2.tgz#64471c5bdcc564c18f7c1d4df2e2297f2457c5ab"
   integrity sha512-46Tk9JiOL2z7ytNQWFLpj99RZkVgeHf87yGQKsIkaPz1qSH9UczKH1rO7K3wgRselo0tYMUNfecYpm/p1vC7tQ==
 
+json5@^2.2.2:
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
+  integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
+
 jsonfile@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-4.0.0.tgz#8771aae0799b64076b76640fca058f9c10e33ecb"
@@ -7955,7 +8208,7 @@ lodash.uniq@^4.5.0:
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
   integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=
 
-lodash@^4.0.1, lodash@^4.17.10, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.7.0, lodash@^4.7.11:
+lodash@^4.0.1, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.7.0, lodash@^4.7.11:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@@ -7997,6 +8250,13 @@ lowercase-keys@^2.0.0:
   resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-2.0.0.tgz#2603e78b7b4b0006cbca2fbcc8a3202558ac9479"
   integrity sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==
 
+lru-cache@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-5.1.1.tgz#1da27e6710271947695daf6848e847f01d84b920"
+  integrity sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==
+  dependencies:
+    yallist "^3.0.2"
+
 lru-cache@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
@@ -8361,6 +8621,11 @@ node-releases@^2.0.6:
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.6.tgz#8a7088c63a55e493845683ebf3c828d8c51c5503"
   integrity sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg==
 
+node-releases@^2.0.8:
+  version "2.0.9"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.9.tgz#fe66405285382b0c4ac6bcfbfbe7e8a510650b4d"
+  integrity sha512-2xfmOrRkGogbTK9R6Leda0DGiXeY3p2NJpy4+gNCffdUvV6mdEJnaDEic1i3Ec2djAo8jWYoJMR5PB0MSMpxUA==
+
 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"
@@ -8435,7 +8700,7 @@ object-keys@^1.0.12, object-keys@^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.0, object.assign@^4.1.2:
+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==
@@ -9163,6 +9428,15 @@ postcss@^8.4.19:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
+postcss@^8.4.4:
+  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"
+
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
@@ -9843,10 +10117,10 @@ redux@^4.1.2:
   dependencies:
     "@babel/runtime" "^7.9.2"
 
-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==
+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==
   dependencies:
     regenerate "^1.4.2"
 
@@ -9877,10 +10151,10 @@ regenerator-runtime@^0.13.4, regenerator-runtime@^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.0:
-  version "0.15.0"
-  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.0.tgz#cbd9ead5d77fae1a48d957cf889ad0586adb6537"
-  integrity sha512-LsrGtPmbYg19bcPHwdtmXwbW+TqNvtY4riE3P83foeHRroMbH6/2ddFBfab3t7kbzc7v7p4wbkIecHImqt0QNg==
+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==
   dependencies:
     "@babel/runtime" "^7.8.4"
 
@@ -9909,27 +10183,27 @@ regexpu-core@^4.7.1:
     unicode-match-property-ecmascript "^2.0.0"
     unicode-match-property-value-ecmascript "^2.0.0"
 
-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@^5.2.1:
+  version "5.2.2"
+  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.2.2.tgz#3e4e5d12103b64748711c3aad69934d7718e75fc"
+  integrity sha512-T0+1Zp2wjF/juXMrMxHxidqGYn8U4R+zleSJhX9tQ1PUsS8a9UtYfbsF9LdiVgNX3kiX8RNaKM42nfSgvFJjmw==
   dependencies:
     regenerate "^1.4.2"
-    regenerate-unicode-properties "^10.0.1"
-    regjsgen "^0.6.0"
-    regjsparser "^0.8.2"
+    regenerate-unicode-properties "^10.1.0"
+    regjsgen "^0.7.1"
+    regjsparser "^0.9.1"
     unicode-match-property-ecmascript "^2.0.0"
-    unicode-match-property-value-ecmascript "^2.0.0"
+    unicode-match-property-value-ecmascript "^2.1.0"
 
 regjsgen@^0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.5.2.tgz#92ff295fb1deecbf6ecdab2543d207e91aa33733"
   integrity sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A==
 
-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.7.1:
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.7.1.tgz#ee5ef30e18d3f09b7c369b76e7c2373ed25546f6"
+  integrity sha512-RAt+8H2ZEzHeYWxZ3H2z6tF18zyyOnlcdaafLrm21Bguj7uZy6ULibiAFdXEtKQY4Sy7wDTwDiOazasMLc4KPA==
 
 regjsparser@^0.7.0:
   version "0.7.0"
@@ -9938,10 +10212,10 @@ regjsparser@^0.7.0:
   dependencies:
     jsesc "~0.5.0"
 
-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.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"
 
@@ -9971,11 +10245,6 @@ require-from-string@^2.0.2:
   resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-2.0.2.tgz#89a7fdd938261267318eafe14f9c32e598c36909"
   integrity sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==
 
-require-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 sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk=
-
 requires-port@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
@@ -10220,11 +10489,6 @@ semver-compare@^1.0.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7"
   integrity sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==
 
-semver@7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e"
-  integrity sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==
-
 semver@7.3.5, semver@7.x, semver@^7.3.4, semver@^7.3.5:
   version "7.3.5"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
@@ -11221,6 +11485,11 @@ unicode-match-property-value-ecmascript@^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==
+
 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"
@@ -11259,6 +11528,14 @@ unpipe@1.0.0, unpipe@~1.0.0:
   resolved "https://registry.yarnpkg.com/unpipe/-/unpipe-1.0.0.tgz#b2bf4ee8514aae6165b4817829d21b2ef49904ec"
   integrity sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw=
 
+update-browserslist-db@^1.0.10:
+  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"
+
 update-browserslist-db@^1.0.4:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.5.tgz#be06a5eedd62f107b7c19eb5bcefb194411abf38"
@@ -11792,6 +12069,14 @@ write-file-atomic@^4.0.2:
     imurmurhash "^0.1.4"
     signal-exit "^3.0.7"
 
+write-file-atomic@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-5.0.0.tgz#54303f117e109bf3d540261125c8ea5a7320fab0"
+  integrity sha512-R7NYMnHSlV42K54lwY9lvW6MnSm1HSJqZL3xiSgi9E7//FYaI74r2G0rd+/X6VAMkHEdzxQaU5HUOXWUz5kA/w==
+  dependencies:
+    imurmurhash "^0.1.4"
+    signal-exit "^3.0.7"
+
 ws@^7.3.1:
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.5.tgz#8b4bc4af518cfabd0473ae4f99144287b33eb881"
@@ -11837,6 +12122,11 @@ y18n@^5.0.5:
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-5.0.8.tgz#7f4934d0f7ca8c56f95314939ddcd2dd91ce1d55"
   integrity sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==
 
+yallist@^3.0.2:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.1.1.tgz#dbb7daf9bfd8bac9ab45ebf602b8cbad0d5d08fd"
+  integrity sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==
+
 yallist@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"