diff --git a/native/account/logged-out-modal.react.js b/native/account/logged-out-modal.react.js
--- a/native/account/logged-out-modal.react.js
+++ b/native/account/logged-out-modal.react.js
@@ -125,6 +125,113 @@
   );
 }
 
+const unboundStyles = {
+  animationContainer: {
+    flex: 1,
+  },
+  backButton: {
+    position: 'absolute',
+    top: 13,
+  },
+  button: {
+    borderRadius: 4,
+    marginBottom: 4,
+    marginTop: 4,
+    marginLeft: 4,
+    marginRight: 4,
+    paddingBottom: 14,
+    paddingLeft: 18,
+    paddingRight: 18,
+    paddingTop: 14,
+    flex: 1,
+  },
+  buttonContainer: {
+    bottom: 0,
+    left: 0,
+    marginLeft: 26,
+    marginRight: 26,
+    paddingBottom: 20,
+    position: 'absolute',
+    right: 0,
+  },
+  buttonText: {
+    fontFamily: 'OpenSans-Semibold',
+    fontSize: 17,
+    textAlign: 'center',
+  },
+  classicAuthButton: {
+    backgroundColor: 'purpleButton',
+  },
+  classicAuthButtonText: {
+    color: 'whiteText',
+  },
+  registerButtons: {
+    flexDirection: 'row',
+  },
+  signInButtons: {
+    flexDirection: 'row',
+  },
+  container: {
+    backgroundColor: 'transparent',
+    flex: 1,
+  },
+  header: {
+    color: 'white',
+    fontFamily: Platform.OS === 'ios' ? 'IBMPlexSans' : 'IBMPlexSans-Medium',
+    fontSize: 56,
+    fontWeight: '500',
+    lineHeight: 66,
+    textAlign: 'center',
+  },
+  loadingIndicator: {
+    paddingTop: 15,
+  },
+  modalBackground: {
+    bottom: 0,
+    left: 0,
+    position: 'absolute',
+    right: 0,
+    top: 0,
+  },
+  siweButton: {
+    backgroundColor: 'siweButton',
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'center',
+  },
+  siweButtonText: {
+    color: 'siweButtonText',
+  },
+  siweOr: {
+    flex: 1,
+    flexDirection: 'row',
+    marginBottom: 18,
+    marginTop: 14,
+  },
+  siweOrLeftHR: {
+    borderColor: 'logInSpacer',
+    borderTopWidth: 1,
+    flex: 1,
+    marginRight: 18,
+    marginTop: 10,
+  },
+  siweOrRightHR: {
+    borderColor: 'logInSpacer',
+    borderTopWidth: 1,
+    flex: 1,
+    marginLeft: 18,
+    marginTop: 10,
+  },
+  siweOrText: {
+    color: 'whiteText',
+    fontSize: 17,
+    textAlign: 'center',
+  },
+  siweIcon: {
+    paddingRight: 10,
+  },
+};
+
 type BaseProps = {
   +navigation: RootNavigationProp<'LoggedOutModal'>,
   +route: NavigationRoute<'LoggedOutModal'>,
@@ -690,113 +797,6 @@
   };
 }
 
-const unboundStyles = {
-  animationContainer: {
-    flex: 1,
-  },
-  backButton: {
-    position: 'absolute',
-    top: 13,
-  },
-  button: {
-    borderRadius: 4,
-    marginBottom: 4,
-    marginTop: 4,
-    marginLeft: 4,
-    marginRight: 4,
-    paddingBottom: 14,
-    paddingLeft: 18,
-    paddingRight: 18,
-    paddingTop: 14,
-    flex: 1,
-  },
-  buttonContainer: {
-    bottom: 0,
-    left: 0,
-    marginLeft: 26,
-    marginRight: 26,
-    paddingBottom: 20,
-    position: 'absolute',
-    right: 0,
-  },
-  buttonText: {
-    fontFamily: 'OpenSans-Semibold',
-    fontSize: 17,
-    textAlign: 'center',
-  },
-  classicAuthButton: {
-    backgroundColor: 'purpleButton',
-  },
-  classicAuthButtonText: {
-    color: 'whiteText',
-  },
-  registerButtons: {
-    flexDirection: 'row',
-  },
-  signInButtons: {
-    flexDirection: 'row',
-  },
-  container: {
-    backgroundColor: 'transparent',
-    flex: 1,
-  },
-  header: {
-    color: 'white',
-    fontFamily: Platform.OS === 'ios' ? 'IBMPlexSans' : 'IBMPlexSans-Medium',
-    fontSize: 56,
-    fontWeight: '500',
-    lineHeight: 66,
-    textAlign: 'center',
-  },
-  loadingIndicator: {
-    paddingTop: 15,
-  },
-  modalBackground: {
-    bottom: 0,
-    left: 0,
-    position: 'absolute',
-    right: 0,
-    top: 0,
-  },
-  siweButton: {
-    backgroundColor: 'siweButton',
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'center',
-  },
-  siweButtonText: {
-    color: 'siweButtonText',
-  },
-  siweOr: {
-    flex: 1,
-    flexDirection: 'row',
-    marginBottom: 18,
-    marginTop: 14,
-  },
-  siweOrLeftHR: {
-    borderColor: 'logInSpacer',
-    borderTopWidth: 1,
-    flex: 1,
-    marginRight: 18,
-    marginTop: 10,
-  },
-  siweOrRightHR: {
-    borderColor: 'logInSpacer',
-    borderTopWidth: 1,
-    flex: 1,
-    marginLeft: 18,
-    marginTop: 10,
-  },
-  siweOrText: {
-    color: 'whiteText',
-    fontSize: 17,
-    textAlign: 'center',
-  },
-  siweIcon: {
-    paddingRight: 10,
-  },
-};
-
 const isForegroundSelector = createIsForegroundSelector(
   LoggedOutModalRouteName,
 );
diff --git a/native/calendar/calendar.react.js b/native/calendar/calendar.react.js
--- a/native/calendar/calendar.react.js
+++ b/native/calendar/calendar.react.js
@@ -121,6 +121,42 @@
   +visibleEntries: { +[key: string]: boolean },
 };
 
+const unboundStyles = {
+  container: {
+    backgroundColor: 'listBackground',
+    flex: 1,
+  },
+  flatList: {
+    backgroundColor: 'listBackground',
+    flex: 1,
+  },
+  keyboardAvoidingViewContainer: {
+    position: 'absolute',
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+  },
+  keyboardAvoidingView: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: 0,
+  },
+  sectionHeader: {
+    backgroundColor: 'panelSecondaryForeground',
+    borderBottomWidth: 2,
+    borderColor: 'listBackground',
+    height: 31,
+  },
+  sectionHeaderText: {
+    color: 'listSeparatorLabel',
+    fontWeight: 'bold',
+    padding: 5,
+  },
+  weekendSectionHeader: {},
+};
+
 type BaseProps = {
   +navigation: TabNavigationProp<'Calendar'>,
   +route: NavigationRoute<'Calendar'>,
@@ -1013,42 +1049,6 @@
   };
 }
 
-const unboundStyles = {
-  container: {
-    backgroundColor: 'listBackground',
-    flex: 1,
-  },
-  flatList: {
-    backgroundColor: 'listBackground',
-    flex: 1,
-  },
-  keyboardAvoidingViewContainer: {
-    position: 'absolute',
-    top: 0,
-    bottom: 0,
-    left: 0,
-    right: 0,
-  },
-  keyboardAvoidingView: {
-    position: 'absolute',
-    left: 0,
-    right: 0,
-    bottom: 0,
-  },
-  sectionHeader: {
-    backgroundColor: 'panelSecondaryForeground',
-    borderBottomWidth: 2,
-    borderColor: 'listBackground',
-    height: 31,
-  },
-  sectionHeaderText: {
-    color: 'listSeparatorLabel',
-    fontWeight: 'bold',
-    padding: 5,
-  },
-  weekendSectionHeader: {},
-};
-
 const loadingStatusSelector = createLoadingStatusSelector(
   updateCalendarQueryActionTypes,
 );
diff --git a/native/calendar/entry.react.js b/native/calendar/entry.react.js
--- a/native/calendar/entry.react.js
+++ b/native/calendar/entry.react.js
@@ -104,6 +104,81 @@
   );
 }
 
+const unboundStyles = {
+  actionLinks: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    marginTop: -5,
+  },
+  button: {
+    padding: 5,
+  },
+  buttonContents: {
+    flex: 1,
+    flexDirection: 'row',
+  },
+  container: {
+    backgroundColor: 'listBackground',
+  },
+  entry: {
+    borderRadius: 8,
+    margin: 5,
+    overflow: 'hidden',
+  },
+  leftLinks: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'flex-start',
+    paddingHorizontal: 5,
+  },
+  leftLinksText: {
+    fontSize: 12,
+    fontWeight: 'bold',
+    paddingLeft: 5,
+  },
+  pencilIcon: {
+    lineHeight: 13,
+    paddingTop: 1,
+  },
+  rightLinks: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    paddingHorizontal: 5,
+  },
+  rightLinksText: {
+    fontSize: 12,
+    fontWeight: 'bold',
+  },
+  text: {
+    fontFamily: 'System',
+    fontSize: 16,
+  },
+  textContainer: {
+    position: 'absolute',
+    top: 0,
+    paddingBottom: 6,
+    paddingLeft: 10,
+    paddingRight: 10,
+    paddingTop: 5,
+    transform: (Platform.select({
+      ios: [{ translateY: -1 / 3 }],
+      default: [],
+    }): $ReadOnlyArray<{ +translateY: number }>),
+  },
+  textInput: {
+    fontFamily: 'System',
+    fontSize: 16,
+    left: ((Platform.OS === 'android' ? 9.8 : 10): number),
+    margin: 0,
+    padding: 0,
+    position: 'absolute',
+    right: 10,
+    top: ((Platform.OS === 'android' ? 4.8 : 0.5): number),
+  },
+};
+
 type SharedProps = {
   +navigation: TabNavigationProp<'Calendar'>,
   +entryInfo: EntryInfoWithHeight,
@@ -693,81 +768,6 @@
   };
 }
 
