diff --git a/README.md b/README.md
index 30fa61a1dd..4538075eef 100644
--- a/README.md
+++ b/README.md
@@ -54,7 +54,7 @@ yarn
 Finally, run the dev server:
 
 ```sh
-yarn start
+yarn dev
 ```
 
 **That's it!** :tada:
@@ -140,7 +140,7 @@ NODE_ENV=development
 ```
 
 #### Local dev server
-- `yarn dev` - Exact same as above, aliased to `yarn start` for convenience.
+- `yarn dev` - Run the local dev server.
 
 #### Building
 - `yarn build` - Compile without a dev server, into `/static` directory.
diff --git a/app/soapbox/__fixtures__/intlMessages.json b/app/soapbox/__fixtures__/intlMessages.json
index 6e873f504c..328cd41809 100644
--- a/app/soapbox/__fixtures__/intlMessages.json
+++ b/app/soapbox/__fixtures__/intlMessages.json
@@ -836,6 +836,7 @@
   "registration.lead": "With an account on {instance} you\"ll be able to follow people on any server in the fediverse.",
   "registration.sign_up": "Sign up",
   "registration.tos": "Terms of Service",
+  "registration.reason": "Reason for Joining",
   "relative_time.days": "{number}d",
   "relative_time.hours": "{number}h",
   "relative_time.just_now": "now",
diff --git a/app/soapbox/actions/auth.js b/app/soapbox/actions/auth.js
index c241b801f2..8beb9c1eb5 100644
Binary files a/app/soapbox/actions/auth.js and b/app/soapbox/actions/auth.js differ
diff --git a/app/soapbox/actions/bookmarks.js b/app/soapbox/actions/bookmarks.js
new file mode 100644
index 0000000000..544ed2ff22
Binary files /dev/null and b/app/soapbox/actions/bookmarks.js differ
diff --git a/app/soapbox/actions/compose.js b/app/soapbox/actions/compose.js
index 28442f9942..a2b5c0f858 100644
Binary files a/app/soapbox/actions/compose.js and b/app/soapbox/actions/compose.js differ
diff --git a/app/soapbox/actions/filters.js b/app/soapbox/actions/filters.js
index cff647de3c..3448e391cb 100644
Binary files a/app/soapbox/actions/filters.js and b/app/soapbox/actions/filters.js differ
diff --git a/app/soapbox/actions/interactions.js b/app/soapbox/actions/interactions.js
index 7451c14f97..1acfa9c57b 100644
Binary files a/app/soapbox/actions/interactions.js and b/app/soapbox/actions/interactions.js differ
diff --git a/app/soapbox/actions/mfa.js b/app/soapbox/actions/mfa.js
new file mode 100644
index 0000000000..0a8a706ebc
Binary files /dev/null and b/app/soapbox/actions/mfa.js differ
diff --git a/app/soapbox/actions/settings.js b/app/soapbox/actions/settings.js
index 815479b961..e9b3a0c851 100644
Binary files a/app/soapbox/actions/settings.js and b/app/soapbox/actions/settings.js differ
diff --git a/app/soapbox/actions/timelines.js b/app/soapbox/actions/timelines.js
index f1213c3010..7ae27b8af0 100644
Binary files a/app/soapbox/actions/timelines.js and b/app/soapbox/actions/timelines.js differ
diff --git a/app/soapbox/components/display_name.js b/app/soapbox/components/display_name.js
index 1016c9f5a8..7ab8b9e607 100644
Binary files a/app/soapbox/components/display_name.js and b/app/soapbox/components/display_name.js differ
diff --git a/app/soapbox/components/sidebar_menu.js b/app/soapbox/components/sidebar_menu.js
index 67d67d9040..58e050263c 100644
Binary files a/app/soapbox/components/sidebar_menu.js and b/app/soapbox/components/sidebar_menu.js differ
diff --git a/app/soapbox/components/status.js b/app/soapbox/components/status.js
index 889afc01e0..d94de8fc9d 100644
Binary files a/app/soapbox/components/status.js and b/app/soapbox/components/status.js differ
diff --git a/app/soapbox/components/status_action_bar.js b/app/soapbox/components/status_action_bar.js
index 807c8f3cf2..5796171454 100644
Binary files a/app/soapbox/components/status_action_bar.js and b/app/soapbox/components/status_action_bar.js differ
diff --git a/app/soapbox/containers/account_container.js b/app/soapbox/containers/account_container.js
index 8e1f067dee..1e890a7e21 100644
Binary files a/app/soapbox/containers/account_container.js and b/app/soapbox/containers/account_container.js differ
diff --git a/app/soapbox/containers/status_container.js b/app/soapbox/containers/status_container.js
index d84141165f..02dc76c21e 100644
Binary files a/app/soapbox/containers/status_container.js and b/app/soapbox/containers/status_container.js differ
diff --git a/app/soapbox/features/account/components/header.js b/app/soapbox/features/account/components/header.js
index 038a33d6fb..a26ff710f0 100644
Binary files a/app/soapbox/features/account/components/header.js and b/app/soapbox/features/account/components/header.js differ
diff --git a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap
index 6c34feba79..646a96d498 100644
--- a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap
+++ b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap
@@ -3,11 +3,8 @@
 exports[`<LoginForm /> renders correctly 1`] = `
 <form
   className="simple_form new_user"
-  onSubmit={[Function]}
 >
-  <fieldset
-    disabled={false}
-  >
+  <fieldset>
     <div
       className="fields-group"
     >
