diff --git a/native/account/registration/cool-or-nerd-mode-selection.react.js b/native/account/registration/cool-or-nerd-mode-selection.react.js
new file mode 100644
--- /dev/null
+++ b/native/account/registration/cool-or-nerd-mode-selection.react.js
@@ -0,0 +1,125 @@
+// @flow
+
+import invariant from 'invariant';
+import * as React from 'react';
+import { Text, View } from 'react-native';
+
+import RegistrationButton from './registration-button.react.js';
+import RegistrationContainer from './registration-container.react.js';
+import type { RegistrationNavigationProp } from './registration-navigator.react.js';
+import {
+  RegistrationTile,
+  RegistrationTileHeader,
+} from './registration-tile.react.js';
+import type { CoolOrNerdMode } from './registration-types.js';
+import {
+  type NavigationRoute,
+  KeyserverSelectionRouteName,
+} from '../../navigation/route-names.js';
+import { useStyles } from '../../themes/colors.js';
+
+type Props = {
+  +navigation: RegistrationNavigationProp<'CoolOrNerdModeSelection'>,
+  +route: NavigationRoute<'CoolOrNerdModeSelection'>,
+};
+function CoolOrNerdModeSelection(props: Props): React.Node {
+  const [currentSelection, setCurrentSelection] =
+    React.useState<?CoolOrNerdMode>();
+  const selectCool = React.useCallback(() => {
+    setCurrentSelection('cool');
+  }, []);
+  const selectNerd = React.useCallback(() => {
+    setCurrentSelection('nerd');
+  }, []);
+
+  const { navigate } = props.navigation;
+  const onSubmit = React.useCallback(() => {
+    invariant(
+      currentSelection,
+      'Button should be disabled if currentSelection is not set',
+    );
+    navigate<'KeyserverSelection'>({
+      name: KeyserverSelectionRouteName,
+      params: { userSelections: { coolOrNerdMode: currentSelection } },
+    });
+  }, [navigate, currentSelection]);
+
+  const buttonState = currentSelection ? 'enabled' : 'disabled';
+  const styles = useStyles(unboundStyles);
+  return (
+    <View style={styles.container}>
+      <RegistrationContainer>
+        <Text style={styles.header}>To begin, choose your fighter</Text>
+        <Text style={styles.body}>
+          Do you want Comm to choose reasonable defaults for you, or do you want
+          to see all the options and make the decisions yourself?
+        </Text>
+        <Text style={styles.body}>
+          This setting will affect behavior throughout the app, but you can
+          change it later in your settings.
+        </Text>
+        <RegistrationTile
+          selected={currentSelection === 'nerd'}
+          onSelect={selectNerd}
+        >
+          <RegistrationTileHeader>
+            <Text style={styles.emojiIcon}>🤓</Text>
+            <Text style={styles.tileTitleText}>Nerd mode</Text>
+          </RegistrationTileHeader>
+          <Text style={styles.tileBody}>
+            We present more options and talk through their security and privacy
+            implications in detail.
+          </Text>
+        </RegistrationTile>
+        <RegistrationTile
+          selected={currentSelection === 'cool'}
+          onSelect={selectCool}
+        >
+          <RegistrationTileHeader>
+            <Text style={styles.emojiIcon}>😎</Text>
+            <Text style={styles.tileTitleText}>Cool mode</Text>
+          </RegistrationTileHeader>
+          <Text style={styles.tileBody}>
+            We select reasonable defaults for you.
+          </Text>
+        </RegistrationTile>
+      </RegistrationContainer>
+      <RegistrationButton onPress={onSubmit} label="Next" state={buttonState} />
+    </View>
+  );
+}
+
+const unboundStyles = {
+  container: {
+    backgroundColor: 'panelBackground',
+    justifyContent: 'space-between',
+    flex: 1,
+  },
+  header: {
+    fontSize: 24,
+    color: 'panelForegroundLabel',
+    paddingBottom: 16,
+  },
+  body: {
+    fontSize: 15,
+    lineHeight: 20,
+    color: 'panelForegroundSecondaryLabel',
+    paddingBottom: 16,
+  },
+  tileTitleText: {
+    flex: 1,
+    fontSize: 18,
+    color: 'panelForegroundLabel',
+  },
+  tileBody: {
+    fontSize: 13,
+    color: 'panelForegroundSecondaryLabel',
+  },
+  emojiIcon: {
+    fontSize: 32,
+    bottom: 1,
+    marginRight: 5,
+  },
+};
+
+export default CoolOrNerdModeSelection;
diff --git a/native/account/registration/keyserver-selection.react.js b/native/account/registration/keyserver-selection.react.js
--- a/native/account/registration/keyserver-selection.react.js
+++ b/native/account/registration/keyserver-selection.react.js
@@ -10,12 +10,19 @@
   RegistrationTile,
   RegistrationTileHeader,
 } from './registration-tile.react.js';