-const unboundStyles = {
-  actionLinks: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    marginTop: -5,
-  },
-  button: {
-    padding: 5,
-  },
-  buttonContents: {
-    flex: 1,
-    flexDirection: 'row',
-  },
-  container: {
-    backgroundColor: 'listBackground',
-  },
-  entry: {
-    borderRadius: 8,
-    margin: 5,
-    overflow: 'hidden',
-  },
-  leftLinks: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'flex-start',
-    paddingHorizontal: 5,
-  },
-  leftLinksText: {
-    fontSize: 12,
-    fontWeight: 'bold',
-    paddingLeft: 5,
-  },
-  pencilIcon: {
-    lineHeight: 13,
-    paddingTop: 1,
-  },
-  rightLinks: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'flex-end',
-    paddingHorizontal: 5,
-  },
-  rightLinksText: {
-    fontSize: 12,
-    fontWeight: 'bold',
-  },
-  text: {
-    fontFamily: 'System',
-    fontSize: 16,
-  },
-  textContainer: {
-    position: 'absolute',
-    top: 0,
-    paddingBottom: 6,
-    paddingLeft: 10,
-    paddingRight: 10,
-    paddingTop: 5,
-    transform: (Platform.select({
-      ios: [{ translateY: -1 / 3 }],
-      default: [],
-    }): $ReadOnlyArray<{ +translateY: number }>),
-  },
-  textInput: {
-    fontFamily: 'System',
-    fontSize: 16,
-    left: ((Platform.OS === 'android' ? 9.8 : 10): number),
-    margin: 0,
-    padding: 0,
-    position: 'absolute',
-    right: 10,
-    top: ((Platform.OS === 'android' ? 4.8 : 0.5): number),
-  },
-};
-
 registerFetchKey(saveEntryActionTypes);
 registerFetchKey(deleteEntryActionTypes);
 const activeThreadPickerSelector = createIsForegroundSelector(
diff --git a/native/calendar/section-footer.react.js b/native/calendar/section-footer.react.js
--- a/native/calendar/section-footer.react.js
+++ b/native/calendar/section-footer.react.js
@@ -7,6 +7,36 @@
 import SWMansionIcon from '../components/swmansion-icon.react.js';
 import { type Colors, useStyles, useColors } from '../themes/colors.js';
 
+const unboundStyles = {
+  actionLinksText: {
+    color: 'listSeparatorLabel',
+    fontWeight: 'bold',
+  },
+  addButton: {
+    backgroundColor: 'panelSecondaryForeground',
+    borderRadius: 5,
+    margin: 5,
+    paddingBottom: 5,
+    paddingLeft: 10,
+    paddingRight: 10,
+    paddingTop: 5,
+  },
+  addButtonContents: {
+    alignItems: 'center',
+    flexDirection: 'row',
+  },
+  addIcon: {
+    color: 'listSeparatorLabel',
+    fontSize: 18,
+    paddingRight: 4,
+  },
+  sectionFooter: {
+    alignItems: 'flex-start',
+    backgroundColor: 'listBackground',
+    height: 40,
+  },
+};
+
 type BaseProps = {
   +dateString: string,
   +onAdd: (dateString: string) => void,
@@ -41,36 +71,6 @@
   };
 }
 
-const unboundStyles = {
-  actionLinksText: {
-    color: 'listSeparatorLabel',
-    fontWeight: 'bold',
-  },
-  addButton: {
-    backgroundColor: 'panelSecondaryForeground',
-    borderRadius: 5,
-    margin: 5,
-    paddingBottom: 5,
-    paddingLeft: 10,
-    paddingRight: 10,
-    paddingTop: 5,
-  },
-  addButtonContents: {
-    alignItems: 'center',
-    flexDirection: 'row',
-  },
-  addIcon: {
-    color: 'listSeparatorLabel',
-    fontSize: 18,
-    paddingRight: 4,
-  },
-  sectionFooter: {
-    alignItems: 'flex-start',
-    backgroundColor: 'listBackground',
-    height: 40,
-  },
-};
-
 const ConnectedSectionFooter: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedSectionFooter(props: BaseProps) {
     const styles = useStyles(unboundStyles);
diff --git a/native/chat/chat-input-bar.react.js b/native/chat/chat-input-bar.react.js
--- a/native/chat/chat-input-bar.react.js
+++ b/native/chat/chat-input-bar.react.js
@@ -157,6 +157,120 @@
   easing: EasingNode.inOut(EasingNode.ease),
 };
 
+const unboundStyles = {
+  cameraIcon: {
+    paddingBottom: Platform.OS === 'android' ? 11 : 8,
+    paddingRight: 5,
+  },
+  cameraRollIcon: {
+    paddingBottom: Platform.OS === 'android' ? 11 : 8,
+    paddingRight: 5,
+  },
+  container: {
+    backgroundColor: 'listBackground',
+    paddingLeft: Platform.OS === 'android' ? 10 : 5,
+  },
+  expandButton: {
+    bottom: 0,
+    position: 'absolute',
+    right: 0,
+  },
+  expandIcon: {
+    paddingBottom: Platform.OS === 'android' ? 13 : 11,
+    paddingRight: 2,
+  },
+  expandoButtons: {
+    alignSelf: 'flex-end',
+  },
+  explanation: {
+    color: 'listBackgroundSecondaryLabel',
+    paddingBottom: 4,
+    paddingTop: 1,
+    textAlign: 'center',
+  },
+  innerExpandoButtons: {
+    alignItems: 'flex-end',
+    alignSelf: 'flex-end',
+    flexDirection: 'row',
+  },
+  inputContainer: {
+    flexDirection: 'row',
+  },
+  joinButton: {
+    borderRadius: 8,
+    flex: 1,
+    justifyContent: 'center',
+    marginHorizontal: 12,
+    marginVertical: 3,
+  },
+  joinButtonContainer: {
+    flexDirection: 'row',
+    height: 48,
+    marginBottom: 8,
+  },
+  editView: {
+    marginLeft: 20,
+    marginRight: 20,
+    padding: 10,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+  },
+  editViewContent: {
+    flex: 1,
+    paddingRight: 6,
+  },
+  exitEditButton: {
+    marginTop: 6,
+  },
+  editingLabel: {
+    paddingBottom: 4,
+  },
+  editingMessagePreview: {
+    color: 'listForegroundLabel',
+  },
+  joinButtonContent: {
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  joinButtonTextLight: {
+    color: 'white',
+    fontSize: 20,
+    marginHorizontal: 4,
+  },
+  joinButtonTextDark: {
+    color: 'black',
+    fontSize: 20,
+    marginHorizontal: 4,
+  },
+  joinThreadLoadingIndicator: {
+    paddingVertical: 2,
+  },
+  sendButton: {
+    position: 'absolute',
+    bottom: 4,
+    left: 0,
+  },
+  sendIcon: {
+    paddingLeft: 9,
+    paddingRight: 8,
+    paddingVertical: 6,
+  },
+  textInput: {
+    backgroundColor: 'listInputBackground',
+    borderRadius: 8,
+    color: 'listForegroundLabel',
+    fontSize: 16,
+    marginLeft: 4,
+    marginRight: 4,
+    marginTop: 6,
+    marginBottom: 8,
+    maxHeight: 110,
+    paddingHorizontal: 10,
+    paddingVertical: 5,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
 };
@@ -1106,120 +1220,6 @@
   };
 }
 
-const unboundStyles = {
-  cameraIcon: {
-    paddingBottom: Platform.OS === 'android' ? 11 : 8,
-    paddingRight: 5,
-  },
-  cameraRollIcon: {
-    paddingBottom: Platform.OS === 'android' ? 11 : 8,
-    paddingRight: 5,
-  },
-  container: {
-    backgroundColor: 'listBackground',
-    paddingLeft: Platform.OS === 'android' ? 10 : 5,
-  },
-  expandButton: {
-    bottom: 0,
-    position: 'absolute',
-    right: 0,
-  },
-  expandIcon: {
-    paddingBottom: Platform.OS === 'android' ? 13 : 11,
-    paddingRight: 2,
-  },
-  expandoButtons: {
-    alignSelf: 'flex-end',
-  },
-  explanation: {
-    color: 'listBackgroundSecondaryLabel',
-    paddingBottom: 4,
-    paddingTop: 1,
-    textAlign: 'center',
-  },
-  innerExpandoButtons: {
-    alignItems: 'flex-end',
-    alignSelf: 'flex-end',
-    flexDirection: 'row',
-  },
-  inputContainer: {
-    flexDirection: 'row',
-  },
-  joinButton: {
-    borderRadius: 8,
-    flex: 1,
-    justifyContent: 'center',
-    marginHorizontal: 12,
-    marginVertical: 3,
-  },
-  joinButtonContainer: {
-    flexDirection: 'row',
-    height: 48,
-    marginBottom: 8,
-  },
-  editView: {
-    marginLeft: 20,
-    marginRight: 20,
-    padding: 10,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-  },
-  editViewContent: {
-    flex: 1,
-    paddingRight: 6,
-  },
-  exitEditButton: {
-    marginTop: 6,
-  },
-  editingLabel: {
-    paddingBottom: 4,
-  },
-  editingMessagePreview: {
-    color: 'listForegroundLabel',
-  },
-  joinButtonContent: {
-    flexDirection: 'row',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  joinButtonTextLight: {
-    color: 'white',
-    fontSize: 20,
-    marginHorizontal: 4,
-  },
-  joinButtonTextDark: {
-    color: 'black',
-    fontSize: 20,
-    marginHorizontal: 4,
-  },
-  joinThreadLoadingIndicator: {
-    paddingVertical: 2,
-  },
-  sendButton: {
-    position: 'absolute',
-    bottom: 4,
-    left: 0,
-  },
-  sendIcon: {
-    paddingLeft: 9,
-    paddingRight: 8,
-    paddingVertical: 6,
-  },
-  textInput: {
-    backgroundColor: 'listInputBackground',
-    borderRadius: 8,
-    color: 'listForegroundLabel',
-    fontSize: 16,
-    marginLeft: 4,
-    marginRight: 4,
-    marginTop: 6,
-    marginBottom: 8,
-    maxHeight: 110,
-    paddingHorizontal: 10,
-    paddingVertical: 5,
-  },
-};
-
 const joinThreadLoadingStatusSelector = createLoadingStatusSelector(
   joinThreadActionTypes,
 );
diff --git a/native/chat/failed-send.react.js b/native/chat/failed-send.react.js
--- a/native/chat/failed-send.react.js
+++ b/native/chat/failed-send.react.js
@@ -21,6 +21,23 @@
 
 const failedSendHeight = 22;
 
+const unboundStyles = {
+  deliveryFailed: {
+    color: 'listSeparatorLabel',
+    paddingHorizontal: 3,
+  },
+  failedSendInfo: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    marginRight: 20,
+    paddingTop: 5,
+  },
+  retrySend: {
+    paddingHorizontal: 3,
+  },
+};
+
 type BaseProps = {
   +item: ChatMessageInfoItemWithHeight,
 };