diff --git a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap
index 35adf1d297..69885fe7bc 100644
--- a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap
+++ b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<LoginPage /> renders correctly 1`] = `
+exports[`<LoginPage /> renders correctly on load 1`] = `
 <form
   className="simple_form new_user"
   onSubmit={[Function]}
@@ -59,4 +59,4 @@ exports[`<LoginPage /> renders correctly 1`] = `
 </form>
 `;
 
-exports[`<LoginPage /> renders correctly 2`] = `null`;
+exports[`<LoginPage /> renders correctly on load 2`] = `null`;
diff --git a/app/soapbox/features/auth_login/components/__tests__/login_page-test.js b/app/soapbox/features/auth_login/components/__tests__/login_page-test.js
index f0e3d7901c..27393c6c31 100644
Binary files a/app/soapbox/features/auth_login/components/__tests__/login_page-test.js and b/app/soapbox/features/auth_login/components/__tests__/login_page-test.js differ
diff --git a/app/soapbox/features/auth_login/components/__tests__/otp_auth_form-test.js b/app/soapbox/features/auth_login/components/__tests__/otp_auth_form-test.js
new file mode 100644
index 0000000000..799a5e8199
Binary files /dev/null and b/app/soapbox/features/auth_login/components/__tests__/otp_auth_form-test.js differ
diff --git a/app/soapbox/features/auth_login/components/login_form.js b/app/soapbox/features/auth_login/components/login_form.js
index 1b669063b1..0a964f4492 100644
Binary files a/app/soapbox/features/auth_login/components/login_form.js and b/app/soapbox/features/auth_login/components/login_form.js differ
diff --git a/app/soapbox/features/auth_login/components/login_page.js b/app/soapbox/features/auth_login/components/login_page.js
index 2de7daa8f5..934ce12ea7 100644
Binary files a/app/soapbox/features/auth_login/components/login_page.js and b/app/soapbox/features/auth_login/components/login_page.js differ
diff --git a/app/soapbox/features/auth_login/components/otp_auth_form.js b/app/soapbox/features/auth_login/components/otp_auth_form.js
new file mode 100644
index 0000000000..21655f4929
Binary files /dev/null and b/app/soapbox/features/auth_login/components/otp_auth_form.js differ
diff --git a/app/soapbox/features/bookmarks/index.js b/app/soapbox/features/bookmarks/index.js
new file mode 100644
index 0000000000..2d1054913d
Binary files /dev/null and b/app/soapbox/features/bookmarks/index.js differ
diff --git a/app/soapbox/features/community_timeline/components/column_settings.js b/app/soapbox/features/community_timeline/components/column_settings.js
index d46dd01767..6ac69bcf2e 100644
Binary files a/app/soapbox/features/community_timeline/components/column_settings.js and b/app/soapbox/features/community_timeline/components/column_settings.js differ
diff --git a/app/soapbox/features/compose/components/action_bar.js b/app/soapbox/features/compose/components/action_bar.js
index 1314734f60..70c04e251c 100644
Binary files a/app/soapbox/features/compose/components/action_bar.js and b/app/soapbox/features/compose/components/action_bar.js differ
diff --git a/app/soapbox/features/compose/components/compose_form.js b/app/soapbox/features/compose/components/compose_form.js
index ae64a75f15..af8ce4263f 100644
Binary files a/app/soapbox/features/compose/components/compose_form.js and b/app/soapbox/features/compose/components/compose_form.js differ
diff --git a/app/soapbox/features/compose/containers/markdown_button_container.js b/app/soapbox/features/compose/containers/markdown_button_container.js
new file mode 100644
index 0000000000..0b4a642ca1
Binary files /dev/null and b/app/soapbox/features/compose/containers/markdown_button_container.js differ
diff --git a/app/soapbox/features/compose/containers/poll_button_container.js b/app/soapbox/features/compose/containers/poll_button_container.js
index c27967b940..db24886e27 100644
Binary files a/app/soapbox/features/compose/containers/poll_button_container.js and b/app/soapbox/features/compose/containers/poll_button_container.js differ
diff --git a/app/soapbox/features/compose/containers/sensitive_button_container.js b/app/soapbox/features/compose/containers/sensitive_button_container.js
index dc98de561f..3497c00093 100644
Binary files a/app/soapbox/features/compose/containers/sensitive_button_container.js and b/app/soapbox/features/compose/containers/sensitive_button_container.js differ
diff --git a/app/soapbox/features/compose/containers/upload_button_container.js b/app/soapbox/features/compose/containers/upload_button_container.js
index e4a6d70a08..8bf1c9047f 100644
Binary files a/app/soapbox/features/compose/containers/upload_button_container.js and b/app/soapbox/features/compose/containers/upload_button_container.js differ
diff --git a/app/soapbox/features/edit_profile/components/profile_preview.js b/app/soapbox/features/edit_profile/components/profile_preview.js
index 6b4166d22d..808f18a555 100644
Binary files a/app/soapbox/features/edit_profile/components/profile_preview.js and b/app/soapbox/features/edit_profile/components/profile_preview.js differ
diff --git a/app/soapbox/features/edit_profile/index.js b/app/soapbox/features/edit_profile/index.js
index c4126d92d5..bcb3d71ea5 100644
Binary files a/app/soapbox/features/edit_profile/index.js and b/app/soapbox/features/edit_profile/index.js differ
diff --git a/app/soapbox/features/filters/index.js b/app/soapbox/features/filters/index.js
index 7ae71daac7..60b406a823 100644
Binary files a/app/soapbox/features/filters/index.js and b/app/soapbox/features/filters/index.js differ
diff --git a/app/soapbox/features/forms/index.js b/app/soapbox/features/forms/index.js
index 779f8f892f..85fc036403 100644
Binary files a/app/soapbox/features/forms/index.js and b/app/soapbox/features/forms/index.js differ
diff --git a/app/soapbox/features/home_timeline/components/column_settings.js b/app/soapbox/features/home_timeline/components/column_settings.js
index d37e70f1c0..da553e779f 100644
Binary files a/app/soapbox/features/home_timeline/components/column_settings.js and b/app/soapbox/features/home_timeline/components/column_settings.js differ
diff --git a/app/soapbox/features/landing_page/components/registration_form.js b/app/soapbox/features/landing_page/components/registration_form.js
index 36faad1032..0d6a9db713 100644
Binary files a/app/soapbox/features/landing_page/components/registration_form.js and b/app/soapbox/features/landing_page/components/registration_form.js differ
diff --git a/app/soapbox/features/notifications/components/column_settings.js b/app/soapbox/features/notifications/components/column_settings.js
index c48b72fbf3..f53ba70c8d 100644
Binary files a/app/soapbox/features/notifications/components/column_settings.js and b/app/soapbox/features/notifications/components/column_settings.js differ
diff --git a/app/soapbox/features/notifications/components/multi_setting_toggle.js b/app/soapbox/features/notifications/components/multi_setting_toggle.js
new file mode 100644
index 0000000000..392369edcb
Binary files /dev/null and b/app/soapbox/features/notifications/components/multi_setting_toggle.js differ
diff --git a/app/soapbox/features/profile_hover_card/profile_hover_card_container.js b/app/soapbox/features/profile_hover_card/profile_hover_card_container.js
new file mode 100644
index 0000000000..9ab2c7678c
Binary files /dev/null and b/app/soapbox/features/profile_hover_card/profile_hover_card_container.js differ
diff --git a/app/soapbox/features/public_layout/components/header.js b/app/soapbox/features/public_layout/components/header.js
index 9f018cc3cf..70c20dcaaa 100644
Binary files a/app/soapbox/features/public_layout/components/header.js and b/app/soapbox/features/public_layout/components/header.js differ
diff --git a/app/soapbox/features/public_timeline/components/column_settings.js b/app/soapbox/features/public_timeline/components/column_settings.js
index d46dd01767..1d7bd73596 100644
Binary files a/app/soapbox/features/public_timeline/components/column_settings.js and b/app/soapbox/features/public_timeline/components/column_settings.js differ
diff --git a/app/soapbox/features/security/index.js b/app/soapbox/features/security/index.js
index f69c31f6d1..b13305dd15 100644
Binary files a/app/soapbox/features/security/index.js and b/app/soapbox/features/security/index.js differ
diff --git a/app/soapbox/features/security/mfa_form.js b/app/soapbox/features/security/mfa_form.js
new file mode 100644
index 0000000000..572579d530
Binary files /dev/null and b/app/soapbox/features/security/mfa_form.js differ
diff --git a/app/soapbox/features/status/components/action_bar.js b/app/soapbox/features/status/components/action_bar.js
index c5db0cab59..de3969f270 100644
Binary files a/app/soapbox/features/status/components/action_bar.js and b/app/soapbox/features/status/components/action_bar.js differ
diff --git a/app/soapbox/features/status/components/detailed_status.js b/app/soapbox/features/status/components/detailed_status.js
index a31d826bed..4da17ba99e 100644
Binary files a/app/soapbox/features/status/components/detailed_status.js and b/app/soapbox/features/status/components/detailed_status.js differ
diff --git a/app/soapbox/features/ui/components/action_button.js b/app/soapbox/features/ui/components/action_button.js
new file mode 100644
index 0000000000..e1c88d2323
Binary files /dev/null and b/app/soapbox/features/ui/components/action_button.js differ
diff --git a/app/soapbox/features/ui/components/explanation_box.js b/app/soapbox/features/ui/components/explanation_box.js
index 4f27d056bc..f3d84a4f0f 100644
Binary files a/app/soapbox/features/ui/components/explanation_box.js and b/app/soapbox/features/ui/components/explanation_box.js differ
diff --git a/app/soapbox/features/ui/components/features_panel.js b/app/soapbox/features/ui/components/features_panel.js
new file mode 100644
index 0000000000..b77eeb677e
Binary files /dev/null and b/app/soapbox/features/ui/components/features_panel.js differ
diff --git a/app/soapbox/features/ui/components/profile_info_panel.js b/app/soapbox/features/ui/components/profile_info_panel.js
index e26dc01256..592d60ee02 100644
Binary files a/app/soapbox/features/ui/components/profile_info_panel.js and b/app/soapbox/features/ui/components/profile_info_panel.js differ
diff --git a/app/soapbox/features/ui/components/user_panel.js b/app/soapbox/features/ui/components/user_panel.js
index 83dfd20992..1ba4e3efca 100644
Binary files a/app/soapbox/features/ui/components/user_panel.js and b/app/soapbox/features/ui/components/user_panel.js differ
diff --git a/app/soapbox/features/ui/containers/status_list_container.js b/app/soapbox/features/ui/containers/status_list_container.js
index 307dff09d8..f54cd2eee4 100644
Binary files a/app/soapbox/features/ui/containers/status_list_container.js and b/app/soapbox/features/ui/containers/status_list_container.js differ
diff --git a/app/soapbox/features/ui/index.js b/app/soapbox/features/ui/index.js
index 52a358db5c..e03e21b121 100644
Binary files a/app/soapbox/features/ui/index.js and b/app/soapbox/features/ui/index.js differ
diff --git a/app/soapbox/features/ui/util/async-components.js b/app/soapbox/features/ui/util/async-components.js
index 525f05a31a..c530149f5d 100644
Binary files a/app/soapbox/features/ui/util/async-components.js and b/app/soapbox/features/ui/util/async-components.js differ
diff --git a/app/soapbox/pages/home_page.js b/app/soapbox/pages/home_page.js
index f06bd90eb1..81f2c93e3b 100644
Binary files a/app/soapbox/pages/home_page.js and b/app/soapbox/pages/home_page.js differ
diff --git a/app/soapbox/reducers/__tests__/alerts-test.js b/app/soapbox/reducers/__tests__/alerts-test.js
index f5af4a50f8..ab935b45ce 100644
Binary files a/app/soapbox/reducers/__tests__/alerts-test.js and b/app/soapbox/reducers/__tests__/alerts-test.js differ
diff --git a/app/soapbox/reducers/__tests__/compose-test.js b/app/soapbox/reducers/__tests__/compose-test.js
index c3ebe7ded3..230036fe81 100644
Binary files a/app/soapbox/reducers/__tests__/compose-test.js and b/app/soapbox/reducers/__tests__/compose-test.js differ
diff --git a/app/soapbox/reducers/__tests__/notifications-test.js b/app/soapbox/reducers/__tests__/notifications-test.js
index 3831067bae..ef6d99d883 100644
Binary files a/app/soapbox/reducers/__tests__/notifications-test.js and b/app/soapbox/reducers/__tests__/notifications-test.js differ
diff --git a/app/soapbox/reducers/__tests__/status_lists-test.js b/app/soapbox/reducers/__tests__/status_lists-test.js
index b996228a18..27f6ffde17 100644
Binary files a/app/soapbox/reducers/__tests__/status_lists-test.js and b/app/soapbox/reducers/__tests__/status_lists-test.js differ
diff --git a/app/soapbox/reducers/compose.js b/app/soapbox/reducers/compose.js
index c2e39e866d..28074b3470 100644
Binary files a/app/soapbox/reducers/compose.js and b/app/soapbox/reducers/compose.js differ
diff --git a/app/soapbox/reducers/instance.js b/app/soapbox/reducers/instance.js
index 9809510314..f2fc6b5ca8 100644
Binary files a/app/soapbox/reducers/instance.js and b/app/soapbox/reducers/instance.js differ
diff --git a/app/soapbox/reducers/relationships.js b/app/soapbox/reducers/relationships.js
index 8881d59255..dfc93950b4 100644
Binary files a/app/soapbox/reducers/relationships.js and b/app/soapbox/reducers/relationships.js differ
diff --git a/app/soapbox/reducers/status_lists.js b/app/soapbox/reducers/status_lists.js
index 6c5f335574..9f8f28deed 100644
Binary files a/app/soapbox/reducers/status_lists.js and b/app/soapbox/reducers/status_lists.js differ
diff --git a/app/styles/about.scss b/app/styles/about.scss
index 27a02f0119..77d93917e4 100644
--- a/app/styles/about.scss
+++ b/app/styles/about.scss
@@ -34,6 +34,7 @@ $small-breakpoint: 960px;
     flex-wrap: nowrap;
     padding: 14px 0;
     box-sizing: border-box;
+    position: relative;
 
     @media screen and (max-width: 1024px) {
       padding: 14px 20px;
@@ -1712,7 +1713,40 @@ $small-breakpoint: 960px;
   .header,
   .container {
     position: relative;
-    z-index: 1;
+  }
+
+  .otp-form-overlay__container {
+    z-index: 9998;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: rgba($base-overlay-background, 0.7);
+
+    .otp-form-overlay__form {
+      @include standard-panel-shadow;
+      border-radius: 10px;
+      z-index: 9999;
+      margin: 0 auto;
+      max-width: 800px;
+      position: relative;
+      padding: 20px;
+      background-color: var(--background-color);
+      display: flex;
+      flex-direction: column;
+
+      .simple_form {
+        padding: 30px 50px 50px;
+      }
+
+      .otp-form-overlay__close {
+        align-self: flex-end;
+      }
+    }
   }
 }
 
@@ -1725,3 +1759,10 @@ $small-breakpoint: 960px;
   bottom: 0;
   right: 0;
 }
+
+h1.otp-login {
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 800;
+  padding: 10px 0;
+}
diff --git a/app/styles/accounts.scss b/app/styles/accounts.scss
index b25f0d4771..4b09808500 100644
--- a/app/styles/accounts.scss
+++ b/app/styles/accounts.scss
@@ -13,7 +13,7 @@
     &:active,
     &:focus {
       .card__bar {
-        background: var(--brand-color--med);
+        background: var(--foreground-color);
       }
     }
   }
@@ -92,6 +92,11 @@
         overflow: hidden;
         text-overflow: ellipsis;
       }
+
+      bdi,
+      span.verified-icon {
+        display: inline-block;
+      }
     }
   }
 }
@@ -584,7 +589,7 @@ a .account__avatar {
 }
 
 .account__section-headline {
-  background: var(--accent-color--faint);
+  background: var(--foreground-color);
 
   button,
   a {
diff --git a/app/styles/application.scss b/app/styles/application.scss
index bb3d0ca822..c42cff3e4e 100644
--- a/app/styles/application.scss
+++ b/app/styles/application.scss
@@ -71,3 +71,6 @@
 @import 'components/error-boundary';
 @import 'components/video-player';
 @import 'components/audio-player';
+@import 'components/profile_hover_card';
+@import 'components/filters';
+@import 'components/mfa_form';
diff --git a/app/styles/basics.scss b/app/styles/basics.scss
index 7f5b06e0e4..53119ffc48 100644
--- a/app/styles/basics.scss
+++ b/app/styles/basics.scss
@@ -170,7 +170,10 @@ body {
   &__title {
     font-weight: bold;
     font-size: 16px;
-    margin-bottom: 1em;
+  }
+
+  &__explanation {
+    margin-top: 1em;
   }
 
   &__dismiss {
@@ -215,3 +218,14 @@ noscript {
     }
   }
 }
+
+.floating-link {
+  width: 100%;
+  height: 100%;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  z-index: 9999;
+}
diff --git a/app/styles/components/account-header.scss b/app/styles/components/account-header.scss
index f20e0c3baf..930a1fd3f8 100644
--- a/app/styles/components/account-header.scss
+++ b/app/styles/components/account-header.scss
@@ -19,9 +19,10 @@
     overflow: hidden;
     height: 350px;
     position: relative;
-    background: var(--accent-color--med);
+    background: var(--accent-color--faint);
     @media screen and (max-width: 895px) {height: 225px;}
     &--none {height: 125px;}
+
     img {
       object-fit: cover;
       display: block;
@@ -30,6 +31,10 @@
       margin: 0;
     }
 
+    .still-image {
+      height: 100%;
+    }
+
     .still-image--play-on-hover::before {
       content: 'GIF';
       position: absolute;
@@ -53,7 +58,7 @@
     min-height: 74px;
     width: 100%;
     position: relative;
-    background: var(--accent-color--med);
+    background: var(--background-color);
     @media (min-width: 895px) {height: 74px;}
   }
 
diff --git a/app/styles/components/audio-player.scss b/app/styles/components/audio-player.scss
index 551e19bc9f..7073f141a0 100644
--- a/app/styles/components/audio-player.scss
+++ b/app/styles/components/audio-player.scss
@@ -173,11 +173,11 @@
     white-space: nowrap;
     overlow: hidden;
     text-overflow: ellipsis;
-    background: hsl( var(--brand-color_h), var(--brand-color_s), 20% );
+    background: hsl(var(--brand-color_h), var(--brand-color_s), 20%);
     padding: 5px;
 
     &__label {
-      color: white;
+      color: #ffffff;
     }
 
     button {
diff --git a/app/styles/components/buttons.scss b/app/styles/components/buttons.scss
index fd664d06dc..49070ad6ca 100644
--- a/app/styles/components/buttons.scss
+++ b/app/styles/components/buttons.scss
@@ -102,7 +102,7 @@ button {
     &:focus,
     &:hover {
       border-color: var(--brand-color);
-      color: var(--primary-text-color);
+      color: var(--background-color);
     }
 
     &:disabled {
diff --git a/app/styles/components/columns.scss b/app/styles/components/columns.scss
index c005a6e603..d8034e4974 100644
--- a/app/styles/components/columns.scss
+++ b/app/styles/components/columns.scss
@@ -205,13 +205,14 @@
 }
 
 .column-back-button {
-  background: var(--accent-color--med);
+  background: var(--accent-color--faint);
   color: var(--highlight-text-color);
   cursor: pointer;
   flex: 0 0 auto;
   font-size: 16px;
   line-height: inherit;
   border: 0;
+  border-radius: 10px 10px 0 0;
   text-align: unset;
   padding: 15px;
   margin: 0;
@@ -260,7 +261,7 @@
   position: absolute;
   right: 0;
   top: -49px;
-  
+
   @media screen and (max-width: $nav-breakpoint-2) {
     top: -35px;
     font-size: 14px;
diff --git a/app/styles/components/compose-form.scss b/app/styles/components/compose-form.scss
index b2d61bc228..edb565832d 100644
--- a/app/styles/components/compose-form.scss
+++ b/app/styles/components/compose-form.scss
@@ -298,6 +298,7 @@
     display: flex;
     justify-content: space-between;
     flex: 0 0 auto;
+    border-radius: 0 0 5px 5px;
 
     .compose-form__buttons {
       display: flex;
diff --git a/app/styles/components/detailed-status.scss b/app/styles/components/detailed-status.scss
index 9838278f90..6795bba5eb 100644
--- a/app/styles/components/detailed-status.scss
+++ b/app/styles/components/detailed-status.scss
@@ -62,6 +62,7 @@
   border-bottom: 1px solid var(--brand-color--faint);
   display: flex;
   flex-direction: row;
+  border-radius: 0 0 10px 10px;
 }
 
 .detailed-status__link {
diff --git a/app/styles/components/display-name.scss b/app/styles/components/display-name.scss
index 2282c6d485..0dd3e1e65f 100644
--- a/app/styles/components/display-name.scss
+++ b/app/styles/components/display-name.scss
@@ -41,6 +41,7 @@ a.account__display-name {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  position: relative;
 }
 
 .display-name__html {
diff --git a/app/styles/components/drawer.scss b/app/styles/components/drawer.scss
index 7dc5a1a10c..39e936158b 100644
--- a/app/styles/components/drawer.scss
+++ b/app/styles/components/drawer.scss
@@ -20,7 +20,7 @@
 .column,
 .drawer {
   flex: 1 1 100%;
-  overflow: hidden;
+  overflow: visible;
 }
 
 .drawer__pager {
diff --git a/app/styles/components/filters.scss b/app/styles/components/filters.scss
new file mode 100644
index 0000000000..769954a4d5
--- /dev/null
+++ b/app/styles/components/filters.scss
@@ -0,0 +1,101 @@
+.filter-settings-panel {
+  h1 {
+    font-size: 18px;
+    line-height: 1.25;
+    color: var(--primary-text-color);
+    font-weight: 400;
+    margin: 20px auto;
+  }
+
+  .item-list article {
+    border-bottom: 1px solid var(--primary-text-color--faint);
+
+    &:last-child {
+      border-bottom: 0;
+    }
+  }
+
+  .fields-group .two-col {
+    display: flex;
+    align-items: flex-start;
+    width: 100%;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+
+    div.input {
+      width: 45%;
+      margin-right: 20px;
+
+      .label_input {
+        width: 100%;
+      }
+    }
+
+    @media(max-width: 485px) {
+      div.input {
+        width: 100%;
+        margin-right: 5px;
+
+        .label_input {
+          width: auto;
+        }
+      }
+    }
+  }
+
+  .filter__container {
+    padding: 20px;
+    display: flex;
+    justify-content: space-between;
+    font-size: 14px;
+
+    .filter__phrase,
+    .filter__contexts,
+    .filter__details {
+      padding: 5px 0;
+    }
+
+    span.filter__list-label {
+      padding-right: 5px;
+      color: var(--primary-text-color--faint);
+    }
+
+    span.filter__list-value span {
+      padding-right: 5px;
+      text-transform: capitalize;
+
+      &::after {
+        content: ',';
+      }
+
+      &:last-of-type {
+        &::after {
+          content: '';
+        }
+      }
+    }
+
+    .filter__delete {
+      display: flex;
+      margin: 10px;
+      align-items: baseline;
+      cursor: pointer;
+      height: 20px;
+
+      span.filter__delete-label {
+        color: var(--primary-text-color--faint);
+        font-size: 14px;
+        font-weight: 800;
+      }
+
+      .filter__delete-icon {
+        background: none;
+        color: var(--primary-text-color--faint);
+        padding: 0 5px;
+        margin: 0 auto;
+        font-size: 16px;
+      }
+    }
+
+  }
+}
diff --git a/app/styles/components/mfa_form.scss b/app/styles/components/mfa_form.scss
new file mode 100644
index 0000000000..80e16da1eb
--- /dev/null
+++ b/app/styles/components/mfa_form.scss
@@ -0,0 +1,81 @@
+.security-settings-panel {
+  margin: 20px;
+
+  h1.security-settings-panel__setup-otp {
+    font-size: 20px;
+    line-height: 1.25;
+    color: var(--primary-text-color);
+    font-weight: 600;
+  }
+
+  h2.security-settings-panel__setup-otp {
+      display: block;
+      font-size: 16px;
+      line-height: 1.5;
+      color: var(--primary-text-color--faint);
+      font-weight: 400;
+    }
+
+  div {
+    display: block;
+    margin: 10px 0;
+  }
+
+  .security-warning {
+    color: var(--primary-text-color);
+    padding: 15px 20px;
+    font-size: 14px;
+    background-color: var(--warning-color--faint);
+    margin: 5px 20px;
+    border-radius: 8px;
+    margin: 20px auto;
+  }
+
+  .backup_codes {
+    margin: 20px;
+    font-weight: bold;
+    padding: 15px 20px;
+    font-size: 14px;
+    background-color: var(--brand-color--faint);
+    border-radius: 8px;
+    margin: 20px;
+    text-align: center;
+    position: relative;
+    min-height: 125px;
+
+    .backup_code {
+      margin: 5px auto;
+    }
+
+    .loading-indicator {
+      position: absolute;
+    }
+  }
+
+  .security-settings-panel__setup-otp__buttons {
+    margin: 20px;
+    display: flex;
+    justify-content: space-between;
+
+    .button {
+      min-width: 182px;
+    }
+  }
+
+  div.confirm-key {
+    display: block;
+    font-size: 16px;
+    line-height: 1.5;
+    color: var(--primary-text-color--faint);
+    font-weight: 400;
+    margin: 0 0 20px 20px;
+  }
+}
+
+form.otp-auth {
+  .error-box {
+    width: 100%;
+    text-align: center;
+    color: $error-red;
+  }
+}
diff --git a/app/styles/components/profile_hover_card.scss b/app/styles/components/profile_hover_card.scss
new file mode 100644
index 0000000000..3293eeb8f8
--- /dev/null
+++ b/app/styles/components/profile_hover_card.scss
@@ -0,0 +1,131 @@
+.display-name__account {
+  position: relative;
+  cursor: pointer;
+}
+
+.display-name .profile-hover-card {
+  white-space: normal;
+}
+
+.profile-hover-card {
+  position: absolute;
+  pointer-events: none;
+  opacity: 0;
+  transition-property: opacity;
+  transition-duration: 0.2s;
+  width: 320px;
+  z-index: 998;
+  left: -10px;
+  padding: 20px;
+  margin-bottom: 10px;
+
+  &--visible {
+    opacity: 1;
+    pointer-events: all;
+  }
+
+  @media(min-width: 750px) {
+    left: -100px;
+  }
+
+  .profile-hover-card__container {
+    @include standard-panel;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .profile-hover-card__action-button {
+    z-index: 999;
+    position: absolute;
+    right: 20px;
+    top: 40px;
+  }
+
+  .user-panel {
+    box-shadow: none;
+    width: auto;
+
+    .user-panel-stats-item a strong {
+      text-decoration: none;
+    }
+
+    &__header {
+      height: 96px;
+    }
+
+    .user-panel-stats-item {
+      margin-right: 10px;
+
+      &__label,
+      &__value {
+        display: inline;
+        font-size: 15px;
+      }
+
+      &__value {
+        margin-right: 5px;
+      }
+    }
+  }
+
+  .relationship-tag {
+    position: absolute;
+    top: 10px;
+    left: 10px;
+    z-index: 1;
+  }
+
+  .profile-hover-card__badges {
+    display: flex;
+    position: absolute;
+    top: 110px;
+    left: 120px;
+
+    .badge {
+      padding: 2px 4px;
+      margin-right: 5px;
+      border-radius: 3px;
+      font-size: 11px;
+      opacity: 1;
+    }
+  }
+
+  .profile-hover-card__bio {
+    margin: 0 20px 20px;
+    max-height: 4em;
+
+    a {
+      color: var(--highlight-text-color);
+    }
+
+    &::after {
+      content: '';
+      display: block;
+      position: absolute;
+      width: 100%;
+      height: 20px;
+      bottom: 0;
+      left: 0;
+      background: linear-gradient(0deg, var(--foreground-color) 0%, var(--foreground-color), 80%, transparent);
+    }
+  }
+}
+
+.detailed-status {
+  .profile-hover-card {
+    top: 0;
+    left: 60px;
+  }
+}
+
+/* Prevent floating avatars from intercepting with current card */
+.status,
+.detailed-status {
+  .floating-link {
+    display: none;
+  }
+
+  &:hover .floating-link {
+    display: block;
+  }
+}
diff --git a/app/styles/components/react-toggle.scss b/app/styles/components/react-toggle.scss
index 699b6e86d3..e2be2ef14b 100644
--- a/app/styles/components/react-toggle.scss
+++ b/app/styles/components/react-toggle.scss
@@ -32,7 +32,7 @@
   height: 24px;
   padding: 0;
   border-radius: 30px;
-  background-color: var(--foreground-color);
+  background-color: hsla(var(--brand-color_h), var(--brand-color_s), var(--brand-color_l), 0.35);
   transition: background-color 0.2s ease;
 }
 
diff --git a/app/styles/components/status.scss b/app/styles/components/status.scss
index 0d349764b8..7885f94c75 100644
--- a/app/styles/components/status.scss
+++ b/app/styles/components/status.scss
@@ -1,3 +1,61 @@
+.status__content {
+  p,
+  li {
+    strong {
+      font-weight: bold;
+    }
+  }
+
+  p,
+  li {
+    em {
+      font-style: italic;
+    }
+  }
+
+  ul,
+  ol,
+  blockquote {
+    margin-bottom: 20px;
+    margin-left: 15px;
+  }
+
+  ul {
+    list-style: disc inside none;
+  }
+
+  ol {
+    list-style: decimal inside none;
+  }
+
+  blockquote p {
+    font-style: italic;
+  }
+
+  code {
+    font-family: 'Roboto Mono', monospace;
+    cursor: text;
+  }
+
+  /* Inline code */
+  p > code {
+    padding: 2px 4px;
+    background-color: var(--background-color);
+    border-radius: 4px;
+  }
+
+  /* Code block */
+  pre {
+    line-height: 1.6em;
+    overflow-x: auto;
+    border-radius: 6px;
+    padding: 8px 12px;
+    margin-bottom: 20px;
+    word-break: break-all;
+    background-color: var(--background-color);
+  }
+}
+
 .status__content--with-action {
   cursor: pointer;
 }
@@ -152,7 +210,6 @@
 .status__info .status__display-name {
   display: block;
   max-width: 100%;
-  padding-right: 25px;
 }
 
 .status__info {
@@ -160,6 +217,16 @@
   z-index: 4;
 }
 
+.status__profile,
+.detailed-status__profile {
+  display: block;
+  max-width: 100%;
+}
+
+.status__profile {
+  padding-right: 25px;
+}
+
 .status-check-box {
   border-bottom: 1px solid var(--background-color);
   display: flex;
diff --git a/app/styles/components/tabs-bar.scss b/app/styles/components/tabs-bar.scss
index 02dac4e2b8..76920534b3 100644
--- a/app/styles/components/tabs-bar.scss
+++ b/app/styles/components/tabs-bar.scss
@@ -255,9 +255,9 @@
     display: block;
     margin-right: 30px;
     border: 0;
-    height: 50px;
+    height: 40px;
     overflow: hidden;
-    padding: 10px 0;
+    padding: 13px 0 0;
     box-sizing: border-box;
     filter: brightness(0%) grayscale(100%) invert(100%);
     & span {display: none !important;}
diff --git a/app/styles/components/theme-toggle.scss b/app/styles/components/theme-toggle.scss
index f1a33e66b9..1f2697b89a 100644
--- a/app/styles/components/theme-toggle.scss
+++ b/app/styles/components/theme-toggle.scss
@@ -2,15 +2,21 @@
   .setting-toggle {
 
     &__label {
-      margin-bottom: 0px;
+      margin-bottom: 0;
       vertical-align: middle;
     }
 
     .react-toggle {
       vertical-align: middle;
 
+      &-track {
+        background-color: var(--foreground-color);
+      }
+
       &-track-check,
       &-track-x {
+        display: flex;
+        align-items: center;
         height: 15px;
         color: #fff;
       }
diff --git a/app/styles/components/user-panel.scss b/app/styles/components/user-panel.scss
index cf49a3d68a..cb44672304 100644
--- a/app/styles/components/user-panel.scss
+++ b/app/styles/components/user-panel.scss
@@ -3,7 +3,23 @@
   display: flex;
   width: 265px;
   flex-direction: column;
-  overflow-y: hidden;
+
+  .user-panel__account__name {
+    display: inline;
+  }
+
+  .verified-icon {
+    opacity: 1;
+  }
+
+  &,
+  .user-panel__account__name,
+  .user-panel__account__username {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    color: var(--primary-text-color--faint);
+  }
 
   &__header {
     display: block;
@@ -42,13 +58,13 @@
   &__meta {
     display: block;
     padding: 6px 20px 17px;
-    opacity: 0.6;
+    // opacity: 0.6;
   }
 
   &__account {
     a {
       text-decoration: none;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
     }
 
     &__name {
@@ -56,7 +72,7 @@
       font-size: 20px;
       font-weight: bold;
       line-height: 24px;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
     }
 
     &:hover & {
@@ -89,7 +105,7 @@
 
     a {
       text-decoration: none;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
 
       &:hover {
         opacity: 0.8;
@@ -99,7 +115,7 @@
     &__value {
       display: block;
       width: 100%;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
       font-size: 20px;
       font-weight: 800;
       line-height: 24px;
diff --git a/app/styles/components/wtf-panel.scss b/app/styles/components/wtf-panel.scss
index 37566af47a..a555e9490f 100644
--- a/app/styles/components/wtf-panel.scss
+++ b/app/styles/components/wtf-panel.scss
@@ -8,6 +8,10 @@
   box-sizing: border-box;
   background: var(--foreground-color);
 
+  &:first-child {
+    margin-top: 0;
+  }
+
   &:not(:last-of-type) {
     margin-bottom: 10px;
   }
diff --git a/app/styles/donations.scss b/app/styles/donations.scss
index b108949c1a..bb4798f1de 100644
--- a/app/styles/donations.scss
+++ b/app/styles/donations.scss
@@ -169,7 +169,7 @@ body.admin {
 }
 
 .funding-panel {
-  margin: 20px 0;
+  margin-top: 15px;
 
   strong {
     font-weight: bold;
diff --git a/app/styles/emoji_picker.scss b/app/styles/emoji_picker.scss
index 12dd4f0848..e282a3c177 100644
--- a/app/styles/emoji_picker.scss
+++ b/app/styles/emoji_picker.scss
@@ -109,6 +109,7 @@
   input {
     font-size: 14px;
     font-weight: 400;
+    color: var(--primary-text-color);
     padding: 7px 9px;
     font-family: inherit;
     display: block;
diff --git a/app/styles/forms.scss b/app/styles/forms.scss
index 11b9b9b98d..92c1c3fe26 100644
--- a/app/styles/forms.scss
+++ b/app/styles/forms.scss
@@ -342,6 +342,15 @@ code {
     }
   }
 
+  input[type=text][disabled],
+  input[type=number][disabled],
+  input[type=email][disabled],
+  input[type=password][disabled],
+  textarea[disabled] {
+    color: var(--primary-text-color--faint);
+    border-color: var(--primary-text-color--faint);
+  }
+
   .input.field_with_errors {
     label {
       color: lighten($error-red, 12%);
diff --git a/app/styles/loading.scss b/app/styles/loading.scss
index 42a3a0c1f4..88705782ee 100644
--- a/app/styles/loading.scss
+++ b/app/styles/loading.scss
@@ -188,6 +188,7 @@
   align-items: center;
   justify-content: center;
   padding: 20px;
+  border-radius: 0 0 10px 10px;
 
   & > div {
     width: 100%;
diff --git a/app/styles/themes.scss b/app/styles/themes.scss
index 1a717e2436..13d952b17a 100644
--- a/app/styles/themes.scss
+++ b/app/styles/themes.scss
@@ -30,12 +30,14 @@ body {
   --accent-color: hsl(var(--accent-color_hsl));
   --primary-text-color: hsl(var(--primary-text-color_hsl));
   --background-color: hsl(var(--background-color_hsl));
+  --warning-color: hsla(var(--warning-color_hsl));
 
   // Meta-variables
   --brand-color_hsl: var(--brand-color_h), var(--brand-color_s), var(--brand-color_l);
   --accent-color_hsl: var(--accent-color_h), var(--accent-color_s), var(--accent-color_l);
   --primary-text-color_hsl: var(--primary-text-color_h), var(--primary-text-color_s), var(--primary-text-color_l);
   --background-color_hsl: var(--background-color_h), var(--background-color_s), var(--background-color_l);
+  --warning-color_hsl: var(--warning-color_h), var(--warning-color_s), var(--warning-color_l);
   --accent-color_h: calc(var(--brand-color_h) - 15);
   --accent-color_s: 86%;
   --accent-color_l: 44%;
@@ -51,6 +53,7 @@ body {
     calc(var(--accent-color_l) + 3%)
   );
   --primary-text-color--faint: hsla(var(--primary-text-color_hsl), 0.6);
+  --warning-color--faint: hsla(var(--warning-color_hsl), 0.5);
 }
 
 body.theme-mode-light {
@@ -69,6 +72,9 @@ body.theme-mode-light {
   --background-color_h: 0;
   --background-color_s: 0%;
   --background-color_l: 94.9%;
+  --warning-color_h: 0;
+  --warning-color_s: 100%;
+  --warning-color_l: 66%;
 
   // Modifiers
   --brand-color--hicontrast: hsl(
@@ -94,6 +100,9 @@ body.theme-mode-dark {
   --background-color_h: 0;
   --background-color_s: 0%;
   --background-color_l: 20%;
+  --warning-color_h: 0;
+  --warning-color_s: 100%;
+  --warning-color_l: 66%;
 
   // Modifiers
   --brand-color--hicontrast: hsl(
diff --git a/app/styles/ui.scss b/app/styles/ui.scss
index 7eab8edb9b..a0ad254bfc 100644
--- a/app/styles/ui.scss
+++ b/app/styles/ui.scss
@@ -654,6 +654,7 @@
 
       &::after {
         bottom: -1px;
+        border-color: transparent transparent var(--foreground-color);
       }
     }
   }
diff --git a/package.json b/package.json
index eaeac44789..e79c4356c4 100644
--- a/package.json
+++ b/package.json
@@ -100,6 +100,7 @@
     "postcss-object-fit-images": "^1.1.2",
     "prop-types": "^15.5.10",
     "punycode": "^2.1.0",
+    "qrcode.react": "^1.0.0",
     "rails-ujs": "^5.2.3",
     "react": "^16.13.1",
     "react-color": "^2.18.1",
diff --git a/yarn.lock b/yarn.lock
index daf4e0faa3..561257434e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9335,6 +9335,20 @@ q@^1.1.2:
   resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
   integrity sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=
 
+qr.js@0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/qr.js/-/qr.js-0.0.0.tgz#cace86386f59a0db8050fa90d9b6b0e88a1e364f"
+  integrity sha1-ys6GOG9ZoNuAUPqQ2baw6IoeNk8=
+
+qrcode.react@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/qrcode.react/-/qrcode.react-1.0.0.tgz#7e8889db3b769e555e8eb463d4c6de221c36d5de"
+  integrity sha512-jBXleohRTwvGBe1ngV+62QvEZ/9IZqQivdwzo9pJM4LQMoCM2VnvNBnKdjvGnKyDZ/l0nCDgsPod19RzlPvm/Q==
+  dependencies:
+    loose-envify "^1.4.0"
+    prop-types "^15.6.0"
+    qr.js "0.0.0"
+
 qs@6.7.0:
   version "6.7.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc"