diff --git a/admin/src/utils/feature_flags.ts b/admin/src/utils/feature_flags.ts
index 7c3a9f68ff..bef862d182 100644
--- a/admin/src/utils/feature_flags.ts
+++ b/admin/src/utils/feature_flags.ts
@@ -6,7 +6,7 @@ export function hasPaidFeature(): boolean {
   // If the user is not a turkey user then no need to check.
   if (configs.ITA_SERVER != "turkey") return true;
 
-  const authorizedTiers: PaidTiers[] = ["p1", "b1"];
+  const authorizedTiers: PaidTiers[] = ["p1", "b1","b0"];
   return authorizedTiers.includes(configs.TIER);
 }
 
diff --git a/src/bit-systems/mixer-animatable.ts b/src/bit-systems/mixer-animatable.ts
index 8609a277a1..48711af0eb 100644
--- a/src/bit-systems/mixer-animatable.ts
+++ b/src/bit-systems/mixer-animatable.ts
@@ -10,7 +10,7 @@ const mixerExitQuery = exitQuery(mixerQuery);
 
 export function mixerAnimatableSystem(world: HubsWorld): void {
   initializeEnterQuery(world).forEach(eid => {
-    if (entityExists(world, eid)) {
+    if (!entityExists(world, eid)) {
       console.warn("Skipping nonexistant entity."); // TODO Why does this happen?
       return;
     }
diff --git a/src/react-components/input/Button.scss b/src/react-components/input/Button.scss
index fa27af3771..e705448554 100644
--- a/src/react-components/input/Button.scss
+++ b/src/react-components/input/Button.scss
@@ -23,32 +23,37 @@
   }
 }
 
+:local(.basic) {
+  border: 2px solid theme.$basic-border-color;
+  background-color: theme.$basic-color;
+}
+
+:local(.transparent) {
+  border-color: theme.$background1-color;
+  background-color: theme.$background1-color;
+}
+
 :local(.basic),
 :local(.transparent) {
-  color: theme.$text4-color;
+  color: theme.$text2-color;
   border: 2px solid theme.$basic-border-color;
   background-color: theme.$basic-color;
 
   svg {
-    color: theme.$text4-color;
+    color: theme.$text2-color;
   }
 
   &:hover {
-    color: theme.$text4-color-hover;
+    color: theme.$text2-color-hover;
     background-color: theme.$basic-color-hover;
   }
 
   &:active {
-    color: theme.$text4-color-pressed;
+    color: theme.$text2-color-pressed;
     background-color: theme.$basic-color-pressed;
   }
 }
 
-:local(.transparent) {
-  border-color: theme.$transparent;
-  background-color: theme.$transparent;
-}
-
 :local(.primary) {
   color: theme.$text5-color;
   background-color: theme.$primary-color;
diff --git a/src/react-components/input/InputField.scss b/src/react-components/input/InputField.scss
index 226bef9bee..972d9ba87c 100644
--- a/src/react-components/input/InputField.scss
+++ b/src/react-components/input/InputField.scss
@@ -27,10 +27,11 @@
 
 :local(.info) {
   margin-top: 8px;
-  color: theme.$text3-color;
+  color: theme.$text2-color;
   align-self: flex-start;
 }
 
-:local(.info), :local(.error) {
+:local(.info),
+:local(.error) {
   font-size: 10px;
 }
diff --git a/src/react-components/input/RadioInput.scss b/src/react-components/input/RadioInput.scss
index 12190d09ab..716da53549 100644
--- a/src/react-components/input/RadioInput.scss
+++ b/src/react-components/input/RadioInput.scss
@@ -30,6 +30,7 @@
   align-self: center;
   position: relative;
   appearance: none;
+  cursor: pointer;
   -moz-appearance: none;
   -webkit-appearance: none;
 
@@ -77,10 +78,12 @@
 :local(.label) {
   font-size: theme.$font-size-sm;
   font-weight: theme.$font-weight-bold;
+  color: theme.$text1-color;
 }
 
 :local(.description) {
   margin-top: 4px;
   font-size: theme.$font-size-xs;
   font-weight: theme.$font-weight-regular;
-}
\ No newline at end of file
+  color: theme.$text2-color;
+}
diff --git a/src/react-components/input/TextInput.scss b/src/react-components/input/TextInput.scss
index b7e5c34929..bef6bcb84b 100644
--- a/src/react-components/input/TextInput.scss
+++ b/src/react-components/input/TextInput.scss
@@ -11,7 +11,7 @@ $input-height: 40px;
   color: theme.$text1-color;
   overflow: hidden;
 
-  &:focus-within  {
+  &:focus-within {
     border-color: theme.$input-outline-color;
     box-shadow: 0 0 0 2px theme.$input-outline-color;
   }
@@ -22,7 +22,8 @@ $input-height: 40px;
   height: 100%;
 }
 
-:local(.before-input), :local(.after-input) {
+:local(.before-input),
+:local(.after-input) {
   display: flex;
   height: $input-height;
   align-items: center;
@@ -35,11 +36,10 @@ $input-height: 40px;
     border-width: 0;
     min-height: auto;
     border: none;
-    
+
     &:hover {
-      border:none;
+      border: none;
     }
-    
 
     :global(.keyboard-user) &:focus {
       border-width: 0;
@@ -50,7 +50,7 @@ $input-height: 40px;
         border-top-left-radius: theme.$border-radius-regular;
         border-bottom-left-radius: theme.$border-radius-regular;
       }
-  
+
       &:last-child {
         margin-left: 1px;
         box-shadow: inset 0 0 0 3px theme.$outline-color, 1px 0 0 2px theme.$outline-color;
@@ -58,13 +58,13 @@ $input-height: 40px;
         border-bottom-right-radius: theme.$border-radius-regular;
       }
     }
-    
   }
 
-  :local(.icon-button), & > svg  {
+  :local(.icon-button),
+  & > svg {
     padding: 0;
     margin-left: 8px;
-    
+
     &:last-child {
       margin-right: 8px;
     }
@@ -92,7 +92,7 @@ $input-height: 40px;
 :local(.invalid) {
   border-color: theme.$error-color !important;
 
-  &:focus-within  {
+  &:focus-within {
     box-shadow: 0 0 0 2px theme.$error-color;
   }
 }
@@ -108,6 +108,10 @@ $input-height: 40px;
   &:focus {
     box-shadow: none;
   }
+
+  &::placeholder {
+    color: theme.$text3-color;
+  }
 }
 
 :local(.invalid-icon) {
diff --git a/src/react-components/input/ToggleInput.scss b/src/react-components/input/ToggleInput.scss
index 38fc75647a..dd5daa297f 100644
--- a/src/react-components/input/ToggleInput.scss
+++ b/src/react-components/input/ToggleInput.scss
@@ -28,7 +28,6 @@
   margin-left: 16px;
   display: flex;
   flex-direction: column;
-  color: theme.$text2-color;
 }
 
 :local(.label) {
diff --git a/src/react-components/input/ToolbarButton.scss b/src/react-components/input/ToolbarButton.scss
index 723867f905..6faf090690 100644
--- a/src/react-components/input/ToolbarButton.scss
+++ b/src/react-components/input/ToolbarButton.scss
@@ -62,14 +62,14 @@
 :local(.transparent) {
   :local(.icon-container) {
     border-color: theme.$toolbar-basic-border-color;
-    background-color: theme.$transparent;
+    background-color: theme.$background1-color;
     svg {
       color: theme.$toolbar-basic-icon-color;
     }
 
     &:disabled,
     &[disabled] {
-      border-color: theme.$transparent;
+      border-color: theme.$background1-color;
       background-color: theme.$disabled-bg-color;
       svg {
         color: theme.$disabled-icon-color;
diff --git a/src/react-components/layout/LoadingScreenLayout.scss b/src/react-components/layout/LoadingScreenLayout.scss
index 97a68881cb..41ce395652 100644
--- a/src/react-components/layout/LoadingScreenLayout.scss
+++ b/src/react-components/layout/LoadingScreenLayout.scss
@@ -12,10 +12,11 @@
   bottom: 0;
   top: 0;
   background: theme.$loading-screen-background;
+  color: theme.$text1-color;
 
   font-size: theme.$font-size-sm;
 
-  @media(min-width: theme.$breakpoint-lg) and (min-height: theme.$breakpoint-vr) {
+  @media (min-width: theme.$breakpoint-lg) and (min-height: theme.$breakpoint-vr) {
     font-size: theme.$font-size-md;
   }
 }
diff --git a/src/react-components/layout/Page.scss b/src/react-components/layout/Page.scss
index d11bafde22..451f81190c 100644
--- a/src/react-components/layout/Page.scss
+++ b/src/react-components/layout/Page.scss
@@ -4,19 +4,24 @@
   box-sizing: border-box;
 }
 
-html, body, :global(#root), :global(#ui-root), :global(.home-root) {
+html,
+body,
+:global(#root),
+:global(#ui-root),
+:global(.home-root) {
   margin: 0;
-  height:100%;
+  height: 100%;
 }
 
 body {
   background: theme.$background1-color;
-  color: theme.$text1-color;
 }
 
-:global(#root), :global(#ui-root), :global(.home-root) {
-  display:flex; 
-  flex-direction:column;
+:global(#root),
+:global(#ui-root),
+:global(.home-root) {
+  display: flex;
+  flex-direction: column;
 }
 
 h1 {
@@ -32,7 +37,7 @@ main {
   order: -1;
   flex: 1;
 
-  @media(min-width: theme.$breakpoint-lg) {
+  @media (min-width: theme.$breakpoint-lg) {
     order: 0;
     display: flex;
     flex-direction: column;
diff --git a/src/react-components/room/ContentMenu.scss b/src/react-components/room/ContentMenu.scss
index 790fd788f9..45ea5b6526 100644
--- a/src/react-components/room/ContentMenu.scss
+++ b/src/react-components/room/ContentMenu.scss
@@ -11,8 +11,9 @@
   border-radius: 12px;
   pointer-events: auto;
   padding: 4px;
+  color: theme.$text1-color;
 
-  @media(min-width: theme.$breakpoint-lg) {
+  @media (min-width: theme.$breakpoint-lg) {
     top: 24px;
     right: 24px;
   }
@@ -76,4 +77,4 @@
 :local(.disabled) {
   pointer-events: none;
   background-color: theme.$transparent;
-}
\ No newline at end of file
+}
diff --git a/src/react-components/room/MicSetupModal.js b/src/react-components/room/MicSetupModal.js
index 406de2e468..b75fd0ee7c 100644
--- a/src/react-components/room/MicSetupModal.js
+++ b/src/react-components/room/MicSetupModal.js
@@ -90,7 +90,11 @@ export function MicSetupModal({
                         checked={isMicrophoneMuted}
                         onChange={onChangeMicrophoneMuted}
                       />
-                      <ToolTip category="primary" description="Toggle mic on/off anytime after you enter the room (M)">
+                      <ToolTip
+                        location="right"
+                        category="primary"
+                        description="Toggle mic on/off anytime after you enter the room (M)"
+                      >
                         <InfoIcon className={styles.infoIcon} />
                       </ToolTip>
                     </>
diff --git a/src/react-components/room/RoomEntryModal.scss b/src/react-components/room/RoomEntryModal.scss
index bb1168ef44..56b7920d68 100644
--- a/src/react-components/room/RoomEntryModal.scss
+++ b/src/react-components/room/RoomEntryModal.scss
@@ -28,13 +28,14 @@
 
   h5 {
     font-size: theme.$font-size-xs;
-    color: theme.$grey;
+    color: theme.$text3-color;
     margin-bottom: 4px;
   }
 
   p {
     font-size: theme.$font-size-sm;
     text-align: center;
+    color: theme.$text1-color;
 
     @media (min-width: theme.$breakpoint-lg) and (min-height: theme.$breakpoint-vr) {
       font-size: 20px;
diff --git a/src/react-components/room/components/ChatToolbarButton/ChatToolbarButton.tsx b/src/react-components/room/components/ChatToolbarButton/ChatToolbarButton.tsx
index 23f5813b50..54b608a575 100644
--- a/src/react-components/room/components/ChatToolbarButton/ChatToolbarButton.tsx
+++ b/src/react-components/room/components/ChatToolbarButton/ChatToolbarButton.tsx
@@ -14,9 +14,10 @@ const chatTooltipDescription = defineMessage({
 
 type ChatToolbarButtonProps = {
   onClick: () => void;
+  selected: boolean
 };
 
-const ChatToolbarButton = ({ onClick }: ChatToolbarButtonProps) => {
+const ChatToolbarButton = ({ onClick, selected }: ChatToolbarButtonProps) => {
   const { unreadMessages } = useContext(ChatContext);
   const intl = useIntl();
   const description = intl.formatMessage(chatTooltipDescription);
@@ -31,6 +32,7 @@ const ChatToolbarButton = ({ onClick }: ChatToolbarButtonProps) => {
         icon={<ChatIcon />}
         preset="accent4"
         label={<FormattedMessage id="chat-toolbar-button" defaultMessage="Chat" />}
+        selected={selected}
       />
     </ToolTip>
   );
diff --git a/src/react-components/styles/global.scss b/src/react-components/styles/global.scss
index 4a0d496dc3..d956d1c1c3 100644
--- a/src/react-components/styles/global.scss
+++ b/src/react-components/styles/global.scss
@@ -74,8 +74,6 @@
   --primary-color-pressed: #{theme.$blue-pressed};
 
   --secondary-color: #{theme.$lightgrey};
-  --secondary-color-hover: #{theme.$lightgrey-hover};
-  --secondary-color-pressed: #{theme.$lightgrey-pressed};
 
   --background1-color: #{theme.$white};
   --background2-color: #{theme.$recessed-bg};
@@ -133,8 +131,6 @@
   --favorite-color: #{theme.$yellow};
 
   --error-color: var(--cancel-color);
-  --error-color-hover: var(--cancel-color-hover);
-  --error-color-pressed: var(--cancel-color-pressed);
 
   --overlay-bg-color: rgba(0, 0, 0, 0.5);
   --overlay-text-color: #{theme.$white};
@@ -149,7 +145,7 @@
   --toolbar-basic-color-pressed: var(--secondary-color-pressed);
   --toolbar-basic-border-color: var(--basic-border-color);
 
-  --tile-text-color: var(--text4-color);
+  --tile-text-color: var(--text2-color);
   --tile-bg-color: var(--secondary-color);
   --tile-bg-color-hover: var(--secondary-color-hover);
   --tile-bg-color-pressed: var(--secondary-color-pressed);
@@ -169,6 +165,7 @@ body {
   height: 100%;
   overflow: auto;
   overscroll-behavior-y: none;
+  color: var(--text1-color);
 }
 
 body[data-theme="light"],
diff --git a/src/react-components/styles/theme.scss b/src/react-components/styles/theme.scss
index df7b50a541..af44a42c06 100644
--- a/src/react-components/styles/theme.scss
+++ b/src/react-components/styles/theme.scss
@@ -1,3 +1,4 @@
+//  Breakpoints
 // default below 576px (Portrait Phones)
 $breakpoint-sm: 576px; // Landscape Phones
 $breakpoint-md: 768px; // Tablets
@@ -6,6 +7,31 @@ $breakpoint-xl: 1200px; // Large Desktops
 $breakpoint-xxl: 1600px; // Extra Large Desktops
 $breakpoint-vr: 600px; // Standalone VR Browsers
 
+// Font styles
+$font-size-xs: 10px;
+$font-size-sm: 12px;
+$font-size-md: 14px;
+$font-size-lg: 20px;
+$font-size-xl: 24px;
+$font-size-2xl: 28px;
+
+$font-weight-regular: 400;
+$font-weight-medium: 500;
+$font-weight-bold: 700;
+
+// Border styles
+$border-radius-regular: 8px;
+$border-radius-small: 6px;
+
+// Spacing
+$spacing-2xs: 4px;
+$spacing-xs: 8px;
+$spacing-sm: 12px;
+$spacing-md: 16px;
+$spacing-lg: 20px;
+$spacing-xl: 24px;
+
+// Utility colors
 $transparent: transparent;
 $transparent-hover: rgba(0, 0, 0, 0.08);
 $transparent-pressed: rgba(0, 0, 0, 0.12);
@@ -67,29 +93,6 @@ $discord-text2-color: #a3a3a3;
 $discord-text3-color: rgb(127, 127, 127);
 $discord-text4-color: rgb(64, 64, 64);
 
-$font-size-xs: 10px;
-$font-size-sm: 12px;
-$font-size-md: 14px;
-$font-size-lg: 20px;
-$font-size-xl: 24px;
-$font-size-2xl: 28px;
-
-$font-weight-regular: 400;
-$font-weight-medium: 500;
-$font-weight-bold: 700;
-
-$border-radius-regular: 8px;
-$border-radius-small: 6px;
-
-$outline-width: 3px;
-
-$spacing-2xs: 4px;
-$spacing-xs: 8px;
-$spacing-sm: 12px;
-$spacing-md: 16px;
-$spacing-lg: 20px;
-$spacing-xl: 24px;
-
 // Theme SCSS Variables:
 // Reference these variables in the Hubs codebase.
 // The CSS variables they reference are defined in ./global.scss such that they are only included on the page once.
@@ -160,8 +163,6 @@ $primary-color-hover: var(--primary-color-hover);
 $primary-color-pressed: var(--primary-color-pressed);
 
 $secondary-color: var(--secondary-color);
-$secondary-color-hover: var(--secondary-color-hover);
-$secondary-color-pressed: var(--secondary-color-pressed);
 
 $background1-color: var(--background1-color);
 $background2-color: var(--background2-color);
@@ -219,8 +220,6 @@ $chat-bubble-bg-color-received: var(--chat-bubble-bg-color-received);
 $favorite-color: var(--favorite-color);
 
 $error-color: var(--error-color);
-$error-color-hover: var(--error-color-hover);
-$error-color-pressed: var(--error-color-pressed);
 
 $overlay-bg-color: var(--overlay-bg-color);
 $overlay-text-color: var(--overlay-text-color);
@@ -245,7 +244,7 @@ $tile-button-bg-color-hover: var(--tile-button-bg-color-hover);
 $tile-button-bg-color-pressed: var(--tile-button-bg-color-pressed);
 $tile-button-border-color: var(--tile-button-border-color);
 
-// Lilypad compatible variables (to eventually replace the above)
+// Mozilla Lilypad compatible variables
 
 /**
   PRIMARY INTERACTION
diff --git a/src/react-components/ui-root.js b/src/react-components/ui-root.js
index 0d01781e96..ddb29d4e65 100644
--- a/src/react-components/ui-root.js
+++ b/src/react-components/ui-root.js
@@ -177,6 +177,7 @@ class UIRoot extends Component {
     enterInVR: false,
     entered: false,
     entering: false,
+    leaving: false,
     dialog: null,
     showShareDialog: false,
     linkCode: null,
@@ -1646,6 +1647,7 @@ class UIRoot extends Component {
                     {!isLockedDownDemo && (
                       <ChatToolbarButton
                         onClick={() => this.toggleSidebar("chat", { chatPrefix: "", chatAutofocus: false })}
+                        selected={this.state.sidebarId === "chat"}
                       />
                     )}
                     {entered && isMobileVR && (
@@ -1674,10 +1676,16 @@ class UIRoot extends Component {
                         icon={<LeaveIcon />}
                         label={<FormattedMessage id="toolbar.leave-room-button" defaultMessage="Leave" />}
                         preset="cancel"
+                        selected={!!this.state.leaving}
                         onClick={() => {
+                          this.setState({ leaving: true });
                           this.showNonHistoriedDialog(LeaveRoomModal, {
                             destinationUrl: "/",
-                            reason: LeaveReason.leaveRoom
+                            reason: LeaveReason.leaveRoom,
+                            onClose: () => {
+                              this.setState({ leaving: false });
+                              this.closeDialog();
+                            }
                           });
                         }}
                       />