@@ -133,23 +150,6 @@
   };
 }
 
-const unboundStyles = {
-  deliveryFailed: {
-    color: 'listSeparatorLabel',
-    paddingHorizontal: 3,
-  },
-  failedSendInfo: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'flex-end',
-    marginRight: 20,
-    paddingTop: 5,
-  },
-  retrySend: {
-    paddingHorizontal: 3,
-  },
-};
-
 const ConnectedFailedSend: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedFailedSend(props: BaseProps) {
     const id = messageID(props.item.messageInfo);
diff --git a/native/chat/message-list-container.react.js b/native/chat/message-list-container.react.js
--- a/native/chat/message-list-container.react.js
+++ b/native/chat/message-list-container.react.js
@@ -50,6 +50,32 @@
 import { type Colors, useColors, useStyles } from '../themes/colors.js';
 import type { ChatMessageItemWithHeight } from '../types/chat-types.js';
 
+const unboundStyles = {
+  pinnedCountBanner: {
+    backgroundColor: 'panelForeground',
+    height: 30,
+    flexDirection: 'row',
+    textAlign: 'center',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  pinnedCountText: {
+    color: 'panelBackgroundLabel',
+    marginRight: 5,
+  },
+  container: {
+    backgroundColor: 'listBackground',
+    flex: 1,
+  },
+  threadContent: {
+    flex: 1,
+  },
+  hiddenThreadContent: {
+    height: 0,
+    opacity: 0,
+  },
+};
+
 type BaseProps = {
   +navigation: ChatNavigationProp<'MessageList'>,
   +route: NavigationRoute<'MessageList'>,
@@ -214,32 +240,6 @@
   };
 }
 
-const unboundStyles = {
-  pinnedCountBanner: {
-    backgroundColor: 'panelForeground',
-    height: 30,
-    flexDirection: 'row',
-    textAlign: 'center',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  pinnedCountText: {
-    color: 'panelBackgroundLabel',
-    marginRight: 5,
-  },
-  container: {
-    backgroundColor: 'listBackground',
-    flex: 1,
-  },
-  threadContent: {
-    flex: 1,
-  },
-  hiddenThreadContent: {
-    height: 0,
-    opacity: 0,
-  },
-};
-
 const ConnectedMessageListContainer: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedMessageListContainer(
     props: BaseProps,
diff --git a/native/chat/message-list-header-title.react.js b/native/chat/message-list-header-title.react.js
--- a/native/chat/message-list-header-title.react.js
+++ b/native/chat/message-list-header-title.react.js
@@ -16,6 +16,20 @@
 import { ThreadSettingsRouteName } from '../navigation/route-names.js';
 import { useStyles } from '../themes/colors.js';
 
+const unboundStyles = {
+  avatarContainer: {
+    marginRight: 8,
+  },
+  button: {
+    flex: 1,
+  },
+  container: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +navigate: $PropertyType<ChatNavigationProp<'MessageList'>, 'navigate'>,
@@ -74,20 +88,6 @@
   };
 }
 
-const unboundStyles = {
-  avatarContainer: {
-    marginRight: 8,
-  },
-  button: {
-    flex: 1,
-  },
-  container: {
-    flex: 1,
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-};
-
 const ConnectedMessageListHeaderTitle: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedMessageListHeaderTitle(
     props: BaseProps,
diff --git a/native/chat/message-list.react.js b/native/chat/message-list.react.js
--- a/native/chat/message-list.react.js
+++ b/native/chat/message-list.react.js
@@ -55,6 +55,19 @@
 import type { VerticalBounds } from '../types/layout-types.js';
 import type { ViewableItemsChange } from '../types/react-native.js';
 
+const unboundStyles = {
+  container: {
+    backgroundColor: 'listBackground',
+    flex: 1,
+  },
+  header: {
+    height: 12,
+  },
+  listLoadingIndicator: {
+    flex: 1,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +messageListData: $ReadOnlyArray<ChatMessageItemWithHeight>,
@@ -311,19 +324,6 @@
   };
 }
 
-const unboundStyles = {
-  container: {
-    backgroundColor: 'listBackground',
-    flex: 1,
-  },
-  header: {
-    height: 12,
-  },
-  listLoadingIndicator: {
-    flex: 1,
-  },
-};
-
 registerFetchKey(fetchMessagesBeforeCursorActionTypes);
 registerFetchKey(fetchMostRecentMessagesActionTypes);
 
diff --git a/native/chat/settings/color-selector-modal.react.js b/native/chat/settings/color-selector-modal.react.js
--- a/native/chat/settings/color-selector-modal.react.js
+++ b/native/chat/settings/color-selector-modal.react.js
@@ -32,6 +32,36 @@
   +setColor: (color: string) => void,
 };
 
+const unboundStyles = {
+  closeButton: {
+    borderRadius: 3,
+    height: 18,
+    position: 'absolute',
+    right: 5,
+    top: 5,
+    width: 18,
+  },
+  closeButtonIcon: {
+    color: 'modalBackgroundSecondaryLabel',
+    left: 3,
+    position: 'absolute',
+  },
+  colorSelector: {
+    bottom: 10,
+    left: 10,
+    position: 'absolute',
+    right: 10,
+    top: 10,
+  },
+  colorSelectorContainer: {
+    backgroundColor: 'modalBackground',
+    borderRadius: 5,
+    flex: 0,
+    marginHorizontal: 15,
+    marginVertical: 20,
+  },
+};
+
 type BaseProps = {
   +navigation: RootNavigationProp<'ColorSelectorModal'>,
   +route: NavigationRoute<'ColorSelectorModal'>,
@@ -137,36 +167,6 @@
   );
 }
 
-const unboundStyles = {
-  closeButton: {
-    borderRadius: 3,
-    height: 18,
-    position: 'absolute',
-    right: 5,
-    top: 5,
-    width: 18,
-  },
-  closeButtonIcon: {
-    color: 'modalBackgroundSecondaryLabel',
-    left: 3,
-    position: 'absolute',
-  },
-  colorSelector: {
-    bottom: 10,
-    left: 10,
-    position: 'absolute',
-    right: 10,
-    top: 10,
-  },
-  colorSelectorContainer: {
-    backgroundColor: 'modalBackground',
-    borderRadius: 5,
-    flex: 0,
-    marginHorizontal: 15,
-    marginVertical: 20,
-  },
-};
-
 const ConnectedColorSelectorModal: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedColorSelectorModal(props: BaseProps) {
     const styles = useStyles(unboundStyles);
diff --git a/native/chat/settings/compose-subchannel-modal.react.js b/native/chat/settings/compose-subchannel-modal.react.js
--- a/native/chat/settings/compose-subchannel-modal.react.js
+++ b/native/chat/settings/compose-subchannel-modal.react.js
@@ -22,6 +22,43 @@
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
 };
 
+const unboundStyles = {
+  forwardIcon: {
+    color: 'modalForegroundSecondaryLabel',
+    paddingLeft: 10,
+  },
+  modal: {
+    flex: 0,
+  },
+  option: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    paddingHorizontal: 10,
+    paddingVertical: 20,
+  },
+  optionExplanation: {
+    color: 'modalBackgroundLabel',
+    flex: 1,
+    fontSize: 14,
+    paddingLeft: 20,
+    textAlign: 'center',
+  },
+  optionText: {
+    color: 'modalBackgroundLabel',
+    fontSize: 20,
+    paddingLeft: 5,
+  },
+  visibility: {
+    color: 'modalBackgroundLabel',
+    fontSize: 24,
+    textAlign: 'center',
+  },
+  visibilityIcon: {
+    color: 'modalBackgroundLabel',
+    paddingRight: 3,
+  },
+};
+
 type BaseProps = {
   +navigation: RootNavigationProp<'ComposeSubchannelModal'>,
   +route: NavigationRoute<'ComposeSubchannelModal'>,
@@ -101,43 +138,6 @@
   };
 }
 
-const unboundStyles = {
-  forwardIcon: {
-    color: 'modalForegroundSecondaryLabel',
-    paddingLeft: 10,
-  },
-  modal: {
-    flex: 0,
-  },
-  option: {
-    alignItems: 'center',
-    flexDirection: 'row',
-    paddingHorizontal: 10,
-    paddingVertical: 20,
-  },
-  optionExplanation: {
-    color: 'modalBackgroundLabel',
-    flex: 1,
-    fontSize: 14,
-    paddingLeft: 20,
-    textAlign: 'center',
-  },
-  optionText: {
-    color: 'modalBackgroundLabel',
-    fontSize: 20,
-    paddingLeft: 5,
-  },
-  visibility: {
-    color: 'modalBackgroundLabel',
-    fontSize: 24,
-    textAlign: 'center',
-  },
-  visibilityIcon: {
-    color: 'modalBackgroundLabel',
-    paddingRight: 3,
-  },
-};
-
 const ConnectedComposeSubchannelModal: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedComposeSubchannelModal(
     props: BaseProps,
diff --git a/native/chat/settings/delete-thread.react.js b/native/chat/settings/delete-thread.react.js
--- a/native/chat/settings/delete-thread.react.js
+++ b/native/chat/settings/delete-thread.react.js
@@ -56,6 +56,61 @@
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
 };
 
+const unboundStyles = {
+  deleteButton: {
+    backgroundColor: 'vibrantRedButton',
+    borderRadius: 5,
+    flex: 1,
+    marginHorizontal: 24,
+    marginVertical: 12,
+    padding: 12,
+  },
+  deleteText: {
+    color: 'white',
+    fontSize: 18,
+    textAlign: 'center',
+  },
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+  input: {
+    color: 'panelForegroundLabel',
+    flex: 1,
+    fontFamily: 'Arial',
+    fontSize: 16,
+    paddingVertical: 0,
+    borderBottomColor: 'transparent',
+  },
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  section: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    marginBottom: 24,
+    paddingHorizontal: 24,
+    paddingVertical: 12,
+  },
+  warningText: {
+    color: 'panelForegroundLabel',
+    fontSize: 16,
+    marginBottom: 24,
+    marginHorizontal: 24,
+    textAlign: 'center',
+  },
+};
+
 type BaseProps = {
   +navigation: ChatNavigationProp<'DeleteThread'>,
   +route: NavigationRoute<'DeleteThread'>,
@@ -192,61 +247,6 @@
   }
 }
 