+import type { CoolOrNerdMode } from './registration-types.js';
 import CommIcon from '../../components/comm-icon.react.js';
 import type { NavigationRoute } from '../../navigation/route-names.js';
 import { useStyles, useColors } from '../../themes/colors.js';
 
 type Selection = 'ashoat' | 'custom';
 
+export type KeyserverSelectionParams = {
+  +userSelections: {
+    +coolOrNerdMode: CoolOrNerdMode,
+  },
+};
+
 type Props = {
   +navigation: RegistrationNavigationProp<'KeyserverSelection'>,
   +route: NavigationRoute<'KeyserverSelection'>,
diff --git a/native/account/registration/registration-navigator.react.js b/native/account/registration/registration-navigator.react.js
--- a/native/account/registration/registration-navigator.react.js
+++ b/native/account/registration/registration-navigator.react.js
@@ -8,10 +8,12 @@
 import * as React from 'react';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
+import CoolOrNerdModeSelection from './cool-or-nerd-mode-selection.react.js';
 import KeyserverSelection from './keyserver-selection.react.js';
 import type { RootNavigationProp } from '../../navigation/root-navigator.react.js';
 import {
   KeyserverSelectionRouteName,
+  CoolOrNerdModeSelectionRouteName,
   type ScreenParamList,
   type RegistrationParamList,
 } from '../../navigation/route-names.js';
@@ -49,6 +51,10 @@
   return (
     <SafeAreaView style={styles.container} edges={safeAreaEdges}>
       <Registration.Navigator screenOptions={screenOptions}>
+        <Registration.Screen
+          name={CoolOrNerdModeSelectionRouteName}
+          component={CoolOrNerdModeSelection}
+        />
         <Registration.Screen
           name={KeyserverSelectionRouteName}
           component={KeyserverSelection}
diff --git a/native/account/registration/registration-types.js b/native/account/registration/registration-types.js
new file mode 100644
--- /dev/null
+++ b/native/account/registration/registration-types.js
@@ -0,0 +1,3 @@
+// @flow
+
+export type CoolOrNerdMode = 'cool' | 'nerd';
diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js
--- a/native/navigation/route-names.js
+++ b/native/navigation/route-names.js
@@ -4,6 +4,7 @@
 
 import type { ActionResultModalParams } from './action-result-modal.react.js';
 import type { InviteLinkModalParams } from './invite-link-modal.react';
+import type { KeyserverSelectionParams } from '../account/registration/keyserver-selection.react.js';
 import type { TermsAndPrivacyModalParams } from '../account/terms-and-privacy-modal.react.js';
 import type { ThreadPickerModalParams } from '../calendar/thread-picker-modal.react.js';
 import type { ComposeSubchannelParams } from '../chat/compose-subchannel.react.js';
@@ -87,6 +88,7 @@
 export const TermsAndPrivacyRouteName = 'TermsAndPrivacyModal';
 export const RegistrationRouteName = 'Registration';
 export const KeyserverSelectionRouteName = 'KeyserverSelection';
+export const CoolOrNerdModeSelectionRouteName = 'CoolOrNerdModeSelection';
 
 export type RootParamList = {
   +LoggedOutModal: void,
@@ -167,7 +169,10 @@
 
 export type CommunityDrawerParamList = { +TabNavigator: void };
 
-export type RegistrationParamList = { +KeyserverSelection: void };
+export type RegistrationParamList = {
+  +CoolOrNerdModeSelection: void,
+  +KeyserverSelection: KeyserverSelectionParams,
+};
 
 export type ScreenParamList = {
   ...RootParamList,