-const unboundStyles = {
-  deleteButton: {
-    backgroundColor: 'vibrantRedButton',
-    borderRadius: 5,
-    flex: 1,
-    marginHorizontal: 24,
-    marginVertical: 12,
-    padding: 12,
-  },
-  deleteText: {
-    color: 'white',
-    fontSize: 18,
-    textAlign: 'center',
-  },
-  header: {
-    color: 'panelBackgroundLabel',
-    fontSize: 12,
-    fontWeight: '400',
-    paddingBottom: 3,
-    paddingHorizontal: 24,
-  },
-  input: {
-    color: 'panelForegroundLabel',
-    flex: 1,
-    fontFamily: 'Arial',
-    fontSize: 16,
-    paddingVertical: 0,
-    borderBottomColor: 'transparent',
-  },
-  scrollView: {
-    backgroundColor: 'panelBackground',
-  },
-  scrollViewContentContainer: {
-    paddingTop: 24,
-  },
-  section: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    marginBottom: 24,
-    paddingHorizontal: 24,
-    paddingVertical: 12,
-  },
-  warningText: {
-    color: 'panelForegroundLabel',
-    fontSize: 16,
-    marginBottom: 24,
-    marginHorizontal: 24,
-    textAlign: 'center',
-  },
-};
-
 const loadingStatusSelector = createLoadingStatusSelector(
   deleteThreadActionTypes,
 );
diff --git a/native/chat/settings/thread-settings-color.react.js b/native/chat/settings/thread-settings-color.react.js
--- a/native/chat/settings/thread-settings-color.react.js
+++ b/native/chat/settings/thread-settings-color.react.js
@@ -16,6 +16,28 @@
 import { useSelector } from '../../redux/redux-utils.js';
 import { type Colors, useColors, useStyles } from '../../themes/colors.js';
 
+const unboundStyles = {
+  colorLine: {
+    lineHeight: Platform.select({ android: 22, default: 25 }),
+  },
+  colorRow: {
+    backgroundColor: 'panelForeground',
+    flexDirection: 'row',
+    paddingBottom: 8,
+    paddingHorizontal: 24,
+    paddingTop: 4,
+  },
+  currentValue: {
+    flex: 1,
+    paddingLeft: 4,
+  },
+  label: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+    width: 96,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +colorEditValue: string,
@@ -78,28 +100,6 @@
   };
 }
 
-const unboundStyles = {
-  colorLine: {
-    lineHeight: Platform.select({ android: 22, default: 25 }),
-  },
-  colorRow: {
-    backgroundColor: 'panelForeground',
-    flexDirection: 'row',
-    paddingBottom: 8,
-    paddingHorizontal: 24,
-    paddingTop: 4,
-  },
-  currentValue: {
-    flex: 1,
-    paddingLeft: 4,
-  },
-  label: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-    width: 96,
-  },
-};
-
 const ConnectedThreadSettingsColor: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsColor(
     props: BaseProps,
diff --git a/native/chat/settings/thread-settings-description.react.js b/native/chat/settings/thread-settings-description.react.js
--- a/native/chat/settings/thread-settings-description.react.js
+++ b/native/chat/settings/thread-settings-description.react.js
@@ -45,6 +45,48 @@
 } from '../../types/react-native.js';
 import Alert from '../../utils/alert.js';
 
+const unboundStyles = {
+  addDescriptionButton: {
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+  },
+  addDescriptionText: {
+    color: 'panelForegroundTertiaryLabel',
+    flex: 1,
+    fontSize: 16,
+  },
+  editIcon: {
+    color: 'panelForegroundTertiaryLabel',
+    paddingLeft: 10,
+    textAlign: 'right',
+  },
+  outlineCategory: {
+    backgroundColor: 'panelForeground',
+    borderColor: 'panelForegroundBorder',
+    borderRadius: 1,
+    borderStyle: 'dashed',
+    borderWidth: 1,
+    marginLeft: -1,
+    marginRight: -1,
+  },
+  row: {
+    backgroundColor: 'panelForeground',
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 4,
+  },
+  text: {
+    color: 'panelForegroundSecondaryLabel',
+    flex: 1,
+    fontFamily: 'Arial',
+    fontSize: 16,
+    margin: 0,
+    padding: 0,
+    borderBottomColor: 'transparent',
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +descriptionEditValue: ?string,
@@ -250,48 +292,6 @@
   };
 }
 
-const unboundStyles = {
-  addDescriptionButton: {
-    flexDirection: 'row',
-    paddingHorizontal: 24,
-    paddingVertical: 10,
-  },
-  addDescriptionText: {
-    color: 'panelForegroundTertiaryLabel',
-    flex: 1,
-    fontSize: 16,
-  },
-  editIcon: {
-    color: 'panelForegroundTertiaryLabel',
-    paddingLeft: 10,
-    textAlign: 'right',
-  },
-  outlineCategory: {
-    backgroundColor: 'panelForeground',
-    borderColor: 'panelForegroundBorder',
-    borderRadius: 1,
-    borderStyle: 'dashed',
-    borderWidth: 1,
-    marginLeft: -1,
-    marginRight: -1,
-  },
-  row: {
-    backgroundColor: 'panelForeground',
-    flexDirection: 'row',
-    paddingHorizontal: 24,
-    paddingVertical: 4,
-  },
-  text: {
-    color: 'panelForegroundSecondaryLabel',
-    flex: 1,
-    fontFamily: 'Arial',
-    fontSize: 16,
-    margin: 0,
-    padding: 0,
-    borderBottomColor: 'transparent',
-  },
-};
-
 const ConnectedThreadSettingsDescription: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsDescription(
     props: BaseProps,
diff --git a/native/chat/settings/thread-settings-home-notifs.react.js b/native/chat/settings/thread-settings-home-notifs.react.js
--- a/native/chat/settings/thread-settings-home-notifs.react.js
+++ b/native/chat/settings/thread-settings-home-notifs.react.js
@@ -19,6 +19,28 @@
 import SingleLine from '../../components/single-line.react.js';
 import { useStyles } from '../../themes/colors.js';
 
+const unboundStyles = {
+  currentValue: {
+    alignItems: 'flex-end',
+    margin: 0,
+    paddingLeft: 4,
+    paddingRight: 0,
+    paddingVertical: 0,
+  },
+  label: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+    flex: 1,
+  },
+  row: {
+    alignItems: 'center',
+    backgroundColor: 'panelForeground',
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 3,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
 };
@@ -75,28 +97,6 @@
   };
 }
 
-const unboundStyles = {
-  currentValue: {
-    alignItems: 'flex-end',
-    margin: 0,
-    paddingLeft: 4,
-    paddingRight: 0,
-    paddingVertical: 0,
-  },
-  label: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-    flex: 1,
-  },
-  row: {
-    alignItems: 'center',
-    backgroundColor: 'panelForeground',
-    flexDirection: 'row',
-    paddingHorizontal: 24,
-    paddingVertical: 3,
-  },
-};
-
 const ConnectedThreadSettingsHomeNotifs: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsHomeNotifs(
     props: BaseProps,
diff --git a/native/chat/settings/thread-settings-leave-thread.react.js b/native/chat/settings/thread-settings-leave-thread.react.js
--- a/native/chat/settings/thread-settings-leave-thread.react.js
+++ b/native/chat/settings/thread-settings-leave-thread.react.js
@@ -31,6 +31,23 @@
 import type { ViewStyle } from '../../types/styles.js';
 import Alert from '../../utils/alert.js';
 
+const unboundStyles = {
+  button: {
+    flexDirection: 'row',
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+  },
+  container: {
+    backgroundColor: 'panelForeground',
+    paddingHorizontal: 12,
+  },
+  text: {
+    color: 'redText',
+    flex: 1,
+    fontSize: 16,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +buttonStyle: ViewStyle,
@@ -132,23 +149,6 @@
   }
 }
 
-const unboundStyles = {
-  button: {
-    flexDirection: 'row',
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-  },
-  container: {
-    backgroundColor: 'panelForeground',
-    paddingHorizontal: 12,
-  },
-  text: {
-    color: 'redText',
-    flex: 1,
-    fontSize: 16,
-  },
-};
-
 const ConnectedThreadSettingsLeaveThread: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsLeaveThread(
     props: BaseProps,
diff --git a/native/chat/settings/thread-settings-list-action.react.js b/native/chat/settings/thread-settings-list-action.react.js
--- a/native/chat/settings/thread-settings-list-action.react.js
+++ b/native/chat/settings/thread-settings-list-action.react.js
@@ -9,6 +9,56 @@
 import { useStyles } from '../../themes/colors.js';
 import type { ViewStyle, TextStyle } from '../../types/styles.js';
 
+const unboundStyles = {
+  addSubchannelButton: {
+    paddingTop: Platform.OS === 'ios' ? 4 : 1,
+  },
+  addIcon: {
+    color: 'link',
+  },
+  addItemRow: {
+    backgroundColor: 'panelForeground',
+    paddingHorizontal: 12,
+  },
+  addMemberButton: {
+    paddingTop: Platform.OS === 'ios' ? 4 : 1,
+  },
+  container: {
+    flex: 1,
+    flexDirection: 'row',
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    justifyContent: 'center',
+  },
+  icon: {
+    lineHeight: 20,
+  },
+  seeMoreButton: {
+    paddingBottom: Platform.OS === 'ios' ? 4 : 2,
+    paddingTop: Platform.OS === 'ios' ? 2 : 0,
+  },
+  seeMoreContents: {
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+  },
+  seeMoreIcon: {
+    color: 'link',
+    position: 'absolute',
+    right: 10,
+    top: Platform.OS === 'android' ? 12 : 10,
+  },
+  seeMoreRow: {
+    backgroundColor: 'panelForeground',
+    paddingHorizontal: 12,
+  },
+  text: {
+    color: 'link',
+    flex: 1,
+    fontSize: 16,
+    fontStyle: 'italic',
+  },
+};
+
 type ListActionProps = {
   +onPress: () => void,
   +text: string,
@@ -95,56 +145,6 @@
   );
 }
 
-const unboundStyles = {
-  addSubchannelButton: {
-    paddingTop: Platform.OS === 'ios' ? 4 : 1,
-  },
-  addIcon: {
-    color: 'link',
-  },
-  addItemRow: {
-    backgroundColor: 'panelForeground',
-    paddingHorizontal: 12,
-  },
-  addMemberButton: {
-    paddingTop: Platform.OS === 'ios' ? 4 : 1,
-  },
-  container: {
-    flex: 1,
-    flexDirection: 'row',
-    paddingHorizontal: 12,
-    paddingVertical: 8,
-    justifyContent: 'center',
-  },
-  icon: {
-    lineHeight: 20,
-  },
-  seeMoreButton: {
-    paddingBottom: Platform.OS === 'ios' ? 4 : 2,
-    paddingTop: Platform.OS === 'ios' ? 2 : 0,
-  },
-  seeMoreContents: {
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-  },
-  seeMoreIcon: {
-    color: 'link',
-    position: 'absolute',
-    right: 10,
-    top: Platform.OS === 'android' ? 12 : 10,
-  },
-  seeMoreRow: {
-    backgroundColor: 'panelForeground',
-    paddingHorizontal: 12,
-  },
-  text: {
-    color: 'link',
-    flex: 1,
-    fontSize: 16,
-    fontStyle: 'italic',
-  },
-};
-
 export {
   ThreadSettingsSeeMore,
   ThreadSettingsAddMember,
diff --git a/native/chat/settings/thread-settings-member.react.js b/native/chat/settings/thread-settings-member.react.js
--- a/native/chat/settings/thread-settings-member.react.js
+++ b/native/chat/settings/thread-settings-member.react.js
@@ -47,6 +47,51 @@
 import type { VerticalBounds } from '../../types/layout-types.js';
 import { useNavigateToUserProfileBottomSheet } from '../../user-profile/user-profile-utils.js';
 
+const unboundStyles = {
+  container: {
+    backgroundColor: 'panelForeground',
+    flex: 1,
+    paddingHorizontal: 24,
+    paddingVertical: 8,
+  },
+  editButton: {
+    paddingLeft: 10,
+  },
+  topBorder: {
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+  },
+  lastContainer: {
+    paddingBottom: Platform.OS === 'ios' ? 12 : 10,
+  },
+  role: {
+    color: 'panelForegroundTertiaryLabel',
+    flex: 1,
+    fontSize: 14,
+    paddingTop: 4,
+  },
+  row: {
+    flex: 1,
+    flexDirection: 'row',
+  },
+  userInfoContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  username: {
+    color: 'panelForegroundSecondaryLabel',
+    flex: 1,
+    fontSize: 16,
+    lineHeight: 20,
+    marginLeft: 8,
+  },
+  anonymous: {
+    color: 'panelForegroundTertiaryLabel',
+    fontStyle: 'italic',
+  },
+};
+
 type BaseProps = {
   +memberInfo: RelativeMemberInfo | MinimallyEncodedRelativeMemberInfo,
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
@@ -209,51 +254,6 @@
   };
 }
 
-const unboundStyles = {
-  container: {
-    backgroundColor: 'panelForeground',
-    flex: 1,
-    paddingHorizontal: 24,
-    paddingVertical: 8,
-  },
-  editButton: {
-    paddingLeft: 10,
-  },
-  topBorder: {
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-  },
-  lastContainer: {
-    paddingBottom: Platform.OS === 'ios' ? 12 : 10,
-  },
-  role: {
-    color: 'panelForegroundTertiaryLabel',
-    flex: 1,
-    fontSize: 14,
-    paddingTop: 4,
-  },
-  row: {
-    flex: 1,
-    flexDirection: 'row',
-  },
-  userInfoContainer: {
-    flex: 1,
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  username: {
-    color: 'panelForegroundSecondaryLabel',
-    flex: 1,
-    fontSize: 16,
-    lineHeight: 20,
-    marginLeft: 8,
-  },
-  anonymous: {
-    color: 'panelForegroundTertiaryLabel',
-    fontStyle: 'italic',
-  },
-};
-
 const ConnectedThreadSettingsMember: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsMember(
     props: BaseProps,
diff --git a/native/chat/settings/thread-settings-name.react.js b/native/chat/settings/thread-settings-name.react.js
--- a/native/chat/settings/thread-settings-name.react.js
+++ b/native/chat/settings/thread-settings-name.react.js
@@ -36,6 +36,31 @@
 import { type Colors, useStyles, useColors } from '../../themes/colors.js';
 import Alert from '../../utils/alert.js';
 
+const unboundStyles = {
+  currentValue: {
+    color: 'panelForegroundSecondaryLabel',
+    flex: 1,
+    fontFamily: 'Arial',
+    fontSize: 16,
+    margin: 0,
+    paddingLeft: 4,
+    paddingRight: 0,
+    paddingVertical: 0,
+    borderBottomColor: 'transparent',
+  },
+  label: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+    width: 96,
+  },
+  row: {
+    backgroundColor: 'panelForeground',
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 8,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ResolvedThreadInfo | MinimallyEncodedResolvedThreadInfo,
   +nameEditValue: ?string,
@@ -191,31 +216,6 @@
   };
 }
 
-const unboundStyles = {
-  currentValue: {
-    color: 'panelForegroundSecondaryLabel',
-    flex: 1,
-    fontFamily: 'Arial',
-    fontSize: 16,
-    margin: 0,
-    paddingLeft: 4,
-    paddingRight: 0,
-    paddingVertical: 0,
-    borderBottomColor: 'transparent',
-  },
-  label: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-    width: 96,
-  },
-  row: {
-    backgroundColor: 'panelForeground',
-    flexDirection: 'row',
-    paddingHorizontal: 24,
-    paddingVertical: 8,
-  },
-};
-
 const ConnectedThreadSettingsName: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsName(props: BaseProps) {
     const styles = useStyles(unboundStyles);
diff --git a/native/chat/settings/thread-settings-promote-sidebar.react.js b/native/chat/settings/thread-settings-promote-sidebar.react.js
--- a/native/chat/settings/thread-settings-promote-sidebar.react.js
+++ b/native/chat/settings/thread-settings-promote-sidebar.react.js
@@ -13,6 +13,23 @@
 import type { ViewStyle } from '../../types/styles.js';
 import Alert from '../../utils/alert.js';
 
+const unboundStyles = {
+  button: {
+    flexDirection: 'row',
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+  },
+  container: {
+    backgroundColor: 'panelForeground',
+    paddingHorizontal: 12,
+  },
+  text: {
+    color: 'panelForegroundSecondaryLabel',
+    flex: 1,
+    fontSize: 16,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +buttonStyle: ViewStyle,
@@ -66,23 +83,6 @@
   }
 }
 
-const unboundStyles = {
-  button: {
-    flexDirection: 'row',
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-  },
-  container: {
-    backgroundColor: 'panelForeground',
-    paddingHorizontal: 12,
-  },
-  text: {
-    color: 'panelForegroundSecondaryLabel',
-    flex: 1,
-    fontSize: 16,
-  },
-};
-
 const onError = () => {
   Alert.alert('Unknown error', 'Uhh... try again?', undefined, {
     cancelable: true,
diff --git a/native/chat/settings/thread-settings-push-notifs.react.js b/native/chat/settings/thread-settings-push-notifs.react.js
--- a/native/chat/settings/thread-settings-push-notifs.react.js
+++ b/native/chat/settings/thread-settings-push-notifs.react.js
@@ -28,6 +28,31 @@
 import { useStyles } from '../../themes/colors.js';
 import Alert from '../../utils/alert.js';
 
+const unboundStyles = {
+  currentValue: {
+    alignItems: 'flex-end',
+    margin: 0,
+    paddingLeft: 4,
+    paddingRight: 0,
+    paddingVertical: 0,
+  },
+  label: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+    flex: 1,
+  },
+  row: {
+    alignItems: 'center',
+    backgroundColor: 'panelForeground',
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 3,
+  },
+  infoIcon: {
+    paddingRight: 20,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
 };
@@ -147,31 +172,6 @@
   };
 }
 
-const unboundStyles = {
-  currentValue: {
-    alignItems: 'flex-end',
-    margin: 0,
-    paddingLeft: 4,
-    paddingRight: 0,
-    paddingVertical: 0,
-  },
-  label: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-    flex: 1,
-  },
-  row: {
-    alignItems: 'center',
-    backgroundColor: 'panelForeground',
-    flexDirection: 'row',
-    paddingHorizontal: 24,
-    paddingVertical: 3,
-  },
-  infoIcon: {
-    paddingRight: 20,
-  },
-};
-
 const ConnectedThreadSettingsPushNotifs: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsPushNotifs(
     props: BaseProps,
diff --git a/native/chat/settings/thread-settings.react.js b/native/chat/settings/thread-settings.react.js
--- a/native/chat/settings/thread-settings.react.js
+++ b/native/chat/settings/thread-settings.react.js
@@ -246,6 +246,23 @@
       +relationshipButton: RelationshipButton,
     };
 
+const unboundStyles = {
+  container: {
+    backgroundColor: 'panelBackground',
+    flex: 1,
+  },
+  flatList: {
+    paddingVertical: 16,
+  },
+  nonTopButton: {
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+  },
+  lastButton: {
+    paddingBottom: Platform.OS === 'ios' ? 14 : 12,
+  },
+};
+
 type BaseProps = {
   +navigation: ChatNavigationProp<'ThreadSettings'>,
   +route: NavigationRoute<'ThreadSettings'>,
@@ -1113,23 +1130,6 @@
   };
 }
 
-const unboundStyles = {
-  container: {
-    backgroundColor: 'panelBackground',
-    flex: 1,
-  },
-  flatList: {
-    paddingVertical: 16,
-  },
-  nonTopButton: {
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-  },
-  lastButton: {
-    paddingBottom: Platform.OS === 'ios' ? 14 : 12,
-  },
-};
-
 const threadMembersChangeIsSaving = (
   state: AppState,
   threadMembers: $ReadOnlyArray<
diff --git a/native/chat/thread-settings-button.react.js b/native/chat/thread-settings-button.react.js
--- a/native/chat/thread-settings-button.react.js
+++ b/native/chat/thread-settings-button.react.js
@@ -11,6 +11,13 @@
 import { ThreadSettingsRouteName } from '../navigation/route-names.js';
 import { useStyles } from '../themes/colors.js';
 
+const unboundStyles = {
+  button: {
+    color: 'panelForegroundLabel',
+    paddingHorizontal: 10,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ThreadInfo | MinimallyEncodedThreadInfo,
   +navigate: $PropertyType<ChatNavigationProp<'MessageList'>, 'navigate'>,
@@ -43,13 +50,6 @@
   };
 }
 
-const unboundStyles = {
-  button: {
-    color: 'panelForegroundLabel',
-    paddingHorizontal: 10,
-  },
-};
-
 const ConnectedThreadSettingsButton: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadSettingsButton(
     props: BaseProps,
diff --git a/native/components/link-button.react.js b/native/components/link-button.react.js
--- a/native/components/link-button.react.js
+++ b/native/components/link-button.react.js
@@ -7,6 +7,17 @@
 import { useStyles } from '../themes/colors.js';
 import type { ViewStyle } from '../types/styles.js';
 
+const unboundStyles = {
+  disabled: {
+    color: 'modalBackgroundSecondaryLabel',
+  },
+  text: {
+    color: 'link',
+    fontSize: 17,
+    paddingHorizontal: 10,
+  },
+};
+
 type BaseProps = {
   +text: string,
   +onPress: () => void,
@@ -38,17 +49,6 @@
   }
 }
 
-const unboundStyles = {
-  disabled: {
-    color: 'modalBackgroundSecondaryLabel',
-  },
-  text: {
-    color: 'link',
-    fontSize: 17,
-    paddingHorizontal: 10,
-  },
-};
-
 const ConnectedLinkButton: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedLinkButton(props: BaseProps) {
     const styles = useStyles(unboundStyles);
diff --git a/native/components/thread-list-thread.react.js b/native/components/thread-list-thread.react.js
--- a/native/components/thread-list-thread.react.js
+++ b/native/components/thread-list-thread.react.js
@@ -12,6 +12,21 @@
 import { type Colors, useStyles, useColors } from '../themes/colors.js';
 import type { ViewStyle, TextStyle } from '../types/styles.js';
 
+const unboundStyles = {
+  button: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    paddingLeft: 13,
+  },
+  text: {
+    color: 'modalForegroundLabel',
+    fontSize: 16,
+    paddingLeft: 9,
+    paddingRight: 12,
+    paddingVertical: 6,
+  },
+};
+
 type SharedProps = {
   +onSelect: (threadID: string) => void,
   +style?: ViewStyle,
@@ -52,21 +67,6 @@
   };
 }
 
-const unboundStyles = {
-  button: {
-    alignItems: 'center',
-    flexDirection: 'row',
-    paddingLeft: 13,
-  },
-  text: {
-    color: 'modalForegroundLabel',
-    fontSize: 16,
-    paddingLeft: 9,
-    paddingRight: 12,
-    paddingVertical: 6,
-  },
-};
-
 const ConnectedThreadListThread: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadListThread(props: BaseProps) {
     const { threadInfo, ...rest } = props;
diff --git a/native/components/thread-list.react.js b/native/components/thread-list.react.js
--- a/native/components/thread-list.react.js
+++ b/native/components/thread-list.react.js
@@ -19,6 +19,12 @@
 import type { ViewStyle, TextStyle } from '../types/styles.js';
 import { waitForModalInputFocus } from '../utils/timers.js';
 
+const unboundStyles = {
+  search: {
+    marginBottom: 8,
+  },
+};
+
 type BaseProps = {
   +threadInfos: $ReadOnlyArray<ThreadInfo>,
   +onSelect: (threadID: string) => void,
@@ -137,12 +143,6 @@
   };
 }
 
-const unboundStyles = {
-  search: {
-    marginBottom: 8,
-  },
-};
-
 const ConnectedThreadList: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedThreadList(props: BaseProps) {
     const styles = useStyles(unboundStyles);
diff --git a/native/components/user-list-user.react.js b/native/components/user-list-user.react.js
--- a/native/components/user-list-user.react.js
+++ b/native/components/user-list-user.react.js
@@ -18,6 +18,25 @@
   return Platform.OS === 'ios' ? 31.5 : 33.5;
 };
 
+const unboundStyles = {
+  button: {
+    alignItems: 'center',
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+  },
+  notice: {
+    color: 'modalForegroundSecondaryLabel',
+    fontStyle: 'italic',
+  },
+  text: {
+    color: 'modalForegroundLabel',
+    flex: 1,
+    fontSize: 16,
+    paddingHorizontal: 12,
+    paddingVertical: 6,
+  },
+};
+
 type BaseProps = {
   +userInfo: UserListItem,
   +onSelect: (user: AccountUserInfo) => void,
@@ -69,25 +88,6 @@
   };
 }
 
-const unboundStyles = {
-  button: {
-    alignItems: 'center',
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-  },
-  notice: {
-    color: 'modalForegroundSecondaryLabel',
-    fontStyle: 'italic',
-  },
-  text: {
-    color: 'modalForegroundLabel',
-    flex: 1,
-    fontSize: 16,
-    paddingHorizontal: 12,
-    paddingVertical: 6,
-  },
-};
-
 const ConnectedUserListUser: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedUserListUser(props: BaseProps) {
     const colors = useColors();
diff --git a/native/keyboard/keyboard-input-host.react.js b/native/keyboard/keyboard-input-host.react.js
--- a/native/keyboard/keyboard-input-host.react.js
+++ b/native/keyboard/keyboard-input-host.react.js
@@ -15,6 +15,14 @@
 import { NavContext } from '../navigation/navigation-context.js';
 import { useStyles } from '../themes/colors.js';
 
+const unboundStyles = {
+  // This is a special style needed by 'react-native-keyboard-input':
+  // https://github.com/wix/react-native-keyboard-input/blob/acb3a58e96988026f449b48e8b49f49164684d9f/src/KeyboardAccessoryView.js#L115
+  kbInitialProps: {
+    backgroundColor: 'listBackground',
+  },
+};
+
 type BaseProps = {
   +textInputRef?: ?React.ElementRef<typeof TextInput>,
 };
@@ -92,14 +100,6 @@
   };
 }
 
-const unboundStyles = {
-  // This is a special style needed by 'react-native-keyboard-input':
-  // https://github.com/wix/react-native-keyboard-input/blob/acb3a58e96988026f449b48e8b49f49164684d9f/src/KeyboardAccessoryView.js#L115
-  kbInitialProps: {
-    backgroundColor: 'listBackground',
-  },
-};
-
 const ConnectedKeyboardInputHost: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedKeyboardInputHost(props: BaseProps) {
     const inputState = React.useContext(InputStateContext);
diff --git a/native/media/media-gallery-keyboard.react.js b/native/media/media-gallery-keyboard.react.js
--- a/native/media/media-gallery-keyboard.react.js
+++ b/native/media/media-gallery-keyboard.react.js
@@ -45,6 +45,63 @@
   useNativeDriver: true,
 };
 
+const unboundStyles = {
+  container: {
+    backgroundColor: 'listBackground',
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    top: 0,
+  },
+  galleryHeader: {
+    height: 56,
+    borderTopWidth: 1,
+    borderColor: 'modalForegroundBorder',
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    paddingHorizontal: 16,
+  },
+  galleryHeaderTitle: {
+    color: 'modalForegroundLabel',
+    fontSize: 14,
+    fontWeight: '500',
+  },
+  nativePickerButton: {
+    backgroundColor: 'rgba(255, 255, 255, 0.08)',
+    borderRadius: 8,
+    paddingHorizontal: 12,
+    paddingVertical: 7,
+  },
+  nativePickerButtonLabel: {
+    color: 'modalButtonLabel',
+    fontSize: 12,
+    fontWeight: '500',
+  },
+  galleryContainer: {
+    flex: 1,
+    alignItems: 'center',
+    flexDirection: 'row',
+  },
+  error: {
+    color: 'listBackgroundLabel',
+    flex: 1,
+    fontSize: 28,
+    textAlign: 'center',
+  },
+  loadingIndicator: {
+    flex: 1,
+  },
+  sendButtonContainer: {
+    bottom: 20,
+    position: 'absolute',
+    right: 30,
+  },
+  separator: {
+    width: 2,
+  },
+};
+
 type BaseProps = {
   +threadInfo: ?ThreadInfo | ?MinimallyEncodedThreadInfo,
 };
@@ -596,63 +653,6 @@
 
 const mediaGalleryKeyboardName = 'MediaGalleryKeyboard';
 
-const unboundStyles = {
-  container: {
-    backgroundColor: 'listBackground',
-    position: 'absolute',
-    left: 0,
-    right: 0,
-    top: 0,
-  },
-  galleryHeader: {
-    height: 56,
-    borderTopWidth: 1,
-    borderColor: 'modalForegroundBorder',
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    paddingHorizontal: 16,
-  },
-  galleryHeaderTitle: {
-    color: 'modalForegroundLabel',
-    fontSize: 14,
-    fontWeight: '500',
-  },
-  nativePickerButton: {
-    backgroundColor: 'rgba(255, 255, 255, 0.08)',
-    borderRadius: 8,
-    paddingHorizontal: 12,
-    paddingVertical: 7,
-  },
-  nativePickerButtonLabel: {
-    color: 'modalButtonLabel',
-    fontSize: 12,
-    fontWeight: '500',
-  },
-  galleryContainer: {
-    flex: 1,
-    alignItems: 'center',
-    flexDirection: 'row',
-  },
-  error: {
-    color: 'listBackgroundLabel',
-    flex: 1,
-    fontSize: 28,
-    textAlign: 'center',
-  },
-  loadingIndicator: {
-    flex: 1,
-  },
-  sendButtonContainer: {
-    bottom: 20,
-    position: 'absolute',
-    right: 30,
-  },
-  separator: {
-    width: 2,
-  },
-};
-
 function ConnectedMediaGalleryKeyboard(props: BaseProps) {
   const dimensions = useSelector(state => state.dimensions);
   const foreground = useIsAppForegrounded();
diff --git a/native/profile/appearance-preferences.react.js b/native/profile/appearance-preferences.react.js
--- a/native/profile/appearance-preferences.react.js
+++ b/native/profile/appearance-preferences.react.js
@@ -27,6 +27,48 @@
   />
 );
 
+const unboundStyles = {
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+  hr: {
+    backgroundColor: 'panelForegroundBorder',
+    height: 1,
+    marginHorizontal: 15,
+  },
+  icon: {
+    lineHeight: Platform.OS === 'ios' ? 18 : 20,
+  },
+  option: {
+    color: 'panelForegroundLabel',
+    fontSize: 16,
+  },
+  row: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+  },
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  section: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+    paddingVertical: 2,
+  },
+};
+
 type OptionText = {
   themePreference: GlobalThemePreference,
   text: string,
@@ -93,48 +135,6 @@
   }
 }
 
-const unboundStyles = {
-  header: {
-    color: 'panelBackgroundLabel',
-    fontSize: 12,
-    fontWeight: '400',
-    paddingBottom: 3,
-    paddingHorizontal: 24,
-  },
-  hr: {
-    backgroundColor: 'panelForegroundBorder',
-    height: 1,
-    marginHorizontal: 15,
-  },
-  icon: {
-    lineHeight: Platform.OS === 'ios' ? 18 : 20,
-  },
-  option: {
-    color: 'panelForegroundLabel',
-    fontSize: 16,
-  },
-  row: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    paddingHorizontal: 24,
-    paddingVertical: 10,
-  },
-  scrollView: {
-    backgroundColor: 'panelBackground',
-  },
-  scrollViewContentContainer: {
-    paddingTop: 24,
-  },
-  section: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    marginBottom: 24,
-    paddingVertical: 2,
-  },
-};
-
 type BaseProps = {
   +navigation: ProfileNavigationProp<'AppearancePreferences'>,
   +route: NavigationRoute<'AppearancePreferences'>,
diff --git a/native/profile/custom-server-modal.react.js b/native/profile/custom-server-modal.react.js
--- a/native/profile/custom-server-modal.react.js
+++ b/native/profile/custom-server-modal.react.js
@@ -23,6 +23,37 @@
   +presentedFrom: string,
 };
 
+const unboundStyles = {
+  button: {
+    backgroundColor: 'vibrantGreenButton',
+    borderRadius: 5,
+    marginHorizontal: 2,
+    marginVertical: 2,
+    paddingHorizontal: 12,
+    paddingVertical: 4,
+  },
+  buttonText: {
+    color: 'white',
+    fontSize: 18,
+    textAlign: 'center',
+  },
+  container: {
+    justifyContent: 'flex-end',
+  },
+  modal: {
+    flex: 0,
+    flexDirection: 'row',
+  },
+  textInput: {
+    color: 'modalBackgroundLabel',
+    flex: 1,
+    fontSize: 16,
+    margin: 0,
+    padding: 0,
+    borderBottomColor: 'transparent',
+  },
+};
+
 type BaseProps = {
   +navigation: RootNavigationProp<'CustomServerModal'>,
   +route: NavigationRoute<'CustomServerModal'>,
@@ -87,37 +118,6 @@
   };
 }
 
-const unboundStyles = {
-  button: {
-    backgroundColor: 'vibrantGreenButton',
-    borderRadius: 5,
-    marginHorizontal: 2,
-    marginVertical: 2,
-    paddingHorizontal: 12,
-    paddingVertical: 4,
-  },
-  buttonText: {
-    color: 'white',
-    fontSize: 18,
-    textAlign: 'center',
-  },
-  container: {
-    justifyContent: 'flex-end',
-  },
-  modal: {
-    flex: 0,
-    flexDirection: 'row',
-  },
-  textInput: {
-    color: 'modalBackgroundLabel',
-    flex: 1,
-    fontSize: 16,
-    margin: 0,
-    padding: 0,
-    borderBottomColor: 'transparent',
-  },
-};
-
 const ConnectedCustomServerModal: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedCustomServerModal(props: BaseProps) {
     const urlPrefix = useSelector(urlPrefixSelector(ashoatKeyserverID));
diff --git a/native/profile/default-notifications-preferences.react.js b/native/profile/default-notifications-preferences.react.js
--- a/native/profile/default-notifications-preferences.react.js
+++ b/native/profile/default-notifications-preferences.react.js
@@ -55,6 +55,33 @@
   );
 }
 
+const unboundStyles = {
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  section: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+    marginVertical: 2,
+  },
+  icon: {
+    lineHeight: Platform.OS === 'ios' ? 18 : 20,
+  },
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+};
+
 type BaseProps = {
   +navigation: ProfileNavigationProp<'DefaultNotifications'>,
   +route: NavigationRoute<'DefaultNotifications'>,
@@ -150,33 +177,6 @@
   }
 }
 
-const unboundStyles = {
-  scrollView: {
-    backgroundColor: 'panelBackground',
-  },
-  scrollViewContentContainer: {
-    paddingTop: 24,
-  },
-  section: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    marginBottom: 24,
-    marginVertical: 2,
-  },
-  icon: {
-    lineHeight: Platform.OS === 'ios' ? 18 : 20,
-  },
-  header: {
-    color: 'panelBackgroundLabel',
-    fontSize: 12,
-    fontWeight: '400',
-    paddingBottom: 3,
-    paddingHorizontal: 24,
-  },
-};
-
 registerFetchKey(setUserSettingsActionTypes);
 const ConnectedDefaultNotificationPreferences: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedDefaultNotificationPreferences(
diff --git a/native/profile/dev-tools.react.js b/native/profile/dev-tools.react.js
--- a/native/profile/dev-tools.react.js
+++ b/native/profile/dev-tools.react.js
@@ -32,6 +32,63 @@
   />
 );
 
+const unboundStyles = {
+  container: {
+    flex: 1,
+  },
+  customServerLabel: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+  },
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+  hr: {
+    backgroundColor: 'panelForegroundBorder',
+    height: 1,
+    marginHorizontal: 15,
+  },
+  icon: {
+    lineHeight: Platform.OS === 'ios' ? 18 : 20,
+  },
+  redText: {
+    color: 'redText',
+    flex: 1,
+    fontSize: 16,
+  },
+  row: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+  },
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  serverContainer: {
+    flex: 1,
+  },
+  serverText: {
+    color: 'panelForegroundLabel',
+    fontSize: 16,
+  },
+  slightlyPaddedSection: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+    paddingVertical: 2,
+  },
+};
+
 type BaseProps = {
   +navigation: ProfileNavigationProp<'DevTools'>,
   +route: NavigationRoute<'DevTools'>,
@@ -178,63 +235,6 @@
   };
 }
 
-const unboundStyles = {
-  container: {
-    flex: 1,
-  },
-  customServerLabel: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-  },
-  header: {
-    color: 'panelBackgroundLabel',
-    fontSize: 12,
-    fontWeight: '400',
-    paddingBottom: 3,
-    paddingHorizontal: 24,
-  },
-  hr: {
-    backgroundColor: 'panelForegroundBorder',
-    height: 1,
-    marginHorizontal: 15,
-  },
-  icon: {
-    lineHeight: Platform.OS === 'ios' ? 18 : 20,
-  },
-  redText: {
-    color: 'redText',
-    flex: 1,
-    fontSize: 16,
-  },
-  row: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    paddingHorizontal: 24,
-    paddingVertical: 10,
-  },
-  scrollView: {
-    backgroundColor: 'panelBackground',
-  },
-  scrollViewContentContainer: {
-    paddingTop: 24,
-  },
-  serverContainer: {
-    flex: 1,
-  },
-  serverText: {
-    color: 'panelForegroundLabel',
-    fontSize: 16,
-  },
-  slightlyPaddedSection: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    marginBottom: 24,
-    paddingVertical: 2,
-  },
-};
-
 const ConnectedDevTools: React.ComponentType<BaseProps> = React.memo<BaseProps>(
   function ConnectedDevTools(props: BaseProps) {
     const urlPrefix = useSelector(urlPrefixSelector(ashoatKeyserverID));
diff --git a/native/profile/edit-password.react.js b/native/profile/edit-password.react.js
--- a/native/profile/edit-password.react.js
+++ b/native/profile/edit-password.react.js
@@ -33,6 +33,62 @@
 import { type Colors, useColors, useStyles } from '../themes/colors.js';
 import Alert from '../utils/alert.js';
 
+const unboundStyles = {
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+  hr: {
+    backgroundColor: 'panelForegroundBorder',
+    height: 1,
+    marginHorizontal: 15,
+  },
+  input: {
+    color: 'panelForegroundLabel',
+    flex: 1,
+    fontFamily: 'Arial',
+    fontSize: 16,
+    paddingVertical: 0,
+    borderBottomColor: 'transparent',
+  },
+  row: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingHorizontal: 24,
+    paddingVertical: 9,
+  },
+  saveButton: {
+    backgroundColor: 'vibrantGreenButton',
+    borderRadius: 5,
+    flex: 1,
+    marginHorizontal: 24,
+    marginVertical: 12,
+    padding: 12,
+  },
+  saveText: {
+    color: 'white',
+    fontSize: 18,
+    textAlign: 'center',
+  },
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  section: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+    paddingVertical: 3,
+  },
+};
+
 type BaseProps = {
   +navigation: ProfileNavigationProp<'EditPassword'>,
   +route: NavigationRoute<'EditPassword'>,
@@ -280,62 +336,6 @@
   };
 }
 
-const unboundStyles = {
-  header: {
-    color: 'panelBackgroundLabel',
-    fontSize: 12,
-    fontWeight: '400',
-    paddingBottom: 3,
-    paddingHorizontal: 24,
-  },
-  hr: {
-    backgroundColor: 'panelForegroundBorder',
-    height: 1,
-    marginHorizontal: 15,
-  },
-  input: {
-    color: 'panelForegroundLabel',
-    flex: 1,
-    fontFamily: 'Arial',
-    fontSize: 16,
-    paddingVertical: 0,
-    borderBottomColor: 'transparent',
-  },
-  row: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    paddingHorizontal: 24,
-    paddingVertical: 9,
-  },
-  saveButton: {
-    backgroundColor: 'vibrantGreenButton',
-    borderRadius: 5,
-    flex: 1,
-    marginHorizontal: 24,
-    marginVertical: 12,
-    padding: 12,
-  },
-  saveText: {
-    color: 'white',
-    fontSize: 18,
-    textAlign: 'center',
-  },
-  scrollView: {
-    backgroundColor: 'panelBackground',
-  },
-  scrollViewContentContainer: {
-    paddingTop: 24,
-  },
-  section: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    marginBottom: 24,
-    paddingVertical: 3,
-  },
-};
-
 const loadingStatusSelector = createLoadingStatusSelector(
   changeUserPasswordActionTypes,
 );
diff --git a/native/profile/profile-screen.react.js b/native/profile/profile-screen.react.js
--- a/native/profile/profile-screen.react.js
+++ b/native/profile/profile-screen.react.js
@@ -60,6 +60,89 @@
   );
 }
 
+const unboundStyles = {
+  avatarSection: {
+    alignItems: 'center',
+    paddingVertical: 16,
+  },
+  container: {
+    flex: 1,
+  },
+  content: {
+    flex: 1,
+  },
+  deleteAccountButton: {
+    paddingHorizontal: 24,
+    paddingVertical: 12,
+  },
+  editPasswordButton: {
+    paddingTop: Platform.OS === 'android' ? 3 : 2,
+  },
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+  label: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+    paddingRight: 12,
+  },
+  loggedInLabel: {
+    color: 'panelForegroundTertiaryLabel',
+    fontSize: 16,
+  },
+  logOutText: {
+    color: 'link',
+    fontSize: 16,
+    paddingLeft: 6,
+  },
+  row: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+  },
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  paddedRow: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+  },
+  section: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+    paddingVertical: 1,
+  },
+  unpaddedSection: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+  },
+  username: {
+    color: 'panelForegroundLabel',
+    flex: 1,
+  },
+  value: {
+    color: 'panelForegroundLabel',
+    fontSize: 16,
+    textAlign: 'right',
+  },
+};
+
 type BaseProps = {
   +navigation: ProfileNavigationProp<'ProfileScreen'>,
   +route: NavigationRoute<'ProfileScreen'>,
@@ -344,89 +427,6 @@
   };
 }
 
-const unboundStyles = {
-  avatarSection: {
-    alignItems: 'center',
-    paddingVertical: 16,
-  },
-  container: {
-    flex: 1,
-  },
-  content: {
-    flex: 1,
-  },
-  deleteAccountButton: {
-    paddingHorizontal: 24,
-    paddingVertical: 12,
-  },
-  editPasswordButton: {
-    paddingTop: Platform.OS === 'android' ? 3 : 2,
-  },
-  header: {
-    color: 'panelBackgroundLabel',
-    fontSize: 12,
-    fontWeight: '400',
-    paddingBottom: 3,
-    paddingHorizontal: 24,
-  },
-  label: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-    paddingRight: 12,
-  },
-  loggedInLabel: {
-    color: 'panelForegroundTertiaryLabel',
-    fontSize: 16,
-  },
-  logOutText: {
-    color: 'link',
-    fontSize: 16,
-    paddingLeft: 6,
-  },
-  row: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-  },
-  scrollView: {
-    backgroundColor: 'panelBackground',
-  },
-  scrollViewContentContainer: {
-    paddingTop: 24,
-  },
-  paddedRow: {
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    paddingHorizontal: 24,
-    paddingVertical: 10,
-  },
-  section: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    marginBottom: 24,
-    paddingVertical: 1,
-  },
-  unpaddedSection: {
-    backgroundColor: 'panelForeground',
-    borderBottomWidth: 1,
-    borderColor: 'panelForegroundBorder',
-    borderTopWidth: 1,
-    marginBottom: 24,
-  },
-  username: {
-    color: 'panelForegroundLabel',
-    flex: 1,
-  },
-  value: {
-    color: 'panelForegroundLabel',
-    fontSize: 16,
-    textAlign: 'right',
-  },
-};
-
 const logOutLoadingStatusSelector =
   createLoadingStatusSelector(logOutActionTypes);
 
diff --git a/native/profile/relationship-list-item.react.js b/native/profile/relationship-list-item.react.js
--- a/native/profile/relationship-list-item.react.js
+++ b/native/profile/relationship-list-item.react.js
@@ -51,6 +51,46 @@
 import { useNavigateToUserProfileBottomSheet } from '../user-profile/user-profile-utils.js';
 import Alert from '../utils/alert.js';
 
+const unboundStyles = {
+  container: {
+    flex: 1,
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+    backgroundColor: 'panelForeground',
+    borderColor: 'panelForegroundBorder',
+  },
+  borderBottom: {
+    borderBottomWidth: 1,
+  },
+  buttonContainer: {
+    flexDirection: 'row',
+  },
+  editButtonWithMargin: {
+    marginLeft: 15,
+  },
+  username: {
+    color: 'panelForegroundSecondaryLabel',
+    flex: 1,
+    fontSize: 16,
+    lineHeight: 20,
+    marginLeft: 8,
+  },
+  editButton: {
+    paddingLeft: 10,
+  },
+  blueAction: {
+    color: 'link',
+    fontSize: 16,
+    paddingLeft: 6,
+  },
+  redAction: {
+    color: 'redText',
+    fontSize: 16,
+    paddingLeft: 6,
+  },
+};
+
 type BaseProps = {
   +userInfo: AccountUserInfo,
   +lastListItem: boolean,
@@ -275,46 +315,6 @@
   }
 }
 
-const unboundStyles = {
-  container: {
-    flex: 1,
-    flexDirection: 'row',
-    paddingHorizontal: 24,
-    paddingVertical: 10,
-    backgroundColor: 'panelForeground',
-    borderColor: 'panelForegroundBorder',
-  },
-  borderBottom: {
-    borderBottomWidth: 1,
-  },
-  buttonContainer: {
-    flexDirection: 'row',
-  },
-  editButtonWithMargin: {
-    marginLeft: 15,
-  },
-  username: {
-    color: 'panelForegroundSecondaryLabel',
-    flex: 1,
-    fontSize: 16,
-    lineHeight: 20,
-    marginLeft: 8,
-  },
-  editButton: {
-    paddingLeft: 10,
-  },
-  blueAction: {
-    color: 'link',
-    fontSize: 16,
-    paddingLeft: 6,
-  },
-  redAction: {
-    color: 'redText',
-    fontSize: 16,
-    paddingLeft: 6,
-  },
-};
-
 const ConnectedRelationshipListItem: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedRelationshipListItem(
     props: BaseProps,
diff --git a/native/tooltip/tooltip.react.js b/native/tooltip/tooltip.react.js
--- a/native/tooltip/tooltip.react.js
+++ b/native/tooltip/tooltip.react.js
@@ -42,6 +42,74 @@
 const { Value, Node, Extrapolate, add, multiply, interpolateNode } = Animated;
 /* eslint-enable import/no-named-as-default-member */
 
+const unboundStyles = {
+  backdrop: {
+    backgroundColor: 'black',
+    bottom: 0,
+    left: 0,
+    position: 'absolute',
+    right: 0,
+    top: 0,
+  },
+  container: {
+    flex: 1,
+  },
+  contentContainer: {
+    flex: 1,
+    overflow: 'hidden',
+  },
+  icon: {
+    color: 'modalForegroundLabel',
+  },
+  itemContainer: {
+    alignItems: 'center',
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'center',
+    padding: 10,
+  },
+  itemContainerFixed: {
+    flexDirection: 'column',
+  },
+  items: {
+    backgroundColor: 'tooltipBackground',
+    borderRadius: 5,
+    overflow: 'hidden',
+  },
+  itemsFixed: {
+    flex: 1,
+    flexDirection: 'row',
+  },
+  triangleDown: {
+    borderBottomColor: 'transparent',
+    borderBottomWidth: 0,
+    borderLeftColor: 'transparent',
+    borderLeftWidth: 10,
+    borderRightColor: 'transparent',
+    borderRightWidth: 10,
+    borderStyle: 'solid',
+    borderTopColor: 'tooltipBackground',
+    borderTopWidth: 10,
+    height: 10,
+    top: Platform.OS === 'android' ? -1 : 0,
+    width: 10,
+  },
+  triangleUp: {
+    borderBottomColor: 'tooltipBackground',
+    borderBottomWidth: 10,
+    borderLeftColor: 'transparent',
+    borderLeftWidth: 10,
+    borderRightColor: 'transparent',
+    borderRightWidth: 10,
+    borderStyle: 'solid',
+    borderTopColor: 'transparent',
+    borderTopWidth: 0,
+    bottom: Platform.OS === 'android' ? -1 : 0,
+    height: 10,
+    width: 10,
+  },
+};
+
 export type TooltipParams<CustomProps> = {
   ...CustomProps,
   +presentedFrom: string,
@@ -514,74 +582,6 @@
   return React.memo<BaseTooltipPropsType>(MemoizedTooltip);
 }
 
-const unboundStyles = {
-  backdrop: {
-    backgroundColor: 'black',
-    bottom: 0,
-    left: 0,
-    position: 'absolute',
-    right: 0,
-    top: 0,
-  },
-  container: {
-    flex: 1,
-  },
-  contentContainer: {
-    flex: 1,
-    overflow: 'hidden',
-  },
-  icon: {
-    color: 'modalForegroundLabel',
-  },
-  itemContainer: {
-    alignItems: 'center',
-    flex: 1,
-    flexDirection: 'row',
-    justifyContent: 'center',
-    padding: 10,
-  },
-  itemContainerFixed: {
-    flexDirection: 'column',
-  },
-  items: {
-    backgroundColor: 'tooltipBackground',
-    borderRadius: 5,
-    overflow: 'hidden',
-  },
-  itemsFixed: {
-    flex: 1,
-    flexDirection: 'row',
-  },
-  triangleDown: {
-    borderBottomColor: 'transparent',
-    borderBottomWidth: 0,
-    borderLeftColor: 'transparent',
-    borderLeftWidth: 10,
-    borderRightColor: 'transparent',
-    borderRightWidth: 10,
-    borderStyle: 'solid',
-    borderTopColor: 'tooltipBackground',
-    borderTopWidth: 10,
-    height: 10,
-    top: Platform.OS === 'android' ? -1 : 0,
-    width: 10,
-  },
-  triangleUp: {
-    borderBottomColor: 'tooltipBackground',
-    borderBottomWidth: 10,
-    borderLeftColor: 'transparent',
-    borderLeftWidth: 10,
-    borderRightColor: 'transparent',
-    borderRightWidth: 10,
-    borderStyle: 'solid',
-    borderTopColor: 'transparent',
-    borderTopWidth: 0,
-    bottom: Platform.OS === 'android' ? -1 : 0,
-    height: 10,
-    width: 10,
-  },
-};
-
 function tooltipHeight(numEntries: number): number {
   // 10 (triangle) + 37 * numEntries (entries) + numEntries - 1 (padding)
   return 9 + 38 * numEntries;